Files
wuHanXinRui/mes/qd/src/views/wms/sb/repair/devicegridcheck/index.vue
2022-10-11 14:54:13 +08:00

316 lines
11 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="使用班组">
<treeselect
v-model="query.dept_id"
:load-options="loadDepts"
:options="depts"
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-input
v-model="query.repair_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_WX_INVTYPE"
:label="item.label"
:value="item.value"
/>
</el-select>
</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_WX_INVSTATUS"
: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="crud.selections.length !== 1"
@click="confirmRepair"
>
班组验收
</el-button>
</crudOperation>
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" size="mini" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<el-table-column type="selection" width="55" />
<el-table-column v-if="false" prop="repair_id" label="设备维修单标识" />
<el-table-column prop="repair_code" label="维修单号" width="120px" show-overflow-tooltip>
<template slot-scope="scope">
<el-link type="warning" @click="crud.toView(scope.row)">{{ scope.row.repair_code }}</el-link>
</template>
</el-table-column>
<el-table-column prop="device_code" label="设备编码" width="120px" show-overflow-tooltip />
<el-table-column prop="device_name" label="设备名称" show-overflow-tooltip />
<el-table-column prop="extend_code" label="设备自编码" width="90px" 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="invstatus" label="单据状态" :formatter="formatStatusName"/>
<el-table-column prop="maintenancecycle" label="单据类型" :formatter="formatTypeName"/>
<el-table-column prop="fault_level" label="故障等级" :formatter="formatLevelName"/>
<el-table-column prop="plan_start_date" label="计划维修日期" width="120px" show-overflow-tooltip />
<el-table-column prop="fault_desc" label="故障描述" show-overflow-tooltip />
<el-table-column prop="remark" label="备注" show-overflow-tooltip />
<el-table-column prop="input_optname" label="制单人" />
<el-table-column prop="input_time" label="制单时间" width="150px" show-overflow-tooltip />
<el-table-column prop="update_optname" label="维修人" />
<el-table-column prop="real_start_date" label="开始时间" width="150px" show-overflow-tooltip />
<el-table-column prop="real_end_date" label="结束时间" width="150px" show-overflow-tooltip />
<el-table-column prop="confirm_optname" label="验收人" />
<el-table-column prop="confirm_time" label="验收时间" width="150px" show-overflow-tooltip />
<el-table-column prop="audit_optname" label="审核人" />
<el-table-column prop="audit_time" label="审核时间" width="150px" show-overflow-tooltip />
<el-table-column prop="source_bill_code" label="源单号" show-overflow-tooltip />
<el-table-column prop="source_bill_type" label="源单业务类型" width="120px" />
</el-table>
<!--分页组件-->
<pagination />
</div>
<AddDialog/>
</div>
</template>
<script>
import crudDevicerepairmst from '@/api/wms/sb/devicerepairmst'
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 DateRangePicker from '@/components/DateRangePicker'
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 AddDialog from '@/views/wms/sb/repair/devicerepair/AddDialog'
import { getDepts, getDeptSuperior } from '@/api/system/dept'
import { mapGetters } from 'vuex'
export default {
name: 'Devicegridcheck',
dicts: ['EM_DEVICE_WX_INVTYPE', 'EM_DEVICE_WX_INVSTATUS', 'EM_FAULT_LEVEL'],
components: { AddDialog, pagination, crudOperation, rrOperation, udOperation, DateRangePicker, Treeselect },
mixins: [presenter(), header(), crud()],
cruds() {
return CRUD({
title: '维修单维护班组验收',
url: 'api/devicerepairmst/query5',
idField: 'repair_id',
sort: 'repair_id,desc',
crudMethod: { ...crudDevicerepairmst },
optShow: {
add: false,
edit: false,
del: false,
download: false,
reset: true
}
})
},
data() {
return {
classes: [],
depts: [],
class_idStr: null,
materOpt_code: '23',
permission: {
}
}
},
computed: {
...mapGetters({
user: 'user'
})
},
created() {
debugger
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.queryClassId()
})
this.getDepts()
this.query.dept_id = this.user.dept.id
this.getSupDepts(this.user.dept.id)
this.crud.toQuery()
},
methods: {
// 钩子在获取表格数据之前执行false 则代表不获取数据
[CRUD.HOOK.beforeRefresh]() {
return true
},
hand(value) {
this.crud.toQuery()
},
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
})
})
},
formatStatusName(row, cloum) {
return this.dict.label.EM_DEVICE_WX_INVSTATUS[row.invstatus]
},
formatTypeName(row, cloum) {
return this.dict.label.EM_DEVICE_WX_INVTYPE[row.maintenancecycle]
},
formatLevelName(row, cloum) {
return this.dict.label.EM_FAULT_LEVEL[row.fault_level]
},
confirmRepair() {
const _selectData = this.$refs.table.selection
const data = _selectData[0]
if (data.invstatus !== '06') {
return this.crud.notify('只能对结束状态的单据确认', CRUD.NOTIFICATION_TYPE.INFO)
}
crudDevicerepairmst.confirmRepair(data).then(res => {
this.crud.notify('操作成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
this.crud.toQuery()
})
},
// 获取弹窗内部门数据
loadDepts({ action, parentNode, callback }) {
if (action === LOAD_CHILDREN_OPTIONS) {
getDepts({ enabled: true, pid: parentNode.id }).then(res => {
parentNode.children = res.content.map(function(obj) {
if (obj.hasChildren) {
obj.children = null
}
return obj
})
setTimeout(() => {
callback()
}, 200)
})
}
},
getDepts() {
getDepts({ enabled: true }).then(res => {
this.depts = res.content.map(function(obj) {
if (obj.hasChildren) {
obj.children = null
}
return obj
})
})
},
getSupDepts(deptId) {
debugger
var number = parseFloat(deptId)
getDeptSuperior(number).then(res => {
const date = res.content
this.buildDepts(date)
this.depts = date
})
},
buildDepts(depts) {
depts.forEach(data => {
if (data.children) {
this.buildDepts(data.children)
}
if (data.hasChildren && !data.children) {
data.children = null
}
})
}
}
}
</script>
<style scoped>
</style>