Files
wuHanXinRui/mes/qd/src/views/wms/sb/upkeep/devicemaintenance/index.vue
2022-09-16 11:11:02 +08:00

274 lines
9.4 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>
<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="putIn"
>
提交
</el-button>
<el-button
slot="right"
class="filter-item"
type="success"
icon="el-icon-position"
size="mini"
:disabled="crud.selections.length !== 1"
@click="createExcel"
>
生成保养单
</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="maint_id" label="保养单标识" />
<el-table-column prop="maint_code" label="保养单号" width="120px" show-overflow-tooltip>
<template slot-scope="scope">
<el-link type="warning" @click="crud.toView(scope.row)">{{ scope.row.maint_code }}</el-link>
</template>
</el-table-column>
<el-table-column prop="device_code" label="设备编码" 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="单据状态" 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-column v-permission="[]" label="操作" width="120px" align="center" fixed="right">
<template slot-scope="scope">
<udOperation
:data="scope.row"
:permission="permission"
:disabled-edit="scope.row.invstatus !== '01'"
:disabled-dle="scope.row.invstatus !== '01'"
/>
</template>
</el-table-column>
</el-table>
<!--分页组件-->
<pagination />
</div>
<AddDialog />
</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 AddDialog from '@/views/wms/sb/upkeep/devicemaintenance/AddDialog'
import {download} from "@/api/data";
import {downloadFile} from "@/utils";
export default {
name: 'Devicemaintenance',
dicts: ['EM_DEVICE_BY_INVSTATUS', 'EM_DEVICE_BY_INVTYPE'],
components: { AddDialog, pagination, crudOperation, rrOperation, udOperation, Treeselect, DateRangePicker },
mixins: [presenter(), header(), crud()],
cruds() {
return CRUD({
title: '设备保养单',
url: 'api/devicemaintenancemst',
idField: 'maint_id',
sort: 'maint_id,desc',
crudMethod: { ...crudDevicemaintenancemst },
optShow: {
add: true,
edit: false,
del: false,
download: false,
reset: true
}
})
},
data() {
return {
classes: [],
class_idStr: null,
materOpt_code: '23',
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()
},
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]
},
putIn() {
const _selectData = this.$refs.table.selection
const data = _selectData[0]
if (data.invstatus !== '01') {
return this.crud.notify('只能对生成状态的单据提交', CRUD.NOTIFICATION_TYPE.INFO)
}
crudDevicemaintenancemst.putIn(data).then(res => {
this.crud.notify('提交成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
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
})
})
},
createExcel() {
const _selectData = this.$refs.table.selection
const data = _selectData[0]
download('api/devicemaintenancemst/createExcel', { 'maint_id': data.maint_id }).then(result => {
const name = data.maint_code + '保养工单'
this.crud.toQuery()
downloadFile(result, name, 'xlsx')
})
}
}
}
</script>
<style scoped>
</style>