feat: 优化

frontend/app/web-gold/src/views/material/components/SceneSelectorModal.vue

@@ -21,15 +21,15 @@
 
       <!-- 分组切换 -->
       <div v-if="groupList.length > 1" class="group-tabs">
-        <a-tag
+        <div
           v-for="g in groupList"
           :key="g.id"
-          :color="selectorGroupId === g.id ? 'blue' : 'default'"
-          style="cursor: pointer;"
+          class="group-tab-item"
+          :class="{ 'group-tab-item--active': selectorGroupId === g.id }"
           @click="handleSelectorGroupChange(g.id)"
         >
           {{ g.name }}
-        </a-tag>
+        </div>
       </div>
 
       <a-button type="text" size="small" @click="$emit('update:visible', false)">
@@ -134,6 +134,8 @@ const props = defineProps({
 
 const emit = defineEmits(['update:visible', 'confirm', 'load-group-files'])
 
+const LOCAL_STORAGE_KEY = 'mix-scene-selector-group-id'
+
 const selectorGroupId = ref(null)
 const tempSelectedFiles = ref([])
 
@@ -152,7 +154,28 @@ const selectorFiles = computed(() => {
 watch(() => props.visible, (visible) => {
   if (visible) {
     tempSelectedFiles.value = [...props.initialCandidates]
-    selectorGroupId.value = props.sceneGroupId || props.globalGroupId || null
+
+    // 优先级：1. 场景自带分组 2. 本地存储的分组 3. 全局分组 4. 第一个分组
+    let targetGroupId = props.sceneGroupId
+
+    if (!targetGroupId) {
+      const savedGroupId = localStorage.getItem(LOCAL_STORAGE_KEY)
+      if (savedGroupId && props.groupList.some(g => String(g.id) === savedGroupId)) {
+        targetGroupId = savedGroupId
+      }
+    }
+
+    if (!targetGroupId && props.globalGroupId) {
+      targetGroupId = props.globalGroupId
+    }
+
+    if (!targetGroupId && props.groupList.length > 0) {
+      targetGroupId = props.groupList[0].id
+    }
+
+    selectorGroupId.value = targetGroupId
+
+    // 加载分组文件
     if (selectorGroupId.value && !props.allGroupFiles[selectorGroupId.value]) {
       emit('load-group-files', selectorGroupId.value)
     }
@@ -174,11 +197,6 @@ onUnmounted(() => window.removeEventListener('keydown', handleKeydown))
 const isSelected = (fileId) => tempSelectedFiles.value.includes(fileId)
 const getSelectionOrder = (fileId) => tempSelectedFiles.value.indexOf(fileId) + 1
 
-const getFileName = (fileId) => {
-  const file = selectorFiles.value.find(f => f.id === fileId)
-  return file ? (file.displayName || file.fileName) : '未知'
-}
-
 const toggleSelection = (file) => {
   const index = tempSelectedFiles.value.indexOf(file.id)
   if (index > -1) {
@@ -192,11 +210,6 @@ const toggleSelection = (file) => {
   }
 }
 
-const removeSelection = (fileId) => {
-  const index = tempSelectedFiles.value.indexOf(fileId)
-  if (index > -1) tempSelectedFiles.value.splice(index, 1)
-}
-
 const handleQuickConfirm = (file) => {
   if (!isSelected(file.id)) toggleSelection(file)
   handleConfirm()
@@ -236,6 +249,8 @@ const handleAutoFill = () => {
 
 const handleSelectorGroupChange = (groupId) => {
   selectorGroupId.value = groupId
+  // 保存到本地存储
+  localStorage.setItem(LOCAL_STORAGE_KEY, String(groupId))
   tempSelectedFiles.value = []
   if (groupId && !props.allGroupFiles[groupId]) {
     emit('load-group-files', groupId)
@@ -345,7 +360,35 @@ const handleConfirm = () => {
 
   .group-tabs {
     display: flex;
-    gap: var(--space-1);
+    gap: var(--space-2);
+    flex: 1;
+    justify-content: center;
+  }
+
+  .group-tab-item {
+    padding: var(--space-2) var(--space-4);
+    font-size: var(--font-size-sm);
+    font-weight: 500;
+    color: @text-secondary;
+    background: var(--color-gray-100);
+    border-radius: var(--radius-button);
+    cursor: pointer;
+    transition: all var(--duration-base) ease;
+    user-select: none;
+
+    &:hover {
+      background: var(--color-gray-200);
+      color: @text;
+    }
+
+    &--active {
+      background: @primary;
+      color: var(--color-text-inverse);
+
+      &:hover {
+        background: @primary-hover;
+      }
+    }
   }
 }