@extends('layout.basic.main')
@push('css')
{{-- <link rel="stylesheet" href="/css/broadcast/style.css?v={{config("sns-line.version")}}"> --}}
{{-- <link rel="stylesheet" href="/css/friendlist/style.css?v={{config("sns-line.version")}}"> --}}
<link rel="stylesheet" href="/css/booking/booking-all-slot.css?v={{ config('sns-line.version') }}">
<link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.15.4/css/all.css"
    integrity="sha384-rqn26AG5Pj86AF4SO72RK5fyefcQ/x32DNQfChxWvbXIyXFePlEktwD18fEz+kQU" crossorigin="anonymous">

<style>
body {
    color: #51595C;
    font-weight: bold;
}

select option {
    color: #51595C;
}

td,
span,
div,
option {
    font-weight: bold;
}

a {
    cursor: pointer;
}

h2 {
    font-weight: bold;
}

select {
    appearance: auto !important;
}

.table>thead>tr>th {
    border-bottom: none;
}

#home thead th {
    background-color: #BDD2D6 !important;
    font-weight: bold;
    color: #51595C;
    font-size: 12px !important;
}

#menu1 thead th {
    background-color: #BDD2D6 !important;
    font-weight: bold;
    color: #51595C;
    font-size: 12px !important;
}

#tab-content-table .active {
    background-color: white !important;
}

.nav-content-event li.active a {
    background-color: #7D9195 !important;
    color: white !important;
    border: none;
    /*border-color: #707070;*/
    /*border-top: 1px solid #707070;*/
}

.nav-content-event li.active a:hover,
.nav-content-event li.active a:focus {
    background-color: #7D9195 !important;
    color: white;
    /*border-color: #707070;*/
    /*border-top: 1px solid #707070;*/
    border: none;
}

.nav-content-event li {
    width: 140px;
    text-align: center;
}

.nav-content-event>li {
    background-color: white;
    color: #51595C;
    border: none;
    /*border-bottom: 1px solid #707070;*/
}

.nav-content-event>li:hover {
    background-color: white;
    color: #51595C;
    border: none;
    /*border-bottom: 1px solid #707070;*/
}

.nav-content-event>li a {
    color: #51595C;
    border: none;
    font-weight: bold;
    padding-top: 9px;
}

#tab-content-table {
    border-top: 2px solid #7D9195;
}

form#form-search input[type=text] {
    padding: 10px;
    font-size: 15px;
    border: 1px solid #CECECE;
    float: left;
    width: 272px;
    height: 40px;
    margin-right: 0px;
    border-right: none;
    border-radius: 4px 0 0 4px;
    color: #51595C;
    outline: none;
}

form#form-search .btn-search {
    float: left;
    width: 11%;
    padding: 0px 7px 5px 0px;
    background: #ffffff;
    font-size: 19px;
    border: 1px solid #CECECE;
    border-left: none;
    cursor: pointer;
    border-left: none;
    height: 40px;
    border-radius: 0 4px 4px 0;
    color: rgba(152, 166, 181, 1);
    outline: none;
}

#keyword::placeholder {
    color: rgba(176, 194, 198, 1);
    text-align: center;
}

#form-search select {
    width: 155px;
    color: rgba(176, 194, 198, 1);
     !important;
    height: 40px;
}

.btn {
    font-weight: bold;
    outline: none;
}

.u-title {
    text-align: center;
    background-color: #7D9195;
    color: white;
    padding: 9px;
    border-radius: 5px;
    margin-bottom: 14px;
    margin-right: 15px;
    font-weight: bold;
}

.u-content {
    background-color: #F2F2F2;
    color: #51595C;
    padding: 9px;
    border-radius: 5px;
    margin-bottom: 14px;
    height: 39px;
}

.title-form {
    border-left: 7px solid #08BF5A;
    font-weight: bold;
    font-size: 18px;
    padding: 5px 10px;
    /* margin: 21px 0; */
    margin-top: 33px;
    margin-bottom: 20px;
}

.b-title-info {
    text-align: center;
    background-color: #F6F6F6;
    color: #51595C;
    padding: 9px;
    border-radius: 5px;
    margin-bottom: 14px;
    font-weight: bold;
}

.b-content_info {
    border: 1px solid #B0C2C6;
    color: #51595C;
    padding: 8px;
    border-radius: 5px;
    margin-bottom: 14px;
}

.f-title-info {
    text-align: left;
    background-color: #ffffff;
    color: #51595C;
    padding: 9px;
    border-radius: 5px;
    margin-bottom: 14px;
    font-weight: bold;
}

.f-content_info {
    border: 1px solid #B0C2C6;
    background-color: #F4F6F7;
    color: #51595C;
    padding: 8px;
    border-radius: 5px;
    margin-bottom: 14px;
    height: 38px;
}

#adminBookingModal select {
    appearance: auto;
    height: 37px;
    border-color: #B0C2C6;
}

#adminBookingModal .select2-container--default .select2-selection--single {
    height: 37px;
    border-color: #B0C2C6;
}

#adminBookingModal .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 37px;
}

#adminBookingModal .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 33px;
}

#adminBookingModal input[type='text'],
#adminBookingModal input[type='number'] {
    height: 37px;
    border-color: #B0C2C6;
}

.change-status-modal input[type='text'],
.change-status-modal input[type='number'],
.change-status-modal select,
.change-status-modal input[type='time'] {
    height: 37px;
    border-color: #B0C2C6;
}

.hidden {
    display: none;
}

.pl-0 {
    padding-left: 0;
}

/*.fade {*/
/*    transform: unset !important;*/
/*    animation: unset !important;*/
/*}*/
.fade.in {
    transform: unset !important;
    animation: unset !important;
}

.modal-content {
    -webkit-animation-name: unset !important;
    -webkit-animation-duration: 0.6s;
    animation-name: unset !important;
    ;
    animation-duration: unset !important;
}

.modal.fade .modal-dialog {
    -webkit-transition: unset !important;
    -o-transition: -unset !important;
    transition: unset !important;
    -webkit-transform: unset !important;
    -ms-transform: unset !important;
    -o-transform: unset !important;
    transform: unset !important;
}

.date_table {
    background-color: #F6F6F6;
    position: relative;
    color: #51595C;
    display: flex;
    align-items: center;
    font-weight: bold;
    border-radius: 4px;
    font-size: 18px;
}

.time_table {
    background-color: #F2F2F2;
    color: #51595C;
    padding: 10px 20px;
    border-radius: 4px 4px 0 0;
    font-weight: bold;
    font-size: 18px;
}

.date_table_done {
    background-color: #7D9195;
    color: white;
    display: flex;
    align-items: center;
    border-radius: 4px;
    font-weight: bold;
    font-size: 18px;
}

.time_table_done {
    background-color: #7D9195;
    color: #ffffff;
    padding: 10px 20px;
    border-radius: 4px 4px 0 0;
    font-weight: bold;
    font-size: 18px;
}

.date_table_done div,
.time_table_done span,
.date_table div,
.time_table span {
    font-weight: bold;
}

.btn:hover {
    opacity: 0.7;
}

td {
    color: #51595C;
}

.table>tbody>tr>td {
    border: none;
    border-bottom: 1px solid #F2F2F2;
}

.fa-times {
    padding: 2px 6px;
}

.fa-times:hover {
    background-color: #96ADB2;
    color: #FFFFFF !important;
    border-radius: 4px;
    padding: 2px 6px;
}

.text-required {
    color: #F44336;
    float: right;
    font-weight: bold;
}

.btn-cus-a:active {
    box-shadow: 1px -3px 3px rgb(128 128 128 / 73%) !important
}

/*.btn:active, .btn:active:focus{*/
/*    box-shadow: 1px -3px 3px rgb(128 128 128 / 73%) !important;*/
/*    outline: none;*/
/*}*/
.btn:focus {
    outline: none;
}

.w-status {
    width: 12%;
    min-width: 80px;
}

.w-name {
    width: 20%;
}

.w-system {
    width: 16%;
}

.w-plan {
    width: 18%;
}

.w-quantity {
    width: 12%;
    min-width: 40px;
    text-align: center;
}

.w-create {
    width: 30%;
    min-width: 200px;
}

.w-btn-e {
    width: 90px;
}

.createTime .datetimepicker {
    padding-left: 30px;
}

.createTime .fa-calendar {
    position: absolute;
    top: 11px;
    left: 7px;
}

.b-select {
    position: relative;
}

.b-select i {
    position: absolute;
    right: 9px;
    top: 10px;
    color: rgba(137, 143, 144, 1);
    font-size: 22px;
}

tr:hover td {
    background-color: #F4FBF2;
    /*cursor: pointer;*/
}

li.active {
    background-color: unset !important;
}

.nav-tabs>li {
    margin-bottom: 0 !important;
}

.ui_search_line_user {
    position: absolute;
    left: 15px;
    top: 37px;
    right: 15px;
    height: fit-content;
    display: none;
    background-color: #d7d7d7;
    z-index: 1;
    overflow-y: scroll;
    max-height: 200px;
}

.ui_search_item {
    padding: 5px 10px;
    cursor: pointer;
}

.ui_search_item:hover {
    background-color: #e9e9e9;
}

.btn-status-label {
    cursor: auto !important;
}

.btn-status-label:hover {
    opacity: 1 !important;
}

.btn-status-label:active,
.btn-status-label:focus,
.btn-status-label:active:focus {
    box-shadow: none !important;
}
</style>
@endpush
@section('content')
<article class="" id="booking_all_slot" v-cloak>
    <section class="taglist tmp" id="list-slot-event">
        <div class="row">
            <div class="col-sm-12">
                <h2 class="title">{{ $eventDetail->title }}参加者リスト</h2>
            </div>
        </div>
        <input id="event_id" value="{{ $eventDetail->id }}" name="event_id" type="hidden">
        <input id="type_event" value="{{ $typeEvent }}" name="type_event" type="hidden">

        <ul class="nav nav-tabs nav-content-event" style="margin-top: 20px; border-bottom: none !important;">
            <li class=" @if ($active_tab == 1 || !$active_tab) active @endif">
                <a href="/basic/booking_event/event/booking-all-slot/{{ $eventDetail->id }}?active_tab=1">開催予定</a>
            </li>
            <li class=" @if ($active_tab == 2) active @endif">
                <a href="/basic/booking_event/event/booking-all-slot/{{ $eventDetail->id }}?active_tab=2">開催済み</a>
            </li>
        </ul>

        <div class="tab-content" id="tab-content-table">
            <div id="home" class="tab-pane  @if ($active_tab == 1 || !$active_tab) in active @endif ">
                <div class="form-group form-inline">
                    <div class="pull-left search" style="display: flex; align-items: center; margin-top: 15px">
                        <form action="{{ route('allBooking', ['id' => $eventDetail->id]) }}" method="get"
                            style="display: flex" id="form-search">
                            <div style="display: flex">
                                <input type="hidden" value="1" name="active_tab">
                                <input type="text" name="keyword" value="{{ $keyword }}" id="keyword"
                                    placeholder="LINE名・システム表示名">
                                <button type="submit" class="btn-search " id="search_name"><i
                                        class="fa fa-search"></i></button>
                            </div>

                            <div style="margin-right: 15px; margin-left: 15px">
                                <div class="b-select">
                                    <select class="form-control" name="booking_status" id="booking_status"
                                        style="appearance: none !important;">

                                        <option value="0" {{ $bookingStatus == 0 ? 'selected' : '' }}>全て表示
                                        </option>
                                        <option value="1" {{ $bookingStatus == 1 ? 'selected' : '' }}>参加予定</option>
                                        <option value="2" {{ $bookingStatus == 2 ? 'selected' : '' }}>参加否認</option>
                                        <option value="3" {{ $bookingStatus == 3 ? 'selected' : '' }}>承認待ち
                                        </option>
                                        <option value="4" {{ $bookingStatus == 4 ? 'selected' : '' }}>キャンセル済み
                                        </option>
                                    </select>
                                    <i class="far fa-angle-down"></i>
                                </div>
                            </div>
                        </form>
                        <div>
                            <button type="button" class="btn btn-sns-line btn-sns-line-success"
                                style="background-color: #08BF5A; border-color: #08BF5A;    padding: 9px 14px; "
                                data-toggle="modal" data-target="#adminBookingModal"
                                v-on:click="showAdminBooking()">手動登録</button>
                        </div>
                    </div>
                    <div class="pull-right" style="margin-right: 0 !important;">
                        <button type="button" class="btn btn-sns-line btn-sns-line-dark" @if ($bSlotDoing && $bSlotDoing->count() ==0) disabled
                            @else onclick="exportCsv(1)" @endif style=" margin-top: 15px; padding: 9px 14px; ">CSV書出し
                            <img src="/images/output-csv-ic.png" style="width: 17px; padding-bottom: 2px"></button>
                    </div>
                    <div class="clearfix"></div>
                </div>
                
                <div v-for="slot in bSlotDoing"  v-if="slot.bookings.length > 0" class="row" style="display: flex; margin-left: 1px; margin-bottom: 15px">
                    @if ($typeEvent == 0)
                    <div class="col-md-2 date_table" style="">
                        <div>
                            @{{ moment(slot.date_start_from).format('YYYY年') }}
                            <br>
                            @{{ moment(slot.date_start_from).format('MM月DD日') }}
                            (@{{ day_of_week[moment(slot.date_start_from).isoWeekday()] }})
                        </div>

                    </div>
                    @endif
                    <div class="{{ $typeEvent == 0 ? 'col-md-10' : 'col-md-12 pl-0' }}">
                        <div class="time_table">
                            @if ($typeEvent == 0)
                            <span>
                                @{{ slot.time_start }}
                                <span v-if="slot.time_end">〜@{{ slot.time_end }} </span>
                            </span>
                            @else
                            <span>
                                @{{ moment(slot.date_start_from).format('YYYY/MM/DD') }}(@{{ day_of_week[moment(slot.date_start_from).isoWeekday()] }})
                                〜
                                @{{ moment(slot.date_start_to).format('YYYY/MM/DD') }}(@{{ day_of_week[moment(slot.date_start_to).isoWeekday()] }})
                            </span>
                            @endif
                        </div>
                        <table class="table table-striped" style="border: none; margin: 0">
                            <thead>
                                <tr style="background: rgb(238, 238, 238);">
                                    <th class="w-status">ステータス</th>
                                    <th style="width: 90px; min-width: 65px"></th>
                                    <th class="w-name">LINE名</th>
                                    <th class="w-system">システム表示名</th>
                                    <th class="w-plan" style="min-width: 60px">予約プラン</th>
                                    <th class="w-quantity">参加人数</th>
                                    <th class="w-create">予約した日時</th>
                                    <th class="w-btn-e"></th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr style="background: #F4FBF2 !important; display: none">
                                    <td style="background: #F4FBF2">
                                        <input type="checkbox" :class="'slotCheck'+slot.id" :value="slot.id"
                                            @click="checkSlot(slot.id)">
                                    </td>
                                    <td colspan="2" style="font-weight: bold; text-align: left; background: #F4FBF2">

                                        <div style="display: none">
                                            開催日時：<span style="display: none" :id="'date_slot_'+slot.id"></span><br>
                                            締切日時：<span st :id="'deadline_slot_'+slot.id"></span>
                                            <label v-if="slot.plans.length > 0" class="label label-info">プランあり</label>
                                        </div>
                                    </td>
                                    <td style="background: #F4FBF2">
                                        <div :id="'change_status_all'+slot.id" hidden>
                                            <button type="button" class="btn btn-warning btn-sm" data-toggle="modal"
                                                style="background-color: #08BF5A; border-color: #08BF5A"
                                                :data-target="'#changeStatusAll'+slot.id"
                                                onclick="removeCssStatusAll()">
                                                全体予約変更
                                            </button>
                                        </div>
                                    </td>
                                    <td colspan="3" style="background: #F4FBF2"></td>
                                </tr>
                                <tr v-if="slot.bookings.length > 0" v-for="booking in slot.bookings" class="">
                                    <td :class="'check_all'+ slot.id +' check_user_'+booking.id">
                                        <span v-if="booking.status == 1 || booking.status == 5">参加予定</span>
                                        <span v-else-if="booking.status == 2">参加否認</span>
                                        <button v-else-if="booking.status == 3" type="button" class="btn btn-primary btn-sm btn-status-label"
                                            style="border-color: #5799DB; background-color: #5799DB; outline: none; ">
                                            承認待ち
                                        </button>
                                        <span v-else-if="booking.status == 4">キャンセル</span>
                                    </td>
                                    <td>
                                        <span v-if="booking.booking_from == 1" style="font-size: 13px; color: #08BF5A;word-break: keep-all;">手動登録</span>
                                    </td>
                                    <td :class="'has_emoji check_all' + slot.id + ' check_user_' + booking.id">
                                        <span><a class="link_my_page"
                                                :href="'/basic/friendlist/my_page/'+booking.line_user_id"
                                                target="_blank"
                                                style="font-weight: bold; text-decoration: underline">@{{ booking.line_user && booking.line_user.name ? booking.line_user.name : '-' }}</a></span>
                                    </td>
                                    <td :class="'has_emoji check_all'+ slot.id+ ' check_user_'+booking.id">
                                        <span>@{{ booking.line_user && booking.line_user.view_name ? booking.line_user.view_name : '-' }}</span>

                                    </td>
                                    <td :class="'has_emoji check_all'+slot.id+' check_user_'+booking.id">
                                        <div>
                                            @{{ booking.plan && booking.plan.name ? booking.plan.name : '-' }}
                                        </div>
                                    </td>
                                    <td style="text-align: center;">
                                        <div style="display: flex">
                                            <div style="width: 53%" class="font-weight-bold text-right">
                                                <span>@{{ booking.quantity }}</span>
                                            </div>
                                            <div style="width: 47%" class="font-weight-bold text-left">
                                                人
                                            </div>
                                        </div>
                                    </td>
                                    <td :class="'has_emoji check_all'+slot.id+' check_user_'+booking.id">
                                        @{{ moment(booking.created_at).format('YYYY年MM月DD日 HH時mm分') }}
                                    </td>
                                    <td>
                                        <button class="btn btn-sns-line btn-sns-line-secondary"
                                            v-on:click="showChangeStatus(slot , booking)">予約詳細</button>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                
                @if($bSlotDoing)
                <div style="display: flex; justify-content: center;">
                    {{ $bSlotDoing->appends(['active_tab' => $active_tab])->links() }}
                </div>
                @endif
                <div class=" change-status-modal modal fade" id="changeStatus" role="dialog" aria-hidden="true">
                    <div class="modal-dialog modal-lg" role="document">
                        <div class="modal-content" style="">
                            <div id="draft-modal-header" class="modal-header">
                                <button type="button" class="close" data-dismiss="modal"
                                    v-on:click="closeModalChangeStatus(detail_booking.id)" aria-hidden="true"
                                    style="opacity: 1;font-size: 27px">
                                    <span class="line-icon line-icon-close"><i class="fas fa-times"></i></span>
                                </button>
                                <h2 v-if="detail_booking.status == 3" class="text-center"> 【 予約リクエスト 】</h2>
                                <h2 v-else class="text-center"> 【 予約詳細 】</h2>
                            </div>
                            <div class="modal-body">
                                <input type="hidden" :value="detail_booking.status" :id="'status'+detail_booking.id">
                                <input type="hidden" :value="detail_booking.status"
                                    :id="'status_old'+detail_booking.id">
                                <input type="hidden" value="1" :id="'action'+detail_booking.id">
                                <input type="hidden" :value="detail_booking.id" id="user-booking">
                                <input type="hidden" :value="detail_booking.slot_id" :id="'slot_id'+detail_booking.id">

                                <div class="info-user"
                                    style=" padding-top: 15px;    box-shadow: #f4f6f7 0px 0px 0.2em, #f4f6f7 0px 0.2em 0.2em;">
                                    <div class="row">
                                        <div class="col-md-3 text-center" style="padding-left: 66px;">
                                            <div class="text-center">
                                                <img :src="detail_booking.line_user && detail_booking.line_user.avatar_url ? detail_booking.line_user.avatar_url : '/images/blank_avatar.png'"
                                                    onerror="this.onerror=null;this.src='/images/blank_avatar.png'"
                                                    width="100px;"
                                                    style="    border: 1px solid #F4F6F7;
                                                                                border-radius: 50%;margin-bottom: 15px;">
                                            </div>
                                            <div>
                                                <a :href="'/basic/chat-v3?friend_id='+detail_booking.line_user_id">
                                                    <button class="btn btn-sns-line btn-sns-line-success" type="button">
                                                        1:1チャット</button>
                                                </a>
                                            </div>

                                        </div>
                                        <div class="col-md-8">
                                            <div class="row">
                                                <div class="col-md-4 u-title"> LINE名
                                                </div>
                                                <div class="col-md-7 u-content" style="">
                                                    @{{ detail_booking.line_user && detail_booking.line_user.name ? detail_booking.line_user.name : '' }}
                                                </div>
                                            </div>
                                            <div class="row">
                                                <div class="col-md-4 u-title"> 友だち追加日時
                                                </div>
                                                <div class="col-md-7 u-content">
                                                    @{{ detail_booking.line_user && detail_booking.line_user.followed_at ? moment(detail_booking.line_user.followed_at).format('YYYY.MM.DD HH:mm') : '' }}
                                                    <span
                                                        v-if="detail_booking.line_user && detail_booking.line_user.is_old_friend == 1">
                                                        既存友だち
                                                    </span>
                                                    <span v-else>
                                                        新規友だち
                                                    </span>
                                                </div>
                                            </div>
                                            <div class="row">
                                                <div class="col-md-4  u-title">
                                                    最終メッセージ受信</div>
                                                <div class="col-md-7 u-content">
                                                    @{{ detail_booking.line_user && detail_booking.line_user.last_time_message ? moment(detail_booking.line_user.last_time_message).format('YYYY.MM.DD hh:mm') : '' }}
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="title-form">
                                    予約情報
                                </div>
                                <div class="row">
                                    <div class="col-md-3">
                                        <div class="b-title-info">
                                            参加日
                                        </div>
                                    </div>
                                    <div class="col-md-9" style="">
                                        <select class="form-control slot" name="slot" v-model="detail_booking.slot_id"
                                            v-on:change="changeSlot(detail_booking.slot_id)">
                                            <option v-for="( slot,index) in slotList" :value="slot.id">
                                                @if ($typeEvent == 0)
                                                <span>@{{ format1Date(slot.date_start_from, slot.time_start, slot.time_end) }}</span>
                                                @else
                                                <span>@{{ formatManyDate(slot.date_start_from, slot.date_start_to) }}</span>
                                                @endif
                                            </option>
                                        </select>
                                        <input type="hidden" :name="'slot_id_old'+ detail_booking.id"
                                            :id="'slot_id_old'+ detail_booking.id" :value="detail_booking.slot_id"
                                            class="form-control">

                                    </div>
                                </div>
                                <div class="row" v-show="plansList.length > 0">
                                    <div class="col-md-3">
                                        <div class=" b-title-info">
                                            利用プラン
                                        </div>
                                    </div>
                                    <div class="col-md-9 " style="">
                                        <div class="">
                                            <select class="form-control slot" :id="'plan'+detail_booking.id"
                                                v-model="detail_booking.plan_slot_id">
                                                <option v-for="( plan,index) in plansList" :value="plan.id">
                                                    @{{ plan.name }}
                                                </option>
                                            </select>
                                            <input type="hidden" :name="'plan_slot_id'+detail_booking.id"
                                                :id="'plan_slot_id'+detail_booking.id"
                                                :value="detail_booking.plan_slot_id" class="form-control">
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-3 ">
                                        <div class=" b-title-info">
                                            参加人数
                                        </div>
                                    </div>
                                    <div class="col-md-9 " style="">
                                        <input style="padding: 5px 15px;" type="number"
                                            :name="'quantity'+detail_booking.id" :id="'quantity'+detail_booking.id"
                                            class="form-control " v-model="detail_booking.quantity">
                                        <input type="hidden" :name="'quantity_old'+detail_booking.id"
                                            :id="'quantity_old'+detail_booking.id" class="form-control ">

                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-3 ">
                                        <div class=" b-title-info">
                                            予約した日時
                                        </div>
                                    </div>
                                    <div class="col-md-9 " style="">
                                        <div class="createTime" style="display: flex">
                                            <input class="bookingId" type="hidden" :value="detail_booking.id"
                                                name="bookingId">

                                            <div style="position: relative">
                                                <input type="date" @change="changeDateCreate($event)"
                                                    :name="'created_at'+detail_booking.id"
                                                    :id="'created_at'+detail_booking.id" style=" width: 150px"
                                                    class="form-control"
                                                    :value="moment(detail_booking.created_at).format('YYYY-MM-DD')">
                                                <input type="hidden" :name="'created_at_old'+detail_booking.id"
                                                    :id="'created_at_old'+detail_booking.id" class="form-control">
                                            </div>

                                            <input type="time" @change="changeTimeCreate($event)"
                                                style="width: 150px; margin-left: 15px"
                                                :name="'created_at_time'+detail_booking.id"
                                                :id="'created_at_time'+detail_booking.id" class="form-control"
                                                :value="moment(detail_booking.created_at).format('HH:mm')">
                                            <input type="hidden" :name="'created_at_time_old'+detail_booking.id"
                                                :id="'created_at_time_old'+detail_booking.id" class="form-control">
                                        </div>

                                    </div>
                                </div>
                                <div class="title-form">
                                    入力事項
                                </div>
                                <div class="row" v-for="(info,index) in form_info ">
                                    <div class="col-md-3">
                                        <div class="f-title-info">
                                            @{{ info.title }}
                                            <span v-if="info.is_require == 1" class="text-required">必須</span>
                                        </div>

                                    </div>
                                    <div class="col-md-9" style="">
                                        <div class="c_h_mdbt-multi" style="margin-bottom: 15px" v-if="info.type === 1">
                                            <textarea class="form-control info_item w-90" rows="4" cols="50"
                                                v-model="info.value">
                                                                </textarea>
                                        </div>
                                        <div class="c_h_mdbt-multi" v-else-if="info.type == 2">
                                            <select class="form-control w-90 info_item" v-model="info.value">
                                                <option v-for="info_select in info.valueOption"
                                                    :value="info_select.value">
                                                    @{{ info_select.value }}</option>
                                            </select>
                                        </div>
                                        <div class="c_h_mdbt-multi" v-else>
                                            <input type="text" class="form-control info_item" v-model="info.value">
                                        </div>
                                        <small class="text-danger"
                                            :id="'err_msg_stt'+ detail_booking.id + index"></small>

                                    </div>
                                </div>

                                <div v-if="detail_booking.status == 3" class="row ">
                                    <div class="col-md-3">
                                    </div>
                                    <div class="col-md-3" style="display: flex">
                                        <input type="radio" style="width: 19px;height: 17px;"
                                            :id="'check1'+detail_booking.id" value="0"
                                            v-model="detail_booking.action_before_booking">
                                        <label :for="'check1'+detail_booking.id"
                                            style="font-size: 14px; ">アクションを実行する</label>

                                    </div>
                                    <div class="col-md-4" style="display: flex">
                                        <input type="radio" style="width: 19px;height: 17px; "
                                            :id="'check2'+detail_booking.id" value="1"
                                            v-model="detail_booking.action_before_booking" />
                                        <label :for="'check2'+detail_booking.id"
                                            style="font-size: 14px;">アクションを実行しない</label>
                                    </div>
                                </div>
                                <div v-else>
                                    <div class="title-form">
                                        予約ステータス変更
                                    </div>
                                    <div style="display: flex;">
                                        <div v-if="slot_detail.approval_system == 1">
                                            <span class="status-booking pan-panel status approved"
                                                :class="detail_booking.status == 1 || detail_booking.status == 5 ? ' active' : ''"
                                                :id="'approved_'+detail_booking.id"
                                                @click="changeStatus(detail_booking.status != 5 ? 1 : 5 , detail_booking.id, this)">参加予定</span>
                                            {{-- tham gia --}}

                                            <span class="status-booking pan-panel status denied"
                                                :class="detail_booking.status == 2 ? 'active' : ''"
                                                :id="'denied_'+ detail_booking.id"
                                                @click="changeStatus(2, detail_booking.id, this)">参加否認</span>
                                            {{-- từ chối tham gia --}}
                                        </div>

                                        <span v-if="slot_detail.approval_system == 0"
                                            class="status-booking pan-panel status booking"
                                            :class="detail_booking.status == 5 || detail_booking.status == 1 ? 'active' : ''"
                                            :id="'booking_'+detail_booking.id"
                                            @click="changeStatus(5, detail_booking.id, this)">予約を承認</span>

                                        <span style="margin-left: 15px;"
                                            class="status-booking pan-panel status canceled"
                                            :class="detail_booking.status == 4 ? 'active' : ''"
                                            :id="'canceled_'+detail_booking.id"
                                            @click="changeStatus(4, detail_booking.id, this)">キャンセル</span>{{-- hủy --}}
                                    </div>
                                    <div class="row " style="margin-top: 20px">
                                        <div class="col-md-3" style="display: flex">
                                            <input type="radio" style="width: 19px;height: 17px;"
                                                :id="'check1'+detail_booking.id" value="0"
                                                v-model="detail_booking.action_before_booking">
                                            <label :for="'check1'+detail_booking.id"
                                                style="font-size: 14px; ">アクションを実行する</label>

                                        </div>
                                        <div class="col-md-4" style="display: flex">
                                            <input type="radio" style="width: 19px;height: 17px;"
                                                :id="'check2'+detail_booking.id" value="1"
                                                v-model="detail_booking.action_before_booking">
                                            <label :for="'check2'+detail_booking.id"
                                                style="font-size: 14px; ">アクションを実行しない</label>
                                        </div>
                                    </div>
                                </div>

                                <div v-if="detail_booking.status == 3" class="row " style="margin-top: 20px">
                                    <div class="col-md-3">
                                    </div>
                                    <div class="col-md-3">
                                        <button class="btn  btn-sns-line btn-sns-line-danger btn-sns-line-lg"
                                            type="button" id="changeSttDenied"
                                            v-on:click="changeStatusModal(detail_booking.id,2)" style=" width: 150px">
                                            否認</button>
                                    </div>
                                    <div class="col-md-3">
                                        <button class="btn btn-sns-line btn-sns-line-success btn-sns-line-lg"
                                            type="button" id="changeStatusApprove"
                                            v-on:click="changeStatusModal(detail_booking.id,1)" style=" width: 150px">
                                            承認</button>
                                    </div>
                                </div>

                                <div v-else class="text-center mb-3">
                                    <button class="btn btn-sns-line btn-sns-line-success " id="changeStatus"
                                        v-on:click="changeStatusModal(detail_booking.id)"
                                        style=" width: 120px; margin-top: 20px">保存</button>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div id="menu1" class="tab-pane  @if ($active_tab == 2) in active @endif">
                <div class="form-group form-inline">
                    <div class="pull-left search" style="display: flex; align-items: center; margin-top: 15px">
                        <form action="{{ route('allBooking', ['id' => $eventDetail->id]) }}" method="get"
                            style="display: flex" id="form-search">

                            <div style="display: flex">
                                <input type="hidden" value="2" name="active_tab">
                                <input type="text" name="keyword" value="{{ $keyword }}" id="keyword"
                                    placeholder="LINE名・システム表示名">
                                <button type="submit" class="btn-search " id="search_name"><i
                                        class="fa fa-search"></i></button>
                            </div>

                        </form>

                    </div>
                    <div class="pull-right" style="margin-right: 0!important;">
                        <button type="button" class="btn btn btn-sns-line btn-sns-line-dark" @if ($bSlotDone && $bSlotDone->count() ==0) disabled
                            @else onclick="exportCsv(2)" @endif style=" margin-top: 15px; padding: 9px 14px; ">CSV書出し
                            <img src="/images/output-csv-ic.png" style="width: 17px; padding-bottom: 2px"> </button>
                    </div>
                    <div class="clearfix"></div>
                </div>
                
                <div v-for="slot in bSlotDone" v-if="slot.bookings.length > 0" class="row" style="display: flex; margin-left: 1px; margin-bottom: 10px">
                    @if ($typeEvent == 0)
                        <div class="col-md-2 date_table">
                            <div>
                                @{{ moment(slot.date_start_from).format('YYYY年') }}
                                <br>
                                @{{ moment(slot.date_start_from).format('MM月DD日') }}
                                (@{{ day_of_week[moment(slot.date_start_from).isoWeekday()] }})
                            </div>

                        </div>
                    @endif
                    <div class="{{ $typeEvent == 0 ? 'col-md-10' : 'col-md-12 pl-0' }}">
                        <div class="time_table_done">
                            @if ($typeEvent == 0)
                                <span>
                                    @{{ slot.time_start }}
                                    <span v-if="slot.time_end">〜@{{ slot.time_end }} </span>
                                </span>
                            @else
                                <span>
                                    @{{ moment(slot.date_start_from).format('YYYY/MM/DD') }}(@{{ day_of_week[moment(slot.date_start_from).isoWeekday()] }})
                                    〜
                                    @{{ moment(slot.date_start_to).format('YYYY/MM/DD') }}(@{{ day_of_week[moment(slot.date_start_to).isoWeekday()] }})
                                </span>
                            @endif
                        </div>
                        <table class="table table-striped" style="border: none; margin: 0">
                            <thead>
                                <tr style="background: rgb(238, 238, 238);">
                                    <th class="w-status">ステータス</th>
                                    <th style="width: 90px; min-width: 65px"></th>
                                    <th class="w-name">LINE名</th>
                                    <th class="w-system">システム表示名</th>
                                    <th class="w-plan" style="min-width: 60px">予約プラン</th>
                                    <th class="w-quantity">参加人数</th>
                                    <th class="w-create">予約した日時</th>
                                    <th class="w-btn-e"></th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr v-if="slot.bookings.length > 0" v-for="booking in slot.bookings">
                                    <td :class="'check_all'+slot.id+' check_user_'+booking.id">
                                        <span v-if="booking.status == 1 || booking.status == 5">参加済み</span>
                                        <span v-else-if="booking.status == 2">参加否認</span>
                                        <button v-else-if="booking.status == 3" type="button" class="btn btn-primary btn-sm btn-status-label"
                                            style="border-color: #5799DB; background-color: #5799DB; cursor: auto;outline: none"
                                            @click="removeCssStatus(booking.id)">
                                            承認待ち
                                        </button>
                                        <span v-else-if="booking.status == 4">キャンセル</span>
                                    </td>
                                    <td>
                                        <span v-if="booking.booking_from == 1" style="font-size: 13px;color: #08BF5A;word-break: keep-all;">手動登録</span>
                                    </td>
                                    <td :class="'has_emoji check_all'+slot.id+' check_user_'+booking.id">
                                        <span><a class="link_my_page"
                                                :href="'/basic/friendlist/my_page/'+booking.line_user_id"
                                                target="_blank"
                                                style="font-weight: bold; text-decoration: underline">@{{ booking.line_user && booking.line_user.name ? booking.line_user.name : '-' }}</a></span>
                                    </td>
                                    <td :class="'has_emoji check_all'+slot.id+' check_user_'+booking.id">
                                        <span>@{{ booking.line_user && booking.line_user.view_name ? booking.line_user.view_name : '-' }}</span>

                                    </td>
                                    <td :class="'has_emoji check_all'+slot.id+' check_user_'+booking.id">
                                        <div>
                                            @{{ booking.plan && booking.plan.name ? booking.plan.name : '-' }}
                                        </div>
                                    </td>
                                    <td style="text-align: center;">
                                        <div style="display: flex">
                                            <div style="width: 53%" class="font-weight-bold text-right">
                                                <span>@{{ booking.quantity }}</span>
                                            </div>
                                            <div style="width: 47%" class="font-weight-bold text-left">
                                                人
                                            </div>
                                        </div>
                                    </td>

                                    <td :class="'has_emoji check_all'+slot.id+' check_user_'+booking.id">
                                        @{{ moment(booking.created_at).format('YYYY年MM月DD日 HH時mm分') }}
                                    </td>
                                    <td>
                                        <button class="btn btn-sns-line btn-sns-line-secondary"
                                            v-on:click="showDetail(booking, slot) ">予約詳細</button>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                @if($bSlotDone)
                <div style="display: flex; justify-content: center;">
                    {{ $bSlotDone->appends(['active_tab' => $active_tab])->links() }}
                </div>
                @endif
                <div class="change-status-modal modal fade" id="showDetail"
                    role="dialog" aria-hidden="true">
                    <div class="modal-dialog modal-lg" role="document">
                        <div class="modal-content">
                            <div id="draft-modal-header" class="modal-header">
                                <button type="button" class="close" data-dismiss="modal"
                                    aria-hidden="true" style="opacity: 1;font-size: 27px">
                                    <span class="line-icon line-icon-close"><i
                                            class="fas fa-times"></i></span>
                                </button>
                                <h2 class="text-center">【 予約詳細 】</h2>
                            </div>
                            <div class="modal-body">
                                <input type="hidden" :value="bookingDetail.status"
                                    :id="'status'+bookingDetail.id">
                                <input type="hidden" :value="bookingDetail.status"
                                    :id="'status_old'+bookingDetail.id">
                                <input type="hidden" value="1" :id="'action'+bookingDetail.id">
                                <input type="hidden" :value="bookingDetail.id" id="user-booking">
                                <div class="info-user"
                                    style=" padding-top: 15px;    box-shadow: #f4f6f7 0px 0px 0.2em, #f4f6f7 0px 0.2em 0.2em;">
                                    <div class="row">
                                        <div class="col-md-3 text-center" style="padding-left: 66px;">
                                            <div class="text-center">
                                                <img :src="(bookingDetail.line_user && bookingDetail.line_user.avatar_url) ? bookingDetail.line_user.avatar_url : '/images/blank_avatar.png'"
                                                    onerror="this.onerror=null;this.src='/images/blank_avatar.png'"
                                                    width="100px;" style="    border: 1px solid #F4F6F7;
                                                                                border-radius: 50%;
                                                                                margin-bottom: 15px;
                                                                            ">
                                            </div>
                                            <div>
                                                <a :href="'/basic/chat-v3?friend_id='+bookingDetail.line_user_id">
                                                    <button class="btn btn-sns-line btn-sns-line-success" type="button">1:1チャット</button>
                                                </a>
                                            </div>

                                        </div>
                                        <div class="col-md-8">
                                            <div class="row">
                                                <div class="col-md-4 u-title"> LINE名
                                                </div>
                                                <div class="col-md-7 u-content" style="">
                                                    @{{ bookingDetail.line_user && bookingDetail.line_user.name ? bookingDetail.line_user.name : '' }}
                                                </div>
                                            </div>
                                            <div class="row">
                                                <div class="col-md-4 u-title"> 友だち追加日時
                                                </div>
                                                <div class="col-md-7 u-content">
                                                    @{{ bookingDetail.line_user && bookingDetail.line_user.followed_at ? moment(bookingDetail.line_user.followed_at).format('YYYY.MM.DD HH:mm') : '' }}
                                                    <span v-if="bookingDetail.line_user && bookingDetail.line_user.is_old_friend == 1">既存友だち</span>
                                                    <span v-else>新規友だち</span>
                                                </div>
                                            </div>
                                            <div class="row">
                                                <div class="col-md-4  u-title">最終メッセージ受信</div>
                                                <div class="col-md-7 u-content">
                                                    @{{ bookingDetail.line_user && bookingDetail.line_user.last_time_message ? moment(bookingDetail.line_user.last_time_message).format('YYYY.MM.DD HH:mm') : '' }}
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="title-form">
                                    予約情報
                                </div>
                                <div class="row">
                                    <div class="col-md-3">
                                        <div class="b-title-info">
                                            参加日
                                        </div>
                                    </div>
                                    <div class="col-md-9" style="">
                                        <div class="b-content_info">
                                            @{{ moment(slotDetail.date_start_from).format('YYYY.MM.DD')}}
                                            (@{{ day_of_week[moment(slotDetail.date_start_from).isoWeekday()] }})
                                            @{{ slotDetail.time_start }}<span v-if="slotDetail.time_end">〜@{{ slotDetail.time_end }}</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-3">
                                        <div class=" b-title-info">
                                            利用プラン
                                        </div>
                                    </div>
                                    <div class="col-md-9 " style="">
                                        <div class=" b-content_info">
                                            @{{ bookingDetail.plan && bookingDetail.plan.name ? bookingDetail.plan.name : '-' }}
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-3">
                                        <div class=" b-title-info">
                                            参加人数
                                        </div>
                                    </div>
                                    <div class="col-md-9 " style="">
                                        <div class=" b-content_info">
                                            @{{ bookingDetail.quantity }}人
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-3 ">
                                        <div class=" b-title-info">
                                            予約した日時
                                        </div>
                                    </div>
                                    <div class="col-md-9 " style="">
                                        <div class=" b-content_info">
                                            @{{ moment(bookingDetail.created_at).format('YYYY.MM.DD') }}
                                            (@{{ day_of_week[moment(bookingDetail.created_at).isoWeekday()] }})
                                            @{{ moment(bookingDetail.created_at).format('HH:mm') }}
                                        </div>

                                    </div>
                                </div>
                                <div class="title-form">
                                    入力事項
                                </div>
                                <div class="row" v-for="(info,index) in form_info">
                                    <div class="col-md-3">
                                        <div class="f-title-info">
                                            @{{ info.title }}
                                        </div>
                                    </div>
                                    <div class="col-md-9" style="">
                                        <div class="f-content_info">
                                            @{{ info.value }}
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="text-center">
                                <button type="button" class="btn btn-sns-line btn-sns-line-success"
                                    data-dismiss="modal" style="width: 120px" aria-hidden="true">戻る
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <div class=" modal fade" id="adminBookingModal" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content" @click="displaySearchLineUser($event)">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"
                        v-on:click="closeAdminBookingModal" style="opacity: 1;font-size: 27px">
                        <span class="line-icon line-icon-close"><i class="fas fa-times"></i></span>
                    </button>

                    <h2 class="text-center">【 手動登録 】</h2>
                    <div class="text-center">手動登録の場合は「定員」「予約期限」「予約回数設定」に関係なく予約が登録されます</div>
                </div>
                <div class="modal-body booking-body-modal">
                    <div class="title-form" style="margin-top: 0">
                        日程・コース
                    </div>
                    <div class="row">
                        <div class="col-md-3">
                            <div class="b-title-info">
                                イベント名
                            </div>
                        </div>
                        <div class="col-md-9" style="">
                            <div class="b-content_info" style="background-color: #F4F6F7; padding: 7px">
                                {{ $eventDetail->title }}
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-3">
                            <div class="b-title-info">
                                日程
                            </div>
                        </div>
                        <div class="col-md-9" style="">
                            <div class="">
                                <select class="form-control slot" name="slot" v-model="add_slot_id"
                                    v-on:change="changeSlotAdd(add_slot_id)">
                                    <option value="">-</option>
                                    <option v-for="( slot,index) in slotList" :value="slot.id">
                                        @if ($typeEvent == 0)
                                        <span>@{{ format1Date(slot.date_start_from, slot.time_start, slot.time_end) }}</span>
                                        @else
                                        <span>@{{ formatManyDate(slot.date_start_from, slot.date_start_to) }}</span>
                                        @endif
                                    </option>
                                </select>
                            </div>
                        </div>
                    </div>


                    <input type="hidden" name="is_required_input_email" id="is_required_input_email"
                        value="{{ $eventDetail->is_required_input_email }}" />
                    <input type="hidden" name="is_required_input_phone" id="is_required_input_phone"
                        value="{{ $eventDetail->is_required_input_phone }}" />
                    <div>
                        <div class="body-booking " v-show="isShowAdBooking">
                            <div class="row plan" v-if="plansList.length >0 ">
                                <div class="col-md-3">
                                    <div class="b-title-info">
                                        コース
                                    </div>
                                </div>
                                <div class="col-md-9" style="">
                                    <select class="form-control slot" id="plan_slot_id"
                                        v-on:change="changePlanSlot(booking)" v-model="booking.plan_slot_id">
                                        <option value="">コースを選択してください</option>
                                        <option v-for="( plan,index) in plansList" :value="plan.id">
                                            @{{ plan.name }}
                                        </option>
                                    </select>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-3">
                                    <div class="b-title-info">
                                        友だち名
                                    </div>
                                </div>
                                <div class="col-md-9" style="">
                                    <div style="position: relative" @click="clickSearchLineUser">
                                        <input type="text" class="form-control input_search_line_user"
                                            v-model="add_line_name" @keyup="keyupSearchLineUser($event)">
                                        <input type="hidden" v-model="add_line_id">
                                        <div v-show="add_line_name" @click="removeLineUserSearch"
                                            style="position: absolute; right: 10px; top: 5px;">x</div>
                                    </div>
                                    <div class="ui_search_line_user" @scroll="scrollLoadMoreLineUser($event)" v-cloak>
                                        <div class="ui_search_item" v-for="user in search_list_line_user"
                                            @click="chooseLineUser(user.id, user.name)">
                                            <img v-if="user.avatar_url" :src="user.avatar_url" alt="" width="30"
                                                style="border-radius: 50%"
                                                onerror="this.onerror=null;this.src='/images/blank_avatar.png'">
                                            <img v-else width="30" style="border-radius: 50%"
                                                src="https://www.pngfind.com/pngs/m/610-6104451_image-placeholder-png-user-profile-placeholder-image-png.png">
                                            LINE登録名: @{{ user.name }} / システム表示名: @{{ user.view_name }}
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-3">
                                    <div class="b-title-info">
                                        参加人数
                                    </div>
                                </div>
                                <div class="col-md-9" style="">
                                    <input name="quantity" type="number" class="form-control" value="1" min="1"
                                        style="max-width: 78px; display: inline-block;">
                                    名
                                    <span class="amount"></span>
                                </div>
                            </div>

                            <div class="title-form">
                                入力事項
                            </div>

                            <div class="row" v-for="(info,index) in form_info ">
                                <div class="col-md-3">
                                    <div class="f-title-info">
                                        @{{ info.title }}
                                        <span v-if="info.is_require == 1" class="text-required">必須</span>
                                    </div>

                                </div>
                                <div class="col-md-9" style="">
                                    <div class="c_h_mdbt-multi" style="margin-bottom: 15px" v-if="info.type === 1">
                                        <textarea class="form-control info_item w-90" rows="4" cols="50"
                                            v-model="info.value">
                                            </textarea>
                                    </div>
                                    <div class="c_h_mdbt-multi" v-else-if="info.type === 2">
                                        <select class="form-control w-90 info_item" v-model="info.value">
                                            <option v-for="info_select in info.valueOption" :value="info_select.value">
                                                @{{ info_select.value }}</option>
                                        </select>
                                    </div>
                                    <div class="c_h_mdbt-multi" v-else>
                                        <input type="text" class="form-control info_item" v-model="info.value">
                                    </div>
                                    <small class="text-danger" :id="'err_msg' + index"></small>

                                </div>
                            </div>
                            <div class="title-form">
                                アクション設定
                            </div>
                            <div class="row">
                                <div class="col-md-3" style="font-weight: bold">
                                    予約時アクション
                                </div>
                                <div class="col-md-9">
                                    <label style=""><input type="radio" value="0"
                                            name="action_before_booking">実行する</label>
                                    <label style=""><input type="radio" value="1" checked
                                            name="action_before_booking">実行しない</label>

                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer" style="text-align: center; border-top: none">
                    <button class="btn btn-sns-line btn-sns-line-success" type="button" id="btnSaveBooking"
                        v-on:click="saveAdBooking" style=" width: 120px">
                        保存
                    </button>
                </div>
            </div>
        </div>
    </div>
</article>
@endsection
@push('js')
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<script>
var token = "{!! csrf_token() !!}";
var databSlotDoing = null;
var databSlotDone = null;
var bSlotDoing = databSlotDoing ? databSlotDoing.data : [];
var bSlotDone = databSlotDone ? databSlotDone.data : [];
console.log('databSlotDone', databSlotDone);
const search_line_user = '{{ route("ajax.calendar.search_line_user") }}';
const bot_id = '{{ getBotId() }}';
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<script src="/js/form_answer/vee-validate.rc7.min.js"></script>
<script src="/js/msg_template/custom_rule.js?v={{ config('sns-line.version') }}"></script>
<script src="/js/msg_template/vee-validate_ja.min.js"></script>
<script src="/chat_files/bootstrap-timepicker.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.1/moment-with-locales.min.js"></script>
<script type="application/javascript" src="/js/booking/booking_all_slot.js?v={{config("sns-line.version")}}"></script>
<script src="/js/form_answer/jquery.ui.datepicker-ja.js"></script>

<script>
$(function() {

    $('.link_my_page').on('click', function(e) {
        e.stopPropagation();
    });
    $.datepicker.setDefaults($.datepicker.regional["ja"]);
    $('.datetimepicker').datepicker({
        dateFormat: "yy-mm-dd",
        theme: 'dark',
        minDate: new Date(),
        onClose: function(selectedDate, event) {
            // appSettingEvent.itemSlot.date_start_from = selectedDate;
            var bookingId = $(event).closest('.createTime').find('.bookingId').val();
            $('#created_at' + bookingId).val(selectedDate);
            bookingAllSlot.detail_booking.created_at = selectedDate;
        }
    });
});
</script>
@endpush