|
|
@ -26,23 +26,30 @@ |
|
|
|
min-width="120" |
|
|
|
/> |
|
|
|
<el-table-column |
|
|
|
label="一级水闸" |
|
|
|
label="一类水闸" |
|
|
|
align="center" |
|
|
|
prop="one" |
|
|
|
min-width="120" |
|
|
|
/> |
|
|
|
<el-table-column |
|
|
|
label="二级水闸" |
|
|
|
label="二类水闸" |
|
|
|
align="center" |
|
|
|
prop="two" |
|
|
|
min-width="120" |
|
|
|
/> |
|
|
|
<el-table-column |
|
|
|
label="三级水闸" |
|
|
|
label="三类水闸" |
|
|
|
align="center" |
|
|
|
prop="three" |
|
|
|
min-width="120" |
|
|
|
/> |
|
|
|
|
|
|
|
<el-table-column |
|
|
|
label="四类水闸" |
|
|
|
align="center" |
|
|
|
prop="four" |
|
|
|
min-width="120" |
|
|
|
/> |
|
|
|
</el-table> |
|
|
|
</div> |
|
|
|
</template> |
|
|
@ -60,6 +67,7 @@ export default { |
|
|
|
value1: [], |
|
|
|
value2: [], |
|
|
|
value3: [], |
|
|
|
value4:[] |
|
|
|
}, |
|
|
|
}; |
|
|
|
}, |
|
|
@ -81,6 +89,7 @@ export default { |
|
|
|
this.barChartData.value1 = response.data?.map((res) => res.one); |
|
|
|
this.barChartData.value2 = response.data?.map((res) => res.two); |
|
|
|
this.barChartData.value3 = response.data?.map((res) => res.three); |
|
|
|
this.barChartData.value4 = response.data?.map((res) => res.four); |
|
|
|
this.loading = false; |
|
|
|
this.barInit(); |
|
|
|
}); |
|
|
@ -92,7 +101,7 @@ export default { |
|
|
|
title: { |
|
|
|
// text: "World Population", |
|
|
|
}, |
|
|
|
color: ["#38A0FF", "#4CCA73", "#FBD437"], |
|
|
|
color: ["#0f89ec", "#4CCA73", "#FBD437","#4E6B83FF"], |
|
|
|
tooltip: { |
|
|
|
trigger: "axis", |
|
|
|
axisPointer: { |
|
|
@ -150,23 +159,29 @@ export default { |
|
|
|
|
|
|
|
series: [ |
|
|
|
{ |
|
|
|
name: "一级水闸", |
|
|
|
name: "一类水闸", |
|
|
|
type: "bar", |
|
|
|
data: this.barChartData.value1, |
|
|
|
barMaxWidth: "10%", |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: "二级水闸", |
|
|
|
name: "二类水闸", |
|
|
|
type: "bar", |
|
|
|
data: this.barChartData.value2, |
|
|
|
barMaxWidth: "10%", |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: "三级水闸", |
|
|
|
name: "三类水闸", |
|
|
|
type: "bar", |
|
|
|
data: this.barChartData.value3, |
|
|
|
barMaxWidth: "10%", |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: "四类水闸", |
|
|
|
type: "bar", |
|
|
|
data: this.barChartData.value4, |
|
|
|
barMaxWidth: "10%", |
|
|
|
}, |
|
|
|
], |
|
|
|
}; |
|
|
|
|
|
|
|