<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" session="false"%>
<%@ include file="/WEB-INF/jsp/include/taglib.jsp"%>

<!-- Page Body -->
<div class="card wrapper-list" data-doctx="${pageName}">
    <div>
        <!-- 입력 영역 -->
        <form name="frmEdit">
            <!-- hidden -->
            <input type="hidden" name="crdnId" data-map="CRDN_ID" />

            <div class="row g-1">
                <div class="col-md-2">
                    <label is="name-label" class="w-px-80 bg-lighter pe-2 col-form-label text-sm-end" for="vhrno">차량번호</label>
                    <input is="id-input" type="text" class="form-control w-65 fw-bold" name="vhrno" data-map="VHRNO" readonly />
                </div>
                <div class="col-md-2">
                    <label is="name-label" class="w-px-80 bg-lighter pe-2 col-form-label text-sm-end" for="crdnYmdTm">단속일시</label>
                    <input is="id-input" type="text" class="form-control w-65 fw-bold" name="crdnYmdTm" data-map="CRDN_YMD_TM" data-fmt-type="dt" readonly />
                </div>
                <div class="col-md-2">
                    <label is="name-label" class="w-px-80 bg-lighter pe-2 col-form-label text-sm-end" for="gojiNo">고지번호</label>
                    <input is="id-input" type="text" class="form-control w-65 fw-bold" name="gojiNo" data-map="GOJI_NO" readonly />
                </div>
                <div class="col-md-4">
                    <label is="name-label" class="w-px-80 bg-lighter pe-2 col-form-label text-sm-end" for="crdnSttsNm">단속상태</label>
                    <input is="id-input" type="text" class="form-control w-30 fw-bold text-primary" name="crdnSttsNm" data-map="CRDN_STTS_NM" readonly />
                    <input is="id-input" type="text" class="form-control w-35 fw-bold" name="crdnSttsChgDt" data-map="CRDN_STTS_CHG_DT" data-fmt-type="dt" readonly />
                    <input type="hidden" name="crdnSttsCd" data-map="CRDN_STTS_CD" />
                </div>
                <!-- 자료 이동 버튼 -->
                <div class="col-md-2 text-end">
                    <input is="id-input" type="text" class="form-control w-px-120 text-center fw-bold" name="countStatus" readonly />
                    <button type="button" class="w-px-50 btn-PageUp" name="btnPrev">◀</button>
                    <button type="button" class="w-px-50 btn-PageDown" name="btnNext">▶</button>
                </div>
            </div> <!-- <div class="row g-1"> -->
        </form>
        <!-- 입력 영역 -->
    </div>

    <div class="nav-align-top">
        <ul class="nav nav-tabs" role="tablist">
            <li class="nav-item">
                <button type="button" class="nav-link w-px-160 h-75 active" name="btnCrdnPayer" role="tab" data-bs-toggle="tab" data-bs-target="#crdnPayerInfo" aria-controls="crdnPayerInfo" aria-selected="true">
                    단속 정보
                </button>
            </li>
            <li class="nav-item">
                <button type="button" class="nav-link w-px-160 h-75" name="btnOpnnSbmsn" role="tab" data-bs-toggle="tab" data-bs-target="#opnnSbmsnInfo" aria-controls="opnnSbmsnInfo" aria-selected="false">
                    의견제출 정보
                </button>
            </li>
            <li class="nav-item">
                <button type="button" class="nav-link w-px-160 h-75" name="btnSndng" role="tab" data-bs-toggle="tab" data-bs-target="#sndngInfo" aria-controls="sndngInfo" aria-selected="false">
                    발송반송 정보
                </button>
            </li>
            <li class="nav-item">
                <button type="button" class="nav-link w-px-160 h-75" name="btnPrcs" role="tab" data-bs-toggle="tab" data-bs-target="#prcsInfo" aria-controls="prcsInfo" aria-selected="false">
                    처리상세 정보
                </button>
            </li>
            <li class="nav-item">
                <button type="button" class="nav-link w-px-160 h-75" name="btnLevy" role="tab" data-bs-toggle="tab" data-bs-target="#levyInfo" aria-controls="levyInfo" aria-selected="false">
                    부과체납 정보
                </button>
            </li>
            <li class="nav-item">
                <button type="button" class="nav-link w-px-160 h-75" name="btnRcvmt" role="tab" data-bs-toggle="tab" data-bs-target="#rcvmtInfo" aria-controls="rcvmtInfo" aria-selected="false">
                    수납 정보
                </button>
            </li>
<%--
            <li class="nav-item">
                <button type="button" class="nav-link w-px-160 h-75" name="btnCvlcptDscsn" role="tab" data-bs-toggle="tab" data-bs-target="#cvlcptDscsnInfo" aria-controls="cvlcptDscsnInfo" aria-selected="false">
                    민원상담 정보
                </button>
            </li>
--%>
        </ul>

        <div class="tab-content p-0">
            <div class="tab-pane fade show active" id="crdnPayerInfo" role="tabpanel">단속 정보</div>
            <div class="tab-pane fade" id="opnnSbmsnInfo" role="tabpanel">의견제출 정보</div>
            <div class="tab-pane fade" id="sndngInfo" role="tabpanel">발송반송 정보</div>
            <div class="tab-pane fade" id="prcsInfo" role="tabpanel">처리상세 정보</div>
            <div class="tab-pane fade" id="levyInfo" role="tabpanel">부과체납 정보</div>
            <div class="tab-pane fade" id="rcvmtInfo" role="tabpanel">수납 정보</div>
<%--            <div class="tab-pane fade" id="cvlcptDscsnInfo" role="tabpanel">민원상담 정보</div>--%>
        </div>
    </div>
</div> <!-- <div class="card wrapper-list"> -->

<script>
    LoadScript("sprt02010Script", wctx.url("/resources/js/fims/sprt/sprt02010.js?ver=${ver}"));

    /**************************************************************************
     * Global Variable
     **************************************************************************/
    pageObject["${pageName}"] = newDoctxFinder("${pageName}");

    /**************************************************************************
     * script 진입
     **************************************************************************/
    $(document).ready(function() {
        // pageObject
        let $P = pageObject["${pageName}"];

        // datasetControl
        $P.ctrlMain = newSprt02010Control("${pageName}", "[data-doctx=${pageName}]");
        // infoDialog 호출한 pageName
        $P.callPageName = "${callPageName}";
        // infoDialog 호출 용도(view 조회(편집불가), create 등록, update 수정)
        $P.callPurpose = "${callPurpose}";
        // 자료 이동을 위한 자료의 Index. 0부터 시작.
        $P.curDataIndex;
        // 현재 탭의 위치
        $P.activeTabIndex = 0;

        /**************************************************************************
         * 네이게이션 Event
         **************************************************************************/
        // 건수 표기
        $P.fnChangeCountStatus = () => {
            // 종료
            if ($P.callPageName == "" || $P.callPageName == "noPageName") return;

            //
            let dataItems;
            if (pageObject[$P.callPageName].ctrl.flag == "up") {
                dataItems = pageObject[$P.callPageName].ctrl.upDataset._items;
            } else if (pageObject[$P.callPageName].ctrl.flag == "down") {
                dataItems = pageObject[$P.callPageName].ctrl.downDataset._items;
            } else {
                dataItems = pageObject[$P.callPageName].ctrl.dataset._items;
            }

            // $P.curDataIndex 에 값이 없다면..
            if ($P.curDataIndex == null) {
                let curCrdnId = $P.ctrlMain.getValue("CRDN_ID");

                for (iLoop = 0; iLoop < dataItems.length; iLoop++) {
                    if (dataItems[iLoop].data.CRDN_ID == curCrdnId) {
                        $P.curDataIndex = iLoop;
                        break;
                    }
                }
            }

            // 건수 표시
            let viewNumber = $P.curDataIndex + 1;
            $P.$findn("countStatus").val(viewNumber + " of " + dataItems.length);
        }

        // 이전 자료 조회
        $P.fnPrev = () => {
            // 종료
            if ($P.callPageName == "" || $P.callPageName == "noPageName") return;

            //
            let dataItems;
            if (pageObject[$P.callPageName].ctrl.flag == "up") {
                dataItems = pageObject[$P.callPageName].ctrl.upDataset._items;
            } else if (pageObject[$P.callPageName].ctrl.flag == "down") {
                dataItems = pageObject[$P.callPageName].ctrl.downDataset._items;
            } else {
                dataItems = pageObject[$P.callPageName].ctrl.dataset._items;
            }

            let curCrdnId = $P.ctrlMain.getValue("CRDN_ID");

            // 초기 값은 callControl dataset 의 총 건수 - 1
            if ($P.curDataIndex == null) {
                $P.curDataIndex = dataItems.length - 1;
            }

            for (iLoop = $P.curDataIndex; iLoop >= 0; iLoop--) {
                if (dataItems[iLoop].data.CRDN_ID == curCrdnId) {
                    if (iLoop - 1 < 0) return;                                  // 종료

                    $P.curDataIndex = iLoop - 1;
                    break;
                }
            }

            let crdnId = dataItems[$P.curDataIndex].data.CRDN_ID;
            // 단속 ID 가 없다면.. return
            if (!crdnId) return;

            let params = {
                  callPurpose: "view"
                , sggCd: dataItems[$P.curDataIndex].data.SGG_CD
                , taskSeCd: dataItems[$P.curDataIndex].data.TASK_SE_CD
                , crdnId: dataItems[$P.curDataIndex].data.CRDN_ID
                , delYn: "N"
            };

            $P.fnRefreshInfo(params);
        }

        // 다음 자료 조회
        $P.fnNext = () => {
            // 종료
            if ($P.callPageName == "" || $P.callPageName == "noPageName") return;

            //
            let dataItems;
            if (pageObject[$P.callPageName].ctrl.flag == "up") {
                dataItems = pageObject[$P.callPageName].ctrl.upDataset._items;
            } else if (pageObject[$P.callPageName].ctrl.flag == "down") {
                dataItems = pageObject[$P.callPageName].ctrl.downDataset._items;
            } else {
                dataItems = pageObject[$P.callPageName].ctrl.dataset._items;
            }

            let curCrdnId = $P.ctrlMain.getValue("CRDN_ID");

            // 초기 값은 0
            if ($P.curDataIndex == null) {
                $P.curDataIndex = 0;
            }

            for (iLoop = $P.curDataIndex; iLoop < dataItems.length; iLoop++) {
                if (dataItems[iLoop].data.CRDN_ID == curCrdnId) {
                    if (iLoop + 1 >= dataItems.length) return;                  // 종료

                    $P.curDataIndex = iLoop + 1;
                    break;
                }
            }

            let crdnId = dataItems[$P.curDataIndex].data.CRDN_ID;
            // 단속 ID 가 없다면.. return
            if (!crdnId) return;

            let params = {
                  callPurpose: "view"
                , sggCd: dataItems[$P.curDataIndex].data.SGG_CD
                , taskSeCd: dataItems[$P.curDataIndex].data.TASK_SE_CD
                , crdnId: dataItems[$P.curDataIndex].data.CRDN_ID
                , delYn: "N"
            };

            $P.fnRefreshInfo(params);
        }

        /**************************************************************************
         * 탭 clickEvent
         **************************************************************************/
        // 단속 정보
        $P.fnCrdnPayerInfo = () => {
            // 탭 Index
            $P.activeTabIndex = 0;

            let params = {
                  callPurpose: "view"
                , sggCd: $P.ctrlMain.getValue("SGG_CD")
                , taskSeCd: $P.ctrlMain.getValue("TASK_SE_CD")
                , crdnId: $P.ctrlMain.getValue("CRDN_ID")
                , delYn: "N"
            };

            ajax.get({
                  url: wctx.url("/sprt/sprt02/020/info.do")
                , data: params || {}
                , success: (resp) => { $("#crdnPayerInfo").html(resp); }
            });
        }

        // 의견제출 정보
        $P.fnOpnnSbmsnInfo = () => {
            // 탭 Index
            $P.activeTabIndex = 1;

            let params = {
                  callPurpose: "view"
                , sggCd: $P.ctrlMain.getValue("SGG_CD")
                , taskSeCd: $P.ctrlMain.getValue("TASK_SE_CD")
                , crdnId: $P.ctrlMain.getValue("CRDN_ID")
                , delYn: "N"
            };

            ajax.get({
                  url: wctx.url("/sprt/sprt02/030/info.do")
                , data: params || {}
                , success: (resp) => { $("#opnnSbmsnInfo").html(resp); }
            });
        }

        // 발송 반송 정보
        $P.fnSndngInfo = () => {
            // 탭 Index
            $P.activeTabIndex = 2;

            let params = {
                  callPurpose: "view"
                , sggCd: $P.ctrlMain.getValue("SGG_CD")
                , taskSeCd: $P.ctrlMain.getValue("TASK_SE_CD")
                , crdnId: $P.ctrlMain.getValue("CRDN_ID")
                , delYn: "N"
            };

            ajax.get({
                  url: wctx.url("/sprt/sprt02/040/info.do")
                , data: params || {}
                , success: (resp) => { $("#sndngInfo").html(resp); }
            });
        }

        // 처리 정보
        $P.fnPrcsInfo = () => {
            // 탭 Index
            $P.activeTabIndex = 3;

            let params = {
                  callPurpose: "view"
                , sggCd: $P.ctrlMain.getValue("SGG_CD")
                , taskSeCd: $P.ctrlMain.getValue("TASK_SE_CD")
                , crdnId: $P.ctrlMain.getValue("CRDN_ID")
                , rtpyrId: $P.ctrlMain.getValue("RTPYR_ID")
                , delYn: "N"
            };

            ajax.get({
                  url: wctx.url("/sprt/sprt02/050/info.do")
                , data: params || {}
                , success: (resp) => { $("#prcsInfo").html(resp); }
            });
        }

        // 부과체납 정보
        $P.fnLevyInfo = () => {
            // 탭 Index
            $P.activeTabIndex = 4;

            let params = {
                  callPurpose: "view"
                , sggCd: $P.ctrlMain.getValue("SGG_CD")
                , taskSeCd: $P.ctrlMain.getValue("TASK_SE_CD")
                , crdnId: $P.ctrlMain.getValue("CRDN_ID")
                , delYn: "N"
            };

            ajax.get({
                  url: wctx.url("/sprt/sprt02/060/info.do")
                , data: params || {}
                , success: (resp) => { $("#levyInfo").html(resp); }
            });
        }

        // 수납 정보
        $P.fnRcvmtInfo = () => {
            // 탭 Index
            $P.activeTabIndex = 5;

            let params = {
                  callPurpose: "view"
                , sggCd: $P.ctrlMain.getValue("SGG_CD")
                , taskSeCd: $P.ctrlMain.getValue("TASK_SE_CD")
                , crdnId: $P.ctrlMain.getValue("CRDN_ID")
                , delYn: "N"
            };

            ajax.get({
                  url: wctx.url("/sprt/sprt02/070/info.do")
                , data: params || {}
                , success: (resp) => { $("#rcvmtInfo").html(resp); }
            });
        }

        // 민원상담 정보
        $P.fnCvlcptDscsnInfo = () => {
            // 탭 Index
            $P.activeTabIndex = 6;

            let params = {
                  callPurpose: "view"
                , inquiryCondition: "crdnId_vhrno"
                , sggCd: $P.ctrlMain.getValue("SGG_CD")
                , taskSeCd: $P.ctrlMain.getValue("TASK_SE_CD")
                , crdnId: $P.ctrlMain.getValue("CRDN_ID")
                , vhrno: $P.ctrlMain.getValue("VHRNO")
                , delYn: "N"
            };

            ajax.get({
                  url: wctx.url("/sprt/sprt02/080/info.do")
                , data: params || {}
                , success: resp => { $("#cvlcptDscsnInfo").html(resp); }
            });
        }

        /**************************************************************************
         * 사용자 함수(function)
         **************************************************************************/
        // 자료 재조회
        $P.fnRefreshInfo = (params) => {
            if (!params) return;

            ajax.get({
                  url: wctx.url("/sprt/sprt02/010/main.do")
                , headers: { Accept: "application/json; charset=utf-8" }        // json
                , data: params || {}
                , success: resp => {
                    if (resp.totalInfo) {
                        // 최상단 단속 Data 셋팅
                        $P.ctrlMain.setData([resp.totalInfo]);

                        if ($P.activeTabIndex == 0) {
                            $P.fnCrdnPayerInfo();                               // 단속 납부자 Data 셋팅
                        } else if ($P.activeTabIndex == 1) {
                            $P.fnOpnnSbmsnInfo();                               // 의견제출 정보
                        } else if ($P.activeTabIndex == 2) {
                            $P.fnSndngInfo();                                   // 발송 반송 정보
                        } else if ($P.activeTabIndex == 3) {
                            $P.fnPrcsInfo();                                    // 처리 상세 정보
                        } else if ($P.activeTabIndex == 4) {
                            $P.fnLevyInfo();                                    // 부과체납 정보
                        } else if ($P.activeTabIndex == 5) {
                            $P.fnRcvmtInfo();                                   // 수납 정보
                        } else if ($P.activeTabIndex == 6) {
                            $P.fnCvlcptDscsnInfo();                             // 민원상담 정보
                        }
                    }
                }
            });
        }

        // 자료 수정 가능 여부
        $P.fnUseDataEdit = (item) => {
            // 삭제 자료일 경우 빨간색으로 변경
            let elem = document.getElementById("crdnSttsNm--${pageName}");

            if (item.data.CRDN_STTS_CD == "99") {
                elem.classList.remove("text-primary");
                elem.classList.add("text-danger");
            } else {
                elem.classList.remove("text-danger");
                elem.classList.add("text-primary");
            }
        }

        //
        $P.fnClose = (isDataReLoad) => {
            dialog.close($P.selfDlgId());

            if (isDataReLoad && $P.callPageName != "noPageName") {
            	pageObject[$P.callPageName].ctrl.load(1);
            }
        }

        /**************************************************************************
         * 초기 셋팅
         **************************************************************************/
        // 이벤트 설정
        $P.setEvent = () => {
            // 기본 버튼 이벤트
            $P.$findn("btnPrev").on("click", () => { $P.fnPrev() });                     // 이전
            $P.$findn("btnNext").on("click", () => { $P.fnNext() });                     // 다음

            // 탭 버튼 이벤트
            $P.$findn("btnCrdnPayer").on("click", () => { $P.fnCrdnPayerInfo() });       // 단속 정보
            $P.$findn("btnOpnnSbmsn").on("click", () => { $P.fnOpnnSbmsnInfo() });       // 의견제출 정보
            $P.$findn("btnSndng").on("click", () => { $P.fnSndngInfo() });               // 발송반송 정보
            $P.$findn("btnPrcs").on("click", () => { $P.fnPrcsInfo() });                 // 처리상세 정보
            $P.$findn("btnLevy").on("click", () => { $P.fnLevyInfo() });                 // 부과체납 정보
            $P.$findn("btnRcvmt").on("click", () => { $P.fnRcvmtInfo() });               // 수납 정보
            $P.$findn("btnCvlcptDscsn").on("click", () => { $P.fnCvlcptDscsnInfo() });   // 민원상담 정보
        }

        // 초기 설정
        $P.fnReset = () => {
            // 화면 초기화
            $P.findn("frmEdit").reset();

            // 화면이 열릴때 초기 값으로 null로 설정해야 건수가 정상 표시 된다.
            $P.curDataIndex = null;
        }

        /**************************************************************************
         * script 진입시 실행 함수
         **************************************************************************/
        // 1. 이벤트 설정
        $P.setEvent();

        // 2. 초기 설정
        $P.fnReset();

        // 3. Dataset 설정
        $P.ctrlMain.setData([${totalInfo}]);

        // 4. 단속, 납부자 정보 조회
        $P.fnCrdnPayerInfo();
    });

</script>
