121 lines
2.9 KiB
Vue
121 lines
2.9 KiB
Vue
<template>
|
|
<div class="comom-title">
|
|
<span class="title">态势研判预警</span>
|
|
</div>
|
|
<div class="comom-cnt zdryBox">
|
|
<ul class="ryBox" v-loading="loading" v-infinite-scroll="loadList" style="overflow: auto">
|
|
<li v-for="item in personList" :key="item.id" @click="onClickPush(item)">
|
|
<Assessment :item="item" :dict="{D_SG_TSYPGZ}" :lx="1"/>
|
|
</li>
|
|
<MOSTY.Empty :show="!loading && personList.length <= 0" :imgSize="100"></MOSTY.Empty>
|
|
</ul>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import emitter from "@/utils/eventBus.js";
|
|
import { qcckPost } from "@/api/qcckApi.js";
|
|
import Assessment from "@/views/home/components/assessmentItem.vue";
|
|
import * as MOSTY from "@/components/MyComponents/index";
|
|
import CheckBox from "@/components/checkBox/index.vue";
|
|
import { ref, reactive, onMounted, getCurrentInstance } from 'vue';
|
|
import {useRouter} from 'vue-router'
|
|
const { proxy } = getCurrentInstance();
|
|
const {D_SG_TSYPGZ} =proxy.$dict('D_SG_TSYPGZ')
|
|
const router = useRouter()
|
|
const total = ref(0);
|
|
const pageNum = ref(1);
|
|
const loading = ref(false); // 加载中
|
|
const personList = ref([]);
|
|
onMounted(()=>{
|
|
getList()
|
|
})
|
|
|
|
|
|
// 触底加载
|
|
const loadList = () =>{
|
|
if( personList.value.length == total.value) return;
|
|
pageNum.value++;
|
|
getList()
|
|
}
|
|
|
|
const getList = () =>{
|
|
let data = { pageSize:10, pageCurrent:pageNum.value };
|
|
loading.value = true;
|
|
qcckPost(data,'/mosty-gsxt/tsyp/selectPage').then(res=>{
|
|
loading.value = false;
|
|
let arr = res.records || [];
|
|
personList.value = pageNum.value == 1 ? arr : personList.value.concat(arr);
|
|
total.value = res.total;
|
|
}).catch(()=>{
|
|
loading.value = false;
|
|
})
|
|
}
|
|
const onClickPush = (val) => {
|
|
router.push({ path: '/tsypHome', query: { id: val.id } })
|
|
}
|
|
|
|
</script>
|
|
|
|
<style>
|
|
.el-loading-mask{
|
|
background: rgba(0,0,0,0.5);
|
|
}
|
|
</style>
|
|
|
|
<style lang="scss" scoped>
|
|
@import "@/assets/css/homeScreen.scss";
|
|
.zdryBox{
|
|
background: #052249;
|
|
height: 100%;
|
|
.ryBox{
|
|
height: 100%;
|
|
overflow: hidden;
|
|
overflow-y: auto;
|
|
}
|
|
}
|
|
|
|
::-webkit-scrollbar {
|
|
background-color: #263b70;
|
|
}
|
|
::-webkit-scrollbar-thumb {
|
|
background-color: #146bbe;
|
|
}
|
|
::-webkit-scrollbar-track {
|
|
background-color: #263b70;
|
|
}
|
|
::-webkit-scrollbar-corner {
|
|
background-color: #142141;
|
|
}
|
|
|
|
::v-deep .el-checkbox__label{
|
|
color:#fff;
|
|
}
|
|
::v-deep .el-checkbox__input.is-checked+.el-checkbox__label{
|
|
color:#00FFFF;
|
|
}
|
|
::v-deep .el-checkbox__inner{
|
|
background:rgba(0,144,255,0.2);
|
|
border:1px solid #0072FF;
|
|
}
|
|
::v-deep .el-checkbox__input.is-checked .el-checkbox__inner{
|
|
background-color: #00FFFF;
|
|
border-color:#00FFFF;
|
|
}
|
|
::v-deep .el-checkbox__input.is-indeterminate .el-checkbox__inner{
|
|
background-color: #00FFFF;
|
|
border-color:#00FFFF;
|
|
}
|
|
::v-deep .el-checkbox__inner::after{
|
|
border:2px solid #000;
|
|
border-left:0;
|
|
border-top:0;
|
|
left:3px;
|
|
top:0px;
|
|
}
|
|
::v-deep .el-checkbox__input.is-indeterminate .el-checkbox__inner::before{
|
|
background: #000;
|
|
}
|
|
|
|
</style>
|