<template>
|
<j-modal
|
:width="1200"
|
:visible="visible"
|
:title="title"
|
:okButtonProps="{ class:{'jee-hidden': disableSubmit} }"
|
@cancel="handCancel"
|
@ok="submitForm"
|
:mask-closable="false"
|
:confirmLoading="confirmLoading"
|
centered
|
>
|
<a-spin :spinning="spinning">
|
<a-form-model ref="form" :model='tableRowRecord' :rules='validatorRules' :labelCol='labelCol'
|
:wrapperCol='wrapperCol'>
|
<a-divider orientation="center" style="font-size: large;font-style: italic;color: #66aeed;">报修基础信息</a-divider>
|
|
<a-row>
|
<a-col :span='threeColSpan'>
|
<a-form-model-item label='工单编号'>
|
<a-input :readOnly='inputReadOnly' v-model='tableRowRecord.repairCode'/>
|
</a-form-model-item>
|
</a-col>
|
<a-col :span='threeColSpan'>
|
<a-form-model-item label='设备编号'>
|
<lx-search-equipment-select disabled v-model='tableRowRecord.equipmentId'/>
|
</a-form-model-item>
|
</a-col>
|
<a-col :span='threeColSpan'>
|
<a-form-model-item label='维修负责人'>
|
<a-input :readOnly='inputReadOnly' v-model='tableRowRecord.repairer'/>
|
</a-form-model-item>
|
</a-col>
|
</a-row>
|
|
<a-row>
|
<a-col :span="threeColSpan">
|
<a-form-model-item label="故障开始时间">
|
<a-input :readOnly='inputReadOnly' v-model="tableRowRecord.faultStartTime"/>
|
</a-form-model-item>
|
</a-col>
|
|
<a-col :span="threeColSpan">
|
<a-form-model-item label="是否停机">
|
<j-dict-select-tag type='radio' v-model='tableRowRecord.breakdownFlag' dictCode='breakdown_flag'
|
disabled/>
|
</a-form-model-item>
|
</a-col>
|
</a-row>
|
|
<a-row>
|
<a-col :span='threeColSpan*3'>
|
<a-form-model-item label='报修图片' :labelCol='labelColLong' :wrapperCol='wrapperColLong'>
|
<lx-upload :returnUrl="false" :isMultiple="true" file-type="image" disabled :number="3"
|
v-model="tableRowRecord.reportImageFiles"/>
|
</a-form-model-item>
|
</a-col>
|
</a-row>
|
|
<a-divider orientation="center" style="font-size: large;font-style: italic;color: #66aeed;">是否需要领用备件</a-divider>
|
|
<a-tabs v-model="activeTabKey">
|
<a-tab-pane key="1" tab="领用备件">
|
<a-row>
|
<a-col :span="twoColSpan*2">
|
<a-form-model-item label="是否需要领用备件" prop="isUseSpare">
|
<a-radio-group v-model="tableRowRecord.isUseSpare"
|
:disabled="isDisableUseSpare">
|
<a-radio :value="1">是</a-radio>
|
<a-radio :value="0">否</a-radio>
|
</a-radio-group>
|
</a-form-model-item>
|
</a-col>
|
|
<template v-if="tableRowRecord.isUseSpare===0">
|
<a-col :span="twoColSpan*2">
|
<a-form-model-item label="故障原因" prop="faultReason">
|
<a-input :readOnly="disableSubmit||tableRowRecord.repairStatus!=='UNDER_REPAIR'"
|
v-model="tableRowRecord.faultReason" rows="4"
|
placeholder="请输入故障原因"/>
|
</a-form-model-item>
|
</a-col>
|
<a-col :span="twoColSpan*2">
|
<a-form-model-item label="维修结果描述" prop="repairDescription">
|
<a-textarea :readOnly="disableSubmit||tableRowRecord.repairStatus!=='UNDER_REPAIR'"
|
v-model="tableRowRecord.repairDescription"
|
placeholder="请输入维修结果描述"/>
|
</a-form-model-item>
|
</a-col>
|
<a-col :span="twoColSpan*2">
|
<a-form-model-item label="维修图片">
|
<lx-upload :returnUrl="false" :isMultiple="true" file-type="image" :number="3"
|
:disabled="disableSubmit||tableRowRecord.repairStatus!=='UNDER_REPAIR'"
|
v-model="tableRowRecord.imageFiles"/>
|
</a-form-model-item>
|
</a-col>
|
</template>
|
</a-row>
|
</a-tab-pane>
|
|
<template v-if="selectShenpiData.procInstId">
|
<a-tab-pane key='2' tab='流程节点'>
|
<a-card :bordered="false">
|
<a-timeline>
|
<a-timeline-item v-for="(item,index) in hitaskDataSource" :key="index">
|
<div>
|
<h3 style="font-weight: bold;">{{item.taskName}}</h3>
|
<div>处理人：{{item.assignee_dictText}}</div>
|
<div v-if="index !==0">处理时长：{{item.duration}}</div>
|
<div v-if="item.name !== '提交申请'">处理类型：{{item.sequenceFlowName}}</div>
|
<div v-if="item.description">处理意见：{{item.description}}</div>
|
</div>
|
</a-timeline-item>
|
</a-timeline>
|
</a-card>
|
</a-tab-pane>
|
|
<a-tab-pane key='3' tab='流程图'>
|
<img :src="imageSrc" alt="Fetched Image"/>-->
|
</a-tab-pane>
|
</template>
|
</a-tabs>
|
|
<template v-if="tableRowRecord.isUseSpare===1&&isDisableUseSpare">
|
<a-divider orientation="center" style="font-size: large;font-style: italic;color: #66aeed;">管理员领用备件
|
</a-divider>
|
|
<a-row>
|
<a-col :span="twoColSpan*2">
|
<a-form-model-item prop="sparePartDescription" label="备件描述">
|
<a-textarea placeholder="请输入备件描述" :readOnly="disableSubmit||tableRowRecord.repairStatus!=='WAIT_SPARES'"
|
v-model="tableRowRecord.sparePartDescription"></a-textarea>
|
</a-form-model-item>
|
</a-col>
|
</a-row>
|
</template>
|
|
<template v-if="Boolean(tableRowRecord.sparePartDescription)&&isDisplayRepairResult">
|
<a-divider orientation="center" style="font-size: large;font-style: italic;color: #66aeed;">维修结果上报</a-divider>
|
<a-row>
|
<a-col :span="twoColSpan*2">
|
<a-form-model-item label="故障原因" prop="faultReason">
|
<a-input :readOnly="disableSubmit||isDisableSubmitRepairResult" v-model="tableRowRecord.faultReason"
|
rows="4" placeholder="请输入故障原因"/>
|
</a-form-model-item>
|
</a-col>
|
</a-row>
|
|
<a-row>
|
<a-col :span="twoColSpan*2">
|
<a-form-model-item label="维修结果描述" prop="repairDescription">
|
<a-textarea :readOnly="disableSubmit||isDisableSubmitRepairResult"
|
v-model="tableRowRecord.repairDescription"
|
placeholder="请输入维修结果描述"/>
|
</a-form-model-item>
|
</a-col>
|
</a-row>
|
|
<a-row>
|
<a-col :span="twoColSpan*2">
|
<a-form-model-item label="维修图片">
|
<lx-upload :disabled="disableSubmit||isDisableSubmitRepairResult" :returnUrl="false" :isMultiple="true"
|
file-type="image" :number="3"
|
v-model="tableRowRecord.imageFiles"/>
|
</a-form-model-item>
|
</a-col>
|
</a-row>
|
</template>
|
</a-form-model>
|
</a-spin>
|
</j-modal>
|
</template>
|
|
<script>
|
import '@assets/less/TableExpand.less'
|
import { getAction, deleteAction, postAction, downFile, httpAction } from '@api/manage'
|
import LxSearchEquipmentSelect from '../../../eam/equipment/modules/LxSearchEquipmentSelect'
|
|
export default {
|
name: 'RepairOrderApprovalModal',
|
components: { LxSearchEquipmentSelect },
|
props: {
|
selectShenpiData: {
|
type: Object,
|
required: true
|
}
|
},
|
data() {
|
return {
|
title: '',
|
threeColSpan: 8,
|
twoColSpan: 12,
|
inputReadOnly: true,
|
disableSubmit: false,
|
confirmLoading: false,
|
spinning: false,
|
tableRowRecord: {},
|
hitaskDataSource: [],
|
imageSrc: null,
|
activeTabKey: '1',
|
labelCol: {
|
xs: { span: 24 },
|
sm: { span: 6 }
|
},
|
wrapperCol: {
|
xs: { span: 24 },
|
sm: { span: 16 }
|
},
|
labelColLong: {
|
xs: { span: 24 },
|
sm: { span: 2 }
|
},
|
wrapperColLong: {
|
xs: { span: 24 },
|
sm: { span: 20 }
|
},
|
validatorRules: {
|
isUseSpare: [
|
{ required: true, message: '请选择是否需要领用备件' }
|
],
|
sparePartDescription: [
|
{ required: true, message: '请输入备件描述' }
|
],
|
faultReason: [
|
{ required: true, message: '请输入故障原因' }
|
],
|
repairDescription: [
|
{ required: true, message: '请输入维修结果描述' }
|
]
|
},
|
approveData: {},
|
visible: false,
|
// 表头
|
url: {
|
queryBomDataById: '/eam/eamRepairOrder/queryById',
|
diagramView: '/assign/flow/diagramView',
|
queryHisTaskList: '/assign/flow/queryHisTaskList',
|
approve: '/eam/eamRepairOrder/perform'
|
}
|
}
|
},
|
computed: {
|
isDisableUseSpare() {
|
return this.disableSubmit || this.tableRowRecord.repairStatus !== 'UNDER_REPAIR' || Boolean(this.tableRowRecord.sparePartDescription)
|
},
|
isDisplayRepairResult() {
|
return ['UNDER_REPAIR', 'WAIT_CONFIRM', 'COMPLETE'].includes(this.tableRowRecord.repairStatus)
|
},
|
isDisableSubmitRepairResult() {
|
return ['WAIT_CONFIRM', 'COMPLETE'].includes(this.tableRowRecord.repairStatus)
|
}
|
},
|
methods: {
|
/**
|
* 获取流程节点和流程图
|
* @param record 待办记录信息
|
*/
|
getAllApproveData(record) {
|
if (!record.procInstId) return
|
console.log('record----->', record)
|
const { procInstId, processDefinitionId, processInstanceId, processDefinitionKey } = record
|
const param = { procInstId }
|
const imageParam = { processDefinitionId, processInstanceId, TaskDefinitionKey: processDefinitionKey }
|
const that = this
|
|
getAction(this.url.queryHisTaskList, param)
|
.then(res => {
|
that.hitaskDataSource = res.result
|
})
|
|
downFile(this.url.diagramView, imageParam, 'get')
|
.then((res => {
|
const urlObject = window.URL.createObjectURL(new Blob([res]))
|
that.imageSrc = urlObject
|
}))
|
.catch(err => {
|
that.$notification.error({
|
message: '消息',
|
description: res.message
|
})
|
})
|
},
|
|
/**
|
* 获取待办记录的基本信息
|
* @param record 待办记录信息
|
*/
|
getBasicInformation(record) {
|
this.spinning = true
|
const that = this
|
const param = { id: record.dataId }
|
this.tableRowRecord = {}
|
this.activeTabKey = '1'
|
getAction(this.url.queryBomDataById, param)
|
.then((res => {
|
if (res.success) {
|
that.tableRowRecord = Object.assign({}, res.result, {
|
isUseSpare: res.result.isUseSpare === null ? 0 : res.result.isUseSpare,
|
imageFiles: JSON.parse(res.result.imageFiles),
|
reportImageFiles: JSON.parse(res.result.reportImageFiles)
|
})
|
console.log('this.tableRowRecord----->', that.tableRowRecord)
|
}
|
}))
|
.finally(() => {
|
that.spinning = false
|
})
|
},
|
|
submitForm() {
|
const that = this
|
// 触发表单验证
|
this.$refs.form.validate(valid => {
|
if (valid) {
|
that.confirmLoading = that.spinning = true
|
const { isUseSpare, faultReason, repairDescription, sparePartDescription, imageFiles, equipmentId } = that.tableRowRecord
|
const { dataId, id, procInstId, taskDefKey, variables } = that.selectShenpiData
|
|
const flowTaskVo = {}
|
flowTaskVo.isUseSpare = isUseSpare
|
flowTaskVo.faultReason = faultReason
|
flowTaskVo.repairDescription = repairDescription
|
flowTaskVo.sparePartDescription = sparePartDescription
|
flowTaskVo.imageFilesResult = imageFiles
|
flowTaskVo.equipmentId = equipmentId
|
flowTaskVo.id = dataId
|
flowTaskVo.dataId = dataId
|
flowTaskVo.taskId = id
|
flowTaskVo.instanceId = procInstId
|
flowTaskVo.targetKey = taskDefKey
|
flowTaskVo.values = variables
|
console.log('表单提交数据', flowTaskVo)
|
httpAction(this.url.approve, flowTaskVo, 'post')
|
.then((res) => {
|
if (res.success) {
|
that.$message.success(res.message)
|
that.handCancel()
|
that.$emit('searchReset')
|
} else {
|
that.$message.warning(res.message)
|
}
|
}).finally(() => {
|
that.confirmLoading = that.spinning = false
|
})
|
} else {
|
return false
|
}
|
})
|
},
|
|
handCancel() {
|
this.visible = false
|
if (this.$refs.form) this.$refs.form.clearValidate()
|
}
|
}
|
}
|
</script>
|
