|
@@ -56,9 +56,9 @@
|
|
<a-card class="panel " title="各回收物类型清运数据">
|
|
<a-card class="panel " title="各回收物类型清运数据">
|
|
<a-row :gutter="24">
|
|
<a-row :gutter="24">
|
|
<a-col :md="24" :lg="24">
|
|
<a-col :md="24" :lg="24">
|
|
- <div style="display: flex;align-items: center;">
|
|
|
|
|
|
+ <div style="display: flex;align-items: center;flex-wrap: wrap;">
|
|
<div v-for="(item, index) in qyTotalPieData" :key="index" class="module-list" :style="{ background: washTypePieColor[index] }">
|
|
<div v-for="(item, index) in qyTotalPieData" :key="index" class="module-list" :style="{ background: washTypePieColor[index] }">
|
|
- <p>{{ item.name }}</p>
|
|
|
|
|
|
+ <div>{{ item.name }}</div>
|
|
<span>{{ item.value }} kg</span>
|
|
<span>{{ item.value }} kg</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@@ -187,11 +187,12 @@ export default {
|
|
qyTotalPieData () {
|
|
qyTotalPieData () {
|
|
const list = this.totalGroupRubbiData ? this.totalGroupRubbiData.cleanReportData : []
|
|
const list = this.totalGroupRubbiData ? this.totalGroupRubbiData.cleanReportData : []
|
|
const temp = []
|
|
const temp = []
|
|
- if (list) {
|
|
|
|
- list.map(item => {
|
|
|
|
|
|
+ if (list.length) {
|
|
|
|
+ this.rubbishType.map(item => {
|
|
|
|
+ const has = list.find(obj => obj.rubbishType == item.code)
|
|
temp.push({
|
|
temp.push({
|
|
- name: item.rubbishTypeDictValue,
|
|
|
|
- value: Number(item.cleanWeight / 1000).toFixed(2)
|
|
|
|
|
|
+ name: item.dispName,
|
|
|
|
+ value: has ? Number(has.cleanWeight / 1000).toFixed(2) : 0
|
|
})
|
|
})
|
|
})
|
|
})
|
|
}
|
|
}
|
|
@@ -261,7 +262,7 @@ export default {
|
|
XdaysData: [], // 图表X轴时间集合
|
|
XdaysData: [], // 图表X轴时间集合
|
|
XdaysData1: [],
|
|
XdaysData1: [],
|
|
// 各类型占比
|
|
// 各类型占比
|
|
- washTypePieColor: ['#ffaa00', '#00aa00', '#00aaff', '#ff55ff', '#1dc5d4', '#8465c7', '#ff5500', '#527aff'],
|
|
|
|
|
|
+ washTypePieColor: ['#ffaa00', '#aaaa00', '#00aaff', '#ff55ff', '#1dc5d4', '#8465c7', '#ff5500', '#00aa00'],
|
|
couponColor: ['#ffaa00', '#ff5500', '#00aaff', '#ff55ff', '#1dc5d4', '#8465c7', '#55aa00', '#527aff'],
|
|
couponColor: ['#ffaa00', '#ff5500', '#00aaff', '#ff55ff', '#1dc5d4', '#8465c7', '#55aa00', '#527aff'],
|
|
// 清运量趋势
|
|
// 清运量趋势
|
|
clearnChartData: [
|
|
clearnChartData: [
|
|
@@ -277,7 +278,8 @@ export default {
|
|
}
|
|
}
|
|
],
|
|
],
|
|
hswTypeBarData: [],
|
|
hswTypeBarData: [],
|
|
- hswTypeLineData: []
|
|
|
|
|
|
+ hswTypeLineData: [],
|
|
|
|
+ rubbishType: []
|
|
}
|
|
}
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
@@ -302,6 +304,7 @@ export default {
|
|
lookupCode: 'RUBBISH_TYPE'
|
|
lookupCode: 'RUBBISH_TYPE'
|
|
}).then(res => {
|
|
}).then(res => {
|
|
const list = res.data.list
|
|
const list = res.data.list
|
|
|
|
+ _this.rubbishType = list
|
|
list.map(item => {
|
|
list.map(item => {
|
|
// 柱状图
|
|
// 柱状图
|
|
_this.hswTypeBarData.push({
|
|
_this.hswTypeBarData.push({
|
|
@@ -320,7 +323,7 @@ export default {
|
|
})
|
|
})
|
|
setTimeout(() => {
|
|
setTimeout(() => {
|
|
_this.getGroupDateAndRubbishType(params)
|
|
_this.getGroupDateAndRubbishType(params)
|
|
- }, 500)
|
|
|
|
|
|
+ }, 100)
|
|
})
|
|
})
|
|
},
|
|
},
|
|
// 查询网点列表
|
|
// 查询网点列表
|
|
@@ -568,13 +571,12 @@ export default {
|
|
|
|
|
|
.tab-card {
|
|
.tab-card {
|
|
float: right;
|
|
float: right;
|
|
-
|
|
|
|
|
|
+ margin: 30px 0;
|
|
.tab-card-item {
|
|
.tab-card-item {
|
|
padding: 5px 10px;
|
|
padding: 5px 10px;
|
|
border: 1px solid #eee;
|
|
border: 1px solid #eee;
|
|
cursor: pointer;
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
-
|
|
|
|
.checked-item {
|
|
.checked-item {
|
|
border-color: #2d8cf0;
|
|
border-color: #2d8cf0;
|
|
color: #2d8cf0;
|
|
color: #2d8cf0;
|
|
@@ -584,13 +586,13 @@ export default {
|
|
|
|
|
|
.module-list {
|
|
.module-list {
|
|
color: #ffffff;
|
|
color: #ffffff;
|
|
- height: 100px;
|
|
|
|
padding: 10px;
|
|
padding: 10px;
|
|
- border-radius: 15px;
|
|
|
|
|
|
+ border-radius: 10px;
|
|
display: flex;
|
|
display: flex;
|
|
align-items: center;
|
|
align-items: center;
|
|
flex-direction: column;
|
|
flex-direction: column;
|
|
margin: 5px;
|
|
margin: 5px;
|
|
|
|
+ min-width: 150px;
|
|
span {
|
|
span {
|
|
font-weight: 600;
|
|
font-weight: 600;
|
|
font-size: 20px;
|
|
font-size: 20px;
|