style:样式修改，暗黑色适应

src/views/perfManage/kpiOverView/index.vue

@@ -700,9 +700,10 @@ const handleSecondaryKPIChange = (kpiId: string, checked: boolean) => {
               <span class="card-title">{{ neType.toUpperCase() }}</span>
             </template>
             <template #extra>
-              <a-dropdown v-if="secondaryKPIs[neType]?.length">
+              <a-dropdown v-if="secondaryKPIs[neType]?.length" :trigger="['click']">
                 <template #overlay>
                   <div class="secondary-kpi-menu" @click.stop>
+                    <div class="secondary-kpi-list">
                       <div
                         v-for="kpi in secondaryKPIs[neType]"
                         :key="kpi.kpiId"
@@ -719,10 +720,10 @@ const handleSecondaryKPIChange = (kpiId: string, checked: boolean) => {
                         </a-checkbox>
                       </div>
                     </div>
+                  </div>
                 </template>
-                <a-button type="link" size="small">
+                <a-button type="link" size="small" class="more-metrics-btn">
                   <more-outlined />
-                  <down-outlined />
                   <span class="secondary-count">({{ secondaryKPIs[neType].length }})</span>
                 </a-button>
               </a-dropdown>
@@ -777,20 +778,81 @@ const handleSecondaryKPIChange = (kpiId: string, checked: boolean) => {
 }
 /* 其他指标下拉菜单样式 */
 .secondary-kpi-menu {
-  background: #fff;
-  padding: 4px 0;
-  border-radius: 2px;
+  border-radius: 4px;
   box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12),
-  0 6px 16px 0 rgba(0, 0, 0, 0.08);
+  0 6px 16px 0 rgba(0, 0, 0, 0.08),
+  0 9px 28px 8px rgba(0, 0, 0, 0.05);
+  min-width: 240px;
+  max-width: 320px;
+}
+[data-theme='light'] .secondary-kpi-menu {
+  background: #fff;
+}
+[data-theme='dark'] .secondary-kpi-menu {
+  background: #1f1f1f;
+}
+
+.secondary-kpi-list {
   max-height: 300px;
   overflow-y: auto;
-  min-width: 200px;
+  padding: 4px 0;
+}
+
+.secondary-kpi-list::-webkit-scrollbar {
+  width: 6px;
+  height: 6px;
+}
+
+.secondary-kpi-list::-webkit-scrollbar-thumb {
+  background: #fff;
+  border-radius: 3px;
+}
+
+.secondary-kpi-list::-webkit-scrollbar-track {
+  border-radius: 3px;
 }
 
 .secondary-kpi-item {
   padding: 8px 12px;
+  transition: background-color 0.3s;
   cursor: pointer;
-  user-select: none;
+}
+
+.more-metrics-btn {
+  display: inline-flex;
+  align-items: center;
+  color: #1890ff;
+  transition: all 0.3s;
+}
+
+.more-metrics-btn:hover {
+  color: #40a9ff;
+  background: rgba(24, 144, 255, 0.1);
+}
+
+.secondary-count {
+  margin-left: 4px;
+  font-size: 12px;
+  padding: 2px 6px;
+  border-radius: 10px;
+}
+
+/* 优化复选框样式 */
+:deep(.ant-checkbox-wrapper) {
+  width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  padding: 4px 0;
+}
+
+:deep(.ant-checkbox-wrapper:hover) {
+  color: #1890ff;
+}
+
+:deep(.ant-checkbox-checked .ant-checkbox-inner) {
+  background-color: #1890ff;
+  border-color: #1890ff;
 }
 
 /* 组件统一样式 */
@@ -813,9 +875,4 @@ const handleSecondaryKPIChange = (kpiId: string, checked: boolean) => {
   white-space: nowrap;
 }
 
-/* 添加次要指标数量的样式 */
-.secondary-count {
-  margin-left: 4px;
-  font-size: 12px;
-}
 </style>