Files
liaoNingShunHe/lms/nladmin-ui/src/views/wms/pdm/device/index.vue
张江玮 6a5c490676 rev
2023-09-05 15:00:24 +08:00

263 lines
8.3 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="90px"
label-suffix=""
>
<el-form-item label="号名称">
<el-input
v-model="query.search"
clearable
size="mini"
placeholder="号名称"
@keyup.enter.native="crud.toQuery"
/>
</el-form-item>
<rrOperation />
</el-form>
</div>
<!--如果想在工具栏加入更多按钮可以使用插槽方式 slot = 'left' or 'right'-->
<crudOperation :permission="permission" />
<!--表单组件-->
<el-dialog
:close-on-click-modal="false"
:before-close="crud.cancelCU"
:visible.sync="crud.status.cu > 0"
:title="crud.status.title"
width="600px"
>
<el-form ref="form" :model="form" :rules="rules" size="mini" label-width="160px" label-suffix="">
<el-form-item label="设备号" prop="device_code">
<el-input v-model="form.device_code" :disabled="crud.status.edit" style="width: 300px" />
</el-form-item>
<el-form-item label="设备名称" prop="device_name">
<el-input v-model="form.device_name" style="width: 300px" />
</el-form-item>
<el-form-item label="所属区域" prop="region_code">
<el-select
v-model="form.region_code"
placeholder="所属区域"
style="width: 300px"
clearable
>
<el-option
v-for="item in regionList"
:key="item.region_code"
:label="item.region_name"
:value="item.region_code"
/>
</el-select>
</el-form-item>
<el-form-item label="设备类型" prop="device_model">
<el-select
v-model="form.device_model"
placeholder="设备类型"
style="width: 300px"
clearable
>
<el-option
v-for="item in dict.pdm_device_type"
:key="item.id"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="设备产能">
<el-input v-model="form.productivity" type="number" style="width: 300px" />
</el-form-item>
<el-form-item label="是否工单设备" prop="is_workorder">
<el-radio v-model="form.is_workorder" label="1">是</el-radio>
<el-radio v-model="form.is_workorder" label="0">否</el-radio>
</el-form-item>
<el-form-item label="外部号">
<el-input v-model="form.extend_code" style="width: 300px" />
</el-form-item>
<el-form-item label="备注">
<el-input v-model="form.remark" :rows="3" type="textarea" style="width: 300px" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="info" @click="crud.cancelCU">取消</el-button>
<el-button :loading="crud.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
</div>
</el-dialog>
<!--表格渲染-->
<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
prop="device_code"
label="设备号"
:min-width="flexWidth('device_code',crud.data,'设备号')"
/>
<el-table-column
prop="device_name"
label="设备名称"
:min-width="flexWidth('device_name',crud.data,'设备名称')"
/>
<el-table-column
prop="region_name"
label="所属区域"
:min-width="flexWidth('region_name',crud.data,'所属区域')"
/>
<el-table-column
prop="device_model"
label="设备类型"
:min-width="flexWidth('device_model',crud.data,'设备类型')"
>
<template slot-scope="scope">
{{ dict.label.pdm_device_type[scope.row.device_model] }}
</template>
</el-table-column>
<el-table-column
prop="productivity"
label="设备产能"
:min-width="flexWidth('productivity',crud.data,'设备产能')"
/>
<el-table-column prop="is_workorder" label="是否工单设备" :min-width="flexWidth('is_workorder',crud.data,'是否工单设备')">
<template slot-scope="scope">
{{ dict.label.true_or_false[scope.row.is_workorder] }}
</template>
</el-table-column>
<el-table-column
prop="remark"
label="备注"
:min-width="flexWidth('remark',crud.data,'备注')"
show-overflow-tooltip
/>
<el-table-column v-permission="[]" label="操作" width="120px" align="center" fixed="right">
<template slot-scope="scope">
<udOperation
:data="scope.row"
:permission="permission"
/>
</template>
</el-table-column>
</el-table>
<!--分页组件-->
<pagination />
</div>
</div>
</template>
<script>
import crudDevice from '@/api/wms/pdm/device'
import CRUD, { presenter, header, form, 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'
const defaultForm = {
device_id: null,
device_code: null,
device_name: null,
device_model: null,
workprocedure_id: null,
extend_code: null,
devicebill_id: null,
remark: null,
is_active: null,
region_code: null,
create_id: null,
create_name: null,
create_time: null,
is_delete: null,
productivity: null,
is_workorder: '1'
}
export default {
name: 'Device',
components: { pagination, crudOperation, rrOperation, udOperation },
dicts: ['pdm_device_type', 'true_or_false'],
mixins: [presenter(), header(), form(defaultForm), crud()],
cruds() {
return CRUD({
title: '生产设备', url: 'api/device', idField: 'device_id', sort: 'device_id,desc',
optShow: {
add: true,
edit: false,
del: false,
reset: true,
download: false
},
crudMethod: { ...crudDevice }
})
},
data() {
return {
permission: {},
rules: {
device_code: [
{ required: true, message: '设备号不能为空', trigger: 'blur' }
],
device_name: [
{ required: true, message: '设备名称不能为空', trigger: 'blur' }
],
device_model: [
{ required: true, message: '设备类型不能为空', trigger: 'blur' }
],
region_code: [
{ required: true, message: '所属区域不能为空', trigger: 'blur' }
],
is_workorder: [
{ required: true, message: '是否工单设备不能为空', trigger: 'blur' }
]
},
regionList: []
}
},
created() {
crudDevice.getAllRegions().then(res => {
this.regionList = res
})
},
methods: {
// 钩子在获取表格数据之前执行false 则代表不获取数据
[CRUD.HOOK.beforeRefresh]() {
return true
},
changeEnabled(data, val) {
let msg = '此操作将停用设备,是否继续!'
if (val !== '1') {
msg = '此操作将启用设备,是否继续!'
}
this.$confirm(msg, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
crudDevice.changeActive(data).then(res => {
this.crud.toQuery()
this.crud.notify('操作成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
}).catch(() => {
data.is_used = !data.is_used
})
}).catch(() => {
})
},
format_is_used(is_used) {
return is_used === '1'
}
}
}
</script>
<style scoped>
</style>