|
|
|
|
@ -34,10 +34,7 @@
|
|
|
|
|
</datav-card> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="12"> |
|
|
|
|
<div class="datav-col"> |
|
|
|
|
<label for="">统计周期:</label> |
|
|
|
|
<span>2024年01月01日 - 2024年08月30日</span> |
|
|
|
|
</div> |
|
|
|
|
<datav-date-picker v-model="time" /> |
|
|
|
|
<div class="flex gap-42"> |
|
|
|
|
<datav-statistic |
|
|
|
|
:value="136" |
|
|
|
|
@ -50,17 +47,17 @@
|
|
|
|
|
style="width: 20%" |
|
|
|
|
/> |
|
|
|
|
<datav-statistic |
|
|
|
|
:value="89" |
|
|
|
|
:value="comfortPersonNumber" |
|
|
|
|
title="抚慰人数" |
|
|
|
|
style="width: 20%" |
|
|
|
|
/> |
|
|
|
|
<datav-statistic |
|
|
|
|
:value="167" |
|
|
|
|
:value="hitPersonNumber" |
|
|
|
|
title="打击处理人数" |
|
|
|
|
style="width: 20%" |
|
|
|
|
/> |
|
|
|
|
<datav-statistic |
|
|
|
|
:value="21.5" |
|
|
|
|
:value="comfortMoney" |
|
|
|
|
title=" 抚慰金额(万元)" |
|
|
|
|
style="width: 20%" |
|
|
|
|
/> |
|
|
|
|
@ -129,8 +126,36 @@
|
|
|
|
|
import vCharts from "vue-echarts"; |
|
|
|
|
import changshaMap from "@/assets/data/changsha.json"; |
|
|
|
|
import * as echarts from "echarts/core"; |
|
|
|
|
import {getRightsComfortData} from "@/api/datav"; |
|
|
|
|
import moment from "moment"; |
|
|
|
|
|
|
|
|
|
echarts.registerMap("changsha", changshaMap); |
|
|
|
|
const time = ref([ |
|
|
|
|
moment().startOf("year").format("YYYY-MM-DD"), |
|
|
|
|
moment().format("YYYY-MM-DD"), |
|
|
|
|
]); |
|
|
|
|
const comfortPersonNumber = ref(0); |
|
|
|
|
const hitPersonNumber = ref(0); |
|
|
|
|
const comfortMoney = ref(0.0); |
|
|
|
|
const punishmentSituationList = ref([]); |
|
|
|
|
const comfortSituationList = ref([]); |
|
|
|
|
|
|
|
|
|
function getData() { |
|
|
|
|
getRightsComfortData(time.value).then((data) => { |
|
|
|
|
console.log('Received data:', data); // 添加日志输出 |
|
|
|
|
comfortPersonNumber.value = data.comfortPersonNumber; |
|
|
|
|
hitPersonNumber.value = data.hitPersonNumber; |
|
|
|
|
comfortMoney.value = data.comfortMoney; |
|
|
|
|
punishmentSituationList.value = data.punishmentSituation; |
|
|
|
|
comfortSituationList.value = data.comfortSituation; |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
watch(time, () => { |
|
|
|
|
getData(); |
|
|
|
|
}) |
|
|
|
|
onMounted(() => { |
|
|
|
|
getData(); |
|
|
|
|
}); |
|
|
|
|
const option = { |
|
|
|
|
geo: { |
|
|
|
|
// 是上面注册时的名字哦,registerMap('名字保持一致') |
|
|
|
|
@ -317,7 +342,8 @@ const option2 = {
|
|
|
|
|
], |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
const option3 = { |
|
|
|
|
const option3 = computed(() => { |
|
|
|
|
return { |
|
|
|
|
series: [ |
|
|
|
|
{ |
|
|
|
|
type: "pie", |
|
|
|
|
@ -325,16 +351,14 @@ const option3 = {
|
|
|
|
|
label: { |
|
|
|
|
color: "#fff", |
|
|
|
|
}, |
|
|
|
|
data: [ |
|
|
|
|
{ value: 311, name: "刑事追究" }, |
|
|
|
|
{ value: 735, name: "其他处理" }, |
|
|
|
|
{ value: 580, name: "行政处理" } |
|
|
|
|
], |
|
|
|
|
data: punishmentSituationList.value, |
|
|
|
|
}, |
|
|
|
|
], |
|
|
|
|
}; |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
const option4 = { |
|
|
|
|
const option4 = computed(() => { |
|
|
|
|
return { |
|
|
|
|
series: [ |
|
|
|
|
{ |
|
|
|
|
type: "pie", |
|
|
|
|
@ -342,14 +366,11 @@ const option4 = {
|
|
|
|
|
label: { |
|
|
|
|
color: "#fff", |
|
|
|
|
}, |
|
|
|
|
data: [ |
|
|
|
|
{ value: 211, name: "民警" }, |
|
|
|
|
{ value: 655, name: "辅警" }, |
|
|
|
|
{ value: 666, name: "协警" } |
|
|
|
|
], |
|
|
|
|
data: comfortSituationList.value, |
|
|
|
|
}, |
|
|
|
|
], |
|
|
|
|
}; |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
const option6 = { |
|
|
|
|
series: [ |
|
|
|
|
|