factory_web/src/views/inm/mioitem_form.vue

288 lines
11 KiB
Vue

<template>
<el-dialog :title="titleMap[form.type]" v-model="visible" :size="1000" destroy-on-close @closed="$emit('closed')">
<el-form ref="dialogForm" :model="form" :rules="rules" label-width="120px">
<el-form-item label="物料">
<el-select v-model="selectMaterial" value-key="id" clearable style="width: 100%;"
@change="selectMaterialChange">
<el-option v-for="item in materialOptions" :key="item.id" :label="item.number" :value="item">
<span style="float: left">{{ item.number }}</span>
<span style=" float: right; color: var(--el-text-color-secondary);font-size: 13px;">{{ item.name }}</span>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="批次号">
<!-- <el-input v-model="form.batch" placeholder="手动输入批次号" :disabled="inputBatchDisable" /> -->
<el-select v-model="form.batch" value-key="id" filterable allow-create clearable style="width: 100%;" :disabled="inputBatchDisable">
<el-option
v-for="item in wbatchOptions"
:key="item"
:label="item"
:value="item">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="仓库已有批次">
<el-select v-model="selectBatch" value-key="id" clearable style="width: 100%;" @change="selectBatchChange"
@clear="selectBatchClear" :disabled="selectBatchDisable">
<el-option v-for="item in batchOptions" :key="item.id" :label="item.batch" :value="item">
<span style="float: left">{{ item.batch }}</span>
<span style="
float: right;
color: var(--el-text-color-secondary);
font-size: 13px;
">{{ item.count }} -- {{ item.warehouse_name }}</span>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="仓库">
<el-select v-model="form.warehouse" clearable style="width: 100%;" :disabled="warehouseDisable">
<el-option v-for="item in warehouseOptions" :key="item.id" :label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="数量">
<el-input-number v-model="form.count" :min="1" style="width: 100%;" />
</el-form-item>
<div v-if="assembShow">
<el-row v-for="item in components" v-bind:key="item" style="margin-bottom:8px">
<el-col :span="12">
{{ item.number }} - {{ item.name }}
</el-col>
<el-col :span="12">
<el-select v-model="item.batch" clearable style="width: 100%;">
<el-option v-for="itemx in item.batchOptions" :key="itemx.id" :label="itemx.batch"
:value="itemx.batch">
<span style="float: left">{{ itemx.batch }}</span>
<span style="
float: right;
color: var(--el-text-color-secondary);
font-size: 13px;
">{{ itemx.count }}</span>
</el-option>
</el-select>
</el-col>
</el-row>
</div>
</el-form>
<template #footer>
<el-button type="primary" :loading="isSaveing" @click="submit">
保存
</el-button>
<el-button @click="dialogVisible = false">取消</el-button>
</template>
</el-dialog>
</template>
<script>
const defaultForm = {
"state": 10,
"type": "do_in"
}
export default {
emits: ["success", "closed"],
props: {
mioId: { type: String, default: '' },
belongDeptName:{type: String, default: ''},
belongDeptId: { type: String, default: null },
mioObj: { type: Object }
},
data() {
return {
type: 'do_in',
loading: false,
mode: "add",
titleMap: {
'do_out': '生产领料',
'sale_out': '销售发货',
'pur_in': '采购入库',
'do_in': '生产入库',
'other_in': '其他入库',
'other_out': '其他出库',
},
form: {},
rules: {
material: [{ required: true, message: "请选择所需产品", trigger: "blur" }],
},
visible: false,
isSaveing: false,
materialOptions: [],
batchOptions: [],
setFiltersVisible: false,
warehouseOptions: [],
warehouseDisable: false,
selectBatchDisable: false,
assembShow: false,
selectMaterial: null,
selectBatch: null,
components: [],
wbatchOptions:[],
};
},
mounted() {
this.getBatchs();
},
methods: {
init() {
this.getMaterialOptions()
this.getWarehouseOptions()
},
getWarehouseOptions() {
this.$API.inm.warehouse.list.req({ page: 0 }).then(res => {
this.warehouseOptions = res
})
},
//获取车间物料批次号
getBatchs(){
let that = this;
this.$API.wpm.wmaterial.batchs.req({belong_dept_name:this.belongDeptName}).then(res=>{
that.wbatchOptions = res;
});
},
getMaterialOptions() {
var type = this.form.type
var query
if (type == 'do_out') {
query = { page: 0, type__in: '10, 20, 30', is_hidden: false, is_assemb: false }
this.inputBatchDisable = true
}
else if (type == 'do_in') {
query = { page: 0, type__in: '10, 20', is_hidden: false }
this.inputBatchDisable = false
}
else if (type == 'pur_in') {
query = { page: 0, type__in: 30, is_hidden: false, pu_orderitem_material__pu_order: this.mioObj.pu_order }
this.inputBatchDisable = false
}
else if (type == 'sale_out') {
query = { page: 0, type__in: 10, is_hidden: false, orderitem_material__order: this.mioObj.order }
this.inputBatchDisable = true
}
else {
query = { page: 0 }
}
this.$API.mtm.material.list.req(query).then(res => {
this.materialOptions = res
})
},
async initAssemb(item) {
this.selectBatchDisable = true
this.assembShow = true
this.components = []
var id__in = Object.keys(item.components).join(',')
if (id__in.length > 0) {
var res = await this.$API.mtm.material.list.req({ page: 0, id__in: id__in })
this.components = res
for (var i = 0; i < this.components.length; i++) {
var res2 = await this.$API.wpm.wmaterial.list.req({ page: 0, material: this.components[i].id, belong_dept: this.belongDeptId, count__gte: 1 })
this.components[i].batchOptions = res2
}
}
},
getBatchOptions() {
this.$API.inm.warehouse.batch.req({ page: 0, material: this.form.material, count__gte: 1 }).then(res => {
this.batchOptions = res
if (res.length == 0) {
this.selectBatchDisable = true
} else {
this.selectBatchDisable = false
}
})
},
selectMaterialChange(item) {
var that = this
var type = this.form.type
var material = item.id
that.form.material = material
if (type == 'do_in') {
if (item.is_assemb) {
this.initAssemb(item)
} else {
this.selectBatchDisable = false
this.components = []
this.assembShow = false
this.getBatchOptions()
}
}
else {
this.getBatchOptions()
}
},
getItem(options, id) {
for (var i = 0; i < options.length; i++) {
if (options[i].id == id) {
return options[i]
}
}
},
selectBatchChange(item) {
// var item = this.getItem(this.batchOptions, id)
this.form.batch = item.batch
this.form.warehouse = item.warehouse
this.warehouseDisable = true
this.inputBatchDisable = true
},
selectBatchClear() {
this.form.batch = ''
this.form.warehouse = ''
this.warehouseDisable = false
this.inputBatchDisable = false
},
//显示
open(mode = "add", type = "") {
this.mode = mode;
this.form.type = type;
if (mode == 'add') {
this.init()
}
this.visible = true;
return this;
},
//提交
submit() {
this.$refs.dialogForm.validate(async (valid) => {
if (valid) {
this.isSaveing = true;
this.form.mio = this.mioId;
if (this.components.length > 0) {
this.form.assemb = []
for (var i = 0; i < this.components.length; i++) {
this.form.assemb.push({ 'material': this.components[i].id, 'batch': this.components[i].batch })
}
}
try {
var res;
if (this.mode == "add") {
res = await this.$API.inm.mioitem.create.req(this.form);
} else if (this.mode == "edit") {
res = await this.$API.inm.mioitem.update.req(this.form.id, this.form);
}
this.isSaveing = false;
this.$emit("success", this.form, this.mode);
this.visible = false;
this.$message.success("操作成功");
} catch (err) {
console.log(err)
//可以处理校验错误
this.isSaveing = false;
return err;
}
}
});
},
//表单注入数据
setData(data) {
Object.assign(this.form, data);
},
//设置过滤项
setFilters(filters) {
this.selectionFilters = filters;
this.setFiltersVisible = true;
},
},
};
</script>
<style></style>