feat: 增加列详情

This commit is contained in:
2025-12-15 21:54:51 +08:00
parent 68f8363a6b
commit ae4db70eed
2 changed files with 103 additions and 13 deletions

View File

@ -5,15 +5,15 @@
<!-- <el-button>
<span style="vertical-align: middle">导出</span>
</el-button> -->
<el-button type="success" @click="openSearch">
<el-button type="success" @click="openSearch">
<Search style="width: 1em; height: 1em; margin-right: 8px" />
<span style="vertical-align: middle" v-if="!search">搜索</span>
<span style="vertical-align: middle" v-else>关闭搜索</span>
<span style="vertical-align: middle" v-if="!search">搜索</span>
<span style="vertical-align: middle" v-else>关闭搜索</span>
</el-button>
</PageTitle>
</div>
<!-- 搜索 -->
<div ref="searchBox" v-if="search">
<div ref="searchBox" v-if="search">
<Searchs :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount">
<template #defaultSlot>
<el-select @change="gettbGsxtBqglSelectList" v-model="queryFrom.sfdl" placeholder="请选择身份类型"
@ -29,17 +29,22 @@
</Searchs>
</div>
<!-- 表格 -->
<div class="tabBox" :style="{height:(pageData.tableHeight + 40)+'px'}">
<div class="tabBox" :style="{ height: (pageData.tableHeight + 40) + 'px' }">
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth" expand>
<template #expand="{ props }">
<div class="expand-content" style="max-width: 100%">
<Items :row="props || {}" :dict="dict" />
</div>
</template>
<template #sfcs="{ row }">
<span style="color: #0072ff;" @click="handleClick(row)">{{ row.sfcs }}</span>
</template>
<template #bqys="{ row }">
<DictTag :value="row.bqys" :tag="false" :color="bqYs(row.bqys)" :options="D_GS_SSYJ" />
</template>
<template #czzt="{ row }">
<DictTag :value="row.czzt" :options="D_GSXT_YJXX_CZZT" />
<template #czzt="{ row }">
<DictTag :value="row.czzt" :options="D_GSXT_YJXX_CZZT" />
</template>
<template #controls="{ row }">
<el-link type="warning" @click="pushAssess(row)">全息档案</el-link>
@ -64,7 +69,7 @@
<SemdFqzl ref="semdFqzlRef" :itemData="itemData" @handleClose="handleClose" identification="yj"
:tacitly="tacitly" />
</Information>
<AddFrom ref="addModelRef" :dict="{D_GSXT_YJXX_CZZT, D_BZ_YJJB,D_GS_SSYJ}"/>
<AddFrom ref="addModelRef" :dict="{ D_GSXT_YJXX_CZZT, D_BZ_YJJB, D_GS_SSYJ }" />
</template>
<script setup>
@ -77,7 +82,7 @@ import Information from "@/views/home/model/information.vue";
import SemdFqzl from '@/components/instructionHasBeen/sendFqzl.vue'
import AddFrom from "./components/addFrom.vue";
import FkDialog from "@/views/backOfficeSystem/fourColorManage/warningControl/centerHome/components/fkDialog.vue";
import { reactive, ref, onMounted, getCurrentInstance,nextTick } from "vue";
import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue";
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
import { yjzxSfyjSelectList } from "@/api/yj.js";
import { tbGsxtBqglSelectList } from '@/api/zdr'
@ -85,10 +90,12 @@ import Detail from './components/detail.vue'
import { watch } from "vue";
import emitter from "@/utils/eventBus.js";
import { holographicProfileJump } from "@/utils/tools.js"
import Items from "./item/items.vue"
const { proxy } = getCurrentInstance();
const searchBox = ref();
const {D_GSXT_YJXX_CZZT,D_GS_SSYJ} = proxy.$dict("D_GSXT_YJXX_CZZT","D_GS_SSYJ")
const { D_GSXT_YJXX_CZZT, D_GS_SSYJ } = proxy.$dict("D_GSXT_YJXX_CZZT", "D_GS_SSYJ")
const dict = reactive({D_GSXT_YJXX_CZZT, D_GS_SSYJ})
// 搜索配置
const searchConfiger = ref([
{ label: "姓名", prop: 'xm', placeholder: "请输入姓名", showType: "input" },
@ -126,7 +133,7 @@ const pageData = reactive({
{ label: "预警时间", prop: "yjsj" },
{ label: "预警分值", prop: "sffz" },
{ label: "处置状态", prop: "czzt", showSolt: true },
{ label: "所属县局", prop: "ssbm" },
{ label: "所属县局", prop: "ssbm" },
]
});
@ -287,7 +294,7 @@ const tabHeightFn = () => {
} else {
pageData.tableHeight = window.innerHeight - 250;
}
window.onresize = function () {
window.onresize = function() {
tabHeightFn();
};
};

View File

@ -0,0 +1,83 @@
<template>
<div class="warning-item">
<div class="second-row">
<div class="info-item">预警人姓名<span>{{ row.xm }}</span></div>
<div class="info-item">身份证号<span>{{ row.sfzh }}</span></div>
<div class="info-item">电话<span>{{ row.dh }}</span></div>
</div>
<div class="second-row">
<div class="info-item">组合大类<span>{{ row.sfdlmc }}</span></div>
<div class="info-item">组合小类<span>{{ row.sfzlmc }}</span></div>
<div class="info-item">组合预警次数<span>{{ row.sfcs }}</span></div>
</div>
<div class="second-row">
<div class="info-item">
标签颜色
<DictTag v-model:value="row.bqys" :options="props.dict.D_GS_SSYJ" />
</div>
<div class="info-item">预警时间<span>{{ row.yjsj }}</span></div>
<div class="info-item">预警分值<span>{{ row.sffz }}</span></div>
</div>
<div class="second-row">
<div class="info-item">
处置状态
<DictTag v-model:value="row.czzt" :options="props.dict.D_GSXT_YJXX_CZZT" />
</div>
<div class="info-item">所属部门<span>{{ row.ssbm }}</span></div>
<div class="info-item">所属县局<span>{{ row.ssxgaj }}</span></div>
</div>
<div class="second-row">
<div class="info-item">所属市局<span>{{ row.sssgaj }}</span></div>
<div class="info-item">接警员姓名<span>{{ row.jjyxm }}</span></div>
</div>
</div>
</template>
<script setup>
import { ref, computed } from 'vue'
// import DictTag from '@/components/dictTag.vue'
const props = defineProps({
/** 表格行数据 */
row: {
type: Object,
default: () => ({})
},
dict: {
type: Object,
default: () => ({
D_GS_SSYJ: [],
D_GSXT_YJXX_CZZT: []
})
},
})
// console.log('row😃: ', props.row);
</script>
<style lang="scss" scoped>
.warning-item {
width: 100%;
padding: 15px;
border: 1px solid #e8e8e8;
border-radius: 8px;
background-color: #fafafa;
}
.second-row {
display: flex;
flex-wrap: wrap;
gap: 20px;
margin-bottom: 10px;
}
.info-item {
flex: 0 0 calc(33.33% - 20px);
box-sizing: border-box;
display: flex;
padding: 5px 0;
color: #333;
span {
font-weight: 500;
color: #606266;
}
}
</style>