73 lines
2.1 KiB
Vue
73 lines
2.1 KiB
Vue
<template>
|
|
<div class="module">
|
|
<ModuleCard2 title="特殊信息类人员">
|
|
<div class="module-card2-container">
|
|
<div class="person-count1-container">
|
|
<PersonCount1 :value="totalCount" :key="keyCount"/>
|
|
</div>
|
|
<div class="person-count2-container">
|
|
<PersonCount2 class="count1" title="社区矫正" :value="sqjzCount" :key="keyCount" @click="onCount1Click(sqjzCount)"/>
|
|
<PersonCount2 class="count2" title="刑满释放" :value="xmsfCount" :bg-type="2" :key="keyCount" @click="onCount2Click(xmsfCount)"/>
|
|
</div>
|
|
</div>
|
|
</ModuleCard2>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, reactive, inject } from 'vue';
|
|
import ModuleCard2 from './card/ModuleCard2.vue';
|
|
import PersonCount1 from '../components/card/PersonCount1.vue';
|
|
import PersonCount2 from '../components/card/PersonCount2.vue';
|
|
|
|
const axios = inject('axios');
|
|
const keyCount = ref(0);
|
|
|
|
const totalCount = ref(0);
|
|
const sqjzCount = ref(0);
|
|
const xmsfCount = ref(0);
|
|
axios.get(`app/query/sqlrelease/qab48a3b`).then(res => {
|
|
let data = res.data;
|
|
totalCount.value = data[0].value + data[1].value;
|
|
sqjzCount.value = data[0].value;
|
|
xmsfCount.value = data[1].value;
|
|
keyCount.value++;
|
|
}).catch(err => {
|
|
console.error(err);
|
|
})
|
|
|
|
const onCount1Click = (count) => {
|
|
console.log(count)
|
|
}
|
|
|
|
const onCount2Click = (count) => {
|
|
console.log(count)
|
|
}
|
|
|
|
</script>
|
|
|
|
<style lang="stylus" scoped>
|
|
.module
|
|
.module-card2-container
|
|
display flex
|
|
height 100%
|
|
align-items center
|
|
.person-count1-container
|
|
width 160px
|
|
display flex
|
|
justify-content: center
|
|
.person-count2-container
|
|
width 200px
|
|
height 60px
|
|
position relative
|
|
.count1
|
|
cursor pointer
|
|
position absolute
|
|
top 0
|
|
left 0
|
|
.count2
|
|
cursor pointer
|
|
position absolute
|
|
top 0
|
|
left 110px
|
|
</style> |