<div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="editModalLabel" aria-hidden="true">

    <div class="modal-dialog" role="document">

        <div class="modal-content">

            <div class="modal-header">

                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span

                        aria-hidden="true">×</span></button>

                <h5 class="modal-title" id="myModalLabel">

                    Chỉnh Sửa Phiếu Lương (<span style="font-weight: bold"><?php

                                                            foreach ($staff as $staffs) {

                                                                if ($staffs['staffid'] == $selected_so_xe) {

                                                                    echo $staffs['staff_identifi' ]. '-' . $staffs['firstname'];

                                                                }

                                                            }

                                                        ?> </span>) Tháng

                    <input type="text" id="edit-Ngay_ghi_so" name="Ngay_ghi_so" value="<?php echo date('d-m-Y'); ?>"

                        style="width:unset !important; border: none !important; padding: 0 !important; box-shadow: none !important;">

                </h5>

            </div>

            <div class="modal-body">

                <form id="editForm">

                    <input type="hidden" name="id" id="edit-id">

                    <input type="hidden" name="<?php echo $this->security->get_csrf_token_name(); ?>"

                        value="<?php echo $this->security->get_csrf_hash(); ?>">

                    <div class="form-row">

                        <div class="form-group" app-field-wrapper="amount">

                            <label for="edit-Loai_cont" class="control-label">Loại cont</label>

                            <select name="Loai_cont" id="edit-Loai_cont" class="selectpicker form-control"

                                data-width="100%" data-none-selected-text="Chọn" data-live-search="true" tabindex="-98"

                                aria-invalid="false">

                                <option value=""></option>

                                <option value="20">20</option>

                                <option value="40">40</option>

                            </select>

                        </div>

                        <div class="form-group">

                            <label for=" edit-MOOC" class="control-label">MOOC</label>

                            <select name="MOOC" id="edit-MOOC" class="selectpicker form-control" data-width="100%"

                                data-none-selected-text="Chọn" data-live-search="true" tabindex="-98"

                                aria-invalid="false">

                                <option value=""></option>

                                <option value="0">0</option>

                                <option value="1-1">1 (800,000)</option>

                                <option value="1">1 (850,000)</option>

                                <option value="1-2">1 (900,000)</option>

                                <option value="1-3">1 (1,000,000)</option>

                                <option value="1.5-1">1.5 (1,200,000)</option>

                                <option value="1.5">1.5 (1,275,000)</option>

                                <option value="1.5-2">1.5 (1,350,000)</option>

                                <option value="1.5-3">1.5 (1,500,000)</option>

                            </select>

                        </div>

                        <div class="form-group">

                            <label for="Luong_chuyen" class="control-label">Lương Chuyến:</label>

                            <select name="Luong_chuyen" id="Luong_chuyen" onchange="

                                if(this.value == 'Tự Nhập'){

                                    document.getElementsByClassName('luong_chuyen_custom')[1].style.display = 'block';

                                }else{

                                    document.getElementsByClassName('luong_chuyen_custom')[1].style.display = 'none';

                                }" class="selectpicker form-control" data-width="100%" data-none-selected-text="Chọn"

                                data-live-search="true" tabindex="-98" aria-invalid="false">

                                <option value="">MOOC</option>

                                <option value="Tự Nhập">Tự Nhập</option>

                            </select>

                            <input type="number" class="luong_chuyen_custom" name="Luong_chuyen" id="Luong_chuyen"

                                style="display:none" placeholder="Nhập Tay">

                        </div>

                        <div class="">

                            <label for="edit-Ngoai_tinh">Ngoài Tỉnh</label>

                            <input type="number" class="form-control" id="edit-Ngoai_tinh" name="Ngoai_tinh">

                        </div>

                        <div class="">

                            <label for="edit-CAP">Cặp</label>

                            <input type="number" class="form-control" id="edit-CAP" name="CAP">

                        </div>

                        <div class="">

                            <label for="edit-NEO">Neo</label>

                            <input type="number" class="form-control" id="edit-NEO" name="NEO">

                        </div>

                        <div class="">

                            <label for="edit-LANH">Lạnh</label>

                            <input type="number" class="form-control" id="edit-LANH" name="LANH">

                        </div>

                        <div class="">

                            <label for="edit-D_THOAI">Điện Thoại</label>

                            <input type="number" class="form-control" id="edit-D_THOAI" name="D_THOAI">

                        </div>

                        <div class="">

                            <label for="edit-KHAC">Khác</label>

                            <input type="number" class="form-control" id="edit-KHAC" name="KHAC">

                        </div>

                        <div class="">

                            <label for="edit-UNG">Ứng</label>

                            <input type="number" class="form-control" id="edit-UNG" name="UNG">

                        </div>

                        <div class="">

                            <label for="edit-QTOAN">Quyết Toán</label>

                            <input type="number" step="0.01" class="form-control" id="edit-QTOAN" name="QTOAN">

                        </div>



                    </div>

                    <div>

                        <button type="submit" class="btn btn-primary"

                            style="display: flex; justify-content: flex-end;">Lưu</button>

                    </div>

                </form>

            </div>

        </div>

    </div>

</div>



<script>

$(document).ready(function() {

    $('.edit-button').click(function() {

        var id = $(this).data('id');

        $.ajax({

            url: '<?php echo site_url('template_module/get_luong'); ?>/' +

                id,

            type: 'GET',

            dataType: 'json',

            success: function(data) {

                $('#edit-id').val(data.id);

                $('#edit-Ngay_ghi_so').val(data.Ngay_ghi_so);

                $('#edit-Luong_chuyen').val(data.Luong_chuyen);

                $('#edit-Loai_cont').val(data.Loai_cont).change();

                $('#edit-MOOC').val(data.MOOC).change();

                $('#edit-Ngoai_tinh').val(data.Ngoai_tinh);

                $('#edit-CAP').val(data.CAP);

                $('#edit-NEO').val(data.NEO);

                $('#edit-LANH').val(data.LANH);

                $('#edit-D_THOAI').val(data.D_THOAI);

                $('#edit-KHAC').val(data.Khac);

                $('#edit-So_xe').val(data.So_xe);

                $('#edit-UNG').val(data.UNG);

                $('#edit-QTOAN').val(data.QTOAN);

                $('#editModal').modal('show');

            },

            error: function(jqXHR, textStatus,

                errorThrown) {

                console.error(

                    'Error fetching data: ',

                    textStatus, errorThrown);

            }

        });

    });



    $('#editForm').submit(function(e) {

        e.preventDefault();

        var formData = $(this).serialize();

        $.ajax({

            url: '<?php echo site_url('template_module/update_luong'); ?>',

            type: 'POST',

            data: formData,

            success: function(response) {

                var jsonResponse = JSON.parse(

                    response);

                if (jsonResponse.status ==

                    'success') {

                    $('#editModal').modal('hide');

                    location

                        .reload(); // Reload the page to see the changes

                } else {

                    alert('Error updating data');

                }

            },

            error: function(jqXHR, textStatus,

                errorThrown) {

                console.error(

                    'Error updating data: ',

                    textStatus, errorThrown);

            }

        });

    });

});

</script>

