From f534392326efb914a8c73043babe40dd14069e15 Mon Sep 17 00:00:00 2001
From: sjh <shujiehao@foxmail.com>
Date: Mon, 18 Nov 2024 15:36:43 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E7=81=B5=E6=95=8F=E6=84=9F?=
 =?UTF-8?q?=E7=9F=A5=E5=A4=A7=E5=B1=8F-=E6=B0=91=E8=AD=A6=E6=A8=A1?=
 =?UTF-8?q?=E5=9D=97=E6=95=B0=E6=8D=AE=E5=8F=96=E5=80=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/sensitivePerception/RiskClueNew.vue | 270 ++++++++++++++++++
 1 file changed, 270 insertions(+)
 create mode 100644 src/views/sensitivePerception/RiskClueNew.vue

diff --git a/src/views/sensitivePerception/RiskClueNew.vue b/src/views/sensitivePerception/RiskClueNew.vue
new file mode 100644
index 0000000..048b921
--- /dev/null
+++ b/src/views/sensitivePerception/RiskClueNew.vue
@@ -0,0 +1,270 @@
+<template>
+    <div class="container h100">
+        <el-row :gutter="20" class="h100">
+            <el-col :span="6" class="h100">
+                <model-tree v-model="query.modelIds" />
+            </el-col>
+            <el-col :span="18">
+                <header>
+                    <el-form :label-width="140">
+                        <el-row>
+                            <el-col :span="8">
+                                <el-form-item label="预警时间">
+                                    <date-time-range-picker-ext
+                                        v-model="query.createTime"
+                                    />
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="涉及单位">
+                                    <depart-tree-select
+                                        v-model="query.involveDepartId"
+                                        :check-strictly="false"
+                                    />
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="预警内容">
+                                    <el-input
+                                        placeholder="请输入"
+                                        v-model="query.thingDesc"
+                                        clearable
+                                    />
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="分发状态">
+                                    <el-select
+                                        v-model="query.distributionState"
+                                        clearable
+                                    >
+                                        <el-option
+                                            v-for="item in dict.distributionState"
+                                            :label="item.dictLabel"
+                                            :value="item.dictValue"
+                                        />
+                                    </el-select>
+                                </el-form-item>
+                            </el-col>
+                        </el-row>
+                    </el-form>
+                    <div class="flex end mb-20">
+                        <div>
+                            <el-button type="primary" @click="getList">
+                                <template #icon>
+                                    <icon name="el-icon-Search" />
+                                </template>
+                                查询</el-button
+                            >
+                            <el-button @click="reset">重置</el-button>
+                        </div>
+                    </div>
+                </header>
+                <div class="table-container">
+                    <el-table :data="list">
+                        <el-table-column
+                            label="预警时间"
+                            prop="createTime"
+                            width="150"
+                        />
+<!--                        <el-table-column-->
+<!--                            label="预警模型"-->
+<!--                            prop="modelName"-->
+<!--                            width="160"-->
+<!--                            show-overflow-tooltip-->
+<!--                        />-->
+                      <el-table-column
+                          label="涉及单位"
+                          show-overflow-tooltip
+                          width="200"
+                      >
+                        <template #default="{ row }">
+                          <span>{{ row.involveParentDepartName }}</span><span v-if="row.involveDepartName"><br>{{ row.involveDepartName }}</span>
+                        </template>
+                      </el-table-column>
+                      <el-table-column
+                          label="涉及人员"
+                          prop="involvePoliceName"
+                          width="100"
+                      >
+                        <template #default="{ row }">
+                          <div v-if="row.involvePoliceName">
+                            <div v-for="item in row.involvePoliceName.split(' ')" class="text-nowrap">{{
+                                item }}</div>
+                          </div>
+                          <div v-else>略</div>
+                        </template>
+                      </el-table-column>
+                        <el-table-column
+                            label="预警内容"
+                            prop="thingDesc"
+                            show-overflow-tooltip
+                        />
+                        <el-table-column
+                            label="分发状态"
+                            align="center"
+                            width="120"
+                        >
+                            <template #default="{ row }">
+                                <span>{{
+                                    getDictLable(
+                                        dict.distributionState,
+                                        row.distributionState
+                                    )
+                                }}</span>
+                            </template>
+                        </el-table-column>
+                        <el-table-column label="操作" width="180">
+                            <template #default="{ row }">
+                                <el-button
+                                    type="primary"
+                                    link
+                                    @click="handleShowDetail(row)"
+                                    >查看详情</el-button
+                                >
+                                <el-button
+                                    v-if="row.negativeId"
+                                    type="primary"
+                                    link
+                                    @click="handleAction(row)"
+                                    >处理详情</el-button
+                                >
+                            </template>
+                        </el-table-column>
+                    </el-table>
+                </div>
+                <div class="flex end mt-8">
+                    <el-pagination
+                        @size-change="getList"
+                        @current-change="getList"
+                        :current-page="query.current"
+                        :page-sizes="[9, 18, 36]"
+                        v-model:page-size="query.size"
+                        v-model:current-page="query.current"
+                        layout="total, sizes, prev, pager, next"
+                        :total="total"
+                        v-if="list.length"
+                    >
+                    </el-pagination>
+                </div>
+            </el-col>
+        </el-row>
+    </div>
+
+    <el-dialog title="预警线索数据详情" v-model="show" width="80vw">
+        <div class="dialog-container">
+            <div class="row mt-10">
+                <div class="col col-6">
+                    <label>预警时间</label>
+                    <span>{{ activeModelClue.createTime }}</span>
+                </div>
+                <div class="col col-6">
+                    <label>预警模型</label>
+                    <span>{{ activeModelClue.modelName }}</span>
+                </div>
+                <div class="col col-6">
+                    <label>涉及单位</label>
+                    <span>
+                        <span>{{ activeModelClue.involveParentDepartName }}</span><span>{{ activeModelClue.involveDepartName ? '/' + activeModelClue.involveDepartName : '' }}</span>
+                    </span>
+                </div>
+                <div class="col col-6">
+                    <label>涉及人员</label>
+                    <span>{{ activeModelClue.involvePoliceName }}</span>
+                </div>
+            </div>
+            <div class="row mt-10">
+                <div class="col col-24">
+                    <label>预警内容</label>
+                    <span>{{ activeModelClue.thingDesc }}</span>
+                </div>
+            </div>
+            <div class="row mt-10">
+                <div class="col col-6">
+                    <label>分发状态</label>
+                    <span>{{
+                        getDictLable(
+                            dict.distributionState,
+                            activeModelClue.distributionState
+                        )
+                    }}</span>
+                </div>
+            </div>
+            <h3>详细信息</h3>
+            <div style="min-height: 200px">
+                <el-empty description="无数据" />
+            </div>
+        </div>
+    </el-dialog>
+
+    <negative-dialog
+        v-model="negativeShow"
+        :id="activeNegativeId"
+        @close="negativeShow = false"
+    />
+</template>
+<script lang="ts" setup>
+import { listModelClue } from "@/api/sensitivePerception/modelClue";
+import useCatchStore from "@/stores/modules/catch";
+import { getDictLable } from "@/utils/util";
+
+const catchStore = useCatchStore();
+const dict = catchStore.getDicts(["distributionState","handleState"]);
+
+const query = ref({});
+
+const list = ref([]);
+const total = ref(0);
+
+onMounted(() => {
+    getList();
+});
+
+const route = useRoute();
+watch(
+    () => route.query.modelId,
+    (val) => {
+        query.value.modelIds = [val];
+    }
+);
+watch(
+    () => query.value.modelIds,
+    (newVal, oldVal) => {
+        if (newVal !== oldVal) {
+            query.value.current = 1;
+            getList();
+        }
+    }
+);
+
+function getList() {
+    listModelClue(query.value).then((data) => {
+        list.value = data.records;
+        total.value = data.total;
+    });
+}
+
+function reset() {
+    query.value = {};
+    getList();
+}
+
+const show = ref(false);
+const activeModelClue = ref({});
+
+function handleShowDetail(row) {
+    activeModelClue.value = row;
+    show.value = true;
+}
+
+const activeNegativeId = ref('')
+const negativeShow = ref(false)
+
+function handleAction(row) {
+    
+    negativeShow.value = true;
+    activeNegativeId.value = row.negativeId;
+}
+</script>
+<style lang="scss" scoped>
+</style>
\ No newline at end of file