|
@@ -0,0 +1,430 @@
|
|
|
+<template>
|
|
|
+ <div class="mainContentBox">
|
|
|
+ <avue-crud
|
|
|
+ ref="crudRef"
|
|
|
+ v-model:search="search"
|
|
|
+ v-model="form"
|
|
|
+ :data="data"
|
|
|
+ :option="option"
|
|
|
+ v-model:page="page"
|
|
|
+ @row-save="createRow"
|
|
|
+ @row-update="updateRow"
|
|
|
+ @row-del="deleteRow"
|
|
|
+ @search-change="searchChange"
|
|
|
+ @search-reset="resetChange"
|
|
|
+ @size-change="dataList"
|
|
|
+ @current-change="dataList"
|
|
|
+ @selection-change="selectionChange"
|
|
|
+ >
|
|
|
+ <template #menu-left="{ size }">
|
|
|
+ <el-button
|
|
|
+ :disabled="toDeleteIds.length < 1"
|
|
|
+ type="danger"
|
|
|
+ icon="el-icon-delete"
|
|
|
+ :size="size"
|
|
|
+ v-hasPerm="[ButtonPermKeys.DEVICE.BTNS.repair_del]"
|
|
|
+ @click="multipleDelete"
|
|
|
+ >删除</el-button
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ <template #menu="{ size, row, index }">
|
|
|
+ <!-- <el-button
|
|
|
+ @click="maintenance(row, 0)"
|
|
|
+ icon="el-icon-check"
|
|
|
+ text
|
|
|
+ type="primary"
|
|
|
+ :size="size"
|
|
|
+ >流程</el-button
|
|
|
+ > -->
|
|
|
+ <!-- <el-button @click="maintenance(row,1)"
|
|
|
+ icon="el-icon-fold"
|
|
|
+ text
|
|
|
+ type="primary"
|
|
|
+ :size="size">记录</el-button>-->
|
|
|
+ </template>
|
|
|
+ </avue-crud>
|
|
|
+ <el-dialog
|
|
|
+ v-model="dialog.visible"
|
|
|
+ :title="dialog.title"
|
|
|
+ width="850px"
|
|
|
+ @close="dialog.visible = false"
|
|
|
+ >
|
|
|
+ <device-page @device-info="deviceInfo" />
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <el-dialog
|
|
|
+ v-model="dialog1.visible"
|
|
|
+ :title="dialog1.title"
|
|
|
+ width="750px"
|
|
|
+ height="80%"
|
|
|
+ @close="dialog1.visible = false"
|
|
|
+ >
|
|
|
+ <el-timeline style="max-width: 500px; margin-left: 100px">
|
|
|
+ <el-timeline-item center type="success" placement="top">
|
|
|
+ <el-card>
|
|
|
+ <h4>设备报故</h4>
|
|
|
+ <p>设备编号: {{ maintenanceInfo.deviceNo }}</p>
|
|
|
+ <p>设备名称: {{ maintenanceInfo.deviceName }}</p>
|
|
|
+ <p>报故人员: {{ maintenanceInfo.creator }}</p>
|
|
|
+ <p>故障描述: {{ maintenanceInfo.bugRemark }}</p>
|
|
|
+ <p>报故时间: {{ maintenanceInfo.created }}</p>
|
|
|
+ </el-card>
|
|
|
+ </el-timeline-item>
|
|
|
+ <el-timeline-item
|
|
|
+ center
|
|
|
+ placement="top"
|
|
|
+ :type="maintenanceInfo.state === 0 ? 'primary' : 'success'"
|
|
|
+ >
|
|
|
+ <el-card v-if="viewPage">
|
|
|
+ <h4>设备维修</h4>
|
|
|
+ <p>维修人员: {{ maintenanceInfo.handleUser }}</p>
|
|
|
+ <p>维修内容: {{ maintenanceInfo.handleContent }}</p>
|
|
|
+ <p>
|
|
|
+ 处理结果:
|
|
|
+ {{
|
|
|
+ maintenanceInfo.handleUser
|
|
|
+ ? maintenanceInfo.handleResult === 0
|
|
|
+ ? "可正常运行"
|
|
|
+ : "报废"
|
|
|
+ : ""
|
|
|
+ }}
|
|
|
+ </p>
|
|
|
+ </el-card>
|
|
|
+ <el-card v-if="!viewPage">
|
|
|
+ <h4>设备维修</h4>
|
|
|
+ <el-form
|
|
|
+ ref="maintenanceInfoForm1"
|
|
|
+ :model="maintenanceInfo"
|
|
|
+ label-width="auto"
|
|
|
+ style="max-width: 400px"
|
|
|
+ :rules="rules1"
|
|
|
+ >
|
|
|
+ <el-form-item label="维修人员" prop="handleUser">
|
|
|
+ <!-- <el-input :disabled="maintenanceInfo.state !== 0" v-model="maintenanceInfo.handleUser" />-->
|
|
|
+ <el-select
|
|
|
+ v-model="maintenanceInfo.handleUser"
|
|
|
+ placeholder="维修人员"
|
|
|
+ :disabled="maintenanceInfo.state !== 0"
|
|
|
+ size="large"
|
|
|
+ filterable
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in userList"
|
|
|
+ :key="item.userName"
|
|
|
+ :label="item.userName"
|
|
|
+ :value="item.userName"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="维修内容" prop="handleContent">
|
|
|
+ <el-input
|
|
|
+ :disabled="maintenanceInfo.state !== 0"
|
|
|
+ type="textarea"
|
|
|
+ :rows="2"
|
|
|
+ v-model="maintenanceInfo.handleContent"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="处理结果">
|
|
|
+ <el-radio-group
|
|
|
+ :disabled="maintenanceInfo.state !== 0"
|
|
|
+ v-model="maintenanceInfo.handleResult"
|
|
|
+ class="ml-4"
|
|
|
+ >
|
|
|
+ <el-radio :value="0">可正常运行</el-radio>
|
|
|
+ <el-radio :value="1">报废</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item style="margin-left: 45%">
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ v-if="maintenanceInfo.state === 0"
|
|
|
+ v-hasPerm="[ButtonPermKeys.DEVICE.BTNS.repair_repair]"
|
|
|
+ :disabled="maintenanceInfo.state !== 0"
|
|
|
+ @click="maintenanceSubmit1"
|
|
|
+ >维修</el-button
|
|
|
+ >
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-card>
|
|
|
+ </el-timeline-item>
|
|
|
+ <el-timeline-item
|
|
|
+ center
|
|
|
+ placement="top"
|
|
|
+ :type="
|
|
|
+ maintenanceInfo.state === 1
|
|
|
+ ? 'primary'
|
|
|
+ : maintenanceInfo.state === 0
|
|
|
+ ? 'info'
|
|
|
+ : 'success'
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <el-card v-if="viewPage">
|
|
|
+ <h4>设备审批</h4>
|
|
|
+ <p>审批人员: {{ maintenanceInfo.auditUser }}</p>
|
|
|
+ <p>
|
|
|
+ 审批结果:
|
|
|
+ {{
|
|
|
+ maintenanceInfo.auditUser
|
|
|
+ ? maintenanceInfo.auditResult === 0
|
|
|
+ ? "通过"
|
|
|
+ : "不通过"
|
|
|
+ : ""
|
|
|
+ }}
|
|
|
+ </p>
|
|
|
+ </el-card>
|
|
|
+ <el-card v-if="!viewPage">
|
|
|
+ <h4>设备审批</h4>
|
|
|
+ <el-form
|
|
|
+ ref="maintenanceInfoForm2"
|
|
|
+ v-if="maintenanceInfo.state >= 1"
|
|
|
+ :model="maintenanceInfo"
|
|
|
+ label-width="auto"
|
|
|
+ style="max-width: 400px"
|
|
|
+ :rules="rules2"
|
|
|
+ >
|
|
|
+ <el-form-item label="审批人员" prop="auditUser">
|
|
|
+ <!-- <el-input :disabled="maintenanceInfo.state !== 1 && readonly" v-model="maintenanceInfo.auditUser" />-->
|
|
|
+ <el-select
|
|
|
+ v-model="maintenanceInfo.auditUser"
|
|
|
+ placeholder="审批人员"
|
|
|
+ :disabled="maintenanceInfo.state !== 1 && readonly"
|
|
|
+ size="large"
|
|
|
+ filterable
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in userList"
|
|
|
+ :key="item.userName"
|
|
|
+ :label="item.userName"
|
|
|
+ :value="item.userName"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="审批结果">
|
|
|
+ <el-radio-group
|
|
|
+ :disabled="maintenanceInfo.state !== 1 && readonly"
|
|
|
+ v-model="maintenanceInfo.auditResult"
|
|
|
+ class="ml-4"
|
|
|
+ >
|
|
|
+ <el-radio :value="0">通过</el-radio>
|
|
|
+ <el-radio :value="1">不通过</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item style="margin-left: 45%">
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ v-if="maintenanceInfo.state === 1"
|
|
|
+ v-hasPerm="[ButtonPermKeys.DEVICE.BTNS.repair_audit]"
|
|
|
+ :disabled="maintenanceInfo.state !== 1"
|
|
|
+ @click="maintenanceSubmit2"
|
|
|
+ >审批</el-button
|
|
|
+ >
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-card>
|
|
|
+ </el-timeline-item>
|
|
|
+ </el-timeline>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script setup>
|
|
|
+import { ref, getCurrentInstance } from "vue";
|
|
|
+import { useCrud } from "@/hooks/userCrud";
|
|
|
+import ButtonPermKeys from "@/common/configs/buttonPermission";
|
|
|
+import { checkPerm } from "@/directive/permission";
|
|
|
+import { getUserList } from "@/api/system/user";
|
|
|
+import { repair, audit } from "@/api/device/index";
|
|
|
+import { useCommonStoreHook } from "@/store";
|
|
|
+import dictDataUtil from "@/common/configs/dictDataUtil";
|
|
|
+const { isShowTable, tableType } = toRefs(useCommonStoreHook());
|
|
|
+const test = () => {
|
|
|
+ isShowTable.value = true;
|
|
|
+ tableType.value = tableType.value == 1 ? 2 : 1;
|
|
|
+};
|
|
|
+const permission = reactive({
|
|
|
+ delBtn: checkPerm(ButtonPermKeys.DEVICE.BTNS.repair_del),
|
|
|
+ addBtn: checkPerm(ButtonPermKeys.DEVICE.BTNS.repair_add),
|
|
|
+ editBtn: checkPerm(ButtonPermKeys.DEVICE.BTNS.repair_edit),
|
|
|
+ menu: true,
|
|
|
+});
|
|
|
+const viewPage = ref(true);
|
|
|
+
|
|
|
+const dialog = reactive({
|
|
|
+ title: "设备选择",
|
|
|
+ visible: false,
|
|
|
+});
|
|
|
+const dialog1 = reactive({
|
|
|
+ title: "设备维修",
|
|
|
+ visible: false,
|
|
|
+});
|
|
|
+const userList = ref([]);
|
|
|
+// 传入一个url,后面不带/
|
|
|
+const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
|
|
|
+ useCrud({
|
|
|
+ src: "/api/v1/device/repair",
|
|
|
+ });
|
|
|
+const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } =
|
|
|
+ Methords; //增删改查
|
|
|
+const { selectionChange, multipleDelete } = Methords; //选中和批量删除事件
|
|
|
+const { checkBtnPerm, downloadTemplate, exportData } = Utils; //按钮权限等工具
|
|
|
+const crudRef = ref(null); //crudRef.value 获取avue-crud对象
|
|
|
+const deviceInfo = (value) => {
|
|
|
+ form.value.deviceNo = value.deviceNo;
|
|
|
+ form.value.deviceName = value.deviceName;
|
|
|
+ form.value.deviceType = value.deviceType;
|
|
|
+ form.value.devicePosition = value.devicePosition;
|
|
|
+ dialog.visible = false;
|
|
|
+};
|
|
|
+const maintenanceInfo = ref(null);
|
|
|
+const maintenance = (row, type) => {
|
|
|
+ viewPage.value = type === 0 ? false : true;
|
|
|
+ maintenanceInfo.value = row;
|
|
|
+ maintenanceInfo.value.handResult = 0;
|
|
|
+ dialog1.visible = true;
|
|
|
+};
|
|
|
+const queryUserList = () => {
|
|
|
+ getUserList({}).then((data) => {
|
|
|
+ userList.value = data.data;
|
|
|
+ });
|
|
|
+};
|
|
|
+const maintenanceInfoForm1 = ref("maintenanceInfoForm1");
|
|
|
+const maintenanceInfoForm2 = ref("maintenanceInfoForm2");
|
|
|
+const maintenanceSubmit1 = () => {
|
|
|
+ //alert(JSON.stringify(maintenanceInfo.value))
|
|
|
+ maintenanceInfoForm1.value.validate((isValid, invalidFields) => {
|
|
|
+ if (isValid) {
|
|
|
+ repair(maintenanceInfo.value).then((data) => {
|
|
|
+ ElMessage({
|
|
|
+ message: data.msg,
|
|
|
+ type: "success",
|
|
|
+ });
|
|
|
+ dialog1.visible = false;
|
|
|
+ dataList();
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+};
|
|
|
+const maintenanceSubmit2 = () => {
|
|
|
+ //alert(JSON.stringify(maintenanceInfo.value))
|
|
|
+ maintenanceInfoForm2.value.validate((isValid, invalidFields) => {
|
|
|
+ if (isValid) {
|
|
|
+ audit(maintenanceInfo.value).then((data) => {
|
|
|
+ ElMessage({
|
|
|
+ message: data.msg,
|
|
|
+ type: "success",
|
|
|
+ });
|
|
|
+ dialog1.visible = false;
|
|
|
+ dataList();
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+};
|
|
|
+const rules1 = reactive({
|
|
|
+ handleUser: [
|
|
|
+ { required: true, message: "维修人员不能为空", trigger: "blur" },
|
|
|
+ ],
|
|
|
+ handleContent: [
|
|
|
+ { required: true, message: "维修内容不能为空", trigger: "blur" },
|
|
|
+ ],
|
|
|
+});
|
|
|
+const rules2 = reactive({
|
|
|
+ auditUser: [{ required: true, message: "审批人员不能为空", trigger: "blur" }],
|
|
|
+});
|
|
|
+// 设置表格列或者其他自定义的option
|
|
|
+option.value = Object.assign(option.value, {
|
|
|
+ delBtn: false,
|
|
|
+ selection: true,
|
|
|
+ labelWidth: 150,
|
|
|
+ viewBtn: false,
|
|
|
+ editBtn: false,
|
|
|
+ column: [
|
|
|
+ {
|
|
|
+ label: "设备编号",
|
|
|
+ prop: "deviceNo",
|
|
|
+ search: true,
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "设备编号不能为空",
|
|
|
+ trigger: "trigger",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ click: ({ value, column }) => {
|
|
|
+ if (column.boxType) {
|
|
|
+ dialog.visible = true;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "设备名称",
|
|
|
+ prop: "deviceName",
|
|
|
+ addDisabled: true,
|
|
|
+ search: true,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "设备类型",
|
|
|
+ prop: "deviceType",
|
|
|
+ type: "select",
|
|
|
+ addDisabled: true,
|
|
|
+ search: true,
|
|
|
+ dicUrl: dictDataUtil.request_url + dictDataUtil.TYPE_CODE.device_type,
|
|
|
+ props: {
|
|
|
+ label: "dictLabel",
|
|
|
+ value: "dictValue",
|
|
|
+ },
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "设备类型不能为空",
|
|
|
+ trigger: "trigger",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "设备位置",
|
|
|
+ addDisabled: true,
|
|
|
+ prop: "devicePosition",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "故障描述",
|
|
|
+ prop: "bugRemark",
|
|
|
+ minRows: 2, //最小行/最小值
|
|
|
+ type: "textarea", //类型为多行文本域框
|
|
|
+ maxlength: 512, //最大输入长度,
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "故障描述不能为空",
|
|
|
+ trigger: "trigger",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "维修状态",
|
|
|
+ prop: "state",
|
|
|
+ type: "select",
|
|
|
+ display: false,
|
|
|
+ dicData: [
|
|
|
+ { label: "待维修", value: 0 },
|
|
|
+ { label: "待审批 ", value: 1 },
|
|
|
+ { label: "已完成", value: 2 },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "报故人",
|
|
|
+ prop: "creator",
|
|
|
+ display: false,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "报故日期",
|
|
|
+ prop: "created",
|
|
|
+ width: "180",
|
|
|
+ display: false,
|
|
|
+ },
|
|
|
+ ],
|
|
|
+});
|
|
|
+
|
|
|
+onMounted(() => {
|
|
|
+ dataList();
|
|
|
+ queryUserList();
|
|
|
+});
|
|
|
+</script>
|