更新

2025-09-03 18:12:19 +08:00
parent 24c6a24a4f
commit 3c59cc6111
7 changed files with 748 additions and 705 deletions
--- a/src/views/backOfficeSystem/JudgmentHome/tsypHome/components/yjDetail.vue
+++ b/src/views/backOfficeSystem/JudgmentHome/tsypHome/components/yjDetail.vue
@ -0,0 +1,128 @@
+<template>
+    <div>
+        <div class="titleBox">
+            <PageTitle title="查看详情">
+                <el-button size="small" @click="goback">返回</el-button>
+            </PageTitle>
+        </div>
+        <!-- 搜索 -->
+        <div ref="searchBox">
+            <Search :searchArr="searchConfiger" @submit="onSearch"></Search>
+        </div>
+        <!-- 表格 -->
+        <div class="tabBox">
+            <MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight" :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
+                <template #jqlbdm="{ row }">
+                    <DictTag :tag="false" :value="row.jqlbdm" :options="JQLB" />
+                </template>
+                <template #controls="{ row }">
+                    <el-link type="primary" @click="addEdit( row)">详情</el-link>
+                </template>
+            </MyTable>
+            <Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{ ...pageData.pageConfiger, total: pageData.total }"></Pages>
+        </div>
+    </div>
+    <Particulars ref="particulars" />
+</template>
+
+<script setup>
+import Particulars from "./particulars.vue";
+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 { qcckPost } from "@/api/qcckApi.js";
+import { reactive, ref, onMounted, defineEmits,getCurrentInstance } from "vue";
+const { proxy } = getCurrentInstance();
+const { JQLB } = proxy.$dict( "JQLB" ); //获取字典数据
+const emit = defineEmits(['change']);
+const particulars = ref()
+const searchBox = ref(); //搜索框
+const searchConfiger = ref([
+    { label: "研判名称", prop: 'ypmc', placeholder: "请输入研判名称", showType: "input" },
+]);
+const queryFrom = ref({});
+const pageData = reactive({
+    tableData: [], //表格数据
+    keyCount: 0,
+    tableConfiger: {
+        rowHieght: 61,
+        showSelectType: "null",
+        loading: false
+    },
+    total: 0,
+    pageConfiger: {
+        pageSize: 20,
+        pageCurrent: 1
+    }, //分页
+    controlsWidth: 160, //操作栏宽度
+    tableColumn: [
+        { label: "研判名称", prop: "ypmc" },
+        { label: "报警时间", prop: "bjsj" },
+        { label: "报警地址", prop: "bjdz" },
+        { label: "警情类型", prop: "jqlbdm",showSolt:true },
+        { label: "报警内容", prop: "bjnr", showOverflowTooltip: true },
+        { label: "报警电话", prop: "bjdh" },
+        { label: "报警时间", prop: "bjsj" },
+    ]
+});
+onMounted(() => {
+    tabHeightFn();
+    getList();
+});
+
+// 搜索
+const onSearch = (val) => {
+    queryFrom.value = { ...queryFrom.value,...val };
+    pageData.pageConfiger.pageCurrent = 1;
+    getList();
+};
+
+const changeNo = (val) => {
+    pageData.pageConfiger.pageCurrent = val;
+    getList();
+};
+const changeSize = (val) => {
+    pageData.pageConfiger.pageSize = val;
+    getList();
+};
+
+const getList = () => {
+    pageData.tableConfiger.loading = true;
+    let data = {
+        ...queryFrom.value,
+        pageCurrent: pageData.pageConfiger.pageCurrent,
+        pageSize: pageData.pageConfiger.pageSize
+    }
+    qcckPost(data, '/mosty-gsxt/jjdbYp/getPageList').then(res => {
+        pageData.tableData = res.records;
+        pageData.total = res.total;
+        pageData.tableConfiger.loading = false;
+    }).catch(() => {
+        pageData.tableConfiger.loading = false;
+    });
+};
+
+
+const addEdit = (row) => {
+  particulars.value.init(row)
+}
+
+const goback = () => {
+    emit('change', { type: '态势预警列表', data: null })
+}
+
+// 表格高度计算
+const tabHeightFn = () => {
+    pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
+    window.onresize = function () {
+        tabHeightFn();
+    };
+};
+</script>
+
+<style>
+.el-loading-mask {
+    background: rgba(0, 0, 0, 0.5) !important;
+}
+</style>