@extends('mainlayout.layout')


@section('title')
@endsection

@push('css')
<link href="{{ asset('/web/assets/libs/bootstrap-datepicker/css/bootstrap-datepicker.min.css')}}" rel="stylesheet"
    type="text/css">
<link rel="stylesheet" href="{{ asset('/web/assets/libs/@chenfengyuan/datepicker/datepicker.min.css')}}">
@endpush


@section('content')

<!-- start page title -->
<div class="row">
    <div class="col-12">
        <div class="page-title-box d-flex align-items-center justify-content-between">
            <h4 class="mb-0 font-size-18">shop</h4>
        </div>
    </div>
</div>
<!-- end page title -->

<div class="row">


    <div class="col-lg-12">
        <div class="card">
            <div class="card-body">
                <div class="row">
                    <div class="col-10">
                        <h4 class="card-title" style="display:inline">Details</h4>
                    </div>
                    <div class="col-2">
                        <a href="/shops/edit_shop/{{$shop->shop_id}}" class="btn btn-warning" style="width:100%">
                            <i class="bx bxs-cog align-middle mr-1"></i> Edit
                        </a>

                    </div>


                </div>


                <div class="row mt-2">


                    <div class="col-lg-12 align-items-left mt-2">
                        <div class="text-lg-left mt-4 mt-lg-0">
                            <div class="row mb-4">
                                <div class="col-2">
                                    <div>
                                        <p class="text-muted mb-2">Shop Name</p>
                                        <h5 class="mb-0">{{$shop->name}}</h5>
                                    </div>
                                </div>
                                <div class="col-2">
                                    <div>
                                        <p class="text-muted mb-2">Country Of Operation</p>
                                        <h5 class="mb-0">{{$shop->country->country}}</h5>
                                    </div>
                                </div>
                                <div class="col-2">
                                    <div>
                                        <p class="text-muted mb-2">Region</p>
                                        <h5 class="mb-0">{{$shop->region->name}}</h5>
                                    </div>
                                </div>
                                <div class="col-2">
                                    <div>
                                        <p class="text-muted mb-2">Location</p>
                                        <h5 class="mb-0">{{$shop->location}}</h5>
                                    </div>
                                </div>

                                <div class="col-2">
                                    <div>
                                        <p class="text-muted mb-2">Telco</p>
                                        <h5 class="mb-0">{{$shop->telco->telco}}</h5>

                                    </div>
                                </div>
                                <div class="col-2">
                                    <div>
                                        <p class="text-muted mb-2">Campaign</p>
                                        <h5 class="mb-0">{{$shop->campaign->campaign_name}}</h5>

                                    </div>
                                </div>



                            </div>

                        </div>
                    </div>

                </div>

                <div class="row mt-2">


                    <div class="col-lg-12 align-items-left mt-2">
                        <label class="text-grey3">Person 1 Details</label>
                        <div class="text-lg-left mt-4 mt-lg-0">
                            <div class="row mb-4">
                                <div class="col-3">
                                    <div>
                                        <p class="text-muted mb-2">Full Name</p>
                                        <h5 class="mb-0">{{$shop->person1_name}}</h5>
                                    </div>
                                </div>
                                <div class="col-3">
                                    <div>
                                        <p class="text-muted mb-2">Title</p>
                                        <h5 class="mb-0">{{$shop->person1_title}}</h5>
                                    </div>
                                </div>
                                <div class="col-3">
                                    <div>
                                        <p class="text-muted mb-2">MSISDN</p>
                                        <h5 class="mb-0">{{$shop->person1_msisdn}} </h5>
                                    </div>
                                </div>
                                <div class="col-3">
                                    <div>
                                        <p class="text-muted mb-2">Email</p>
                                        <h5 class="mb-0">{{$shop->person1_email}}</h5>
                                    </div>
                                </div>



                            </div>

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

                <div class="row mt-2">


                    <div class="col-lg-12 align-items-left mt-2">
                        <label class="text-grey3">Person 2 Details</label>
                        <div class="text-lg-left mt-4 mt-lg-0">
                            <div class="row mb-4">
                                <div class="col-3">
                                    <div>
                                        <p class="text-muted mb-2">Full Name</p>
                                        <h5 class="mb-0">{{$shop->person2_name}}</h5>
                                    </div>
                                </div>
                                <div class="col-3">
                                    <div>
                                        <p class="text-muted mb-2">Title</p>
                                        <h5 class="mb-0">{{$shop->person2_title}}</h5>
                                    </div>
                                </div>
                                <div class="col-3">
                                    <div>
                                        <p class="text-muted mb-2">MSISDN</p>
                                        <h5 class="mb-0">{{$shop->person2_msisdn}} </h5>
                                    </div>
                                </div>
                                <div class="col-3">
                                    <div>
                                        <p class="text-muted mb-2">Email</p>
                                        <h5 class="mb-0">{{$shop->person2_email}}</h5>
                                    </div>
                                </div>



                            </div>

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



            </div>
        </div>

    </div>

</div>



<shop-filter :shop_id="{{$shop->shop_id}}"></shop-filter>


@endsection


@push('scripts')

<script src="{{ asset('/web/assets/libs/@chenfengyuan/datepicker/datepicker.min.js')}}"></script>

<script src="{{ asset('/web/assets/libs/bootstrap-datepicker/js/bootstrap-datepicker.min.js')}}"></script>

@endpush