update dialog style

src/components/DialogUpload.vue

@@ -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;

src/components/DialogWithMenu.vue

@@ -12,12 +12,9 @@
     :destroy-on-close="false"
     @close="handleClose"
     :close-on-click-modal="configs.clickModalToClose ?? false">
-    <!-- title  -->
+    <h1 slot="title" class="dialog-title">
-    <div slot="title" class="dialog-title">
+      {{ detailMode ? "查看详情" : dataForm.id ? "编辑" : "新增" }}
-      <h1 class="">
+    </h1>
-        {{ detailMode ? "查看详情" : dataForm.id ? "编辑" : "新增" }}
-      </h1>
-    </div>
 
     <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)?.[
+                  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) {
                   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;
 }