@extends("layouts.admin.app")
@section("page-title")
    {{__("Technicians")}}
@endSection
@section("page-nav-title")
    <div class="app-title">
        <div>
            <h1><i class="fa fa-dashboard"></i>{{__("Technicians")}}</h1>
            <p>{{__("All Technicians")}}</p>
        </div>

        <ul class="app-breadcrumb breadcrumb">
            <li class="breadcrumb-item"><i class="fa fa-home fa-lg"></i></li>
            <li class="breadcrumb-item"><a href="#">{{__("Dashboard")}}</a></li>
            <li class="breadcrumb-item"><a href="{{route("admin.technician.index", ["page" => $page])}}">{{__("Technicians")}}</a></li>
            <li class="breadcrumb-item"><a href="#">{{__("Create")}}</a></li>
        </ul>
    </div>
@endsection

@section("css-links")
    <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">

    <style>
        #ServicesSelectedBox { display: flex; margin: 15px 10px; flex-wrap: wrap}
        #ServicesSelectedBox .service-item {
            display: none;
            background: var(--primary);
            padding: 5px 15px;
            color: #fff;
            border-radius: 15px;
            margin: 0 5px 8px 0;
        }
        #ServicesSelectedBox .service-item span.text{
            font-size: 17px;
            font-weight: 600;
        }
        #ServicesSelectedBox .service-item span.icon-close{
            margin-left: 7px;
            display: inline-block;
            cursor: pointer;
            font-weight: 400;
            font-size: 14px;
            transition: all .6s;
        }
        #ServicesSelectedBox .service-item span.icon-close:hover{
            color: #ededed;
            transform: rotate(180deg);
            font-weight: 700;
        }
    </style>
@endsection

@section("content")

    <div class="row">
        <div class="col-lg-10 m-auto">
            <div class="tile">
                <h3 class="tile-title">{{__("Edit Technician")}}</h3>
                <div class="tile-body">
                    <form method="post" action="{{route("admin.technician.update", ["page" => $page, "id" => $user->id])}}" enctype="multipart/form-data">
                        @csrf
                        @method("put")
                        <div class="row">
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("Full Name")}}</label>
                                    <input class="form-control @if($errors->has('full_name')) is-invalid @endif" type="text" name="full_name" placeholder="{{__("Enter Full Name")}}" value="{{inputValue("full_name", $user)}}">
                                </div>
                                @error("full_name")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("Username")}}</label>
                                    <input class="form-control @if($errors->has('username')) is-invalid @endif" type="text" name="username" placeholder="{{__("Enter username")}}" value="{{inputValue("username", $user->technician)}}">
                                </div>
                                @error("username")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("New Password")}}</label>
                                    <input class="form-control @if($errors->has('password')) is-invalid @endif" type="text" name="password" placeholder="{{__("Enter new password")}}">
                                </div>
                                @error("password")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("Confirm New Password")}}</label>
                                    <input class="form-control @if($errors->has('confirm_password')) is-invalid @endif" type="text" name="confirm_password" placeholder="{{__("Enter confirm new password")}}" value="{{inputValue("confirm_password")}}">
                                </div>
                                @error("confirm_password")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>

                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("Email")}}</label>
                                    <input class="form-control @if($errors->has('email')) is-invalid @endif" type="text" name="email" placeholder="{{__("Enter Email")}}" value="{{inputValue("email", $user)}}">
                                </div>
                                @error("email")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("Region")}}</label>
                                    <select class="form-control @if($errors->has('region')) is-invalid @endif"  name="region">
                                        <option @if($user->technician->region == 1) selected @endif value="1">{{__('كرخ')}}</option>
                                        <option @if($user->technician->region == 2) selected @endif value="2">{{__('رصافة')}}</option>
                                    </select>
                                </div>
                                @error("region")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("Phone Number")}} {{__("1")}}</label>
                                    <input class="form-control @if($errors->has('phone_number')) is-invalid @endif" type="text" name="phone_number_1" placeholder="{{__("Enter Phone number")}}" value="{{inputValue("phone_number_1", $user->technician)}}">
                                </div>
                                @error("phone_number_1")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("Phone Number")}}  {{__("2")}}</label>
                                    <input class="form-control @if($errors->has('phone_number')) is-invalid @endif" type="text" name="phone_number_2" placeholder="{{__("Enter Phone number")}}" value="{{inputValue("phone_number_2", $user->technician)}}">
                                </div>
                                @error("phone_number_2")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("Address")}}</label>
                                    <input class="form-control @if($errors->has('address')) is-invalid @endif" type="text" name="address" placeholder="{{__("Enter address")}}" value="{{inputValue("address", $user->technician)}}">
                                </div>
                                @error("address")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("Birthday Date")}}</label>
                                    <input class="form-control @if($errors->has('birth_date')) is-invalid @endif" type="date" name="birth_date" value="{{inputValue("birth_date", $user)}}">
                                </div>
                                @error("birth_date")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("Gender")}}</label>
                                    <select class="form-control @if($errors->has('gender')) is-invalid @endif"  name="gender">
                                        <option {{checked("gender", 1, $user)}} value="1">{{__('Male')}}</option>
                                        <option {{checked("gender", 2, $user)}} value="2">{{__('Female')}}</option>
                                    </select>
                                </div>
                                @error("gender")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("User Category")}}</label>
                                    <select class="form-control @if($errors->has('technician_category')) is-invalid @endif"  name="technician_category">
                                        <option {{selected("technician_category", 3, $user->technician)}} value="3">{{__('Bronze')}}</option>
                                        <option {{selected("technician_category", 2, $user->technician)}} value="2">{{__('Silver')}}</option>
                                        <option {{selected("technician_category", 1, $user->technician)}} value="1">{{__('Gold')}}</option>
                                    </select>
                                </div>
                                @error("technician_category")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("Login Technician")}}</label>
                                    <select class="form-control "  name="login">
                                        <option {{selected("login", 1, $user->technician)}} value="1">{{__('Login')}}</option>
                                        <option {{selected("login", 0, $user->technician)}} value="0">{{__('logout')}}</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("Experience Years")}}</label>
                                    <div class="input-group">
                                        <input class="form-control @if($errors->has('experience_years')) is-invalid @endif" type="number" name="experience_years" placeholder="{{__("Enter experience years")}}" value="{{inputValue("experience_years", $user->technician)}}">
                                        <div class="input-group-append"><span class="input-group-text"> Years</span></div>
                                    </div>
                                </div>
                                @error("experience_years")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="exampleSelect1" >{{__("Main Specialty")}}</label>
                                    <select class="form-control form-input select2 @if($errors->has('main_specialty')) is-invalid @endif" name="main_specialty[]" id="UsersTypesSelect" multiple="" style="width: 100%" required>
                                        <optgroup label="Select Types Related it">
                                            @foreach($mainCategories as $category)
                                                <option @if(isset($mainSpecialty[$category->id]) && $mainSpecialty[$category->id] == $category->id) selected @endif value="{{$category->id}}">{{$category->name}}</option>
                                            @endforeach
                                        </optgroup>
                                    </select>
                                </div>
                                @error("main_specialty")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="quantity-prices-box col-12" >
                                @foreach($commissions as $commission)
                                    <div class="row option-quantity-box">
                                        <div class="col-lg-5 col-md-12 ">
                                            <div class="row">
                                                <div class="col-6">
                                                    <div class="form-group">
                                                        <label class="control-label">{{__("Price From")}}</label>
                                                        <input class="form-control" type="text" name="price_from[]" placeholder="{{__("Enter Price")}}" value="{{inputValue("price_from", $commission)}}">
                                                        <div class="invalid-feedback" style="display: none"></div>
                                                    </div>
                                                </div>
                                                <div class="col-6">
                                                    <div class="form-group">
                                                        <label class="control-label">{{__("Price To")}}</label>
                                                        <input class="form-control" type="text" name="price_to[]" placeholder="{{__("Enter Price")}}" value="{{inputValue("price_to", $commission)}}">
                                                        <div class="invalid-feedback" style="display: none"></div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-lg-5 col-md-12 m-auto">
                                            <div class="row">
                                                <div class="col-lg-9">
                                                    <div class="form-group">
                                                        <label class="control-label">{{__("Commission")}}</label>
                                                        <div class="input-group">
                                                            <input class="form-control" type="text" name="application_commission[]" placeholder="{{__("Enter Commission")}}" value="{{inputValue("commission", $commission)}}">
                                                            <div class="input-group-append"><span class="input-group-text">%</span></div>
                                                        </div>
                                                        <div class="invalid-feedback" style="display: none"></div>
                                                    </div>
                                                </div>
                                                @if($commission->price_from == 1)
                                                    <div class="col-lg-9" style="display: none">
                                                        <div class="form-group">
                                                            <label class="control-label">{{__("Commission")}}</label>
                                                            <div class="input-group">
                                                                <input class="form-control @if($errors->has('application_commission')) is-invalid @endif" disabled hidden type="number" name="application_commission" placeholder="{{__("Enter application commission")}}" value="{{inputValue("commission", $commission)}}">
                                                                <div class="input-group-append"><span class="input-group-text">%</span></div>
                                                            </div>
                                                            <div class="invalid-feedback" style="display: none"></div>
                                                        </div>
                                                    </div>
                                                @endif
                                                @if($commission->price_from != 1)
                                                    <div class="col-lg-3 text-center">
                                                        <div class="form-group">
                                                            <label class="control-label">{{__('Delete')}}</label>
                                                            <div class="d-block">
                                                    <span class="delete-option server-delete"
                                                          data-id="{{$commission->id}}"
                                                          data-user-id="{{$user->id}}"
                                                          data-url="{{route("ajax.commissions-technician.destroy")}}"
                                                          data-success-message="{{__('Deleted Successfully')}}"
                                                          data-error-message="{{__('Deleted Failed')}}" data-title = "{{__('Are You Sure To Delete ?')}}"
                                                          data-no="{{__('No')}}" data-yes="{{__('Yes')}}"
                                                          style="color: #7e0000; font-size: 21px;cursor: pointer"><i class="far fa-trash-alt"></i></span>
                                                            </div>
                                                        </div>
                                                    </div>
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                @endforeach
                            </div>
                            <div class="col-12 mt-3 mb-3">
                                <span class="btn btn-primary add-new-row"><i class="fas fa-plus"></i> {{__("Add New Row")}}</span>
                            </div>
                            <div class="prices-infinity col-12">
                                <div class="row">
                                    <div class="col-lg-5 col-md-12 ">
                                        <div class="row">
                                            <div class="col-6">
                                                <div class="form-group">
                                                    <label class="control-label">{{__('Price From')}}</label>
                                                    <input class="form-control" type="text" name="price_from_infinity" placeholder="{{__('Enter Price')}}" value="{{$commissionInfinite ? $commissionInfinite->price_from : ''}}">
                                                    <div class="invalid-feedback" style="display: none"></div>
                                                </div>
                                            </div>
                                            <div class="col-6">
                                                <div class="form-group">
                                                    <label class="control-label">{{__('Price To')}}</label>
                                                    <div class="form-control" style="border-color: #eee;background: #eee;color: #999;font-size: 14px;"><i class='fas fa-infinity'></i></div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="col-lg-5 col-md-12 m-auto">
                                        <div class="form-group">
                                            <label class="control-label">{{__('Commission')}}</label>
                                            <div class="input-group">
                                                <input class="form-control" type="text" name="commission_infinity" placeholder="{{__('Enter Commission')}}"  value="{{$commissionInfinite ? $commissionInfinite->commission : ''}}">
                                                <div class="input-group-append"><span class="input-group-text">%</span></div>
                                            </div>
                                            <div class="invalid-feedback" style="display: none"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>


                        <hr>
                        <div class="row">
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("Profile Photo")}}</label>
                                    <div class="upload-button-box">
                                        <button class="btn btn-primary form-control button-upload-file" >
                                            <input class="input-file show-uploaded" data-upload-type="single" data-imgs-container-class="uploaded-images" type="file" name="profile_photo">
                                            <span class="upload-file-content">
                                                <i class="fas fa-upload fa-lg upload-file-content-icon left"></i>
                                                <span class="upload-file-content-text">{{__("Upload Photo")}}</span>
                                            </span>
                                        </button>
                                    </div>
                                    <div class="invalid-feedback" style="display: none"></div>
                                </div>
                            </div>
                            <div class="col-lg-3 col-md-5 col-sm-6">
                                <div class="uploaded-images"></div>
                            </div>
                        </div>
                        <hr>
                        <div class="row">
                            <div class="col-6">
                                <!-- Button trigger modal -->
                                <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">
                                    {{__("Services")}}
                                </button>

                                <!-- Modal -->
                                <div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
                                    <div class="modal-dialog modal-xl">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <h5 class="modal-title" id="exampleModalLabel">{{__("Services")}}</h5>
                                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                    <span aria-hidden="true">&times;</span>
                                                </button>
                                            </div>
                                            <div class="modal-body">
                                                <div class="row">
                                                    {{--                                                    <div class="col-lg-6">--}}
                                                    {{--                                                        <div class="form-group">--}}
                                                    {{--                                                            <label class="control-label">{{__("Main Categories")}}</label>--}}
                                                    {{--                                                            <select class="form-control"  name="main_categories" id="MainCategories" >--}}
                                                    {{--                                                                <option value="">{{__('None')}}</option>--}}
                                                    {{--                                                                @foreach($mainCategories as $category)--}}
                                                    {{--                                                                    <option value="{{$category->id}}" data-sub-url="{{route("ajax.sub_category.index", ["main_id" => $category->id])}}">{{$category->name}}</option>--}}
                                                    {{--                                                                @endforeach--}}
                                                    {{--                                                            </select>--}}
                                                    {{--                                                        </div>--}}
                                                    {{--                                                    </div>--}}
                                                    {{--                                                    <div class="col-lg-6" id="SubCategoriesBox" style="display: none">--}}
                                                    {{--                                                        <div class="form-group">--}}
                                                    {{--                                                            <label class="control-label">{{__("Sub Categories")}}</label>--}}
                                                    {{--                                                            <select class="form-control"  name="subcategories" id="SubCategories">--}}
                                                    {{--                                                                <option value="">{{__('None')}}</option>--}}
                                                    {{--                                                            </select>--}}
                                                    {{--                                                        </div>--}}
                                                    {{--                                                    </div>--}}
                                                    <div class="col-lg-12">
                                                        <div class="tile">
                                                            <div class="tile-body">
                                                                <div class="">
                                                                    <div class="tree-container">
                                                                        <ul class="tree">
                                                                            <div class="row">
                                                                                {{--                                                                                @php--}}
                                                                                {{--                                                                                    $all = array--}}
                                                                                {{--                                                                                        (--}}
                                                                                {{--                                                                                            0 => 307,--}}
                                                                                {{--                                                                                            1 => 157,--}}
                                                                                {{--                                                                                            2 => 234,--}}
                                                                                {{--                                                                                            3=> 200,--}}
                                                                                {{--                                                                                            4 => 322,--}}
                                                                                {{--                                                                                            5 => 123,--}}
                                                                                {{--                                                                                            6=>23--}}
                                                                                {{--                                                                                        );--}}
                                                                                {{--                                                                                        $search_this = array--}}
                                                                                {{--                                                                                        (--}}
                                                                                {{--                                                                                            0 => 307,--}}
                                                                                {{--                                                                                            1 => 157,--}}
                                                                                {{--                                                                                            2 => 234,--}}
                                                                                {{--                                                                                            3 => 200,--}}
                                                                                {{--                                                                                            4 => 321,--}}

                                                                                {{--                                                                                        );--}}
                                                                                {{--                                                                                        dd(array_intersect($search_this, $all));--}}
                                                                                {{--                                                                                @endphp--}}
                                                                                @foreach($mainCategories as $category)
                                                                                    <div class="col-lg-6">
                                                                                        <li class="has-tree show-sub">
                                                                                            <input type="checkbox" class="remove-all-checkbox mr-1" @if(count($mainService[$category->id]) == count(array_intersect($mainService[$category->id], $services))) checked @endif data-sub-url="{{route("ajax.sub_category.index", ["main_id" => $category->id])}}" value="{{$category->id}}">
                                                                                            <div class="node action-tree" data-id="{{$category->id}}" data-page="edit" data-technician-id="{{$user->technician->id}}" data-url="{{route("ajax.sub-category.show")}}">
                                                                                                <i class="fas fa-caret-right arrow"></i>
                                                                                                {{$category->name}}
                                                                                            </div>
                                                                                        </li>
                                                                                    </div>
                                                                                @endforeach
                                                                            </div>
                                                                        </ul>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <hr>
                                                <div class="row" id="ServicesBox" style="display: none">

                                                </div>
                                                <div id="ServicesSelectedBox">
                                                    @foreach($user->technician->services as $service)
                                                        <div class="service-item" style="display: inline-block" id="ServiceItem{{$service->id}}">
                                                            <input type="hidden" value="{{$service->id}}" name="services[]">
                                                            <span class="text">{{$service->name}}</span>
                                                        </div>
                                                    @endforeach
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                            </div>

                            <div class="col-6">
                                <!-- Button trigger modal -->
                                <button type="button" class="btn btn-primary" id="ServicesCommissionButton" data-toggle="modal" data-target="#ServicesCommission" >
                                    {{__("Services Commission")}}
                                </button>

                                <!-- Modal -->
                                <div class="modal fade" id="ServicesCommission" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
                                    <div class="modal-dialog modal-xl">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <h5 class="modal-title" id="exampleModalLabel">{{__("Services Commission")}}</h5>
                                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                    <span aria-hidden="true">&times;</span>
                                                </button>
                                            </div>
                                            <div class="modal-body">
                                                <div class="col-lg-7" id="ServiceCommission">
                                                    @foreach($user->technician->services as $service)
                                                        <div class="form-group service_commiation_{{$service->id}}">
                                                            <div class="row">
                                                                <div class="col-lg-2">
                                                                    <h5 style="padding-top: 7px;">{{$service->name}}</h5>
                                                                </div>
                                                                <div class="col-lg-5">
                                                                    <div class="input-group">
                                                                        <input class="form-control" type="number" name="service_commission_{{$service->id}}" value="{{$service->pivot->commission}}">
                                                                        <div class="input-group-append"><span class="input-group-text">%</span></div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            <hr>
                                                        </div>
                                                    @endforeach
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="tile-footer">
                            <button class="btn btn-primary" type="submit"><i class="fa fa-fw fa-lg fa-check-circle"></i> {{__("Create")}}</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

@endsection

@section("scripts")

    <!-- Data table plugin-->
    <script type="text/javascript" src="{{asset("assets/js/plugins/jquery.dataTables.min.js")}}"></script>
    <script type="text/javascript" src="{{asset("assets/js/plugins/dataTables.bootstrap.min.js")}}"></script>
    <script type="text/javascript">$('#sampleTable').DataTable();</script>
    <script type="module" src="{{asset("assets/js/pages/create_technician.js")}}"></script>
    <script type="module" src="{{asset("assets/js/pages/commission_technician.js")}}"></script>
    <script type="module" src="{{asset("assets/js/pages/category.js")}}"></script>

    <script type="text/javascript" src="{{asset("assets/js/plugins/select2.min.js")}}"></script>
    <script type="text/javascript">
        $('#UsersTypesSelect').select2();
    </script>
    @include("admin.technician.templates")

@endsection