Files
sgxt_web/src/views/home/model/dbCount.vue
2025-12-11 21:08:18 +08:00

92 lines
2.4 KiB
Vue

<template>
<div class="comom-title">
<span class="title">线索研判盯办统计</span>
<el-popover placement="right" :width="430" :visible="visible">
<template #reference>
<div class="title" style="position: relative;z-index: 10000;height: 40px;width: 40px;" @click="visible = true"></div>
</template>
<div>
<div class="qbltData">
<div>查询</div>
<div class="close" @click.stop="close()">X</div>
</div>
<TimeData v-if="visible" @changeTime="changeTime" />
</div>
</el-popover>
</div>
<ul class="comom-cnt xsBox flex flex-warp just-between align-center">
<li class="xs-item" v-for="(item, idx) in contentItem" :key="idx">
{{ item.label }}:{{ item.value }}
</li>
</ul>
</template>
<script setup>
import { ref, onMounted } from 'vue';
import TimeData from '@/views/home/model/mesgSwitch/timeData.vue'
import { qbcjDpxsCount } from "@/api/model.js"
const contentItem = ref([
{ label: '线索总数', value: '0' },
{ label: '下发总数', value: '0' },
{ label: '已处置总数', value: '0' },
{ label: '反馈总数', value: '0' },
{ label: '未反馈总数', value: '0' },
{ label: '未处置总数', value: '0' },
])
const visible = ref(false)
const changeTime = (val) => {
listQuery.value = {
...val
}
getCount()
}
onMounted(() => {
qbcjDpxsCount({}, '/mosty-gsxt/tbXs/getXsCount').then(res => {
res = res || {}
// 根据API返回的数据更新contentItem
contentItem.value = [
{ label: '线索总数', value: res.xszs || 0 },
{ label: '下发总数', value: res.xfzs || 0 },
{ label: '已处置总数', value: res.yczzs || 0 },
{ label: '反馈总数', value: res.fkzs || 0 },
{ label: '未反馈总数', value: res.wfkzs || 0 },
{ label: '未处置总数', value: res.wczzs || 0 },
]
})
})
const close = () => {
visible.value = false
}
</script>
<style lang="scss" scoped>
@import "@/assets/css/homeScreen.scss";
.xsBox {
background: url("~@/assets/images/bg_12.png") no-repeat center center;
background-size: 100% 100%;
.xs-item {
width: 31%;
height: 36px;
line-height: 36px;
text-align: center;
background: url("~@/assets/images/content-item.png") no-repeat center center;
background-size: 100% 100%;
}
}
.qbltData {
width: 100%;
display: flex;
justify-content: space-between;
padding: 0 10px 10px
}
.close {
cursor: pointer;
}
</style>