From ae4db70eeda65ef9eceefe92be0cd2a455e382d3 Mon Sep 17 00:00:00 2001
From: huangchengfa <171504222@qq.com>
Date: Mon, 15 Dec 2025 21:54:51 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=E5=88=97=E8=AF=A6?=
 =?UTF-8?q?=E6=83=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../warningControl/identityWarning/index.vue  | 33 +++++---
 .../identityWarning/item/items.vue            | 83 +++++++++++++++++++
 2 files changed, 103 insertions(+), 13 deletions(-)
 create mode 100644 src/views/backOfficeSystem/fourColorManage/warningControl/identityWarning/item/items.vue

diff --git a/src/views/backOfficeSystem/fourColorManage/warningControl/identityWarning/index.vue b/src/views/backOfficeSystem/fourColorManage/warningControl/identityWarning/index.vue
index 7206bdc..edf910c 100644
--- a/src/views/backOfficeSystem/fourColorManage/warningControl/identityWarning/index.vue
+++ b/src/views/backOfficeSystem/fourColorManage/warningControl/identityWarning/index.vue
@@ -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();
   };
 };
diff --git a/src/views/backOfficeSystem/fourColorManage/warningControl/identityWarning/item/items.vue b/src/views/backOfficeSystem/fourColorManage/warningControl/identityWarning/item/items.vue
new file mode 100644
index 0000000..dd729f2
--- /dev/null
+++ b/src/views/backOfficeSystem/fourColorManage/warningControl/identityWarning/item/items.vue
@@ -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>