更新工作台页面,优化交易数据展示,修复核销订单金额等数据展示错误,并调整相关API接口路径
This commit is contained in:
parent
657021e15a
commit
69da1cb54f
|
@ -1,6 +1,6 @@
|
|||
NODE_ENV = 'development'
|
||||
|
||||
# Base API
|
||||
VITE_APP_BASE_URL='https://multi-store.lihaink.cn'
|
||||
# VITE_APP_BASE_URL='https://test-multi-store.lihaink.cn'
|
||||
# VITE_APP_BASE_URL='https://multi-store.lihaink.cn'
|
||||
VITE_APP_BASE_URL='https://test-multi-store.lihaink.cn'
|
||||
# VITE_APP_BASE_URL='https://ceshi-logistics.lihaink.cn/'
|
||||
|
|
|
@ -0,0 +1,151 @@
|
|||
<template>
|
||||
<el-card :key="date">
|
||||
<template #header>今日</template>
|
||||
<el-row>
|
||||
<el-col :span="6" class="flex" v-for="(item, index) in statisticLists" :key="index">
|
||||
<img class="w-[50px] h-[50px] mr-2" :src="item.src" />
|
||||
<div>
|
||||
<el-statistic :title="item.title" :value="item.value()" />
|
||||
<p style="font-size: 11px;color: #FBCE6B;" v-if="item.footer">{{ item.footer }}</p>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
<el-card :key="date">
|
||||
<template #header>累计</template>
|
||||
<el-row>
|
||||
<el-col :span="6" class='flex' v-for="(item, index) in statisticLists" :key="index">
|
||||
<img class="w-[50px] h-[50px] mr-2" :src="item.src" />
|
||||
<div>
|
||||
<el-statistic :title="item.title" :value="item.value()" />
|
||||
<p style="font-size: 11px;color: #FBCE6B;" v-if="item.footer">{{ item.footer }}</p>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
|
||||
<el-card :key="date">
|
||||
<template #header>
|
||||
营业趋势
|
||||
</template>
|
||||
<v-charts style="height: 350px" :option="visitorOption" :autoresize="true" />
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup name="manageProjectLists">
|
||||
import { ref, reactive } from "vue"
|
||||
// import { apiTradStatisApi } from '@/api/statistics'
|
||||
import vCharts from 'vue-echarts'
|
||||
|
||||
const date = ref([])
|
||||
const queryParams = reactive({
|
||||
start_time: "",
|
||||
end_time: "",
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
const formData = ref({
|
||||
order_amount: 0,
|
||||
verify_amount: 0,
|
||||
balance_amount: 0,
|
||||
income_amount: 0,
|
||||
cashier_amount: 0,
|
||||
})
|
||||
|
||||
|
||||
const statisticLists = reactive([
|
||||
{
|
||||
src: 'https://ceshi-engineering.lihaink.cn/uploads/files/20240604/20240604171701552002039.png',
|
||||
title: "营业额",
|
||||
value: () => {
|
||||
return String(formData.value.verify_amount)
|
||||
}
|
||||
},
|
||||
{
|
||||
src: "https://ceshi-engineering.lihaink.cn/uploads/files/20240604/2024060417170150a511510.png",
|
||||
title: "利润",
|
||||
value: () => {
|
||||
return String(formData.value.balance_amount)
|
||||
}
|
||||
},
|
||||
{
|
||||
src: 'https://ceshi-engineering.lihaink.cn/uploads/files/20240604/20240604171701594ff8897.png',
|
||||
title: "成本",
|
||||
value: () => {
|
||||
return String(formData.value.income_amount)
|
||||
}
|
||||
},
|
||||
{
|
||||
src: 'https://ceshi-engineering.lihaink.cn/uploads/files/20240604/202406041717018a22e1161.png',
|
||||
title: "保证金",
|
||||
value: () => {
|
||||
return String(formData.value.cashier_amount)
|
||||
},
|
||||
footer: "当保证金金额补缴齐后不再扣除"
|
||||
},
|
||||
|
||||
])
|
||||
|
||||
|
||||
const visitorOption = reactive({
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
series: [
|
||||
{
|
||||
data: [82, 92, 91, 94, 129, 133, 130],
|
||||
type: 'line',
|
||||
smooth: true,
|
||||
name: "营业额"
|
||||
},
|
||||
{
|
||||
data: [15, 12, 14, 78, 96, 54, 85],
|
||||
type: 'line',
|
||||
smooth: true,
|
||||
name: '利润'
|
||||
},
|
||||
{
|
||||
data: [36, 52, 94, 76, 85, 24, 35],
|
||||
type: 'line',
|
||||
smooth: true,
|
||||
name: '成本'
|
||||
},
|
||||
{
|
||||
data: [63, 25, 36, 64, 33, 24, 15],
|
||||
type: 'line',
|
||||
smooth: true,
|
||||
name: '保证金'
|
||||
}
|
||||
]
|
||||
})
|
||||
|
||||
|
||||
const getData = async () => {
|
||||
// let res = await apiTradStatisApi(queryParams)
|
||||
// formData.value = res
|
||||
// visitorOption.xAxis.data = res.statistics.range
|
||||
// visitorOption.series[0].data = res.statistics.data.order_amount
|
||||
// visitorOption.series[1].data = res.statistics.data.user_number
|
||||
// tradTypeOption.series[0].data = res.pay_type
|
||||
}
|
||||
|
||||
|
||||
const initPage = () => {
|
||||
getData()
|
||||
}
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
initPage()
|
||||
})
|
||||
|
||||
</script>
|
|
@ -1,6 +1,5 @@
|
|||
<template>
|
||||
<el-card>
|
||||
{{ formData.order_amount }}
|
||||
<el-form class="mb-[-16px]" :model="queryParams" label-width="80px">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="时间筛选">
|
||||
|
|
Loading…
Reference in New Issue