<template>
|
<div class="wmsBatchRuleDetail-container">
|
<!-- 添加、编辑 -->
|
<el-dialog v-model="dialogVisible" width="90%" @close="closeDialog">
|
<template #header>
|
<div style="color: #fff">
|
<span>{{ dialogType == "add" ? "添加" : "编辑" }}</span>
|
</div>
|
</template>
|
<el-form :model="addForm" label-width="90px" ref="dialogRef" :rules="formRules">
|
<el-row>
|
<el-col :span="6">
|
<el-form-item label="规则编号:" prop="ruleCode">
|
<el-input v-model="addForm.ruleCode" :disabled="dialogType != 'add'" clearable
|
placeholder="请输入规则编号" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-form-item label="规则名称:" prop="ruleName">
|
<el-input v-model="addForm.ruleName" :disabled="dialogType != 'add'" clearable
|
placeholder="请输入规则名称" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
<br />
|
<div class="msi-content" style="margin-top: 0; padding: 0">
|
<div class="header">
|
<div>
|
<el-button type="primary" icon="el-icon-plus" @click="confirmAddMaterial">新增</el-button>
|
<el-button icon="el-icon-delete" plain :disabled="checkedDetails.length == 0"
|
@click="delCheckedDetails">删除选中行</el-button>
|
</div>
|
</div>
|
<br />
|
|
<el-table :data="warehousOrderDetails" border style="width: 100%" row-key="id" ref="detailRef"
|
@selection-change="detailsCheckChange" :max-height="280">
|
<el-table-column align="center" width="60" type="selection" />
|
<el-table-column label="序号" align="center" width="60" type="index" />
|
|
<!-- <el-table-column
|
label="BOM编号"
|
align="center"
|
min-width="150">
|
<template #default="scope">
|
<el-select v-model="scope.row.boM_NO" filterable clearable placeholder="请选择BOM编号"
|
style="width: 100%;">
|
<el-option v-for="item in BomEnum" :key="item.value" :label="item.label" :value="item.value" />
|
</el-select>
|
</template>
|
</el-table-column> -->
|
|
<el-table-column label="批次规则" align="center" min-width="120">
|
<template #default="scope">
|
<el-select clearable v-model="scope.row.batchRuleType" placeholder="请选择批次规则">
|
<el-option v-for="(item, index) in getEnumBatchRuleTypeData" :key="index"
|
:value="item.value" :label="`${item.describe}`"></el-option>
|
</el-select>
|
</template>
|
</el-table-column>
|
|
<!-- <el-table-column label="批次标签" align="center" min-width="100">
|
<template #default="scope">
|
<el-input v-model="scope.row.batchTag" placeholder="请输入批次标签" maxlength="255" show-word-limit
|
clearable />
|
</template>
|
</el-table-column> -->
|
|
<el-table-column label="属性格式" align="center" min-width="100">
|
<template #default="scope">
|
<el-select clearable v-model="scope.row.attrForamt" placeholder="请选择属性格式">
|
<el-option v-for="(item, index) in getEnumAttrForamtData" :key="index" :value="item.value"
|
:label="`${item.describe}`"></el-option>
|
</el-select>
|
</template>
|
</el-table-column>
|
|
<!-- <el-table-column label="属性选项" align="center" min-width="100">
|
<template #default="scope">
|
<el-select clearable v-model="scope.row.attrOption" placeholder="请选择属性选项">
|
<el-option v-for="(item, index) in getEnumAttrOptionData" :key="index" :value="item.value"
|
:label="`${item.describe}`"></el-option>
|
</el-select>
|
</template>
|
</el-table-column> -->
|
|
<el-table-column label="输入控制" align="center" min-width="100">
|
<template #default="scope">
|
<el-select clearable v-model="scope.row.inputControl" placeholder="请选择输入控制">
|
<el-option v-for="(item, index) in getEnumInputControlData" :key="index" :value="item.value"
|
:label="`${item.describe}`"></el-option>
|
</el-select>
|
</template>
|
</el-table-column>
|
|
<el-table-column label="优先级" align="center" min-width="110">
|
<template #default="scope">
|
<el-select clearable v-model="scope.row.priority" placeholder="请选择优先级">
|
<el-option v-for="(item, index) in getEnumPriorityData" :key="index" :value="item.value"
|
:label="`${item.describe}`"></el-option>
|
</el-select>
|
</template>
|
</el-table-column>
|
|
<!-- <el-table-column label="RF标签" align="center" min-width="100">
|
<template #default="scope">
|
<el-input v-model="scope.row.rfTag" placeholder="请输入RF标签" maxlength="255" show-word-limit
|
clearable />
|
</template>
|
</el-table-column>
|
|
|
|
<el-table-column label="RF显示" align="center" min-width="100">
|
<template #default="scope">
|
<el-switch v-model="scope.row.rFShow" active-text="是" inactive-text="否" />
|
</template>
|
</el-table-column>
|
|
|
<el-table-column label="关键属性" align="center" min-width="100">
|
<template #default="scope">
|
<el-input v-model="scope.row.keyAttr" placeholder="请输入关键属性" maxlength="255" show-word-limit
|
clearable />
|
</template>
|
</el-table-column>
|
|
<el-table-column label="规则描述" align="center" min-width="100">
|
<template #default="scope">
|
<el-input v-model="scope.row.ruleDesc" placeholder="请输入规则描述" maxlength="255" show-word-limit
|
clearable />
|
</template>
|
</el-table-column> -->
|
</el-table>
|
</div>
|
|
<template #footer>
|
<span class="dialog-footer">
|
<el-button @click="dialogVisible = false">取消</el-button>
|
<el-button :disabled="disabled_btn" type="primary" @click="confirm">确认</el-button>
|
</span>
|
</template>
|
</el-dialog>
|
</div>
|
</template>
|
<style scoped>
|
:deep(.el-select),
|
:deep(.el-input-number) {
|
width: 100%;
|
}
|
</style>
|
<script lang="ts" setup>
|
import { ref, onMounted } from "vue";
|
import { getDictDataItem as di, getDictDataList as dl } from "/@/utils/dict-utils";
|
import { ElMessage, ElMessageBox } from "element-plus";
|
import type { FormRules } from "element-plus";
|
import {
|
addWmsBatchRuleDetail,
|
updateWmsBatchRuleDetail,
|
detailWmsBatchRuleDetail,
|
pageWmsBatchRuleDetailPageGroup,
|
} from "/@/api/main/WmsBase/wmsBatchRuleDetail";
|
import { getAPI } from "/@/utils/axios-utils";
|
import { SysEnumApi } from "/@/api-services/api";
|
const getEnumBatchRuleTypeData = ref<any>([]);
|
const getEnumAttrForamtData = ref<any>([]);
|
const getEnumAttrOptionData = ref<any>([]);
|
const getEnumInputControlData = ref<any>([]);
|
const getEnumPriorityData = ref<any>([]);
|
//父级传递来的参数
|
var props = defineProps({
|
title: {
|
type: String,
|
default: "",
|
},
|
});
|
//父级传递来的函数，用于回调
|
const emit = defineEmits(["reloadTable"]);
|
const ruleFormRef = ref();
|
const dialogRef = ref();
|
|
const isShowDialog = ref(false);
|
const loading = ref(false);
|
const disabled_btn = ref(false);
|
const ruleForm = ref<any>({});
|
//自行添加其他规则
|
const rules = ref<FormRules>({
|
ruleCode: [{ required: true, message: "请输入规则编号！", trigger: "blur" }],
|
ruleName: [{ required: true, message: "请输入规则名称！", trigger: "blur" }],
|
batchRuleType: [{ required: true, message: "请选择批次规则！", trigger: "change" }],
|
attrForamt: [{ required: true, message: "请选择属性格式！", trigger: "change" }],
|
inputControl: [{ required: true, message: "请选择输入控制！", trigger: "change" }],
|
isDisabled: [{ required: true, message: "请选择是否禁用！", trigger: "change" }],
|
isDelete: [{ required: true, message: "请选择软删除！", trigger: "change" }],
|
});
|
|
//窗口类型
|
const dialogType = ref("add");
|
|
/*
|
* 打开弹窗
|
* @param flag 标记（1新增 2编辑 3查看）
|
* @param row 行数据
|
*/
|
const openDialog = async (flag: number, row: any) => {
|
debugger;
|
|
// ruleForm.value = JSON.parse(JSON.stringify(row));
|
// 改用detail获取最新数据来编辑
|
let rowData = JSON.parse(JSON.stringify(row));
|
if (rowData.id)
|
ruleForm.value = (await detailWmsBatchRuleDetail(rowData.id)).data.result;
|
else {
|
ruleForm.value = rowData;
|
ruleForm.value.isDisabled = false; //必填，赋值默认值
|
}
|
isShowDialog.value = true;
|
};
|
|
//添加/编辑参数
|
let addForm = ref({});
|
const checkedDetails = ref<any[]>([]);
|
|
//rules
|
const formRules = {
|
ruleCode: [{ required: true, message: "请输入规则编号！", trigger: "blur" }],
|
ruleName: [{ required: true, message: "请输入规则名称！", trigger: "blur" }],
|
};
|
//库存物料窗口
|
const addMaterialVisible = ref(false);
|
//添加编辑窗口物料列表
|
const warehousOrderDetails = ref<any[]>([]);
|
//点击新增联系人
|
const confirmAddMaterial = () => {
|
warehousOrderDetails.value.push({
|
id: warehousOrderDetails.value.length + 1,
|
});
|
addMaterialVisible.value = false;
|
};
|
//删除选中的物料详情
|
const delCheckedDetails = () => {
|
ElMessageBox.confirm("是否确认删除？", "提示", {
|
confirmButtonText: "确认",
|
cancelButtonText: "取消",
|
type: "warning",
|
})
|
.then(() => {
|
checkedDetails.value.forEach((item) => {
|
const index = warehousOrderDetails.value.findIndex(
|
(detail) => detail.id == item.id
|
);
|
warehousOrderDetails.value.splice(index, 1);
|
});
|
checkedDetails.value = [];
|
// detailRef.value.clearSelection();
|
})
|
.catch(() => ElMessage.info("已取消删除"));
|
};
|
|
const openDialog2 = async (flag: number, row: any) => {
|
if (flag == 2) {
|
dialogType.value = "edit";
|
var res = await pageWmsBatchRuleDetailPageGroup({
|
ruleCode: row.ruleCode
|
});
|
debugger
|
if (res.data.type == "success") {
|
addForm.value.ruleCode = res.data.result?.items[0]?.ruleCode;
|
addForm.value.ruleName = res.data.result?.items[0]?.ruleName;
|
warehousOrderDetails.value = res.data.result?.items[0]?.wmsBatchRuleDetailOutputsList ?? [];
|
}
|
} else {
|
dialogType.value = "add";
|
warehousOrderDetails.value = [];
|
}
|
dialogVisible.value = true;
|
|
// ruleForm.value = JSON.parse(JSON.stringify(row));
|
// 改用detail获取最新数据来编辑
|
// let rowData = JSON.parse(JSON.stringify(row));
|
// if (rowData.id)
|
// ruleForm.value = (await detailWmsBatchRuleDetail(rowData.id)).data.result;
|
// else {
|
// ruleForm.value = rowData;
|
// ruleForm.value.isDisabled = false;//必填，赋值默认值
|
// }
|
};
|
// 关闭弹窗
|
const closeDialog = () => {
|
emit("reloadTable");
|
addForm.value = {};
|
isShowDialog.value = false;
|
dialogVisible.value = false;
|
disabled_btn.value = false;
|
};
|
|
// 取消
|
const cancel = () => {
|
isShowDialog.value = false;
|
};
|
|
// 提交
|
const submit = async () => {
|
disabled_btn.value = true;
|
ruleFormRef.value.validate(async (isValid: boolean, fields?: any) => {
|
if (isValid) {
|
loading.value = true;
|
let values = ruleForm.value;
|
let ret = {};
|
let title = "新增";
|
if (
|
ruleForm.value.id == undefined ||
|
ruleForm.value.id == null ||
|
ruleForm.value.id == "" ||
|
ruleForm.value.id == 0
|
) {
|
ret = await addWmsBatchRuleDetail(values);
|
} else {
|
title = "编辑";
|
ret = await updateWmsBatchRuleDetail(values);
|
}
|
loading.value = false;
|
disabled_btn.value = false;
|
if (ret.data.type == "success") {
|
ElMessage.success(title + "成功");
|
closeDialog();
|
}
|
} else {
|
disabled_btn.value = false;
|
ElMessage({
|
message: `表单有${Object.keys(fields).length}处验证失败，请修改后再提交`,
|
type: "error",
|
});
|
}
|
});
|
};
|
|
// 页面加载时
|
onMounted(async () => {
|
getEnumBatchRuleTypeData.value =
|
(await getAPI(SysEnumApi).apiSysEnumEnumDataListGet("BatchRuleEnum")).data.result ??
|
[];
|
getEnumAttrForamtData.value =
|
(await getAPI(SysEnumApi).apiSysEnumEnumDataListGet("AttrForamtEnum")).data.result ??
|
[];
|
getEnumAttrOptionData.value =
|
(await getAPI(SysEnumApi).apiSysEnumEnumDataListGet("AttrOptionEnum")).data.result ??
|
[];
|
getEnumInputControlData.value =
|
(await getAPI(SysEnumApi).apiSysEnumEnumDataListGet("InputControlEnum")).data
|
.result ?? [];
|
getEnumPriorityData.value =
|
(await getAPI(SysEnumApi).apiSysEnumEnumDataListGet("PriorityEnum")).data.result ??
|
[];
|
});
|
|
//物料详情列表中勾选事件
|
const detailsCheckChange = (val: any) => {
|
checkedDetails.value = val;
|
};
|
|
//获取BOM编号
|
const BomEnum = ref([]);
|
const getBomEnumList = () => {
|
// getBomMainNew()
|
// .then((res) => {
|
// if (res.code == 200) {
|
// BomEnum.value = res.data.rows.reduce((curr: any, item: any) => {
|
// curr.push({
|
// label: item.bomCode,
|
// value: item.bomCode
|
// });
|
// return curr;
|
// }, []);
|
// } else {
|
// ElMessage.error(`${res.code}:${JSON.stringify(res.message)}`);
|
// }
|
// })
|
};
|
getBomEnumList();
|
const dialogVisible = ref(false);
|
//操作提交
|
const confirm = async () => {
|
dialogRef.value.validate(async (isValid: boolean, fields?: any) => {
|
if (isValid) {
|
if(warehousOrderDetails.value.length<=0){
|
ElMessage.warning("请添加批次规则！");
|
return
|
}
|
var newArrIds:any = warehousOrderDetails.value.map((item:any) => item.batchRuleType);
|
var arrSet = new Set(newArrIds);
|
|
if(newArrIds.length > arrSet.size){
|
ElMessage.warning("批次规则不能重复！");
|
return;
|
}
|
|
var newArrIds2:any = warehousOrderDetails.value.map((item:any) => item.priority);
|
var arrSet2 = new Set(newArrIds2);
|
|
if(newArrIds2.length > arrSet2.size){
|
ElMessage.warning("优先级不能重复！");
|
return;
|
}
|
|
disabled_btn.value = true;
|
if (dialogType.value == 'add') {
|
loading.value = true;
|
let values = addForm.value;
|
|
warehousOrderDetails.value.forEach((item) => {
|
item.ruleCode = values.ruleCode;
|
item.ruleName = values.ruleName;
|
});
|
var ret = await addWmsBatchRuleDetail(warehousOrderDetails.value);
|
if (ret.data.type == "success") {
|
ElMessage.success("新增成功");
|
closeDialog();
|
}
|
} else {
|
// 编辑
|
loading.value = true;
|
let values = addForm.value;
|
warehousOrderDetails.value.forEach((item) => {
|
item.ruleCode = values.ruleCode;
|
item.ruleName = values.ruleName;
|
});
|
var ret = await updateWmsBatchRuleDetail(warehousOrderDetails.value);
|
if (ret.data.type == "success") {
|
ElMessage.success("编辑成功");
|
closeDialog();
|
}
|
}
|
disabled_btn.value = false;
|
|
} else {
|
disabled_btn.value = false;
|
ElMessage({
|
message: `表单有${Object.keys(fields).length}处验证失败，请修改后再提交`,
|
type: "error",
|
});
|
}
|
});
|
|
// dialogRef.value.validate((vali: any) => {
|
// if (vali) {
|
|
// //添加
|
// if (dialogType.value == "add") {
|
// addDIInfo(warehousOrderDetails.value)
|
// .then((res) => {
|
// if (res.code == 200) {
|
// ElMessage.success("添加成功");
|
// getTabelData();
|
// dialogVisible.value = false;
|
// } else {
|
// ElMessage.error(`${res.code}:${JSON.stringify(res.message)}`);
|
// }
|
// })
|
// .catch((err) => {
|
// console.log(err);
|
// });
|
// } else {
|
// editDIInfo(warehousOrderDetails.value)
|
// .then((res) => {
|
// if (res.code == 200) {
|
// ElMessage.success("编辑成功");
|
// getTabelData();
|
// dialogVisible.value = false;
|
// } else {
|
// ElMessage.error(`${res.code}:${JSON.stringify(res.message)}`);
|
// }
|
// })
|
// .catch((err) => {
|
// console.log(err);
|
// });
|
// }
|
|
// } else {
|
// ElMessage.warning("表单验证失败");
|
// }
|
// });
|
};
|
|
//将属性或者函数暴露给父组件
|
defineExpose({ openDialog, openDialog2 });
|
</script>
|
