Files
wuHanXinRui/mes/qd/src/views/wms/sb/upkeep/devicemaintenancepagrid/index.vue
2022-09-28 16:14:41 +08:00

381 lines
13 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div class="app-container">
<!--工具栏-->
<div class="head-container">
<div v-if="crud.props.searchToggle">
<!-- 搜索 -->
<el-form
:inline="true"
class="demo-form-inline"
label-position="right"
label-width="110px"
label-suffix=":"
>
<el-form-item label="设备类别">
<treeselect
v-model="query.material_type_id"
:load-options="loadClass"
:options="classes"
style="width: 200px;"
placeholder="请选择"
/>
</el-form-item>
<el-form-item label="设备">
<el-input
v-model="query.device_code"
clearable
size="mini"
placeholder="请输入设备编码、名称"
@keyup.enter.native="crud.toQuery"
/>
</el-form-item>
<el-form-item label="保养类型">
<el-select
v-model="query.maintenancecycle"
clearable
size="mini"
placeholder="请选择"
class="filter-item"
@change="hand"
>
<el-option
v-for="item in dict.EM_DEVICE_BY_INVTYPE"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="单据编码">
<el-input
v-model="query.maint_code"
clearable
size="mini"
placeholder="请输入单据编码、名称"
@keyup.enter.native="crud.toQuery"
/>
</el-form-item>
<el-form-item label="日期">
<date-range-picker v-model="query.createTime" class="date-item" />
</el-form-item>
<el-form-item label="状态">
<el-select
v-model="query.invstatus"
clearable
size="mini"
placeholder="请选择"
class="filter-item"
@change="hand"
>
<el-option
v-for="item in dict.EM_DEVICE_BY_INVSTATUS"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="保养对象">
<el-select
v-model="query.maint_object"
clearable
size="mini"
placeholder="请选择"
class="filter-item"
@change="hand"
>
<el-option
v-for="item in dict.EM_DEVICE_MAINT_OBJECT"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<rrOperation />
</el-form>
</div>
<!--如果想在工具栏加入更多按钮可以使用插槽方式 slot = 'left' or 'right'-->
<crudOperation :permission="permission">
<el-button
slot="right"
class="filter-item"
type="success"
icon="el-icon-position"
size="mini"
:disabled="start_flag"
@click="startMaintain"
>
开始保养
</el-button>
<!-- <el-button
slot="right"
class="filter-item"
type="success"
icon="el-icon-position"
size="mini"
:disabled="execu_flag"
@click="executeMaintain"
>
保养执行
</el-button>-->
<el-button
slot="right"
class="filter-item"
type="success"
icon="el-icon-position"
size="mini"
:disabled="end_flag"
@click="endMaintain"
>
结束保养
</el-button>
<el-button
slot="right"
class="filter-item"
type="success"
icon="el-icon-position"
size="mini"
:disabled="confirm_flag"
@click="confirmMaintain"
>
保养验收
</el-button>
</crudOperation>
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" size="mini" style="width: 100%;" @selection-change="mySelectionChange">
<el-table-column type="selection" width="55" />
<el-table-column v-if="false" prop="maint_id" label="保养单标识" />
<el-table-column prop="maint_code" label="保养单号" width="120px" show-overflow-tooltip />
<el-table-column prop="device_code" label="设备编码" show-overflow-tooltip />
<el-table-column prop="device_name" label="设备名称" show-overflow-tooltip />
<el-table-column prop="dept_name" label="所属部门" show-overflow-tooltip />
<el-table-column prop="use_name" label="使用班组" show-overflow-tooltip />
<el-table-column prop="maint_object" label="保养对象" show-overflow-tooltip :formatter="formatMainObject"/>
<el-table-column prop="extend_code" label="设备自编码" width="90px" show-overflow-tooltip />
<el-table-column prop="invstatus" label="单据状态" show-overflow-tooltip :formatter="formatInvsName" />
<el-table-column prop="maintenancecycle" label="单据类型" :formatter="formatMainName" />
<el-table-column prop="plan_start_date" label="计划保养日期" width="150px" />
<el-table-column prop="input_optname" label="创建人" />
<el-table-column prop="input_time" label="创建时间" width="150px" />
<el-table-column prop="update_optname" label="保养人" />
<el-table-column prop="real_start_date" label="开始时间" width="150px" />
<el-table-column prop="real_end_date" label="结束时间" width="150px" />
<el-table-column prop="confirm_optname" label="确认人" />
<el-table-column prop="confirm_time" label="确认时间" width="150px" />
<el-table-column prop="audit_optname" label="审核人" />
<el-table-column prop="audit_time" label="审核时间" width="150px" />
</el-table>
<!--分页组件-->
<pagination />
</div>
<ExecuteDialog :dialog-show.sync="executeDialog" :open-param="openParam" />
<StartDialog :dialog-show.sync="startDialog" :open-param="openParam" />
</div>
</template>
<script>
import crudDevicemaintenancemst from '@/api/wms/sb/devicemaintenancemst'
import CRUD, { presenter, header, crud } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import udOperation from '@crud/UD.operation'
import pagination from '@crud/Pagination'
import crudClassstandard from '@/api/wms/basedata/master/classstandard'
import Treeselect, { LOAD_CHILDREN_OPTIONS } from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import crudMaterialbase from '@/api/wms/basedata/master/materialbase'
import DateRangePicker from '@/components/DateRangePicker'
import ExecuteDialog from '@/views/wms/sb/upkeep/devicemaintenancepagrid/ExecuteDialog'
import StartDialog from '@/views/wms/sb/upkeep/devicemaintenancepagrid/StartDialog'
export default {
name: 'Devicemaintenancepagrid',
dicts: ['EM_DEVICE_BY_INVSTATUS', 'EM_DEVICE_BY_INVTYPE', 'EM_DEVICE_MAINT_OBJECT'],
components: { ExecuteDialog, pagination, crudOperation, rrOperation, udOperation, Treeselect, DateRangePicker, StartDialog },
mixins: [presenter(), header(), crud()],
cruds() {
return CRUD({
title: '保养单填报',
url: 'api/devicemaintenancemst/query5',
idField: 'maint_id',
sort: 'maint_id,desc',
crudMethod: { ...crudDevicemaintenancemst },
optShow: {
add: false,
edit: false,
del: false,
download: false,
reset: true
}
})
},
data() {
return {
start_flag: true,
execu_flag: true,
end_flag: true,
confirm_flag: true,
classes: [],
class_idStr: null,
materOpt_code: '23',
openParam: null,
executeDialog: false,
startDialog: false,
permission: {
}
}
},
created() {
const param = {
'materOpt_code': this.materOpt_code
}
crudMaterialbase.getMaterOptType(param).then(res => {
this.class_idStr = res.class_idStr
this.crud.query.class_idStr = this.class_idStr
this.crud.toQuery()
this.queryClassId()
})
},
methods: {
// 钩子在获取表格数据之前执行false 则代表不获取数据
[CRUD.HOOK.beforeRefresh]() {
return true
},
hand(value) {
this.crud.toQuery()
},
formatMainObject(row, cloum) {
return this.dict.label.EM_DEVICE_MAINT_OBJECT[row.maint_object]
},
formatInvsName(row, cloum) {
return this.dict.label.EM_DEVICE_BY_INVSTATUS[row.invstatus]
},
formatMainName(row, cloum) {
return this.dict.label.EM_DEVICE_BY_INVTYPE[row.maintenancecycle]
},
loadClass({ action, parentNode, callback }) {
if (action === LOAD_CHILDREN_OPTIONS) {
crudClassstandard.getClass({ pid: parentNode.id }).then(res => {
parentNode.children = res.content.map(function(obj) {
if (obj.hasChildren) {
obj.children = null
}
return obj
})
setTimeout(() => {
callback()
}, 100)
})
}
},
queryClassId() {
const param = {
'class_idStr': this.class_idStr
}
crudClassstandard.queryClassById(param).then(res => {
this.classes = res.content.map(obj => {
if (obj.hasChildren) {
obj.children = null
}
return obj
})
})
},
startMaintain() {
const _selectData = this.$refs.table.selection
const data = _selectData[0]
if (data.invstatus !== '02') {
return this.crud.notify('只能对提交状态的单据开始', CRUD.NOTIFICATION_TYPE.INFO)
}
this.openParam = data
this.startDialog = true
},
endMaintain() {
const _selectData = this.$refs.table.selection
const data = _selectData[0]
if (data.invstatus !== '03') {
return this.crud.notify('只能对开始状态的单据结束', CRUD.NOTIFICATION_TYPE.INFO)
}
crudDevicemaintenancemst.getDtl(data).then(res => {
this.openParam = {
'form': data,
'tableData': res
}
this.executeDialog = true
})
// crudDevicemaintenancemst.endMaintain(data).then(res => {
// this.crud.notify('操作成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
// this.crud.toQuery()
// })
},
executeMaintain() {
const _selectData = this.$refs.table.selection
const data = _selectData[0]
if (data.invstatus !== '03') {
return this.crud.notify('只能对开始状态的单据执行', CRUD.NOTIFICATION_TYPE.INFO)
}
crudDevicemaintenancemst.getDtl(data).then(res => {
this.openParam = {
'form': data,
'tableData': res
}
this.executeDialog = true
})
},
confirmMaintain() {
const _selectData = this.$refs.table.selection
const data = _selectData[0]
if (data.invstatus !== '04') {
return this.crud.notify('只能对结束状态的单据确认', CRUD.NOTIFICATION_TYPE.INFO)
}
crudDevicemaintenancemst.confirmMaintain(data).then(res => {
this.crud.notify('操作成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
this.crud.toQuery()
})
},
mySelectionChange(rows) {
this.buttonChange(rows)
},
// 处理按钮是否显示
buttonChange(rows) {
if (rows.length !== 0) {
this.start_flag = false
this.execu_flag = false
this.end_flag = false
this.confirm_flag = false
for (let i = 0; i < rows.length; i++) {
if ('01,03,04,05,99'.includes(rows[i].invstatus)) {
this.start_flag = true
}
if ('01,02,04,05,99'.includes(rows[i].invstatus)) {
this.execu_flag = true
}
if ('01,02,04,05,99'.includes(rows[i].invstatus)) {
this.end_flag = true
}
// if ('01,02,03,05,99'.includes(rows[i].invstatus)) {
// this.confirm_flag = true
// }
if (rows[i].maint_object !== '02') {
this.confirm_flag = true
}
if (rows.length > 1) {
this.handleCurrentChange()
}
}
} else {
this.handleCurrentChange()
}
},
handleCurrentChange() {
this.start_flag = true
this.execu_flag = true
this.end_flag = true
this.confirm_flag = true
}
}
}
</script>
<style scoped>
</style>