feat(layout): 为多页面添加侧边栏布局组件

- 在admid页面和class页面包裹el-container，插入Sidebar侧边栏组件
- 在LearningPlan和PlanTTS页面同样新增侧边栏布局
- 重构Header组件样式，采用fluent风格透明卡片和按钮样式
- 增加main.css中panel-shell的样式定义以支持新布局视觉效果
- 优化部分按钮及菜单交互样式，提升整体一致性与视觉体验

enlish-vue/src/layouts/components/Sidebar.vue

@@ -0,0 +1,50 @@
+<template>
+    <div class="h-full p-2">
+        <div class="h-full panel-shell">
+            <el-menu router :default-active="activePath" class="h-full rounded-xl bg-transparent" :collapse="false">
+                <el-menu-item index="/">
+                    <span>班级列表</span>
+                </el-menu-item>
+                <el-menu-item index="/learningplan">
+                    <span>学案</span>
+                </el-menu-item>
+                <el-menu-item index="/uploadpng">
+                    <span>上传图片</span>
+                </el-menu-item>
+            </el-menu>
+        </div>
+    </div>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import { useRoute } from 'vue-router'
+import router from '@/router'
+const route = useRoute()
+const activePath = computed(() => route.path)
+const allRoutes = router.getRoutes()
+const menuItems = computed(() => {
+    return allRoutes
+        .filter(r => r.meta && r.meta.title)
+        .filter(r => !r.path.includes(':'))
+        .filter(r => r.path !== '/login')
+        .map(r => ({ path: r.path, title: r.meta.title }))
+        .sort((a, b) => a.title.localeCompare(b.title, 'zh-CN'))
+})
+</script>
+
+<style scoped>
+/* Fluent 2 气质的轻盈质感：柔和玻璃、圆角、细描边 */
+.el-menu {
+    --el-menu-bg-color: transparent;
+    --el-menu-hover-bg-color: rgba(255, 255, 255, 0.35);
+    --el-menu-active-color: #2563eb;
+}
+.el-menu-item {
+    border-radius: 10px;
+    transition: all 0.2s ease;
+}
+.el-menu-item:hover {
+    backdrop-filter: saturate(1.2);
+}
+</style>