feat(strategy): 代码编辑文件树按类型分组(组合策略/个股策略+数量徽标) [nas]

frontend/src/views/strategy/Code.vue

@@ -26,6 +26,12 @@ const syntaxOk = ref<boolean | null>(null)
 
 const active = computed(() => files.value.find((f) => f.name === activeName.value))
 
+// 文件树按类型分组:组合策略在前(常用),个股策略在后
+const fileGroups = computed(() => [
+  { label: '组合策略', items: files.value.filter((f) => f.type === 'portfolio') },
+  { label: '个股策略', items: files.value.filter((f) => f.type !== 'portfolio') },
+].filter((g) => g.items.length))
+
 onMounted(async () => {
   try {
     const { data } = await apiClient.get<{ files: StrategyFile[] }>('/strategy/files')
@@ -115,20 +121,26 @@ function runBacktest(): void {
         <div class="tree-head">
           <span class="section-mark"></span>策略文件
         </div>
-        <div
-          v-for="f in files"
-          :key="f.name"
-          class="tree-item"
-          :class="{ active: f.name === activeName, dirty: f.name === activeName && dirty }"
-          @click="select(f)"
-        >
-          <span class="file-icon">◐</span>
-          <div class="file-body">
-            <span class="file-name">{{ f.name }}</span>
-            <span class="file-cls mono">{{ f.class_name }}</span>
+        <template v-for="g in fileGroups" :key="g.label">
+          <div class="tree-group">
+            {{ g.label }}
+            <span class="tree-count mono">{{ g.items.length }}</span>
           </div>
-          <span class="file-lines mono">{{ f.lines }}</span>
-        </div>
+          <div
+            v-for="f in g.items"
+            :key="f.name"
+            class="tree-item"
+            :class="{ active: f.name === activeName, dirty: f.name === activeName && dirty }"
+            @click="select(f)"
+          >
+            <span class="file-icon">◐</span>
+            <div class="file-body">
+              <span class="file-name">{{ f.name }}</span>
+              <span class="file-cls mono">{{ f.class_name }}</span>
+            </div>
+            <span class="file-lines mono">{{ f.lines }}</span>
+          </div>
+        </template>
       </aside>
 
       <section class="editor-pane">
@@ -200,6 +212,22 @@ function runBacktest(): void {
   background: var(--brand);
   box-shadow: 0 0 8px rgba(0, 229, 255, 0.6);
 }
+.tree-group {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 8px 14px 4px;
+  font-size: 11px;
+  font-weight: 600;
+  color: var(--text-2);
+}
+.tree-count {
+  font-size: 10px;
+  color: var(--text-3);
+  background: var(--bg-hover);
+  border-radius: 8px;
+  padding: 0 6px;
+}
 .tree-item {
   display: flex;
   align-items: center;