@extends("common.layout")
@section("header")
    {!! resource('js/payment/payment-common.js') !!}
@endsection
@section("content")
    <div class="split">
        <h1><a href="{{ route('payment.list', $service) }}">결제등록</a></h1>
    </div>

    <div class="row">
        <div class="col-md-12 align-right my-2">
            <button class="btn btn-secondary" type="button" onclick="location.href='{{ route('payment.list', $service) }}'">목록</button>
            <button class="btn btn-primary" type="button" onclick="onSubmit()">저장</button>
        </div>
    </div>

    <form class="default">
        <div class="row mt-0">
            <div class="col-lg-6 col-md-12">
                <section class="mb-3">
                    <header>
                        고객정보
                        @if ( $user == null )
                        <button class="btn btn-sm btn-primary" type="button" onclick="onOpenPaymentUser()">검색</button>
                        @endif
                    </header>
                    <main>
                        <ul class="row m-0 px-0 def-list" >
                            <li class="col-3 m-0 px-0">
                                <label>이름</label>
                                <div id="name">{{ $user?->name }}</div>
                            </li>
                            <li class="col-6 m-0 px-0">
                                <label>아이디/이메일</label>
                                <div id="login_id">{{ $user?->email }} {{ $user?->edm_id ? "(".$user?->edm_id.")"  : ""}} </div>
                            </li>
                            <li class="col-3 m-0 px-0">
                                <label>연락처</label>
                                <div id="phone">{{ $user?->phone }}</div>
                            </li>
                        </ul>
                    </main>
                </section>

                <section id="payment">
                    <header>
                        결제정보
                    </header>
                    <main>
                        <input type="hidden" name="user_id" id="user_id" value="{{ $user?->id }}" />
                        <input type="hidden" name="service" id="service" value="{{ $service }}" />
                        <input type="hidden" name="price" id="product_price" value="" />
                        <input type="hidden" name="discount_price" id="coupon_price" value="" />
                        <input type="hidden" name="location" id="location" value="OFFLINE" />

                        <table class="table table-bordered sub-table" style="--th-cols: 4">
                            <tr>
                                <th>
                                    <label class="required">결제상태</label>
                                </th>
                                <td>
                                    <select class="form-select form-select-sm" name="status" id="status">
                                        @foreach ($status as $val)
                                            @if (in_array($val['value'], ['READY', "FAILED"])) {
                                                @continue
                                            @endif
                                            <option value="{{ $val['value'] }}" @selected(Request::has("status") ? $val['value'] == Request::get('status') : $val['value'] == "PAID")>{{ $val['name'] }}</option>
                                        @endforeach
                                    </select>
                                </td>
                                <th>
                                    <label class="required approval_tag">승인번호</label>
                                </th>
                                <td>
                                    <div class="row m-0 px-0">
                                        <div class="col-9 px-0">
                                            <input type="text" name="approval_no" class="form-control form-control-sm number-only" value="" id="approval_no" />
                                        </div>
                                        <div class="col-3 align-right px-0" id="btn_approval" style="display: none">
                                            <button class="btn btn-sm btn-primary" type="button" onclick="onSearchApprovalNo()">조회</button>
                                        </div>
                                    </div>
                                    <div class="mx-0 mt-1 mb-0 font-sm approval_help" style="display: none">
                                        <span class="px-0 mr-3 text-secondary">
                                            * 주문번호가 승인번호로 들어갑니다.
                                        </span>
                                    </div>

                                </td>
                            </tr>
                            <tr>
                                <th>
                                    <label class="required">결제수단</label>
                                </th>
                                <td>
                                    <select class="form-select form-select-sm" name="method" id="method">
                                        @foreach ($method as $val)
                                            <option value="{{ $val['value'] }}">{{ $val['name'] }}</option>
                                        @endforeach
                                    </select>
                                </td>
                                <th>
                                    <label class="required">실결제액</label>
                                </th>
                                <td>

                                    <input type="text" name="total_price" class="form-control form-control-sm number-format" id="total_price">
                                    <div class="d-flex mx-0 mt-1 mb-0 font-sm" >
                                        <span class="px-0 mr-3 text-secondary">
                                            실 결제액 계산하기
                                            <i class="bi bi-info-circle" data-bs-toggle="tooltip" data-bs-placement="right" data-bs-title="on일 경우, 금액이 계산됩니다."></i>
                                        </span>
                                        <div class="form-check form-switch" style="min-height: auto">
                                            <input class="form-check-input" type="checkbox" role="switch" id="is_calculate" name="is_calculate" value="1" checked>
                                        </div>
                                    </div>
                                </div>
                                </td>
                            </tr>
                            <tr>
                                <th>
                                    <label class="required method-card">일시불/할부</label>
                                </th>
                                <td>
                                    <div class="row m-0 px-0">
                                        <div class="col-6 px-0">
                                            <select class="form-select form-select-sm" name="is_sum" id="is_sum">
                                                <option value="0">선택</option>
                                                <option value="1">일시불</option>
                                                <option value="2">할부</option>
                                            </select>
                                        </div>
                                        <div class="col-6 px-0">
                                            <select class="form-select form-select-sm" name="monthly_count" id="monthly_count" disabled>
                                                <option value="0">선택</option>
                                                @for ($i = 2 ; $i < 13 ; $i++)
                                                    <option value="{{ $i }}">{{ $i }}개월</option>
                                                @endfor
                                                <option value="18">18개월</option>
                                                <option value="24">24개월</option>
                                                <option value="36">36개월</option>
                                                <option value="48">48개월</option>
                                                <option value="60">60개월</option>
                                            </select>
                                        </div>
                                    </div>
                                </td>
                                <th>
                                    <label class="required method-card">카드정보</label>
                                </th>
                                <td>
                                    <select class="form-select form-select-sm" name="card_name" id="card">
                                        <option value="">선택</option>
                                        @foreach ($cards as $val)
                                            <option value="{{ $val['value'] }}">{{ $val['name'] }}</option>
                                        @endforeach
                                    </select>
                                </td>
                            </tr>
                            @if ($service == 'academy')
                            <tr>
                                <th>
                                    <label class="">번호/발급</label>
                                </th>
                                <td>
                                    <input type="text" name="cash_number" class="form-control form-control-sm" id="cash_number">
                                </td>
                                <th>
                                    <label class="settle_type">구분</label>
                                </th>
                                <td>
                                    <select class="form-select form-select-sm" name="settle_type">
                                        <option value="">선택</option>
                                        <option value="수강">수강</option>
                                        <option value="첨삭">첨삭</option>
                                        <option value="CDT<">CDT</option>
                                        <option value="교재">교재</option>
                                        <option value="기타">기타</option>
                                    </select>
                                </td>
                            </tr>
                            @endif
                            <tr>
                                <th>
                                    <label class="required">거래일자</label>
                                </th>
                                <td>
                                    <input type="date" name="paid_at" id="paid_at" class="form-control form-control-sm" value="{{ date("Y-m-d") }}">
                                </td>
                                <th><label class="">취소일자</label></th>
                                <td>
                                    <input type="date" name="cancel_at" id="cancel_at" class="form-control form-control-sm" disabled>
                                </td>
                            </tr>
                        </table>
                </section>

                <section class="mt-3" id="receipt_form" style="display: none">
                    <header>현금영수증 정보</header>
                    <main>
                        <div class="sub-title">승인정보</div>
                        @include("payment.layout.payment-receipt", ['status' => "ISSUED"])
                    </main>
                </section>
            </div>

            <div class="col-lg-6 col-md-12">
                <section class="mb-3">
                    <header>
                        구매상품
                        <button class="btn btn-sm btn-primary" type="button" onclick="onOpenPaymentProduct('{{  $service }}')">검색</button>
                    </header>
                    <main>
                        @include("payment.layout.payment-product-empty")
                    </main>
                </section>

                <section>
                    <header>
                        사용쿠폰
                        <button class="btn btn-sm btn-primary" type="button" onclick="onOpenPaymentCoupon('{{  $service }}')">검색</button>

                    </header>
                    <main>
                        <table class="table table-striped table-hover" id="coupon">
                            <colgroup>
                                <col width="/">
                                <col width="10%">
                                <col width="10%">
                                <col width="5%">
                            </colgroup>
                            <thead>
                                <tr>
                                    <th>쿠폰명</th>
                                    <th>할인액(%)</th>
                                    <th>적용금액</th>
                                    <th>관리</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr id="default" style="display: none">
                                    <input type="hidden" name="coupon_id" value="" data-accept="false">
                                    <input type="hidden" name="product_option_id" value="" data-accept="false">
                                    <input type="hidden" name="discount_price" value="" data-accept="false">
                                    <input type="hidden" name="is_overlapping" value="" data-accept="false">
                                    <td class="coupon_name"></td>
                                    <td class="discount_value"></td>
                                    <td class="price"></td>
                                    <td class="align-center">
                                        <button class="btn btn-sm btn-danger onRemoveRow" type="button">
                                            <i class="bi bi-trash"></i>
                                        </button>
                                    </td>
                                </tr>
                            </tbody>
                            <tfoot>
                                <tr class="warning">
                                    <th colspan="2">총 할인금액</th>
                                    <td colspan="2" class="align-right">
                                        <strong class="total_price text-danger"></strong>원
                                    </td>
                                </tr>
                            </tfoot>
                        </table>
                    </main>
                </section>
            </div>
        </div>
    </form>
@endsection

@push("script")
    <script>
        function onSubmit() {
            const isReceipt = $('#receipt_form').css('display') == 'none';
            const checkFields = (isReceipt ? $('#payment .required') : $('.required')).closest("th").next().find("input, select") ;
            let isEmpty = false;
            $.each(checkFields, function() {
                if (! $(this).attr("disabled")) {
                    isEmpty = $.isEmptyObject($(this).val()) ? true : isEmpty;
                }
            })

            if ($.isEmptyObject($('#user_id').val())) {
                alertify.alert("알림", "고객정보(이름/아이디/연락처)를 입력해 주셔야 합니다.");
                return false;
            }

            if (isEmpty) {
                alertify.alert("알림", "필수값을 모두 입력해주세요");
                return false;
            }

            //상태값 확인하여, 취소가 들어가면 alert
            if (! isCreateStatus()) {
                alertify.alert("알림", "결제완료된 최초 승인번호가 있어야 부분취소/결제취소 저장이 가능합니다.<br>승인번호가 존재하는지 조회해주세요 ");
                return false;
            }

            //validation check
            const payment = getData("payment");
            payment['user_id'] = payment['user_id'] ? payment['user_id'] : 0;
            payment['monthly_count'] = payment['is_sum'] == 1 ? 1 : payment['monthly_count'];
            const params = {
                "payment" : payment,
                "product" : getData("product"),
                "coupon" : getData("coupon")
            };

            if ( ! isReceipt ) {
                params['receipt'] = getData('receipt_form');
            }

            alertify.confirm("알림", "저장하시겠습니까?", async () => {
                const result = await customFetch("{{ route('api.payment.create') }}", {
                    method: "POST",
                    body : JSON.stringify(params) ,
                    headers: { "Content-Type" : "application/json"}
                });


                if (result.status) {
                    alertify.alert("완료", "등록되었습니다.", () => {
                        location.href = "{{ route("payment.list", $service) }}";
                    });
                } else {
                    alertify.alert("error", result.message)
                }
            }, () => { })  ;
        }



        async function onSearchApprovalNo() {

            if ($.isEmptyObject($("#approval_no").val())) {
                alertify.alert("알림", "승인번호를 입력해주세요");
                return false;
            }

            const result = await customFetch("{{ route('api.payment.search') }}?&approval_no="+ $("#approval_no").val(), {
                method: "GET",
                headers: { "Content-Type" : "application/json"}
            });

            if (result.status) {
                alertify.confirm("알림" , "해당 승인 번호가 저장된 페이지를 복사하여 불러옵니다.", () => {
                    const href = "{{ route('payment.detail', ':paymentId') }}?status=" + $('#status').val();
                    location.href= href.replace(":paymentId", result.payment_id);
                }, () => { });

            } else {
                if (isCreateStatus()) {
                    alertify.alert("알림", "승인번호가 등록되지 않았습니다<br>결제정보를 입력해주세요");
                } else {
                    alertify.alert("error", result.message);
                }

            }

        }
    </script>
@endpush