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

<c:set var="prefixName" scope="request">납부자 상세 정보</c:set>

<!-- inner page html -->
<div class="content-pop" data-doctx="${pageName}">
    <!-- Content -->
    <div class="container flex-grow-1 px-0">
        <div class="card">
            <!-- 입력 영역 -->
            <form name="frmEdit">
                <!-- hidden -->
                <input type="hidden" name="sggCd" data-map="SGG_CD" />
                <input type="hidden" name="taskSeCd" data-map="TASK_SE_CD" />
                <input type="hidden" name="crdnId" data-map="CRDN_ID" />
                <input type="hidden" name="rtpyrId" data-map="RTPYR_ID" />
                <input type="hidden" name="addrSn" data-map="ADDR_SN" />
                <input type="hidden" name="rtpyrInptSeCd" data-map="RTPYR_INPT_SE_CD" />
                <input type="hidden" name="addrInptSeCd" data-map="ADDR_INPT_SE_CD" />

                <div class="row g-1">
                    <div class="col-md-6">
                        <label is="name-label" class="col-form-label bg-lighter pe-2 w-px-120 text-sm-end" for="crdnYmdTm">단속일시</label>
                        <input is="id-input" type="text" class="form-control w-35" name="crdnYmdTm" data-map="CRDN_YMD_TM" data-fmt-type="dt" readonly />
                    </div>
                    <div class="col-md-6">
                        <label is="name-label" class="col-form-label bg-lighter pe-2 w-px-120 text-sm-end" for="vhrno">차량번호</label>
                        <input is="id-input" type="text" class="form-control w-35" name="vhrno" data-map="VHRNO" readonly />
                        <button type="button" class="btn btn-primary" name="btnVehicle" title="차량 검색">
                            검색
                        </button>
                    </div>
                    <div class="col-md-6">
                        <label is="name-label" class="col-form-label bg-lighter pe-2 w-px-120 text-sm-end required" for="rtpyrSeCd">납부자구분</label>
                        <select is="id-select" class="form-select" name="rtpyrSeCd" data-map="RTPYR_SE_CD" required>
                            <option value="">선택하세요</option>
                            <c:forEach items="${FIM011List}" var="item">
                                <option value="${item.code}">${item.value}</option>
                            </c:forEach>
                        </select>
                    </div>
                    <div class="col-md-6">
                        <label is="name-label" class="col-form-label bg-lighter pe-2 w-px-120 text-sm-end required" for="rtpyrNo">납부자번호</label>
                        <input is="id-input" type="text" class="form-control w-35" name="rtpyrNo" data-map="RTPYR_NO" required />
                        <button type="button" class="btn btn-primary" name="btnPayer" title="납부자검색">
                            검색
                        </button>
                    </div>
                    <div class="col-md-6">
                        <label is="name-label" class="col-form-label bg-lighter pe-2 w-px-120 text-sm-end required" for="rtpyrNm">납부자성명</label>
                        <input is="id-input" type="text" class="form-control w-35" name="rtpyrNm" data-map="RTPYR_NM" required />
                    </div>
                    <div class="col-md-6">
                        <label is="name-label" class="col-form-label bg-lighter pe-2 w-px-120 text-sm-end required" for="rtpyrSttsCd">납부자상태</label>
                        <select is="id-select" class="form-select w-35" name="rtpyrSttsCd" data-map="RTPYR_STTS_CD" required>
                            <option value="">선택하세요</option>
                            <c:forEach items="${FIM014List}" var="item">
                                <option value="${item.code}">${item.value}</option>
                            </c:forEach>
                        </select>
                    </div>
                    <div class="col-md-6">
                        <label is="name-label" class="col-form-label bg-lighter pe-2 w-px-120 text-sm-end" for="rtpyrTelno">전화번호</label>
                        <input is="id-input" type="text" class="form-control w-35" name="rtpyrTelno" data-map="RTPYR_TELNO" />
                    </div>
                    <div class="col-md-6">
                        <label is="name-label" class="col-form-label bg-lighter pe-2 w-px-120 text-sm-end" for="rtpyrMblTelno">휴대전화번호</label>
                        <input is="id-input" type="text" class="form-control w-35" name="rtpyrMblTelno" data-map="RTPYR_MBL_TELNO" />
                    </div>
                    <div class="col-md-12">
                        <label is="name-label" class="col-form-label bg-lighter pe-2 w-px-120 text-sm-end" for="rtpyrEml">이메일</label>
                        <input is="id-input" type="text" class="form-control w-30" name="rtpyrEml" data-map="RTPYR_EML" />
                    </div>
                    <div class="col-md-12">
                        <label is="name-label" class="col-form-label bg-lighter pe-2 w-px-120 text-sm-end required" for="addr">주소</label>
                        <input is="id-input" type="text" class="form-control w-70" name="addr" data-map="ADDR" required readonly />
                        <input is="id-input" type="text" class="form-control w-px-75" name="zip" data-map="ZIP" required readonly />
                        <button type="button" class="btn btn-primary" name="btnZipCode" title="우편번호검색">
                            검색
                        </button>
                    </div>
                    <div class="col-md-12">
                        <label is="name-label" class="col-form-label bg-lighter pe-2 w-px-120 text-sm-end" for="dtlAddr">상세주소</label>
                        <input is="id-input" type="text" class="form-control w-78" name="dtlAddr" data-map="DTL_ADDR" readonly />
                        <button type="button" class="btn btn-primary" name="btnEditAddr" title="주소수정">
                            주소수정
                        </button>
                    </div>
                    <div class="col-md-12">
                        <label is="name-label" class="col-form-label bg-lighter pe-2 w-px-120 text-sm-end" for="roadNmCd">도로명코드</label>
                        <input is="id-input" type="text" class="form-control w-px-120" name="roadNmCd" data-map="ROAD_NM_CD" readonly />
                        <input is="id-input" type="text" class="form-control w-px-40" name="udgdSeCd" data-map="UDGD_SE_CD" readonly />
                        <input is="id-input" type="text" class="form-control w-px-60" name="bmno" data-map="BMNO" readonly />
                        <input is="id-input" type="text" class="form-control w-px-60" name="bsno" data-map="BSNO" readonly />
                        <input is="id-input" type="text" class="form-control w-px-230" name="bldgMngNo" data-map="BLDG_MNG_NO" readonly />
                    </div>
                    <div class="col-md-6">
                        <label is="name-label" class="col-form-label bg-lighter pe-2 w-px-120 text-sm-end required" for="stdgCd">법정동코드</label>
                        <input is="id-input" type="text" class="form-control w-px-120" name="stdgCd" data-map="STDG_CD" required readonly />
                        <input is="id-input" type="text" class="form-control w-px-40" name="mtnSeCd" data-map="MTN_SE_CD" readonly />
                        <input is="id-input" type="text" class="form-control w-px-60" name="mno" data-map="MNO" readonly />
                        <input is="id-input" type="text" class="form-control w-px-60" name="sno" data-map="SNO" readonly />
                    </div>
                    <div class="col-md-6">
                        <label is="name-label" class="col-form-label bg-lighter pe-2 w-px-120 text-sm-end" for="dongCd">행정동코드</label>
                        <input is="id-input" type="text" class="form-control w-30" name="dongCd" data-map="DONG_CD" readonly />
                    </div>
                </div>
            </form>
            <!-- 입력 영역 -->

            <!-- 업무 버튼 및 건수 표시 -->
	        <div>
	            <span class="container-page-btn">
	                <!-- 업무 버튼 -->
	                <span class="container-window-btn-right">
	                    <button type="button" class="btn btn-primary w-px-120" name="btnSave" title="저장">
	                        저장
	                    </button>
	                </span>
	            </span>
	        </div>
            <!-- 업무 버튼 및 건수 표시 -->
        </div> <!-- <div class="card"> -->
    </div> <!-- <div class="container flex-grow-1 px-0"> -->
    <!-- Content -->
</div>
<!-- / inner page html <div class="content-pop"> -->

<script>
    LoadScript("payer01020Script", wctx.url("/resources/js/fims/payer/payer01020.js?ver=${ver}"));

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

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

        // URL
        $P.prefixUrl = "${prefixUrl}"
        // datasetControl
        $P.ctrl = newPayer01020Control("${pageName}", "[data-doctx=${pageName}]");
        // infoDialog 호출 용도(view 조회(편집불가), create 등록, update 수정)
        $P.callPurpose = "${callPurpose}";

        /**************************************************************************
         * 사용자 함수(function)
         **************************************************************************/
        // 차적 조회 결과
        $P.callbackVehicle = (info) => {
            let pyrSeCd = "";

            switch (info.mber_se_code) {
                case "11": pyrSeCd = "01"; break;
                case "12": pyrSeCd = "02"; break;
                case "13": pyrSeCd = "03"; break;
                case "14": pyrSeCd = "04"; break;
                case "15": pyrSeCd = "05"; break;
            }

            $P.$findn("rtpyrSeCd").val(pyrSeCd);                                // 납부자 구분 코드
            $P.$findn("rtpyrNm").val(info.mber_nm);                             // 납부자 성명
            $P.$findn("rtpyrNo").val(info.mber_se_no);                          // 납부자 번호
            $P.$findn("addr").val(info.road_nm_adres);                          // 주소
            $P.$findn("zip").val(info.zip_code);                                // 우편번호
            $P.$findn("dtlAddr").val(info.use_strnghld_adres_nm);               // 사용본거지 상세주소
            $P.$findn("roadNmCd").val(info.use_strnghld_road_nm_code);          // 사용본거지 도로명 코드
            $P.$findn("udgdSeCd").val(info.usgsrhld_undgrnd_buld_se_code);      // 사용본거지 지하 구분 코드
            $P.$findn("bmno").val(info.use_strnghld_buld_main_no);              // 사용본거지 건물 본번
            $P.$findn("bsno").val(info.use_strnghld_buld_sub_no);               // 사용본거지 건물 부번
            $P.$findn("bldgMngNo").val("");                                     // 건물 관리 번호
            $P.$findn("stdgCd").val(info.use_strnghld_legaldong_code);          // 사용본거지 법정동 코드
            $P.$findn("mtnSeCd").val(info.use_strnghld_mntn);                   // 사용본거지 산
            $P.$findn("mno").val(info.use_strnghld_lnbr);                       // 사용본거지 번지
            $P.$findn("sno").val(info.use_strnghld_ho);                         // 사용본거지 호
            $P.$findn("dongCd").val(info.use_strnghld_adstrd_code);             // 사용본거지 행정동 코드

            $P.$findn("rtpyrInptSeCd").val("02");                               // 납부자 입력 구분 코드(FIM015) 02:자동차관리정보시스템
            $P.$findn("addrInptSeCd").val("02");                                // 주소 입력 구분 코드(FIM087) 02:자동차관리정보시스템
        }

        // 우편번호 검색 결과
        $P.callbackSearchAddr = (obj) => {
            $P.$findn("addr").val(obj.ADDR);                                    // 주소
            $P.$findn("zip").val(obj.ZIP);                                      // 우편번호
            $P.$findn("dtlAddr").val(obj.DTL_ADDR);                             // 상세 주소
            $P.$findn("roadNmCd").val(obj.ROAD_NM_CD);                          // 도로명 코드
            $P.$findn("udgdSeCd").val(obj.UDGD_SE_CD);                          // 지하 구분 코드
            $P.$findn("bmno").val(obj.BMNO);                                    // 건물 본번
            $P.$findn("bsno").val(obj.BSNO);                                    // 건물 부번
            $P.$findn("bldgMngNo").val(obj.BLDG_MNG_NO);                        // 건물 관리 번호
            $P.$findn("stdgCd").val(obj.STDG_CD);                               // 법정동 코드
            $P.$findn("mtnSeCd").val(obj.MTN_SE_CD);                            // 산
            $P.$findn("mno").val(obj.MNO);                                      // 번지
            $P.$findn("sno").val(obj.SNO);                                      // 호
            $P.$findn("dongCd").val(obj.DONG_CD);                               // 행정동

            $P.$findn("rtpyrInptSeCd").val("01");                               // 납부자 입력 구분 코드(FIM015) 01:수기입력
            $P.$findn("addrInptSeCd").val("01");                                // 주소 입력 구분 코드(FIM087) 01:수기입력
        }

        /**************************************************************************
         * 버튼 clickEvent
         **************************************************************************/
        // 차적 검색
        $P.fnGetVehicle = async () => {
            let crdnYmd = $P.ctrl.getValue("CRDN_YMD");
            if (!crdnYmd)
                return dialog.alert("단속일자를 입력하세요.");
            let vhrno = $P.$findn("vhrno").val();
            if (!vhrno)
                return dialog.alert({
                    content: "차량번호를 입력하세요.",
                    onClose: function() {
                    	$P.$findn("vhrno").focus();
                    }
                });
            
            let resp = await FimsSupport.getVhclInfo($P.$findn("sggCd").val(), vhrno, crdnYmd);
            if (!resp.found) {
                $P.$findn("rtpyrId").val("");                           // 납부자 ID
                $P.$findn("addrSn").val("");                            // 주소 일련번호
                $P.$findn("rtpyrInptSeCd").val("");                     // 납부자 입력 구분 코드
                $P.$findn("addrInptSeCd").val("");                      // 주소 입력 구분 코드

                $P.$findn("rtpyrSeCd").val("");                         // 납부자 구분 코드
                $P.$findn("rtpyrNo").val("");                           // 납부자 번호
                $P.$findn("rtpyrNm").val("");                           // 납부자 성명
                $P.$findn("rtpyrTelno").val("");                        // 납부자 전화번호
                $P.$findn("rtpyrMblTelno").val("");                     // 납부자 휴대 전화번호
                $P.$findn("rtpyrEml").val("");                          // 납부자 이메일
                $P.$findn("zip").val("");                               // 우편번호
                $P.$findn("addr").val("");                              // 주소
                $P.$findn("dtlAddr").val("");                           // 상세 주소
                $P.$findn("roadNmCd").val("");                          // 도로명 코드
                $P.$findn("udgdSeCd").val("");                          // 지하 구분 코드
                $P.$findn("bmno").val("");                              // 건물 본번
                $P.$findn("bsno").val("");                              // 건물 부번
                $P.$findn("bldgMngNo").val("");                         // 건물 관리 번호
                $P.$findn("stdgCd").val("");                            // 법정동 코드
                $P.$findn("mtnSeCd").val("");                           // 산
                $P.$findn("mno").val("");                               // 번지
                $P.$findn("sno").val("");                               // 호
                $P.$findn("dongCd").val("");                            // 행정동 코드

                dialog.alert("차량 정보가 없습니다.");
            } else {
                $P.$findn("rtpyrId").val(resp.rtpyrId);                 // 납부자 ID
                $P.$findn("addr").attr("readonly", true);               // 주소
                $P.$findn("zip").attr("readonly", true);                // 우편번호
                $P.$findn("dtlAddr").attr("readonly", true);            // 상세 주소

                $P.callbackVehicle(resp.vehicle);
        		if (resp.exempted)
        			dialog.alert("면제차량이 설정됐습니다.");
            }
        }

        // 납부자 검색
        $P.fnGetPayer = () => {
            let rtpyrSeCd = $P.$findn("rtpyrSeCd").val();
            if (!rtpyrSeCd)
                return dialog.alert({
                      content: "납부자구분을 선택하세요."
                    , onClose: function() {
                            $P.$findn("rtpyrSeCd").focus();
                    }
                });
            let rtpyrNo = $P.$findn("rtpyrNo").val();
            if (!rtpyrNo)
                return dialog.alert({
                      content: "납부자번호를 입력하세요."
                    , onClose: function() {
                        $P.$findn("rtpyrNo").focus();
                    }
                });

            json.post({
                  url: wctx.url("/payer/getLastInfo.do")
                , headers: { Accept: "application/json; charset=utf-8" }        // json
                , data: {
                    sggCd: $P.$findn("sggCd").val()                        // 시군구 코드
                    , rtpyrSeCd: rtpyrSeCd                                 // 납부자 구분 코드
                    , rtpyrNo: rtpyrNo                                     // 납부자 번호
                  }
                , success: (resp) => {
                    $P.$findn("rtpyrId").val("");                           // 납부자 ID
                    $P.$findn("addrSn").val("");                            // 주소 일련번호
                    $P.$findn("rtpyrInptSeCd").val("");                     // 납부자 입력 구분 코드
                    $P.$findn("rtpyrNm").val("");                           // 납부자 성명
                    $P.$findn("rtpyrTelno").val("");                        // 납부자 전화번호
                    $P.$findn("rtpyrMblTelno").val("");                     // 납부자 휴대 전화번호
                    $P.$findn("rtpyrEml").val("");                          // 납부자 이메일
                    $P.$findn("zip").val("");                               // 우편번호
                    $P.$findn("addr").val("");                              // 주소
                    $P.$findn("dtlAddr").val("");                           // 상세 주소
                    $P.$findn("roadNmCd").val("");                          // 도로명 코드
                    $P.$findn("udgdSeCd").val("");                          // 지하 구분 코드
                    $P.$findn("bmno").val("");                              // 건물 본번
                    $P.$findn("bsno").val("");                              // 건물 부번
                    $P.$findn("bldgMngNo").val("");                         // 건물 관리 번호
                    $P.$findn("stdgCd").val("");                            // 법정동 코드
                    $P.$findn("mtnSeCd").val("");                           // 산
                    $P.$findn("mno").val("");                               // 번지
                    $P.$findn("sno").val("");                               // 호
                    $P.$findn("dongCd").val("");                            // 행정동 코드

                	if (!resp.found) {
                        dialog.alert("납부자 정보가 없습니다.");
                    } else {
                        $P.$findn("rtpyrId").val(resp.info.RTPYR_ID);               // 납부자 ID
                        $P.$findn("addrSn").val(resp.info.ADDR_SN);                 // 주소 일련번호
                        $P.$findn("rtpyrInptSeCd").val(resp.info.RTPYR_INPT_SE_CD); // 납부자 입력 구분 코드
                        $P.$findn("addrInptSeCd").val(resp.info.ADDR_INPT_SE_CD);   // 주소 입력 구분 코드

                        $P.$findn("rtpyrSeCd").val(resp.info.RTPYR_SE_CD);          // 납부자 구분 코드
                        $P.$findn("rtpyrSttsCd").val(resp.info.RTPYR_STTS_CD);      // 납부자 상태 코드
                        $P.$findn("rtpyrNm").val(resp.info.RTPYR_NM);               // 납부자 성명
                        $P.$findn("rtpyrNo").val(resp.info.RTPYR_NO);               // 납부자 번호
                        $P.$findn("rtpyrTelno").val(resp.info.RTPYR_TELNO);         // 납부자 성명
                        $P.$findn("rtpyrMblTelno").val(resp.info.RTPYR_MBL_TELNO);  // 납부자 번호
                        $P.$findn("rtpyrEml").val(resp.info.RTPYR_EML);             // 납부자 성명
                        $P.$findn("addr").val(resp.info.ADDR);                      // 주소
                        $P.$findn("zip").val(resp.info.ZIP);                        // 우편번호
                        $P.$findn("dtlAddr").val(resp.info.DTL_ADDR);               // 사용본거지 상세주소
                        $P.$findn("roadNmCd").val(resp.info.ROAD_NM_CD);            // 사용본거지 도로명 코드
                        $P.$findn("udgdSeCd").val(resp.info.UDGD_SE_CD);            // 사용본거지 지하 구분 코드
                        $P.$findn("bmno").val(resp.info.BMNO);                      // 사용본거지 건물 본번
                        $P.$findn("bsno").val(resp.info.BSNO);                      // 사용본거지 건물 부번
                        $P.$findn("bldgMngNo").val(resp.info.BLDG_MNG_NO);          // 건물 관리 번호
                        $P.$findn("stdgCd").val(resp.info.STDG_CD);                 // 사용본거지 법정동 코드
                        $P.$findn("mtnSeCd").val(resp.info.MTN_SE_CD);              // 사용본거지 산
                        $P.$findn("mno").val(resp.info.MNO);                        // 사용본거지 번지
                        $P.$findn("sno").val(resp.info.SNO);                        // 사용본거지 호
                        $P.$findn("dongCd").val(resp.info.DONG_CD);                 // 사용본거지 행정동 코드
                    }
                }
            });
        }

        // 우편번호 검색
        $P.fnZipCode = async() => {
            let resp = await fetch(wctx.url("/resources/html/searchAddr.html"));
            let template = await resp.text();

            dialog.open({
                  id: "searchAddrDialog"
                , title: "주소검색"
                , size: "lg"
                , content: template
                , init: () => {
                    AppSupport.setDialogZindex();

                    $("#searchAddrCallback").val("pageObject['${pageName}'].callbackSearchAddr");
                }
            });
        }

        // 화면에서 보여주는 주소입력 부분 수정
        $P.fnEditAddr = () => {
            $P.$findn("addr").prop("readonly", false);                          // 주소
            $P.$findn("zip").prop("readonly", false);                           // 우편번호
            $P.$findn("dtlAddr").prop("readonly", false);                       // 상세 주소
            $P.$findn("roadNmCd").prop("readonly", false);                      // 도로명 코드
            $P.$findn("stdgCd").prop("readonly", false);                        // 법정동 코드

            // 도로명 주소
            $P.$findn("roadNmCd").val("");                                      // 도로명 코드
            $P.$findn("udgdSeCd").val("");                                      // 지하 구분 코드
            $P.$findn("bmno").val("");                                          // 건물본번
            $P.$findn("bsno").val("");                                          // 건물부번
            $P.$findn("bldgMngNo").val("");                                     // 건물 관리 번호
            // 법정동
            $P.$findn("stdgCd").val("");                                        // 법정동 코드
            $P.$findn("mtnSeCd").val("");                                       // 산
            $P.$findn("mno").val("");                                           // 본번
            $P.$findn("sno").val("");                                           // 부번
            // 행정동
            $P.$findn("dongCd").val("");                                        // 행정동 코드

            $P.$findn("rtpyrInptSeCd").val("01");                               // 납부자 입력 구분 코드(FIM015) 01:수기입력
            $P.$findn("addrInptSeCd").val("01");                                // 주소 입력 구분 코드(FIM087) 01:수기입력
        }

        // 저장 버튼 클릭 이벤트
        $P.fnSave = () => {
            // validate 확인
            if (!AppSupport.customValidate($P.$findn("frmEdit").find("input,select,textarea"))) return;

            if (!$P.$findn("stdgCd").val())
                return dialog.alert("법정동 코드가 입력되지 않았습니다.");

            if ($P.$findn("stdgCd").val().length != 10) {
                return dialog.alert("법정동 코드가 잘못되었습니다.");
            }

            // formFields
            let params = new FimsFormFields($P.selectorn("frmEdit")).get();
            params.wholAddr = params.addr + ", " + params.dtlAddr;              // 전체 주소

            dialog.alert({
                  content: "현재 " + $P.ctrl.prefixName + " 정보를 저장하시겠습니까?"
                , init: () => { AppSupport.setDialogZindex(); }
                , onOK: () => { $P.ctrl.save(params); }
            });
        }

        /**************************************************************************
         * 초기 셋팅
         **************************************************************************/
        // 이벤트 설정
        $P.setEvent = () => {
            // 버튼 이벤트
            $P.$findn("btnVehicle").on("click", () => $P.fnGetVehicle());       // 차적 검색 버튼 이벤트
            $P.$findn("btnPayer").on("click", () => $P.fnGetPayer());           // 납부자 검색 버튼 이벤트
            $P.$findn("btnZipCode").on("click", () => $P.fnZipCode());          // 우편번호 검색 버튼 이벤트
            $P.$findn("btnEditAddr").on("click", () => $P.fnEditAddr());        // 주소 수정 버튼 이벤트

            $P.$findn("btnSave").on("click", () => $P.fnSave());                // 저장
        }

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

            $P.$findn("addr").prop("readonly", true);                           // 주소
            $P.$findn("zip").prop("readonly", true);                            // 우편번호
            $P.$findn("dtlAddr").prop("readonly", true);                        // 상세 주소
        }

        /**************************************************************************
         * 최초 실행 함수
         **************************************************************************/
        // 1. 이벤트 설정
        $P.setEvent();

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

        // 3. Dataset 설정
        $P.ctrl.setData([${Info}]);
    });
</script>