@@ -10,14 +14,28 @@
![]()
@@ -123,15 +198,26 @@
-
- +
- 添加
+
+ + 添加
+
-
- 上传
+
+
+ 上传
@@ -27,11 +45,12 @@
-
+
{{ tab.name }}
@@ -41,33 +60,72 @@
-
{{ dataForm[col.prop] || "-" }}
-
-
+ {{ opt.label }}
+
+ {{ opt[col.customLabel] || "-" }}
+
+
-
-
-
@@ -79,13 +137,27 @@
-
@@ -111,7 +183,10 @@
- {{ operate.label }}
+ :loading="(operate.name === 'add' || operate.name === 'update') && btnLoading">
+ {{ operate.label }}
+
取消
@@ -186,7 +272,7 @@ export default {
const dataForm = {};
const autoDisabledQueue = [];
const watingToRefreshQueue = [];
- const cached = {}
+ const cached = {};
this.configs.form.rows.forEach((row) => {
row.forEach((col) => {
@@ -202,7 +288,7 @@ export default {
if (res.code === 0) {
if (col.cacheFetchedData) {
// cache fetched data
- cached[col.prop] = 'list' in res.data ? res.data.list : (Array.isArray(res.data) ? res.data : [])
+ cached[col.prop] = "list" in res.data ? res.data.list : Array.isArray(res.data) ? res.data : [];
}
if (!col.options || !col.options.length) {
@@ -211,13 +297,13 @@ export default {
"options",
"list" in res.data
? res.data.list.map((i) => ({
- label: col.optionLabel ? i[col.optionLabel] : i.name,
- value: col.optionValue ? i[col.optionValue] : i.id,
- }))
+ label: col.optionLabel ? i[col.optionLabel] : i.name,
+ value: col.optionValue ? i[col.optionValue] : i.id,
+ }))
: res.data.map((i) => ({
- label: col.optionLabel ? i[col.optionLabel] : i.name,
- value: col.optionValue ? i[col.optionValue] : i.id,
- }))
+ label: col.optionLabel ? i[col.optionLabel] : i.name,
+ value: col.optionValue ? i[col.optionValue] : i.id,
+ }))
);
}
// col.options = res.data.list;
@@ -228,13 +314,13 @@ export default {
"options",
"list" in res.data
? res.data.list.map((i) => ({
- label: col.optionLabel ? i[col.optionLabel] : i.name,
- value: col.optionValue ? i[col.optionValue] : i.id,
- }))
+ label: col.optionLabel ? i[col.optionLabel] : i.name,
+ value: col.optionValue ? i[col.optionValue] : i.id,
+ }))
: res.data.map((i) => ({
- label: col.optionLabel ? i[col.optionLabel] : i.name,
- value: col.optionValue ? i[col.optionValue] : i.id,
- }))
+ label: col.optionLabel ? i[col.optionLabel] : i.name,
+ value: col.optionValue ? i[col.optionValue] : i.id,
+ }))
);
}
} else {
@@ -322,30 +408,39 @@ export default {
mounted() {
this.configs.form.rows.forEach((row) => {
row.forEach((col) => {
- if (col.changeReflects && typeof col.changeReflects === 'object' && 'fromKey' in col.changeReflects && 'toProp' in col.changeReflects) {
+ if (
+ col.changeReflects &&
+ typeof col.changeReflects === "object" &&
+ "fromKey" in col.changeReflects &&
+ "toProp" in col.changeReflects
+ ) {
this.$watch(
() => this.dataForm[col.prop],
- val => {
- if (val && (col.prop in this.cached)) {
- console.log("here changeReflects", col.prop, col.changeReflects.toProp, this.cached[col.prop])
- if (typeof col.changeReflects.fromKey === 'string') {
- this.dataForm[col.changeReflects.toProp] = this.cached[col.prop].find(item => item.id === val)?.[col.changeReflects.fromKey]
+ (val) => {
+ if (val && col.prop in this.cached) {
+ console.log("here changeReflects", col.prop, col.changeReflects.toProp, this.cached[col.prop]);
+ if (typeof col.changeReflects.fromKey === "string") {
+ this.dataForm[col.changeReflects.toProp] = this.cached[col.prop].find((item) => item.id === val)?.[
+ col.changeReflects.fromKey
+ ];
} else if (Array.isArray(col.changeReflects.fromKey) && col.changeReflects.delimiter) {
- const foundItem = this.dataForm[col.changeReflects.toProp] = this.cached[col.prop].find(item => item.id === val)
+ const foundItem = (this.dataForm[col.changeReflects.toProp] = this.cached[col.prop].find(
+ (item) => item.id === val
+ ));
if (foundItem) {
- const values = col.changeReflects.fromKey.map(key => foundItem[key])
- this.dataForm[col.changeReflects.toProp] = values.join(col.changeReflects.delimiter)
+ const values = col.changeReflects.fromKey.map((key) => foundItem[key]);
+ this.dataForm[col.changeReflects.toProp] = values.join(col.changeReflects.delimiter);
} else {
- this.dataForm[col.changeReflects.toProp] = col.changeReflects.delimiter
- console.log("[DialogWithMenu] mounted() 没找到对应数据")
+ this.dataForm[col.changeReflects.toProp] = col.changeReflects.delimiter;
+ console.log("[DialogWithMenu] mounted() 没找到对应数据");
}
}
}
},
{
- immediate: false
+ immediate: false,
}
- )
+ );
}
});
});
@@ -354,8 +449,8 @@ export default {
watch: {
dialogVisible: function (val) {
if (!!val) {
- this.attrPage = 1
- this.attrSize = 10
+ this.attrPage = 1;
+ this.attrSize = 10;
}
},
},
@@ -369,7 +464,9 @@ export default {
});
},
filteredTableProps() {
- return this.detailMode ? this.configs.table.props.filter((v) => v.prop !== "operations") : this.configs.table.props;
+ return this.detailMode
+ ? this.configs.table.props.filter((v) => v.prop !== "operations")
+ : this.configs.table.props;
},
uploadHeaders() {
return {
@@ -477,11 +574,11 @@ export default {
/** 返回的文件列表 */
this.fileList = res.data.files
? res.data.files.map((file) => ({
- id: file.id,
- name: file.fileUrl.split("/").pop(),
- url: file.fileUrl,
- typeCode: file.typeCode,
- }))
+ id: file.id,
+ name: file.fileUrl.split("/").pop(),
+ url: file.fileUrl,
+ typeCode: file.typeCode,
+ }))
: [];
}
}
@@ -520,14 +617,14 @@ export default {
this.currentImgUrl = URL.createObjectURL(res);
this.imgPreviewDialogVisible = true;
} else if (/pdf/i.test(res.type)) {
- // 预览pdf
- let a = document.createElement('a')
- a.setAttribute('target', '_blank')
- a.href = URL.createObjectURL(res)
- a.click()
- console.log('before remove a ', a)
- a.remove()
- console.log('removed a ', a)
+ // 预览pdf
+ let a = document.createElement("a");
+ a.setAttribute("target", "_blank");
+ a.href = URL.createObjectURL(res);
+ a.click();
+ console.log("before remove a ", a);
+ a.remove();
+ console.log("removed a ", a);
} else {
this.$message({
message: "非图片和PDF文件请下载后预览",
@@ -601,7 +698,7 @@ export default {
}
});
})
- .catch((err) => { });
+ .catch((err) => {});
}
}
},
@@ -685,7 +782,7 @@ export default {
this.$refs.dataForm[0].validate((passed, result) => {
if (passed) {
// 如果通过验证
- this.btnLoading = true
+ this.btnLoading = true;
this.loadingStatus = true;
const method = payload.name === "add" ? "POST" : "PUT";
@@ -706,7 +803,7 @@ export default {
}
// 实际发送请求
- this.btnLoading = true
+ this.btnLoading = true;
this.$http({
url: this.urls.base,
method,
@@ -716,7 +813,7 @@ export default {
},
})
.then(({ data: res }) => {
- this.btnLoading = false
+ this.btnLoading = false;
this.loadingStatus = false;
console.log("[add&update] res is: ", res);
if (res.code === 0) {
@@ -751,13 +848,13 @@ export default {
type: "error",
duration: 2000,
});
- if (this.btnLoading) this.btnLoading = false
+ if (this.btnLoading) this.btnLoading = false;
}
})
.catch((errMsg) => {
this.$message.error("参数错误：" + errMsg);
if (this.loadingStatus) this.loadingStatus = false;
- if (this.btnLoading) this.btnLoading = false
+ if (this.btnLoading) this.btnLoading = false;
});
} else {
this.$message.error("请核查字段信息");
@@ -780,7 +877,7 @@ export default {
},
handleSizeChange(val) {
this.attrPage = 1;
- this.attrSize = val
+ this.attrSize = val;
this.getSubList(1, val);
},
@@ -844,8 +941,8 @@ export default {
switch (type) {
case "delete": {
// 确认是否删除
- console.log('delete....', data)
- const itemName = typeof data === 'object' ? (data.attrName || data.name || data.material || data.id) : data
+ console.log("delete....", data);
+ const itemName = typeof data === "object" ? data.attrName || data.name || data.material || data.id : data;
return this.$confirm(`是否删除条目: ${itemName}`, "提示", {
confirmButtonText: "确认",
cancelButtonText: "我再想想",
@@ -869,7 +966,7 @@ export default {
}
});
})
- .catch((err) => { });
+ .catch((err) => {});
}
case "edit": {
this.handleAddParam(data); /** data is ==> id */
@@ -898,7 +995,7 @@ export default {
/* border-bottom-color: #0b58ff; */
/* } */
-.dialog-with-menu>>>.el-dialog__body {
+.dialog-with-menu >>> .el-dialog__body {
/* padding-top: 16px !important;
padding-bottom: 16px !important; */
padding-top: 0 !important;
@@ -910,7 +1007,7 @@ export default {
width: 100% !important;
}
-.dialog-with-menu>>>.el-dialog__header {
+.dialog-with-menu >>> .el-dialog__header {
padding: 10px 20px 10px;
/* background: linear-gradient(to bottom, rgba(0, 0, 0, 0.25), white); */
}
@@ -927,7 +1024,7 @@ export default {
}
ul.file-list,
-ul.file-list>li {
+ul.file-list > li {
padding: 0;
margin: 0;
list-style: none;
@@ -942,7 +1039,7 @@ ul.file-list>li {
flex-direction: column;
}
-ul.file-list>li {
+ul.file-list > li {
border-radius: 4px;
background-color: #edededd2;
padding: 8px;
@@ -951,7 +1048,7 @@ ul.file-list>li {
justify-content: space-between;
}
-ul.file-list>li:hover {
+ul.file-list > li:hover {
background-color: #ededed;
}