fix: 日常支出统计,优化完善功能。
This commit is contained in:
@@ -55,7 +55,64 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="main-con" style="height: calc(100% - 1.45rem)">
|
<div class="main-con" style="height: calc(100% - 1.45rem)">
|
||||||
<div class="title-con" style="margin-top: 18px">
|
<div class="summary-con" style="height: 115px">
|
||||||
|
<div class="right-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">支出总额</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ account.dailyExpenses }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="right-con" v-show="account.top1Name != null">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">{{ account.top1Name }}</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ account.top1 }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="right-con" v-show="account.top2Name != null">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">{{ account.top2Name }}</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ account.top2 }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="right-con" v-show="account.top3Name != null">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">{{ account.top3Name }}</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ account.top3 }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="right-con" v-show="account.top4Name != null">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">{{ account.top4Name }}</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ account.top4 }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="title-con" style="margin-top: 15px">
|
||||||
<div class="title">日常支出统计</div>
|
<div class="title">日常支出统计</div>
|
||||||
<div class="operate-btn-con">
|
<div class="operate-btn-con">
|
||||||
<el-radio-group v-model="radioVal" @change="handleRadioChange">
|
<el-radio-group v-model="radioVal" @change="handleRadioChange">
|
||||||
@@ -66,7 +123,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="content-con">
|
<div class="content-con">
|
||||||
<el-table v-show="radioVal === '表格'" v-loading="loading" :data="account.accountsList" height="calc(100% - 45px)">
|
<el-table v-show="radioVal === '表格'" v-loading="loading" :data="account.accountsList" height="calc(100% - 170px)">
|
||||||
<el-table-column label="序号" width="50" type="index" align="center">
|
<el-table-column label="序号" width="50" type="index" align="center">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<span>{{ scope.$index + 1 }}</span>
|
<span>{{ scope.$index + 1 }}</span>
|
||||||
@@ -75,8 +132,8 @@
|
|||||||
<el-table-column label="交易子类别" align="center" prop="time" />
|
<el-table-column label="交易子类别" align="center" prop="time" />
|
||||||
<el-table-column label="支出金额" align="center" prop="value" />
|
<el-table-column label="支出金额" align="center" prop="value" />
|
||||||
</el-table>
|
</el-table>
|
||||||
<div v-show="radioVal === '柱状图'" class="chart" id="chartBar" style="height: calc(100% - 25px); margin-top: -10px"></div>
|
<div v-show="radioVal === '柱状图'" class="chart" id="chartBar" style="height: calc(100% - 170px); margin-top: -10px"></div>
|
||||||
<div v-show="radioVal === '折线图'" class="chart" id="chartLine" style="height: calc(100% - 25px); margin-top: -10px"></div>
|
<div v-show="radioVal === '折线图'" class="chart" id="chartLine" style="height: calc(100% - 170px); margin-top: -10px"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user