캔, 충전현황 페이지 API 연동
This commit is contained in:
		
							
								
								
									
										21
									
								
								src/api/can.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										21
									
								
								src/api/can.js
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,21 @@ | |||||||
|  | import Vue from 'vue'; | ||||||
|  |  | ||||||
|  | async function deleteCan(id) { | ||||||
|  |     return Vue.axios.delete('/admin/can/' + id); | ||||||
|  | } | ||||||
|  |  | ||||||
|  | async function getCans() { | ||||||
|  |     return Vue.axios.get('/can'); | ||||||
|  | } | ||||||
|  |  | ||||||
|  | async function insertCan(can, rewardCan, price) { | ||||||
|  |     const request = {can: can, rewardCan: rewardCan, price: price} | ||||||
|  |     return Vue.axios.post('/admin/can', request); | ||||||
|  | } | ||||||
|  |  | ||||||
|  | async function paymentCan(can, method, member_id) { | ||||||
|  |     const request = {memberId: member_id, method: method, can: can} | ||||||
|  |     return Vue.axios.post('/admin/can/charge', request) | ||||||
|  | } | ||||||
|  |  | ||||||
|  | export {getCans, insertCan, deleteCan, paymentCan} | ||||||
| @@ -1,27 +0,0 @@ | |||||||
| import Vue from 'vue'; |  | ||||||
|  |  | ||||||
| async function deleteCoin(id) { |  | ||||||
|     return Vue.axios.delete('/coin/' + id); |  | ||||||
| } |  | ||||||
|  |  | ||||||
| async function modifyCoin(id, coin, rewardCoin, price) { |  | ||||||
|     const request = {id: id, coin: coin, rewardCoin: rewardCoin, price: price} |  | ||||||
|     return Vue.axios.put('/coin', request); |  | ||||||
| } |  | ||||||
|  |  | ||||||
|  |  | ||||||
| async function getCoins() { |  | ||||||
|     return Vue.axios.get('/coin'); |  | ||||||
| } |  | ||||||
|  |  | ||||||
| async function insertCoin(coin, rewardCoin, price) { |  | ||||||
|     const request = {coin: coin, rewardCoin: rewardCoin, price: price} |  | ||||||
|     return Vue.axios.post('/coin', request); |  | ||||||
| } |  | ||||||
|  |  | ||||||
| async function paymentCoin(coin, method, account_id) { |  | ||||||
|     const request = {accountId: account_id, method: method, coin: coin} |  | ||||||
|     return Vue.axios.post('/admin/coin/charge', request) |  | ||||||
| } |  | ||||||
|  |  | ||||||
| export {getCoins, insertCoin, modifyCoin, deleteCoin, paymentCoin} |  | ||||||
| @@ -108,7 +108,7 @@ const routes = [ | |||||||
|             { |             { | ||||||
|                 path: '/can/status', |                 path: '/can/status', | ||||||
|                 name: 'CoinStatus', |                 name: 'CoinStatus', | ||||||
|                 component: () => import(/* webpackChunkName: "coin" */ '../views/Can/CoinStatus.vue') |                 component: () => import(/* webpackChunkName: "coin" */ '../views/Can/CanStatus.vue') | ||||||
|             }, |             }, | ||||||
|             { |             { | ||||||
|                 path: '/calculate/creator', |                 path: '/calculate/creator', | ||||||
|   | |||||||
| @@ -2,7 +2,7 @@ | |||||||
|   <div> |   <div> | ||||||
|     <v-toolbar dark> |     <v-toolbar dark> | ||||||
|       <v-spacer /> |       <v-spacer /> | ||||||
|       <v-toolbar-title>코인 충전</v-toolbar-title> |       <v-toolbar-title>캔 충전</v-toolbar-title> | ||||||
|       <v-spacer /> |       <v-spacer /> | ||||||
|     </v-toolbar> |     </v-toolbar> | ||||||
|  |  | ||||||
| @@ -23,8 +23,8 @@ | |||||||
|       /> |       /> | ||||||
|  |  | ||||||
|       <v-text-field |       <v-text-field | ||||||
|         v-model="coin" |         v-model="can" | ||||||
|         label="지급할 코인 수" |         label="지급할 캔 수" | ||||||
|         outlined |         outlined | ||||||
|         required |         required | ||||||
|       /> |       /> | ||||||
| @@ -39,7 +39,7 @@ | |||||||
|             depressed |             depressed | ||||||
|             @click="confirm" |             @click="confirm" | ||||||
|           > |           > | ||||||
|             코인 지급 |             캔 지급 | ||||||
|           </v-btn> |           </v-btn> | ||||||
|         </v-col> |         </v-col> | ||||||
|       </v-row> |       </v-row> | ||||||
| @@ -50,7 +50,7 @@ | |||||||
|           persistent |           persistent | ||||||
|         > |         > | ||||||
|           <v-card> |           <v-card> | ||||||
|             <v-card-title>코인 지급 확인</v-card-title> |             <v-card-title>캔 지급 확인</v-card-title> | ||||||
|             <v-card-text> |             <v-card-text> | ||||||
|               회원번호: {{ account_id }} |               회원번호: {{ account_id }} | ||||||
|             </v-card-text> |             </v-card-text> | ||||||
| @@ -58,7 +58,7 @@ | |||||||
|               기록내용: {{ method }} |               기록내용: {{ method }} | ||||||
|             </v-card-text> |             </v-card-text> | ||||||
|             <v-card-text> |             <v-card-text> | ||||||
|               지급할 코인 수: {{ coin }}코인 |               지급할 캔 수: {{ can }} 캔 | ||||||
|             </v-card-text> |             </v-card-text> | ||||||
|             <v-card-actions v-show="!isLoading"> |             <v-card-actions v-show="!isLoading"> | ||||||
|               <v-spacer /> |               <v-spacer /> | ||||||
| @@ -67,7 +67,7 @@ | |||||||
|                 text |                 text | ||||||
|                 @click="submit" |                 @click="submit" | ||||||
|               > |               > | ||||||
|                 코인 지급 |                 캔 지급 | ||||||
|               </v-btn> |               </v-btn> | ||||||
|               <v-spacer /> |               <v-spacer /> | ||||||
|               <v-btn |               <v-btn | ||||||
| @@ -87,10 +87,10 @@ | |||||||
| </template> | </template> | ||||||
|  |  | ||||||
| <script> | <script> | ||||||
| import * as api from '@/api/coin' | import * as api from '@/api/can' | ||||||
|  |  | ||||||
| export default { | export default { | ||||||
|   name: "CoinCharge", |   name: "CanCharge", | ||||||
|  |  | ||||||
|   data() { |   data() { | ||||||
|     return { |     return { | ||||||
| @@ -98,7 +98,7 @@ export default { | |||||||
|       isLoading: false, |       isLoading: false, | ||||||
|       account_id: '', |       account_id: '', | ||||||
|       method: '', |       method: '', | ||||||
|       coin: '' |       can: '' | ||||||
|     } |     } | ||||||
|   }, |   }, | ||||||
|  |  | ||||||
| @@ -113,15 +113,15 @@ export default { | |||||||
|  |  | ||||||
|     confirm() { |     confirm() { | ||||||
|       if (this.account_id.trim() === '' || isNaN(this.account_id)) { |       if (this.account_id.trim() === '' || isNaN(this.account_id)) { | ||||||
|         return this.notifyError('코인을 지급할 회원의 회원번호를 입력하세요.') |         return this.notifyError('캔을 지급할 회원의 회원번호를 입력하세요.') | ||||||
|       } |       } | ||||||
|  |  | ||||||
|       if (this.method.trim() === '') { |       if (this.method.trim() === '') { | ||||||
|         return this.notifyError('기록할 내용을 입력하세요') |         return this.notifyError('기록할 내용을 입력하세요') | ||||||
|       } |       } | ||||||
|  |  | ||||||
|       if (isNaN(this.coin)) { |       if (isNaN(this.can)) { | ||||||
|         return this.notifyError('코인은 숫자만 넣을 수 있습니다.') |         return this.notifyError('캔은 숫자만 넣을 수 있습니다.') | ||||||
|       } |       } | ||||||
|  |  | ||||||
|       if (!this.isLoading) { |       if (!this.isLoading) { | ||||||
| @@ -140,12 +140,12 @@ export default { | |||||||
|         try { |         try { | ||||||
|           this.show_confirm = false |           this.show_confirm = false | ||||||
|  |  | ||||||
|           const res = await api.paymentCoin(Number(this.coin), this.method, this.account_id) |           const res = await api.paymentCan(Number(this.can), this.method, this.account_id) | ||||||
|           if (res.status === 200 && res.data.success === true) { |           if (res.status === 200 && res.data.success === true) { | ||||||
|             this.notifySuccess('코인이 지급되었습니다.') |             this.notifySuccess('캔이 지급되었습니다.') | ||||||
|             this.account_id = '' |             this.account_id = '' | ||||||
|             this.method = '' |             this.method = '' | ||||||
|             this.coin = '' |             this.can = '' | ||||||
|             this.is_loading = false |             this.is_loading = false | ||||||
|           } else { |           } else { | ||||||
|             this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.') |             this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.') | ||||||
|   | |||||||
| @@ -2,7 +2,7 @@ | |||||||
|   <div> |   <div> | ||||||
|     <v-toolbar dark> |     <v-toolbar dark> | ||||||
|       <v-spacer /> |       <v-spacer /> | ||||||
|       <v-toolbar-title>코인 환율관리</v-toolbar-title> |       <v-toolbar-title>캔 환율관리</v-toolbar-title> | ||||||
|       <v-spacer /> |       <v-spacer /> | ||||||
|     </v-toolbar> |     </v-toolbar> | ||||||
|  |  | ||||||
| @@ -27,7 +27,7 @@ | |||||||
|                   v-bind="attrs" |                   v-bind="attrs" | ||||||
|                   v-on="on" |                   v-on="on" | ||||||
|                 > |                 > | ||||||
|                   코인등록 |                   캔등록 | ||||||
|                 </v-btn> |                 </v-btn> | ||||||
|               </v-col> |               </v-col> | ||||||
|             </v-row> |             </v-row> | ||||||
| @@ -35,33 +35,26 @@ | |||||||
|               <v-col> |               <v-col> | ||||||
|                 <v-data-table |                 <v-data-table | ||||||
|                   :headers="headers" |                   :headers="headers" | ||||||
|                   :items="coins" |                   :items="cans" | ||||||
|                   class="elevation-1" |                   class="elevation-1" | ||||||
|                   hide-default-footer |                   hide-default-footer | ||||||
|                 > |                 > | ||||||
|                   <template v-slot:item.price="{ item }"> |                   <template v-slot:item.price="{ item }"> | ||||||
|                     {{ item.price.toLocaleString('en-US') }}원 |                     {{ item.price.toLocaleString('en-US') }} 원 | ||||||
|                   </template> |                   </template> | ||||||
|  |  | ||||||
|                   <template v-slot:item.coin="{ item }"> |                   <template v-slot:item.can="{ item }"> | ||||||
|                     {{ item.coin.toLocaleString('en-US') }}코인 |                     {{ item.can.toLocaleString('en-US') }} 캔 | ||||||
|                   </template> |                   </template> | ||||||
|  |  | ||||||
|                   <template v-slot:item.rewardCoin="{ item }"> |                   <template v-slot:item.rewardCan="{ item }"> | ||||||
|                     {{ item.rewardCoin.toLocaleString('en-US') }}코인 |                     {{ item.rewardCan.toLocaleString('en-US') }} 캔 | ||||||
|                   </template> |                   </template> | ||||||
|  |  | ||||||
|                   <template v-slot:item.management="{ item }"> |                   <template v-slot:item.management="{ item }"> | ||||||
|                     <v-btn |                     <v-btn | ||||||
|                       :disabled="isLoading" |                       :disabled="isLoading" | ||||||
|                       @click="showModifyCoinDialog(item)" |                       @click="deleteCan(item)" | ||||||
|                     > |  | ||||||
|                       수정 |  | ||||||
|                     </v-btn> |  | ||||||
|                        |  | ||||||
|                     <v-btn |  | ||||||
|                       :disabled="isLoading" |  | ||||||
|                       @click="deleteCoin(item)" |  | ||||||
|                     > |                     > | ||||||
|                       삭제 |                       삭제 | ||||||
|                     </v-btn> |                     </v-btn> | ||||||
| @@ -73,7 +66,7 @@ | |||||||
|         </template> |         </template> | ||||||
|  |  | ||||||
|         <v-card> |         <v-card> | ||||||
|           <v-card-title>코인 등록</v-card-title> |           <v-card-title>캔 등록</v-card-title> | ||||||
|           <v-card-text> |           <v-card-text> | ||||||
|             <v-text-field |             <v-text-field | ||||||
|               v-model="price" |               v-model="price" | ||||||
| @@ -83,15 +76,15 @@ | |||||||
|           </v-card-text> |           </v-card-text> | ||||||
|           <v-card-text> |           <v-card-text> | ||||||
|             <v-text-field |             <v-text-field | ||||||
|               v-model="coin" |               v-model="can" | ||||||
|               label="코인" |               label="캔" | ||||||
|               required |               required | ||||||
|             /> |             /> | ||||||
|           </v-card-text> |           </v-card-text> | ||||||
|           <v-card-text> |           <v-card-text> | ||||||
|             <v-text-field |             <v-text-field | ||||||
|               v-model="reward_coin" |               v-model="reward_can" | ||||||
|               label="리워드 코인" |               label="리워드 캔" | ||||||
|               required |               required | ||||||
|             /> |             /> | ||||||
|           </v-card-text> |           </v-card-text> | ||||||
| @@ -105,15 +98,6 @@ | |||||||
|               취소 |               취소 | ||||||
|             </v-btn> |             </v-btn> | ||||||
|             <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" |               color="blue darken-1" | ||||||
|               text |               text | ||||||
|               @click="submit" |               @click="submit" | ||||||
| @@ -128,19 +112,19 @@ | |||||||
| </template> | </template> | ||||||
|  |  | ||||||
| <script> | <script> | ||||||
| import * as api from '@/api/coin' | import * as api from '@/api/can' | ||||||
|  |  | ||||||
| export default { | export default { | ||||||
|   name: "CoinView", |   name: "CanView", | ||||||
|  |  | ||||||
|   data() { |   data() { | ||||||
|     return { |     return { | ||||||
|       isLoading: false, |       isLoading: false, | ||||||
|       show_dialog: false, |       show_dialog: false, | ||||||
|       selected_coin: null, |       selected_can: null, | ||||||
|       price: null, |       price: null, | ||||||
|       coin: null, |       can: null, | ||||||
|       reward_coin: null, |       reward_can: null, | ||||||
|       headers: [ |       headers: [ | ||||||
|         { |         { | ||||||
|           text: '원화(VAT포함)', |           text: '원화(VAT포함)', | ||||||
| @@ -149,16 +133,16 @@ export default { | |||||||
|           value: 'price', |           value: 'price', | ||||||
|         }, |         }, | ||||||
|         { |         { | ||||||
|           text: '충전코인', |           text: '충전캔', | ||||||
|           align: 'center', |           align: 'center', | ||||||
|           sortable: false, |           sortable: false, | ||||||
|           value: 'coin', |           value: 'can', | ||||||
|         }, |         }, | ||||||
|         { |         { | ||||||
|           text: '리워드코인', |           text: '리워드캔', | ||||||
|           align: 'center', |           align: 'center', | ||||||
|           sortable: false, |           sortable: false, | ||||||
|           value: 'rewardCoin', |           value: 'rewardCan', | ||||||
|         }, |         }, | ||||||
|         { |         { | ||||||
|           text: '관리', |           text: '관리', | ||||||
| @@ -167,12 +151,12 @@ export default { | |||||||
|           value: 'management' |           value: 'management' | ||||||
|         }, |         }, | ||||||
|       ], |       ], | ||||||
|       coins: [], |       cans: [], | ||||||
|     } |     } | ||||||
|   }, |   }, | ||||||
|  |  | ||||||
|   async created() { |   async created() { | ||||||
|     await this.getCoins() |     await this.getCans() | ||||||
|   }, |   }, | ||||||
|  |  | ||||||
|   methods: { |   methods: { | ||||||
| @@ -186,26 +170,17 @@ export default { | |||||||
|  |  | ||||||
|     cancel() { |     cancel() { | ||||||
|       this.show_dialog = false |       this.show_dialog = false | ||||||
|       this.coin = null |       this.can = null | ||||||
|       this.price = null |       this.price = null | ||||||
|       this.reward_coin = null |       this.reward_can = null | ||||||
|       this.selected_coin = null |       this.selected_can = null | ||||||
|     }, |     }, | ||||||
|  |  | ||||||
|     showModifyCoinDialog(item) { |     async getCans() { | ||||||
|       this.selected_coin = item |  | ||||||
|       this.price = item.price |  | ||||||
|       this.coin = item.coin |  | ||||||
|       this.reward_coin = item.rewardCoin |  | ||||||
|  |  | ||||||
|       this.show_dialog = true |  | ||||||
|     }, |  | ||||||
|  |  | ||||||
|     async getCoins() { |  | ||||||
|       this.isLoading = true |       this.isLoading = true | ||||||
|       try { |       try { | ||||||
|         let res = await api.getCoins(); |         let res = await api.getCans(); | ||||||
|         this.coins = res.data.data |         this.cans = res.data.data | ||||||
|       } catch (e) { |       } catch (e) { | ||||||
|         this.notifyError("알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.") |         this.notifyError("알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.") | ||||||
|       } finally { |       } finally { | ||||||
| @@ -213,60 +188,34 @@ export default { | |||||||
|       } |       } | ||||||
|     }, |     }, | ||||||
|  |  | ||||||
|     async deleteCoin(item) { |     async deleteCan(item) { | ||||||
|       this.isLoading = true |       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) { |       if (res.status === 200 && res.data.success === true) { | ||||||
|         this.notifySuccess(res.data.message || '삭제되었습니다.') |         this.notifySuccess(res.data.message || '삭제되었습니다.') | ||||||
|         this.coins = [] |         this.cans = [] | ||||||
|         await this.getCoins() |         await this.getCans() | ||||||
|       } else { |       } else { | ||||||
|         this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.') |         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() { |     async submit() { | ||||||
|       this.isLoading = true |       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) { |       if (res.status === 200 && res.data.success === true) { | ||||||
|         this.show_dialog = false |         this.show_dialog = false | ||||||
|         this.coin = null |         this.can = null | ||||||
|         this.price = null |         this.price = null | ||||||
|         this.reward_coin = null |         this.reward_can = null | ||||||
|         this.selected_coin = null |         this.selected_can = null | ||||||
|         this.notifySuccess(res.data.message || '등록되었습니다.') |         this.notifySuccess(res.data.message || '등록되었습니다.') | ||||||
|  |  | ||||||
|         this.coins = [] |         this.cans = [] | ||||||
|         await this.getCoins() |         await this.getCans() | ||||||
|       } else { |       } else { | ||||||
|         this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.') |         this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.') | ||||||
|       } |       } | ||||||
|   | |||||||
| @@ -2,7 +2,7 @@ | |||||||
|   <div> |   <div> | ||||||
|     <v-toolbar dark> |     <v-toolbar dark> | ||||||
|       <v-spacer /> |       <v-spacer /> | ||||||
|       <v-toolbar-title>코인 충전 현황</v-toolbar-title> |       <v-toolbar-title>캔 충전 현황</v-toolbar-title> | ||||||
|       <v-spacer /> |       <v-spacer /> | ||||||
|     </v-toolbar> |     </v-toolbar> | ||||||
| 
 | 
 | ||||||
| @@ -132,7 +132,7 @@ import * as api from "@/api/charge_status"; | |||||||
| import datetime from 'vuejs-datetimepicker'; | import datetime from 'vuejs-datetimepicker'; | ||||||
| 
 | 
 | ||||||
| export default { | export default { | ||||||
|   name: "CoinStatus", |   name: "CanStatus", | ||||||
|   components: {datetime}, |   components: {datetime}, | ||||||
| 
 | 
 | ||||||
|   data() { |   data() { | ||||||
| @@ -1,13 +0,0 @@ | |||||||
| <template> |  | ||||||
|   <div>회원별 코인관리</div> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| export default { |  | ||||||
|   name: "CoinByUser" |  | ||||||
| } |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style scoped> |  | ||||||
|  |  | ||||||
| </style> |  | ||||||
		Reference in New Issue
	
	Block a user
	 Yu Sung
					Yu Sung