projects/mesxc-lb #149
@ -9,12 +9,59 @@
|
||||
<el-form
|
||||
ref="form"
|
||||
:model="form"
|
||||
:size="size"
|
||||
:label-position="labelPosition"
|
||||
v-loading="formLoading">
|
||||
<el-row :gutter="20">
|
||||
<!-- 设备大类 -->
|
||||
<!-- 是否计划保养 -->
|
||||
<el-col :span="8">
|
||||
<el-form-item
|
||||
label="是否计划保养"
|
||||
prop="relatePlan"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: '是否计划保养不能为空',
|
||||
trigger: 'blur',
|
||||
},
|
||||
]">
|
||||
<el-select
|
||||
v-model="form.relatePlan"
|
||||
:placeholder="`是否计划保养`"
|
||||
:disabled="disabled"
|
||||
@change="handlePlanChange">
|
||||
<el-option
|
||||
v-for="opt in [
|
||||
{ label: '是', value: 1 },
|
||||
{ label: '否', value: 2 },
|
||||
]"
|
||||
:key="opt.value"
|
||||
:label="opt.label"
|
||||
:value="opt.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- 所属计划 -->
|
||||
<el-col :span="8" v-if="form.relatePlan == 1">
|
||||
<el-form-item label="所属计划" prop="maintainPlanId">
|
||||
<el-select
|
||||
v-model="form.maintainPlanId"
|
||||
:placeholder="`请选择所属计划`"
|
||||
:disabled="disabled"
|
||||
filterable
|
||||
clearable
|
||||
@change="$emit('update', form)">
|
||||
<el-option
|
||||
v-for="opt in planOptions"
|
||||
:key="opt.value"
|
||||
:label="opt.label"
|
||||
:value="opt.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- 设备大类 -->
|
||||
<el-col :span="8" v-if="form.relatePlan == 1">
|
||||
<el-form-item
|
||||
label="设备大类"
|
||||
prop="equipmentCategory"
|
||||
@ -25,6 +72,8 @@
|
||||
v-model="form.equipmentCategory"
|
||||
:placeholder="`请选择设备大类`"
|
||||
:disabled="disabled"
|
||||
clearable
|
||||
filterable
|
||||
@change="handleEqTypeChange">
|
||||
<el-option
|
||||
v-for="opt in equipmentTypeOptions"
|
||||
@ -47,6 +96,8 @@
|
||||
v-model="form.equipmentId"
|
||||
:placeholder="`请选择设备`"
|
||||
:disabled="disabled"
|
||||
filterable
|
||||
clearable
|
||||
@change="handleEqChange">
|
||||
<el-option
|
||||
v-for="opt in equipmentOptions"
|
||||
@ -57,96 +108,6 @@
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- 保养单号 -->
|
||||
<el-col :span="8">
|
||||
<el-form-item label="保养单号" prop="maintainOrderNumber">
|
||||
<el-input
|
||||
v-model="form.name"
|
||||
@change="$emit('update', form)"
|
||||
:placeholder="`请输入保养单号`"
|
||||
:disabled="disabled" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- 保养人员 -->
|
||||
<el-col :span="8">
|
||||
<el-form-item
|
||||
label="保养人员"
|
||||
prop="maintainWorker"
|
||||
:rules="[
|
||||
{ required: true, message: '保养人员不能为空', trigger: 'blur' },
|
||||
]">
|
||||
<el-select
|
||||
v-model="form.maintainWorker"
|
||||
:placeholder="`请选择保养人员`"
|
||||
:disabled="disabled"
|
||||
@change="$emit('update', form)">
|
||||
<el-option
|
||||
v-for="opt in workerOptions"
|
||||
:key="opt.value"
|
||||
:label="opt.label"
|
||||
:value="opt.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- 是否计划保养 -->
|
||||
<el-col :span="8">
|
||||
<el-form-item
|
||||
label="是否计划保养"
|
||||
prop="relatePlan"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: '是否计划保养不能为空',
|
||||
trigger: 'blur',
|
||||
},
|
||||
]">
|
||||
<el-select
|
||||
v-model="form.relatePlan"
|
||||
:placeholder="`是否计划保养`"
|
||||
:disabled="disabled"
|
||||
@change="$emit('update', form)">
|
||||
<el-option
|
||||
v-for="opt in [
|
||||
{ label: '是', value: 1 },
|
||||
{ label: '否', value: 2 },
|
||||
]"
|
||||
:key="opt.value"
|
||||
:label="opt.label"
|
||||
:value="opt.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- 所属计划 -->
|
||||
<el-col :span="8">
|
||||
<el-form-item label="所属计划" prop="maintainPlanId">
|
||||
<el-select
|
||||
v-model="form.maintainPlanId"
|
||||
:placeholder="`请选择所属计划`"
|
||||
:disabled="disabled"
|
||||
@change="$emit('update', form)">
|
||||
<el-option
|
||||
v-for="opt in planOptions"
|
||||
:key="opt.value"
|
||||
:label="opt.label"
|
||||
:value="opt.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- 保养用时 -->
|
||||
<el-col :span="8">
|
||||
<el-form-item label="保养用时(h)" prop="timeUsed">
|
||||
<el-input
|
||||
v-model="form.timeUsed"
|
||||
@change="$emit('update', form)"
|
||||
:placeholder="`请输入保养用时(h)`"
|
||||
:disabled="disabled" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- 开始时间 -->
|
||||
<el-col :span="8">
|
||||
<el-form-item
|
||||
@ -187,6 +148,53 @@
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- 保养人员 -->
|
||||
<el-col :span="8">
|
||||
<el-form-item
|
||||
label="保养人员"
|
||||
prop="maintainWorker"
|
||||
:rules="[
|
||||
{ required: true, message: '保养人员不能为空', trigger: 'blur' },
|
||||
]">
|
||||
<el-select
|
||||
v-model="form.maintainWorker"
|
||||
:placeholder="`请选择保养人员`"
|
||||
:disabled="disabled"
|
||||
filterable
|
||||
clearable
|
||||
multiple
|
||||
@change="$emit('update', form)">
|
||||
<el-option
|
||||
v-for="opt in workerOptions"
|
||||
:key="opt.value"
|
||||
:label="opt.label"
|
||||
:value="opt.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- 保养单号 -->
|
||||
<el-col :span="8">
|
||||
<el-form-item label="保养单号" prop="maintainOrderNumber">
|
||||
<el-input
|
||||
v-model="form.maintainOrderNumber"
|
||||
@change="$emit('update', form)"
|
||||
:placeholder="`请输入保养单号`"
|
||||
:disabled="disabled" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- 保养用时 -->
|
||||
<el-col :span="8">
|
||||
<el-form-item label="保养用时(h)" prop="timeUsed">
|
||||
<el-input
|
||||
v-model="form.timeUsed"
|
||||
@change="$emit('update', form)"
|
||||
:placeholder="`请输入保养用时(h)`"
|
||||
:disabled="disabled" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- 上传文件 -->
|
||||
<el-col :span="24">
|
||||
<el-form-item label="上传文件" prop="files">
|
||||
@ -209,11 +217,7 @@
|
||||
icon="el-icon-upload2"
|
||||
:disabled="disabled"
|
||||
:before-upload="beforeUpload"
|
||||
:on-success="
|
||||
(response, file, fileList) => {
|
||||
handleUploadSuccess(response, file, col.prop);
|
||||
}
|
||||
">
|
||||
:on-success="handleUploadSuccess">
|
||||
<el-button size="mini" :disabled="disabled">
|
||||
<svg-icon
|
||||
icon-class="icon-upload"
|
||||
@ -241,23 +245,25 @@
|
||||
<el-form-item label="保养描述" prop="maintenanceDes">
|
||||
<div style="position: relative">
|
||||
<div
|
||||
v-if="1"
|
||||
v-if="disabled"
|
||||
class="modal"
|
||||
style="
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1000;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0, 0, 0, 0.3);
|
||||
backdrop-filter: blur(2px);
|
||||
background: #ccc3;
|
||||
user-select: none;
|
||||
cursor: not-allowed;
|
||||
"></div>
|
||||
<Editor
|
||||
style="margin-top: 40px"
|
||||
v-model="form.maintenanceDes"
|
||||
class="record-add__editor"
|
||||
:value="form.maintenanceDes"
|
||||
:min-height="192"
|
||||
:disabled="disabled"
|
||||
@change="$emit('update', form)" />
|
||||
@input="handleEditorInput" />
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
@ -269,6 +275,68 @@
|
||||
import { getAccessToken } from '@/utils/auth';
|
||||
import Editor from '@/components/Editor';
|
||||
|
||||
import tupleImg from '@/assets/images/tuple.png';
|
||||
const uploadedFile = {
|
||||
name: 'UploadedFile',
|
||||
props: ['file', 'disabled'],
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
methods: {
|
||||
handleDelete() {
|
||||
this.$emit('delete', this.file);
|
||||
},
|
||||
async handleDownload() {
|
||||
const data = await this.$axios({
|
||||
url: this.file.fileUrl,
|
||||
method: 'get',
|
||||
responseType: 'blob',
|
||||
});
|
||||
|
||||
await this.$message.success('开始下载');
|
||||
// create download link
|
||||
const url = window.URL.createObjectURL(data);
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.download = this.file.fileName;
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
document.body.removeChild(link);
|
||||
},
|
||||
},
|
||||
mounted() {},
|
||||
render: function (h) {
|
||||
return (
|
||||
<div
|
||||
title={this.file.fileName}
|
||||
onClick={this.handleDownload}
|
||||
style={{
|
||||
background: `url(${tupleImg}) no-repeat`,
|
||||
backgroundSize: '14px',
|
||||
backgroundPosition: '0 55%',
|
||||
paddingLeft: '20px',
|
||||
paddingRight: '24px',
|
||||
textOverflow: 'ellipsis',
|
||||
whiteSpace: 'nowrap',
|
||||
overflow: 'hidden',
|
||||
cursor: 'pointer',
|
||||
display: 'inline-block',
|
||||
}}>
|
||||
{this.file.fileName}
|
||||
{!this.disabled && (
|
||||
<el-button
|
||||
type="text"
|
||||
icon="el-icon-close"
|
||||
style="float: right; position: relative; top: 2px; left: 8px; z-index: 100"
|
||||
class="dialog__upload_component__close"
|
||||
onClick={this.handleDelete}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
},
|
||||
};
|
||||
|
||||
export default {
|
||||
name: 'DialogForm',
|
||||
model: {
|
||||
@ -276,7 +344,7 @@ export default {
|
||||
event: 'update',
|
||||
},
|
||||
emits: ['update'],
|
||||
components: { Editor },
|
||||
components: { Editor, uploadedFile },
|
||||
props: {
|
||||
dataForm: {
|
||||
type: Object,
|
||||
@ -286,6 +354,10 @@ export default {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
labelPosition: {
|
||||
type: String,
|
||||
default: 'top',
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
@ -301,6 +373,8 @@ export default {
|
||||
{ label: '消防设备', value: 2 },
|
||||
{ label: '特种设备', value: 3 },
|
||||
],
|
||||
workerOptions: [],
|
||||
planOptions: [],
|
||||
uploadHeaders: { Authorization: 'Bearer ' + getAccessToken() },
|
||||
uploadUrl: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 上传有关的headers，url都是固定的
|
||||
};
|
||||
@ -335,7 +409,6 @@ export default {
|
||||
},
|
||||
mounted() {
|
||||
this.initOptions();
|
||||
this.getEquipmentList();
|
||||
this.getCode('/base/equipment-maintain-plan/getCode');
|
||||
},
|
||||
methods: {
|
||||
@ -361,12 +434,12 @@ export default {
|
||||
this.initPlan();
|
||||
},
|
||||
|
||||
async initEquipment() {
|
||||
async initEquipment(type = 'special-equipment') {
|
||||
this.formLoading = true;
|
||||
const response = await this.$axios('/base/core-equipment/listAll');
|
||||
this.equipmentList = response.data || [];
|
||||
const equipmentOptions = (response.data || [])
|
||||
.filter((item) => item.special)
|
||||
.filter((item) => (type == 'special-equipment' ? item.special : true))
|
||||
.map((item) => ({
|
||||
label: item.name,
|
||||
value: item.id,
|
||||
@ -376,9 +449,30 @@ export default {
|
||||
this.formLoading = false;
|
||||
},
|
||||
|
||||
async initWorker() {},
|
||||
async initWorker() {
|
||||
this.formLoading = true;
|
||||
const response = await this.$axios({
|
||||
url: '/base/core-worker/listAll',
|
||||
});
|
||||
this.workerOptions = (response.data || []).map((item) => ({
|
||||
label: item.name,
|
||||
value: item.id,
|
||||
}));
|
||||
this.formLoading = false;
|
||||
},
|
||||
|
||||
async initPlan() {},
|
||||
async initPlan() {
|
||||
this.formLoading = true;
|
||||
const response = await this.$axios({
|
||||
url: '/base/equipment-maintain-plan/page',
|
||||
params: { pageNo: 1, pageSize: 100, speical: true },
|
||||
});
|
||||
this.planOptions = (response.data?.list || []).map((item) => ({
|
||||
label: item.name,
|
||||
value: item.id,
|
||||
}));
|
||||
this.formLoading = false;
|
||||
},
|
||||
|
||||
// handlers
|
||||
handleEqTypeChange(type) {
|
||||
@ -396,12 +490,40 @@ export default {
|
||||
// this.$emit('update', this.form)
|
||||
},
|
||||
|
||||
handleEqChange() {
|
||||
this.$emit('update', this.form);
|
||||
},
|
||||
|
||||
// 修改 是否计划保养 时
|
||||
handlePlanChange(val) {
|
||||
console.log('handlePlanChange', val);
|
||||
this.form.equipmentCategory = null;
|
||||
this.form.equipmentId = null;
|
||||
this.$emit('update', { ...this.form, relatePlan: val });
|
||||
this.initEquipment(val == 1 ? 'special-equipment' : null);
|
||||
},
|
||||
|
||||
handleEditorInput(html) {
|
||||
this.$emit('update', {
|
||||
...this.form,
|
||||
maintenanceDes: html,
|
||||
});
|
||||
},
|
||||
|
||||
// upload
|
||||
handleFilesOpen() {},
|
||||
|
||||
beforeUpload() {},
|
||||
|
||||
handleUploadSuccess() {},
|
||||
handleUploadSuccess(response, file) {
|
||||
this.$modal.msgSuccess('上传成功');
|
||||
console.log('file', file);
|
||||
this.form.files.push({
|
||||
fileName: file.name,
|
||||
fileUrl: response.data,
|
||||
});
|
||||
this.$emit('update', this.form);
|
||||
},
|
||||
|
||||
handleDeleteFile(file) {},
|
||||
},
|
||||
@ -424,7 +546,7 @@ export default {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
transition: height 0.3s ease-out;
|
||||
margin-top: 40px;
|
||||
// margin-top: 40px;
|
||||
}
|
||||
|
||||
.upload-in-dialog {
|
||||
@ -460,4 +582,10 @@ export default {
|
||||
.height-48 {
|
||||
height: 35px !important;
|
||||
}
|
||||
|
||||
:deep(.record-add__editor) {
|
||||
.ql-picker-label {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -519,7 +519,7 @@ export default {
|
||||
relatePlan: null,
|
||||
maintainPlanId: null,
|
||||
equipmentId: null,
|
||||
maintainWorker: null,
|
||||
maintainWorker: [],
|
||||
maintainOrderNumber: null,
|
||||
startTime: null,
|
||||
endTime: null,
|
||||
@ -582,10 +582,12 @@ export default {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
this.form.maintainWorker = this.form.maintainWorker.join(',');
|
||||
// 修改的提交
|
||||
if (this.form.id != null) {
|
||||
this.put(this.form).then((response) => {
|
||||
this.put({
|
||||
...this.form,
|
||||
maintainWorker: this.form.maintainWorker.join(','),
|
||||
}).then((response) => {
|
||||
this.$modal.msgSuccess('修改成功');
|
||||
this.open = false;
|
||||
this.getList();
|
||||
@ -593,10 +595,27 @@ export default {
|
||||
return;
|
||||
}
|
||||
// 添加的提交
|
||||
this.post(this.form).then((response) => {
|
||||
this.post({
|
||||
...this.form,
|
||||
maintainWorker: this.form.maintainWorker.join(','),
|
||||
}).then((response) => {
|
||||
this.$modal.msgSuccess('新增成功');
|
||||
this.open = false;
|
||||
this.getList();
|
||||
|
||||
// 跳转至 备品备件 保养
|
||||
const toSparePartsMaintain = () => {
|
||||
this.open = false;
|
||||
// 没有备品备件保养模块。。。
|
||||
};
|
||||
|
||||
this.$confirm('是否有备品备件更换?', '提示', {
|
||||
confirmButtonText: '有',
|
||||
cancelButtonText: '没有',
|
||||
})
|
||||
.then(toSparePartsMaintain)
|
||||
.catch(() => {
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
Loading…
Reference in New Issue
Block a user