@extends('layout.admin.main')
@section('title', 'エルメ契約内容確認')
@push('css')
    <link rel="stylesheet" href="/css/admin/step_add_bot.css?v={{config("sns-line.version")}}">
    <style>
        * {
            font-weight: bold;
        }

        .box_option {
            border: 2px solid #F4F6F7;
            border-radius: 3px;
            padding: 20px;
        }

        .box_btn_plan {
            background: #F2F2F2 0% 0% no-repeat padding-box;
            border: 1px solid #E8E8E8;
            border-radius: 5px;
            padding: 0 11px;
            width: 240px;
            text-align: center;
            margin-bottom: 20px;
            height: 47px;
            line-height: 47px;
        }

        .c-radio {
            display: block;
            height: 25px;
            line-height: 25px;
            position: relative;
            margin-bottom: 12px;
            cursor: pointer;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
        }

        /* Hide the browser's default radio button */
        .c-radio input {
            position: absolute;
            opacity: 0;
            cursor: pointer;
        }

        /* Create a custom radio button */
        .c-radio .checkmark {
            position: absolute;
            top: 0;
            left: 0;
            height: 26px;
            width: 26px;
            border: 1px solid #E0E0E0;
            background-color: #ffffff;
            border-radius: 50%;
        }


        /* Create the indicator (the dot/circle - hidden when not checked) */
        .c-radio .checkmark:after {
            content: "";
            position: absolute;
            display: none;
        }

        /* Show the indicator (dot/circle) when checked */
        .c-radio input:checked ~ .checkmark:after {
            display: block;
        }

        /* Style the indicator (dot/circle) */
        .c-radio .checkmark:after {
            top: 44.8%;
            left: 45.2%;
            margin-left: -5px;
            margin-top: -4px;
            width: 12px;
            height: 12px;
            border-radius: 50%;
            background: #51595C;
        }

        /* start custom checkbox */
        .c-checkbox {
            display: block;
            position: relative;
            padding-left: 35px;
            margin-bottom: 12px;
            cursor: pointer;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
        }

        /* Hide the browser's default checkbox */
        .c-checkbox input {
            position: absolute;
            opacity: 0;
            cursor: pointer;
            height: 0;
            width: 0;
        }

        /* Create a custom checkbox */
        .c-checkbox .checkmark {
            position: absolute;
            top: 0;
            left: 0;
            height: 25px;
            width: 25px;
            border-radius: 5px;
            background-color: #fff;
            border: 2px solid #E8E8E8;
        }

        .c-checkbox input:checked ~ .checkmark {
            background-color: #08BF5A;
            border: 2px solid #08BF5A;
        }
        .environment-item {
            width: 240px;
            padding: 15px 12px;
            display: flex;
            border: 1px solid #E8E8E8;
            border-radius: 3px;
            align-items: center;
        }

        .environment-item.active {
            background-color: #08BF5A !important;
            color: white;
            border: none;
        }
        .environment-item.active label,  .environment-item.active span{
            color: white !important;
        }
        .environment-item .content-right {
            padding-left: 13px;
            font-size: 12px;
        }

        .environment-item .c-radio {
            margin-bottom: 0px;
            width: 100%;
            text-align: center;
        }
        .environment-item {
            height: 47px;
        }

        .environment-item .c-radio .checkmark:after {
            background-color: #08BF5A;
        }

        .environment-item.active .c-radio .checkmark{
            border: none;
        }
        .box_option .title{
            margin-top: 30px;
            margin-bottom: 8px;
            font-size: 15px;
        }
        .div_amount{
            background: #F2F2F2 0% 0% no-repeat padding-box;
            border: 1px solid #E8E8E8;
            border-radius: 5px;
            padding:0 11px;
            width: 240px;
            text-align: center;
            height: 47px;
            line-height: 47px;
        }
        .disabled_r{
            background-color: #F2F2F2;
            border: 1px solid #E8E8E8;
        }
        .box_bill{
            padding: 20px;
            box-shadow: 0px 3px 6px #00000029;
            border-radius: 3px;
            margin-bottom: 20px;

        }

        [v-cloak] {
            display: none !important;
        }

        .row_payment{
            display: flex;
            align-items: flex-start;
            margin-bottom: 30px;
        }

        .row_payment div:first-child{
            margin-right: 20px;
            margin-bottom: 0;
        }

        .row_payment:nth-child(2) div:last-child{
            display: flex;
        }

        .row_payment:nth-child(2){
            align-items: center;
        }

        .box_desc{
            background-color: #F8F8F8;
            border-radius: 5px;
            padding: 25px 15px;
            margin-bottom: 30px;
        }
        .custom_select{
            border: 1px solid #E8E8E8;
            border-radius: 3px;
            padding: 8px;
            position: relative;
            width: 490px;
        }
        .custom_select .name{
            text-align: center;
        }
        .custom_select i{
            position: absolute;
            right: 10px;
            color: #E0E0E0;
            font-size: 23px;
            top: 8px;
        }
        .custom_select .box_option_cus{
            background-color: #F2F2F2;
            padding: 5px;
            position: absolute;
            box-shadow: 0px 3px 6px #00000029;
            border-radius: 3px;
            width: 97%;
            z-index: 1;
        }
        .box_option_cus .option{
            padding: 7px;
            cursor: pointer;
        }
        .box_option_cus .option:hover{
           background-color: #FFFFFF ;
            border-radius: 3px;
        }
    </style>
@endpush
@section('content')
    <div class="sub">
        <section class="step2" id="confirmContractStandard" v-cloak>
            <div style="margin-left: 40px;" v-show="page == 1">
                <h2 style="font-size: 23px; color: #51595C; font-weight: bold; padding: 10px 10px 10px 0; margin: 0">
                    契約内容確認</h2>
                <div class="row">
                    <div class="col-md-6" style="min-width: 790px;">
                        <div class="box_option">
                            <div class="title" style="margin-top: 0">お申し込みプラン</div>
                            <div class="box_btn_plan">
                                <span v-if="type_slot == 'standard'">スタンダード</span>
                                <span v-else-if="type_slot == 'pro'">プロ</span>
                                <span v-else-if="type_slot == 'enterprise'">おまとめ（スタンダード）</span>
                                <span v-else-if="type_slot == 'enterprise_pro'">おまとめ（プロ）</span>
                            </div>

                            <div  v-if="type_slot != 'enterprise'">
                                <div class="title">プランを適用するアカウント</div>
                                <div class="custom_select">
                                    <div class="name" v-on:click="showOption">@{{ name_bot ? name_bot : '選択してください' }}</div>
                                    <i class="far fa-chevron-down"></i>
                                    <div class="box_option_cus" v-if="isShowOption && this.contract.contract_type != 'enterprise'">
                                        <div data-id="0" class="option" v-on:click="chooseOption(0)">紐付けを行わず接続枠だけ作成する</div>
                                        @foreach($listBotFree as $bot)
                                            <div data-id="{{ $bot->id }}" class="option" v-on:click="chooseOption({{$bot}})"> {{ $bot->view_name }}</div>
                                        @endforeach

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

                            <div v-if="type_slot == 'enterprise'">
                                <div class="title">ご利用プラン</div>
                                <div class="flag-environment" style="display: flex; align-items: center">
                                    <div class="environment-item" style="  margin-right: 20px"
                                         :class="{active: enterprise_type == 1}">
                                        <label class="c-radio">スタンダード
                                            <input type="radio" value="1"
                                                   v-model="enterprise_type"
                                                   name="enterprise_type">
                                            <span class="checkmark"></span>
                                        </label>
                                    </div>
                                    <div class="d-flex align-item-center">
                                        <div class="environment-item " :class="{active: enterprise_type == 2 }">
                                            <label class="c-radio">プロ
                                                <input type="radio" value="2"
                                                       v-model="enterprise_type"
                                                       name="enterprise_type">
                                                <span class="checkmark"></span>
                                            </label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div v-if="type_slot == 'enterprise'">
                                <div class="title">ご契約枠数</div>
                                <div style="display: flex;align-items: center;">
                                    <select class="form-control my_class" v-model="number_slot" style="width: 120px; margin-right: 5px;">
                                        <option value="10">10</option>
                                        <option value="20">20</option>
                                        <option value="30">30</option>
                                        <option value="40">40</option>
                                        <option value="50">50</option>
                                        <option value="60">60</option>
                                        <option value="70">70</option>
                                        <option value="80">80</option>
                                        <option value="90">90</option>
                                        <option value="100">100</option>
                                    </select>
                                    枠
                                </div>
                            </div>
                            <div>
                                <div class="title">決済期間</div>
                                <div class="flag-environment" style="display: flex; align-items: center">
                                    <div class="environment-item" style="  margin-right: 20px"
                                        :class="{active: contract_term == 1}">
                                        <label class="c-radio">毎月払い
                                            <input type="radio" value="1"
                                                v-model="contract_term"
                                                name="contract_term">
                                            <span class="checkmark"></span>
                                        </label>
                                    </div>
                                    <div class="d-flex align-item-center">
                                        <div class="environment-item " :class="{active: contract_term == 0}">
                                            <label class="c-radio">年間一括払い
                                                <input type="radio" value="0"
                                                    v-model="contract_term"
                                                    name="contract_term">
                                                <span class="checkmark"></span>
                                            </label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div v-if="contract_term == 1">
                                <div class="title">決済金額（税込）</div>
                                <div class="div_amount">¥ @{{ calculatePaymentAmount() }}</div>
                            </div>
                            
                            
                            <div v-if="contract_term == 0">
                                <div class="title">2年分まとめて決済</div>
                                <div class="flag-environment" style="display: flex; align-items: center">
                                    <div class="environment-item" style="  margin-right: 20px"
                                         :class="{active: number_bill == 1}">
                                        <label class="c-radio">利用しない（1年分）
                                            <input type="radio" value="1"
                                                   v-model="number_bill"
                                                   name="number_bill">
                                            <span class="checkmark"></span>
                                        </label>
                                    </div>
                                    <div class="d-flex align-item-center">
                                        <div class="environment-item " :class="{active: number_bill == 2 }">
                                            <label class="c-radio">利用する（2年分）
                                                <input type="radio" value="2"
                                                       v-model="number_bill"
                                                       name="number_bill">
                                                <span class="checkmark"></span>
                                            </label>
                                        </div>
                                    </div>
                                </div>

                                <div class="title">決済金額（税込）</div>
                                <div class="div_amount">¥ @{{ calculatePaymentAmount() }}</div>

                            </div>

                            <div class="title">
                                決済方法
                                <span style="font-size: 12px; font-weight: initial">※年間一括払いの場合のみ、銀行振込がご利用いただけます。</span>
                            </div>

                            <div class="flag-environment" style="display: flex; align-items: center">
                                <div class="environment-item" style="margin-right: 20px"
                                     :class="{active: payment_type == 1}">
                                    <label class="c-radio">クレジットカード
                                        <input type="radio" value="1"
                                               v-model="payment_type"
                                               name="payment_type">
                                        <span class="checkmark"></span>
                                    </label>
                                </div>
                                <div class="d-flex align-item-center">
                                    <div class="environment-item " :class="{active: payment_type == 2 , disabled_r: contract_term == 1}">
                                        <label class="c-radio">銀行振込
                                            <input type="radio" value="2"
                                                   v-model="payment_type"
                                                   :disabled="contract_term == 1"
                                                   name="payment_type">
                                            <span class="checkmark"></span>
                                        </label>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div style="color: #F44336; font-size: 16px;    margin-top: 20px;    margin-bottom: 23px;">
                            お申し込み内容の誤り・誤決済の場合でも返金はできかねますので <br>
                            お申し込み内容を再度ご確認ください。
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-6">
                        <a v-if="type_slot == 'enterprise' && contract_term == 0" href="https://forms.gle/F88uqtEGYEasmDZg8" target="_blank" class="btn btn-sns-line btn-sns-line-lg btn-sns-line-primary" style="box-shadow: 0px 2px 0px #00000080;width: 200px; margin-bottom: 20px;background-color: #C16AC9;">
                            利用申請フォーム <i class="far fa-external-link-square-alt" style="font-size: 20px; vertical-align: middle;margin-left: 10px;"></i>
                        </a>
                        <button v-else type="button" class="btn btn-sns-line btn-sns-line-lg btn-sns-line-primary" style="box-shadow: 0px 2px 0px #00000080;width: 200px; margin-bottom: 20px" v-on:click="nextPage">決済にすすむ</button> <br>
                        <button type="button" @click="backPage()" class="btn btn-sns-line btn-sns-line-lg btn-sns-line-secondary" style="box-shadow: 0px 2px 0px #00000080;width: 120px">戻る</button>
                    </div>
                </div>
            </div>

            <div style="margin-left: 40px;" v-show="page == 2">
                <h2 style="font-size: 23px; color: #51595C; font-weight: bold; padding: 10px 10px 10px 0; margin: 0">契約内容確認</h2>
                <div class="row">
                    <div class="col-md-6" style="min-width: 790px;">
                        <div class="box_desc" v-if="action_bill == 'new'">
                            <p>決済方法は以下のみとなります。</p>
                            <p>・毎月決済（年払いはご利用いただけません）</p>
                            <p>・クレジットカード決済のみ（銀行振込はご利用いただけません）</p>
                        </div>
                        <div class="box_desc" v-if="action_bill == 'upgrade_pro'">
                            <p>スタンダードプラン→プロプランへのアップグレードの場合は日割り計算での請求となります。</p>
                            <p>月払いの場合：731円×次回決済日までの日数</p>
                            <p>年払いの場合：658円×次回決済日までの日数</p>
                        </div>
                        <div class="box_option">
                            <div class="title" style="margin-top: 0">お申し込みプラン</div>
                            <div class="box_btn_plan" v-if="action_bill != 'upgrade_pro'">
                                <span v-if="type_slot == 'standard'">スタンダード</span>
                                <span v-else-if="type_slot == 'pro'">プロ</span>
                                <span v-else-if="type_slot == 'enterprise'">おまとめ（スタンダード）</span>
                                <span v-else-if="type_slot == 'enterprise_pro'">おまとめ（プロ）</span>
                            </div>
                            <div class="box_btn_plan" style="padding: 0; font-size: 14px;" v-else>プロプラン <span v-if="calculateDays() > 0">（日割り計算<span v-html="calculateDays()"></span>日分）</span></div>

                            <div  v-if="type_slot != 'enterprise'">
                                <div class="title">プランを適用するアカウント</div>
                                <div class="custom_select" style="background-color: #F2F2F2;">
                                    <div class="name"  v-on:click="showOption">@{{ name_bot ? name_bot : '紐付けを行わず接続枠だけ作成する' }}</div>
                                </div>
                            </div>

                            <div class="title">決済期間</div>
                            <div class="flag-environment" style="display: flex; align-items: center">
                                <div class="box_btn_plan">
                                    <span v-if="contract_term == 1">毎月払い</span>
                                    <span v-else>年間一括払い</span>
                                </div>
                            </div>
                            <div v-if="contract_term == 1">
                                <div class="title">決済金額（税込）</div>
                                <div class="div_amount" v-if="action_bill == 'upgrade_pro'">¥ @{{ calculateMoneyUpgrade() }}</div>
                                <div class="div_amount" v-else>¥ @{{ calculatePaymentAmount() }}</div>
                            </div>
                            <div v-if="type_slot == 'enterprise'">
                                <div class="title" style="margin-top: 15px;">ご契約枠数</div>
                                <div class="box_btn_plan">
                                    @{{ number_slot }}枠
                                </div>
                            </div>
                            <div v-if="contract_term == 0">
                                <div class="title">2年分まとめて決済</div>
                                <div class="flag-environment" style="display: flex; align-items: center">
                                    <div class="box_btn_plan">
                                        <span v-if="number_bill == 1">利用しない（1年分）</span>
                                        <span v-else>利用する（2年分）</span>
                                    </div>
                                </div>

                                <div class="title">決済金額（税込）</div>
                                <div class="div_amount" v-if="action_bill == 'upgrade_pro'">¥ @{{ calculateMoneyUpgrade() }}</div>
                                <div class="div_amount" v-else>¥ @{{ calculatePaymentAmount() }}</div>

                            </div>

                            <div class="title">
                                決済方法
                            </div>

                            <div class="flag-environment" style="display: flex; align-items: center">
                                <div class="box_btn_plan">
                                    <span v-if="payment_type == 1">クレジットカード</span>
                                    <span v-else>銀行振込</span>
                                </div>
                            </div>

                            <div class="expire_date">
                                <div class="title">決済開始日（次回決済日から）</div>
                                <div class="box_btn_plan">
                                    @{{ calculateExpireDate() }}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row" style="margin-top: 30px;">
                    <div class="col-md-6">
                        <button type="button" class="btn btn-sns-line btn-sns-line-lg btn-sns-line-primary" style="box-shadow: 0px 2px 0px #00000080;width: 200px; margin-bottom: 20px" v-on:click="nextPayment">決済にすすむ</button> <br>
                        <button type="button" @click="backPage()" class="btn btn-sns-line btn-sns-line-lg btn-sns-line-secondary" style="box-shadow: 0px 2px 0px #00000080;width: 120px">戻る</button>
                    </div>
                </div>
            </div>

           <div style="margin-left: 40px;" v-show="page == 3">
               <h2 style="font-size: 23px; color: #51595C; font-weight: bold; padding: 10px 10px 10px 0; margin: 0">クレジットカード決済</h2>
               <div class="row">
                   <div class="col-md-6" style="min-width: 790px;">
                       <div class="box_bill" style="">
                           <div style="display: flex;align-items: center;font-size: 14px; margin-bottom: 30px;">
                               <div style="background-color: #F8F8F8; border-radius: 3px;
                                    padding: 8px;
                                    width: 100px;
                                    text-align: center;
                                    margin-right: 20px">決済金額</div>
                                    <div v-if="action_bill == 'upgrade_pro'">¥ @{{ calculateMoneyUpgrade() }}</div>
                                    <div v-else>@{{ calculatePaymentAmount() }}円</div>
                           </div>

                           <div style="text-align: center;margin-bottom: 20px">
                               <span><img class="img-card" src="/images/visa.png"></span>
                               <span><img class="img-card" src="/images/mastercard.png"></span>
                               <span><img class="img-card" src="/images/jcbcard.png"></span>
                               <span><img class="img-card" src="/images/americanexpress.png"></span>
                               <span><img class="img-card" src="/images/dinerscard.png"></span>
                           </div>
                           <form id="payment-form-univapay" action="">
                               <div id="checkout">
                               </div>
                           </form>
                       </div>
                   </div>
               </div>
               <div class="row">
                   <div class="col-md-6">
                       <button onclick="getPaymentInfo()" type="button" class="btn btn-sns-line btn-sns-line-lg btn-sns-line-primary" style="box-shadow: 0px 2px 0px #00000080;width: 200px; margin-bottom: 20px">決済する</button> <br>
                       <button type="button" @click="backPage()" class="btn btn-sns-line btn-sns-line-lg btn-sns-line-secondary" style="box-shadow: 0px 2px 0px #00000080;width: 120px">戻る</button>

                   </div>
               </div>
           </div>
           <div style="margin-left: 40px;" v-show="page == 4">
               <h2 style="font-size: 23px; color: #51595C; font-weight: bold; padding: 10px 10px 10px 0; margin: 0">銀行振込</h2>
               <div class="row">
                   <div class="col-md-6" style="min-width: 850px;">
                       <div class="box_bill" >
                           <div class="row_payment">
                                <div class="box_btn_plan">振込銀行口座</div>
                                <div class="info_bank_transfer">
                                    <div v-html="bank_name"></div>
                                    <div v-html="branch_name"></div>
                                    <div v-html="account_number"></div>
                                    <div v-html="expired_transfer"></div>
                                </div>
                           </div>
                           <div class="row_payment">
                                <div class="box_btn_plan">振込金額</div>
                                <div class="info_money">
                                    <div v-if="action_bill == 'upgrade_pro'">¥ @{{ calculateMoneyUpgrade() }}</div>
                                    <div v-else>@{{ calculatePaymentAmount() }}円</div>
                                    <div>※振込手数料はご負担いただきますようお願いいたします。</div>
                                </div>
                           </div>
                           <div style="background-color: #F8F8F8; padding: 10px 20px;border-radius: 3px;opacity: 1;">
                                本日より7日間以内に上記口座にご利用料金をお振込みください。お振込み後、有料プランが有効化 されます。有料プランの有効化まで最短数分~最長数日（土日祝日をはさむ場合など）かかる場合が ございます。振込口座情報はご登録のメールアドレスにもお送りしています。
                           </div>
                       </div>
                   </div>
               </div>
               <div class="row">
                   <div class="col-md-6">
                       <button type="button" @click="backHomeList()" class="btn btn-sns-line btn-sns-line-lg btn-sns-line-secondary" style="box-shadow: 0px 2px 0px #00000080;">アカウント一覧に戻る</button>
                   </div>
               </div>
           </div>
        </section>
    </div>
@endsection
@push('script')
    <script>
        const basic_fee = '{{ $basicFee }}';
        const plan_pro_fee = '{{ config("sns-line.plan_pro_fee") }}';
        var contractType = '{{ $contractType }}'; 
        var billType = '{{ $billType }}'; 
        var botId = '{{ $botId }}'; 
        var botName = '{{ $botName }}';
        var bot = null;
        var contract = null;
    </script>
    <script src="https://widget.univapay.com/client/checkout.js"></script>
    <script src="/js/media/vue.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
    <script src="/js/admin/bot.js?v={{config('sns-line.version')}}"></script>
    <script src="/js/admin/confirm_contact_standard.js?v={{config('sns-line.version')}}"></script>
    <script>
        function addFlagGetOldFriend() {
            var bot_id = $("input[name='id']").val();
            console.log(bot_id);
            $.ajax({
                type: "POST",
                url: "/ajax/add-flag-get-old-friend",
                data: {
                    bot_id: bot_id
                }, // serializes the form's elements.
                success: function (data) {
                    if (data.success == true) {
                        alert(data.message);
                    } else {
                        alert(data.message);
                    }
                },
                error: function (data) {
                    console.log(data)
                    alert(data.message);
                }

            });
        }

        function reGetAvatarBot(id) {

            $.ajax({
                type: "POST",
                url: "/ajax/reGetAvatarBot",
                data: {
                    bot_id: id
                }, // serializes the form's elements.
                success: function (data) {
                    if (data.success == true) {
                        window.location.reload();
                    } else {
                        alert(data.message);
                    }
                },
                error: function (data) {
                    alert(data.message);
                }

            });
        }


        $(document).ready(function () {
            var flag_bot = $('#flag_bot_line_id').val();
            console.log(flag_bot);
            if (flag_bot == 1) {
                $('#bot_line_id').focus();
            }
        });


        function copyClipBoard(id) {
            var copyText = document.getElementById(id);

            var $temp = $("<input>");
            $("body").append($temp);
            $temp.val(copyText.value).select();
            document.execCommand("copy");
            $temp.remove();
            var notificationTag = $("div.copy-notification");
            var notificationText = "Copied to clipboard";
            var showNotification = true;
            if (showNotification && notificationTag.length == 0) {
                var notificationTag = $("<div/>", {"class": "copy-notification", text: notificationText});
                $("body").append(notificationTag);
                notificationTag.fadeIn("slow", function () {
                    setTimeout(function () {
                        notificationTag.fadeOut("slow", function () {
                            notificationTag.remove();
                        });
                    }, 1000);
                });
            }
        }

        function checkLinkBot(item) {
            console.log(item);
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                url: '/admin/bot/check-mode',
                beforeSend: function () {
                    $.LoadingOverlay('show');
                },
                type: 'POST',
                data: {bot_id: item.id}
            }).done(function (a, b, c) {
                console.log(a);
                if (a.success && a.msg) return alert(a.msg), !1;

                if (!a.success) {
                    if (typeof a.chatMode != 'undefined' && !a.chatMode) {

                        $('#modal-err-status-link').modal('show');
                        $('#bot_id').val(item.id);
                    }
                    if (typeof a.status_link != 'undefined' && !a.status_link) {
                        $('#modal-err-status-link').modal('show');
                        $('#bot_id').val(item.id);
                    }

                } else {
                    alert(a.msg)
                }

                $.LoadingOverlay('hide');
            }).fail(function (a, b, c) {
                $.LoadingOverlay('hide');
            }).always(function (a, b) {
                $.LoadingOverlay('hide');
            });

        }

        function reLink() {

            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                url: '/admin/bot/check-mode',
                beforeSend: function () {
                    $.LoadingOverlay('show');
                },
                type: 'POST',
                data: {bot_id: $('#bot_id').val()}
            }).done(function (a, b, c) {
                console.log(a);

                if (!a.status_link) {
                    $('#modal-check-domain').modal('show');
                    $('#bot_id').val($('#bot_id').val());
                } else {
                    if (a.msg) return alert(a.msg), !1;
                }


                $.LoadingOverlay('hide');
            }).fail(function (a, b, c) {
                $.LoadingOverlay('hide');
            }).always(function (a, b) {
                $.LoadingOverlay('hide');
            });

        }

        function closeModalReLink() {
            $('#modal-relink').modal('hide');
        }

        function closeModalActiveDomain() {
            $('#modal-active-domain').modal('hide');
        }

        function checkActiveDomain() {
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                url: '/admin/bot/check-active-domain',
                beforeSend: function () {
                    $.LoadingOverlay('show');
                },
                type: 'POST',
                data: {bot_id: $('#bot_id').val()}
            }).done(function (a, b, c) {
                console.log(a)

                if (a.success == 0 && a.msg) return alert(a.msg), !1;
                if (!a.active) {
                    $('#modal-active-domain').modal('show');
                } else {
                    window.location.reload();
                }

                $.LoadingOverlay('hide');
            }).fail(function (a, b, c) {
                $.LoadingOverlay('hide');
            }).always(function (a, b) {
                $.LoadingOverlay('hide');
            });
        }

        function setDomain() {

            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                url: '/admin/bot/set-domain',
                beforeSend: function () {
                    $.LoadingOverlay('show');
                },
                type: 'POST',
                data: {bot_id: $('#bot_id').val()}
            }).done(function (a, b, c) {
                console.log(a);
                if (a.success == 0 && a.msg) return alert(a.msg), !1;
                $('#modal-active-domain').modal('show');


                $.LoadingOverlay('hide');
            }).fail(function (a, b, c) {
                $.LoadingOverlay('hide');
            }).always(function (a, b) {
                $.LoadingOverlay('hide');
            });
        }
    </script>
@endpush