20260826224445

code/fms/fms-vue/src/components/ui/modal/modal.vue

@@ -108,9 +108,15 @@ function toggleFullscreen() {
 }
 
 // 遮罩点击关闭：wrap 铺满视口且层级高于 mask，事件实际落在 wrap 上；
-// 只响应点击 wrap 自身（面板外空白/遮罩区域），点击面板内部不关闭
+// 只响应点击 wrap 自身（面板外空白/遮罩区域），点击面板内部不关闭。
+// 记录 mousedown 是否发生在面板内：若在面板内按下（如拖选输入框文本）后
+// 拖出到遮罩再松开，click.target 会回溯为共同祖先 wrap，此时不应误判为点击遮罩。
+let maskDownInPanel = false
+function onWrapMouseDown(event) {
+  maskDownInPanel = !!panelRef.value?.contains(event.target)
+}
 function onWrapClick(event) {
-  if (event.target === event.currentTarget && props.maskClosable) {
+  if (event.target === event.currentTarget && props.maskClosable && !maskDownInPanel) {
     requestClose()
   }
 }
@@ -208,6 +214,7 @@ onBeforeUnmount(() => {
         v-if="isOpen"
         class="fms-modal-wrap"
         :class="{ 'fms-modal-centered': centered }"
+        @mousedown="onWrapMouseDown"
         @click="onWrapClick"
       >
         <div

code/fms/fms-vue/src/components/ui/tree/index.scss

@@ -26,10 +26,13 @@
     box-shadow 0.15s ease;
 }
 
+/* hover：仅内容区域背景变化（箭头/缩进区不变），整行保持 pointer 提示可点 */
 .tree-node:hover:not(.is-disabled) {
-  background: var(--fms-secondary-hover);
   cursor: pointer;
 }
+.tree-node:hover:not(.is-disabled) .tree-node-content {
+  background: var(--fms-secondary-hover);
+}
 
 /* 键盘/鼠标聚焦：focus-visible 描边，避免鼠标点击也出现描边 */
 .tree-node:focus-visible {
@@ -37,12 +40,12 @@
   outline-offset: -2px;
 }
 
-/* 选中：主色淡底，明显区分于灰底页面；文字保持默认色。
+/* 选中：仅内容区域主色淡底（整行 hover 背景、箭头/缩进区不受影响）。
    比例取 5%：深色主题（如 #0f172b）在白底上约 #f3f3f4，接近 hover 浅色 #f1f5f9；
    比例过高（10%）时深色主题会算出 #e7e7e9 等偏深灰，显得脏。
    注意 hover 规则 specificity 更高，需连同 hover 一起覆盖，避免悬停时选中态被盖掉 */
-.tree-node.is-selected,
-.tree-node.is-selected:hover:not(.is-disabled) {
+.tree-node.is-selected .tree-node-content,
+.tree-node.is-selected:hover:not(.is-disabled) .tree-node-content {
   background: color-mix(in srgb, var(--fms-primary) 5%, transparent);
 }
 
@@ -78,14 +81,15 @@
 }
 .tree-node-switcher:hover:not(.is-placeholder) {
   background: color-mix(in srgb, var(--fms-primary) 10%, transparent);
-  color: var(--fms-primary);
 }
 .tree-node-switcher.is-placeholder {
   cursor: default;
 }
+/* 展开/收起箭头：黑色（跟随主题文字色），hover 仅显示淡底提示、箭头不变色 */
 .tree-switcher-icon {
   width: var(--fms-tree-icon-size);
   height: var(--fms-tree-icon-size);
+  color: var(--fms-text);
   transition: transform 0.2s cubic-bezier(0.2, 0.8, 0.4, 1);
 }
 .tree-switcher-icon.is-open {
@@ -115,9 +119,11 @@
 .tree-node-content {
   flex: 1;
   min-width: 0;
+  /* 父容器 .tree-node 仅有 min-height（无显式 height），height:100% 无法解析，
+     故用 flex 交叉轴拉伸占满整行实际高度（选中背景/圆角才能覆盖整行） */
+  align-self: stretch;
   display: flex;
   align-items: center;
-  height: 100%;
   padding: 0 var(--fms-tree-title-padding-x);
   border-radius: var(--fms-control-radius);
   overflow: hidden;
@@ -160,13 +166,8 @@
   width: var(--fms-tree-grip-size);
   height: var(--fms-tree-grip-size);
   margin-right: 4px;
-  color: var(--fms-text-secondary);
+  color: #b0b7c3;
   cursor: grab;
-  opacity: 0;
-  transition: opacity 0.15s;
-}
-.tree-node:hover .tree-node-grip {
-  opacity: 1;
 }
 .tree-node-grip:active {
   cursor: grabbing;