|
@@ -1,21 +1,21 @@
|
|
|
<template>
|
|
|
<div class="mainContentBox">
|
|
|
<avue-crud
|
|
|
- ref="crudRef"
|
|
|
- v-model:search="search"
|
|
|
- v-model="form"
|
|
|
- :data="data"
|
|
|
- :option="option"
|
|
|
- :permission="permission"
|
|
|
- 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"
|
|
|
+ ref="crudRef"
|
|
|
+ v-model:search="search"
|
|
|
+ v-model="form"
|
|
|
+ :data="data"
|
|
|
+ :option="option"
|
|
|
+ :permission="permission"
|
|
|
+ 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
|
|
@@ -28,87 +28,122 @@
|
|
|
>删除</el-button
|
|
|
>
|
|
|
</template>
|
|
|
- <template #menu="{size,row,index}">
|
|
|
- <el-button @click="maintenance(row)"
|
|
|
- icon="el-icon-setting"
|
|
|
- text
|
|
|
- v-hasPerm="[ButtonPermKeys.DEVICE.BTNS.maintenance_handle]"
|
|
|
- v-if="row.type === '1' && row.state === 0 && Date.parse(row.nextTime) <= new Date()"
|
|
|
- type="primary"
|
|
|
- :size="size">维护</el-button>
|
|
|
- <el-button disabled
|
|
|
- icon="el-icon-setting"
|
|
|
- text
|
|
|
- v-hasPerm="[ButtonPermKeys.DEVICE.BTNS.maintenance_handle]"
|
|
|
- v-if="row.type === '1' && row.state === 1 && Date.parse(row.nextTime) <= new Date()"
|
|
|
- type="primary"
|
|
|
- :size="size">维护</el-button>
|
|
|
- <el-button @click="maintenanceList(row)"
|
|
|
- icon="el-icon-fold"
|
|
|
- text
|
|
|
- type="primary"
|
|
|
- :size="size">记录</el-button>
|
|
|
+ <template #menu="{ size, row, index }">
|
|
|
+ <el-button
|
|
|
+ @click="maintenance(row)"
|
|
|
+ icon="el-icon-setting"
|
|
|
+ text
|
|
|
+ v-hasPerm="[ButtonPermKeys.DEVICE.BTNS.maintenance_handle]"
|
|
|
+ v-if="
|
|
|
+ row.type === '1' &&
|
|
|
+ row.state === 0 &&
|
|
|
+ Date.parse(row.nextTime) <= new Date()
|
|
|
+ "
|
|
|
+ type="primary"
|
|
|
+ :size="size"
|
|
|
+ >维护</el-button
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ disabled
|
|
|
+ icon="el-icon-setting"
|
|
|
+ text
|
|
|
+ v-hasPerm="[ButtonPermKeys.DEVICE.BTNS.maintenance_handle]"
|
|
|
+ v-if="
|
|
|
+ row.type === '1' &&
|
|
|
+ row.state === 1 &&
|
|
|
+ Date.parse(row.nextTime) <= new Date()
|
|
|
+ "
|
|
|
+ type="primary"
|
|
|
+ :size="size"
|
|
|
+ >维护</el-button
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ @click="maintenanceList(row)"
|
|
|
+ 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"
|
|
|
+ v-model="dialog.visible"
|
|
|
+ :title="dialog.title"
|
|
|
+ width="850px"
|
|
|
+ @close="dialog.visible = false"
|
|
|
>
|
|
|
- <device-page @deviceInfo="deviceInfo"/>
|
|
|
+ <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">
|
|
|
+ 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 color="#0bbd87" type="success" placement="top">
|
|
|
<el-card>
|
|
|
<h4>保养计划</h4>
|
|
|
- <p>设备编号: {{maintenanceInfo.deviceNo}}</p>
|
|
|
- <p>设备名称:{{maintenanceInfo.deviceName}}</p>
|
|
|
- <p>保养内容:{{maintenanceInfo.remark}}</p>
|
|
|
- <p>计划时间:{{maintenanceInfo.nextTime}}</p>
|
|
|
+ <p>设备编号: {{ maintenanceInfo.deviceNo }}</p>
|
|
|
+ <p>设备名称:{{ maintenanceInfo.deviceName }}</p>
|
|
|
+ <p>保养内容:{{ maintenanceInfo.remark }}</p>
|
|
|
+ <p>计划时间:{{ maintenanceInfo.nextTime }}</p>
|
|
|
</el-card>
|
|
|
</el-timeline-item>
|
|
|
- <el-timeline-item center placement="top" :type="maintenanceInfo.state === 0 ? 'primary' : 'success'">
|
|
|
+ <el-timeline-item
|
|
|
+ center
|
|
|
+ placement="top"
|
|
|
+ :type="maintenanceInfo.state === 0 ? 'primary' : 'success'"
|
|
|
+ >
|
|
|
<el-card>
|
|
|
<h4>设备保养</h4>
|
|
|
- <el-form ref="maintenanceInfoForm" :model="maintenanceInfo" label-width="auto" style="max-width: 400px" :rules="rules">
|
|
|
- <el-form-item v-if="maintenanceInfo.result === 0" label="保养项目" prop="maintenanceContent">
|
|
|
- <el-input v-model="maintenanceInfo.maintenanceContent" type="textarea" />
|
|
|
+ <el-form
|
|
|
+ ref="maintenanceInfoForm"
|
|
|
+ :model="maintenanceInfo"
|
|
|
+ label-width="auto"
|
|
|
+ style="max-width: 400px"
|
|
|
+ :rules="rules"
|
|
|
+ >
|
|
|
+ <el-form-item
|
|
|
+ v-if="maintenanceInfo.result === 0"
|
|
|
+ label="保养项目"
|
|
|
+ prop="maintenanceContent"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ v-model="maintenanceInfo.maintenanceContent"
|
|
|
+ type="textarea"
|
|
|
+ />
|
|
|
</el-form-item>
|
|
|
<el-form-item label="维护人" prop="userName">
|
|
|
-
|
|
|
<el-select
|
|
|
- v-model="maintenanceInfo.userName"
|
|
|
- placeholder="维护人"
|
|
|
- size="large"
|
|
|
- style="width: 240px">
|
|
|
+ v-model="maintenanceInfo.userName"
|
|
|
+ placeholder="维护人"
|
|
|
+ size="large"
|
|
|
+ style="width: 240px"
|
|
|
+ >
|
|
|
<el-option
|
|
|
- v-for="item in userList"
|
|
|
- :key="item.userName"
|
|
|
- :label="item.userName"
|
|
|
- :value="item.userName"
|
|
|
+ v-for="item in userList"
|
|
|
+ :key="item.userName"
|
|
|
+ :label="item.userName"
|
|
|
+ :value="item.userName"
|
|
|
/>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="确认人" prop="confirmUser">
|
|
|
-
|
|
|
<el-select
|
|
|
- v-model="maintenanceInfo.confirmUser"
|
|
|
- placeholder="确认人"
|
|
|
- size="large"
|
|
|
- style="width: 240px">
|
|
|
+ v-model="maintenanceInfo.confirmUser"
|
|
|
+ placeholder="确认人"
|
|
|
+ size="large"
|
|
|
+ style="width: 240px"
|
|
|
+ >
|
|
|
<el-option
|
|
|
- v-for="item in userList"
|
|
|
- :key="item.userName"
|
|
|
- :label="item.userName"
|
|
|
- :value="item.userName"
|
|
|
+ v-for="item in userList"
|
|
|
+ :key="item.userName"
|
|
|
+ :label="item.userName"
|
|
|
+ :value="item.userName"
|
|
|
/>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
@@ -118,19 +153,31 @@
|
|
|
<el-radio :value="1">报故</el-radio>
|
|
|
</el-radio-group>
|
|
|
</el-form-item>
|
|
|
- <el-form-item v-if="maintenanceInfo.result === 1" label="报故内容">
|
|
|
+ <el-form-item
|
|
|
+ v-if="maintenanceInfo.result === 1"
|
|
|
+ label="报故内容"
|
|
|
+ >
|
|
|
<el-input v-model="maintenanceInfo.maintenanceContent" />
|
|
|
</el-form-item>
|
|
|
|
|
|
-
|
|
|
- <el-form-item v-if="maintenanceInfo.result === 0" label="下次维护日期">
|
|
|
- <el-input v-model="maintenanceInfo.nextTime" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD"/>
|
|
|
- </el-form-item>
|
|
|
-<!-- <el-form-item v-if="maintenanceInfo.result === 0" label="下次维护内容">
|
|
|
+ <el-form-item
|
|
|
+ v-if="maintenanceInfo.result === 0"
|
|
|
+ label="下次维护日期"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ v-model="maintenanceInfo.nextTime"
|
|
|
+ type="date"
|
|
|
+ format="YYYY-MM-DD"
|
|
|
+ value-format="YYYY-MM-DD"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <!-- <el-form-item v-if="maintenanceInfo.result === 0" label="下次维护内容">
|
|
|
<el-input v-model="maintenanceInfo.maintenanceContent" />
|
|
|
</el-form-item>-->
|
|
|
<el-form-item style="margin-left: 45%">
|
|
|
- <el-button type="primary" @click="maintenanceSubmit">保存</el-button>
|
|
|
+ <el-button type="primary" @click="maintenanceSubmit"
|
|
|
+ >保存</el-button
|
|
|
+ >
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
</el-card>
|
|
@@ -139,13 +186,13 @@
|
|
|
</el-dialog>
|
|
|
|
|
|
<el-dialog
|
|
|
- v-model="dialog2.visible"
|
|
|
- :title="dialog2.title"
|
|
|
- width="60%"
|
|
|
- height="80%"
|
|
|
- @close="dialog2.visible = false"
|
|
|
+ v-model="dialog2.visible"
|
|
|
+ :title="dialog2.title"
|
|
|
+ width="60%"
|
|
|
+ height="80%"
|
|
|
+ @close="dialog2.visible = false"
|
|
|
>
|
|
|
- <record-page :maintenance="clickRecord"></record-page>
|
|
|
+ <record-page :maintenance="clickRecord" />
|
|
|
</el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
@@ -153,8 +200,8 @@
|
|
|
import { ref, getCurrentInstance } from "vue";
|
|
|
import { useCrud } from "@/hooks/userCrud";
|
|
|
import ButtonPermKeys from "@/common/configs/buttonPermission";
|
|
|
-import {getUserList} from "@/api/system/user"
|
|
|
-import {maintenanceUpdate} from "@/api/device/index";
|
|
|
+import { getUserList } from "@/api/system/user";
|
|
|
+import { maintenanceUpdate } from "@/api/device/index";
|
|
|
import { useCommonStoreHook } from "@/store";
|
|
|
import dictDataUtil from "@/common/configs/dictDataUtil";
|
|
|
import RecordPage from "./components/record-page.vue";
|
|
@@ -182,77 +229,78 @@ const dialog2 = reactive({
|
|
|
title: "设备保养记录",
|
|
|
visible: false,
|
|
|
});
|
|
|
-const userList = ref([])
|
|
|
+const userList = ref([]);
|
|
|
// 传入一个url,后面不带/
|
|
|
const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
|
|
|
useCrud({
|
|
|
src: "/api/v1/device/maintenance",
|
|
|
});
|
|
|
-const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } = Methords; //增删改查
|
|
|
+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
|
|
|
- dialog.visible = false
|
|
|
-}
|
|
|
-const maintenanceInfo = ref(null)
|
|
|
-const clickRecord = ref(null)
|
|
|
-const maintenance = (row)=>{
|
|
|
- maintenanceInfo.value = row
|
|
|
- maintenanceInfo.value.maintenanceContent = row.remark
|
|
|
- maintenanceInfo.value.result = 0
|
|
|
- dialog1.visible = true
|
|
|
-}
|
|
|
-const maintenanceList = (row)=>{
|
|
|
- clickRecord.value = row
|
|
|
- dialog2.visible = true
|
|
|
-}
|
|
|
-const queryUserList = ()=>{
|
|
|
- getUserList({}).then((data)=>{
|
|
|
- userList.value = data.data
|
|
|
- })
|
|
|
-}
|
|
|
-const maintenanceInfoForm = ref('maintenanceInfoForm')
|
|
|
-const maintenanceSubmit =()=>{
|
|
|
+ form.value.deviceNo = value.deviceNo;
|
|
|
+ dialog.visible = false;
|
|
|
+};
|
|
|
+const maintenanceInfo = ref(null);
|
|
|
+const clickRecord = ref(null);
|
|
|
+const maintenance = (row) => {
|
|
|
+ maintenanceInfo.value = row;
|
|
|
+ maintenanceInfo.value.maintenanceContent = row.remark;
|
|
|
+ maintenanceInfo.value.result = 0;
|
|
|
+ dialog1.visible = true;
|
|
|
+};
|
|
|
+const maintenanceList = (row) => {
|
|
|
+ clickRecord.value = row;
|
|
|
+ dialog2.visible = true;
|
|
|
+};
|
|
|
+const queryUserList = () => {
|
|
|
+ getUserList({}).then((data) => {
|
|
|
+ userList.value = data.data;
|
|
|
+ });
|
|
|
+};
|
|
|
+const maintenanceInfoForm = ref("maintenanceInfoForm");
|
|
|
+const maintenanceSubmit = () => {
|
|
|
//alert(JSON.stringify(maintenanceInfo.value))
|
|
|
maintenanceInfoForm.value.validate((isValid, invalidFields) => {
|
|
|
if (isValid) {
|
|
|
- maintenanceUpdate(maintenanceInfo.value).then((data)=>{
|
|
|
+ maintenanceUpdate(maintenanceInfo.value).then((data) => {
|
|
|
ElMessage({
|
|
|
message: data.msg,
|
|
|
type: "success",
|
|
|
});
|
|
|
//maintenanceInfo.value = null
|
|
|
- dialog1.visible = false
|
|
|
- dataList()
|
|
|
- })
|
|
|
+ dialog1.visible = false;
|
|
|
+ dataList();
|
|
|
+ });
|
|
|
}
|
|
|
- })
|
|
|
-}
|
|
|
+ });
|
|
|
+};
|
|
|
const rules = reactive({
|
|
|
userName: [
|
|
|
// required是否必填,message不符合此规则时的提示信息,
|
|
|
// trigger触发此条规则校验的时机,有两个值, blur 或 change,默认就是blur和change都会进行校验
|
|
|
// min此字段的最小长度,max此字段的最大长度
|
|
|
// pattern 正则表达式
|
|
|
- { required: true, message: '维护人不能为空', trigger: 'blur' }
|
|
|
+ { required: true, message: "维护人不能为空", trigger: "blur" },
|
|
|
],
|
|
|
confirmUser: [
|
|
|
// required是否必填,message不符合此规则时的提示信息,
|
|
|
// trigger触发此条规则校验的时机,有两个值, blur 或 change,默认就是blur和change都会进行校验
|
|
|
// min此字段的最小长度,max此字段的最大长度
|
|
|
// pattern 正则表达式
|
|
|
- { required: true, message: '确认人不能为空', trigger: 'blur' }
|
|
|
+ { required: true, message: "确认人不能为空", trigger: "blur" },
|
|
|
],
|
|
|
maintenanceContent: [
|
|
|
- // required是否必填,message不符合此规则时的提示信息,
|
|
|
- // trigger触发此条规则校验的时机,有两个值, blur 或 change,默认就是blur和change都会进行校验
|
|
|
- // min此字段的最小长度,max此字段的最大长度
|
|
|
- // pattern 正则表达式
|
|
|
- { required: true, message: '保养项目不能为空', trigger: 'blur' }
|
|
|
-]
|
|
|
-})
|
|
|
+ // required是否必填,message不符合此规则时的提示信息,
|
|
|
+ // trigger触发此条规则校验的时机,有两个值, blur 或 change,默认就是blur和change都会进行校验
|
|
|
+ // min此字段的最小长度,max此字段的最大长度
|
|
|
+ // pattern 正则表达式
|
|
|
+ { required: true, message: "保养项目不能为空", trigger: "blur" },
|
|
|
+ ],
|
|
|
+});
|
|
|
// 设置表格列或者其他自定义的option
|
|
|
option.value = Object.assign(option.value, {
|
|
|
delBtn: false,
|
|
@@ -271,11 +319,9 @@ option.value = Object.assign(option.value, {
|
|
|
prop: "deviceType",
|
|
|
type: "select",
|
|
|
search: true,
|
|
|
- hide:true,
|
|
|
+ hide: true,
|
|
|
display: false,
|
|
|
- dicUrl:
|
|
|
- dictDataUtil.request_url +
|
|
|
- dictDataUtil.TYPE_CODE.device_type,
|
|
|
+ dicUrl: dictDataUtil.request_url + dictDataUtil.TYPE_CODE.device_type,
|
|
|
props: {
|
|
|
label: "dictLabel",
|
|
|
value: "dictValue",
|
|
@@ -306,10 +352,19 @@ option.value = Object.assign(option.value, {
|
|
|
},
|
|
|
],
|
|
|
click: ({ value, column }) => {
|
|
|
- if(column.boxType){
|
|
|
+ if (column.boxType) {
|
|
|
dialog.visible = true;
|
|
|
}
|
|
|
},
|
|
|
+ change: ({ value, column }) => {
|
|
|
+ if (column.boxType) {
|
|
|
+ if (value != form.value.deviceNo) {
|
|
|
+ if (column.boxType) {
|
|
|
+ dialog.visible = true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
},
|
|
|
{
|
|
|
label: "保养维护内容",
|
|
@@ -337,7 +392,10 @@ option.value = Object.assign(option.value, {
|
|
|
search: true,
|
|
|
type: "select",
|
|
|
editDisplay: false,
|
|
|
- dicData: [{label: '点检',value:"0"},{label: '保养',value:"1"}],
|
|
|
+ dicData: [
|
|
|
+ { label: "点检", value: "0" },
|
|
|
+ { label: "保养", value: "1" },
|
|
|
+ ],
|
|
|
rules: [
|
|
|
{
|
|
|
required: true,
|
|
@@ -351,8 +409,8 @@ option.value = Object.assign(option.value, {
|
|
|
prop: "cycle",
|
|
|
type: "select",
|
|
|
dicUrl:
|
|
|
- dictDataUtil.request_url +
|
|
|
- dictDataUtil.TYPE_CODE.device_maintenance_cycle,
|
|
|
+ dictDataUtil.request_url +
|
|
|
+ dictDataUtil.TYPE_CODE.device_maintenance_cycle,
|
|
|
props: {
|
|
|
label: "dictLabel",
|
|
|
value: "dictValue",
|
|
@@ -390,7 +448,10 @@ option.value = Object.assign(option.value, {
|
|
|
prop: "state",
|
|
|
type: "select",
|
|
|
addDisplay: false,
|
|
|
- dicData: [{label: '待维护',value:0},{label: '已维护',value:1}],
|
|
|
+ dicData: [
|
|
|
+ { label: "待维护", value: 0 },
|
|
|
+ { label: "已维护", value: 1 },
|
|
|
+ ],
|
|
|
rules: [
|
|
|
{
|
|
|
required: true,
|
|
@@ -414,12 +475,11 @@ option.value = Object.assign(option.value, {
|
|
|
},
|
|
|
],
|
|
|
},
|
|
|
-
|
|
|
],
|
|
|
});
|
|
|
|
|
|
onMounted(() => {
|
|
|
dataList();
|
|
|
- queryUserList()
|
|
|
+ queryUserList();
|
|
|
});
|
|
|
</script>
|