xjs
/
payment-statistics
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: 总缴费计算

master
xjs 2025-06-26 11:37:14 +08:00
parent 7dcd02966a
commit d881498d6e
1 changed files with 3 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/views/appComponents/appEchart/PaymentChart.vue
View File

@ -4,7 +4,7 @@
<ProportionCharts :chart-data="chartData" class="w-[31rem] h-[31rem]" :width="canvasWidth" :height="canvasWidth" /> <ProportionCharts :chart-data="chartData" class="w-[31rem] h-[31rem]" :width="canvasWidth" :height="canvasWidth" />
<div class="leading-[1] absolute top-[50%] left-[50%] translate-x-[-50%] translate-y-[-50%] z-3 flex items-center flex-col font-700 italic"> <div class="leading-[1] absolute top-[50%] left-[50%] translate-x-[-50%] translate-y-[-50%] z-3 flex items-center flex-col font-700 italic">
<div class="flex items-baseline"> <div class="flex items-baseline">
<div class="text-[4.5rem] text-color" :data-text="total">{{ total }}</div> <div class="text-[4.5rem] text-color" :data-text="paymentData.chargeTotal">{{ paymentData.chargeTotal }}</div>
<div class="text-[2.75rem] text-color" data-text="人">人</div> <div class="text-[2.75rem] text-color" data-text="人">人</div>
</div> </div>
</div> </div>
@ -28,11 +28,11 @@
const chartData = ref<any[]>([]); const chartData = ref<any[]>([]);
const paymentData = inject("paymentData", ref({ chargeTotal: 0, estimatedTotal: 0, items: [] })); const paymentData = inject("paymentData", ref({ chargeTotal: 0, estimatedTotal: 0, items: [] }));
const colors = ["#0783FA", "#07D1FA", "#20E6A4", "#FFD15C", "#9A68FF"]; const colors = ["#0783FA", "#07D1FA", "#20E6A4", "#FFD15C", "#9A68FF"];
const total = ref(0);
watchEffect(() => { watchEffect(() => {
if (paymentData.value.items) { if (paymentData.value.items) {
chartData.value = paymentData.value.items.map((item: any, index) => { chartData.value = paymentData.value.items.map((item: any, index) => {
total.value += item.value;
return { ...item, color: colors[index % colors.length] }; return { ...item, color: colors[index % colors.length] };
}); });
} }