Files
yongYuJiaJu/lms/nladmin-ui/src/views/wms/sch/ysa/index.vue
2022-10-18 14:16:58 +08:00

332 lines
12 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.point_code"
clearable
size="mini"
style="width: 185px;"
placeholder="点位编码"
@keyup.enter.native="crud.toQuery"
/>
</el-form-item>
<el-form-item label="块-排-列">
<el-cascader
clearable
v-model="locations"
:options="locationsOptions"
placeholder="请选择标签"
@change="hand"
/>
</el-form-item>
<el-form-item label="点位状态">
<el-select
v-model="query.point_status"
clearable
filterable
size="mini"
class="filter-item"
style="width: 185px;"
@change="hand"
>
<el-option
v-for="item in dict.sch_point_status"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="载具类型">
<el-select
v-model="query.vehicle_type"
clearable
filterable
size="mini"
class="filter-item"
style="width: 185px;"
@change="hand"
>
<el-option
v-for="item in dict.vehicle_type"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="入库时间">
<el-date-picker
v-model="query.createTime"
type="daterange"
value-format="yyyy-MM-dd HH:mm:ss"
start-placeholder="开始日期"
end-placeholder="结束日期"
:default-time="['00:00:00', '23:59:59']"
@change="crud.toQuery"
/>
</el-form-item>
<el-form-item label="是否锁定">
<el-switch
v-model="query.is_lock"
active-value="1"
inactive-value="0"
active-color="#409EFF"
inactive-color="#C0CCDA"
@change="hand"
/>
</el-form-item>
<el-form-item label="是否启用">
<el-switch
v-model="query.is_used"
active-value="0"
inactive-value="1"
active-color="#C0CCDA"
inactive-color="#409EFF"
@change="hand"
/>
</el-form-item>
<rrOperation :crud="crud" />
</el-form>
</div>
<!--如果想在工具栏加入更多按钮可以使用插槽方式 slot = 'left' or 'right'-->
<crudOperation :permission="permission" >
<el-button
class="filter-item"
size="mini"
type="primary"
icon="el-icon-circle-check"
slot="right"
:disabled="crud.selections.length === 0"
@click="changeEnableOn(crud.selections)"
>
启用
</el-button>
<el-button
class="filter-item"
size="mini"
type="danger"
icon="el-icon-circle-close"
slot="right"
:disabled="crud.selections.length === 0"
@click="changeEnableOff(crud.selections)">
禁用
</el-button>
</crudOperation>
<!--表单组件-->
<el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="550px">
<el-form ref="form" :model="form" :rules="rules" size="mini" label-width="120px">
<el-form-item label="点位状态">
<el-select
v-model="form.point_status"
clearable
filterable
size="mini"
class="filter-item"
style="width: 370px;"
>
<el-option
v-for="item in dict.sch_point_status"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="托盘类型">
<el-select
v-model="form.vehicle_type"
clearable
filterable
size="mini"
class="filter-item"
style="width: 370px;"
>
<el-option
v-for="item in dict.vehicle_type"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="静置时间(min)" prop="standing_time">
<el-input v-model="form.standing_time" style="width: 370px;" />
</el-form-item>
<el-form-item label="是否启用" prop="is_used">
<el-switch v-model="form.is_used" active-value="1" inactive-value="0"/>
</el-form-item>
<el-form-item label="是否锁定" prop="is_lock">
<el-switch v-model="form.is_lock" active-value="1" inactive-value="0"/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @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="point_code" label="点位编码" min-width="100" show-overflow-tooltip/>
<el-table-column prop="pcsn" label="批次" />
<el-table-column prop="ivt_qty" label="库存数" />
<el-table-column prop="instorage_time" label="入库时间" />
<el-table-column prop="ext_code" label="外部编码" />
<el-table-column prop="point_status" label="点位状态" >
<template slot-scope="scope">
{{ dict.label.sch_point_status[scope.row.point_status] }}
</template>
</el-table-column>
<el-table-column prop="vehicle_type" label="托盘类型" min-width="100">
<template slot-scope="scope">
{{ dict.label.vehicle_type[scope.row.vehicle_type] }}
</template>
</el-table-column>
<el-table-column prop="standing_time" label="静置时间(min)" min-width="120"/>
<el-table-column prop="block_num" label="" />
<el-table-column prop="row_num" label="" />
<el-table-column prop="col_num" label="" />
<el-table-column prop="layer_num" label="" />
<el-table-column prop="remark" label="备注" />
<el-table-column prop="is_used" label="是否启用" >
<template slot-scope="scope">
{{ scope.row.is_used=='1' ? '是' : '否' }}
</template>
</el-table-column>
<el-table-column prop="is_lock" label="是否锁定" >
<template slot-scope="scope">
{{ scope.row.is_lock=='1' ? '是' : '否' }}
</template>
</el-table-column>
<el-table-column prop="update_optname" label="修改人" />
<el-table-column prop="update_time" label="修改时间" min-width="150" 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"
:is-visiable-del="false"
/>
</template>
</el-table-column>
</el-table>
<!--分页组件-->
<pagination />
</div>
</div>
</template>
<script>
import crudYsapoint from './ysapoint'
import CRUD, { crud, form, header, presenter } 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 = { point_id: null, point_code: null, pcsn: null, material_id: null, ivt_qty: null, qty_unit_id: null, instorage_time: null, ext_code: null, point_status: null, vehicle_type: null, standing_time: null, block_num: null, row_num: null, col_num: null, layer_num: null, remark: null, is_used: null, is_lock: null, create_id: null, create_name: null, create_time: null, update_optid: null, update_optname: null, update_time: null }
export default {
name: 'Ysapoint',
components: { pagination, crudOperation, rrOperation, udOperation },
dicts: ['sch_point_status', 'vehicle_type', 'is_used'],
mixins: [presenter(), header(), form(defaultForm), crud()],
cruds() {
return CRUD({
title: '养生A区',
url: 'api/ysapoint',
idField: 'point_id',
sort: 'point_id,desc',
crudMethod: { ...crudYsapoint },
optShow: {
add: false,
edit: true,
del: false,
download: false,
reset: true
}
})
},
data() {
return {
permission: {
},
rules: {
point_code: [
{ required: true, message: '点位编码不能为空', trigger: 'blur' }
],
standing_time: [
{ required: true, message: '静置时间(min)不能为空', trigger: 'blur' }
],
block_num: [
{ required: true, message: '块不能为空', trigger: 'blur' }
],
row_num: [
{ required: true, message: '排不能为空', trigger: 'blur' }
],
col_num: [
{ required: true, message: '列不能为空', trigger: 'blur' }
],
layer_num: [
{ required: true, message: '层不能为空', trigger: 'blur' }
],
is_used: [
{ required: true, message: '是否启用不能为空', trigger: 'blur' }
],
is_lock: [
{ required: true, message: '是否锁定不能为空', trigger: 'blur' }
]
},
locations: [],
locationsOptions: []
}
},
created() {
this.getLocationsOptions()
},
methods: {
// 钩子在获取表格数据之前执行false 则代表不获取数据
[CRUD.HOOK.beforeRefresh]() {
return true
},
hand(value) {
// 块排列 的参数整合
if (this.locations.length > 0) {
this.query.locationsOptions = this.locations[0] + '/' + this.locations[1] + '/' + this.locations[2]
}
this.crud.toQuery()
},
getLocationsOptions() {
crudYsapoint.arrangementTree().then(res => {
console.log(res)
this.locationsOptions = res
})
},
changeEnableOn(data) {
console.log(data)
crudYsapoint.changeUsedOn(data).then(res => {
this.crud.notify('操作成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
this.crud.toQuery()
})
},
changeEnableOff(data) {
console.log(data)
crudYsapoint.changeUsedOff(data).then(res => {
this.crud.notify('操作成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
this.crud.toQuery()
})
}
}
}
</script>
<style scoped>
</style>