更新物料、仓库、班组
This commit is contained in:
360
src/views/warehouse/warehouse-manage/in&out/drawer.vue
Normal file
360
src/views/warehouse/warehouse-manage/in&out/drawer.vue
Normal file
@@ -0,0 +1,360 @@
|
||||
<template>
|
||||
<el-drawer
|
||||
:visible.sync="visible"
|
||||
:show-close="false"
|
||||
:destroy-on-close="true"
|
||||
:wrapper-closable="false"
|
||||
class="drawer"
|
||||
size="60%">
|
||||
<small-title slot="title" :no-padding="true">库位信息</small-title>
|
||||
|
||||
<div class="content">
|
||||
<div class="visual-part">
|
||||
<el-form
|
||||
ref="dataForm"
|
||||
:model="dataForm"
|
||||
:rules="dataRule"
|
||||
label-width="100px"
|
||||
label-position="top"
|
||||
@keyup.enter.native="dataFormSubmit">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="库位名称" prop="name">
|
||||
<el-input v-model="dataForm.name" readonly />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="托盘编码" prop="palletCode">
|
||||
<el-input
|
||||
v-model="dataForm.palletCode"
|
||||
@input="$forceUpdate()"
|
||||
:readonly="isDetail"
|
||||
placeholder="请输入托盘编码" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
|
||||
<small-title
|
||||
style="margin: 16px 0; padding-left: 8px"
|
||||
:no-padding="true">
|
||||
物品信息
|
||||
<!-- <el-alert
|
||||
title="产品信息新增和修改后，需点击最下方保存按钮确定修改"
|
||||
type="warning"
|
||||
show-icon></el-alert> -->
|
||||
</small-title>
|
||||
|
||||
<div class="attr-list">
|
||||
<div
|
||||
style="position: absolute; top: -40px; right: 15px"
|
||||
v-if="!isDetail">
|
||||
<el-button @click="addNew" type="text">
|
||||
<i class="el-icon-plus"></i>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
<base-table
|
||||
:table-props="tableProps"
|
||||
:page="listQuery.pageNo"
|
||||
:limit="listQuery.pageSize"
|
||||
@emitFun="inputChange"
|
||||
:height="400"
|
||||
:table-data="productAttributeList"
|
||||
v-if="productAttributeList.length">
|
||||
<method-btn
|
||||
slot="handleBtn"
|
||||
v-if="!isDetail"
|
||||
:width="70"
|
||||
label="操作"
|
||||
:method-list="tableBtn"
|
||||
@clickBtn="handleClick" />
|
||||
</base-table>
|
||||
<!-- 没有数据 -->
|
||||
<div class="no-data-bg" v-else></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="position: absolute; bottom: 24px; right: 24px">
|
||||
<el-button style="margin-right: 10px" @click="goback()">返回</el-button>
|
||||
<span v-if="!isDetail">
|
||||
<el-button type="primary" @click="dataFormSubmit()">入库</el-button>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<product-attr-add
|
||||
v-if="addOrUpdateVisible"
|
||||
ref="addOrUpdate"
|
||||
@refreshDataList="addList" />
|
||||
</el-drawer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import productAttrAdd from './attr-add';
|
||||
import inputArea from '../../mixins/inputArea';
|
||||
import SmallTitle from './SmallTitle';
|
||||
import {
|
||||
inWarehouseRealtimeLocation,
|
||||
getWarehouseRealtimeLocation,
|
||||
} from '@/api/warehouse/warehouseRealtimeLocation';
|
||||
import { publicFormatter } from '@/utils/dict';
|
||||
|
||||
const tableBtn = [
|
||||
{
|
||||
type: 'delete',
|
||||
btnName: '删除',
|
||||
},
|
||||
];
|
||||
|
||||
const tableProps1 = [
|
||||
{
|
||||
prop: 'name',
|
||||
label: '物品名称',
|
||||
},
|
||||
{
|
||||
prop: 'code',
|
||||
label: '物品编码',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'specifications',
|
||||
label: '物品规格',
|
||||
},
|
||||
{
|
||||
prop: 'goodsBatch',
|
||||
label: '物品批次',
|
||||
subcomponent: inputArea,
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
prop: 'num',
|
||||
label: '数量',
|
||||
subcomponent: inputArea,
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
prop: 'unit',
|
||||
label: '单位',
|
||||
filter: publicFormatter('unit_dict'),
|
||||
width: 60,
|
||||
},
|
||||
];
|
||||
const tableProps2 = [
|
||||
{
|
||||
prop: 'name',
|
||||
label: '物品名称',
|
||||
},
|
||||
{
|
||||
prop: 'code',
|
||||
label: '物品编码',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'specifications',
|
||||
label: '物品规格',
|
||||
},
|
||||
{
|
||||
prop: 'goodsBatch',
|
||||
label: '物品批次',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
prop: 'num',
|
||||
label: '数量',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
prop: 'unit',
|
||||
label: '单位',
|
||||
filter: publicFormatter('unit_dict'),
|
||||
width: 60,
|
||||
},
|
||||
];
|
||||
export default {
|
||||
components: { productAttrAdd, SmallTitle },
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
addOrUpdateVisible: false,
|
||||
tableBtn,
|
||||
tableProps: [],
|
||||
productAttributeList: [],
|
||||
operator: '',
|
||||
dataForm: {
|
||||
id: null,
|
||||
name: '',
|
||||
palletCode: '',
|
||||
},
|
||||
listQuery: {
|
||||
pageSize: 10,
|
||||
pageNo: 1,
|
||||
total: 0,
|
||||
},
|
||||
isDetail: false,
|
||||
dataRule: {
|
||||
// palletCode: [
|
||||
// {
|
||||
// required: true,
|
||||
// message: '托盘编码不能为空',
|
||||
// trigger: 'blur',
|
||||
// },
|
||||
// ],
|
||||
},
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
initData() {
|
||||
this.productAttributeList.splice(0);
|
||||
},
|
||||
init(val, nickname, isDetail) {
|
||||
this.isDetail = isDetail || false;
|
||||
if (isDetail) {
|
||||
this.tableProps= tableProps2;
|
||||
}else{
|
||||
this.tableProps= tableProps1;
|
||||
}
|
||||
this.operator = nickname;
|
||||
this.dataForm.id = val.id;
|
||||
this.dataForm.locationId = val.locationId;
|
||||
this.dataForm.name = val.name;
|
||||
this.dataForm.palletCode = val.palletCode;
|
||||
this.initData();
|
||||
this.visible = true;
|
||||
this.$nextTick(() => {
|
||||
this.$refs['dataForm'].resetFields();
|
||||
|
||||
if (this.dataForm.id) {
|
||||
// 获取产品详情
|
||||
// 获取产品的属性列表
|
||||
this.getList();
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
getList() {
|
||||
// 获取产品的属性列表
|
||||
getWarehouseRealtimeLocation(this.dataForm.locationId).then(
|
||||
(response) => {
|
||||
this.productAttributeList = response.data;
|
||||
}
|
||||
);
|
||||
},
|
||||
inputChange(data) {
|
||||
switch (data.sType) {
|
||||
case 1:
|
||||
this.productAttributeList[data._pageIndex - 1][data.prop] =
|
||||
data[data.prop];
|
||||
break;
|
||||
case 2:
|
||||
this.productAttributeList[data._pageIndex - 1][data.prop] =
|
||||
data.string ? data.string.split('+')[0] : '';
|
||||
this.productAttributeList[data._pageIndex - 1][data.prop + 'Name'] =
|
||||
data.string ? data.string.split('+')[1] : '';
|
||||
break;
|
||||
default:
|
||||
console.log(val);
|
||||
}
|
||||
},
|
||||
handleClick(raw) {
|
||||
if (raw.type === 'delete') {
|
||||
this.$confirm(
|
||||
`是否确认删除名称为"${raw.data.name}"的数据项?`,
|
||||
'系统提示',
|
||||
{
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}
|
||||
)
|
||||
.then(() => {
|
||||
this.productAttributeList.splice(raw.data._pageIndex - 1, 1);
|
||||
})
|
||||
.catch(() => {});
|
||||
} else {
|
||||
this.addNew(raw.data._pageIndex);
|
||||
}
|
||||
},
|
||||
// 表单提交
|
||||
dataFormSubmit() {
|
||||
this.productAttributeList.forEach((item) => {
|
||||
item.id = '';
|
||||
});
|
||||
const data = {
|
||||
realtimeLocationId: this.dataForm.id,
|
||||
palletCode: this.dataForm.palletCode,
|
||||
operator: this.operator,
|
||||
goodsInfos: this.productAttributeList,
|
||||
};
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
// 修改的提交
|
||||
if (this.dataForm.id) {
|
||||
inWarehouseRealtimeLocation(data).then((response) => {
|
||||
this.$modal.msgSuccess('修改成功');
|
||||
this.visible = false;
|
||||
this.$emit('refreshDataList');
|
||||
});
|
||||
return;
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
// 新增 / 修改
|
||||
addNew(index) {
|
||||
this.addOrUpdateVisible = true;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.addOrUpdate.init(index);
|
||||
});
|
||||
},
|
||||
addList(data) {
|
||||
this.productAttributeList.push(data.productInfo);
|
||||
},
|
||||
goback() {
|
||||
this.$emit('refreshDataList');
|
||||
this.visible = false;
|
||||
this.initData();
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.drawer >>> .el-drawer {
|
||||
border-radius: 8px 0 0 8px;
|
||||
}
|
||||
|
||||
.drawer >>> .el-form-item__label {
|
||||
padding: 0;
|
||||
}
|
||||
.drawer >>> .el-form-item {
|
||||
margin: 0;
|
||||
}
|
||||
.drawer >>> .el-drawer__header {
|
||||
margin: 0;
|
||||
padding: 32px 32px 24px;
|
||||
border-bottom: 1px solid #dcdfe6;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.drawer >>> .content {
|
||||
padding: 0 24px 30px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.drawer >>> .visual-part {
|
||||
flex: 1 auto;
|
||||
max-height: 76vh;
|
||||
overflow: hidden;
|
||||
overflow-y: scroll;
|
||||
padding-right: 10px; /* 调整滚动条样式 */
|
||||
}
|
||||
|
||||
.drawer >>> .el-form,
|
||||
.drawer >>> .attr-list {
|
||||
padding: 0 16px;
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user