更新

2025-07-03 21:32:25 +08:00
parent 8bb83821ea
commit 05a9a884e7
1 changed files with 104 additions and 221 deletions
--- a/src/views/backOfficeSystem/ExcavationResearch/WarningModel/index.vue
+++ b/src/views/backOfficeSystem/ExcavationResearch/WarningModel/index.vue
@ -1,173 +1,74 @@
 <template>
-  <div class="statistical-analysis">
-    <!-- 左侧树形菜单 -->
-    <div class="left-menu">
-      <!-- 这个部分用的是组件-后期替换 -->
-      <el-tree
-        :data="treeData"
-        :props="defaultProps"
-        @node-click="handleNodeClick"
-        default-expand-all
-      />
+  <div>
+    <div class="titleBox">
+      <PageTitle title="预警列表"></PageTitle>
    </div>
-
-    <!-- 右侧内容区 -->
-    <div class="right-content">
-      <Search :searchArr="searchConfiger" @submit="onSearch" @reset="onReset" :key="pageData.keyCount">
-        <template #defaultSlot>
-          <CheckBox :data="checkData" @changeData="changeData"></CheckBox>
+    <!-- 搜索 -->
+    <div ref="searchBox">
+      <Search :searchArr="searchConfiger" @submit="onSearch" />
+    </div>
+    <!-- 表格 -->
+    <div class="tabBox">
+      <MyTable
+        :tableData="pageData.tableData"
+        :tableColumn="pageData.tableColumn"
+        :tableHeight="pageData.tableHeight"
+        :key="pageData.keyCount"
+        :tableConfiger="pageData.tableConfiger"
+        :controlsWidth="pageData.controlsWidth"
+      >
+        <template #image="{ row }">
+          <img :src="row.image" alt="">
        </template>
-      </Search>
-      <div class="tableCnt  mb10 pl10 pr10">
-        <PageTitle title="发掘内容" style="color:#333">
-          <el-button type="primary" size="small" @click="addEdit('add', '')">
-            <el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
-            <span style="vertical-align: middle">新增</span>
-          </el-button>
-          <el-button type="primary" size="small" @click="importData">
-            <el-icon style="vertical-align: middle"><Upload /></el-icon>
-            <span style="vertical-align: middle">导入内容</span>
-          </el-button>
-          <el-button type="danger" size="small" @click="exportData">
-            <el-icon style="vertical-align: middle"><Delete /></el-icon>
-            <span style="vertical-align: middle">删除</span>
-          </el-button>
-        </PageTitle>
-        <div>
-          <MyTable
-            :tableData="pageData.tableData"
-            :tableColumn="pageData.tableColumn"
-            :tableHeight="pageData.tableHeight"
-            :key="pageData.keyCount"
-            :tableConfiger="pageData.tableConfiger"
-            :controlsWidth="pageData.controlsWidth"
-            @chooseData="chooseData">
-            <!-- 操作 -->
-            <template #controls="{ row }">
-              <el-link size="small" type="danger" @click="deleteRow(row)">删除</el-link>
-              <el-link size="small" type="primary" @click="viewDetails(row)">查看</el-link>
-            </template>
-          </MyTable>
-          <div class="ww100 flex just-center mt8"> <el-button type="primary">智能解析</el-button> </div>
-        </div>
-      </div>
-      <div class="tableCnt mb10 pl10 pr10">
-        <PageTitle title="模型智能识别/LP解析结果" style="color:#333;"></PageTitle>
-        <div ref="searchBox" class="mb8">
-          <el-button type="primary" size="small" @click="addEdit('add', '')">
-            <el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
-            <span style="vertical-align: middle">新增</span>
-          </el-button>
-          <el-button type="primary" size="small" @click="importData">
-            <el-icon style="vertical-align: middle"><Upload /></el-icon>
-            <span style="vertical-align: middle">一件布控</span>
-          </el-button>
-          <el-button type="primary" size="small" @click="importData">
-            <el-icon style="vertical-align: middle"><Upload /></el-icon>
-            <span style="vertical-align: middle">级别变更</span>
-          </el-button>
-          <el-button type="primary" size="small" @click="importData">
-            <el-icon style="vertical-align: middle"><Upload /></el-icon>
-            <span style="vertical-align: middle">警种变更</span>
-          </el-button>
-          <el-button type="primary" size="small" @click="importData">
-            <el-icon style="vertical-align: middle"><Upload /></el-icon>
-            <span style="vertical-align: middle">指定分配</span>
-          </el-button>
-          <el-button type="primary" size="small" @click="importData">
-            <el-icon style="vertical-align: middle"><Upload /></el-icon>
-            <span style="vertical-align: middle">添加标签</span>
-          </el-button>
-          <el-button type="primary" size="small" @click="importData">
-            <el-icon style="vertical-align: middle"><Upload /></el-icon>
-            <span style="vertical-align: middle">协控申请</span>
-          </el-button>
-          <el-button type="primary" size="small" @click="importData">
-            <el-icon style="vertical-align: middle"><Upload /></el-icon>
-            <span style="vertical-align: middle">撤控申请</span>
-          </el-button>
-          <el-button type="primary" size="small" @click="importData">
-            <el-icon style="vertical-align: middle"><Upload /></el-icon>
-            <span style="vertical-align: middle">移交管控</span>
-          </el-button>
-          <el-button type="primary" size="small" @click="importData">
-            <el-icon style="vertical-align: middle"><Upload /></el-icon>
-            <span style="vertical-align: middle">批量导入</span>
-          </el-button>
-          <el-button type="primary" size="small" @click="importData">
-            <el-icon style="vertical-align: middle"><Upload /></el-icon>
-            <span style="vertical-align: middle">导出</span>
-          </el-button>
-          <el-button type="danger" size="small" @click="exportData">
-            <el-icon style="vertical-align: middle"><Delete /></el-icon>
-            <span style="vertical-align: middle">批量删除</span>
-          </el-button>
-        </div>
-        <div>
-          <MyTable
-            :tableData="pageData.tableData2"
-            :tableColumn="pageData.tableColumn2"
-            :tableHeight="pageData.tableHeight2"
-            :key="pageData.keyCount"
-            :tableConfiger="pageData.tableConfiger2"
-            :controlsWidth="pageData.controlsWidth"
-            @chooseData="chooseData">
-            <!-- 操作 -->
-            <template #controls="{ row }">
-              <el-link size="small" type="danger" @click="deleteRow(row)">删除</el-link>
-              <el-link size="small" type="primary" @click="viewDetails(row)">查看</el-link>
-            </template>
-          </MyTable>
-          <Pages
-            @changeNo="changeNo"
-            @changeSize="changeSize"
-            :tableHeight="pageData.tableHeight2"
-            :pageConfiger="{
-              ...pageData.pageConfiger,
-              total: pageData.total
-            }"
-          ></Pages>
-        </div>
-      </div>
+        <template #controls="{ row }">
+          <el-button type="primary"  size="small" >详情</el-button >
+        </template>
+      </MyTable>
+      <Pages
+        @changeNo="changeNo"
+        @changeSize="changeSize"
+        :tableHeight="pageData.tableHeight"
+        :pageConfiger="{
+          ...pageData.pageConfiger,
+          total: pageData.total
+        }"
+      ></Pages>
    </div>
  </div>
 </template>

 <script setup>
-import CheckBox from "@/components/checkBox/index.vue";
+import { ElMessage } from "element-plus";
 import PageTitle from "@/components/aboutTable/PageTitle.vue";
 import MyTable from "@/components/aboutTable/MyTable.vue";
 import Pages from "@/components/aboutTable/Pages.vue";
 import Search from "@/components/aboutTable/Search.vue";
 import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
 import { reactive, ref, onMounted, getCurrentInstance } from "vue";
-import { Delete } from "@element-plus/icons";
-import { fa } from "element-plus/es/locale.mjs";
+
+const { proxy } = getCurrentInstance();
+
+const searchBox = ref(); //搜索框
+
 const searchConfiger = ref([
-  { label: "管辖部门", prop: 'department', placeholder: "请选择管辖部门", showType: "select" },
-  { label: "是否关注", prop: 'sfgz', showType: "defaultSlot" },
+  {
+    label: "所属部门",
+    prop: "department",
+    placeholder: "请选择所属部门",
+    showType: "department"
+  },
 ]);
-const checkData = reactive({
-  list: ["是", "否"],
-  hasChoose: ["是", "否"]
-});
-const searchBox = ref();
+
 const pageData = reactive({
-  tableData: [],
-  tableData2: [],
+  tableData: [
+    {image:'',yjnr:'xxxj街道抢劫xxx',hjdz:'sssss',jzdz:'22222'}
+  ],
  keyCount: 0,
  tableConfiger: {
    rowHieght: 61,
-    showSelectType: "checkBox",
+    showSelectType: "null",
    loading: false
  },
-  tableConfiger2: {
-    rowHieght: 61,
-    showSelectType: "checkBox",
-    loading: false,
-    showIndex:false
-  },
-  tableHeight:230,
  total: 0,
  pageConfiger: {
    pageSize: 20,
@ -175,98 +76,80 @@ const pageData = reactive({
  },
  controlsWidth: 120,
  tableColumn: [
-    { label: "身份标签", prop: "nrbh" },
-    { label: "行为标签", prop: "lx" },
-    { label: "轨迹", prop: "gj" },
-    { label: "风险等级", prop: "fxdj" },
-    { label: "定义积分", prop: "dyjf" },
-    { label: "处置措施", prop: "czcs" },
-  ],
-  tableColumn2: [
-    { label: "积分排名", prop: "nrbh" },
-    { label: "基础信息", prop: "lx" },
-    { label: "列控信息", prop: "nr" },
-    { label: "管控信息", prop: "nr" },
-    { label: "风险积分", prop: "nr" },
-    { label: "评分项", prop: "nr" },
-    { label: "布控原因", prop: "nr" },
-    { label: "是否关注", prop: "nr" },
-  ],
-})
+    { label: "预警图片", prop: "image" ,showSolt:true},
+    { label: "预警内容", prop: "yjnr" },
+    { label: "户籍地址", prop: "hjdz" },
+    { label: "居住地址", prop: "jzdz" },
+  ]
+});
+onMounted(() => {
+  getList();
+  tabHeightFn();
+});

-
-// 树形菜单数据
-const treeData = ref([
-  {
-    label: "林芝市公安局（200）",
-    children: [
-      { label: "工布江达县公安局（100）" },
-      { label: "工布江达城区派出所（10）" },
-      { label: "某某某派出所（10）" },
-      { label: "某某某公安局（100）" }
-    ]
-  }
-]);
-
-const defaultProps = {
-  children: "children",
-  label: "label"
+// 搜索
+const onSearch = (val) => {
+  queryFrom.value = { ...val };
+  pageData.pageConfiger.pageCurrent = 1;
+  getList();
 };

-
-// 事件处理函数
-const handleNodeClick = (data) => {
-  console.log(data);
+const changeNo = (val) => {
+  pageData.pageConfiger.pageNum = val;
+  getList();
 };

-const handleDateChange = () => {
-  // 处理日期变化
+const changeSize = (val) => {
+  pageData.pageConfiger.pageSize = val;
+  getList();
 };

-const handleExport = () => {
-  // 处理导出
+// 获取列表
+const getList = () => {
+ 
 };

+// 表格高度计算
 const tabHeightFn = () => {
-  pageData.tableHeight2 = window.innerHeight - searchBox.value.offsetHeight - 690;
+  pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
  window.onresize = function () {
    tabHeightFn();
  };
 };
-
-onMounted(() => {
-  tabHeightFn()
-});
 </script>

 <style lang="scss" scoped>
-.statistical-analysis {
-  width: 100%;
-  height: 100%;
-  .left-menu {
-    float: left;
-    width: 280px;
-    height: calc(100% - 20px);
-    padding: 20px;
-    margin-top: 20px;
+.checkbox-group {
+  display: flex;
+  gap: 20px;
+}
+
+.basic-info {
+  display: flex;
+  gap: 15px;
+
+  .avatar {
+    width: 80px;
+    height: 80px;
+    overflow: hidden;
    border-radius: 4px;
-    background-color: #fff;
-    border-right: 1px solid #e8e8e8;
-  }
-  .right-content {
-    float: left;
-    width: calc(100% - 290px);
-    height: 100%;
-    padding: 0 20px 0 ;
-    margin-top: 20px;
-    margin-left: 10px;
-    border-radius: 4px;
-    box-sizing: border-box;
-    .tableCnt{
-      height: calc((100vh - 253px)/2 );
-      background: #fff;
-      border-radius: 4px;
+
+    img {
+      width: 100%;
+      height: 100%;
+      object-fit: cover;
    }
  }
+
+  .info-list {
+    display: flex;
+    flex-direction: column;
+    gap: 5px;
+  }
+}
+
+.control-buttons {
+  display: flex;
+  gap: 10px;
 }
 </style>