hubez-admin/frontend/src/modules/sysMgt/views/AuthList.vue

<template>
  <div class="contents">
    <div class="contents_wrap">
      <div class="top_wrap">
        <h3 class="title">권한 관리</h3>
        <p class="breadcrumb">운영 관리 &gt; 권한 관리</p>
      </div>
      <div class="info">
        <div class="count">
          총 <span>{{ totalCnt }}</span
          >건
        </div>
        <div class="button_group">
          <button type="button" class="button blue add" @click="insertAuth()">권한 추가</button>
        </div>
      </div>
      <div class="table">
        <table>
          <colgroup>
            <col width="10%" />
            <col width="20%" />
            <col width="20%" />
            <col width="15%" />
            <col width="20%" />
            <col width="15%" />
          </colgroup>
          <thead>
            <tr>
              <th>NO</th>
              <th>코드</th>
              <th>권한명</th>
              <th>상태</th>
              <th>등록일</th>
              <th></th>
            </tr>
          </thead>
          <tbody>
            <tr v-for="(option, i) in list" v-bind:key="i">
              <td>{{ option.no }}</td>
              <td>{{ option.authCd }}</td>
              <td>{{ option.authNm }}</td>
              <td>{{ option.authStat }}</td>
              <td>{{ option.regDt }}</td>
              <td v-if="option.authCd === '1001' || option.authCd === '1002'" class="two_btn_group"></td>
              <td v-else class="two_btn_group">
                <button type="button" class="button grey" @click="updateAuth(option.authCd)">수정</button>
                <button type="button" class="button white delete" @click="authDelete(option.authCd)">삭제</button>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
      <common-modal ref="commmonModal"></common-modal>
    </div>
  </div>
</template>

<script>
import sysMgtApi from '../service/sysMgtApi.js';
import commonModal from '@/components/modal/commonModal';

export default {
  name: 'authList',
  data() {
    return {
      row: {},
      list: [],
      totalCnt: '',
    };
  },
  components: {
    commonModal,
  },
  created() {
    this.getAuthList();
  },
  destroyed() {},
  mounted() {},
  methods: {
    async getAuthList() {
      try {
        const response = await sysMgtApi.authList(this.row);
        const result = response.data;
        if (result != null && result.retCode == '0000') {
          this.list = result.data.list;
          this.totalCnt = result.data.list.length;
        } else {
          this.row.title = '권한 관리';
          this.row.msg1 = '조회정보가 없습니다.';
          this.$refs.commmonModal.alertModalOpen(this.row);
        }
      } catch (err) {
        // this.row.title = '권한 관리';
        // this.row.msg1 = '실패 하였습니다.'
        // this.$refs.commmonModal.alertModalOpen(this.row);
      }
    },
    insertAuth() {
      this.$router.push({ name: 'authAdd' });
    },
    updateAuth(target) {
      this.$router.push({ name: 'authModify', params: { targetAuthCd: target } });
    },
    authDelete(target) {
      this.row.authCd = target;
      this.row.title = '권한 관리';
      this.row.msg1 = '삭제 하시겠습니까?';
      this.$refs.commmonModal.confirmModalOpen2(this.row);
    },
    async deleteAuth() {
      try {
        let response = await sysMgtApi.deleteAuth(this.row);
        const result = response.data;
        if (result != null && result.retCode == '0000') {
          this.getAuthList();
          return;
        } else if (result != null && result.retCode == '4020') {
          this.row = {};
          this.row.title = '권한 관리';
          this.row.msg1 = '해당 권한에 매핑된 사용자가 있습니다.';
          this.$refs.commmonModal.alertModalOpen(this.row);
        } else {
          this.row = {};
          this.row.title = '권한 관리';
          this.row.msg1 = '실패 하였습니다.';
          this.$refs.commmonModal.alertModalOpen(this.row);
        }
      } catch (err) {
        // this.row = {}
        // this.row.title = '권한 관리';
        // this.row.msg1 = '실패 하였습니다.';
        // this.$refs.commmonModal.alertModalOpen(this.row);
      }
    },
    confirmCalbackFnc(props) {
      if (props.result) {
        this.deleteAuth();
      }
    },
  },
};
</script>