@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;

    }

    a {
        cursor: pointer;
    }

    select option {
        color: #51595C;
    }

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

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

    h2 {
        font-weight: bold;
    }

    #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;
    }

    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;
    }

    .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;
    }

    select {
        appearance: auto !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;
    }

    /*.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;
    }

    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;
    }

    .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;*/
    }

    .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;
    }

    .w-quantity {
        text-align: center;
    }

    .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_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="slot_id" value="{{$slotId}}" name="slot_id" type="hidden">
        <input id="bSlot" value="{{$bSlot}}" name="bSlot" type="hidden">
        <input id="type_event" value="{{$eventDetail->type_event}}" name="type_event" type="hidden">

        <br>
        <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('bookingSlot', ['eventId' => $eventDetail->id, 'slotId' => $bSlot->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;" v-on:click="showAdminBooking()" data-toggle="modal" data-target="#adminBookingModal">手動登録</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($slot && $slot->bookings->count() ==0) disabled @else onclick="exportCsv(1,{{$slotId}})" @endif
                            style="background-color: #7D9195; border-color: #7D9195; 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-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>
                            {{ \Illuminate\Support\Carbon::createFromTimestamp(strtotime($slot->date_start_from))->format('Y年') }}
                            <br>
                            {{ \Illuminate\Support\Carbon::createFromTimestamp(strtotime($slot->date_start_from))->format('m月d日')}}({{$days[ \Illuminate\Support\Carbon::createFromTimestamp(strtotime($slot->date_start_from))->dayOfWeek ]}})
                        </div>

                    </div>
                    @endif
                    <div class="{{$typeEvent == 0 ? 'col-md-10' : 'col-md-12 pl-0'}}">
                        <div style=" " 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>ステータス</th>
                                    <th style="width: 90px"></th>
                                    <th>LINE名</th>
                                    <th>システム表示名</th>
                                    <th 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">
                                    <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>
                                        <div v-else-if="booking.status == 3">
                                            <button type="button" class="btn btn-primary btn-sm btn-status-label" style="border-color: #5799DB; background-color: #5799DB; outline: none">
                                                承認待ち
                                            </button>
                                        </div>
                                        <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/chat-v3?line_id='+ 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>

                <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($slot && $slot->bookings->count() ==0) disabled @else onclick="exportCsv(2,{{$slotId}})" @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>
                @if(($slot && $slot->bookings->count() > 0))

                <div class="row" style="display: flex; margin-left: 1px; margin-bottom: 10px">
                    @if($typeEvent == 0)
                    <div class="col-md-2 date_table_done" style="">
                        <div>
                            {{ \Illuminate\Support\Carbon::createFromTimestamp(strtotime($slot->date_start_from))->format('Y年') }}
                            <br>
                            {{ \Illuminate\Support\Carbon::createFromTimestamp(strtotime($slot->date_start_from))->format('m月d日')}}({{$days[ \Illuminate\Support\Carbon::createFromTimestamp(strtotime($slot->date_start_from))->dayOfWeek ]}})
                        </div>

                    </div>
                    @endif
                    <div class="{{$typeEvent == 0 ? 'col-md-10' : 'col-md-12 pl-0'}}">
                        <div style="" class="time_table_done">
                            @if($typeEvent == 0)
                            <span>
                                {{$slot->time_start}}@if(!empty($slot->time_end))<span>〜{{$slot->time_end}} </span>@endif
                            </span>
                            @else
                            <span>
                                {{ \Illuminate\Support\Carbon::createFromTimestamp(strtotime($slot->date_start_from))->format('Y/m/d')}}({{$days[ \Illuminate\Support\Carbon::createFromTimestamp(strtotime($slot->date_start_from))->dayOfWeek ]}})
                                〜
                                {{ \Illuminate\Support\Carbon::createFromTimestamp(strtotime($slot->date_start_to))->format('Y/m/d')}}({{$days[ \Illuminate\Support\Carbon::createFromTimestamp(strtotime($slot->date_start_to))->dayOfWeek ]}})
                            </span>
                            @endif
                        </div>
                        <table class="table table-striped" style="border: none; margin: 0">
                            <thead>
                                <tr style="background: rgb(238, 238, 238);">
                                    <th>ステータス</th>
                                    <th style="width: 90px"></th>
                                    <th>LINE名</th>
                                    <th>システム表示名</th>
                                    <th style="min-width: 60px">予約プラン</th>
                                    <th class="w-quantity">参加人数</th>
                                    <th>予約した日時</th>
                                    <th class="w-btn-e"></th>
                                </tr>
                            </thead>
                            <tbody>
                                @if(($slot->bookings->count() > 0))
                                @foreach($slot->bookings as $booking)
                                <tr class="">
                                    <td class="check_all{{$slot->id}} check_user_{{ $booking->id }}">
                                        @if($booking->status == 1 || $booking->status == 5)
                                        <span>参加済み</span>
                                        @endif
                                        @if($booking->status== 2)
                                        <span>参加否認</span>
                                        @endif
                                        @if($booking->status == 3)
                                        <div>
                                            <button type="button" class="btn btn-primary btn-sm btn-status-label" style="border-color: #5799DB; background-color: #5799DB; outline: none" onclick="removeCssStatus({{ $booking->id }})">
                                                承認待ち
                                            </button>
                                        </div>
                                        @endif
                                        @if($booking->status == 4)
                                        <span>キャンセル</span>
                                        @endif
                                    </td>
                                    <td>

                                        @if($booking->booking_from == 1)
                                        <span style="font-size: 13px;color: #08BF5A;word-break: keep-all;">手動登録</span>
                                        @endif
                                    </td>
                                    <td class="has_emoji check_all{{$slot->id}} check_user_{{ $booking->id }}">
                                        <span><a class="link_my_page" href="{{ route('friendlistMypage', ['line_id' => $booking->line_user_id]) }}" target="_blank" style="font-weight: bold; text-decoration: underline">{{ !empty($booking->lineUser->name) ? $booking->lineUser->name : '-' }}</a></span>
                                    </td>
                                    <td class="has_emoji check_all{{$slot->id}} check_user_{{ $booking->id }}">
                                        <span>{{ !empty($booking->lineUser->view_name) ? $booking->lineUser->view_name : '-' }}</span>

                                    </td>
                                    <td class="has_emoji check_all{{$slot->id}} check_user_{{ $booking->id }}">
                                        <div>{{ $booking->plan && !empty($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 }}">

                                        {{ \Illuminate\Support\Carbon::createFromTimestamp(strtotime($booking->created_at))->format('Y年m月d日 H時i分') }}
                                    </td>
                                    <td>
                                        <button class="btn btn-sns-line btn-sns-line-secondary" data-toggle="modal" data-target="#showDetail{{ $booking->id }}" v-on:click="showDetail({{ $booking->id }},{{ $booking->line_user_id}}) ">予約詳細</button>
                                    </td>

                                </tr>
                                <div class="change-status-modal modal fade" id="showDetail{{ $booking->id }}" 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="{{ $booking->status }}" id="status{{$booking->id}}">
                                                <input type="hidden" value="{{ $booking->status }}" id="status_old{{$booking->id}}">
                                                <input type="hidden" value="1" id="action{{$booking->id}}">
                                                <input type="hidden" value="{{$booking->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="{{( !empty($booking->lineUser->avatar_url) && !is_null($booking->lineUser->avatar_url)) ? $booking->lineUser->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="{{ route('chatBasicV3', ['friend_id' => $booking->line_user_id]) }}">
                                                                    <button type="button" class="btn btn-sns-line btn-sns-line-success"> 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="">{{ !empty($booking->lineUser->name) ? $booking->lineUser->name : '' }}</div>
                                                            </div>
                                                            <div class="row">
                                                                <div class="col-md-4 u-title"> 友だち追加日時</div>
                                                                <div class="col-md-7 u-content">{{ !empty($booking->lineUser->followed_at) ?  \Illuminate\Support\Carbon::createFromTimestamp(strtotime($booking->lineUser->followed_at))->format('Y.m.d H:i')  : '' }}
                                                                    <span>@if(!empty($booking->lineUser) && $booking->lineUser->is_old_friend == 1) 既存友だち @else 新規友だち @endif</span>
                                                                </div>
                                                            </div>
                                                            <div class="row">
                                                                <div class="col-md-4  u-title"> 最終メッセージ受信</div>
                                                                <div class="col-md-7 u-content">
                                                                    {{ !empty($booking->lineUser->last_time_message) ? \Illuminate\Support\Carbon::createFromTimestamp(strtotime($booking->lineUser->last_time_message))->format('Y.m.d H:i')  : '' }}
                                                                </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">
                                                            {{ \Illuminate\Support\Carbon::createFromTimestamp(strtotime($slot->date_start_from))->format('Y.m.d')}}
                                                            ({{$days[ \Illuminate\Support\Carbon::createFromTimestamp(strtotime($slot->date_start_from))->dayOfWeek ]}})
                                                            {{$slot->time_start}} @if($slot->time_end)<span>〜{{$slot->time_end}}</span> @endif
                                                        </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">
                                                            {{ $booking->plan && !empty($booking->plan->name) ?  $booking->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">
                                                            {{ $booking->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">
                                                            {{ \Illuminate\Support\Carbon::createFromTimestamp(strtotime($booking->created_at))->format('Y.m.d') }}
                                                            ({{$days[ \Illuminate\Support\Carbon::createFromTimestamp(strtotime($booking->created_at))->dayOfWeek ]}})
                                                            {{ \Illuminate\Support\Carbon::createFromTimestamp(strtotime($booking->created_at))->format('H:i') }}
                                                        </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>

                                @endforeach
                                @endif
                            </tbody>
                        </table>
                    </div>
                </div>
                @endif
            </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" style="opacity: 1;font-size: 27px" v-on:click="closeAdminBookingModal">
                        <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">
                    <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">
                                    <option value="{{ $slot->id }}" selected>
                                        @if($typeEvent == 0)
                                        <span>@{{ format1Date(slotDefault.date_start_from,slotDefault.time_start,slotDefault.time_end) }}</span>
                                        @else
                                        <span>@{{ formatManyDate(slotDefault.date_start_from,slotDefault.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 ">
                            @if($slot->plans->count() > 0)
                            <div class="row plan">
                                <div class="col-md-3">
                                    <div class="b-title-info">
                                        コース
                                    </div>
                                </div>
                                <div class="col-md-9" style="">
                                    <select name="plan_slot_id" id="plan_slot_id" class="form-control">
                                        <option value="0">コースを選択してください</option>
                                        @foreach($slot->plans as $plan)
                                        <option value="{{ $plan->id }}">{{ $plan->name }}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            @endif

                            <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">{{ (($slot->plans->count() == 0) && $slot->number_people != null )? '（残数 ' . ($slot->number_people - $slot->use_people) . '名）' : '（残数 -名）' }}</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({{$slot->id}})" style="width: 120px">
                        保存
                    </button>
                </div>
            </div>
        </div>
    </div>
</article>
@endsection
@push('js')
<script>
    var token = "{!! csrf_token() !!}";
    var bSlotDoing = null;
    var bSlot = null;
    const search_line_user = "{{ route('ajax.calendar.search_line_user') }}";
    const bot_id = '{{ getBotId() }}';
</script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></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_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);
            }
        });
    });
</script>
@endpush