feat(resource-pannel): 为资源面板添加标签页图标和新标签，清理未使用导入

- 优化资源面板标签页布局，将图标置于文字上方
- 新增复合技和地图两个标签页
更新标签页数据结构以支持图标配置
移除未使用的naive-ui和vueuse依赖导入

src/pages/vimp/components/resource-pannel.vue

@@ -1,12 +1,12 @@
 <script setup lang="ts">
-import { NButton, NFlex, NIcon, NInput, NPageHeader, NTabPane, NTabs, NText, type TabPaneProps } from 'naive-ui';
+import { NButton, NIcon, NInput, NTabPane, NTabs, NText, type TabPaneProps } from 'naive-ui';
 import { computed, ref, type Component } from 'vue';
 import AlarmTree from './alarm-tree.vue';
 import CameraTree from './camera-tree.vue';
-import { ChevronLeftIcon, PanelBottom } from 'lucide-vue-next';
+import { ChevronLeftIcon, MapPinIcon, MapPinnedIcon, MonitorIcon, SirenIcon, WandSparklesIcon } from 'lucide-vue-next';
 import { useResourcePanelStore } from '../stores';
-import { watchImmediate } from '@vueuse/core';
 import { storeToRefs } from 'pinia';
+import BulletCamera from './icon/bullet-camera.vue';
 
 const PANEL_WIDTH_EXPANDED = '480px';
 const PANEL_WIDTH_COLLAPSED = '72px';
@@ -14,13 +14,16 @@ const PANEL_WIDTH_COLLAPSED = '72px';
 interface ResourceTabPane extends TabPaneProps {
   name: string;
   tab: string;
+  icon?: Component;
   component?: Component;
 }
 
 const resourceTabPanes: ResourceTabPane[] = [
-  { name: 'camera', tab: '摄像头', component: CameraTree },
-  { name: 'alarm', tab: '警报器', component: AlarmTree },
-  { name: 'monitor', tab: '监视器' },
+  { name: 'camera', tab: '摄像头', icon: BulletCamera, component: CameraTree },
+  { name: 'alarm', tab: '警报器', icon: SirenIcon, component: AlarmTree },
+  { name: 'monitor', tab: '监视器', icon: MonitorIcon },
+  { name: 'combine-tech', tab: '复合技', icon: WandSparklesIcon },
+  { name: 'leaflet-map', tab: '地图', icon: MapPinnedIcon },
 ];
 
 const activeTabName = ref(resourceTabPanes.at(0)?.name ?? '');
@@ -91,14 +94,21 @@ const expandResourcePanel = () => {
           }"
         >
           <NTabPane
-            v-for="{ name: resourceName, tab: resourceTab, component } in resourceTabPanes"
+            v-for="{ name: resourceName, tab: resourceTab, icon: resourceIcon, component } in resourceTabPanes"
             :key="resourceName"
-            :tab="resourceTab"
             :name="resourceName"
             :tab-props="{ onClick: () => expandResourcePanel() }"
           >
-            <template v-if="!!component">
-              <component :is="component" />
+            <template #tab>
+              <div style="width: 48px; display: flex; flex-direction: column; justify-content: center; align-items: center">
+                <NIcon :size="18" :component="resourceIcon"></NIcon>
+                <div style="font-size: 12px">{{ resourceTab }}</div>
+              </div>
+            </template>
+            <template #default>
+              <template v-if="!!component">
+                <component :is="component" />
+              </template>
             </template>
           </NTabPane>
         </NTabs>