@include('header')
<style>
    .wallet_row {
        display: flex;
        margin-right: 18%;
        margin-bottom: -10px;
        margin-top: 30px;
    }

    .wallet_title {
        font-weight: bold;
    }

    .wallet_content {
        font-weight: bold;
        margin-right: 50px;
        color: #00A000;
    }

    .row_image {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .driver_image {
        width: 200px;
        height: 200px;
        border: 2px solid #337ab7;
        border-radius: 10px;
    }

    .img_holder {
        display: flex;
        flex-direction: column;
        margin-right: 10px;
    }
</style>

<div class="x_panel">
    <div class="x_title">
        <h2>اطلاعات راننده
            <small> {{$items->name}}</small>
        </h2>
        <ul class="nav navbar-right panel_toolbox">
            <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
            </li>
        </ul>
        <div class="clearfix"></div>
    </div>
    <div class="x_content">

        <div class="form-horizontal form-label-left">
            <div class="wallet_row">
                <div class="wallet_title">
                    <p>کیف پول کاربر</p>
                </div>
                <div class="wallet_content">
                    <p>{{$items->user_wallet}}</p>
                </div>
            </div>

            <div class="item form-group">
                <label class="control-label col-md-3 col-sm-3 col-xs-12">مقدار تغییر</label>
                <div class="col-md-6 col-sm-6 col-xs-12">
                    <input type="number" id="wallet" placeholder="مقدار مورد نظر را وارد کنید"
                           class="form-control col-md-7 col-xs-12">
                </div>
            </div>

            <div class="form-group">
                <div class="col-md-6 col-md-offset-3">
                    <button class="btn btn-success" onclick="change_wallet('increase')">افزایش موجودی</button>
                    <button class="btn btn-danger" onclick="change_wallet('decrease')">کاهش موجودی</button>
                </div>
            </div>

        </div>

        <hr class="my_hr">
        <br>

        <form class="form-horizontal form-label-left" id="update_info">

            <input name="user_id" value="{{$_GET['user_id']}}" type="hidden">
            <input name="action" type="hidden" value="profile">

            <div class="item form-group">
                <label class="control-label col-md-3 col-sm-3 col-xs-12">وضعیت کاربر <span class="required">*</span>
                </label>
                <div class="col-md-6 col-sm-6 col-xs-12">
                    <select name="status" class="form-control col-md-7 col-xs-12">
                        <option value="1" @if ($items->status == 1)  selected="selected" @endif> مجاز</option>
                        <option value="0" @if ($items->status == 0)  selected="selected" @endif> در انتظار تایید
                        </option>
                        <option value="2" @if ($items->status == 2)  selected="selected" @endif> پاک شود</option>
                    </select>

                </div>
            </div>

            <div class="item form-group">
                <label class="control-label col-md-3 col-sm-3 col-xs-12">نام و نام خانوادگی<span
                        class="required">*</span>
                </label>
                <div class="col-md-6 col-sm-6 col-xs-12">
                    <input name="name" class="form-control col-md-7 col-xs-12"
                           data-validate-length-range="6"
                           data-validate-words="2" value="{{$items->name}}"
                           required="required" type="text">
                </div>
            </div>

            <div class="item form-group">
                <label class="control-label col-md-3 col-sm-3 col-xs-12">شماره تماس <span class="required">*</span>
                </label>
                <div class="col-md-6 col-sm-6 col-xs-12">
                    <input name="phone" class="form-control col-md-7 col-xs-12"
                           data-validate-length-range="6"
                           data-validate-words="2" value="{{$items->phone}}"
                           required="required" type="text">
                </div>
            </div>

            <div class="item form-group">
                <label class="control-label col-md-3 col-sm-3 col-xs-12"> کد ملی<span class="required">*</span>
                </label>
                <div class="col-md-6 col-sm-6 col-xs-12">
                    <input name="codemelli" class="form-control col-md-7 col-xs-12"
                           data-validate-length-range="6"
                           data-validate-words="2" value="{{$items->codemelli}}"
                           required="required" type="text">
                </div>
            </div>


            <div class="item form-group">
                <label class="control-label col-md-3 col-sm-3 col-xs-12">استان<span class="required">*</span>
                </label>
                <div class="col-md-6 col-sm-6 col-xs-12">
                    <input name="state" class="form-control col-md-7 col-xs-12"
                           data-validate-length-range="6" value="{{$items->state_name}}"
                           data-validate-words="2" disabled="disabled"
                           required="required" type="text">
                    <input type="hidden" name="state_id" value="{{$items->state_id}}">
                </div>
            </div>

            <div class="item form-group">
                <label class="control-label col-md-3 col-sm-3 col-xs-12">شهر <span class="required">*</span>
                </label>
                <div class="col-md-6 col-sm-6 col-xs-12">
                    <input name="city" class="form-control col-md-7 col-xs-12"
                           data-validate-length-range="6"
                           data-validate-words="2" disabled="disabled"
                           required="required" type="text" value="{{$items->city_name}}">
                    <input type="hidden" name="city_id" value="{{$items->city_id}}">
                </div>
            </div>

            <div class="item form-group">
                <label class="control-label col-md-3 col-sm-3 col-xs-12"> آدرس منزل<span class="required">*</span>
                </label>
                <div class="col-md-6 col-sm-6 col-xs-12">
                    <input name="address" class="form-control col-md-7 col-xs-12"
                           data-validate-length-range="6"
                           data-validate-words="2" value="{{$items->address}}"
                           required="required" type="text">
                </div>
            </div>

            <div class="item form-group">
                <label class="control-label col-md-3 col-sm-3 col-xs-12">امتیاز<span class="required">*</span></label>
                <div class="col-md-6 col-sm-6 col-xs-12">
                    <input name="rate" class="form-control col-md-7 col-xs-12"
                           data-validate-length-range="6"
                           data-validate-words="2" value="{{$items->rate}}"
                           required="required" type="text">
                </div>
            </div>

            <div class="form-group __web-inspector-hide-shortcut__">
                <label class="control-label col-md-3 col-sm-3 col-xs-12">خدمات</label>
                <div class="col-md-6 col-sm-6 col-xs-12">
                    <select name="services[]" class="select2_multiple form-control" multiple="multiple">
                        @foreach($service as $item)
                            <option value="{{$item->id}}"
                                    @if($workers_service->contains('service_id', $item->id)) selected @endif>
                                {{$item->name}}
                            </option>
                        @endforeach
                    </select>
                </div>
            </div>


            <div class="row_image">

                <div class="img_holder">
                    <span>عکس پروفایل</span>
                    <label for="profile_pic">
                        <img src="{{$items->profile_pic}}" class="driver_image" id="profile_pic_img">
                        <input id="profile_pic" type="file" name="profile_pic" style="display: none"
                               onchange="ChangePic(this, 'profile_pic_img')">
                    </label>
                </div>


                <div class="img_holder">
                    <span>عکس سو پیشینه</span>
                    <label for="pishineh_pic">
                        <img src="{{$items->pishineh_pic}}" class="driver_image" id="pishineh_pic_img">
                        <input id="pishineh_pic" type="file" name="pishineh_pic" style="display: none"
                               onchange="ChangePic(this, 'pishineh_pic_img')">
                    </label>
                </div>

                <div class="img_holder">
                    <span>عکس گواهی فنی</span>
                    <label for="fani_pic">
                        <img src="{{$items->fani_pic}}" class="driver_image" id="fani_pic_img">
                        <input id="fani_pic" type="file" name="fani_pic" style="display: none"
                               onchange="ChangePic(this, 'fani_pic_img')">
                    </label>
                </div>

                <div class="img_holder">
                    <span>عکس روی کارت ملی</span>
                    <label for="cart_melli_pic">
                        <img src="{{$items->cart_melli_pic}}" class="driver_image" id="cart_melli_pic_img">
                        <input id="cart_melli_pic" type="file" name="cart_melli_pic" style="display: none"
                               onchange="ChangePic(this, 'cart_melli_pic_img')">
                    </label>
                </div>
            </div>
            <div class="form-group">
                <div class="col-md-6 col-md-offset-3">
                    <button class="btn btn-primary">ویرایش</button>
                </div>
            </div>

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


<div class="x_panel">
    <div class="x_title">
        <h2>تراکنش های کیف پول کاربر</h2>
        <ul class="nav navbar-right panel_toolbox">
            <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
            </li>
        </ul>
        <div class="clearfix"></div>
    </div>
    <div class="x_content">
        <div id="datatable-fixed-header_wrapper" class="dataTables_wrapper form-inline dt-bootstrap no-footer">

            <div class="row">
                <div class="col-sm-12">
                    <table id="datatable-responsive" class="table table-striped table-bordered dataTable no-footer"
                           role="grid" aria-describedby="datatable-fixed-header_info">
                        <thead>
                        <tr role="row">
                            <th class="sorting" tabindex="0" aria-controls="datatable-fixed-header" rowspan="1"
                                colspan="1" aria-label="جایگاه: activate to sort column ascending"
                                style="width: 25%;">قیمت
                            </th>
                            <th class="sorting" tabindex="0" aria-controls="datatable-fixed-header" rowspan="1"
                                colspan="1" aria-label="اداره: activate to sort column ascending"
                                style="width: 25%;">نوع
                            </th>

                            <th class="sorting" tabindex="0" aria-controls="datatable-fixed-header" rowspan="1"
                                colspan="1" aria-label="تاریخ شروع: activate to sort column ascending"
                                style="width: 25%;">علت
                            </th>
                            <th class="sorting" tabindex="0" aria-controls="datatable-fixed-header" rowspan="1"
                                colspan="1" aria-label="تاریخ شروع: activate to sort column ascending"
                                style="width: 25%;">تاریخ
                            </th>
                        </tr>
                        </thead>
                        <tbody>

                        @foreach($report as $item)
                            <tr role="row" class="odd">
                                <td>{{number_format($item->price)}}</td>
                                @if($item->type == 'decrease')
                                    <td><p style="color: #bd0000">کاهشی</p></td>
                                @else
                                    <td><p style="color: #00A000">افزایشی</p></td>
                                @endif
                                <td>{{$item->reason}}</td>
                                <td>{{$item->date}}</td>
                            </tr>
                        @endforeach
                        </tbody>
                    </table>
                </div>
            </div>

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

<div class="x_panel" id="unit_ticket">
    <div class="x_title">
        <h2>مشاهده تیکت های کاربر</h2>
        <ul class="nav navbar-right panel_toolbox">
            <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
            </li>
        </ul>
        <div class="clearfix"></div>
    </div>
    <div class="x_content">
        <div id="datatable-fixed-header_wrapper" class="dataTables_wrapper form-inline dt-bootstrap no-footer">

            <div class="row">
                <div class="col-sm-12">
                    <table id="datatable-responsive" class="table table-striped table-bordered dataTable no-footer"
                           role="grid" aria-describedby="datatable-fixed-header_info">
                        <thead>
                        <tr role="row">
                            <th class="sorting" tabindex="0" aria-controls="datatable-fixed-header" rowspan="1"
                                colspan="1" aria-label="جایگاه: activate to sort column ascending"
                                style="width: 25%;">عنوان
                            </th>
                            <th class="sorting" tabindex="0" aria-controls="datatable-fixed-header" rowspan="1"
                                colspan="1" aria-label="اداره: activate to sort column ascending"
                                style="width: 25%;">توضیحات
                            </th>

                            <th class="sorting" tabindex="0" aria-controls="datatable-fixed-header" rowspan="1"
                                colspan="1" aria-label="تاریخ شروع: activate to sort column ascending"
                                style="width: 25%;">تاریخ
                            </th>
                            <th class="sorting" tabindex="0" aria-controls="datatable-fixed-header" rowspan="1"
                                colspan="1" aria-label="تاریخ شروع: activate to sort column ascending"
                                style="width: 25%;">درج جواب
                            </th>
                        </tr>
                        </thead>
                        <tbody>
                        @foreach($ticket as $item)
                            <tr role="row" class="odd">
                                <td>{{$item->title}}</td>
                                <td>{{$item->caption}}</td>
                                <td>{{$item->date}}</td>
                                @if($item->answer)
                                    <td>{{$item->answer}}</td>
                                @else
                                    <td>
                                        <div id="ticket_form{{$item->id}}">
                                            <textarea rows="3" name="caption" id="caption{{$item->id}}"></textarea>
                                            <br>
                                            <input type="button" value="ارسال" onclick="ticketform({{$item->id}})">
                                        </div>
                                    </td>
                                @endif
                            </tr>
                        @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="x_panel">
    <div class="x_title">
        <h2>کارت های ثبت شده کاربر</h2>
        <ul class="nav navbar-right panel_toolbox">
            <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
            </li>
        </ul>
        <div class="clearfix"></div>
    </div>
    <div class="x_content">
        <div id="datatable-fixed-header_wrapper" class="dataTables_wrapper form-inline dt-bootstrap no-footer">

            <div class="row">
                <div class="col-sm-12">
                    <table id="datatable-responsive" class="table table-striped table-bordered dataTable no-footer"
                           role="grid" aria-describedby="datatable-fixed-header_info">
                        <thead>
                        <tr role="row">
                            <th class="sorting" tabindex="0" aria-controls="datatable-fixed-header" rowspan="1"
                                colspan="1" aria-label="جایگاه: activate to sort column ascending"
                                style="width: 25%;">نام صاحب کارت
                            </th>
                            <th class="sorting" tabindex="0" aria-controls="datatable-fixed-header" rowspan="1"
                                colspan="1" aria-label="اداره: activate to sort column ascending"
                                style="width: 25%;">نام بانک
                            </th>

                            <th class="sorting" tabindex="0" aria-controls="datatable-fixed-header" rowspan="1"
                                colspan="1" aria-label="تاریخ شروع: activate to sort column ascending"
                                style="width: 25%;">شماره شبا
                            </th>
                            <th class="sorting" tabindex="0" aria-controls="datatable-fixed-header" rowspan="1"
                                colspan="1" aria-label="تاریخ شروع: activate to sort column ascending"
                                style="width: 25%;">شماره کارت
                            </th>
                        </tr>
                        </thead>
                        <tbody>

                        @foreach($pay_kart as $item)
                            <tr role="row" class="odd">
                                <td>{{$item->name}}</td>
                                <td>{{$item->bank_name}}</td>
                                <td>{{$item->shaba_number}}</td>
                                <td>{{$item->kart_number}}</td>
                            </tr>
                        @endforeach
                        </tbody>
                    </table>
                </div>
            </div>

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

<script src="../resources/js/jquery.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script src="sweetalert2.all.min.js"></script>



<script>

    var updateInfoForm = $("#update_info");
    updateInfoForm.submit(function (e) {
        e.preventDefault();

        Swal.fire({
            title: 'آیا از ویرایش کاربر مطمئن هستید؟',
            icon: 'question',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'بله',
            cancelButtonText: 'خیر'
        }).then((result) => {
            if (result.isConfirmed) {
                let formData = new FormData(updateInfoForm[0]); // برای پشتیبانی از فایل‌ها


                // مقدار گزینه‌های انتخاب‌شده را به‌صورت یک آرایه ارسال کن
                let selectedServices = $("select[name='services[]']").val();
                if (selectedServices) {
                    formData.append("services", JSON.stringify(selectedServices));
                }


                $.ajax({
                    type: "POST",
                    url: '/panel/worker_profile_action',
                    data: formData,
                    processData: false, // نیاز برای ارسال فایل
                    contentType: false, // نیاز برای ارسال فایل
                    success: function (res) {
                        if (res.status === 'ok') {
                            Swal.fire({
                                position: 'center',
                                icon: 'success',
                                title: 'تغییرات اعمال شد',
                                showConfirmButton: false,
                                timer: 1500
                            }).then(() => {
                                location.reload();
                            });
                        } else {
                            Swal.fire({
                                icon: 'error',
                                title: 'خطا',
                                text: res.message || 'مشکلی پیش آمد، مجدد تلاش کنید'
                            });
                        }
                    },
                    error: function (res) {
                        if (res.responseJSON && res.responseJSON.errors) {
                            let errors = Object.values(res.responseJSON.errors).flat().join('\n');
                            Swal.fire({
                                icon: 'error',
                                title: 'خطا',
                                text: errors
                            });
                        } else {
                            Swal.fire({
                                icon: 'error',
                                title: 'خطای سرور',
                                text: 'لطفاً مجدد تلاش کنید'
                            });
                        }
                    }
                });
            }
        });
    });

    function ChangePic(input, imgId) {
        if (input.files && input.files[0]) {
            const file = input.files[0];
            const allowedTypes = ['image/jpeg', 'image/png'];
            if (!allowedTypes.includes(file.type)) {
                alert('لطفاً یک تصویر معتبر انتخاب کنید.');
                return;
            }
            const maxFileSize = 4 * 1024 * 1024; // 2MB
            if (file.size > maxFileSize) {
                alert('حجم فایل نباید بیشتر از 4 مگابایت باشد.');
                return;
            }
            const reader = new FileReader();
            reader.onload = function (e) {
                const previewImage = document.getElementById(imgId);
                previewImage.src = e.target.result;
            };
            reader.readAsDataURL(file);
        }
    }

    function change_wallet(action) {
        Swal.fire({
            title: 'آیا از تغییرات مطمئن هستید',
            icon: 'question',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'بله',
            cancelButtonText: 'خیر'
        }).then((result) => {
            if (result.isConfirmed) {

                var amount  = document.getElementById('wallet').value;
                if (amount === "" || amount <= 0) {
                    alert("لطفاً مقدار معتبر وارد کنید");
                    return;
                }

                let finalAmount = action === "increase" ? amount : -amount;

                $.ajax({
                    type: "POST",
                    url: '/panel/worker_profile_action',
                    data: {
                        user_id: {{$_GET['user_id']}},
                        wallet: finalAmount,
                        action: 'wallet',
                    },

                    success: function (res) {
                        if (res.status == 'ok') {
                            Swal.fire({
                                position: 'center',
                                icon: 'success',
                                title: 'تغییرات اعمال شد',
                                showConfirmButton: false,
                                timer: 1500
                            }).then(() => {
                                location.reload()
                            })
                        } else {
                            Swal.fire({
                                icon: "error",
                                title: "مشکلی پیش آمد",
                                text: "لطفا مجدد تلاش کنید",
                            });                        }
                    },
                    error: function (res) {
                        console.log(res);
                    },
                });
            }
        })
    }

    function ticketform(id) {

        var caption = document.getElementById("caption" + id).value;
        console.log({
            ticket_id: id,
            caption: caption,
        })
        $.ajax({
            type: "POST",
            data: {
                ticket_id: id,
                caption: caption,
            },
            url: '/panel/ticket_action',
            success: function (res) {
                console.log(res)
                if (res.status == 'ok') {
                    Swal.fire({
                        position: 'center',
                        icon: 'success',
                        title: 'تغییرات اعمال شد',
                        showConfirmButton: false,
                        timer: 1500
                    }).then(() => {
                        location.reload()
                    })
                } else {
                    alert('مشکلی پیش آمد ، مجدد تلاش کنید')
                }
            },
            error: function (res) {
                console.log(res);
            },
        });
    }
</script>

@include('footer')