新增 消防安全模块-消防安检目标列表

src/apis/fetch.js

@@ -160,4 +160,39 @@ export default {
   getShippingNoticeList(data) {
     return $http("/maritime/notice/getFileList", data);
   },
+
+  // 新增消防检查模板
+  addFireSafetyTemplate(data) {
+    return $http("/fire/inspection/temp/add", data);
+  },
+
+  // 删除消防检查模板
+  deleteFireSafetyTemplate(data) {
+    return $http("/fire/inspection/temp/delete", data);
+  },
+
+  // 获取消防检查模板详情
+  getFireSafetyTemplateDetail(data) {
+    return $http("/fire/inspection/temp/detail", data);
+  },
+
+  // 发起消防检查
+  addFireSafetyCheck(data) {
+    return $http("/fire/inspection/temp/initiate", data);
+  },
+
+  // 获取消防安检项目类型下拉
+  getFireSafetyTemplateTypeSelect() {
+    return $http("/fire/inspection/temp/item/select");
+  },
+
+  // 获取消防检查模板列表
+  getFireSafetyTemplateList(data) {
+    return $http("/fire/inspection/temp/list", data);
+  },
+
+  // 修改消防检查模板
+  updateFireSafetyTemplate(data) {
+    return $http("/fire/inspection/temp/update", data);
+  },
 };

src/layout/Aside.vue

@@ -76,6 +76,24 @@ let menu = [
       },
     ],
   },
+  {
+    icon: "FolderChecked",
+    title: "消防安检",
+    items: [
+      {
+        path: "/fireSafetyManage/fireSafetyTemplateList",
+        name: "消防安检模板列表",
+      },
+      {
+        path: "/fireSafetyManage/checkFireSafetyExamineList",
+        name: "消防安检审核列表",
+      },
+      {
+        path: "/fireSafetyManage/fireSafetyHistoryCheckList",
+        name: "历史消防安检列表",
+      },
+    ],
+  },
   {
     icon: "FolderChecked",
     title: "船舶安检",

src/router/index.js

@@ -153,6 +153,24 @@ const router = createRouter({
       component: () =>
         import("../views/shipSecurityManage/shipCheckHistoryList.vue"),
     },
+    {
+      path: "/fireSafetyManage/fireSafetyTemplateList",
+      name: "fireSafetyTemplateList",
+      meta: {
+        title: "消防模板列表",
+      },
+      component: () =>
+        import("../views/fireSafetyManage/fireSafetyTemplateList.vue"),
+    },
+    {
+      path: "/fireSafetyManage/fireSafetyTemplateDetail",
+      name: "fireSafetyTemplateDetail",
+      meta: {
+        title: "消防安检模板详情",
+      },
+      component: () =>
+        import("../views/fireSafetyManage/fireSafetyTemplateDetail.vue"),
+    },
   ],
 });
 

src/views/fireSafetyManage/fireSafetyTemplateDetail.vue

@@ -0,0 +1,290 @@
+<template>
+  <div class="pt40 pl30" style="width: 600px">
+    <el-form
+      :model="ruleForm"
+      :rules="rules"
+      ref="ruleFormRef"
+      label-width="140px"
+      label-position="left"
+    >
+      <el-form-item class="mb30" prop="securityCheckName" label="安检名称">
+        <el-input
+          style="width: 280px"
+          v-model="ruleForm.securityCheckName"
+        ></el-input>
+      </el-form-item>
+      <el-form-item class="mb30" prop="securityCheckTarget" label="安检目标">
+        <el-input
+          style="width: 280px"
+          v-model="ruleForm.securityCheckTarget"
+        ></el-input>
+      </el-form-item>
+      <el-form-item class="mb30" prop="securityCheckFocus" label="排查重点">
+        <el-input
+          style="width: 280px"
+          v-model="ruleForm.securityCheckFocus"
+        ></el-input>
+      </el-form-item>
+      <el-form-item class="mb30" prop="shipLength" label="选择适用船长">
+        <div class="df aic" style="width: 100%">
+          <el-input
+            style="width: 130px"
+            v-model="ruleForm.minShipLen"
+            :disabled="ruleForm.isAllShip === 1"
+          ></el-input>
+          <div class="mr10 ml10">-</div>
+          <el-input
+            style="width: 130px"
+            v-model="ruleForm.maxShipLen"
+            :disabled="ruleForm.isAllShip === 1"
+          ></el-input>
+          <el-checkbox
+            class="ml20"
+            v-model="ruleForm.isAllShip"
+            label="所有船舶"
+            size="large"
+            :true-value="1"
+            :false-value="0"
+            :true-label="1"
+            :false-label="0"
+          />
+        </div>
+      </el-form-item>
+      <div class="df aic jcsb mb20 mt50">
+        <el-button class="mr30" type="primary" @click="addNewItem">
+          添加新检查项目
+        </el-button>
+        <el-button-group v-show="ruleForm.items.length > 1">
+          <el-button
+            v-for="(item, index) in ruleForm.items"
+            @click="itemIndex = index"
+            :type="itemIndex == index ? 'primary' : ''"
+          >
+            {{ item.checkItemName || "新检查项目" }}
+          </el-button>
+        </el-button-group>
+      </div>
+      <el-form-item class="mb30" label="项目名称" prop="checkItemName">
+        <el-input
+          style="width: 280px"
+          v-model="ruleForm.items[itemIndex].checkItemName"
+        ></el-input>
+      </el-form-item>
+      <el-form-item class="mb30" label="项目类型" prop="checkItemTypeName">
+        <el-select
+          style="width: 280px"
+          v-model="ruleForm.items[itemIndex].checkItemTypeName"
+          value-key="checkItemTypeName"
+          placeholder="请选择安全检查项目类型"
+          @change="selectChange"
+        >
+          <el-option
+            v-for="item in templateTypeSelect"
+            :label="item.value"
+            :value="item"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item class="mb30" label="项目备注" prop="checkItemRemark">
+        <el-input
+          style="width: 280px"
+          v-model="ruleForm.items[itemIndex].checkItemRemark"
+        ></el-input>
+      </el-form-item>
+      <div class="df jcfe">
+        <el-button
+          v-show="ruleForm.items.length > 1"
+          size="small"
+          type="primary"
+          @click="removeItem"
+        >
+          移除当前项目
+        </el-button>
+      </div>
+    </el-form>
+    <div class="dialog-footer df aic jcfe">
+      <el-button @click="resetForm">重置</el-button>
+      <el-button type="primary" @click="addFireSafetyTemplate(ruleForm)">
+        确定
+      </el-button>
+    </div>
+  </div>
+</template>
+<script setup>
+import { ref, h, reactive, toRefs, onMounted } from "vue";
+import { ElNotification, ElMessageBox, ElMessage } from "element-plus";
+import store from "../../store";
+import router from "../../router";
+import md5 from "md5";
+import api from "../../apis/fetch";
+import { useRoute } from "vue-router";
+import _ from "lodash";
+import { subTimeStr } from "../../utils/utils";
+
+const route = useRoute();
+async function getFireSafetyTemplateDetail(id) {
+  let { data } = await api.getFireSafetyTemplateDetail({
+    id,
+  });
+  if (data.status == 0) {
+    ruleForm.value = data.result;
+  }
+}
+let ruleFormRef = ref(null);
+let ruleForm = ref({
+  securityCheckName: "",
+  items: [{}],
+  minShipLen: "",
+  maxShipLen: "",
+  isAllShip: 0,
+});
+
+async function resetForm() {
+  itemIndex.value = 0;
+  ruleForm.value = {
+    items: [{}],
+  };
+  if (route.query.id) getFireSafetyTemplateDetail(route.query.id);
+}
+
+const checkShipLength = (rule, value, callback) => {
+  if (
+    (!ruleForm.value.minShipLen || !ruleForm.value.maxShipLen) &&
+    ruleForm.value.isAllShip === 0
+  ) {
+    callback(new Error("请完善适用船长"));
+  } else {
+    callback();
+  }
+};
+
+const checkItemName = (rule, value, callback) => {
+  if (
+    !ruleForm.value.items.every((item, index) => {
+      if (!item.checkItemName)
+        callback(new Error(`请完善第${index + 1}个项目名称`));
+      return !!item.checkItemName;
+    })
+  ) {
+  } else {
+    callback();
+  }
+};
+const checkItemTypeName = (rule, value, callback) => {
+  if (
+    !ruleForm.value.items.every((item, index) => {
+      if (!item.checkItemTypeName)
+        callback(new Error(`请完善第${index + 1}个项目类型`));
+      return !!item.checkItemTypeName;
+    })
+  ) {
+  } else {
+    callback();
+  }
+};
+const checkItemRemark = (rule, value, callback) => {
+  if (
+    !ruleForm.value.items.every((item, index) => {
+      if (!item.checkItemRemark)
+        callback(new Error(`请完善第${index + 1}个项目备注`));
+      return !!item.checkItemRemark;
+    })
+  ) {
+  } else {
+    callback();
+  }
+};
+
+const rules = ref({
+  securityCheckName: [
+    { required: true, message: "请填写安检名称", trigger: "blur" },
+  ],
+  securityCheckTarget: [
+    { required: true, message: "请填写安检目标", trigger: "blur" },
+  ],
+  securityCheckFocus: [
+    { required: true, message: "请填写安检重点", trigger: "blur" },
+  ],
+  shipLength: [{ validator: checkShipLength, trigger: "blur" }],
+  checkItemName: [{ validator: checkItemName, trigger: "blur" }],
+  checkItemTypeName: [{ validator: checkItemTypeName, trigger: "blur" }],
+  checkItemRemark: [{ validator: checkItemRemark, trigger: "blur" }],
+});
+let itemIndex = ref(0);
+let templateTypeSelect = ref([]);
+function addNewItem() {
+  ruleForm.value.items.push({});
+  itemIndex.value = ruleForm.value.items.length - 1;
+}
+async function getFireSafetyTemplateTypeSelect() {
+  let { data } = await api.getFireSafetyTemplateTypeSelect();
+  templateTypeSelect.value = data.status == 0 ? data.result : [];
+}
+async function addFireSafetyTemplate() {
+  ruleFormRef.value.validate(async (valid) => {
+    if (valid) {
+      let {
+        securityCheckName,
+        minShipLen,
+        maxShipLen,
+        items,
+        id,
+        securityCheckTarget,
+        securityCheckFocus,
+        isAllShip,
+      } = ruleForm.value;
+      let postData = {
+        securityCheckName,
+        minShipLen,
+        maxShipLen,
+        items,
+        id,
+        securityCheckTarget,
+        securityCheckFocus,
+        isAllShip,
+      };
+      let res = await api[
+        id ? "updateFireSafetyTemplate" : "addFireSafetyTemplate"
+      ](postData);
+      if (res.data.status == 0) {
+        ElNotification.success({
+          title: id ? "更新成功" : "添加成功",
+          duration: 1500,
+          message: `${securityCheckName}:${res.data.msg}`,
+          type: "success",
+        });
+        router.replace("/fireSafetyManage/fireSafetyTemplateList");
+      } else {
+        ElNotification.error({
+          title: "失败",
+          duration: 2000,
+          message: res.data.msg,
+        });
+      }
+    } else {
+      return false;
+    }
+  });
+}
+
+function removeItem() {
+  ruleForm.value.items.splice(itemIndex.value, 1);
+  itemIndex.value = itemIndex.value == 0 ? 0 : itemIndex.value - 1;
+}
+
+function selectChange(e) {
+  ruleForm.value.items[itemIndex.value].checkItemTypeId = e.key;
+  ruleForm.value.items[itemIndex.value].checkItemTypeName = e.value;
+}
+
+onMounted(() => {
+  if (route.query.id) getFireSafetyTemplateDetail(route.query.id);
+  getFireSafetyTemplateTypeSelect();
+});
+</script>
+
+<style scoped>
+.dialog-footer {
+  margin-top: 100px;
+}
+</style>

src/views/fireSafetyManage/fireSafetyTemplateList.vue

@@ -0,0 +1,201 @@
+<template>
+  <div class="full-container-p24">
+    <div class="df jcsb">
+      <div style="display: flex">
+        <el-input
+          placeholder="请输入模板名称"
+          prefix-icon="el-icon-search"
+          v-model="term"
+          clearable
+          class="mr30"
+          style="width: 300px"
+        ></el-input>
+        <el-button type="primary" @click="getFireSafetyTemplateList(1)">
+          查询
+        </el-button>
+      </div>
+      <el-button type="primary" @click="showDialog">创建消防安检模板</el-button>
+    </div>
+    <div style="margin-top: 24px">
+      <el-table border :data="tableData" stripe style="width: 100%">
+        <el-table-column
+          type="index"
+          label="序号"
+          width="80"
+          align="center"
+        ></el-table-column>
+        <el-table-column
+          prop="securityCheckName"
+          label="消防安检模板名称"
+          min-width="120"
+          align="center"
+        ></el-table-column>
+        <el-table-column
+          prop="shipLen"
+          label="适用船型"
+          min-width="120"
+          align="center"
+        ></el-table-column>
+        <el-table-column
+          prop="createTime"
+          label="创建时间"
+          min-width="120"
+          align="center"
+        >
+          <template v-slot="scope">
+            {{ subTimeStr(scope.row.createTime) }}
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" min-width="80" align="center">
+          <template v-slot="scope">
+            <el-button
+              @click="getFireSafetyTemplateDetail(scope.row.id)"
+              type="primary"
+              text
+              size="small"
+            >
+              编辑
+            </el-button>
+            <el-button
+              @click="
+                deleteFireSafetyTemplate(
+                  scope.row.id,
+                  scope.row.securityCheckName
+                )
+              "
+              type="danger"
+              text
+              size="small"
+            >
+              删除
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="df aic jcfe mt40 mr20">
+        <el-pagination
+          background
+          layout="prev, pager, next"
+          :current-page="currentPage"
+          :total="total"
+          @current-change="pageChange"
+        ></el-pagination>
+      </div>
+    </div>
+  </div>
+</template>
+<script setup>
+import { ref, h, reactive, toRefs, onMounted } from "vue";
+import { ElNotification, ElMessageBox, ElMessage } from "element-plus";
+import store from "../../store";
+import router from "../../router";
+import md5 from "md5";
+import api from "../../apis/fetch";
+import { subTimeStr } from "../../utils/utils";
+
+function showDialog() {
+  router.push("/fireSafetyManage/fireSafetyTemplateDetail");
+}
+let currentPage = ref(1);
+let term = ref("");
+let tableData = ref([]);
+let total = ref(0);
+async function getFireSafetyTemplateList(page) {
+  currentPage.value = page || currentPage.value;
+  let res = await api.getFireSafetyTemplateList({
+    currentPage: currentPage.value,
+    size: 10,
+    term: term.value,
+  });
+  if (res.data.status == 0) {
+    tableData.value = res.data.result;
+    total.value = res.data.total;
+  } else {
+    tableData.value = [];
+    total.value = 0;
+  }
+}
+
+async function getFireSafetyTemplateDetail(id) {
+  router.push({
+    path: "/fireSafetyManage/fireSafetyTemplateDetail",
+    query: {
+      id,
+    },
+  });
+}
+
+function deleteFireSafetyTemplate(id, securityCheckName) {
+  ElMessageBox.confirm(`确认删除消防安检模板: ${securityCheckName} ?`, "提示", {
+    confirmButtonText: "确认",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
+    .then(async () => {
+      let { data } = await api.deleteFireSafetyTemplate({
+        id,
+      });
+      if (data.status == 0) {
+        ElMessage({
+          type: "success",
+          message: data.msg,
+          duration: 1500,
+        });
+      }
+      getFireSafetyTemplateList();
+    })
+    .catch(() => {});
+}
+
+function pageChange(e) {
+  currentPage.value = e;
+  getFireSafetyTemplateList();
+}
+onMounted(() => {
+  getFireSafetyTemplateList();
+});
+</script>
+<style scoped>
+.seach-btn {
+  display: inline-block;
+  width: 60px;
+  height: 38px;
+  background: #0094fe;
+  border-radius: 2px;
+  font-size: 14px;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #ffffff;
+  text-align: center;
+  line-height: 38px;
+  margin-left: 10px;
+  cursor: pointer;
+}
+
+.cargo-owner-add {
+  width: 80px;
+  height: 32px;
+  border-radius: 2px;
+  border: 1px solid #0094fe;
+  font-size: 14px;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #0094fe;
+  line-height: 32px;
+  text-align: center;
+  cursor: pointer;
+}
+
+:deep().el-dialog {
+  width: 560px;
+  padding: 20px 50px;
+  border-radius: 6px;
+}
+
+:deep() .el-dialog__title {
+  font-size: 18px;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #0094fe;
+}
+</style>