update order/DialogJustForm

This commit is contained in:
lb 2023-04-24 11:03:51 +08:00
parent a1ee2214b5
commit 2af219d37a
2 changed files with 336 additions and 336 deletions

View File

@ -65,7 +65,7 @@
:disabled="detailMode"
v-bind="col.elparams" />
<div class="" v-if="col.component" style="margin: 42px 0 0">
<div class="" v-if="col.component" style="margin: 32px 0 0">
<!-- 下面这个 component 几乎是为 富文本 quill 定制的了... TODO后续可能会根据业务需求创建新的版本 -->
<component
:is="col.component"
@ -75,7 +75,6 @@
:mode="detailMode ? 'detail' : dataForm.id ? 'edit' : 'create'"
v-bind="col.bind" />
</div>
</el-form-item>
</el-col>
</el-row>
@ -126,58 +125,63 @@ export default {
const watchList = [];
const cachedList = {};
this.configs.form.rows.forEach((row) => {
row.forEach((col) => {
dataForm[col.prop] = col.default ?? null;
this.configs.form.field.forEach((field) => {
field.rows.forEach((row) => {
row.forEach((col) => {
if (!col.prop) return;
if (col.fetchData)
col.fetchData().then(({ data: res }) => {
if (res.code === 0) {
if (typeof res.data === "object" && "list" in res.data) {
if ("injectTo" in col) {
//
cachedList[col.prop] = res.data.list;
dataForm[col.prop] = col.default ?? null;
if (col.fetchData)
col.fetchData().then(({ data: res }) => {
if (res.code === 0) {
if (typeof res.data === "object" && "list" in res.data) {
if ("injectTo" in col) {
//
cachedList[col.prop] = res.data.list;
}
this.$set(
col,
"options",
res.data.list.map((i) => ({
label: col.optionLabel ? i[col.optionLabel] : i.name,
value: col.optionValue ? i[col.optionValue] : i.id,
}))
);
} else if (Array.isArray(res.data)) {
this.$set(
col,
"options",
res.data.map((i) => ({
label: col.optionLabel ? i[col.optionLabel] : i.name,
value: col.optionValue ? i[col.optionValue] : i.id,
}))
);
}
this.$set(
col,
"options",
res.data.list.map((i) => ({
label: col.optionLabel ? i[col.optionLabel] : i.name,
value: col.optionValue ? i[col.optionValue] : i.id,
}))
);
} else if (Array.isArray(res.data)) {
this.$set(
col,
"options",
res.data.map((i) => ({
label: col.optionLabel ? i[col.optionLabel] : i.name,
value: col.optionValue ? i[col.optionValue] : i.id,
}))
);
} else {
// error
col.options.splice(0);
}
} else {
// error
col.options.splice(0);
}
});
else if (col.fetchTreeData) {
// parentId 0
col.fetchTreeData().then(({ data: res }) => {
// console.log("[DialogJustForm fetchTreeData -->]", res.data);
if (res.code === 0 && res.data) {
if ("list" in res.data) {
this.$set(col, "options", res.data.list);
} else if (Array.isArray(res.data)) {
this.$set(col, "options", res.data);
});
else if (col.fetchTreeData) {
// parentId 0
col.fetchTreeData().then(({ data: res }) => {
// console.log("[DialogJustForm fetchTreeData -->]", res.data);
if (res.code === 0 && res.data) {
if ("list" in res.data) {
this.$set(col, "options", res.data.list);
} else if (Array.isArray(res.data)) {
this.$set(col, "options", res.data);
}
} else {
col.options.splice(0);
}
} else {
col.options.splice(0);
}
});
}
});
}
});
});
});
return {
loadingStatus: false,
dataForm,
@ -190,27 +194,29 @@ export default {
},
mounted() {
/** 处理 injectTo 选项 */
this.configs.form.rows.forEach((row) => {
row.forEach((col) => {
if ("injectTo" in col && Array.isArray(col.injectTo)) {
// console.log("watching options ..... ", col);
col.injectTo.map((item) => {
const unwatch = this.$watch(
() => this.dataForm[col.prop],
(newVal) => {
const chosenObject = this.cachedList[col.prop].find((i) => i.id === newVal);
if (chosenObject) {
//
this.$set(this.dataForm, item[0], chosenObject[item[1]]);
this.configs.form.field.forEach((field) => {
field.rows.forEach((row) => {
row.forEach((col) => {
if ("injectTo" in col && Array.isArray(col.injectTo)) {
// console.log("watching options ..... ", col);
col.injectTo.map((item) => {
const unwatch = this.$watch(
() => this.dataForm[col.prop],
(newVal) => {
const chosenObject = this.cachedList[col.prop].find((i) => i.id === newVal);
if (chosenObject) {
//
this.$set(this.dataForm, item[0], chosenObject[item[1]]);
}
},
{
immediate: false,
}
},
{
immediate: false,
}
);
this.watchList.push(unwatch);
});
}
);
this.watchList.push(unwatch);
});
}
});
});
});
},

View File

@ -270,284 +270,278 @@ export default function () {
{
title: '设备与参数',
rows: [
{
input: true,
label: "生产订单类型",
prop: "specifications",
// rules: { required: true, message: "必填项不能为空", trigger: "blur" },
elparams: { placeholder: "请输入生产订单类型" },
},
{
select: true,
label: "压机",
prop: "press",
options: [],
optionLabel: "code",
rules: { required: true, message: "必填项不能为空", trigger: "blur" },
fetchData: () => this.$http.get("/pms/equipment/search", { params: { equipmentTypeCode: 'Press' } }),
elparams: { placeholder: "请选择压机号", filterable: true },
},
{
select: true,
label: "混料机号",
prop: "blender",
options: [],
optionLabel: "code",
rules: { required: true, message: "必填项不能为空", trigger: "blur" },
fetchData: () => this.$http.get("/pms/equipment/search", { params: { equipmentTypeCode: 'Mix' } }),
elparams: { placeholder: "请选择混料机号", filterable: true },
},
{
select: true,
label: "隧道窑号",
prop: "kiln",
options: [],
optionLabel: "code",
fetchData: () => this.$http.get("/pms/equipment/search", { params: { equipmentTypeCode: 'Kiln' } }),
elparams: { placeholder: "请选择隧道窑号", filterable: true },
},
{
select: true,
label: "牌号",
prop: "bomId",
options: [],
// optionLabel: '',
fetchData: () => this.$http.get("/pms/bom/page", { params: { limit: 999, page: 1, key: "", externalCode: "" } }),
elparams: { placeholder: "请选择牌号", filterable: true },
// TODO: 选择后,需要带出一些数据
injectTo: [
['bomCode', 'code'],
['ai', 'externalCode']
]
},
{
// input: true,
// select: true,
label: "配方号",
prop: "bomCode",
// options: [],
// optionLabel: 'code',
// fetchData: () => this.$http.get("/pms/bom/page", { params: { limit: 999, page: 1, key: "" } }),
// rules: { required: true, message: "必填项不能为空", trigger: "blur" },
// elparams: { placeholder: "请选择配方" },
component: textOnlyComponent,
bind: {
useBuiltin: false,
[
{
input: true,
label: "生产订单类型",
prop: "specifications",
// rules: { required: true, message: "必填项不能为空", trigger: "blur" },
elparams: { placeholder: "请输入生产订单类型" },
},
},
{
label: "版本号",
prop: "ai",
component: textOnlyComponent,
bind: {
useBuiltin: false,
{
select: true,
label: "压机",
prop: "press",
options: [],
optionLabel: "code",
rules: { required: true, message: "必填项不能为空", trigger: "blur" },
fetchData: () => this.$http.get("/pms/equipment/search", { params: { equipmentTypeCode: 'Press' } }),
elparams: { placeholder: "请选择压机号", filterable: true },
},
},
{
select: true,
label: "物料",
prop: "productId",
options: [],
optionLabel: "code",
// optionValue: 'code',
// fetchedDataIdConvertTo: 'productId',
// optionValue: 'id',
fetchData: () => this.$http.get("/pms/product/page", { params: { limit: 999, page: 1, key: "" } }),
// label: "单位",
// prop: "unitDictValue",
// options: dictList["unit"].map((u) => ({ label: u.dictLabel, value: u.dictValue })),
elparams: { placeholder: "请选择物料", filterable: true },
},
{
select: true,
label: "砖型",
prop: "shape",
optionLabel: "code",
options: [],
fetchData: () => this.$http.get("/pms/shape/page", { params: { limit: 999, page: 1, key: "" } }),
// label: "单位",
// prop: "unitDictValue",
// options: dictList["unit"].map((u) => ({ label: u.dictLabel, value: u.dictValue })),
elparams: { placeholder: "请选择砖型", filterable: true },
},
{
input: true,
label: "烧成温度",
prop: "sapParam6",
rules: [
{ required: true, message: "必填项不能为空", trigger: "blur" },
{ type: "number", message: "请输入正确的数字类型", trigger: "blur", transform: (val) => Number(val) },
],
elparams: { placeholder: "请输入烧成温度" },
},
{
input: true,
label: "烧成时间 H",
prop: "sapParam7",
rules: [
{ required: true, message: "必填项不能为空", trigger: "blur" },
{ type: "number", message: "请输入正确的数字类型", trigger: "blur", transform: (val) => Number(val) },
],
elparams: { placeholder: "请输入烧成时间" },
},
{
select: true,
label: "包装代码",
prop: "packTech",
options: [],
optionLabel: "code",
fetchData: () => this.$http.post("/pms/equipmentTech/pageView", { limit: 999, page: 1, key: "", shape: "", wsId: 5 }),
// label: "单位",
// prop: "unitDictValue",
// options: dictList["unit"].map((u) => ({ label: u.dictLabel, value: u.dictValue })),
elparams: { placeholder: "请选择物料", filterable: true },
},
{
select: true,
label: "混料机号",
prop: "blender",
options: [],
optionLabel: "code",
rules: { required: true, message: "必填项不能为空", trigger: "blur" },
fetchData: () => this.$http.get("/pms/equipment/search", { params: { equipmentTypeCode: 'Mix' } }),
elparams: { placeholder: "请选择混料机号", filterable: true },
},
{
select: true,
label: "隧道窑号",
prop: "kiln",
options: [],
optionLabel: "code",
fetchData: () => this.$http.get("/pms/equipment/search", { params: { equipmentTypeCode: 'Kiln' } }),
elparams: { placeholder: "请选择隧道窑号", filterable: true },
},
],
[
{
select: true,
label: "牌号",
prop: "bomId",
options: [],
// optionLabel: '',
fetchData: () => this.$http.get("/pms/bom/page", { params: { limit: 999, page: 1, key: "", externalCode: "" } }),
elparams: { placeholder: "请选择牌号", filterable: true },
// TODO: 选择后,需要带出一些数据
injectTo: [
['bomCode', 'code'],
['ai', 'externalCode']
]
},
{
// input: true,
// select: true,
label: "配方号",
prop: "bomCode",
// options: [],
// optionLabel: 'code',
// fetchData: () => this.$http.get("/pms/bom/page", { params: { limit: 999, page: 1, key: "" } }),
// rules: { required: true, message: "必填项不能为空", trigger: "blur" },
// elparams: { placeholder: "请选择配方" },
component: textOnlyComponent,
bind: {
useBuiltin: false,
},
},
{
label: "版本号",
prop: "ai",
component: textOnlyComponent,
bind: {
useBuiltin: false,
},
},
{
select: true,
label: "物料",
prop: "productId",
options: [],
optionLabel: "code",
// optionValue: 'code',
// fetchedDataIdConvertTo: 'productId',
// optionValue: 'id',
fetchData: () => this.$http.get("/pms/product/page", { params: { limit: 999, page: 1, key: "" } }),
// label: "单位",
// prop: "unitDictValue",
// options: dictList["unit"].map((u) => ({ label: u.dictLabel, value: u.dictValue })),
elparams: { placeholder: "请选择物料", filterable: true },
},
],
[
{
select: true,
label: "砖型",
prop: "shape",
optionLabel: "code",
options: [],
fetchData: () => this.$http.get("/pms/shape/page", { params: { limit: 999, page: 1, key: "" } }),
// label: "单位",
// prop: "unitDictValue",
// options: dictList["unit"].map((u) => ({ label: u.dictLabel, value: u.dictValue })),
elparams: { placeholder: "请选择砖型", filterable: true },
},
{
input: true,
label: "烧成温度",
prop: "sapParam6",
rules: [
{ required: true, message: "必填项不能为空", trigger: "blur" },
{ type: "number", message: "请输入正确的数字类型", trigger: "blur", transform: (val) => Number(val) },
],
elparams: { placeholder: "请输入烧成温度" },
},
{
input: true,
label: "烧成时间 H",
prop: "sapParam7",
rules: [
{ required: true, message: "必填项不能为空", trigger: "blur" },
{ type: "number", message: "请输入正确的数字类型", trigger: "blur", transform: (val) => Number(val) },
],
elparams: { placeholder: "请输入烧成时间" },
},
{
select: true,
label: "包装代码",
prop: "packTech",
options: [],
optionLabel: "code",
fetchData: () => this.$http.post("/pms/equipmentTech/pageView", { limit: 999, page: 1, key: "", shape: "", wsId: 5 }),
// label: "单位",
// prop: "unitDictValue",
// options: dictList["unit"].map((u) => ({ label: u.dictLabel, value: u.dictValue })),
elparams: { placeholder: "请选择物料", filterable: true },
},
],
]
},
{
title: '其他',
rows: [
{
input: true,
label: "生产订单砖数",
prop: "prodqty",
rules: [
{ required: true, message: "必填项不能为空", trigger: "blur" },
{ type: "number", message: "请输入正确的数字类型", trigger: "blur", transform: (val) => Number(val) },
],
elparams: { placeholder: "请输入要求生产的数量" },
},
{
input: true,
label: "已生产数",
prop: "yieldqty",
// rules: { required: true, message: "必填项不能为空", trigger: "blur" },
rules: [
// { required: true, message: "必填项不能为空", trigger: "blur" },
{ type: "number", message: "请输入正确的数字类型", trigger: "blur", transform: (val) => Number(val) },
],
elparams: { placeholder: "请输入已经生产的数量" },
},
{
input: true,
label: "托盘码放砖数",
prop: "pcsKilnCar",
rules: [
{ required: true, message: "必填项不能为空", trigger: "blur" },
{ type: "number", message: "请输入正确的数字类型", trigger: "blur", transform: (val) => Number(val) },
],
elparams: { placeholder: "请输入要求生产的数量" },
},
{
input: true,
label: "Add on",
prop: "sapParam1",
rules: { required: true, message: "必填项不能为空", trigger: "blur" },
elparams: { placeholder: "请输入addon" },
},
{
input: true,
label: "销售订单号",
prop: "saleNo",
rules: { required: true, message: "必填项不能为空", trigger: "blur" },
elparams: { placeholder: "请输入销售订单号" },
},
{
input: true,
label: "销售订单item号",
prop: "saleOrderItem",
// rules: { required: true, message: "必填项不能为空", trigger: "blur" },
elparams: { placeholder: "请输入销售订单item号" },
},
{
input: true,
label: "销售订单砖数",
prop: "soqty",
rules: [
{ required: true, message: "必填项不能为空", trigger: "blur" },
{ type: "number", message: "请输入正确的数字类型", trigger: "blur", transform: (val) => Number(val) },
],
elparams: { placeholder: "请输入销售订单砖数" },
},
{
// time
datetime: true,
label: "销售时间",
prop: "deliveryTime",
rules: { required: true, message: "必填项不能为空", trigger: "blur" },
elparams: { placeholder: "请选择销售时间" },
},
{
select: true,
label: "客户",
prop: "customerId",
option: [],
optionLabel: "name",
fetchData: () => this.$http.get("/pms/customer/page", { params: { limit: 999, page: 1, name: "" } }),
rules: { required: true, message: "必填项不能为空", trigger: "blur" },
elparams: { placeholder: "请选择客户" },
},
[
{
input: true,
label: "生产订单砖数",
prop: "prodqty",
rules: [
{ required: true, message: "必填项不能为空", trigger: "blur" },
{ type: "number", message: "请输入正确的数字类型", trigger: "blur", transform: (val) => Number(val) },
],
elparams: { placeholder: "请输入要求生产的数量" },
},
{
input: true,
label: "已生产数",
prop: "yieldqty",
// rules: { required: true, message: "必填项不能为空", trigger: "blur" },
rules: [
// { required: true, message: "必填项不能为空", trigger: "blur" },
{ type: "number", message: "请输入正确的数字类型", trigger: "blur", transform: (val) => Number(val) },
],
elparams: { placeholder: "请输入已经生产的数量" },
},
{
input: true,
label: "托盘码放砖数",
prop: "pcsKilnCar",
rules: [
{ required: true, message: "必填项不能为空", trigger: "blur" },
{ type: "number", message: "请输入正确的数字类型", trigger: "blur", transform: (val) => Number(val) },
],
elparams: { placeholder: "请输入要求生产的数量" },
},
{
input: true,
label: "Add on",
prop: "sapParam1",
rules: { required: true, message: "必填项不能为空", trigger: "blur" },
elparams: { placeholder: "请输入addon" },
},
],
[
{
input: true,
label: "销售订单号",
prop: "saleNo",
rules: { required: true, message: "必填项不能为空", trigger: "blur" },
elparams: { placeholder: "请输入销售订单号" },
},
{
input: true,
label: "销售订单item号",
prop: "saleOrderItem",
// rules: { required: true, message: "必填项不能为空", trigger: "blur" },
elparams: { placeholder: "请输入销售订单item号" },
},
{
input: true,
label: "销售订单砖数",
prop: "soqty",
rules: [
{ required: true, message: "必填项不能为空", trigger: "blur" },
{ type: "number", message: "请输入正确的数字类型", trigger: "blur", transform: (val) => Number(val) },
],
elparams: { placeholder: "请输入销售订单砖数" },
},
{
// time
datetime: true,
label: "销售时间",
prop: "deliveryTime",
rules: { required: true, message: "必填项不能为空", trigger: "blur" },
elparams: { placeholder: "请选择销售时间" },
},
],
[
{
select: true,
label: "客户",
prop: "customerId",
option: [],
optionLabel: "name",
fetchData: () => this.$http.get("/pms/customer/page", { params: { limit: 999, page: 1, name: "" } }),
rules: { required: true, message: "必填项不能为空", trigger: "blur" },
elparams: { placeholder: "请选择客户" },
},
// {
// input: true,
// label: "版本号",
// prop: "ai",
// rules: { required: true, message: "必填项不能为空", trigger: "blur" },
// elparams: { placeholder: "请输入版本号" },
// },
// {
// input: true,
// label: "物料号销售文本",
// prop: "shortDesc",
// rules: { required: true, message: "必填项不能为空", trigger: "blur" },
// elparams: { placeholder: "请输入物料号销售文本" },
// },
{
label: "物料号销售文本",
prop: "shortDesc",
component: textOnlyComponent,
bind: {
useBuiltin: false,
},
},
{},
{},
],
[
{ input: true, label: "备注", prop: "remark", elparams: { placeholder: "备注" } }
// {
// select: true,
// label: "原料类别",
// prop: "typeDictValue",
// options: dictList["material_category"].map((u) => ({ label: u.dictLabel, value: u.dictValue })),
// elparams: { placeholder: "原料类别" },
// // autoDisabled: true
// },
],
]
}
],
rows: [
[
],
[
],
[
// {
// input: true,
// label: "版本号",
// prop: "ai",
// rules: { required: true, message: "必填项不能为空", trigger: "blur" },
// elparams: { placeholder: "请输入版本号" },
// },
],
[
],
[
// {
// input: true,
// label: "物料号销售文本",
// prop: "shortDesc",
// rules: { required: true, message: "必填项不能为空", trigger: "blur" },
// elparams: { placeholder: "请输入物料号销售文本" },
// },
{
label: "物料号销售文本",
prop: "shortDesc",
component: textOnlyComponent,
bind: {
useBuiltin: false,
},
},
],
// 备注
[{ input: true, label: "备注", prop: "remark", elparams: { placeholder: "备注" } }],
// {
// select: true,
// label: "原料类别",
// prop: "typeDictValue",
// options: dictList["material_category"].map((u) => ({ label: u.dictLabel, value: u.dictValue })),
// elparams: { placeholder: "原料类别" },
// // autoDisabled: true
// },
],
operations: [
{ name: "add", label: "保存", type: "primary", permission: "", showOnEdit: false },
{ name: "update", label: "更新", type: "primary", permission: "", showOnEdit: true },