<template>
  <details open class="form-table-style mb30">
    <summary
      :class="{
        'point-font2': pageRole == 'adm',
        'point-font': pageRole == 'government',
      }"
    >
      <p class="summary-style pl10">검토사항내역</p>
    </summary>
    <div class="pt10 pb10">
      <ListTable
        :colgroup="colgroup"
        :thead="thead"
        :tbody="tbody"
        :className="pageRole == 'adm' ? 'admin-list' : 'review-table'"
        @listClick="fnModalOpen"
      />
      <div class="flex justify-end no-gutters">
        <div :class="pageNm == 'entInfo' ? 'gd-2' : 'gd-1'"></div>
        <div :class="pageNm == 'entInfo' ? 'gd-8' : 'gd-10'">
          <PaginationButton
            v-model:currentPage="search['currentPage']"
            :pagination="search"
            :click="fnViewList"
            :className="pageRole == 'adm' ? 'admin-pagination' : null"
          />
        </div>
        <div :class="pageNm == 'entInfo' ? 'gd-2' : 'gd-1'">
          <button
            :class="{
              'large-btn': true,
              'blue-btn': pageRole == 'adm',
              'green-btn point-font': pageRole == 'government',
            }"
            @click="fnInsert"
            v-if="pageAuth.regAuthrt == 'Y'"
          >
            등록
          </button>
        </div>
      </div>
    </div>
  </details>

  <Modal className="medium-modal" :showModal="isOpen">
    <template v-slot:header>
      <div
        :class="{
          'box-title': true,
          'point-font2': pageRole == 'adm',
          'point-font': pageRole == 'government',
        }"
      >
        <p>검토사항</p>
      </div>
      <button class="close-btn" @click="fnModalClose">X</button>
    </template>

    <!-- 검토사항 -->
    <RvwMttrDetail :pageNm="pageNm" :pageId="rvwMttrView.rvwMttrId" />

    <template v-slot:footer>
      <div v-if="pageAuth.mdfcnAuthrt == 'Y'" class="gd-3 pd0 mr10">
        <button
          :class="{
            'large-btn': true,
            'blue-border-btn': pageRole == 'adm',
            'green-border-btn': pageRole == 'government',
          }"
          @click="fnModalUpdate"
        >
          수정
        </button>
      </div>
      <div v-if="pageAuth.delAuthrt == 'Y'" class="gd-3 pd0">
        <button class="large-btn red-border-btn" @click="fnModalDelete">
          삭제
        </button>
      </div>
    </template>
  </Modal>
</template>

<script>
// Component
import ListTable from "../table/ListTable.vue";
import PaginationButton from "../pagination/PaginationButton.vue";
import Modal from "../modal/Modal.vue";
import RvwMttrDetail from "./RvwMttrDetail.vue";

// Resources
import { defaultSearchParams } from "../../../resources/js/defaultSearchParams";

// API
import {
  rvwMttrListProc,
  rvwMttrDeleteProc,
} from "../../../resources/api/rvwMttr";

export default {
  components: {
    ListTable: ListTable,
    PaginationButton: PaginationButton,
    Modal: Modal,
    RvwMttrDetail: RvwMttrDetail,
  },
  props: {
    data: {
      type: Object,
    },
    pageNm: {
      type: String,
      default: null,
    },
    pageId: {
      type: String,
    },
    pageAuth: {
      type: Object,
    },
    pageRole: {
      type: String,
      default: "government",
    },
    entId: {
      type: String,
    },
  },
  data() {
    return {
      colgroup: ["5%", "10%", "15%", "40%", "15%", "15%"],
      thead: ["NO", "형태", "기업명", "투자상담명", "진행단계", "등록일"],
      tbody: [],
      search: { ...defaultSearchParams },
      list: [],
      // 팝업
      isOpen: false,
      rvwMttrView: {},
      rvwMttrTypeList: [],
    };
  },
  created() {
    this.fnViewList();
  },
  methods: {
    // axios: 모달 조회(목록)
    async fnViewList() {
      // 데이터 세팅
      let data = this.search;
      data.cateId = "ivst_dscsn_id";
      data.cateValue = this.pageId;
      // 실행
      try {
        const response = await rvwMttrListProc(data);
        this.list = response.data.data.list;
        this.search = response.data.data.pagination;
        this.rvwMttrTypeList = response.data.data.rvwMttrTypeList;
        this.makeTbody();
      } catch (error) {
        alert("에러가 발생했습니다.\n관리자에게 문의해주세요.");
      }
    },
    // tbody 생성
    makeTbody() {
      this.tbody = [];
      this.tbody = this.list.map((rvwMttr, idx) => ({
        id:
          this.search.totalRecordCount -
          idx -
          (this.search.currentPage - 1) * this.search.recordSize,
        type: rvwMttr.type,
        entNm: rvwMttr.entNm,
        ttl: rvwMttr.ttl,
        nowPrgrsCrs:
          rvwMttr.nowPrgrsCrs == "0"
            ? "접수전"
            : rvwMttr.nowPrgrsCrs == "1"
            ? "처리중"
            : rvwMttr.nowPrgrsCrs == "2"
            ? "완료"
            : "-",
        regDt: rvwMttr.regDt,
      }));
    },

    // 모달 등록
    fnInsert() {
      this.$router.push({
        path: this.pageRole + "/companyReview/insert.page",
        query: {
          entId: this.entId,
          ivstDscsnId: this.data["ivstDscsnId"],
          ttl: this.data["ttl"],
        },
      });
    },

    // 모달 열기
    fnModalOpen(index) {
      this.isOpen = true;
      this.rvwMttrView = this.list[index];
    },
    // 모달 닫기
    fnModalClose() {
      this.isOpen = false;
      this.fnViewList();
    },

    // axios: 모달 삭제
    async fnModalDelete() {
      var isDelete = confirm("해당 검토사항을 삭제하시겠습니까?");
      if (!isDelete) {
        return;
      }
      // 데이터 세팅
      const data = this.rvwMttrView;
      data.useYn = "N";
      // 실행
      try {
        const response = await rvwMttrDeleteProc(data);
        alert(response.data["message"]);
        this.fnViewList(); // 검토사항 재조회
        this.$emit("fnIvstDscsnView");
        this.fnModalClose();
      } catch (error) {
        alert("에러가 발생했습니다.\n관리자에게 문의해주세요.");
      }
    },
    // 모달 수정
    fnModalUpdate() {
      this.$router.push({
        path: this.pageRole + "/companyReview/insert.page",
        query: {
          pageId: this.rvwMttrView["rvwMttrId"],
          entId: this.rvwMttrView.entId,
        },
      });
    },
  },
};
</script>