继续完善页面布局

layouts/admin/components/AdminAside.uvue

@@ -0,0 +1,81 @@
+<template>
+  <view class="aside">
+    <view class="aside-header">
+      <view class="logo">
+        <text class="logo-text">{{ collapsed ? '商' : '商城后台' }}</text>
+      </view>
+      <view class="collapse-btn" @click="$emit('toggle')">
+        <text class="collapse-text">{{ collapsed ? '›' : '‹' }}</text>
+      </view>
+    </view>
+
+    <view class="aside-menu">
+      <view
+        v-for="m in menuList"
+        :key="m.id"
+        class="aside-item"
+        :class="{ active: activeMenuId === m.id }"
+        @click="$emit('menu-click', m.id)"
+      >
+        <image class="aside-icon" :src="m.icon" mode="aspectFit" />
+        <text class="aside-title" v-if="!collapsed">{{ m.title }}</text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup lang="uts">
+import type { MenuItem } from '../types.uts'
+
+defineProps<{
+  collapsed: boolean
+  menuList: MenuItem[]
+  activeMenuId: string
+}>()
+
+defineEmits<{
+  (e:'toggle'): void
+  (e:'menu-click', menuId: string): void
+}>()
+</script>
+
+<style>
+.aside{
+  width: 96px;
+  background: #1f2a37;
+  height: 100vh;
+  position: fixed;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  display:flex;
+  flex-direction: column;
+  z-index: 1000;
+}
+.aside-header{
+  height: 56px;
+  display:flex;
+  align-items:center;
+  justify-content: space-between;
+  padding: 0 12px;
+  border-bottom: 1px solid rgba(255,255,255,0.08);
+}
+.logo-text{ color:#fff; font-size:14px; font-weight:600; }
+.collapse-btn{ width:28px; height:28px; display:flex; align-items:center; justify-content:center; }
+.collapse-text{ color:rgba(255,255,255,0.7); }
+
+.aside-menu{ padding: 8px 0; }
+.aside-item{
+  height: 54px;
+  display:flex;
+  flex-direction: column;
+  align-items:center;
+  justify-content:center;
+  gap: 6px;
+  margin: 6px 10px;
+  border-radius: 8px;
+}
+.aside-item.active{ background:#1677ff; }
+.aside-icon{ width:22px; height:22px; }
+.aside-title{ color:#fff; font-size:12px; }
+</style>