@extends('layouts.master')
@section('content')
<style>
    .table-set th {
        font-size: 12px !important;
        padding: 5px !important
    }

    .table-set td {
        font-size: 12px !important;
        padding: 5px !important
    }

    .dataTable .btn-default {
        letter-spacing: 1px
    }

    .form-s2 .select2-container--default .select2-selection--single .select2-selection__rendered {
        font-size: 13px;
        line-height: 30px
    }

    .form-s2 .select2-container .select2-selection--single {
        height: 30px !important;
    }

    .form-s2 .select2-container--default .select2-selection--single .select2-selection__arrow {
        height: 30px;
    }

</style>
<div class="row mt-2 mb-3">
    <div class="col-lg-6 col-md-6 col-sm-6">
        <h2 class="_head01">Retailer <span> Management</span></h2>
    </div>
    <div class="col-lg-6 col-md-6 col-sm-6">
        <ol class="breadcrumb">
            <li><a href="#"><span>Route Plan</span></a></li>
            <li><span>Change</span></li>
        </ol>
    </div>
</div>
<div class="row">
    <div class="col-md-12">
        <div class="card PB-10">
            <div class="row m-0">
                <div class="col-6 p-0">
                    <div class="header addPR-head">
                        <h2>Current <span>Route</span></h2>
                    </div>
                    <div class="row m-0">
                        <div class="col-md-4 PT-5 pr-0">
                            <label class="font12 mb-0">Select ASM/TSM</label>
                            <div class="form-s2">
                                <select class="form-control formselect asmTsmDD" placeholder="Select Area">
                                    <option selected disabled>Select ASM/TSM</option>
                                    @foreach ($asm as $a)
                                        <option value="{{ $a->employee_id }}">{{ $a->employee_first_name." ".$a->employee_last_name }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-md-4 PT-5 pr-0">
                            <label class="font12 mb-0">Select Order Booker</label>
                            <div class="form-s2">
                                <select class="form-control formselect obDD" placeholder="Select Area">
                                    <option selected disabled>Select Order Booker</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-md-4 PT-5">
                            <label class="font12 mb-0">Select Route</label>
                            <div class="form-s2">
                                <select class="form-control formselect routeDD" routeFrom="true" id="transferredFromRoute" placeholder="Select Area">
                                    <option selected disabled>Select Route</option>
                                    {{-- @foreach ($routes as $r)
                                        <option value="{{ $r->id }}">{{ $r->name }}</option>
                                    @endforeach --}}
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="col-12">
                        <hr class="mt-10 mb-10">
                    </div>
                    <div class="col-12 retailerTableRoutePlanChange transferFromTblDiv PB-10">
                        <table class="table table-hover dt-responsive nowrap table-set" id="transferFromTbl"
                            style="width:100%">
                            <thead>
                                <tr>
                                    <th>Retailer Name</th>
                                    <th>Segment</th>
                                    <th>Locality</th>
                                    <th>Added By</th>
                                    <th>Action</th>
                                </tr>
                            </thead>
                            <tbody>
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="col-6 p-0">
                    <div class="_selectProList h-100">
                        <div class="header ProListHD">
                            <h2 class="w-100">New <span> Route</span></h2>
                        </div>
                        <div class="row m-0 PB-10 mb-10" style="background-color:#fff;">
                            <div class="col-md-4 PT-5 pr-0">
                                <label class="font12 mb-0">Select ASM/TSM</label>
                                <div class="form-s2">
                                    <select class="form-control formselect asmTsmDD" placeholder="Select Area">
                                        <option selected disabled>Select ASM/TSM</option>
                                        @foreach ($asm as $a)
                                            <option value="{{ $a->employee_id }}">{{ $a->employee_first_name." ".$a->employee_last_name }}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-4 PT-5 pr-0">
                                <label class="font12 mb-0">Select Order Booker</label>
                                <div class="form-s2">
                                    <select class="form-control formselect obDD" routeTo="true" id="transferredToEmp" placeholder="Select Area">
                                        <option selected disabled>Select Order Booker</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-4 PT-5">
                                <label class="font12 mb-0">Select Route</label>
                                <div class="form-s2">
                                    <select class="form-control formselect transferToRouteDD" routeFrom="false" placeholder="Select Area">
                                        <option selected disabled>Select Route</option>
                                        {{-- @foreach ($routes as $r)
                                            <option value="{{ $r->id }}">{{ $r->name }}</option>
                                        @endforeach --}}
                                    </select>
                                </div>
                            </div>
                        </div>
                        <div class="col-12 retailerTableRoutePlanChange transferToTblDiv PB-10">
                            <table class="table table-hover dt-responsive nowrap table-set"
                                id="transferToTbl" style="width:100%">
                                <thead>
                                    <tr>
                                        <th>Retailer Name</th>
                                        <th>Segment</th>
                                        <th>Locality</th>
                                        <th>Added By</th>
                                        <th>Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
                <div class="col-md-12 text-center PT-10">
                    <a href="/" class="btn btn-primary btn-cancel mr-2">Cancel</a>
                    <button type="button" class="btn btn-primary" id="saveRoutePlanChanges">Save</button>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection