Guoyan
/
new_huozhou_frontend
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

修复柱状图缺失总金额

master
zhouhaibin 4 months ago
parent
16a702439a
commit
fc696f8bf4
3 changed files with 184 additions and 123 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 45
      src/views/projectBoard/childBoard/bar.vue
  2. 4
      src/views/projectBoard/childBoard/gaiGeRenWu.vue
  3. 134
      src/views/projectBoard/childBoard/xingZhengQuHua.vue

45
src/views/projectBoard/childBoard/bar.vue
View File

@ -3,13 +3,13 @@
</template> </template>
<script lang="ts" name="PieChart" setup> <script lang="ts" name="PieChart" setup>
import { ref, reactive } from 'vue' import { ref, reactive } from 'vue';
let receivingParameter = defineProps(["title", "data"]) let receivingParameter = defineProps(['title', 'data']);
let option = reactive({}) let option = reactive({});
option = { option = {
title: { title: {
text: receivingParameter.title text: receivingParameter.title,
}, },
// tooltip: { // tooltip: {
// trigger: 'axis', // trigger: 'axis',
@ -23,7 +23,7 @@ option = {
left: '3%', left: '3%',
right: '4%', right: '4%',
bottom: '3%', bottom: '3%',
containLabel: true containLabel: true,
}, },
xAxis: { xAxis: {
type: 'value', type: 'value',
@ -31,14 +31,20 @@ option = {
max: 1, max: 1,
axisLabel: { axisLabel: {
formatter: function (value, index) { formatter: function (value, index) {
return (value*100) + "%"; return value * 100 + '%';
}
}
}, },
yAxis: { },
},
yAxis: [
{
type: 'category', type: 'category',
data: receivingParameter.data.names data: receivingParameter.data.names,
}, },
{
type: 'category',
data: receivingParameter.data.totalMoneys,
},
],
series: [ series: [
{ {
name: '上级资金支付执行率', name: '上级资金支付执行率',
@ -47,13 +53,13 @@ option = {
label: { label: {
show: true, show: true,
formatter: function (params) { formatter: function (params) {
return (params.value*100).toFixed(0) + "%"; return (params.value * 100).toFixed(0) + '%';
} },
}, },
emphasis: { emphasis: {
focus: 'series' focus: 'series',
}, },
data: receivingParameter.data.superiorFundExecutionRates data: receivingParameter.data.superiorFundExecutionRates,
}, },
{ {
name: '资金支付执行率', name: '资金支付执行率',
@ -62,17 +68,16 @@ option = {
label: { label: {
show: true, show: true,
formatter: function (params) { formatter: function (params) {
return (params.value*100).toFixed() + "%"; return (params.value * 100).toFixed() + '%';
} },
}, },
emphasis: { emphasis: {
focus: 'series' focus: 'series',
}, },
data: receivingParameter.data.paymentExecutionRates data: receivingParameter.data.paymentExecutionRates,
}, },
] ],
}; };
</script> </script>
<style></style> <style></style>

4
src/views/projectBoard/childBoard/gaiGeRenWu.vue
View File

@ -190,7 +190,8 @@ export default {
barData: { barData: {
names:[], names:[],
paymentExecutionRates:[], paymentExecutionRates:[],
superiorFundExecutionRates:[] superiorFundExecutionRates:[],
totalMoneys:[],
} }
}; };
}, },
@ -204,6 +205,7 @@ export default {
this.barData.names.push(item.name) this.barData.names.push(item.name)
this.barData.paymentExecutionRates.push(item.paymentExecutionRate) this.barData.paymentExecutionRates.push(item.paymentExecutionRate)
this.barData.superiorFundExecutionRates.push(item.superiorFundExecutionRate) this.barData.superiorFundExecutionRates.push(item.superiorFundExecutionRate)
this.barData.totalMoneys.push(item.totalMoney)
}) })
}, },
methods: {}, methods: {},

134
src/views/projectBoard/childBoard/xingZhengQuHua.vue
View File

@ -5,14 +5,20 @@
<a-card title="项目总进度" :body-style="{ padding: 0, overflow: 'hidden' }"> <a-card title="项目总进度" :body-style="{ padding: 0, overflow: 'hidden' }">
<a-row> <a-row>
<a-col :span="12" class="flex justify-center items-center h-58"> <a-col :span="12" class="flex justify-center items-center h-58">
<el-progress type="dashboard" :stroke-width="18" :percentage="Number(data.totalProgress.progress)*100>0?Number(data.totalProgress.progress)*100:0" :width="200"> <el-progress
type="dashboard"
:stroke-width="18"
:percentage="
Number(data.totalProgress.progress) * 100 > 0
? Number(data.totalProgress.progress) * 100
: 0
"
:width="200"
>
<template #default="{ percentage }"> <template #default="{ percentage }">
<div class="flex flex-col ..."> <div class="flex flex-col ...">
<div>总进度</div> <div>总进度</div>
<div class="mt-4 text-sky-400"> {{ percentage }}%</div> <div class="mt-4 text-sky-400"> {{ percentage }}%</div>
</div> </div>
</template> </template>
</el-progress> </el-progress>
@ -55,13 +61,21 @@
</a-col> </a-col>
</a-row> </a-row>
</a-card> </a-card>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
<a-card title="资金支付情况" :body-style="{ padding: 0, overflow: 'hidden' }"> <a-card title="资金支付情况" :body-style="{ padding: 0, overflow: 'hidden' }">
<a-row> <a-row>
<a-col :span="8" class="flex justify-center items-center h-58"> <a-col :span="8" class="flex justify-center items-center h-58">
<el-progress type="dashboard" :stroke-width="18" :percentage="Number(data.countFundByFundType.paymentExecutionRate)*100>0?Number(data.countFundByFundType.paymentExecutionRate)*100:0" :width="200"> <el-progress
type="dashboard"
:stroke-width="18"
:percentage="
Number(data.countFundByFundType.paymentExecutionRate) * 100 > 0
? Number(data.countFundByFundType.paymentExecutionRate) * 100
: 0
"
:width="200"
>
<template #default="{ percentage }"> <template #default="{ percentage }">
<div class="flex flex-col ..."> <div class="flex flex-col ...">
<div>合同总金额</div> <div>合同总金额</div>
@ -76,8 +90,17 @@
<div> <div>
<div class="flex flex-wrap"> <div class="flex flex-wrap">
<div class="mr-2">中央资金</div> <div class="mr-2">中央资金</div>
<div class="mr-2"><el-progress class="w-80" :text-inside="true" :stroke-width="18" <div class="mr-2"
:percentage="Number(data.countFundByFundType.payCentralExecutionRate)*100>0?Number(data.countFundByFundType.payCentralExecutionRate)*100:0" /> ><el-progress
class="w-80"
:text-inside="true"
:stroke-width="18"
:percentage="
Number(data.countFundByFundType.payCentralExecutionRate) * 100 > 0
? Number(data.countFundByFundType.payCentralExecutionRate) * 100
: 0
"
/>
</div> </div>
<div>{{ data.countFundByFundType.totalCentral }}</div> <div>{{ data.countFundByFundType.totalCentral }}</div>
</div> </div>
@ -85,8 +108,17 @@
<div class="mt-4"> <div class="mt-4">
<div class="flex flex-wrap"> <div class="flex flex-wrap">
<div class="mr-2">省级资金</div> <div class="mr-2">省级资金</div>
<div class="mr-2"><el-progress class="w-80" :text-inside="true" :stroke-width="18" <div class="mr-2"
:percentage="Number(data.countFundByFundType.payProvincialExecutionRate)*100>0?Number(data.countFundByFundType.payProvincialExecutionRate)*100:0" /> ><el-progress
class="w-80"
:text-inside="true"
:stroke-width="18"
:percentage="
Number(data.countFundByFundType.payProvincialExecutionRate) * 100 > 0
? Number(data.countFundByFundType.payProvincialExecutionRate) * 100
: 0
"
/>
</div> </div>
<div>{{ data.countFundByFundType.totalProvincial }}</div> <div>{{ data.countFundByFundType.totalProvincial }}</div>
</div> </div>
@ -94,8 +126,17 @@
<div class="mt-4"> <div class="mt-4">
<div class="flex flex-wrap"> <div class="flex flex-wrap">
<div class="mr-2">市级资金</div> <div class="mr-2">市级资金</div>
<div class="mr-2"><el-progress class="w-80" :text-inside="true" :stroke-width="18" <div class="mr-2"
:percentage="Number(data.countFundByFundType.payCityExecutionRate)*100>0?Number(data.countFundByFundType.payCityExecutionRate)*100:0" /> ><el-progress
class="w-80"
:text-inside="true"
:stroke-width="18"
:percentage="
Number(data.countFundByFundType.payCityExecutionRate) * 100 > 0
? Number(data.countFundByFundType.payCityExecutionRate) * 100
: 0
"
/>
</div> </div>
<div>{{ data.countFundByFundType.totalCity }}</div> <div>{{ data.countFundByFundType.totalCity }}</div>
</div> </div>
@ -103,16 +144,34 @@
<div class="mt-4"> <div class="mt-4">
<div class="flex flex-wrap"> <div class="flex flex-wrap">
<div class="mr-2">区县资金</div> <div class="mr-2">区县资金</div>
<div class="mr-2"><el-progress class="w-80" :text-inside="true" :stroke-width="18" <div class="mr-2"
:percentage="Number(data.countFundByFundType.payCountyExecutionRate)*100>0?Number(data.countFundByFundType.payCountyExecutionRate)*100:0" /> ><el-progress
class="w-80"
:text-inside="true"
:stroke-width="18"
:percentage="
Number(data.countFundByFundType.payCountyExecutionRate) * 100 > 0
? Number(data.countFundByFundType.payCountyExecutionRate) * 100
: 0
"
/>
</div> </div>
<div>{{ data.countFundByFundType.totalCounty }}</div> <div>{{ data.countFundByFundType.totalCounty }}</div>
</div> </div>
<div class="mt-4"> <div class="mt-4">
<div class="flex flex-wrap"> <div class="flex flex-wrap">
<div class="mr-2">自筹资金</div> <div class="mr-2">自筹资金</div>
<div class="mr-2"><el-progress class="w-80" :text-inside="true" :stroke-width="18" <div class="mr-2"
:percentage="Number(data.countFundByFundType.paySelfExecutionRate)*100>0?Number(data.countFundByFundType.paySelfExecutionRate)*100:0" /> ><el-progress
class="w-80"
:text-inside="true"
:stroke-width="18"
:percentage="
Number(data.countFundByFundType.paySelfExecutionRate) * 100 > 0
? Number(data.countFundByFundType.paySelfExecutionRate) * 100
: 0
"
/>
</div> </div>
<div>{{ data.countFundByFundType.totalSelf }}</div> <div>{{ data.countFundByFundType.totalSelf }}</div>
</div> </div>
@ -120,17 +179,14 @@
</div> </div>
</div> </div>
</a-col> </a-col>
</a-row> </a-row>
</a-card> </a-card>
</a-col> </a-col>
</a-row> </a-row>
<a-row :gutter="16" class="mt-4"> <a-row :gutter="16" class="mt-4">
<a-col :span="12"> <a-col :span="12">
<a-card :body-style="{ padding: 0, overflow: 'hidden' }" class="h-104"> <a-card :body-style="{ padding: 0, overflow: 'hidden' }" class="h-104">
<bas_bar title="总进度" :data="bas_barData" /> <bas_bar title="总进度" :data="bas_barData" />
</a-card> </a-card>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
@ -142,9 +198,9 @@
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import bas_bar from './bas_bar.vue' import bas_bar from './bas_bar.vue';
import bar from './bar.vue' import bar from './bar.vue';
import { showCountBoardByAdminDivision} from './childBoard.api' import { showCountBoardByAdminDivision } from './childBoard.api';
export default { export default {
components: { components: {
bas_bar, bas_bar,
@ -183,35 +239,33 @@ export default {
paySelfExecutionRate: '0.00', paySelfExecutionRate: '0.00',
}, },
countFundByCondition: [], countFundByCondition: [],
progress:[] progress: [],
}, },
bas_barData: { bas_barData: {
names: [], names: [],
values:[] values: [],
}, },
barData: { barData: {
names: [], names: [],
paymentExecutionRates: [], paymentExecutionRates: [],
superiorFundExecutionRates:[] superiorFundExecutionRates: [],
} totalMoneys: [],
},
}; };
}, },
async created() { async created() {
this.data = await showCountBoardByAdminDivision() this.data = await showCountBoardByAdminDivision();
this.data.progress.forEach(item => { this.data.progress.forEach((item) => {
this.bas_barData.names.push(item.name) this.bas_barData.names.push(item.name);
this.bas_barData.values.push(item.projectProgress) this.bas_barData.values.push(item.projectProgress);
}) });
this.data.countFundByCondition.forEach(item => { this.data.countFundByCondition.forEach((item) => {
this.barData.names.push(item.name) this.barData.names.push(item.name);
this.barData.paymentExecutionRates.push(item.paymentExecutionRate) this.barData.paymentExecutionRates.push(item.paymentExecutionRate);
this.barData.superiorFundExecutionRates.push(item.superiorFundExecutionRate) this.barData.superiorFundExecutionRates.push(item.superiorFundExecutionRate);
}) this.barData.totalMoneys.push(item.totalMoney);
});
}, },
methods: {}, methods: {},
}; };
</script> </script>

Write Preview
Loading…
Cancel
Save