@extends('layouts.master')
@section('header')
    @include('layouts.partials.header')
@endsection
@section('navbar')
    @include('layouts.partials.nav')
@endsection
@section('sidebar')
    @include('layouts.partials.sidebar')
@endsection
@section('content')
    <!-- ============================================================== -->
    <!-- Bread crumb and right sidebar toggle -->
    <!-- ============================================================== -->
    <div class="page-breadcrumb">
        <div class="row">
            <div class="col-5 align-self-center">
                <h4 class="page-title">{{__("Dashboard")}}</h4>
                <div class="d-flex align-items-center">

                </div>
            </div>
            <div class="col-7 align-self-center">
                <div class="d-flex no-block justify-content-end align-items-center">
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item">
                                <a href="{{route('products.index')}}">{{__("Products")}}</a>
                            </li>
                            <li class="breadcrumb-item active" aria-current="page">{{__("Edit")}}</li>
                        </ol>
                    </nav>
                </div>
            </div>
        </div>
    </div>
    <!-- ============================================================== -->
    <!-- End Bread crumb and right sidebar toggle -->
    <!-- ============================================================== -->
    <!-- ============================================================== -->
    <!-- Container fluid  -->
    <!-- ============================================================== -->
    <div class="container-fluid">
        <div class="row">
            <div class="col-12">
                <div class="card card-body">
                    <h4 class="card-title float-left">{{__("Edit Product")}}</h4>
                    @include('layouts.partials.flash-message')
                    <div class="row">
                        <div class="col-sm-12 col-xs-12">
                            <form id="edit-product-form" class="validate-form" method="POST" action="{{ route('products.update',$item->id) }}" enctype="multipart/form-data">
                                {{ method_field('PATCH') }}
                                <input type="hidden" name="_token" id="token" value="{{ csrf_token() }}">
                                <div class="form-group">
                                    <label for="product-name">{{__("Name")}}</label>
                                    <input type="text" value="{{$item->title}}" name="product_name" class="form-control validate[required]" id="product-name" placeholder="{{__('Product Name')}}">
                                </div>
                                <div class="form-group">
                                    <label for="product-description">{{__("Description")}}</label>
                                    <textarea id="product-description" name="description" class="form-control validate[required]" rows="3" placeholder="{{__("Product Description")}}">{{$item->description}}</textarea>
                                </div>
                                <div class="form-group">
                                    <label for="product-weight">{{__("Weight")}}</label>
                                    <input type="text" value="{{$item->weight}}" name="weight" class="form-control validate[required,custom[number]]" id="product-weight" placeholder="{{__('Product Weight')}}">
                                </div>
                                <div class="form-group">
                                    <label for="category_id">{{__("Category")}}</label>
                                    <select name="category" id="category_id" class="form-control validate[required]">
                                        <option value="">{{__("Select Category")}}</option>
                                        @foreach($categories as $category)
                                            <option @if($item->category_id==$category->id) selected @endif value="{{$category->id}}">{{$category->name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label for="country_id">{{__("Countries/Cities")}}</label>
                                    <div id="country_cities_data" class="form-group">
                                        <div class="row mb-1 mx-1">
                                            <button data-toggle="modal" data-target="#productDataModal" type="button" class="btn btn-primary float-left">{{__("Add Country")}}</button>
                                        </div>
                                        <div class="" id="check-country-data" style="color:red;display:none;margin:3px 10px;">{{__("Please Fill Country Data")}}</div>
                                        @foreach($product_countries as $country)
                                            <div class="card">
                                                <div class="card-header custom-card-header" id="headingOne">
                                                    <a class="btn btn-link" data-toggle="collapse" href="#block_country_{{$country->id}}" aria-expanded="true" aria-controls="collapseOne"><h6>{{$country->name}}</h6></a>
                                                    <a href="javascript:void[0]" data-module-name="products" id="{{$country->id}}" class="btn float-right delete-country-block"><i class="fas fa-trash-alt"></i></a>
                                                </div>
                                                <div id="block_country_{{$country->id}}" class="collapse" aria-labelledby="headingOne">
                                                        <input type="hidden" name="countries_ids[]" value="{{$country->id}}">
                                                        <input type="hidden" name="countries_currency[{{$country->id}}]" value="{{$country->currency}}">
                                                        <div class="card-body row py-0">
                                                            <div class="card col-4" >
                                                                <h6 class="card-title mt-3"><u>{{__("Price")}}</u></h6>
                                                                <div class="input-group">
                                                                    <input type="text" value="{{$country->product_price}}" name="price[{{$country->id}}]" class="col-11 form-control validate[required,custom[number],min[1]]" id="product_price_{{$country->id}}" placeholder="{{__("Price")}}">
                                                                    &nbsp;
                                                                    <div class="">
                                                                        <span class="input-group-text">{{$country->currency}}</span>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            <div class="card col-8" >
                                                                <div class="form-group d-flex justify-content-between" >
                                                                    <div class="">
                                                                        <h6 class="card-title mt-3"><u>{{__("Product Design")}}</u></h6>
                                                                        <div class="col-xs-2 img-hint-result mb-1" style="color:red;display:none">{{__("Required Image")}}</div>
                                                                        <div class="input-group">
                                                                            <div class="custom-file">
                                                                                <input type="file" name="country_images[{{$country->id}}]" readonly placeholder="{{__("Browse…")}}" class="custom-file-input" id="product_design_{{$country->id}}">
                                                                                <input type="hidden" value="{{$country->product_image_name}}" name="country_image_names[{{$country->id}}]" class="custom-file-input">
                                                                                <label class="custom-file-label" for="inputGroupFile01">{{__("Browse…")}}</label>
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                    <img class="uploaded-img zoom-image" width="100" src="{{$country->product_image}}" />
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="row py-0 card-body">
                                                            <div class="card col-6" >
                                                                <div class="card-body">
                                                                    <h6 class="card-title"><u>{{__("Cities")}}</u></h6>
                                                                    <div class=" country_city_block select_wrapper">
                                                                        <div class="mb-2">
                                                                            <a class="select_all toggle_select btn-link" href="javascript:void[0]">{{__("Select All")}}</a>
                                                                            <a class="unselect_all toggle_select btn-link mx-2 " href="javascript:void[0]">{{__("Unselect All")}}</a>
                                                                        </div>
                                                                        @foreach($country->cities as $city)
                                                                            <div class="form-check form-check-inline">
                                                                                <div class="custom-control custom-checkbox">
                                                                                    <input data-country-id="{{$country->id}}" value="{{$city->id}}" @if(in_array($city->id,$city_ids[$country->id])) checked @endif name="cities[{{$country->id}}][]" type="checkbox" id="city_{{$city->id}}" class="custom-control-input product-checkbox repeatable-checkbox cities-checkbox validate[minCheckbox[1]]" >
                                                                                    <label class="custom-control-label" for="city_{{$city->id}}">{{$city->name}} </label>
                                                                                </div>
                                                                            </div>
                                                                        @endforeach
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            <div class="card col-6" >
                                                                <div class="card-body">
                                                                    <h6 class="card-title"><u>{{__("Regions")}}</u></h6>
                                                                    <div class=" city_regions_block select_wrapper">
                                                                        <div class="mb-2">
                                                                            <a class="select_all toggle_select btn-link" href="javascript:void[0]">{{__("Select All")}}</a>
                                                                            <a class="unselect_all toggle_select btn-link mx-2 " href="javascript:void[0]">{{__("Unselect All")}}</a>
                                                                        </div>
                                                                        @foreach($country->regions()->whereIn("city_id",$city_ids[$country->id])->get(['id','name']) as $region)
                                                                            <div class="form-check form-check-inline">
                                                                                <div class="custom-control custom-checkbox">
                                                                                    <input value="{{$region->id}}" @if(in_array($region->id,$region_ids[$country->id])) checked @endif name="regions[{{$country->id}}][]" type="checkbox" id="group_{{$region->id}}" class="custom-control-input country-regions-checkbox validate[minCheckbox[1]]" >
                                                                                    <label class="custom-control-label" for="group_{{$region->id}}">{{$region->name}} </label>
                                                                                </div>
                                                                            </div>
                                                                        @endforeach
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                            </div>
                                        @endforeach
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="control-label col-form-label">{{__("Status")}}</label>
                                    <div class="form-group">
                                        <div class="custom-control custom-radio">
                                            <input type="radio" @if($item->status==1) checked @endif class="custom-control-input pl-2 radio validate[groupRequired[status]]" id="active" value="1" name="status">
                                            <label class="custom-control-label" for="active">{{__("Active")}}</label>
                                        </div>
                                        <div class="custom-control custom-radio">
                                            <input type="radio" @if($item->status==0) checked @endif class="custom-control-input radio validate[groupRequired[status]]" id="inactive" value="0" name="status">
                                            <label class="custom-control-label" for="inactive">{{__("Inactive")}}</label>
                                        </div>
                                    </div>
                                </div>
                                <button type="submit" class="btn btn-success mr-2">{{__("Save")}}</button>
                                <a href="{{ route('products.index') }}" class="btn btn-dark">{{__("Back")}}</a>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade" id="productDataModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel1">
        <div class="modal-dialog modal-xl" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title" id="exampleModalLabel1">{{__("Country Based Details")}}</h4>
                    <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="form-group row offset-2">
                        <label class="col-2" for="product_country_id">{{__("Country")}}</label>
                        <select name="" id="product_country_id" class="filter_currency col-7 modal_country_DD validate[required] selectpicker">
                            <option value="">{{__("Select Country")}}</option>
                            @foreach($countries as $item)
                                <option data-currency="{{$item->currency}}" @if( in_array($item->id,$country_ids) ) disabled @endif value="{{$item->id}}">{{$item->name}}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="form-group text-center mb-3" id="modal-hint-result" style="color:red;display:none;margin:3px 10px;">{{__("Please Fill Required Fields")}}</div>

                    <div class="form-group text-center">
                        <button type="button" data-module-name="products" class="btn btn-primary add_country_details_btn">{{__("Save")}}</button>
                        <button type="button" data-dismiss="modal" class="btn btn-dark">{{__("Cancel")}}</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade" id="imgModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel1">
        <div class="modal-dialog" role="document">
            <img class="modal-content" height="500" id="modal-img">
        </div>
    </div>
    <!-- ============================================================== -->
    <!-- End Container fluid  -->
    <!-- ============================================================== -->
@endsection
<!-- ============================================================== -->
<!-- footer -->
<!-- ============================================================== -->
@section('footer')
    @include('layouts.partials.footer')
@endsection
<!-- ============================================================== -->
<!-- End footer -->
<!-- ============================================================== -->

@section('scripts')
    @include('layouts.partials.scripts')
@endsection