149 lines
3.2 KiB
Vue
149 lines
3.2 KiB
Vue
<template>
|
|
<div style="padding-top: 15vw">
|
|
<TopNav navTitle="指令统计" :showRight="false" :showLeft="true" />
|
|
<TopSelectTime @chenge:time="onSelectTime" />
|
|
<TopTotal :list="zlTotal.list" />
|
|
<!-- 任务完成情况 -->
|
|
<div class="item_box gsdyj_box">
|
|
<div class="other_type_title">完成率排名</div>
|
|
<TaskRank :timeType="timeType" />
|
|
</div>
|
|
<div class="item_box gsdyj_box">
|
|
<div class="other_type_title">指令趋势</div>
|
|
<WeekTrendBar :timeType="timeType" />
|
|
</div>
|
|
<div class="item_box gsdyj_box">
|
|
<div class="other_type_title">指令等级统计</div>
|
|
<WeekTrendPie :timeType="timeType" />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script setup>
|
|
import { ref, onMounted, reactive } from "vue";
|
|
import TopSelectTime from "../../../components/topSelectTime.vue";
|
|
import TopNav from "../../../components/topNav.vue";
|
|
import TopTotal from "../../../components/topTotal";
|
|
import TaskRank from "./components/taskRank";
|
|
import WeekTrendBar from "./components/weekTrendBar";
|
|
import WeekTrendPie from "./components/weekTrendPie";
|
|
import { getTjOfZllx } from "../../../api/zlzx.js";
|
|
import { Toast } from "vant";
|
|
const timeType = ref("1"); // 统计条件
|
|
const zlTotal = reactive({
|
|
list: [
|
|
{
|
|
title: "全部",
|
|
count: 0,
|
|
zllx: "",
|
|
},
|
|
{
|
|
title: "巡逻指令",
|
|
count: 0,
|
|
zllx: "01",
|
|
},
|
|
{
|
|
title: "感知预警指令",
|
|
count: 0,
|
|
zllx: "02",
|
|
},
|
|
{
|
|
title: "警情处置指令",
|
|
count: 0,
|
|
zllx: "05",
|
|
},
|
|
{
|
|
title: "人工指令",
|
|
count: 0,
|
|
zllx: "06",
|
|
},
|
|
{
|
|
title: "人员管控指令",
|
|
count: 0,
|
|
zllx: "07",
|
|
},
|
|
],
|
|
});
|
|
function onSelectTime(val) {
|
|
const copyTime = timeType.value;
|
|
timeType.value = val + 1 + "";
|
|
if (timeType.value !== copyTime) {
|
|
_getZlTotal();
|
|
}
|
|
}
|
|
onMounted(() => {
|
|
_getZlTotal();
|
|
});
|
|
//获取指令统计
|
|
function _getZlTotal() {
|
|
Toast.loading({
|
|
message: "加载中",
|
|
forbidClick: true,
|
|
loadingType: "spinner",
|
|
duration: 0,
|
|
});
|
|
zlTotal.list = [
|
|
{
|
|
title: "全部",
|
|
count: 0,
|
|
zllx: "",
|
|
},
|
|
{
|
|
title: "巡逻指令",
|
|
count: 0,
|
|
zllx: "01",
|
|
},
|
|
{
|
|
title: "感知预警指令",
|
|
count: 0,
|
|
zllx: "02",
|
|
},
|
|
{
|
|
title: "警情处置指令",
|
|
count: 0,
|
|
zllx: "05",
|
|
},
|
|
{
|
|
title: "人工指令",
|
|
count: 0,
|
|
zllx: "06",
|
|
},
|
|
{
|
|
title: "人员管控指令",
|
|
count: 0,
|
|
zllx: "07",
|
|
},
|
|
];
|
|
getTjOfZllx({ type: timeType.value }).then((res) => {
|
|
res.forEach((item) => {
|
|
zlTotal.list[0].count += item.count;
|
|
if (["02", "03", "04"].includes(item.zllx)) {
|
|
zlTotal.list[2].count += item.count;
|
|
} else {
|
|
zlTotal.list.forEach((el) => {
|
|
if (item.zllx == el.zllx) {
|
|
el.count = item.count;
|
|
}
|
|
});
|
|
}
|
|
});
|
|
Toast.clear();
|
|
});
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
@import "../../../assets/styles/mixin.scss";
|
|
|
|
.gsdyj_box {
|
|
margin: 2vw 3vw 5vw 3vw;
|
|
padding: 2vw;
|
|
}
|
|
|
|
.other_type_title {
|
|
margin-left: 2vw;
|
|
}
|
|
|
|
::v-deep .van-tabs__nav--card {
|
|
margin: 0 3vw;
|
|
}
|
|
</style>
|