fix(lead): 修复表单错误提示样式问题

src/views/lead/index.vue

@@ -1,7 +1,7 @@
 <template>
     <basic-container>
         <avue-crud :option="option" :data="data" ref="crud" v-model="form" :page.sync="page"
-            :permission="permissionList" :before-open="beforeOpen" :table-loading="loading" 
+            :permission="permissionList" :before-open="beforeOpen" :table-loading="loading"
             @row-update="rowUpdate" @row-save="rowSave" @search-change="searchChange" @search-reset="searchReset"
             @selection-change="selectionChange" @current-change="currentChange" @size-change="sizeChange"
             @refresh-change="refreshChange" @on-load="onLoad">
@@ -82,26 +82,26 @@
                     </div>
                 </div>
             </div>
-            
-            <avue-crud 
-                :option="detailOption" 
-                :data="detailData" 
-                ref="detailCrud" 
-                v-model="detailForm" 
+
+            <avue-crud
+                :option="detailOption"
+                :data="detailData"
+                ref="detailCrud"
+                v-model="detailForm"
                 :page.sync="detailPage"
-                :permission="detailPermissionList" 
-                :before-open="detailBeforeOpen" 
-                :table-loading="detailLoading" 
+                :permission="detailPermissionList"
+                :before-open="detailBeforeOpen"
+                :table-loading="detailLoading"
                 @row-del="detailRowDel"
-                @row-update="detailRowUpdate" 
-                @row-save="detailRowSave" 
-                @selection-change="detailSelectionChange" 
-                @current-change="detailCurrentChange" 
+                @row-update="detailRowUpdate"
+                @row-save="detailRowSave"
+                @selection-change="detailSelectionChange"
+                @current-change="detailCurrentChange"
                 @size-change="detailSizeChange"
-                @refresh-change="detailRefreshChange" 
+                @refresh-change="detailRefreshChange"
                 @on-load="detailOnLoad">
                 <template slot="menuLeft">
-                    <el-button type="danger" size="small" plain icon="el-icon-delete" 
+                    <el-button type="danger" size="small" plain icon="el-icon-delete"
                         @click="handleDetailDelete" :disabled="detailSelectionList.length === 0">
                         删除
                     </el-button>
@@ -116,7 +116,42 @@ import leadIndexMixin from './mixins/leadIndex'
 
 export default {
     name: 'Lead',
-    mixins: [leadIndexMixin]
+    mixins: [leadIndexMixin],
+    watch: {
+      detailDialogVisible(visible) {
+        if (visible) {
+          this.injectErrorStyle();
+        } else {
+          this.removeErrorStyle();
+        }
+      }
+    },
+    methods: {
+      injectErrorStyle() {
+        const styleId = 'lead-error-style';
+        if (document.getElementById(styleId)) return;
+
+        const style = document.createElement('style');
+        style.id = styleId;
+        style.textContent = `
+          .el-form-item__error {
+            display: block !important;
+            position: static !important;
+            margin-top: 4px !important;
+            white-space: normal !important;
+            color: #f56c6c !important;
+          }
+        `;
+        document.head.appendChild(style);
+      },
+      removeErrorStyle() {
+        const styleId = 'lead-error-style';
+        const style = document.getElementById(styleId);
+        if (style) {
+          style.remove();
+        }
+      }
+    }
 }
 </script>
 
@@ -135,38 +170,38 @@ export default {
     border-radius: 4px;
     padding: 15px;
     background-color: #fff;
-    
+
     .info-row {
         display: flex;
         margin-bottom: 10px;
-        
+
         &:last-child {
             margin-bottom: 0;
         }
-        
+
         &.title-row {
             margin-top: 5px;
         }
     }
-    
+
     .info-item {
         flex: 1;
         padding: 0 10px;
-        
+
         &.full-width {
             flex: 3;
             width: 100%;
         }
-        
+
         .label {
             font-weight: bold;
             color: #606266;
             margin-right: 5px;
         }
-        
+
         .value {
             color: #303133;
-            
+
             &.title-value {
                 font-size: 16px;
             }
@@ -182,9 +217,10 @@ export default {
 }
 
 // 仅在本组件的弹层内，修正 Element UI 错误提示的定位与显示，确保可见
-.lead-detail-dialog .el-form-item__error {
+.el-form-item__error {
     display: block !important;
     position: static !important;
-    margin-top: 4px;
+    white-space: normal !important;
+    color: #f56c6c !important;
 }
-</style>
+</style>