factory_web/src/views/mtm/route_form.vue

608 lines
17 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>
<el-dialog
:title="titleMap[mode]"
v-model="visible"
:size="1000"
append-to-body
destroy-on-close
@closed="$emit('closed')"
>
<el-container v-loading="loading">
<el-main style="padding: 0 20px 20px 20px">
<el-form
ref="dialogForm"
:model="form"
:rules="rules"
:disabled="mode === 'show'"
label-position="right"
label-width="100px"
>
<el-row>
<el-col :md="12" :sm="24">
<el-form-item label="工序" prop="process">
<el-select
v-model="form.process"
placeholder="工序"
clearable
filterable
style="width: 100%"
@change="processChange"
>
<el-option
v-for="item in options"
:key="item.id"
:label="item.name"
:value="item.id"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="出材率" prop="out_rate">
<el-input-number
v-model="form.out_rate"
:max="100"
:precision="1"
:step="0.1"
style="width: 100%"
/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="输入物料" prop="material_in">
<xtSelect
:apiObj="apiObjM"
v-model="form.material_in"
v-model:label="form.material_in_name"
:labelField="'full_name'"
style="width: 100%;"
:params = "paramsMIn"
>
<el-table-column label="物料">
<template #default="scope">
{{ scope.row.full_name }}
<span v-if="scope.row.is_hidden" style="float: right;color:'#E6A23C';font-size:13px;">隐</span>
</template>
</el-table-column>
</xtSelect>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="输出物料" prop="material_out">
<xtSelect
:apiObj="apiObjM"
v-model="form.material_out"
v-model:label="form.material_out_name"
:labelField="'full_name'"
style="width: 100%;"
:params = "paramsMOut"
>
<el-table-column label="物料">
<template #default="scope">
{{ scope.row.full_name }}
<span v-if="scope.row.is_hidden" style="float: right;color:'#E6A23C';font-size:13px;">隐</span>
</template>
</el-table-column>
</xtSelect>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="切分数量">
<el-input-number
v-model="form.div_number"
:min="0"
:disabled="divDisable"
style="width: 100%"
/>
</el-form-item>
</el-col>
<!-- 10单个 20批次 -->
<el-col :md="12" :sm="24">
<el-form-item label="追踪方式">
<el-select
clearable
v-model="form.material_out_tracking"
placeholder="输出物料追踪方式"
:value-on-clear="null"
style="width: 100%"
>
<el-option label="单个" :value="20"></el-option>
<el-option label="批次" :value="10"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row v-if="project_code=='bxerp'&&processName=='捆棒'">
<el-col :md="12" :sm="24">
<el-form-item label="单丝长度">
<el-input-number
v-model="params_json2.dscd"
:min="0"
style="width: 100%"
/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="丝径">
<el-input-number
v-model="params_json2.sijing"
:min="0"
style="width: 100%"
/>
</el-form-item>
</el-col>
</el-row>
<el-row v-if="project_code=='bxerp'&&processName=='排一次棒'">
<el-col :md="12" :sm="24">
<el-form-item label="一次丝对边">
<el-input-number
v-model="params_json.duibian1"
:min="0"
style="width: 100%"
/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="二次丝对边">
<el-input-number
v-model="params_json.duibian2"
:min="0"
style="width: 100%"
/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="一次丝长度">
<el-input-number
v-model="params_json.changdu1"
:min="1"
style="width: 100%"
/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="二次丝长度">
<el-input-number
v-model="params_json.changdu2"
:min="1"
style="width: 100%"
/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="排板根数">
<el-input-number
v-model="params_json.pbnum"
:min="1"
style="width: 100%"
/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="排板丝高">
<el-input-number
v-model="params_json.pbsigao"
:min="1"
style="width: 100%"
/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="排板包边">
<el-select v-model="params_json.pbbb" style="width: 100%">
<el-option label="是" value="是"></el-option>
<el-option label="否" value="否"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col>
<el-form-item label="工艺图纸">
<sc-upload-multiple v-model="fileurl" @imagesDel="imagesDel" @imagesChange="imagesChange" draggable :disabled="mode === 'show'" :limit="9" tip="最多上传9个文件,单个文件不要超过10M,请上传图像格式文件"></sc-upload-multiple>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :md="12" :sm="24">
<el-form-item label="计划时长" prop="hour_work">
<el-input-number
v-model="form.hour_work"
:min="0"
style="width: 100%"
/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="排序">
<el-input-number
v-model="form.sort"
:min="1"
style="width: 100%"
/>
</el-form-item>
</el-col>
<el-col :md="12" :sm="24" v-if="project_code!=='bxerp'">
<el-form-item label="批次校验">
<el-switch v-model="form.batch_bind" />
</el-form-item>
</el-col>
</el-row>
<el-row v-if="project_code=='bxerp'&&(mode=='edit'||mode=='show')">
<sc-form-table
hideDelete
:hideAdd="mode === 'show'"
ref="routematTable"
:tableHeight="300"
v-model="routemats"
:addTemplate="addTemplate"
placeholder="暂无数据"
>
<el-table-column prop="number" label="辅料编号">
<template #default="scope">
<el-select
v-model="scope.row.material"
placeholder="辅料编号"
clearable
style="width: 100%"
>
<el-option
v-for="item in materialOptions"
:key="item.id"
:label="item.full_name"
:value="item.id"
>
</el-option>
</el-select>
</template>
</el-table-column>
<el-table-column v-if="mode !== 'show'" prop="open" label="操作" width="125" align="center">
<template #default="scope">
<el-button
text
v-if="scope.row.id==''"
type="primary"
size="small"
@click="formTableSave(scope.row)"
>保存</el-button
>
<el-button
text
v-else
type="danger"
size="small"
@click="formTableDel(scope.row)"
>删除</el-button
>
</template>
</el-table-column>
</sc-form-table>
</el-row>
</el-form>
</el-main>
<el-footer>
<el-button v-if="mode !== 'show'" type="primary" :loading="isSaveing" @click="submit">提交</el-button>
<el-button @click="visible = false">{{ mode === "show" ? "关闭" : "取消" }}</el-button>
</el-footer>
</el-container>
</el-dialog>
</template>
<script>
const defaultForm = {
process: null,
sort: 1,
out_rate: 100,
material_in:'',
material_in_name:'',
material_out:'',
material_out_name:'',
hour_work:0,
div_number:1,
batch_bind: false,
is_autotask: true,
material_out_tracking:10
};
export default {
props: {
count: { type: Number, default : 0 },
routepack: { type: String, default: "" },
// 打开时的预填数据(画布拉线传入)挂载即确定避免事后setData在任何时序下带入脏数据
prefill: { type: Object, default: null },
},
emits: ["success", "closed"],
data() {
return {
loading: false,
mode: "add",
//表单数据
form: Object.assign({}, defaultForm),
//验证规则
rules: {
process: [
{ required: true, message: "请选择工序", trigger: "blur" },
],
},
params_json:{
duibian1:0,
duibian2:0,
changdu1:0,
changdu2:0,
pbnum:0,
pbsigao:0,
pbbb:'是',
},
params_json2:{
dscd:0,
sijing:0,
},
visible: false,
isSaveing: false,
divDisable:false,
materialsIn: [],
materialsOut: [],
fileIds: [],
fileurl:[],
mgroups: [],
options: [],
routemats:[],
fileurl_form:[],
paramsJsonFileurl:[],
materialOptions:[],
titleMap: { add: "新增", edit: "编辑", show: "工序详情" },
setFiltersVisible: false,
routeId: "",
processName: "",
project_code: "",
addTemplate:{
id:'',
material:'',
route:'',
},
apiObjM: this.$API.mtm.material.list,
paramsMIn: { type__in: '10,20,30',ordering: '-create_time',query:'{full_name,id,is_hidden}'},
paramsMOut: { type__in: '10,20,30',ordering: '-create_time',query:'{full_name,id,is_hidden}'},
};
},
mounted() {
this.getMgroup();
this.getProcess();
if(this.project_code=='bxerp'&&this.mode=='edit'){
this.getMaterialOptions();
}
this.project_code = this.$TOOL.data.get("BASE_INFO").base.base_code;
this.form.routepack = this.routepack;
if(this.project_code=='bxerp'||this.project_code=='tcerp'){
this.form.material_out_tracking = 20;
}
},
methods: {
clearHandle(key) {
this.form[key] = null;
},
getMgroup() {
let that = this;
that.$API.mtm.mgroup.list.req({ page: 0 }).then((res) => {
that.mgroups = res;
});
},
getMaterialOptions() {
let that = this;
that.$API.mtm.material.list.req({ page: 0, type__in: "20,30"}).then((res) => {
that.materialOptions = res;
});
},
getProcess() {
let that = this;
that.$API.mtm.process.list.req({ page: 0 }).then((res) => {
that.options = res;
});
},
getroutemats(){
let that = this;
// 无 routeId(画布拉线预填等新增场景)时不请求,避免拉回全量辅料
if (!that.routeId) {
that.routemats = [];
return;
}
that.$API.mtm.routemat.list.req({ route: that.routeId,page: 0}).then((res) => {
that.routemats = res;
});
},
formTableSave(row){
let that = this;
that.$API.mtm.routemat.create.req(row).then((res) => {
that.getroutemats();
});
},
formTableDel(row){
let that = this;
this.$confirm(`确定删除吗?`, "提示", {
type: "warning",
}).then(() => {
this.$API.mtm.routemat.delete.req(row.id).then((res) => {
let index = this.routemats.findIndex((item) => item.id === row.id);
this.routemats.splice(index, 1);
this.$message.success("删除成功");
that.getroutemats();
}).catch((err) => {
return err;
});
}).catch(() => {});
},
processChange(){
let that = this;
that.options.forEach((item) => {
if (item.id == that.form.process) {
that.processName = item.name;
if(item.mtype==20){
that.divDisable = false;
}else{
that.divDisable = true;
}
}
})
},
//合并新增的图片Ids
imagesChange(data,data1){
let that = this;
let files = [];
that.fileIds = data;
data1.forEach((item)=>{
let obj = {};
obj.id = item.id;
obj.file = item.file;
obj.name = item.name;
obj.path = item.path;
obj.url = item.path;
files.push(obj);
})
if(that.fileurl_form.length>0){
that.paramsJsonFileurl = that.fileurl_form.concat(files);
}else{
that.paramsJsonFileurl = files;
}
that.params_json.fileurl = JSON.stringify(that.paramsJsonFileurl);
},
//合并新增的图片Ids
imagesDel(index){
let that = this;
that.fileIds.splice(index,1);
let id = that.paramsJsonFileurl[index].id;
let list = that.fileurl_form.filter(item => item.id != id);
that.fileurl_form = list;
let list1 = that.paramsJsonFileurl.filter(item1 => item1.id != id);
that.paramsJsonFileurl = list1;
that.params_json.fileurl = JSON.stringify(that.paramsJsonFileurl);
},
//重置表单状态open时主动清空不依赖父级v-if销毁组件关闭动画期间重开会复用实例导致残留上次内容
resetForm() {
this.form = Object.assign({}, defaultForm);
this.form.routepack = this.routepack;
if (this.project_code == "bxerp" || this.project_code == "tcerp") {
this.form.material_out_tracking = 20;
}
this.params_json = {
duibian1: 0,
duibian2: 0,
changdu1: 0,
changdu2: 0,
pbnum: 0,
pbsigao: 0,
pbbb: "是",
};
this.params_json2 = { dscd: 0, sijing: 0 };
this.fileIds = [];
this.fileurl = [];
this.fileurl_form = [];
this.paramsJsonFileurl = [];
this.routemats = [];
this.routeId = "";
this.processName = "";
this.divDisable = false;
},
//显示
open(mode = "add") {
let that = this;
that.mode = mode;
that.resetForm();
if (that.project_code == "bxerp" && (mode === "edit" || mode === "show")) {
that.getMaterialOptions();
}
if (that.prefill) that.setData(that.prefill);
that.visible = true;
that.$nextTick(() => {
// 仅新增时按现有数量预填排序;编辑时保留 setData 带入的原 sort
if(that.count && mode === "add"){
that.form.sort = that.count+1;
}
that.$refs.dialogForm && that.$refs.dialogForm.clearValidate();
})
return this;
},
//表单注入数据
setData(data) {
let that = this;
Object.assign(that.form, data);
that.routeId = data.id;
that.addTemplate.route = data.id;
// 画布拖线新增(prefill)或后端数据无params_json时保留默认值,避免undefined导致模板取值报错
if (that.form.params_json) {
that.params_json = Object.assign({}, that.params_json, that.form.params_json);
}
if((this.project_code=='bxerp'||this.project_code=='tcerp')&&this.form.material_out_tracking==null){
this.form.material_out_tracking = 20;
}
if(data.process_name=='捆棒'&&that.form.params_json){
that.params_json2 = Object.assign({}, that.params_json2, that.form.params_json);
}
if(data.process_name=='排一次棒'){
that.fileIds= [];
if(that.params_json.fileurl&&that.params_json.fileurl!=="[]"){
let fileurl = JSON.parse(that.params_json.fileurl);
fileurl.forEach((item)=>{
item.url = item.path;
that.fileIds.push(item.id);
that.fileurl.push(item);
that.fileurl_form.push(item);
})
that.paramsJsonFileurl = that.fileurl_form;
}
}
setTimeout(() => {
that.options.forEach((item) => {
if (item.id == data.process) {
that.processName = item.name;
}
})
},500)
that.getroutemats();
},
//表单提交方法
submit() {
let that = this;
that.$refs.dialogForm.validate(async (valid) => {
if (valid) {
that.isSaveing = true;
if(that.processName=='排一次棒'){
that.form.params_json = that.params_json;
}
if(that.processName=='捆棒'){
that.form.params_json = that.params_json2;
}
console.log('that.form',that.form);
if (that.mode === "add") {
that.$API.mtm.route.create.req(that.form).then((res) => {
that.isSaveing = false;
that.$emit("success");
that.visible = false;
that.$message.success("操作成功");
}).catch((res) => {
that.isSaveing = false;
});
} else {
that.$API.mtm.route.update.req(that.form.id, that.form).then((res) => {
that.isSaveing = false;
that.$emit("success");
that.visible = false;
that.$message.success("操作成功");
}).catch((res) => {
that.isSaveing = false;
});
}
}
});
},
//设置过滤项
setFilters(filters) {
this.selectionFilters = filters;
this.setFiltersVisible = true;
},
},
};
</script>
<style></style>