|
@@ -0,0 +1,537 @@
|
|
|
+<template>
|
|
|
+ <div class="app-container">
|
|
|
+ <el-form :model="queryParams" ref="queryRef" :inline="true">
|
|
|
+ <el-form-item label="检查单号" prop="checkFormNo">
|
|
|
+ <el-input
|
|
|
+ v-model="queryParams.checkFormNo"
|
|
|
+ placeholder="请输入"
|
|
|
+ clearable
|
|
|
+ style="width: 200px"
|
|
|
+ @keyup.enter="handleQuery"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="关区代码" prop="customs">
|
|
|
+ <el-input
|
|
|
+ v-model="queryParams.customs"
|
|
|
+ placeholder="请输入"
|
|
|
+ clearable
|
|
|
+ style="width: 200px"
|
|
|
+ @keyup.enter="handleQuery"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="检查时间">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="dateRangeCheckTime"
|
|
|
+ value-format="YYYY-MM-DD HH:mm:ss"
|
|
|
+ type="daterange"
|
|
|
+ range-separator="-"
|
|
|
+ start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期"
|
|
|
+ :default-time="[
|
|
|
+ new Date(2000, 1, 1, 0, 0, 0),
|
|
|
+ new Date(2000, 1, 1, 23, 59, 59),
|
|
|
+ ]"
|
|
|
+ ></el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="检查人员" prop="checkPerson">
|
|
|
+ <el-input
|
|
|
+ v-model="queryParams.checkPerson"
|
|
|
+ placeholder="请输入"
|
|
|
+ clearable
|
|
|
+ style="width: 200px"
|
|
|
+ @keyup.enter="handleQuery"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="是否有隐患" prop="hasDanger">
|
|
|
+ <el-radio-group v-model="queryParams.hasDanger">
|
|
|
+ <el-radio :label="0">无隐患</el-radio>
|
|
|
+ <el-radio :label="1">有隐患</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="检查单状态" prop="listStatus">
|
|
|
+ <el-select
|
|
|
+ v-model="queryParams.listStatus"
|
|
|
+ multiple
|
|
|
+ clearable
|
|
|
+ placeholder="请选择"
|
|
|
+ style="width: 240px"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in checkFormStatusList"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="网格类型" prop="ListGridCategory">
|
|
|
+ <el-select
|
|
|
+ v-model="queryParams.ListGridCategory"
|
|
|
+ multiple
|
|
|
+ clearable
|
|
|
+ placeholder="请选择"
|
|
|
+ style="width: 240px"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in gridCategoryList"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="隐患分类" prop="listDangerCategory">
|
|
|
+ <el-select
|
|
|
+ v-model="queryParams.listDangerCategory"
|
|
|
+ multiple
|
|
|
+ clearable
|
|
|
+ placeholder="请选择"
|
|
|
+ style="width: 240px"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in dangerCategoryList"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="所属部门" prop="listDepartment">
|
|
|
+ <el-tree-select
|
|
|
+ v-model="value"
|
|
|
+ :data="deptOptions"
|
|
|
+ multiple
|
|
|
+ check-strictly
|
|
|
+ :render-after-expand="false"
|
|
|
+ show-checkbox
|
|
|
+ style="width: 240px"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" icon="search" @click="handleQuery">搜索</el-button>
|
|
|
+ <el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ <el-row :gutter="10" class="mb8" v-if="false">
|
|
|
+ <el-col :span="1.5">
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ plain
|
|
|
+ icon="Plus"
|
|
|
+ @click="handleAdd"
|
|
|
+ >新增</el-button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="1.5">
|
|
|
+ <el-button
|
|
|
+ type="success"
|
|
|
+ plain
|
|
|
+ icon="Edit"
|
|
|
+ :disabled="single"
|
|
|
+ @click="handleUpdate"
|
|
|
+ >修改</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-table
|
|
|
+ :data="dataList"
|
|
|
+ @selection-change="handleSelectionChange"
|
|
|
+ @row-dblclick="handleDetail"
|
|
|
+ >
|
|
|
+ <el-table-column type="selection" width="55" align="center" />
|
|
|
+ <el-table-column label="检查时间" align="center" prop="heckTimeView" />
|
|
|
+ <el-table-column label="状态" align="center" prop="status">
|
|
|
+ <template #default="scope">
|
|
|
+ {{ getStatusTxt(scope.row.status) }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="检查单号" align="center" prop="checkFormNo" />
|
|
|
+ <el-table-column label="检查表名称" align="center" prop="checkFormName" />
|
|
|
+ <el-table-column label="所属部门" align="center" prop="departmentTxt" />
|
|
|
+ <el-table-column label="所属关区" align="center" prop="customsName" />
|
|
|
+ <el-table-column label="检查人员" align="center" prop="checkPerson" />
|
|
|
+ <el-table-column label="是否有隐患" align="center" prop="hasDangerTxt" />
|
|
|
+ <el-table-column label="整改期限" align="center" prop="rectifyDeadlineView" />
|
|
|
+ <el-table-column
|
|
|
+ label="操作"
|
|
|
+ align="center"
|
|
|
+ width="150"
|
|
|
+ fixed="right"
|
|
|
+ class-name="small-padding fixed-width"
|
|
|
+ >
|
|
|
+ <template #default="scope">
|
|
|
+ <el-button
|
|
|
+ link
|
|
|
+ type="primary"
|
|
|
+ @click="handleDetail(scope.row)"
|
|
|
+ >详情</el-button>
|
|
|
+ <el-button
|
|
|
+ link
|
|
|
+ type="primary"
|
|
|
+ icon="Edit"
|
|
|
+ @click="handleUpdate(scope.row)"
|
|
|
+ >修改</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <pagination
|
|
|
+ v-show="total > 0"
|
|
|
+ :total="total"
|
|
|
+ v-model:page="queryParams.page"
|
|
|
+ v-model:limit="queryParams.limit"
|
|
|
+ @pagination="getList"
|
|
|
+ />
|
|
|
+
|
|
|
+ <!-- 添加对话框 -->
|
|
|
+ <el-dialog
|
|
|
+ :title="title"
|
|
|
+ v-model="dialogOpenCreate"
|
|
|
+ width="750px"
|
|
|
+ append-to-body
|
|
|
+ >
|
|
|
+ <el-form
|
|
|
+ ref="formCrateRef"
|
|
|
+ :model="formCreate"
|
|
|
+ :rules="rulesCreate"
|
|
|
+ label-width="135px"
|
|
|
+ >
|
|
|
+ <el-form-item label="分类名称" prop="categoryName">
|
|
|
+ <el-input v-model="formCreate.categoryName" placeholder="请输入分类名称" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="检查频率" prop="checkCycle">
|
|
|
+ <el-select
|
|
|
+ v-model="formCreate.checkCycle"
|
|
|
+ placeholder="请选择"
|
|
|
+ style="width: 240px"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in checkCycleList"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="描述" prop="description">
|
|
|
+ <el-input v-model="formCreate.description" type="textarea" :autosize="{ minRows: 2, maxRows: 4 }" placeholder="请输入描述" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <template #footer>
|
|
|
+ <div class="dialog-footer">
|
|
|
+ <el-button
|
|
|
+ :loading="createLoading"
|
|
|
+ type="primary"
|
|
|
+ @click="submitCreate"
|
|
|
+ >确 定</el-button>
|
|
|
+ <el-button @click="cancelCreate">取 消</el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <!-- 修改对话框 -->
|
|
|
+ <el-dialog
|
|
|
+ :title="title"
|
|
|
+ v-model="dialogOpenModify"
|
|
|
+ width="750px"
|
|
|
+ append-to-body
|
|
|
+ >
|
|
|
+ <el-form
|
|
|
+ :disabled="isDetail"
|
|
|
+ ref="formModifyRef"
|
|
|
+ :model="formModify"
|
|
|
+ :rules="rulesModify"
|
|
|
+ label-width="135px"
|
|
|
+ >
|
|
|
+ <el-form-item label="分类名称" prop="categoryName">
|
|
|
+ <el-input v-model="formModify.id" type="hidden" />
|
|
|
+ <el-input v-model="formModify.categoryName" placeholder="请输入分类名称" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="检查频率" prop="checkCycle">
|
|
|
+ <el-select
|
|
|
+ v-model="formModify.checkCycle"
|
|
|
+ placeholder="请选择"
|
|
|
+ style="width: 240px"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in checkCycleList"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="描述" prop="description">
|
|
|
+ <el-input v-model="formModify.description" type="textarea" :autosize="{ minRows: 2, maxRows: 4 }" placeholder="请输入描述" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <template #footer>
|
|
|
+ <div class="dialog-footer">
|
|
|
+ <el-button
|
|
|
+ v-if="isDetail === false"
|
|
|
+ :loading="modifyLoading"
|
|
|
+ type="primary"
|
|
|
+ @click="submitModify"
|
|
|
+ >确 定</el-button>
|
|
|
+ <el-button @click="cancelModify">{{cancelModifyTxt}}</el-button>
|
|
|
+ <el-button type="primary" v-if="isDetail" @click="changeModify">编 辑</el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup name="DangerCheckRecord">
|
|
|
+import { deptTreeSelect } from "@/api/system/user";
|
|
|
+import { listAllGridCategory } from "@/api/grid/GridCategory";
|
|
|
+import { listAllDangerCategory } from "@/api/danger/DangerCategory";
|
|
|
+import { listEnumValue } from "@/api/system/base"
|
|
|
+import {
|
|
|
+ submit, detail, modify, search
|
|
|
+} from "@/api/form/DangerCheckRecord";
|
|
|
+
|
|
|
+const { proxy } = getCurrentInstance();
|
|
|
+
|
|
|
+const deptOptions = ref(undefined);
|
|
|
+const gridCategoryList = ref([]);
|
|
|
+const dangerCategoryList = ref([]);
|
|
|
+const checkFormStatusList = ref([]);
|
|
|
+const dataList = ref([]);
|
|
|
+
|
|
|
+const createLoading = ref(false);
|
|
|
+const dialogOpenCreate = ref(false);
|
|
|
+
|
|
|
+const modifyLoading = ref(false);
|
|
|
+const dialogOpenModify = ref(false);
|
|
|
+
|
|
|
+const total = ref(0);
|
|
|
+const dateRangeCheckTime = ref([]);
|
|
|
+const ids = ref([]);
|
|
|
+const single = ref(true);
|
|
|
+const multiple = ref(true);
|
|
|
+const title = ref("");
|
|
|
+const cancelModifyTxt = ref("取 消");
|
|
|
+const isDetail = ref(false);
|
|
|
+
|
|
|
+const queryParams = ref({
|
|
|
+ page: 1,
|
|
|
+ limit: 10,
|
|
|
+ listStatus: undefined,
|
|
|
+ checkTimeRange: "",
|
|
|
+ checkFormNo: undefined,
|
|
|
+ ListGridCategory: undefined,
|
|
|
+ listDangerCategory: undefined,
|
|
|
+ listDepartment: undefined,
|
|
|
+ customs: undefined,
|
|
|
+ hasDanger: 0
|
|
|
+});
|
|
|
+
|
|
|
+const formCreate = ref({});
|
|
|
+const rulesCreate = ref({
|
|
|
+ categoryName: [
|
|
|
+ { required: true, message: "分类名称不能为空", trigger: "blur" },
|
|
|
+ { max: 100, message: '分类名称字符长度不能超过100', trigger: 'blur' }
|
|
|
+ ],
|
|
|
+ description: [{ max: 200, message: '分类描述字符长度不能超过200', trigger: 'blur' }],
|
|
|
+});
|
|
|
+
|
|
|
+const formModify = ref({});
|
|
|
+const rulesModify = ref({
|
|
|
+ categoryName: [
|
|
|
+ { required: true, message: "分类名称不能为空", trigger: "blur" },
|
|
|
+ { max: 100, message: '分类名称字符长度不能超过1200', trigger: 'blur' }
|
|
|
+ ],
|
|
|
+ description: [{ max: 200, message: '分类描述字符长度不能超过500', trigger: 'blur' }],
|
|
|
+});
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+/** 查询列表 */
|
|
|
+function getList() {
|
|
|
+ if (
|
|
|
+ dateRangeCheckTime &&
|
|
|
+ dateRangeCheckTime.value &&
|
|
|
+ dateRangeCheckTime.value[0]
|
|
|
+ ) {
|
|
|
+ queryParams.value.checkTimeRange = dateRangeCheckTime.value.join(" ~ ");
|
|
|
+ }
|
|
|
+ search(queryParams.value).then((response) => {
|
|
|
+ dataList.value = response.data.list;
|
|
|
+ total.value = response.data.total;
|
|
|
+ })
|
|
|
+};
|
|
|
+/** 搜索按钮操作 */
|
|
|
+function handleQuery() {
|
|
|
+ queryParams.value.page = 1;
|
|
|
+ getList();
|
|
|
+}
|
|
|
+/** 重置按钮操作 */
|
|
|
+function resetQuery() {
|
|
|
+ dateRangeCheckTime.value = [];
|
|
|
+ proxy.resetForm("queryRef");
|
|
|
+ handleQuery();
|
|
|
+}
|
|
|
+/** 选择条数 */
|
|
|
+function handleSelectionChange(selection) {
|
|
|
+ ids.value = selection.map((item) => item.id);
|
|
|
+ single.value = selection.length != 1;
|
|
|
+ multiple.value = !selection.length;
|
|
|
+}
|
|
|
+/** 取消新增按钮 */
|
|
|
+function cancelCreate() {
|
|
|
+ dialogOpenCreate.value = false;
|
|
|
+ resetCreate();
|
|
|
+}
|
|
|
+/** 新增表单重置 */
|
|
|
+function resetCreate() {
|
|
|
+ formCreate.value = {
|
|
|
+ categoryName: undefined,
|
|
|
+ description: undefined,
|
|
|
+ };
|
|
|
+ proxy.resetForm("formCrateRef");
|
|
|
+}
|
|
|
+/** 新增按钮 */
|
|
|
+function handleAdd() {
|
|
|
+ resetCreate();
|
|
|
+ dialogOpenCreate.value = true;
|
|
|
+ title.value = "提交隐患检查";
|
|
|
+}
|
|
|
+/** 新增提交 */
|
|
|
+function submitCreate() {
|
|
|
+ proxy.$refs["formCrateRef"].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ createLoading.value = true;
|
|
|
+
|
|
|
+ create(formCreate.value)
|
|
|
+ .then((response) => {
|
|
|
+ proxy.$modal.msgSuccess("提交成功");
|
|
|
+ dialogOpenCreate.value = false;
|
|
|
+ getList();
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ createLoading.value = false;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+}
|
|
|
+/** 取消编辑按钮 */
|
|
|
+function cancelModify() {
|
|
|
+ dialogOpenModify.value = false;
|
|
|
+ resetModify();
|
|
|
+}
|
|
|
+/** 编辑表单重置 */
|
|
|
+function resetModify() {
|
|
|
+ formModify.value = {
|
|
|
+ id: undefined,
|
|
|
+ categoryName: undefined,
|
|
|
+ description: undefined,
|
|
|
+ };
|
|
|
+ proxy.resetForm("formModifyRef");
|
|
|
+}
|
|
|
+/** 详情按钮 */
|
|
|
+function handleDetail(row) {
|
|
|
+ modifyLoading.value = true;
|
|
|
+ resetModify();
|
|
|
+ const id = row.id || ids.value[0];
|
|
|
+ detail(id).then((response) => {
|
|
|
+ isDetail.value = true;
|
|
|
+ modifyLoading.value = false;
|
|
|
+
|
|
|
+ formModify.value = response.data;
|
|
|
+ formModify.value.checkCycle = formModify.value.checkCycle + '';
|
|
|
+
|
|
|
+ dialogOpenModify.value = true;
|
|
|
+ title.value = "隐患检查单";
|
|
|
+ cancelModifyTxt.value = '关 闭';
|
|
|
+ });
|
|
|
+}
|
|
|
+/** 详情编辑 */
|
|
|
+function changeModify() {
|
|
|
+ isDetail.value = false;
|
|
|
+ title.value = "修改隐患检查单";
|
|
|
+}
|
|
|
+/** 修改按钮 */
|
|
|
+function handleUpdate(row) {
|
|
|
+ modifyLoading.value = true;
|
|
|
+ resetModify();
|
|
|
+ const id = row.id || ids.value[0];
|
|
|
+ detail(id).then((response) => {
|
|
|
+ isDetail.value = false;
|
|
|
+ modifyLoading.value = false;
|
|
|
+
|
|
|
+ formModify.value = response.data;
|
|
|
+ formModify.value.checkCycle = formModify.value.checkCycle + '';
|
|
|
+
|
|
|
+ dialogOpenModify.value = true;
|
|
|
+ title.value = "修改隐患检查单";
|
|
|
+ cancelModifyTxt.value = '取 消';
|
|
|
+ });
|
|
|
+}
|
|
|
+/** 修改提交 */
|
|
|
+function submitModify() {
|
|
|
+ proxy.$refs["formModifyRef"].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ modifyLoading.value = true;
|
|
|
+
|
|
|
+ modify(formModify.value)
|
|
|
+ .then((response) => {
|
|
|
+ proxy.$modal.msgSuccess("修改成功");
|
|
|
+ dialogOpenModify.value = false;
|
|
|
+ getList();
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ modifyLoading.value = false;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+function getStatusTxt(status) {
|
|
|
+ let find = checkFormStatusList.value.filter(c => c.value === status);
|
|
|
+ if (find) {
|
|
|
+ return find.Label;
|
|
|
+ }
|
|
|
+ return '未知';
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+/** 获取检查单状态下拉树结构 */
|
|
|
+function getCheckFormStatus() {
|
|
|
+ listEnumValue('ECheckFormStatus').then(response => {
|
|
|
+ checkFormStatusList.value = response.data;
|
|
|
+ });
|
|
|
+};
|
|
|
+/** 查询部门下拉树结构 */
|
|
|
+function getDeptTree() {
|
|
|
+ deptTreeSelect().then(response => {
|
|
|
+ deptOptions.value = response.data;
|
|
|
+ });
|
|
|
+};
|
|
|
+/** 初始化网格类型下拉框数据 */
|
|
|
+function initListGridCategory() {
|
|
|
+ listAllGridCategory().then((response) => {
|
|
|
+ gridCategoryList.value = response.data;
|
|
|
+ });
|
|
|
+}
|
|
|
+/** 初始化隐患分类下拉框数据 */
|
|
|
+function initListDangerCategory() {
|
|
|
+ listAllDangerCategory().then((response) => {
|
|
|
+ dangerCategoryList.value = response.data;
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+// 调用获取检查单状态下拉树结构
|
|
|
+getCheckFormStatus();
|
|
|
+// 调用初始化部门下拉框数据
|
|
|
+getDeptTree();
|
|
|
+// 调用初始化网格类型下拉框数据
|
|
|
+initListGridCategory();
|
|
|
+// 调用初始化隐患分类下拉框数据
|
|
|
+initListDangerCategory();
|
|
|
+// 调用列表查询
|
|
|
+getList();
|
|
|
+</script>
|