<div class="row">
    <div class="container">

        <ol class="breadcrumb">
            <li><a href="#">استيراد السيارات</a></li>
            <li class="active">مرفقات الشحن </li>
        </ol>


        <div class="panel panel-default panel-m">
            <div class="panel-heading">
                <h3 class="panel-title">مرفقات الشحن</h3>
            </div>
            <div class="panel-body">


                {literal}
                <form class="form-horizontal" action="shippingFilesController.php" method="post"
                    enctype="multipart/form-data">
                    {/literal}
                    <div class="form-group">
                        <label class="col-lg-2 control-label">الشاسيه </label>
                        <div class="col-lg-4">
                            <select name="chasis" id="chasis" data-placeholder="اختر " class="select2">
                                <option>اختر الشاسيه</option>
                                {foreach $allChasis as $single}
                                <option value="{$single.chasisno}">{$single.chasisno}</option>
                                {/foreach}
                            </select>
                        </div>
                    </div>
                    <hr />
                    <div id="filesDiv">

                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

{literal}
<script>
    $(document).ready(function () {
        $('#chasis').on('change',function () {
            var chasis = $(this).val();
            if (chasis) {
                $.ajax({
                    url: 'shippingFilesController.php?do=getFiles',
                    type: 'POST',
                    data: { chasis: chasis },
                    success: function (response) {
                        $('#filesDiv').html(response);
                    }
                });
            } else {
                $('#filesDiv').html('');
            }
        });

        $('body').on('change', '.updateNotes', function () {
            var fileid = $('#fileid').val();
            var note = $(this).attr('id');
            var value = $(this).val();
            $.ajax({
                url: 'shippingFilesController.php?do=updateFilesData',
                type: 'POST',
                data: { fileid: fileid, col: note, value: value,type: 'note' },
                success: function (response) {
                    if (response != -1) {
                        alert('تم تحديث الملاحظات بنجاح');
                    } else {
                        alert('حدث خطأ أثناء تحديث الملاحظات');
                    }
                }
            });
        });
        $('body').on('change', '.updateFiles', function () {
            var fileid = $('#fileid').val();
            var file = $(this).attr('id');

            var filevalue = this.files[0]; // Get the selected file
            var formData = new FormData(); // Create a FormData object
            formData.append('uploadedFile', filevalue);
            formData.append('col', file);
            formData.append('fileid', fileid);
            formData.append('type', file);

            $.ajax({
                url: 'shippingFilesController.php?do=updateFilesData',
                type: 'POST',
                data: formData,
                contentType: false, // Important: Don't set content type
                processData: false, // Important: Don't process the data 
                success: function (response) {
                    if (response != -1) {
                        alert('تم تحديث الملف بنجاح');
                        $('#' + file).parent().parent().css('background-color', ''); // Change background color to indicate success
                        response = JSON.parse(response);
                        $('#' + file).next().remove(); // Clear the file input
                        $('#' + file).after('<a href="'+response[0]+'" target="_blank" class="btn btn-success">عرض</a>');
                        $('#' + file.slice(0, -4) + 'Date').text(response[1]);
                        $('#' + file.slice(0, -4) + 'User').text(response[2]);
                    } else {
                        alert('حدث خطأ أثناء تحديث الملف');
                    }
                }
            });
        });
    });
</script>
{/literal}