From d07a0fa2f8de9d05bbfef404039a73c6af168569 Mon Sep 17 00:00:00 2001
From: chenyao <1219716595@qq.com>
Date: Thu, 04 Jun 2026 10:06:14 +0800
Subject: [PATCH] feat:feat:更新组件el-cascader 样式

---
 applications/task-work-order/src/styles/common/cockpit.scss |   98 ++++++++++++++++++++++++++++++++++++++++--------
 1 files changed, 81 insertions(+), 17 deletions(-)

diff --git a/applications/task-work-order/src/styles/common/cockpit.scss b/applications/task-work-order/src/styles/common/cockpit.scss
index fa358fb..88ed77a 100644
--- a/applications/task-work-order/src/styles/common/cockpit.scss
+++ b/applications/task-work-order/src/styles/common/cockpit.scss
@@ -55,12 +55,13 @@
   color: #ffffff;
 }
 
-.gd-select,.gd-input,.gd-input-text,.gd-date-picker{
+.gd-select,.gd-input,.gd-input-text,.gd-date-picker,.gd-cascader{
   .is-disabled{
     opacity: 0.6;
   }
 }
-.gd-select {
+.gd-select,
+.gd-cascader {
   --bg: #{$form-bg};
   --tips: #{$form-tips};
 
@@ -69,14 +70,16 @@
     --tips: #{$form-tips-gray};
   }
 
-  .el-select__wrapper {
+  .el-select__wrapper,
+  .el-input__wrapper {
     padding: 0 8px;
     background: var(--bg);
     box-shadow: none !important;
     border: none;
+    min-height: 36px; // 确保最小高度一致
 
-
-    .el-select__suffix {
+    .el-select__suffix,
+    .el-input__suffix {
       .el-icon {
         color: $search-item-icon-color;
       }
@@ -91,6 +94,16 @@
     &.el-select__selected-item {
       color: #383874;
     }
+  }
+
+  .el-input__inner {
+    height: 100%; // 让内部 input 撑满
+    line-height: 36px;
+    &::placeholder {
+      color: var(--tips);
+    }
+
+    color: #383874;
   }
 }
 
@@ -866,8 +879,10 @@
     line-height: 36px;
   }
 
-  .gd-select {
-    .el-select__wrapper {
+  .gd-select,
+  .gd-cascader {
+    .el-select__wrapper,
+    .el-input__wrapper {
       width: 200px;
       height: 36px;
     }
@@ -985,12 +1000,14 @@
             color: $search-item-symbol-txt;
 
             &.hover {
-              background-color: rgba(0, 120, 233, 0.63) !important;
+              // background-color: rgba(0, 120, 233, 0.63) !important;
               color: #383874;
             }
 
-            &.selected {
-              color: #8ac3fd !important;
+            &.selected,
+            &.is-selected {
+              // color: #8ac3fd !important;
+              color: #383874;
               font-weight: 700;
             }
           }
@@ -999,14 +1016,55 @@
     }
 
     .el-select-dropdown__empty {
-      background: $form-bg;
+      background: $search-item-symbol-bg;
       border-radius: 0px 0px 8px 8px;
     }
   }
 
   .el-popper__arrow::before {
-    background: $form-bg !important;
-    border: 1px solid #F2F3F5 !important;
+    background: $search-item-symbol-bg !important;
+    border: 1px solid $search-item-symbol-bg !important;
+  }
+}
+
+.gd-cascader-popper {
+  border: none;
+  background: $search-item-symbol-bg !important;
+
+  .el-cascader-panel {
+    background: transparent !important;
+  }
+
+  .el-cascader-menu {
+    background: transparent !important;
+    border-right: 1px solid #DDE2ED !important;
+    color: $search-item-symbol-txt;
+
+    &:last-child {
+      border-right: none !important;
+    }
+
+    .el-cascader-node {
+      color: $search-item-symbol-txt;
+
+      &.is-selectable.in-active-path,
+      &.in-active-path,
+      &:hover {
+        // background-color: rgba(0, 120, 233, 0.63) !important;
+        color: #383874;
+      }
+
+      &.is-active {
+        color: #383874;
+        // color: #8ac3fd !important;
+        font-weight: 700;
+      }
+    }
+  }
+
+  .el-popper__arrow::before {
+    background: $search-item-symbol-bg !important;
+    border: 1px solid $search-item-symbol-bg !important;
   }
 }
 
@@ -1223,8 +1281,10 @@
 }
 
 .gd-dialog-form {
-  .gd-select {
-    .el-select__wrapper {
+  .gd-select,
+  .gd-cascader {
+    .el-select__wrapper,
+    .el-input__wrapper {
       height: 36px;
     }
   }
@@ -1239,11 +1299,15 @@
     height: 36px;
   }
   .el-input,
-  .el-input-number {
+  .el-input-number,
+  .el-cascader,
+  .el-select {
     min-width: 200px;
     flex: 1;
+    width: 100%; // 确保占满容器
 
-    .el-input__wrapper {
+    .el-input__wrapper,
+    .el-select__wrapper {
       padding: 0 8px;
     }
 

--
Gitblit v1.9.3