update +++
This commit is contained in:
parent
13753f0c6c
commit
2afdb1d23d
@ -252,34 +252,87 @@ export default {
|
|||||||
};
|
};
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
|
/** 临时保存所有发出的请求 */
|
||||||
|
const promiseHistory = {};
|
||||||
/** 处理 injectTo 选项 */
|
/** 处理 injectTo 选项 */
|
||||||
this.configs.form.rows.forEach((row) => {
|
this.configs.form.rows.forEach((row) => {
|
||||||
row.forEach((col) => {
|
row.forEach((col) => {
|
||||||
if ("injectTo" in col && Array.isArray(col.injectTo)) {
|
if (col.fetchData && typeof col.fetchData === "function" && !col.hasPrev) {
|
||||||
const valueProp = "optionValue" in col ? col.optionValue : "id";
|
// 获取数据 - 不需要等待前置条件时
|
||||||
const unwatch = this.$watch(
|
promiseHistory[col.prop] = col.fetchData().then(({ data: res }) => {
|
||||||
() => this.dataForm[col.prop],
|
if (res.code === 0) {
|
||||||
(newVal) => {
|
if ("list" in res.data) {
|
||||||
const chosenObject = this.cachedList[col.prop].find((i) => i[valueProp] === newVal);
|
// 填充 options
|
||||||
if (chosenObject) {
|
this.$set(
|
||||||
// 如果找到了
|
col,
|
||||||
col.injectTo.map((item) => {
|
"options",
|
||||||
console.log("[setting ---> ]:", item[1], "to", `dataForm[${item[0]}]`);
|
res.data.list.map((i) => ({
|
||||||
this.$set(this.dataForm, item[0], chosenObject[item[1]]);
|
label: col.optionLabel ? i[col.optionLabel] : i.name,
|
||||||
this.$forceUpdate();
|
value: col.optionValue ? i[col.optionValue] : i.id,
|
||||||
});
|
}))
|
||||||
} else {
|
);
|
||||||
console.log("DialogJustForm mounted(): 没有找到 injectTo 关联的对象");
|
|
||||||
|
// 是否需要缓存数据列表
|
||||||
|
if ("injectTo" in col) {
|
||||||
|
// 缓存
|
||||||
|
this.cachedList[col.prop] = res.data.list;
|
||||||
|
// 设置监听
|
||||||
|
const valueProp = "optionValue" in col ? col.optionValue : "id";
|
||||||
|
const unwatch = this.$watch(
|
||||||
|
() => this.dataForm[col.prop],
|
||||||
|
(val) => {
|
||||||
|
const chosenObject = this.cachedList[col.prop].find((i) => i[valueProp] === val);
|
||||||
|
if (chosenObject) {
|
||||||
|
// 如果找到了
|
||||||
|
col.injectTo.map((item) => {
|
||||||
|
this.$set(this.dataForm, item[0], chosenObject[item[1]]);
|
||||||
|
this.$forceUpdate();
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
console.log("DialogJustForm mounted(): 没有找到 injectTo 关联的对象");
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
immediate: false,
|
||||||
|
}
|
||||||
|
);
|
||||||
|
this.watchList.push(unwatch);
|
||||||
|
}
|
||||||
|
|
||||||
|
if ("autoUpdateProp" in col) {
|
||||||
|
this.$set(savedDatalist, col.prop, res.data.list);
|
||||||
|
}
|
||||||
|
|
||||||
|
// end branch
|
||||||
|
} else if (Array.isArray(res.data)) {
|
||||||
|
// 是否需要缓存数据列表
|
||||||
|
if ("injectTo" in col) {
|
||||||
|
// 缓存
|
||||||
|
this.cachedList[col.prop] = 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,
|
||||||
|
}))
|
||||||
|
);
|
||||||
|
if ("autoUpdateProp" in col) {
|
||||||
|
this.$set(savedDatalist, col.prop, res.data);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
} else {
|
||||||
{
|
col.options.splice(0);
|
||||||
immediate: false,
|
|
||||||
}
|
}
|
||||||
);
|
});
|
||||||
this.watchList.push(unwatch);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
if ("toggleFetchData" in col) {
|
if (col.fetchData && typeof col.fetchData === "function" && col.hasPrev) {
|
||||||
|
// 获取数据 - 需要等待前置条件时
|
||||||
|
|
||||||
|
// 1.检查前置条件是否已经 fullfilled
|
||||||
|
// 2.没有则等待,有则 fetchData
|
||||||
const unwatch = this.$watch(
|
const unwatch = this.$watch(
|
||||||
() => this.dataForm[col.toggleFetchData],
|
() => this.dataForm[col.toggleFetchData],
|
||||||
(val) => {
|
(val) => {
|
||||||
@ -318,12 +371,10 @@ export default {
|
|||||||
if ("autoUpdateProp" in col) {
|
if ("autoUpdateProp" in col) {
|
||||||
this.$set(savedDatalist, col.prop, res.data);
|
this.$set(savedDatalist, col.prop, res.data);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
// col.options = res.data.list;
|
|
||||||
} else {
|
} else {
|
||||||
col.options.splice(0);
|
col.options.splice(0);
|
||||||
}
|
}
|
||||||
// dataForm[col.prop] = col.default ?? null; // not perfect!
|
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -332,6 +383,8 @@ export default {
|
|||||||
);
|
);
|
||||||
this.watchList.push(unwatch);
|
this.watchList.push(unwatch);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/// old part ====================
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
@ -150,7 +150,8 @@ export default function () {
|
|||||||
prop: "orderId",
|
prop: "orderId",
|
||||||
options: [],
|
options: [],
|
||||||
optionLabel: 'orderCode',
|
optionLabel: 'orderCode',
|
||||||
toggleFetchData: 'carId', // 当 carId 改变的时候,也会 fetchData
|
// toggleFetchData: 'carId', // 当 carId 改变的时候,也会 fetchData
|
||||||
|
hasPrev: 'carId', // 当 carId 改变的时候,也会 fetchData
|
||||||
// 需要保存当前状态
|
// 需要保存当前状态
|
||||||
needCache: true,
|
needCache: true,
|
||||||
fetchDataParam: { search: 'carId', get: 'id' }, // 伴随着 toggleFetchData 出现
|
fetchDataParam: { search: 'carId', get: 'id' }, // 伴随着 toggleFetchData 出现
|
||||||
|
Loading…
Reference in New Issue
Block a user