수정 기능 추가

src/api/can.js

@@ -35,11 +35,16 @@ async function downloadCouponNumberList(couponId) {
     return Vue.axios.get('/can/coupon/number-list/download?couponId=' + couponId, { responseType: 'blob' });
 }
 
+async function modifyCoupon(request) {
+    return Vue.axios.put('/can/coupon', request);
+}
+
 export {
     getCans,
     insertCan,
     deleteCan,
     paymentCan,
+    modifyCoupon,
     getCouponList,
     generateCoupon,
     getCouponNumberList,

src/views/Can/CanCoupon.vue

@@ -83,6 +83,14 @@
                 다운로드
               </v-btn>
             </template>
+            <template v-slot:item.management="{ item }">
+              <v-btn
+                :disabled="is_loading"
+                @click="showModifyDialog(item)"
+              >
+                수정
+              </v-btn>
+            </template>
           </v-data-table>
         </v-col>
       </v-row>
@@ -154,7 +162,96 @@
               </v-col>
             </v-row>
           </v-card-text>
-          <v-card-text v-show="selected_coupon !== null">
+          <v-card-actions v-show="!is_loading">
+            <v-spacer />
+            <v-btn
+              color="blue darken-1"
+              text
+              @click="cancel"
+            >
+              취소
+            </v-btn>
+            <v-btn
+              color="blue darken-1"
+              text
+              @click="validate"
+            >
+              쿠폰 발행하기
+            </v-btn>
+          </v-card-actions>
+        </v-card>
+      </v-dialog>
+    </v-row>
+
+    <v-row v-if="selected_coupon !== null">
+      <v-dialog
+        v-model="show_modify_dialog"
+        max-width="1000px"
+        persistent
+      >
+        <v-card>
+          <v-card-title>쿠폰 수정</v-card-title>
+          <v-card-text>
+            <v-row align="center">
+              <v-col cols="4">
+                쿠폰명
+              </v-col>
+              <v-col cols="8">
+                {{ selected_coupon.couponName }}
+              </v-col>
+            </v-row>
+          </v-card-text>
+          <v-card-text>
+            <v-row align="center">
+              <v-col cols="4">
+                쿠폰금액
+              </v-col>
+              <v-col cols="8">
+                {{ selected_coupon.can }}
+              </v-col>
+            </v-row>
+          </v-card-text>
+          <v-card-text>
+            <v-row align="center">
+              <v-col cols="4">
+                발행수량
+              </v-col>
+              <v-col cols="8">
+                {{ selected_coupon.couponCount }}
+              </v-col>
+            </v-row>
+          </v-card-text>
+          <v-card-text>
+            <v-row align="center">
+              <v-col cols="4">
+                유효기간
+              </v-col>
+              <v-col
+                cols="8"
+                class="datepicker-wrapper"
+              >
+                <datetime
+                  v-model="validity"
+                  class="datepicker"
+                  format="YYYY-MM-DD"
+                />
+              </v-col>
+            </v-row>
+          </v-card-text>
+          <v-card-text>
+            <v-row align="center">
+              <v-col cols="4">
+                인증 계정당 중복 사용 가능여부
+              </v-col>
+              <v-col cols="8">
+                <input
+                  v-model="is_multiple_use"
+                  type="checkbox"
+                >
+              </v-col>
+            </v-row>
+          </v-card-text>
+          <v-card-text>
             <v-row align="center">
               <v-col cols="4">
                 활성화
@@ -179,9 +276,9 @@
             <v-btn
               color="blue darken-1"
               text
-              @click="validate"
+              @click="modify"
             >
-              쿠폰 발행하기
+              수정하기
             </v-btn>
           </v-card-actions>
         </v-card>
@@ -265,6 +362,7 @@ export default {
       is_loading: false,
       is_modify: false,
       show_write_dialog: false,
+      show_modify_dialog: false,
       show_coupon_number_list_dialog: false,
 
       coupon_number_list: [],
@@ -357,6 +455,12 @@ export default {
           align: 'center',
           sortable: false,
           value: 'download',
+        },
+        {
+          text: '관리',
+          align: 'center',
+          sortable: false,
+          value: 'management',
         }
       ],
 
@@ -426,7 +530,7 @@ export default {
     },
 
     cancel() {
-      this.is_modify = false
+      this.show_modify_dialog = false
       this.show_write_dialog = false
       this.show_coupon_number_list_dialog = false
 
@@ -440,6 +544,14 @@ export default {
       this.coupon_number_count = null
     },
 
+    showModifyDialog(value) {
+      this.selected_coupon = value
+      this.validity = value.validity
+      this.is_multiple_use = value.isMultipleUse
+      this.is_active = value.isActive
+      this.show_modify_dialog = true
+    },
+
     formatWithHyphens(value) {
       const chunks = [];
       for (let i = 0; i < value.length; i += 4) {
@@ -556,6 +668,44 @@ export default {
         this.notifyError('다운로드를 하지 못했습니다.\n다시 시도해 주세요.')
         this.is_loading = false
       }
+    },
+
+    async modify() {
+      if (this.is_loading) return;
+
+      this.is_loading = true
+
+      try {
+        const request = {couponId: this.selected_coupon.id}
+
+        if (this.validity !== this.selected_coupon.validity) {
+          request.validity = this.validity + ' 23:59:59';
+        }
+
+        if (this.is_active !== this.selected_coupon.isActive) {
+          request.isActive = this.is_active;
+        }
+
+        if (this.is_multiple_use !== this.selected_coupon.isMultipleUse) {
+          request.isMultipleUse = this.is_multiple_use;
+        }
+
+        const res = await api.modifyCoupon(request);
+
+        if (res.status === 200 && res.data.success === true) {
+          this.cancel()
+          this.notifySuccess(res.data.message || '수정되었습니다.')
+
+          this.coupon_list = [];
+          await this.getCouponList()
+        } else {
+          this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
+        }
+      } catch (e) {
+        this.notifyError("알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.")
+      }
+
+      this.is_loading = false
     }
   }
 }