@extends('admin.layouts.main')

@section('title')
Franchise
@endsection

@section('content')

<main>
    <div class="two-col">

        @include("admin.common.sidebar")

        <div class="right-sec detail-page">
            <nav aria-label="breadcrumb">
				<ol class="breadcrumb">
					<li class="breadcrumb-item" aria-current="page"><a href="{{ route('admin.franchise.index')}}">{{ @trans('franchises.franchises') }}</a></li>
					<li class="breadcrumb-item active" aria-current="page">{{ @trans('franchises.detail') }}</li>
				</ol>
			</nav>
            <div class="bg-white profile-header">
                <div class="profile-detail">
                    <div class="frachise-details">
                        <span class="franchise-img"><img src="{{ $franchiseDetail->logo_src}}" alt="Franchise"></span>
                        <div class="about">
                            <h2 class="name">{{$franchiseDetail->name ?? '-'}}
                                {{-- @permission('franchise-delete')
                                <a href="javascript:void(0)" class="deletepopup"><i
                                        class="material-icons delete">delete</i></a>
                                @endpermission --}}
                            </h2>
                            <div class="franchise-tags">
                                <span class="country">{{$franchiseDetail->countries->name ?? ''}}</span>

                                @if($franchiseDetail->franchise_type == "coaching")
                                <span class="admin-tag">{{ @trans('franchises.coaching') }}</span>
                                @elseif($franchiseDetail->franchise_type == 'mystery_program')
                                <span class="admin-tag">{{ @trans('franchises.mystry_program') }}</span>
                                @else
                                <span class="admin-tag">{{ @trans('franchises.recruitment') }}</span>
                                @endif

                                <span class="date"><i class="material-icons">date_range</i>{{date('d M
                                    Y',strtotime($franchiseDetail->created_at))}}</span>
                                @if($franchiseDetail->status == 'active')
                                <span class="badge badge-pill badge-success">{{ @trans('franchises.active') }}</span>
                                @elseif($franchiseDetail->status == 'draft')
                                <span class="badge badge-pill badge-info">{{ @trans('franchises.draft') }}</span>
                                @else
                                <span class="badge badge-pill badge-secondary">{{ @trans('franchises.inactive') }}</span>
                                @endif
                            </div>
                        </div>
                    </div>
                    <div class="ml-auto detail-statistics">
                        <div class="stat text-center">
                            <span>0</span>
                            <p>{{ @trans('franchises.clients') }}</p>
                        </div>
                        <div class="stat text-center">
                            <span>0</span>
                            <p>{{ @trans('franchises.jobs') }}</p>
                        </div>
                        <div class="stat text-center">
                            <span>0</span>
                            <p>{{ @trans('franchises.candidates') }}</p>
                        </div>
                        <div class="stat text-center">
                            <span>0</span>
                            <p>{{ @trans('franchises.invoice') }}</p>
                        </div>
                        <div class="stat text-center">
                            <span>0</span>
                            <p>{{ @trans('franchises.vouchers') }}</p>
                        </div>
                    </div>
                </div>
                <!-- Nav tabs -->
                <ul class="nav nav-tabs tabs" role="tablist">
                    <li class="nav-item">
                        <a class="nav-link" :class="{'active' : current_tab == 'details'}" @click="tab('details')">{{
                            @trans('franchises.details') }}</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" :class="{'active' : current_tab == 'docs'}" @click="tab('docs')">{{
                            @trans('franchises.documents') }}</a>
                    </li>
                </ul>
            </div>

            <div class="detail-content mt-4" id="tabs">
                <!-- Tab panes -->
                <div class="tab-content box">
                    @include('admin.modules.franchise.show_details')
                    @include('admin.modules.franchise.show_docs')
                </div>
            </div>
        </div>
    </div>
</main>

@endsection
@push('pageModals')
<div class="modal" tabindex="-1" role="dialog" id="modalDeleteConfirm">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Confirm</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <p>Are you sure you want to delete?</p>
            </div>
            <div class="modal-footer d-flex justify-content-between">
                <button type="button" class="btn btn-cncl" data-dismiss="modal">Cancel</button>
                <a class="btn btn-danger"
                    href="{{route('admin.franchise.destroy',['id' => $franchiseDetail->id])}}">Delete</a>
            </div>
        </div>
    </div>
</div>
<div class="modal" tabindex="-1" role="dialog" id="modalDeleteDocConfirm">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">{{ @trans('delete_modal.confirm') }}</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <p>{{ @trans('delete_modal.confirmation') }}?</p>
            </div>
            <div class="modal-footer d-flex justify-content-between">
                <button type="button" class="btn btn-cncl" data-dismiss="modal">{{ @trans('delete_modal.cancel')
                    }}</button>
                <button type="submit" class="btn btn-danger" @click="destroy">{{ @trans('delete_modal.delete')
                    }}</button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="attachModal" style="z-index: 9999;" data-backdrop="static">
    <div class="modal-dialog modal-md modal-dialog-centered">
        <div class="modal-content">

            <form id="frmAttach" method="post" enctype="multipart/form-data" action="">

                <input type="hidden" name="franchiseId" id="franchiseId" value="" />
                <input type="hidden" name="docTypeId" id="docTypeId" value="" />

                @csrf

                <!-- Modal Header -->
                <div class="modal-header new-light-bg border-0">
                    <h4 class="modal-title regular body-font-size">Attach</h4>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>

                <!-- Modal body -->
                <div class="modal-body">
                    <p class="mb-1 small-font-size title1">Upload your documents</p>
                    <p class="gray xs-font-size title2">You can upload upload multiple files at a time.</p>

                    <div class="set attach-list-row">
                        <div class="form-group mb-1 documentFileNameClass">
                            <label class="control-label">Upload File</label>
                            <div class="custom-file w-100 file-type-new">
                                <input type="file" class="custom-file-input w-100 fileInput" name="document[]">
                                <label class="custom-file-label bg-white form-control text-left d-flex">Choose
                                    file...</label>
                                <span class="attachment-bg"><img src="{{ asset('img/admin/ic-attachment-dark.svg') }}"
                                        alt="ic-attachment" /></span>
                            </div>
                            <span class="m-0 xs-font-size showDocumentFileName"></span>
                        </div>
                        <div class="align-items-start d-flex">
                            <div class="form-group mb-0 mr-2">
                                <label class="control-label">Document Name</label>
                                <input type="text" class="form-control titleInput" placeholder="Type here..."
                                    name="title[]" />
                            </div>
                            <a href="javascript:void(0)" class="mt-4 px-1 pt-3 pb-2 act text-center adder"><span
                                    class="material-icons gray">add</span></a>
                        </div>
                        <hr />
                    </div>


                </div>

                <!-- Modal footer -->
                <div class="modal-footer justify-content-center border-top-0 pt-0 pb-4">
                    <input type="submit" class="btn btn-em submitfrmAttach" value="Submit" />
                </div>

            </form>

        </div>
    </div>
</div>
<div class="modal fade" id="editAttachModal" style="z-index: 9999;" data-backdrop="static">
    <div class="modal-dialog modal-md modal-dialog-centered">
        <div class="modal-content">

            <form id="editFrmAttach" method="post" enctype="multipart/form-data" action="">

                <input type="hidden" name="uploadId" id="uploadId" value="" />
                <input type="hidden" name="franchiseId" id="franchiseId" value="" />
                <input type="hidden" name="docTypeId" id="docTypeId" value="" />
                @csrf

                <!-- Modal Header -->
                <div class="modal-header new-light-bg">
                    <h4 class="modal-title regular body-font-size">Edit File</h4>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>
                <!-- Modal body -->
                <div class="modal-body">

                    <p class="mb-1 small-font-size title1">Edit your documents</p>
                    <p class="gray xs-font-size title2">Valid files are PDF, Word, Images(png/jpg).</p>

                    <div class="attach-list-row">
                        <div class="form-group mb-1 documentFileNameClass">
                            <label class="control-label">Upload File</label>
                            <div class="custom-file w-100 file-type-new">
                                <input type="file" class="custom-file-input w-100" name="document[]">
                                <label class="custom-file-label bg-white form-control text-left d-flex">Choose
                                    file...</label>
                                <span class="attachment-bg"><img src="{{ asset('img/ic-attachment-dark.svg') }}"
                                        alt="ic-attachment"></span>
                            </div>
                            <span class="m-0 xs-font-size documentFileName"></span>
                        </div>
                        <div class="align-items-start d-flex">
                            <div class="form-group mb-0 mr-2">
                                <label class="control-label">Document Name</label>
                                <input type="text" class="form-control editTitleInput" id="document_title"
                                    name="title[]">
                            </div>
                        </div>
                    </div>

                </div>

                <!-- Modal footer -->
                <div class="modal-footer justify-content-center border-top-0 pt-0 pb-4">
                    <input type="submit" class="btn btn-em submitfrmEditAttach" value="Submit" />
                </div>

            </form>

        </div>
    </div>
</div>
@endpush
@push('pageJs')

<script type="text/javascript" src="{{ asset('js/admin/franchise_show.js') }}"></script>

<script type="text/javascript">
    var deleteUrl = "{{ route('admin.franchise.delete_document') }}";
    @if(Session::has('message'))
    Snackbar.show({
        pos: 'bottom-right',
        text: "{!! session('message') !!}",
        actionText: 'Okay'
    });
    @endif
    // Js for checking whether checkbox is checked or not start
    $(window).on("load", function() {
        $(function() {
            $(".job-progress .custom-control-input").click(function() {
                if ($(this).is(":checked")) {
                    $("#can-progress .checked").show();
                    $("#can-progress .not-checked").hide();
                } else {
                    $("#can-progress .checked").hide();
                    $("#can-progress .not-checked").show();
                }
            });

            $("#can-sourcing .custom-control-input").click(function() {
                if ($(this).is(":checked")) {
                    $("#can-sourcing .checked").show();
                    $("#can-sourcing .not-checked").hide();
                } else {
                    $("#can-sourcing .checked").hide();
                    $("#can-sourcing .not-checked").show();
                }
            });

        });
    });
    // Js for checking whether checkbox is checked or not end
    $(document).on('click', '.deletepopup', function() {
        $("#modalDeleteConfirm").modal();
    });
</script>
@endpush