first commit
This commit is contained in:
Yu Sung
282
src/views/Can/CanManagement.vue
Normal file
282
src/views/Can/CanManagement.vue
Normal file
@@ -0,0 +1,282 @@
|
||||
<template>
|
||||
<div>
|
||||
<v-toolbar dark>
|
||||
<v-spacer />
|
||||
<v-toolbar-title>코인 환율관리</v-toolbar-title>
|
||||
<v-spacer />
|
||||
</v-toolbar>
|
||||
|
||||
<br>
|
||||
|
||||
<v-row>
|
||||
<v-dialog
|
||||
v-model="show_dialog"
|
||||
max-width="400px"
|
||||
persistent
|
||||
>
|
||||
<template v-slot:activator="{ on, attrs }">
|
||||
<v-container>
|
||||
<v-row>
|
||||
<v-col cols="10" />
|
||||
<v-col>
|
||||
<v-btn
|
||||
block
|
||||
color="#9970ff"
|
||||
dark
|
||||
depressed
|
||||
v-bind="attrs"
|
||||
v-on="on"
|
||||
>
|
||||
코인등록
|
||||
</v-btn>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row>
|
||||
<v-col>
|
||||
<v-data-table
|
||||
:headers="headers"
|
||||
:items="coins"
|
||||
class="elevation-1"
|
||||
hide-default-footer
|
||||
>
|
||||
<template v-slot:item.price="{ item }">
|
||||
{{ item.price.toLocaleString('en-US') }}원
|
||||
</template>
|
||||
|
||||
<template v-slot:item.coin="{ item }">
|
||||
{{ item.coin.toLocaleString('en-US') }}코인
|
||||
</template>
|
||||
|
||||
<template v-slot:item.rewardCoin="{ item }">
|
||||
{{ item.rewardCoin.toLocaleString('en-US') }}코인
|
||||
</template>
|
||||
|
||||
<template v-slot:item.management="{ item }">
|
||||
<v-btn
|
||||
:disabled="isLoading"
|
||||
@click="showModifyCoinDialog(item)"
|
||||
>
|
||||
수정
|
||||
</v-btn>
|
||||
|
||||
<v-btn
|
||||
:disabled="isLoading"
|
||||
@click="deleteCoin(item)"
|
||||
>
|
||||
삭제
|
||||
</v-btn>
|
||||
</template>
|
||||
</v-data-table>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</template>
|
||||
|
||||
<v-card>
|
||||
<v-card-title>코인 등록</v-card-title>
|
||||
<v-card-text>
|
||||
<v-text-field
|
||||
v-model="price"
|
||||
label="원화"
|
||||
required
|
||||
/>
|
||||
</v-card-text>
|
||||
<v-card-text>
|
||||
<v-text-field
|
||||
v-model="coin"
|
||||
label="코인"
|
||||
required
|
||||
/>
|
||||
</v-card-text>
|
||||
<v-card-text>
|
||||
<v-text-field
|
||||
v-model="reward_coin"
|
||||
label="리워드 코인"
|
||||
required
|
||||
/>
|
||||
</v-card-text>
|
||||
<v-card-actions v-show="!isLoading">
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="cancel"
|
||||
>
|
||||
취소
|
||||
</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"
|
||||
>
|
||||
등록
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as api from '@/api/coin'
|
||||
|
||||
export default {
|
||||
name: "CoinView",
|
||||
|
||||
data() {
|
||||
return {
|
||||
isLoading: false,
|
||||
show_dialog: false,
|
||||
selected_coin: null,
|
||||
price: null,
|
||||
coin: null,
|
||||
reward_coin: null,
|
||||
headers: [
|
||||
{
|
||||
text: '원화(VAT포함)',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'price',
|
||||
},
|
||||
{
|
||||
text: '충전코인',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'coin',
|
||||
},
|
||||
{
|
||||
text: '리워드코인',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'rewardCoin',
|
||||
},
|
||||
{
|
||||
text: '관리',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'management'
|
||||
},
|
||||
],
|
||||
coins: [],
|
||||
}
|
||||
},
|
||||
|
||||
async created() {
|
||||
await this.getCoins()
|
||||
},
|
||||
|
||||
methods: {
|
||||
notifyError(message) {
|
||||
this.$dialog.notify.error(message)
|
||||
},
|
||||
|
||||
notifySuccess(message) {
|
||||
this.$dialog.notify.success(message)
|
||||
},
|
||||
|
||||
cancel() {
|
||||
this.show_dialog = false
|
||||
this.coin = null
|
||||
this.price = null
|
||||
this.reward_coin = null
|
||||
this.selected_coin = 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() {
|
||||
this.isLoading = true
|
||||
try {
|
||||
let res = await api.getCoins();
|
||||
this.coins = res.data.data
|
||||
} catch (e) {
|
||||
this.notifyError("알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.")
|
||||
} finally {
|
||||
this.isLoading = false
|
||||
}
|
||||
},
|
||||
|
||||
async deleteCoin(item) {
|
||||
this.isLoading = true
|
||||
|
||||
let res = await api.deleteCoin(item.id)
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.notifySuccess(res.data.message || '삭제되었습니다.')
|
||||
this.coins = []
|
||||
await this.getCoins()
|
||||
} 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)
|
||||
|
||||
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 || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
}
|
||||
|
||||
this.isLoading = false
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
Reference in New Issue
Block a user