청구 검증 화면상에서 실행 후 엑셀 다운로드 가능하도록 수정

frontend/src/modules/calculate/service/mock/verificationExcelHeader.json

@@ -3,7 +3,7 @@
     [
       {
         "key": "discount"
-        ,"name": "할인율"
+        ,"name": "할인율(%)"
         ,"rowspan": 2
       },
       {
@@ -13,7 +13,7 @@
       },
       {
         "key": "calUseAmt"
-        ,"name": "청구금액 계산"
+        ,"name": "계산된 청구금액"
         ,"rowspan": 2
       },
       {

frontend/src/modules/calculate/views/Verification.vue

@@ -28,7 +28,8 @@
           총 <span>{{totalCnt}}</span>건
         </div>
         <div class="button_group">
-          <button type="button" class="button blue" @click="excuteVerification()">청구 검증 실행</button>
+          <button type="button" class="button grey" @click="excuteVerification()">청구 검증 실행</button>
+          <button type="button" class="button blue download" @click="verificationExcel()">엑셀다운로드</button>
         </div>
       </div>
       <div class="table calculate scroll">
@@ -38,7 +39,9 @@
               <colgroup>
                 <col style="width: 100px;">
                 <col style="width: 100px;">
-                <col style="width: 150px;">
+                <col style="width: 100px;">
+                <col style="width: 100px;">
+                <col style="width: 180px;">
                 <col style="width: 120px;">
                 <col style="width: 180px;">
                 <col style="width: 100px;">
@@ -68,8 +71,10 @@
               </colgroup>
               <thead>
                 <tr>
-                  <th scope="col" rowspan="2">할인율</th>
+                  <th scope="col" rowspan="2">할인율(%)</th>
-                  <th scope="col" rowspan="2">유큐브 청구금액</th>
+                  <th scope="col" rowspan="2">유큐브<br>청구금액</th>
+                  <th scope="col" rowspan="2">계산된<br>청구금액</th>
+                  <th scope="col" rowspan="2">청구금액<br>일치여부</th>
                   <th scope="col" rowspan="2">고객사</th>
                   <th scope="col" rowspan="2">사업자번호</th>
                   <th scope="col" rowspan="2">유큐브등록번호</th>
@@ -108,6 +113,8 @@
                 <tr v-for="(item, i) in list" v-bind:key="i" >
                   <td><input type="text" class="search-box" @keypress="onlyNumFstZero" @input="onlyNumFstZero" maxlength="3" v-model="item.discount" autocomplete="off"></td>
                   <td><input type="text" class="search-box" @keypress="onlyNumFstZero" @input="onlyNumFstZero" maxlength="10" v-model="item.billAmt" autocomplete="off"></td>
+                  <td>{{item.calUseAmt}}</td>
+                  <td>{{item.billRslt}}</td>
                   <td>{{item.custNm}}</td>
                   <td>{{item.bizrno}}</td>
                   <td>{{item.entrNo}}</td>
@@ -175,7 +182,8 @@ export default {
       pageType: 'VERIFICATION',
       totalCnt : 0,
       noDataStr: '검색 결과가 없습니다.',
-      excelHeader: []
+      excelHeader: [],
+      excelDownAble:false
     };
   },
   components: {
@@ -194,7 +202,7 @@ export default {
   },
   methods: {
     async verification() {
-      
+      this.excelDownAble = false;
       this.params = {
         lmtYm: moment(this.lmtYm).format('YYYYMM')
       }
@@ -236,11 +244,7 @@ export default {
         this.excelHeader = res;
       });
     },
-    async excuteVerification() {
+    excuteVerification() {
-      
-      let today = moment().format('YYYYMMDDHHmmss');
-      const saveFileName = `청구 검증_${today}.xls`;
-      
       if (this.list.length <= 0) {
         this.row.title = '청구 검증 실행';
         this.row.msg1 = '조회된 데이터가 없습니다.';
@@ -256,7 +260,7 @@ export default {
         return false;
       }
       
-      const data = this.list.map((item,index) => {
+      this.list = this.list.map((item,index) => {
         
         if(item.discount.trim() == undefined || item.discount.trim() == null || item.discount.trim() == "" || item.discount.trim().toLowerCase() == "e"){
           item.discount = 0;
@@ -274,17 +278,30 @@ export default {
         if(item.calUseAmt == item.billAmt){
           item.billRslt = "일치";
         }
-
+        return {...item}
-        return {...item};
       });
+      
+      this.excelDownAble = true;
+    },
+
+    async verificationExcel() {
+      let today = moment().format('YYYYMMDDHHmmss');
+      const saveFileName = `청구 검증_${today}.xls`;
+
+      if (!this.excelDownAble) {
+        this.row.title = '청구 검증 엑셀 다운로드';
+        this.row.msg1 = '청구 검증을 먼저 실행해 주세요.';
+        this.$refs.commmonModal.alertModalOpen(this.row);
+        return false;
+      }
 
       let options = {
         header: this.excelHeader,
         dataOrder: 'header',
       };
       
-      xlsx.export(data, saveFileName, options).then(() => {});
+      xlsx.export(this.list, saveFileName, options).then(() => {});
-    },
+    }
 
   },
 };