From f025e90a0abde33981df620183f5c266f5fce9ff Mon Sep 17 00:00:00 2001
From: WenShiJun <piratecaptain37@aliyun.com>
Date: Fri, 23 Feb 2024 19:07:36 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=89=E5=85=A8=E9=80=9A=E7=9F=A5=E6=A8=A1?=
 =?UTF-8?q?=E5=9D=97->=E6=96=B0=E5=A2=9E=E5=88=97=E8=A1=A8=E3=80=81?=
 =?UTF-8?q?=E6=96=B0=E5=A2=9E=E3=80=81=E8=AF=A6=E6=83=85=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/request/safety_production_related.js      |  18 ++
 .../inventory_management/add.vue              |   1 -
 .../components/inspection_route.vue           |   1 -
 .../security_notice/add.vue                   | 178 ++++++++++++++++++
 .../components/select_risk.vue                | 116 ++++++++++++
 .../security_notice/details.vue               | 140 ++++++++++++++
 .../security_notice/index.vue                 | 173 +++++++++++++++++
 .../security_notice/notice_info.vue           |  60 ++++++
 8 files changed, 685 insertions(+), 2 deletions(-)
 create mode 100644 src/request/safety_production_related.js
 create mode 100644 src/views/safety_production_related/security_notice/add.vue
 create mode 100644 src/views/safety_production_related/security_notice/components/select_risk.vue
 create mode 100644 src/views/safety_production_related/security_notice/details.vue
 create mode 100644 src/views/safety_production_related/security_notice/index.vue
 create mode 100644 src/views/safety_production_related/security_notice/notice_info.vue

diff --git a/src/request/safety_production_related.js b/src/request/safety_production_related.js
new file mode 100644
index 0000000..10ef43d
--- /dev/null
+++ b/src/request/safety_production_related.js
@@ -0,0 +1,18 @@
+import { post,upload } from "@/request/axios.js";
+import {getLevelsByParentId} from "@/request/data_dictionary.js";
+import {ref} from "vue";
+
+export const getSecurityNoticeList = (params) => post("/securitynotice/listForSecurityNotice", params); // 安全通知列表
+export const getSecurityNotice = (params) => post("/securitynotice/getAllReadDetail", params); // 阅读详情
+export const dateteSecurityNotice = (params) => post("/securitynotice/delete", params); // 安全通知删除
+export const getSecurityNoticeInfo = (params) => post("/securitynotice/goEdit", params); // 安全通知详情
+export const addSecurityNotice = (params) => upload("/securitynotice/add", params); // 添加安全通知
+export const getUserListAll = (params) => post("/user/listUserByCorp", params);
+
+export const layoutFnGetNotificationsClassification = async () => {
+    const resData = await getLevelsByParentId({
+        parentId: "aaecb47d95524b84904809671e48a777",
+    });
+    return ref(resData);
+};
+
diff --git a/src/views/hazard_investigation/inventory_management/add.vue b/src/views/hazard_investigation/inventory_management/add.vue
index 5eb891c..54b1eae 100644
--- a/src/views/hazard_investigation/inventory_management/add.vue
+++ b/src/views/hazard_investigation/inventory_management/add.vue
@@ -253,7 +253,6 @@ import useFormValidate from "@/assets/js/useFormValidate.js";
 import { ElMessage } from "element-plus";
 import AddRisk from "@/views/risk_control/ledger/components/add.vue";
 import SelectRisk from "./components/select_risk.vue";
-import AddInspectionRoute from "./components/add_inspection_route.vue";
 
 const route = useRoute();
 const router = useRouter();
diff --git a/src/views/hazard_investigation/inventory_management/components/inspection_route.vue b/src/views/hazard_investigation/inventory_management/components/inspection_route.vue
index ab6c401..baec158 100644
--- a/src/views/hazard_investigation/inventory_management/components/inspection_route.vue
+++ b/src/views/hazard_investigation/inventory_management/components/inspection_route.vue
@@ -57,7 +57,6 @@ import { useVModels } from "@vueuse/core";
 import { ElMessage } from "element-plus";
 import { debounce } from "throttle-debounce";
 import { setInventoryManagementRoute } from "@/request/hazard_investigation.js";
-import { VueDraggable } from "vue-draggable-plus";
 
 const props = defineProps({
   visible: {
diff --git a/src/views/safety_production_related/security_notice/add.vue b/src/views/safety_production_related/security_notice/add.vue
new file mode 100644
index 0000000..a4c433a
--- /dev/null
+++ b/src/views/safety_production_related/security_notice/add.vue
@@ -0,0 +1,178 @@
+<template>
+  <layout-card>
+    <el-form
+      ref="formRef"
+      :model="data.form"
+      :rules="rules"
+      label-width="175px"
+    >
+      <el-divider content-position="left">添加</el-divider>
+      <el-row>
+        <el-col :span="8">
+          <el-form-item label="通知标题" prop="TITLE">
+            <el-input v-model="data.form.TITLE" placeholder="请输入内容" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="5">
+          <el-form-item label="通知等级" prop="LEVEL">
+            <el-select v-model="data.form.LEVEL" placeholder="请选择通知等级">
+              <el-option
+                v-for="item in relatedClassificationList"
+                :key="item.BIANMA"
+                :label="item.NAME"
+                :value="item.BIANMA"
+              />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="人员选择" prop="PERSON">
+            <div class="flexBox">
+              <el-input
+                type="textarea"
+                placeholder="请选择人员"
+                v-model="data.form.PERSON"
+                disabled
+              ></el-input>
+              <el-button
+                class="addBtn"
+                type="primary"
+                @click="data.selectRiskDialogVisible = true"
+              >
+                选择
+              </el-button>
+            </div>
+
+            <!--            <el-select-->
+            <!--                v-model="data.form.UNITS_PIC"-->
+            <!--                clearable-->
+            <!--                placeholder="请选择人员"-->
+            <!--                @change="fnSelectUnitsUser($event)"-->
+            <!--            >-->
+            <!--              <el-option-->
+            <!--                  v-for="item in relatedClassificationList"-->
+            <!--                  :key="item.BIANMA"-->
+            <!--                  :label="item.NAME"-->
+            <!--                  :value="item.BIANMA"-->
+            <!--              />-->
+            <!--            </el-select>-->
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="通知附件" prop="fileList">
+            <layout-upload
+              v-model:file-list="data.form.fileList"
+              accept=".pdf,.mp4"
+              delete-to-server
+              :limit="9"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="50">
+          <el-form-item label="通知内容" prop="NOTIFICATIONCONTENT">
+            <layout-editor
+              v-model="data.form.NOTIFICATIONCONTENT"
+              placeholder="请输入内容"
+            />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <div class="tc mt-10">
+      <el-button type="primary" @click="fnSubmit"> 确定 </el-button>
+    </div>
+
+    <select-risk
+      v-model:visible="data.selectRiskDialogVisible"
+      :list-data="data.listAll"
+      @submit="fnSelectRiskSubmit"
+      @submitall="fnSelectAllRiskSubmit"
+    />
+  </layout-card>
+</template>
+
+<script setup>
+import {
+  layoutFnGetNotificationsClassification,
+  getUserListAll,
+  addSecurityNotice,
+} from "@/request/safety_production_related.js";
+import { reactive, ref } from "vue";
+import LayoutUpload from "@/components/upload/index.vue";
+import LayoutEditor from "@/components/editor/index.vue";
+import SelectRisk from "./components/select_risk.vue";
+import useFormValidate from "@/assets/js/useFormValidate.js";
+const formRef = ref(null);
+const rules = {
+  TITLE: [{ required: true, message: "请输入通知标题", trigger: "blur" }],
+  LEVEL: [{ required: true, message: "请选择通知等级", trigger: "blur" }],
+  PERSON: [{ required: true, message: "请选择通知人员", trigger: "blur" }],
+  NOTIFICATIONCONTENT: [
+    { required: true, message: "请输入通知内容", trigger: "blur" },
+  ],
+};
+
+const fnGetUnitsList = async () => {
+  const resData = await getUserListAll({});
+  data.unitsList = resData.varList;
+};
+fnGetUnitsList();
+const relatedClassificationTempList =
+  await layoutFnGetNotificationsClassification();
+const relatedClassificationList = [];
+JSON.parse(relatedClassificationTempList.value.zTreeNodes).forEach((e) => {
+  relatedClassificationList.push({ name: e.id, BIANMA: e.name });
+});
+
+const data = reactive({
+  form: {
+    TITLE: "",
+    LEVEL: "",
+    PERSON: "",
+    fileList: [],
+    NOTIFICATIONCONTENT: "",
+    allStatus: 0, // 是否全选
+  },
+});
+
+const fnSubmit = async () => {
+  await useFormValidate(formRef);
+  const formData = new FormData();
+  Object.keys(data.form).forEach((key) => {
+    formData.append(key, data.form[key]);
+  });
+  formData.delete("fileList");
+  for (let i = 0; i < data.form.fileList.length; i++) {
+    if (data.form.fileList[i].raw)
+      formData.append("FFILE", data.form.fileList[i].raw);
+  }
+  await addSecurityNotice(formData);
+};
+const fnSelectRiskSubmit = (list) => {
+  console.log(list);
+  const nameList = list.map((val) => {
+    return val.USERNAME;
+  });
+  data.form.PERSON = nameList.join(",");
+  data.form.allStatus = 0;
+  console.log(data.PERSON, 19);
+  console.log("是否全选", data.form.allStatus);
+};
+
+const fnSelectAllRiskSubmit = () => {
+  data.form.allStatus = 1;
+  data.PERSON = "已全部选择";
+  console.log("是否全选", data.form.allStatus);
+};
+</script>
+
+<style scoped lang="scss">
+.flexBox {
+  display: flex;
+  align-items: flex-end;
+
+  .addBtn {
+    margin-left: 12px;
+  }
+}
+</style>
diff --git a/src/views/safety_production_related/security_notice/components/select_risk.vue b/src/views/safety_production_related/security_notice/components/select_risk.vue
new file mode 100644
index 0000000..edfbffd
--- /dev/null
+++ b/src/views/safety_production_related/security_notice/components/select_risk.vue
@@ -0,0 +1,116 @@
+<template>
+  <el-dialog title="选择人员" v-model="visible" width="1500">
+    <el-form
+      :model="searchForm"
+      label-width="60px"
+      @submit.prevent="fnResetPagination"
+    >
+      <el-row>
+        <el-col :span="6">
+          <el-form-item label="关键字" prop="KEYWORDS">
+            <el-input
+              v-model="searchForm.KEYWORDS"
+              placeholder="请输入关键字"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label-width="10px">
+            <el-button type="primary" native-type="submit">搜索</el-button>
+            <el-button native-type="reset" @click="fnResetPagination">
+              重置
+            </el-button>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <layout-table
+      ref="tableRef"
+      :data="list"
+      v-model:pagination="pagination"
+      @get-data="fnGetData"
+      row-key="RISKCHECKITEM_ID"
+    >
+      <el-table-column reserve-selection type="selection" width="55" />
+      <el-table-column label="序号" width="70">
+        <template v-slot="{ $index }">
+          {{ serialNumber(pagination, $index) }}
+        </template>
+      </el-table-column>
+      <el-table-column prop="USERNAME" label="姓名" />
+      <el-table-column prop="DEPARTNAME" label="部门" />
+    </layout-table>
+    <template #footer>
+      <el-button @click="fnClose">取消</el-button>
+      <el-button type="primary" @click="fnAllSubmit"> 全选 </el-button>
+      <el-button type="primary" @click="fnSubmit"> 确定 </el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { useVModel } from "@vueuse/core";
+import { debounce } from "throttle-debounce";
+import useListData from "@/assets/js/useListData.js";
+import { watch } from "vue";
+import { serialNumber } from "@/assets/js/utils.js";
+import { differenceWith } from "lodash-es";
+import { getUserListAll } from "@/request/safety_production_related.js";
+
+const props = defineProps({
+  visible: {
+    type: Boolean,
+    required: true,
+    default: false,
+  },
+  listData: {
+    type: Array,
+    required: true,
+    default: () => [],
+  },
+});
+const emits = defineEmits(["update:visible", "submit", "submitall"]);
+const visible = useVModel(props, "visible", emits);
+
+const { list, searchForm, pagination, fnGetData, fnResetPagination, tableRef } =
+  useListData(getUserListAll, {
+    key: "userList",
+    immediate: false,
+    clearSelection: false,
+  });
+
+// const riskClassificationList = await layoutFnGetRiskClassification();
+const stop = watch(
+  () => props.visible,
+  (value) => {
+    if (value) {
+      fnGetData();
+      stop && stop();
+    }
+  }
+);
+const fnClose = () => {
+  visible.value = false;
+};
+const fnSubmit = debounce(
+  1000,
+  () => {
+    const selectionData = tableRef.value.getSelectionRows();
+    const listData = differenceWith(
+      selectionData,
+      props.listData,
+      (a, b) => a.RISKCHECKITEM_ID === b.RISKCHECKITEM_ID
+    );
+    fnClose();
+    emits("submit", listData);
+  },
+  { atBegin: true }
+);
+
+const fnAllSubmit = () => {
+  fnClose();
+  emits("submitall");
+};
+</script>
+
+<style scoped lang="scss"></style>
diff --git a/src/views/safety_production_related/security_notice/details.vue b/src/views/safety_production_related/security_notice/details.vue
new file mode 100644
index 0000000..14279ca
--- /dev/null
+++ b/src/views/safety_production_related/security_notice/details.vue
@@ -0,0 +1,140 @@
+<template>
+  <div>
+    <el-card>
+      <el-form
+        :model="searchForm"
+        label-width="100px"
+        @submit.prevent="searchNotifications"
+      >
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="从业人员" prop="PERSON">
+              <el-input v-model="searchForm.PERSON" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="从业类型" prop="PRACTITIONERTYPE">
+              <el-input v-model="searchForm.PRACTITIONERTYPE" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="签收状态" prop="SIGNEDSTATUS">
+              <el-select v-model="searchForm.SIGNEDSTATUS">
+                <el-option label="已签收" :value="1" />
+                <!-- 1代表已签收 -->
+                <el-option label="未签收" :value="0" />
+                <!-- 0代表未签收 -->
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="回复状态" prop="REPLYSTATUS">
+              <el-select v-model="searchForm.REPLYSTATUS">
+                <el-option label="已回复" :value="1" />
+                <!-- 1代表已回复 -->
+                <el-option label="未回复" :value="0" />
+                <!-- 0代表未回复 -->
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item>
+              <el-button type="primary" native-type="submit">搜索</el-button>
+              <el-button native-type="reset" @click="resetSearchForm"
+                >重置</el-button
+              >
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+    </el-card>
+    <layout-card>
+      <layout-table
+        :data="list"
+        :pagination="pagination"
+        @get-data="fnGetData"
+        @update:pagination="updatePagination"
+        stripe
+        border
+        show-header
+      >
+        <el-table-column label="序号" width="60">
+          <template #default="{ $index }">
+            {{ serialNumber(pagination, $index) }}
+          </template>
+        </el-table-column>
+        <el-table-column label="从业人员" prop="PERSON" />
+        <el-table-column label="从业类型" prop="PRACTITIONERTYPE" />
+        <el-table-column label="签收时间" prop="SIGNEDDATE">
+          <template #default="{ row }">
+            <span v-if="row.SIGNEDDATE">{{ row.SIGNEDDATE }}</span>
+            <el-tag v-else>未签收</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column label="回复时间" prop="REPLYDATE">
+          <template #default="{ row }">
+            <span v-if="row.REPLYDATE">{{ row.REPLYDATE }}</span>
+            <el-tag v-else>未回复</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column label="回复内容" prop="REPLYCONTENT">
+          <template #default="{ row }">
+            <span v-if="row.REPLYCONTENT">{{ row.REPLYCONTENT }}</span>
+            <el-tag v-else>未回复</el-tag>
+          </template>
+        </el-table-column>
+      </layout-table>
+    </layout-card>
+  </div>
+</template>
+
+<script setup>
+import { reactive, onMounted } from "vue";
+import { useRoute } from "vue-router";
+import { getSecurityNotice } from "@/request/safety_production_related.js";
+import { serialNumber } from "@/assets/js/utils";
+import useListData from "@/assets/js/useListData";
+
+const route = useRoute();
+const NOTIFICATION_ID = route.query.NOTIFICATION_ID;
+
+const searchForm = reactive({
+  PERSON: "",
+  PRACTITIONERTYPE: "",
+  SIGNEDSTATUS: null,
+  REPLYSTATUS: null,
+});
+
+const { list, pagination, fnGetData, fnResetPagination } = useListData(
+  getSecurityNotice,
+  {
+    searchForm,
+    otherParams: { NOTIFICATION_ID },
+    usePagination: true,
+  }
+);
+
+async function searchNotifications() {
+  const params = Object.keys(searchForm).reduce((acc, key) => {
+    acc[key] = searchForm[key];
+    return acc;
+  }, {});
+
+  params.NOTIFICATION_ID = NOTIFICATION_ID;
+  await fnGetData(params);
+}
+
+// 重置表单时，也确保重置为初始值
+function resetSearchForm() {
+  Object.keys(searchForm).forEach((key) => {
+    searchForm[key] = "";
+  });
+  fnResetPagination({ NOTIFICATION_ID });
+}
+
+onMounted(() => {
+  fnGetData({ NOTIFICATION_ID });
+});
+</script>
+
+<style scoped></style>
diff --git a/src/views/safety_production_related/security_notice/index.vue b/src/views/safety_production_related/security_notice/index.vue
new file mode 100644
index 0000000..18f0713
--- /dev/null
+++ b/src/views/safety_production_related/security_notice/index.vue
@@ -0,0 +1,173 @@
+<template>
+  <div>
+    <el-card>
+      <el-form
+        :model="searchForm"
+        label-width="100px"
+        @submit.prevent="fnResetPagination"
+      >
+        <el-row>
+          <el-col :span="6">
+            <el-form-item label="通知标题" prop="TITLE">
+              <el-input v-model="searchForm.TITLE" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="回复状态" prop="REPLYSTATUS">
+              <el-select v-model="searchForm.REPLYSTATUS">
+                <el-option label="已回复" :value="1" />
+                <!-- 1代表已回复 -->
+                <el-option label="未回复" :value="0" />
+                <!-- 0代表未回复 -->
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="通知等级" prop="RISKUNITNAME">
+              <el-select v-model="searchForm.RISKUNITNAME">
+                <el-option
+                  v-for="item in relatedClassificationList"
+                  :key="item.BIANMA"
+                  :label="item.NAME"
+                  :value="item.BIANMA"
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label-width="10px">
+              <el-button type="primary" native-type="submit">搜索</el-button>
+              <el-button native-type="reset" @click="fnResetPagination">
+                重置
+              </el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+    </el-card>
+    <layout-card>
+      <layout-table
+        :data="list"
+        @get-data="fnGetData"
+        v-model:pagination="pagination"
+      >
+        <el-table-column label="序号" width="60">
+          <template #default="{ $index }">
+            {{ serialNumber(pagination, $index) }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="TITLE" label="通知标题" width="250" />
+        <el-table-column prop="POSTSTATUS" label="发布状态" width="250">
+          <template #default="{ row }">
+            {{ row.POSTSTATUS === 0 ? "未发布" : "已发布" }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="SIGNING" label="签收情况" width="120">
+        </el-table-column>
+        <el-table-column prop="REPLY" label="回复情况" />
+        <el-table-column prop="CREATETIME" label="创建时间" width="100" />
+        <el-table-column
+          prop="TRANSPORTATIONCOMPANY"
+          label="运输企业"
+          width="90"
+        >
+        </el-table-column>
+        <el-table-column label="操作" width="180">
+          <template v-slot:default="{ row }">
+            <el-button
+              type="primary"
+              text
+              link
+              @click="
+                router.push({
+                  path: '/safety_production_related/security_notice/notice_info',
+                  query: {
+                    NOTIFICATION_ID: row.NOTIFICATION_ID,
+                  },
+                })
+              "
+            >
+              查看
+            </el-button>
+            <el-button
+              type="primary"
+              text
+              link
+              @click="
+                router.push({
+                  path: '/safety_production_related/security_notice/add',
+                })
+              "
+            >
+              添加
+            </el-button>
+            <el-button
+              type="danger"
+              text
+              link
+              @click="deleteItem(row.NOTIFICATION_ID)"
+            >
+              删除
+            </el-button>
+            <!-- 阅读详情按钮 -->
+            <el-button
+              type="primary"
+              text
+              link
+              @click="
+                router.push({
+                  path: '/safety_production_related/security_notice/details',
+                  query: {
+                    NOTIFIION_ID: row.NOTIFICATION_ID,
+                  },
+                })
+              "
+            >
+              阅读详情
+            </el-button>
+          </template>
+        </el-table-column>
+      </layout-table>
+    </layout-card>
+    <edit
+      v-model:visible="data.analysisDialog.visible"
+      :info="data.analysisDialog.info"
+      @get-data="fnResetPagination"
+    />
+  </div>
+</template>
+
+<script setup>
+import { serialNumber } from "@/assets/js/utils";
+import useListData from "@/assets/js/useListData.js";
+import { reactive } from "vue";
+import {
+  getSecurityNoticeList,
+  layoutFnGetNotificationsClassification,
+  dateteSecurityNotice,
+} from "@/request/safety_production_related.js";
+import router from "@/router/index.js";
+import { ElMessageBox, ElMessage } from "element-plus";
+
+const { list, pagination, searchForm, fnGetData, fnResetPagination } =
+  useListData(getSecurityNoticeList);
+const data = reactive({
+  analysisDialog: {
+    visible: false,
+    info: {},
+  },
+});
+// 删除事件
+const deleteItem = async (value) => {
+  await ElMessageBox.confirm(`确定要删除吗？`, {
+    type: "warning",
+  });
+  await dateteSecurityNotice({ NOTIFICATION_ID: value });
+  ElMessage.success("删除成功");
+  fnGetData();
+};
+const relatedClassificationList =
+  await layoutFnGetNotificationsClassification();
+</script>
+
+<style scoped></style>
diff --git a/src/views/safety_production_related/security_notice/notice_info.vue b/src/views/safety_production_related/security_notice/notice_info.vue
new file mode 100644
index 0000000..d804c72
--- /dev/null
+++ b/src/views/safety_production_related/security_notice/notice_info.vue
@@ -0,0 +1,60 @@
+<template>
+  <div>
+    <layout-card>
+      <el-descriptions :column="1" border>
+        <el-descriptions-item label="通知标题">
+          {{ detailItems.TITLE }}
+        </el-descriptions-item>
+        <el-descriptions-item label="通知等级">
+          {{ detailItems.LEVEL }}
+        </el-descriptions-item>
+        <el-descriptions-item label="回复状态">
+          <div style="display: flex; align-items: center">
+            <el-switch
+              v-model="detailItems.REPLYSTATUS"
+              active-value="1"
+              inactive-value="0"
+              active-color="#13ce66"
+              inactive-color="#ff4949"
+            >
+            </el-switch>
+            <span style="margin-left: 8px">
+              {{ detailItems.REPLYSTATUS === "1" ? "开" : "关" }}
+            </span>
+          </div>
+        </el-descriptions-item>
+        <el-descriptions-item label="企业下发人">
+          {{ detailItems.PERSON }}
+        </el-descriptions-item>
+        <el-descriptions-item label="运输企业">
+          {{ detailItems.TRANSPORTATIONCOMPANY }}
+        </el-descriptions-item>
+        <el-descriptions-item label="通知内容">
+          <div v-html="detailItems.NOTIFICATIONCONTENT"></div>
+        </el-descriptions-item>
+      </el-descriptions>
+    </layout-card>
+  </div>
+</template>
+
+<script setup>
+import { onMounted, reactive } from "vue";
+import { getSecurityNoticeInfo } from "@/request/safety_production_related.js";
+import { useRoute } from "vue-router";
+const route = useRoute();
+const { NOTIFICATION_ID } = route.query;
+
+const detailItems = reactive({
+  LEVEL: "",
+  PERSON: "",
+  TRANSPORTATIONCOMPANY: "",
+  NOTIFICATIONCONTENT: "",
+});
+
+onMounted(async () => {
+  const response = await getSecurityNoticeInfo({ NOTIFICATION_ID });
+  Object.assign(detailItems, response.pd);
+});
+</script>
+
+<style scoped></style>