<!doctype html>
<html lang="ko">

<head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Language" content="ko">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>컨펌스 로그인</title>
    <meta name="viewport"
        content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, shrink-to-fit=no" />
    <meta name="description" content="ArchitectUI HTML Bootstrap 5 Dashboard Template">

    <script defer src="/architectui/assets/scripts/vendors.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/main.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/demo.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/ladda.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/blockui.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/circle_progress.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/count_up.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/toastr.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/sweet_alerts.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/scrollbar.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/sticky_elements.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/carousel_slider.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/fullcalendar.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/treeview.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/maps.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/rating.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/image_crop.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/guided_tours.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/tables.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/form_validation.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/form_wizard.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/clipboard.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/datepicker.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/input_mask.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/input_select.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/range_slider.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/textarea_autosize.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/toggle_switch.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/chart_js.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/apex_charts.98288b227c064e6a107f.js"></script>
    <script defer src="/architectui/assets/scripts/sparklines.98288b227c064e6a107f.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <link href="/architectui/assets/styles/vendors.98288b227c064e6a107f.css" rel="stylesheet">
    <link href="/architectui/assets/styles/main.98288b227c064e6a107f.css" rel="stylesheet">
</head>

<body>
    <div class="my-loader-template d-none">
        <div class="loader bg-transparent no-shadow p-0">
            <div class="ball-grid-pulse">
                <div class="bg-white"></div>
                <div class="bg-white"></div>
                <div class="bg-white"></div>
                <div class="bg-white"></div>
                <div class="bg-white"></div>
                <div class="bg-white"></div>
                <div class="bg-white"></div>
                <div class="bg-white"></div>
                <div class="bg-white"></div>
            </div>
        </div>
    </div>
    <div class="app-container app-theme-white body-tabs-shadow">
        <div class="app-container">
            <div class="h-100 bg-plum-plate bg-animation">
                <div class="d-flex h-100 justify-content-center align-items-center py-4">
                    <div class="mx-auto col-sm-10 col-md-8 col-lg-6 col-xl-5">
                        <div class="card border-0"
                            style="border-radius: 24px; background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(20px); box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);">
                            <div class="card-body p-5">
                                <div class="text-center mb-5">
                                    <div class="app-logo mx-auto mb-4"></div>
                                    <!-- <h1 class="fw-bold text-dark mb-2" style="font-size: 2rem;">환영합니다</h1> -->
                                    <p class="text-muted fs-5 mb-0">아이디와 비밀번호를 적어 주세요.</p>
                                </div>

                                <form class="" id="frm_login_info">
                                    <div class="form-floating mb-4">
                                        <input name="user_id" id="user_id" placeholder="아이디 입력" type="text"
                                            value="<?= $user_id ?? '' ?>"
                                            class="form-control form-control-lg border-0 shadow-sm"
                                            style="border-radius: 16px; background: rgba(248, 250, 252, 0.8); height: 58px;">
                                        <label for="user_id" class="text-muted">
                                            <i class="fa fa-user me-2 text-primary"></i>
                                            아이디
                                        </label>
                                    </div>

                                    <div class="form-floating mb-4">
                                        <input name="user_pw" id="user_pw" placeholder="비밀번호 입력" type="password"
                                            class="form-control form-control-lg border-0 shadow-sm"
                                            style="border-radius: 16px; background: rgba(248, 250, 252, 0.8); height: 58px;">
                                        <label for="user_pw" class="text-muted">
                                            <i class="fa fa-lock me-2 text-primary"></i>
                                            비밀번호
                                        </label>
                                    </div>

                                    <div class="d-flex justify-content-between align-items-center mb-4">
                                        <div class="form-check">
                                            <input id="saveId" name="saveId" type="checkbox" class="form-check-input"
                                                style="transform: scale(1.2);" value="Y" <?php if (!empty($user_id)) {
                                                    echo "checked";
                                                } ?>>
                                            <label for="saveId"
                                                class="form-check-label text-muted fw-medium">아이디저장</label>
                                        </div>
                                        <a onclick="faxOpen();" class="text-primary text-decoration-none fw-semibold">
                                            팩스 수신 확인
                                        </a>
                                    </div>

                                    <button type="submit"
                                        class="btn btn-gradient-primary btn-shadow btn-lg w-100 mb-4 fw-semibold text-white"
                                        id="btn_login" style="border-radius: 16px; height: 58px; font-size: 1.1rem;">
                                        <i class="fa fa-sign-in-alt me-2"></i>로그인
                                    </button>
                                </form>

                            </div>
                        </div>

                        <div class="text-center mt-4">
                            <p class="text-white mb-0"
                                style="font-size: 0.9rem; text-shadow: 0 1px 2px rgba(0,0,0,0.1);">
                                Copyright © Confirms All Rights Reserved.
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- 모달영역-->
    <div class="modal fade" id="faxModal" tabindex="-1">
        <div class="modal-dialog modal-lg modal-dialog-centered modal-dialog-scrollable">
            <div class="modal-content">

                <!-- Header -->
                <div class="modal-header">
                    <h5 class="modal-title">팩스 수신 확인</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>

                <!-- Body -->
                <div class="modal-body">

                    <form id="frm_srch_info" onsubmit="return false;">
                        <!-- 검색 영역 -->
                        <div class="row g-2 align-items-end mb-3">
                            <div class="col-md-2">
                                <label class="form-label mb-1">발신 팩스 번호</label>
                                <input type="text" class="form-control form-control-sm" name="caller_no"
                                    placeholder="번호 입력" />
                            </div>
                            <div class="col-md-4 text-start">
                                <button type="button" class="btn btn-sm btn-primary" id="btnSearch">
                                    검색
                                </button>
                            </div>
                        </div>
                        <hr class="my-2">
                        <!-- 테이블 영역 -->
                        <div class="table-responsive">
                            <table id="tblFax" class="table table-sm table-bordered table-hover align-middle mb-0">
                                <caption class="caption-top small text-muted">FAX 수신 현황</caption>
                                <thead class="table-light">
                                    <tr>
                                        <th class="text-center">수신기간</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <!-- 데이터 -->
                                </tbody>
                            </table>
                        </div>

                    </form>
                </div>
                <!-- Footer -->
                <div class="modal-footer py-2">
                    <button type="button" class="btn btn-sm btn-secondary" data-bs-dismiss="modal">
                        닫기
                    </button>
                </div>

            </div>
        </div>
    </div>
    <!-- 모달영역-->

    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.13.6/css/jquery.dataTables.min.css" />
    <script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
    <script defer src="/architectui/assets/js/datatable.kor.js"></script>
    <script type="text/javascript">

        const tpl = document.querySelector('.my-loader-template');
        var table;

        $(function () {

            $("#btnSearch").on("click", function () {
                table.ajax.reload();
            });


            $("#frm_login_info").on("submit", function (e) {
                e.preventDefault(); // 기본 submit 막기

                $.ajax({
                    url: '/login/chkLogin',
                    contentType: 'application/x-www-form-urlencoded;charset=UTF-8',
                    method: 'POST',
                    data: $("#frm_login_info").serialize(),
                    beforeSend: function () {

                        blockUI.blockPage({
                            message: tpl
                        })
                    },
                    complete: function () {
                        blockUI.unblockPage()
                    },
                    error: function (xhr, error, thrown) {
                        blockUI.unblockPage()
                        console.log(xhr.responseText);
                    },
                    success: function (result) {
                        if (result.code === "0") {
                            location.href = '/'
                        } else {
                            var errors = result.errors

                            if (errors != null) {

                                var msg = ""
                                msg += errors.user_id != null ? errors.user_id : ""
                                msg += errors.user_pw != null ? "\n" + errors.user_pw : ""

                                Swal.fire({
                                    title: msg,
                                    icon: "error",
                                    draggable: true
                                })

                            } else {
                                Swal.fire({
                                    title: result.msg,
                                    icon: "error",
                                    draggable: true
                                })
                            }



                        }
                    }
                })

            });

        });


        function faxOpen() {
            table = $('#tblFax').DataTable({
                language: lang_kor,
                serverSide: true,
                processing: true,
                ajax: {
                    url: '/listfax/listfax/getLists',
                    type: 'GET',
                    beforeSend: function () {
                        blockUI.blockPage({
                            message: tpl
                        })
                    },
                    complete: function () {
                        blockUI.unblockPage()
                    },
                    data: function (d) {

                        d.caller_no = $("#frm_srch_info [name=caller_no]").val();

                        d.start = d.start || 0
                        d.length = d.length || 10
                    },
                },
                "columnDefs": [
                    { className: 'text-center', targets: '_all' },
                    { 'targets': '_all', "defaultContent": "" },
                ],
                columns: [
                    { data: 'atcl_no' },
                ],
                // 옵션들 예시
                paging: true,
                searching: false,
                ordering: false,
            });

            $("#faxModal").modal("show");
        }

    </script>
</body>

</html>