<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">
                    <div class="form-group">
                        <label class="col-lg-2 control-label">الشاسيه </label>
                        <div class="col-lg-4">
                            {$file.chasis}
                        </div>
                    </div>
                    <table class="table table-bordered table-black">
                        <thead>
                            <tr>
                                <th>#</th>
                                <th>الملف</th>
                                <th>عرض</th>
                                <th>ملاحظات</th>
                                <th>تاريح الرفع</th>
                                <th>مستخدم الرفع</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr {if !$file.buybillfile} style="background-color: #f8b8b8;"{/if}>
                                <td>1</td>
                                <td>supplier contract</td>
                                <td>
                                    {if $file.buybillfile}
                                    <a href="{$hosturl}/upload/shippingFiles/{$file.buybillfile}" target="_blank" class="btn btn-success">عرض</a>
                                    {/if}
                                </td>
                                <td>{$file.buybillnotes}</td>
                                <td><span id="buybillDate">{$file.buybilldate}</span></td>
                                <td><span id="buybillUser">{$file.buybillusername}</span></td>
                            </tr>
                            <tr {if !$file.performafile} style="background-color: #f8b8b8;"{/if}>
                                <td>2</td>
                                <td>performa invoice</td>
                                <td>
                                    {if $file.performafile}<a href="{$hosturl}/upload/shippingFiles/{$file.performafile}" target="_blank" class="btn btn-success">عرض</a>{/if}
                                </td>
                                <td>{$file.performanotes}</td>
                                <td><span id="performaDate">{$file.performadate}</span></td>
                                <td><span id="performaUser">{$file.performausername}</span></td>
                            </tr>
                            <tr {if !$file.cocfile} style="background-color: #f8b8b8;"{/if}>
                                <td>3</td>
                                <td>COC</td>
                                <td>
                                    {if $file.cocfile}<a href="{$hosturl}/upload/shippingFiles/{$file.cocfile}" target="_blank" class="btn btn-success">عرض</a>{/if}
                                </td>
                                <td>{$file.cocnotes}</td>
                                <td><span id="cocDate">{$file.cocdate}</span></td>
                                <td><span id="cocUser">{$file.cocusername}</span></td>
                            </tr>
                            <tr {if !$file.finalbillfile} style="background-color: #f8b8b8;"{/if}>
                                <td>4</td>
                                <td>final invoice</td>
                                <td>
                                    {if $file.finalbillfile}<a href="{$hosturl}/upload/shippingFiles/{$file.finalbillfile}" target="_blank" class="btn btn-success">عرض</a>{/if}
                                </td>
                                <td>{$file.finalbillnotes}</td>
                                <td><span id="finalbillDate">{$file.finalbilldate}</span></td>
                                <td><span id="finalbillUser">{$file.finalbillusername}</span></td>
                            </tr>
                            <tr {if !$file.customevalfile} style="background-color: #f8b8b8;"{/if}>
                                <td>5</td>
                                <td>MRN</td>
                                <td>
                                    {if $file.customevalfile}<a href="{$hosturl}/upload/shippingFiles/{$file.customevalfile}" target="_blank" class="btn btn-success">عرض</a>{/if}
                                </td>
                                <td>{$file.customevalnotes}</td>
                                <td><span id="customevalDate">{$file.customevaldate}</span></td>
                                <td><span id="customevalUser">{$file.customevalusername}</span></td>
                            </tr>
                            <tr {if !$file.warehousefile} style="background-color: #f8b8b8;"{/if}>
                                <td>6</td>
                                <td>Exit confirmation</td>
                                <td>
                                    {if $file.warehousefile}<a href="{$hosturl}/upload/shippingFiles/{$file.warehousefile}" target="_blank" class="btn btn-success">عرض</a>{/if}
                                </td>
                                <td>{$file.warehousenotes}</td>
                                <td><span id="warehouseDate">{$file.warehousedate}</span></td>
                                <td><span id="warehouseUser">{$file.warehouseusername}</span></td>
                            </tr>
                            <tr {if !$file.endrosementfile} style="background-color: #f8b8b8;"{/if}>
                                <td>7</td>
                                <td>Bill of loading</td>
                                <td>
                                    {if $file.endrosementfile}<a href="{$hosturl}/upload/shippingFiles/{$file.endrosementfile}" target="_blank" class="btn btn-success">عرض</a>{/if}
                                </td>
                                <td>{$file.endrosementnotes}</td>
                                <td><span id="endrosementDate">{$file.endrosementdate}</span></td>
                                <td><span id="endrosementUser">{$file.endrosementusername}</span></td>
                            </tr>
                            <tr {if !$file.eurofile} style="background-color: #f8b8b8;"{/if}>
                                <td>8</td>
                                <td>Eur1</td>
                                <td>
                                    {if $file.eurofile}<a href="{$hosturl}/upload/shippingFiles/{$file.eurofile}" target="_blank" class="btn btn-success">عرض</a>{/if}
                                </td>
                                <td>{$file.euronotes}</td>
                                <td><span id="euroDate">{$file.eurodate}</span></td>
                                <td><span id="euroUser">{$file.eurousername}</span></td>
                            </tr>
                            <tr {if !$file.shippolicyfile} style="background-color: #f8b8b8;"{/if}>
                                <td>9</td>
                                <td>invoice for form4</td>
                                <td>
                                    {if $file.shippolicyfile}<a href="{$hosturl}/upload/shippingFiles/{$file.shippolicyfile}" target="_blank" class="btn btn-success">عرض</a>{/if}
                                </td>
                                <td>{$file.shippolicynotes}</td>
                                <td><span id="shippolicyDate">{$file.shippolicydate}</span></td>
                                <td><span id="shippolicyUser">{$file.shippolicyusername}</span></td>
                            </tr>
                            <tr {if !$file.model4file} style="background-color: #f8b8b8;"{/if}>
                                <td>10</td>
                                <td>form4</td>
                                <td>
                                    {if $file.model4file}<a href="{$hosturl}/upload/shippingFiles/{$file.model4file}" target="_blank" class="btn btn-success">عرض</a>{/if}
                                </td>
                                <td>{$file.model4notes}</td>
                                <td><span id="model4Date">{$file.model4date}</span></td>
                                <td><span id="model4User">{$file.model4username}</span></td>
                            </tr>
                            <tr {if !$file.batchreleasefile} style="background-color: #f8b8b8;"{/if}>
                                <td>11</td>
                                <td>إفراج</td>
                                <td>
                                    {if $file.batchreleasefile}<a href="{$hosturl}/upload/shippingFiles/{$file.batchreleasefile}" target="_blank" class="btn btn-success">عرض</a>{/if}
                                </td>
                                <td>{$file.batchreleasenotes}</td>
                                <td><span id="batchreleaseDate">{$file.batchreleasedate}</span></td>
                                <td><span id="batchreleaseUser">{$file.batchreleaseusername}</span></td>
                            </tr>
                            <tr {if !$file.trafficnotifyfile} style="background-color: #f8b8b8;"{/if}>
                                <td>12</td>
                                <td>إخطار</td>
                                <td>
                                    {if $file.trafficnotifyfile}<a href="{$hosturl}/upload/shippingFiles/{$file.trafficnotifyfile}" target="_blank" class="btn btn-success">عرض</a>{/if}
                                </td>
                                <td>{$file.trafficnotifynotes}</td>
                                <td><span id="trafficnotifyDate">{$file.trafficnotifydate}</span></td>
                                <td><span id="trafficnotifyUser">{$file.trafficnotifyusername}</span></td>
                            </tr>
                            <tr {if !$file.saleagreementfile} style="background-color: #f8b8b8;"{/if}>
                                <td>13</td>
                                <td>المبايعة</td>
                                <td>
                                    {if $file.saleagreementfile}<a href="{$hosturl}/upload/shippingFiles/{$file.saleagreementfile}" target="_blank" class="btn btn-success">عرض</a>{/if}
                                </td>
                                <td>{$file.saleagreementnotes}</td>
                                <td><span id="saleagreementDate">{$file.saleagreementdate}</span></td>
                                <td><span id="saleagreementUser">{$file.saleagreementusername}</span></td>
                            </tr>
                            <tr {if !$file.taxinvoicefile} style="background-color: #f8b8b8;"{/if}>
                                <td>14</td>
                                <td>الفاتورة الضريبية</td>
                                <td>
                                    {if $file.taxinvoicefile}<a href="{$hosturl}/upload/shippingFiles/{$file.taxinvoicefile}" target="_blank" class="btn btn-success">عرض</a>{/if}
                                </td>
                                <td>{$file.taxinvoicenotes}</td>
                                <td><span id="taxinvoiceDate">{$file.taxinvoicedate}</span></td>
                                <td><span id="taxinvoiceUser">{$file.taxinvoiceusername}</span></td>
                            </tr>
                            <tr {if !$file.otherfile} style="background-color: #f8b8b8;"{/if}>
                                <td>15</td>
                                <td>مرفقات أخرى</td>
                                <td>
                                    {if $file.otherfile}<a href="{$hosturl}/upload/shippingFiles/{$file.otherfile}" target="_blank" class="btn btn-success">عرض</a>{/if}
                                </td>
                                <td>{$file.othernotes}</td>
                                <td><span id="otherDate">{$file.otherdate}</span></td>
                                <td><span id="otherUser">{$file.otherusername}</span></td>
                            </tr>
                        </tbody>
                    </table>
            </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}