From 6076412b4529947887f69e1d8e5753a00189729d Mon Sep 17 00:00:00 2001
From: Yu Sung <hwchon1234@gmail.com>
Date: Fri, 10 Nov 2023 19:44:26 +0900
Subject: [PATCH] =?UTF-8?q?=EC=BD=98=ED=85=90=EC=B8=A0=20=EC=A0=95?=
=?UTF-8?q?=EC=82=B0=20=ED=8E=98=EC=9D=B4=EC=A7=80=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/api/calculate.js | 6 +-
src/views/Calculate/CalculateContent.vue | 260 ++++++++++++++++++++++-
2 files changed, 262 insertions(+), 4 deletions(-)
diff --git a/src/api/calculate.js b/src/api/calculate.js
index 76065bb..db6ed1e 100644
--- a/src/api/calculate.js
+++ b/src/api/calculate.js
@@ -4,4 +4,8 @@ async function getCalculateLive(startDate, endDate) {
return Vue.axios.get('/admin/calculate/live?startDateStr=' + startDate + '&endDateStr=' + endDate);
}
-export { getCalculateLive }
+async function getCalculateContent(startDate, endDate) {
+ return Vue.axios.get('/admin/calculate/content-list?startDateStr=' + startDate + '&endDateStr=' + endDate);
+}
+
+export { getCalculateLive, getCalculateContent }
diff --git a/src/views/Calculate/CalculateContent.vue b/src/views/Calculate/CalculateContent.vue
index c88b37d..701031e 100644
--- a/src/views/Calculate/CalculateContent.vue
+++ b/src/views/Calculate/CalculateContent.vue
@@ -1,7 +1,261 @@
<template>
- <div>콘텐츠 정산</div>
+ <div>
+ <v-toolbar dark>
+ <v-spacer />
+ <v-toolbar-title>콘텐츠 정산</v-toolbar-title>
+ <v-spacer />
+ </v-toolbar>
+
+ <br>
+
+ <v-container>
+ <v-row>
+ <v-col cols="2">
+ <datetime
+ v-model="start_date"
+ class="datepicker"
+ format="YYYY-MM-DD"
+ />
+ </v-col>
+
+ <v-col cols="1">
+ ~
+ </v-col>
+
+ <v-col cols="2">
+ <datetime
+ v-model="end_date"
+ class="datepicker"
+ format="YYYY-MM-DD"
+ />
+ </v-col>
+
+ <v-col cols="1" />
+
+ <v-col cols="2">
+ <v-btn
+ block
+ color="#9970ff"
+ dark
+ depressed
+ @click="getCalculateContent"
+ >
+ 조회
+ </v-btn>
+ </v-col>
+ </v-row>
+ <v-row>
+ <v-col>
+ <v-data-table
+ :headers="headers"
+ :items="items"
+ :loading="is_loading"
+ :items-per-page="-1"
+ class="elevation-1"
+ hide-default-footer
+ >
+ <template slot="body.prepend">
+ <tr>
+ <td colspan="5">
+ 합계
+ </td>
+ <td>{{ sumField('orderPrice').toLocaleString() }} 캔</td>
+ <td>{{ sumField('numberOfPeople').toLocaleString() }}</td>
+ <td>{{ sumField('totalCan').toLocaleString() }} 캔</td>
+ <td>{{ sumField('totalKrw').toLocaleString() }} 원</td>
+ <td>{{ sumField('paymentFee').toLocaleString() }} 원</td>
+ <td>{{ sumField('settlementAmount').toLocaleString() }} 원</td>
+ <td>{{ sumField('tax').toLocaleString() }} 원</td>
+ <td>{{ sumField('depositAmount').toLocaleString() }} 원</td>
+ </tr>
+ </template>
+
+ <template v-slot:item.orderPrice="{ item }">
+ {{ item.orderPrice.toLocaleString() }} 캔
+ </template>
+
+ <template v-slot:item.orderType="{ item }">
+ {{ item.orderType }}
+ </template>
+
+ <template v-slot:item.totalCan="{ item }">
+ {{ item.totalCan.toLocaleString() }} 캔
+ </template>
+
+ <template v-slot:item.totalKrw="{ item }">
+ {{ item.totalKrw.toLocaleString() }} 원
+ </template>
+
+ <template v-slot:item.paymentFee="{ item }">
+ {{ item.paymentFee.toLocaleString() }} 원
+ </template>
+
+ <template v-slot:item.settlementAmount="{ item }">
+ {{ item.settlementAmount.toLocaleString() }} 원
+ </template>
+
+ <template v-slot:item.tax="{ item }">
+ {{ item.tax.toLocaleString() }} 원
+ </template>
+
+ <template v-slot:item.depositAmount="{ item }">
+ {{ item.depositAmount.toLocaleString() }} 원
+ </template>
+ </v-data-table>
+ </v-col>
+ </v-row>
+ </v-container>
+ </div>
</template>
-<style scoped>
+<script>
+import * as api from "@/api/calculate";
+import datetime from 'vuejs-datetimepicker';
-</style>
+export default {
+ name: "CalculateLive",
+ components: {datetime},
+
+ data() {
+ return {
+ is_loading: false,
+ start_date: null,
+ end_date: null,
+ items: [],
+ headers: [
+ {
+ text: '크리에이터',
+ align: 'center',
+ sortable: false,
+ value: 'nickname',
+ },
+ {
+ text: '제목',
+ sortable: false,
+ value: 'title',
+ },
+ {
+ text: '등록일',
+ align: 'center',
+ sortable: false,
+ value: 'registrationDate',
+ },
+ {
+ text: '판매일',
+ align: 'center',
+ sortable: false,
+ value: 'saleDate',
+ },
+ {
+ text: '구분',
+ align: 'center',
+ sortable: false,
+ value: 'orderType',
+ },
+ {
+ text: '판매금액(캔)',
+ align: 'center',
+ sortable: false,
+ value: 'orderPrice',
+ },
+ {
+ text: '판매수',
+ align: 'center',
+ sortable: false,
+ value: 'numberOfPeople',
+ },
+ {
+ text: '합계(캔)',
+ align: 'center',
+ sortable: false,
+ value: 'totalCan',
+ },
+ {
+ text: '원화',
+ align: 'center',
+ sortable: false,
+ value: 'totalKrw',
+ },
+ {
+ text: '수수료\n(6.6%)',
+ align: 'center',
+ sortable: false,
+ value: 'paymentFee',
+ },
+ {
+ text: '정산금액',
+ align: 'center',
+ sortable: false,
+ value: 'settlementAmount',
+ },
+ {
+ text: '원천세\n(3.3%)',
+ align: 'center',
+ sortable: false,
+ value: 'tax',
+ },
+ {
+ text: '입금액',
+ align: 'center',
+ sortable: false,
+ value: 'depositAmount',
+ }
+ ],
+ }
+ },
+
+ async created() {
+ const date = new Date();
+ const firstDate = new Date(date.getFullYear(), date.getMonth(), 1);
+ const lastDate = new Date(date.getFullYear(), date.getMonth() + 1, 0);
+
+ let firstDateMonth = (firstDate.getMonth() + 1).toString()
+ if (firstDateMonth.length < 2) {
+ firstDateMonth = '0' + firstDateMonth
+ }
+
+
+ let lastDateMonth = (lastDate.getMonth() + 1).toString()
+ if (lastDateMonth.length < 2) {
+ lastDateMonth = '0' + lastDateMonth
+ }
+
+ this.start_date = firstDate.getFullYear() + '-' + firstDateMonth + '-0' + firstDate.getDate()
+ this.end_date = lastDate.getFullYear() + '-' + lastDateMonth + '-' + lastDate.getDate()
+
+ await this.getCalculateContent();
+ },
+
+ methods: {
+ notifyError(message) {
+ this.$dialog.notify.error(message)
+ },
+
+ notifySuccess(message) {
+ this.$dialog.notify.success(message)
+ },
+
+ sumField(key) {
+ return this.items.reduce((a, b) => a + (b[key] || 0), 0)
+ },
+
+ async getCalculateContent() {
+ this.is_loading = true
+
+ try {
+ const res = await api.getCalculateContent(this.start_date, this.end_date)
+ if (res.status === 200 && res.data.success === true) {
+ this.items = res.data.data
+ } else {
+ this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
+ }
+
+ this.is_loading = false
+ } catch (e) {
+ this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
+ this.is_loading = false
+ }
+ }
+ }
+}
+</script>