엑셀다운로드 기능 추가

src/api/can.js

@@ -31,4 +31,17 @@ async function getCouponNumberList(couponId, page) {
     return Vue.axios.get('/can/coupon/number-list?couponId=' + couponId + '&page=' + (page - 1) + "&size=20");
 }
 
-export {getCans, insertCan, deleteCan, paymentCan, getCouponList, generateCoupon, getCouponNumberList}
+async function downloadCouponNumberList(couponId) {
+    return Vue.axios.get('/can/coupon/number-list/download?couponId=' + couponId, { responseType: 'blob' });
+}
+
+export {
+    getCans,
+    insertCan,
+    deleteCan,
+    paymentCan,
+    getCouponList,
+    generateCoupon,
+    getCouponNumberList,
+    downloadCouponNumberList
+}

src/views/Can/CanCoupon.vue

@@ -33,14 +33,13 @@
             item-key="id"
             class="elevation-1"
             hide-default-footer
-            @click:row="getCouponNumberList"
           >
             <template v-slot:item.id="{ item }">
               {{ item.id }}
             </template>
 
             <template v-slot:item.couponName="{ item }">
-              {{ item.couponName }}
+              <span @click="getCouponNumberList(item)">{{ item.couponName }}</span>
             </template>
 
             <template v-slot:item.can="{ item }">
@@ -76,6 +75,14 @@
                 X
               </div>
             </template>
+            <template v-slot:item.download="{ item }">
+              <v-btn
+                :disabled="is_loading"
+                @click="downloadCouponNumberList(item)"
+              >
+                다운로드
+              </v-btn>
+            </template>
           </v-data-table>
         </v-col>
       </v-row>
@@ -245,6 +252,8 @@
 
 <script>
 import * as api from '@/api/can'
+import { saveAs } from 'file-saver';
+
 import datetime from "vuejs-datetimepicker";
 
 export default {
@@ -528,6 +537,26 @@ export default {
 
       this.is_loading = false
     },
+
+    async downloadCouponNumberList(item) {
+      this.is_loading = true
+
+      try {
+        const response = await api.downloadCouponNumberList(item.id)
+        // Create a Blob from the PDF Stream
+        const file = new Blob(
+          [response.data],
+          { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' }
+        );
+
+        // Use FileSaver to save the file
+        saveAs(file, '쿠폰번호리스트.xlsx');
+        this.is_loading = false
+      } catch (e) {
+        this.notifyError('다운로드를 하지 못했습니다.\n다시 시도해 주세요.')
+        this.is_loading = false
+      }
+    }
   }
 }
 </script>