update dialog style
This commit is contained in:
parent
7b0f53f677
commit
02c8538d47
@ -4,6 +4,7 @@
|
|||||||
element-loading-text="处理中,请耐心等待..."
|
element-loading-text="处理中,请耐心等待..."
|
||||||
element-loading-background="rgba(0,0,0,0.1)"
|
element-loading-background="rgba(0,0,0,0.1)"
|
||||||
class="dialog-just-form"
|
class="dialog-just-form"
|
||||||
|
custom-class="pms-dialog"
|
||||||
:visible="visible"
|
:visible="visible"
|
||||||
@close="handleClose"
|
@close="handleClose"
|
||||||
width="30%"
|
width="30%"
|
||||||
@ -229,7 +230,7 @@ export default {
|
|||||||
/* padding-top: 16px !important;
|
/* padding-top: 16px !important;
|
||||||
padding-bottom: 16px !important; */
|
padding-bottom: 16px !important; */
|
||||||
padding-top: 0 !important;
|
padding-top: 0 !important;
|
||||||
padding-bottom: 0 !important;
|
padding-bottom: 12px !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.el-select,
|
.el-select,
|
||||||
@ -238,11 +239,6 @@ export default {
|
|||||||
width: 100% !important;
|
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 {
|
.h0 {
|
||||||
height: 0;
|
height: 0;
|
||||||
width: 0;
|
width: 0;
|
||||||
|
@ -12,12 +12,9 @@
|
|||||||
:destroy-on-close="false"
|
:destroy-on-close="false"
|
||||||
@close="handleClose"
|
@close="handleClose"
|
||||||
:close-on-click-modal="configs.clickModalToClose ?? false">
|
:close-on-click-modal="configs.clickModalToClose ?? false">
|
||||||
<!-- title -->
|
<h1 slot="title" class="dialog-title">
|
||||||
<div slot="title" class="dialog-title">
|
|
||||||
<h1 class="">
|
|
||||||
{{ detailMode ? "查看详情" : dataForm.id ? "编辑" : "新增" }}
|
{{ detailMode ? "查看详情" : dataForm.id ? "编辑" : "新增" }}
|
||||||
</h1>
|
</h1>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="dialog-body__inner relative">
|
<div class="dialog-body__inner relative">
|
||||||
<!-- v-if="dataForm.id && !detailMode && /属性|详情/.test(activeMenu) && $hasPermission()" -->
|
<!-- v-if="dataForm.id && !detailMode && /属性|详情/.test(activeMenu) && $hasPermission()" -->
|
||||||
@ -100,7 +97,9 @@
|
|||||||
:label="opt.label"
|
:label="opt.label"
|
||||||
:value="opt.value">
|
:value="opt.value">
|
||||||
<span>{{ opt.label }}</span>
|
<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] || "无描述" }}
|
{{ opt[col.customLabel] || "无描述" }}
|
||||||
</span>
|
</span>
|
||||||
</el-option>
|
</el-option>
|
||||||
@ -169,7 +168,9 @@
|
|||||||
|
|
||||||
<!-- 附件标签页 -->
|
<!-- 附件标签页 -->
|
||||||
<div v-if="dataForm.id && tab.key === 'attachment'" key="attachment">
|
<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">
|
<div class="" v-loading="loadingStatus">
|
||||||
<ul class="file-list">
|
<ul class="file-list">
|
||||||
@ -297,7 +298,8 @@ export default {
|
|||||||
if (res.code === 0) {
|
if (res.code === 0) {
|
||||||
if (col.cacheFetchedData) {
|
if (col.cacheFetchedData) {
|
||||||
// cache fetched data
|
// 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) {
|
if (!col.options || !col.options.length) {
|
||||||
@ -329,7 +331,9 @@ export default {
|
|||||||
}
|
}
|
||||||
// col.options = res.data.list;
|
// col.options = res.data.list;
|
||||||
else if (col.options.length) {
|
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(
|
this.$set(
|
||||||
col,
|
col,
|
||||||
"options",
|
"options",
|
||||||
@ -438,11 +442,16 @@ export default {
|
|||||||
() => this.dataForm[col.prop],
|
() => this.dataForm[col.prop],
|
||||||
(val) => {
|
(val) => {
|
||||||
if (val && col.prop in this.cached) {
|
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") {
|
if (typeof col.changeReflects.fromKey === "string") {
|
||||||
this.dataForm[col.changeReflects.toProp] = this.cached[col.prop].find((item) => item.id === val)?.[
|
this.dataForm[col.changeReflects.toProp] = this.cached[col.prop].find(
|
||||||
col.changeReflects.fromKey
|
(item) => item.id === val
|
||||||
];
|
)?.[col.changeReflects.fromKey];
|
||||||
} else if (Array.isArray(col.changeReflects.fromKey) && col.changeReflects.delimiter) {
|
} else if (Array.isArray(col.changeReflects.fromKey) && col.changeReflects.delimiter) {
|
||||||
const foundItem = (this.dataForm[col.changeReflects.toProp] = this.cached[col.prop].find(
|
const foundItem = (this.dataForm[col.changeReflects.toProp] = this.cached[col.prop].find(
|
||||||
(item) => item.id === val
|
(item) => item.id === val
|
||||||
@ -510,7 +519,9 @@ export default {
|
|||||||
const addMode = !operate.showOnEdit && !this.dataForm.id;
|
const addMode = !operate.showOnEdit && !this.dataForm.id;
|
||||||
const permission = operate.permission ? this.$hasPermission(operate.permission) : true;
|
const permission = operate.permission ? this.$hasPermission(operate.permission) : true;
|
||||||
const currentMenuKey = this.configs.menu.find((item) => item.name === this.activeMenu)?.key;
|
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) {
|
resetForm(excludeId = false, immediate = false) {
|
||||||
@ -975,7 +986,8 @@ export default {
|
|||||||
case "delete": {
|
case "delete": {
|
||||||
// 确认是否删除
|
// 确认是否删除
|
||||||
console.log("delete....", data);
|
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}`, "提示", {
|
return this.$confirm(`是否删除条目: ${itemName}`, "提示", {
|
||||||
confirmButtonText: "确认",
|
confirmButtonText: "确认",
|
||||||
cancelButtonText: "我再想想",
|
cancelButtonText: "我再想想",
|
||||||
@ -1024,10 +1036,6 @@ export default {
|
|||||||
/* background: #0f02 !important; */
|
/* background: #0f02 !important; */
|
||||||
}
|
}
|
||||||
|
|
||||||
/* .el-menu--horizontal > .el-menu-item.is-active { */
|
|
||||||
/* border-bottom-color: #0b58ff; */
|
|
||||||
/* } */
|
|
||||||
|
|
||||||
.dialog-with-menu >>> .el-dialog__body {
|
.dialog-with-menu >>> .el-dialog__body {
|
||||||
/* padding-top: 16px !important;
|
/* padding-top: 16px !important;
|
||||||
padding-bottom: 16px !important; */
|
padding-bottom: 16px !important; */
|
||||||
@ -1035,16 +1043,15 @@ export default {
|
|||||||
padding-bottom: 0 !important;
|
padding-bottom: 0 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* .dialog-with-menu >>> .dialog-body__inner {
|
||||||
|
padding: 16px;
|
||||||
|
} */
|
||||||
|
|
||||||
.el-select,
|
.el-select,
|
||||||
.el-cascader {
|
.el-cascader {
|
||||||
width: 100% !important;
|
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 {
|
.relative {
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user