캔, 충전현황 페이지 API 연동

src/views/Can/CanManagement.vue

@@ -2,7 +2,7 @@
   <div>
     <v-toolbar dark>
       <v-spacer />
-      <v-toolbar-title>코인 환율관리</v-toolbar-title>
+      <v-toolbar-title>캔 환율관리</v-toolbar-title>
       <v-spacer />
     </v-toolbar>
 
@@ -27,7 +27,7 @@
                   v-bind="attrs"
                   v-on="on"
                 >
-                  코인등록
+                  캔등록
                 </v-btn>
               </v-col>
             </v-row>
@@ -35,33 +35,26 @@
               <v-col>
                 <v-data-table
                   :headers="headers"
-                  :items="coins"
+                  :items="cans"
                   class="elevation-1"
                   hide-default-footer
                 >
                   <template v-slot:item.price="{ item }">
-                    {{ item.price.toLocaleString('en-US') }}원
+                    {{ item.price.toLocaleString('en-US') }} 원
                   </template>
 
-                  <template v-slot:item.coin="{ item }">
-                    {{ item.coin.toLocaleString('en-US') }}코인
+                  <template v-slot:item.can="{ item }">
+                    {{ item.can.toLocaleString('en-US') }} 캔
                   </template>
 
-                  <template v-slot:item.rewardCoin="{ item }">
-                    {{ item.rewardCoin.toLocaleString('en-US') }}코인
+                  <template v-slot:item.rewardCan="{ item }">
+                    {{ item.rewardCan.toLocaleString('en-US') }} 캔
                   </template>
 
                   <template v-slot:item.management="{ item }">
                     <v-btn
                       :disabled="isLoading"
-                      @click="showModifyCoinDialog(item)"
-                    >
-                      수정
-                    </v-btn>
-                    &nbsp;&nbsp;
-                    <v-btn
-                      :disabled="isLoading"
-                      @click="deleteCoin(item)"
+                      @click="deleteCan(item)"
                     >
                       삭제
                     </v-btn>
@@ -73,7 +66,7 @@
         </template>
 
         <v-card>
-          <v-card-title>코인 등록</v-card-title>
+          <v-card-title>캔 등록</v-card-title>
           <v-card-text>
             <v-text-field
               v-model="price"
@@ -83,15 +76,15 @@
           </v-card-text>
           <v-card-text>
             <v-text-field
-              v-model="coin"
-              label="코인"
+              v-model="can"
+              label="캔"
               required
             />
           </v-card-text>
           <v-card-text>
             <v-text-field
-              v-model="reward_coin"
-              label="리워드 코인"
+              v-model="reward_can"
+              label="리워드 캔"
               required
             />
           </v-card-text>
@@ -105,15 +98,6 @@
               취소
             </v-btn>
             <v-btn
-              v-if="selected_coin !== null"
-              color="blue darken-1"
-              text
-              @click="modify"
-            >
-              수정
-            </v-btn>
-            <v-btn
-              v-else
               color="blue darken-1"
               text
               @click="submit"
@@ -128,19 +112,19 @@
 </template>
 
 <script>
-import * as api from '@/api/coin'
+import * as api from '@/api/can'
 
 export default {
-  name: "CoinView",
+  name: "CanView",
 
   data() {
     return {
       isLoading: false,
       show_dialog: false,
-      selected_coin: null,
+      selected_can: null,
       price: null,
-      coin: null,
-      reward_coin: null,
+      can: null,
+      reward_can: null,
       headers: [
         {
           text: '원화(VAT포함)',
@@ -149,16 +133,16 @@ export default {
           value: 'price',
         },
         {
-          text: '충전코인',
+          text: '충전캔',
           align: 'center',
           sortable: false,
-          value: 'coin',
+          value: 'can',
         },
         {
-          text: '리워드코인',
+          text: '리워드캔',
           align: 'center',
           sortable: false,
-          value: 'rewardCoin',
+          value: 'rewardCan',
         },
         {
           text: '관리',
@@ -167,12 +151,12 @@ export default {
           value: 'management'
         },
       ],
-      coins: [],
+      cans: [],
     }
   },
 
   async created() {
-    await this.getCoins()
+    await this.getCans()
   },
 
   methods: {
@@ -186,26 +170,17 @@ export default {
 
     cancel() {
       this.show_dialog = false
-      this.coin = null
+      this.can = null
       this.price = null
-      this.reward_coin = null
-      this.selected_coin = null
+      this.reward_can = null
+      this.selected_can = null
     },
 
-    showModifyCoinDialog(item) {
-      this.selected_coin = item
-      this.price = item.price
-      this.coin = item.coin
-      this.reward_coin = item.rewardCoin
-
-      this.show_dialog = true
-    },
-
-    async getCoins() {
+    async getCans() {
       this.isLoading = true
       try {
-        let res = await api.getCoins();
-        this.coins = res.data.data
+        let res = await api.getCans();
+        this.cans = res.data.data
       } catch (e) {
         this.notifyError("알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.")
       } finally {
@@ -213,60 +188,34 @@ export default {
       }
     },
 
-    async deleteCoin(item) {
+    async deleteCan(item) {
       this.isLoading = true
 
-      let res = await api.deleteCoin(item.id)
+      let res = await api.deleteCan(item.id)
       if (res.status === 200 && res.data.success === true) {
         this.notifySuccess(res.data.message || '삭제되었습니다.')
-        this.coins = []
-        await this.getCoins()
+        this.cans = []
+        await this.getCans()
       } else {
         this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
       }
     },
 
-    async modify() {
-      this.isLoading = true
-
-      try {
-        const res = await api.modifyCoin(this.selected_coin.id, this.coin, this.reward_coin, this.price)
-
-        if (res.status === 200 && res.data.success === true) {
-          this.show_dialog = false
-          this.coin = null
-          this.price = null
-          this.reward_coin = null
-          this.selected_coin = null
-          this.notifySuccess(res.data.message || '수정되었습니다.')
-
-          this.coins = []
-          await this.getCoins()
-        } else {
-          this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-        }
-      } catch (e) {
-        this.notifyError("알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.")
-      } finally {
-        this.isLoading = false
-      }
-    },
-
     async submit() {
       this.isLoading = true
 
-      const res = await api.insertCoin(this.coin, this.reward_coin, this.price)
+      const res = await api.insertCan(this.can, this.reward_can, this.price)
 
       if (res.status === 200 && res.data.success === true) {
         this.show_dialog = false
-        this.coin = null
+        this.can = null
         this.price = null
-        this.reward_coin = null
-        this.selected_coin = null
+        this.reward_can = null
+        this.selected_can = null
         this.notifySuccess(res.data.message || '등록되었습니다.')
 
-        this.coins = []
-        await this.getCoins()
+        this.cans = []
+        await this.getCans()
       } else {
         this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
       }