<%@ 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="content-pop" data-doctx="${pageName}">
	<div class="d-flex flex-row justify-content-evenly">
		<!-- 민원 상담 정보 -->
		<div class="col-xl-12 mx-1">
			<div class="card">
				<!-- 업무 버튼 -->
				<div class="container-page-btn">
					<label class="col-form-label bg-label-danger pe-2 w-px-120 text-sm-center">민원상담 이력</label>
					<!-- 버튼 우측 정렬 -->
					<span class="container-window-btn-right">
						<button type="button" class="btn btn-primary w-px-120" name="btnCreateCvlcptDscsn" title="민원상담 등록" disabled>
							민원상담 등록
						</button>
						<button type="button" class="btn btn-primary w-px-120" name="btnUpdateCvlcptDscsn" title="민원상담 수정" disabled>
							민원상담 수정
						</button>
						<button type="button" class="btn btn-primary w-px-120" name="btnRemoveCvlcptDscsn" title="민원상담 삭제" disabled>
							민원상담 삭제
						</button>
					</span> <!-- <span class="container-window-btn-right"> -->
				</div> <!-- <div class="container-page-btn"> -->

				<!-- 입력 영역 -->
				<form name="frmEditCvlcptDscsn">
					<!-- hidden -->
					<input type="hidden" name="cvlcptDscsnId" data-map="CVLCPT_DSCSN_ID" />

					<div class="row g-1">
						<!-- DataTables(그리드) -->
						<div class="card-datatable text-nowrap">
							<div class="dataTables_wrapper dt-bootstrap5 no-footer">
								<div class="table-responsive ox-scroll oy-scroll h-px-400" name="tableRspnsCvlcptDscsn">
								    <table class="table-layout-fixed dataTable datatables-ajax table table-bordered no-footer" aria-describedby="DataTables_Table_0_info">
                                        <thead class="sticky-thead">
                                            <tr name="theadTrCvlcptDscsn" data-search-target="[data-doctx='${pageName}']">
                                                <th class="cmn sorting" style="width: 180px" data-field="MDFCN_DT">수정일시</th>
                                                <th class="cmn sorting" style="width: 100px" data-field="WEEK_NM">요일</th>
                                                <th class="cmn sorting" style="width: 140px" data-field="MDFR_NM">수정사용자</th>
                                                <th class="cmn sorting" style="width: 120px" data-field="CVLCPT_RCPT_SE_NM">민원접수구분</th>
                                                <th class="cmn sorting" style="width: 120px" data-field="CVLPR_NM">민원인명</th>
                                                <th class="cmn sorting" style="width: 140px" data-field="CVLPR_CTTPC">민원인연락처</th>
                                                <th class="cmn sorting" style="width: 360px" data-field="DSCSN_CN">상담내용</th>
                                                <th class="cmn sorting" style="width: 180px" data-field="REG_DT">등록일시</th>
                                                <th class="cmn sorting" style="width: 140px" data-field="RGTR_NM">등록사용자</th>
                                                <th class="cmn dummy-th"></th>
											</tr>
										</thead>
										<tbody name="tbodyCvlcptDscsnList">
										</tbody>
										<template is="curly-brackets" name="tmpltCvlcptDscsnRows">
											<tr data-key="{data-index}">
												<td class="text-center" onclick>{REG_DT}</td>
												<td class="text-center" onclick>{WEEK_NM}</td>
												<td class="text-center" onclick>{RGTR_NM}</td>
												<td class="text-center" onclick>{CVLCPT_RCPT_SE_NM}</td>
												<td class="text-start"  onclick>{CVLPR_NM}</td>
												<td class="text-center" onclick>{CVLPR_CTTPC}</td>
												<td class="text-start"  onclick>{DSCSN_CN}</td>
												<td class="text-center" onclick>{MDFCN_DT}</td>
												<td class="text-center" onclick>{MDFR_NM}</td>
												<td class="cmn dummy-td"></td>
											</tr>
										</template>
										<template name="tmpltNotFoundCvlcptDscsn">
											<tr class="odd">
												<td valign="top" colspan="10" class="dataTables_empty text-center">민원 상담 정보를 찾지 못했습니다.</td>
											</tr>
										</template>
									</table>
								</div>
							</div>
						</div> <!-- DataTables(그리드) -->

						<!-- 상담 내용 -->
						<div class="col-md-12">
                            <textarea type="text" class="form-control w-100" name="dscsnCn" data-map="DSCSN_CN" rows="9" data-maxlengthb="4000" readonly></textarea>
						</div>
					</div> <!-- <div class="row g-1"> -->
				</form>
				<!-- 입력 영역 -->
			</div> <!-- <div class="card"> -->
		</div> <!-- <div class="col-xl-12 mx-1"> -->
		<!-- 민원 상담 정보 -->
	</div> <!-- <div class="d-flex flex-row justify-content-evenly"> -->
</div> <!-- <div class="content-pop"> -->

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

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

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

        // datasetControl
        $P.ctrlCvlcptDscsn = newSprt02080Control("${pageName}", "[data-doctx=${pageName}]", "${pageNameMain}");

        /**************************************************************************
         * 사용자 함수(function)
         **************************************************************************/
        // 사유 callback
        $P.callbackRsn = (obj) => {
            // 서버에 전송할 data(파라미터) 생성
            let params = {
                  callPurpose: "remove"
                , sggCd: $P.ctrlCvlcptDscsn.getValue("SGG_CD")                  // 시군구 코드
                , taskSeCd: $P.ctrlCvlcptDscsn.getValue("TASK_SE_CD")           // 업무 구분 코드
                , cvlcptDscsnId: $P.ctrlCvlcptDscsn.getValue("CVLCPT_DSCSN_ID") // 민원상담 ID
                , btnTitle: obj.btnTitle                                        // 버튼 title
                , delRsn: obj.reason                                            // 삭제 사유
            };

            $P.ctrlCvlcptDscsn.remove(params);
        }

        // 정보 새로고침
        $P.fnRefresh = () => {
            let ctrlMain = pageObject["${pageNameMain}"].ctrlMain;

            // 단속 ID 가 없다면.. return
            let crdnId = ctrlMain.getValue("CRDN_ID");                          // 단속 ID
            if (!crdnId) return;

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

            ajax.get({
                  url: wctx.url("/sprt/sprt02/080/info.do")
                , headers: { Accept: "application/json; charset=utf-8" }        // json
                , data: params || {}
                , success: (resp) => {
                    // 초기화
                    $P.findn("frmEditCvlcptDscsn").reset();                     // 민원상담 화면
                    $P.ctrlCvlcptDscsn.dataset.clear();                         // 민원상담 Dataset

                    // sprt02010-main 단속 정보
                    ctrlMain.setData([resp.totalInfo]);

                    // 민원상담 정보
                    $P.ctrlCvlcptDscsn.setData(resp.cvlcptDscsns);
                }
            });
        }

        /**************************************************************************
         * 버튼 clickEvent
         **************************************************************************/
        // 민원 상담 내용 등록
        $P.fnCreateCvlcptDscsn = (btnTitle) => {
            // 단속 ID 가 없다면.. return
            let ctrlMain = pageObject["${pageNameMain}"].ctrlMain;              // sprt02010 control
            let crdnId = ctrlMain.getValue("CRDN_ID");                          // 단속 ID
            if (!crdnId) return;

            let params = {
                  callPurpose: "create"
                , btnTitle: btnTitle
                , sggCd: ctrlMain.getValue("SGG_CD")                            // 시군구 코드
                , taskSeCd: ctrlMain.getValue("TASK_SE_CD")                     // 업무 구분 코드
                , crdnId: ctrlMain.getValue("CRDN_ID")                          // 단속 ID
            };

            $P.ctrlCvlcptDscsn.getInfo(params);
        }

        // 민원 상담 내용 수정
        $P.fnUpdateCvlcptDscsn = (btnTitle) => {
            // 민원 상담 ID 가 없다면.. return
            let cvlcptDscsnId = $P.ctrlCvlcptDscsn.getValue("CVLCPT_DSCSN_ID"); // 민원 상담 ID
            if (!cvlcptDscsnId) return;

            let params = {
                  callPurpose: "update"
                , btnTitle: btnTitle
                , sggCd: $P.ctrlCvlcptDscsn.getValue("SGG_CD")
                , taskSeCd: $P.ctrlCvlcptDscsn.getValue("TASK_SE_CD")
                , cvlcptDscsnId: $P.ctrlCvlcptDscsn.getValue("CVLCPT_DSCSN_ID")
                , delYn: "N"
            };

            $P.ctrlCvlcptDscsn.getInfo(params);
        }

        // 민원상담 내용 삭제
        $P.fnRemoveCvlcptDscsn = (btnTitle) => {
            // 민원 상담 ID 가 없다면.. return
            let cvlcptDscsnId = $P.ctrlCvlcptDscsn.getValue("CVLCPT_DSCSN_ID"); // 민원 상담 ID
            if (!cvlcptDscsnId) return;

            // 삭제 메세지 확인
            dialog.alert({
                  content: "선택하신 " + $P.ctrlRcvmt.prefixName + " 정보를 삭제하시겠습니까?"
                , onOK: async() => {
                    // 삭제 사유 입력
                    fetch(wctx.url("/resources/html/inputRsnDialog.html"))
                        .then(function(resp) { return resp.text(); })
                        .then(function(template) {
                            dialog.open({
                                  id: "inputDelRsnDialog"
                                , title: btnTitle
                                , size: "lg"
                                , content: template
                                , init: () => { AppSupport.setDialogZindex(); }
                                , onOK: () => {
                                    $P.callbackRsn({
                                          btnTitle: btnTitle                    // 버튼 title
                                        , reason: $("#reason").val()            // 삭제 사유
                                    });
                                }
                            });
                        });
                }
            });
        }

        /**************************************************************************
         * 초기 셋팅
         **************************************************************************/
        // 이벤트 설정
        $P.setEvent = () => {
            // 업무 버튼 이벤트
            $P.$findn("btnCreateCvlcptDscsn").on("click", function() {
                $P.fnCreateCvlcptDscsn($P.$findn("btnCreateCvlcptDscsn").attr("title")); // 민원상담 등록
            });
            $P.$findn("btnUpdateCvlcptDscsn").on("click", function() {
                $P.fnUpdateCvlcptDscsn($P.$findn("btnUpdateCvlcptDscsn").attr("title")); // 민원상담 수정
            });
            $P.$findn("btnRemoveCvlcptDscsn").on("click", function() {
                $P.fnRemoveCvlcptDscsn($P.$findn("btnRemoveCvlcptDscsn").attr("title")); // 민원상담 삭제
            });

            // DataTables width 변경 조정
            Componentization.fnMakeResizableTable($P.findn("tableRspnsCvlcptDscsn"));
        }

        // 초기 화면 설정
        $P.fnReset = () => {
            // 초기화
            $P.findn("frmEditCvlcptDscsn").reset();                             // 민원 상담 화면 초기화
            $P.ctrlCvlcptDscsn.dataset.clear();                                 // 민원 상담 Dataset 초기화

            // 화면 호출(callPurpose)이 view라면 버튼 비활성화 disabled = true
            if (pageObject['${pageNameMain}'].callPurpose != "view") {
                $P.$findn("btnCreateCvlcptDscsn").prop("disabled", false);
                $P.$findn("btnUpdateCvlcptDscsn").prop("disabled", false);
                $P.$findn("btnRemoveCvlcptDscsn").prop("disabled", false);
            }
        }

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

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

        // 3. Dataset 설정
        $P.ctrlCvlcptDscsn.setData(${cvlcptDscsns});                            // 민원 상담 정보
	});

</script>
