czg_team
/
cashier-web
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'gaohao' of https://e.coding.net/g-cphe0354/cashier/cashier-web

This commit is contained in:
GaoHao 2025-04-02 10:48:24 +08:00 committed by wwz
parent 1127d7503a e4d162194c
commit b109e474d3
1 changed files with 48 additions and 100 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

148
src/views/data/index.vue
View File

@ -48,11 +48,11 @@
<div class="h_card_wrap"> <div class="h_card_wrap">
<div class="status_wrap"> <div class="status_wrap">
<div class="left"> <div class="left">
<div class="dot"></div> <div class="dot" />
<span>营业</span> <span>营业</span>
</div> </div>
<div class="time_wrap u-flex"> <div class="time_wrap u-flex">
<el-radio-group class="m-r-5" v-model="timeValue" @change="timeChange"> <el-radio-group v-model="timeValue" class="m-r-5" @change="timeChange">
<el-radio-button value="0">今天</el-radio-button> <el-radio-button value="0">今天</el-radio-button>
<el-radio-button value="-1">昨天</el-radio-button> <el-radio-button value="-1">昨天</el-radio-button>
<el-radio-button value="-7">最近7天</el-radio-button> <el-radio-button value="-7">最近7天</el-radio-button>
@ -62,20 +62,12 @@
<el-radio-button value="custom">自定义</el-radio-button> <el-radio-button value="custom">自定义</el-radio-button>
</el-radio-group> </el-radio-group>
<div class="u-flex"> <div class="u-flex">
<el-date-picker <el-date-picker v-if="timeValue == 'custom'" v-model="query.createdAt" type="daterange" range-separator="至"
v-model="query.createdAt" start-placeholder="开始日期" end-placeholder="结束日期" value-format="YYYY-MM-DD " @change="summarytrade" />
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="YYYY-MM-DD "
v-if="timeValue == 'custom'"
@change="summarytrade"
></el-date-picker>
</div> </div>
</div> </div>
</div> </div>
<div class="content" v-loading="tradeLoading"> <div v-loading="tradeLoading" class="content">
<div class="top"> <div class="top">
<div class="item earnings"> <div class="item earnings">
<div class="num_wrap"> <div class="num_wrap">
@ -142,28 +134,20 @@
<!-- <div class="t">{{ formatDecimal(tradeSale.totalSaleAmount || 0) }}</div> --> <!-- <div class="t">{{ formatDecimal(tradeSale.totalSaleAmount || 0) }}</div> -->
</div> </div>
<div class="line_gropress"> <div class="line_gropress">
<div <div class="gropress l" :style="{
class="gropress l" width: `${trade.saleAmount
:style="{ ? (trade.saleAmount / (trade.saleAmount * 1 + trade.refundAmount * 1)) *
width: `${ 100
trade.saleAmount : 0
? (trade.saleAmount / (trade.saleAmount * 1 + trade.refundAmount * 1)) *
100
: 0
}%`, }%`,
}" }" />
></div> <div class="gropress r" :style="{
<div width: `${trade.refundAmount
class="gropress r" ? (trade.refundAmount / (trade.saleAmount * 1 + trade.refundAmount * 1)) *
:style="{ 100
width: `${ : 0
trade.refundAmount
? (trade.refundAmount / (trade.saleAmount * 1 + trade.refundAmount * 1)) *
100
: 0
}%`, }%`,
}" }" />
></div>
</div> </div>
<div class="line_btm"> <div class="line_btm">
<el-icon class="icon el-icon-caret-right" /> <el-icon class="icon el-icon-caret-right" />
@ -179,30 +163,22 @@
<!-- <div class="t">{{ formatDecimal(tradeSale.totalVipAmount || 0) }}</div> --> <!-- <div class="t">{{ formatDecimal(tradeSale.totalVipAmount || 0) }}</div> -->
</div> </div>
<div class="line_gropress"> <div class="line_gropress">
<div <div class="gropress l" :style="{
class="gropress l" width: `${trade.rechargeAmount
:style="{ ? (trade.rechargeAmount /
width: `${ (trade.memberPayAmount + trade.rechargeRefundAmount * 1)) *
trade.rechargeAmount 100
? (trade.rechargeAmount / : 0
(trade.memberPayAmount + trade.rechargeRefundAmount * 1)) *
100
: 0
}%`, }%`,
}" }" />
></div> <div class="gropress r" :style="{
<div width: `${trade.rechargeRefundAmount
class="gropress r" ? (trade.rechargeRefundAmount /
:style="{ (trade.memberPayAmount + trade.rechargeRefundAmount * 1)) *
width: `${ 100
trade.rechargeRefundAmount : 0
? (trade.rechargeRefundAmount /
(trade.memberPayAmount + trade.rechargeRefundAmount * 1)) *
100
: 0
}%`, }%`,
}" }" />
></div>
</div> </div>
<div class="line_btm"> <div class="line_btm">
<el-icon class="icon el-icon-caret-right" /> <el-icon class="icon el-icon-caret-right" />
@ -246,11 +222,7 @@
<div class="item item2"> <div class="item item2">
<div class="title"> <div class="title">
翻台率 翻台率
<el-tooltip <el-tooltip effect="dark" content="翻台率=（客单数-桌台数）/桌台数*100%" placement="top">
effect="dark"
content="翻台率=（客单数-桌台数）/桌台数*100%"
placement="top"
>
<el-icon> <el-icon>
<QuestionFilled /> <QuestionFilled />
</el-icon> </el-icon>
@ -283,18 +255,10 @@
<div class="item"> <div class="item">
<div class="header"> <div class="header">
<div class="tab_wrap"> <div class="tab_wrap">
<div <div class="item" :class="{ active: lineChartType == 0 }" @click="lineChartTypeChange(0)">
class="item"
:class="{ active: lineChartType == 0 }"
@click="lineChartTypeChange(0)"
>
销售趋势 销售趋势
</div> </div>
<div <div class="item" :class="{ active: lineChartType == 1 }" @click="lineChartTypeChange(1)">
class="item"
:class="{ active: lineChartType == 1 }"
@click="lineChartTypeChange(1)"
>
支付占比 支付占比
</div> </div>
</div> </div>
@ -303,20 +267,9 @@
<el-radio-button value="30">30天</el-radio-button> <el-radio-button value="30">30天</el-radio-button>
</el-radio-group> </el-radio-group>
</div> </div>
<div <div v-show="lineChartType == 0" ref="saleChart" v-loading="saleLoading" class="chart" style="height: 350px" />
class="chart" <div v-show="lineChartType == 1" ref="payChart" v-loading="payChartLoading" class="chart"
ref="saleChart" style="height: 350px" />
v-loading="saleLoading"
style="height: 350px"
v-show="lineChartType == 0"
></div>
<div
class="chart"
ref="payChart"
v-loading="payChartLoading"
style="height: 350px"
v-show="lineChartType == 1"
></div>
</div> </div>
<!-- 商品销售排行 --> <!-- 商品销售排行 -->
<div class="item" style="margin-left: 20px"> <div class="item" style="margin-left: 20px">
@ -347,23 +300,15 @@
</div> --> </div> -->
</div> </div>
<div class="table w-full"> <div class="table w-full">
<el-table :data="saleTable" v-loading="saleTableLoading" style="width: 100%"> <el-table v-loading="saleTableLoading" :data="saleTable" style="width: 100%">
<!-- <el-table-column label="排名" prop="productId"></el-table-column> --> <!-- <el-table-column label="排名" prop="productId"></el-table-column> -->
<el-table-column label="商品名称" prop="productName"></el-table-column> <el-table-column label="商品名称" prop="productName" />
<el-table-column label="数量" prop="number"></el-table-column> <el-table-column label="数量" prop="number" />
<el-table-column label="金额" prop="amount"></el-table-column> <el-table-column label="金额" prop="amount" />
</el-table> </el-table>
<div <div class="head-container" style="padding-top: 20px; display: flex; justify-content: flex-end">
class="head-container" <el-pagination :total="saleTableTotal" :page-size="saleTableSize" :current-page="saleTablePage"
style="padding-top: 20px; display: flex; justify-content: flex-end" layout="total, prev, pager, next, jumper" @current-change="paginationChange" />
>
<el-pagination
:total="saleTableTotal"
:page-size="saleTableSize"
:current-page="saleTablePage"
@current-change="paginationChange"
layout="total, prev, pager, next, jumper"
></el-pagination>
</div> </div>
</div> </div>
</div> </div>
@ -804,7 +749,10 @@ export default {
x: "center", x: "center",
}, },
tooltip: { tooltip: {
trigger: "axis", trigger: "item",
formatter: (params) => {
return `${params.value}`;
},
}, },
xAxis: [ xAxis: [
{ {