update dialog style

This commit is contained in:
lb 2023-08-21 13:30:42 +08:00
parent 7b0f53f677
commit 02c8538d47
2 changed files with 34 additions and 31 deletions

View File

@ -4,6 +4,7 @@
element-loading-text="处理中,请耐心等待..."
element-loading-background="rgba(0,0,0,0.1)"
class="dialog-just-form"
custom-class="pms-dialog"
:visible="visible"
@close="handleClose"
width="30%"
@ -229,7 +230,7 @@ export default {
/* padding-top: 16px !important;
padding-bottom: 16px !important; */
padding-top: 0 !important;
padding-bottom: 0 !important;
padding-bottom: 12px !important;
}
.el-select,
@ -238,11 +239,6 @@ export default {
width: 100% !important;
}
.dialog-just-form >>> .el-dialog__header {
padding: 10px 20px 10px;
/* background: linear-gradient(to bottom, rgba(0, 0, 0, 0.25), white); */
}
.h0 {
height: 0;
width: 0;

View File

@ -12,12 +12,9 @@
:destroy-on-close="false"
@close="handleClose"
:close-on-click-modal="configs.clickModalToClose ?? false">
<!-- title -->
<div slot="title" class="dialog-title">
<h1 class="">
{{ detailMode ? "查看详情" : dataForm.id ? "编辑" : "新增" }}
</h1>
</div>
<h1 slot="title" class="dialog-title">
{{ detailMode ? "查看详情" : dataForm.id ? "编辑" : "新增" }}
</h1>
<div class="dialog-body__inner relative">
<!-- v-if="dataForm.id && !detailMode && /属性|详情/.test(activeMenu) && $hasPermission()" -->
@ -100,7 +97,9 @@
:label="opt.label"
:value="opt.value">
<span>{{ opt.label }}</span>
<span v-if="col.customLabel" style="display: inline-clock; margin-left: 12px; font-size: 0.9em">
<span
v-if="col.customLabel"
style="display: inline-clock; margin-left: 12px; font-size: 0.9em">
{{ opt[col.customLabel] || "无描述" }}
</span>
</el-option>
@ -169,7 +168,9 @@
<!-- 附件标签页 -->
<div v-if="dataForm.id && tab.key === 'attachment'" key="attachment">
<div class="upload-tips" style="font-size: 0.8em; margin-bottom: 12px">文件大小不要超过 2MB</div>
<div class="upload-tips" style="font-size: 0.8em; margin-bottom: 12px">
文件大小不要超过 2MB
</div>
<!-- 附件列表 -->
<div class="" v-loading="loadingStatus">
<ul class="file-list">
@ -297,7 +298,8 @@ 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) {
@ -329,7 +331,9 @@ export default {
}
// col.options = res.data.list;
else if (col.options.length) {
"list" in res.data ? res.data.list.unshift(...col.options) : res.data.unshift(...col.options);
"list" in res.data
? res.data.list.unshift(...col.options)
: res.data.unshift(...col.options);
this.$set(
col,
"options",
@ -438,11 +442,16 @@ export default {
() => 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]);
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
];
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
@ -510,7 +519,9 @@ export default {
const addMode = !operate.showOnEdit && !this.dataForm.id;
const permission = operate.permission ? this.$hasPermission(operate.permission) : true;
const currentMenuKey = this.configs.menu.find((item) => item.name === this.activeMenu)?.key;
return notDetailMode && (showAlways || ((editMode || addMode) && permission)) && currentMenuKey === "info";
return (
notDetailMode && (showAlways || ((editMode || addMode) && permission)) && currentMenuKey === "info"
);
},
resetForm(excludeId = false, immediate = false) {
@ -975,7 +986,8 @@ export default {
case "delete": {
//
console.log("delete....", data);
const itemName = typeof data === "object" ? data.attrName || data.name || data.material || data.id : data;
const itemName =
typeof data === "object" ? data.attrName || data.name || data.material || data.id : data;
return this.$confirm(`是否删除条目: ${itemName}`, "提示", {
confirmButtonText: "确认",
cancelButtonText: "我再想想",
@ -1024,10 +1036,6 @@ export default {
/* background: #0f02 !important; */
}
/* .el-menu--horizontal > .el-menu-item.is-active { */
/* border-bottom-color: #0b58ff; */
/* } */
.dialog-with-menu >>> .el-dialog__body {
/* padding-top: 16px !important;
padding-bottom: 16px !important; */
@ -1035,16 +1043,15 @@ export default {
padding-bottom: 0 !important;
}
/* .dialog-with-menu >>> .dialog-body__inner {
padding: 16px;
} */
.el-select,
.el-cascader {
width: 100% !important;
}
.dialog-with-menu >>> .el-dialog__header {
padding: 10px 20px 10px;
/* background: linear-gradient(to bottom, rgba(0, 0, 0, 0.25), white); */
}
.relative {
position: relative;
}