chore: sync current WechatHookBot workspace

utils/webui_static/components/AppLayout.js

@@ -0,0 +1,60 @@
+window.AppLayout = {
+    props: {
+        authUser: {
+            type: String,
+            default: '',
+        },
+    },
+    emits: ['logout', 'auth-updated'],
+    setup() {
+        const { inject } = Vue;
+        const currentPage = inject('currentPage');
+
+        const menuItems = [
+            { index: 'log', icon: 'Document', label: '日志' },
+            { index: 'config', icon: 'Setting', label: '配置' },
+            { index: 'plugin', icon: 'Box', label: '插件' },
+            { index: 'security', icon: 'Lock', label: '安全' },
+        ];
+
+        return { currentPage, menuItems };
+    },
+    template: `
+    <el-container class="app-shell">
+        <el-aside width="220px" class="app-aside">
+            <div class="brand-panel">
+                <div class="brand-title">WechatHookBot</div>
+                <div class="brand-sub">Control Surface</div>
+            </div>
+            <el-menu :default-active="currentPage"
+                     class="app-menu"
+                     @select="(idx) => currentPage = idx"
+                     background-color="transparent">
+                <el-menu-item v-for="item in menuItems" :key="item.index" :index="item.index">
+                    <el-icon><component :is="item.icon" /></el-icon>
+                    <span>{{ item.label }}</span>
+                </el-menu-item>
+            </el-menu>
+        </el-aside>
+        <el-main class="app-main">
+            <div class="app-topbar">
+                <div class="topbar-title">Real-time Operations Panel</div>
+                <div class="topbar-right">
+                    <span class="auth-pill">
+                        当前账号: {{ authUser || '-' }}
+                    </span>
+                    <el-button size="small" @click="$emit('logout')">退出登录</el-button>
+                </div>
+            </div>
+            <div class="content-stage">
+                <LogViewer v-show="currentPage === 'log'" />
+                <ConfigEditor v-show="currentPage === 'config'" />
+                <PluginList v-show="currentPage === 'plugin'" />
+                <SecuritySettings
+                    v-show="currentPage === 'security'"
+                    @updated="$emit('auth-updated', $event)" />
+            </div>
+        </el-main>
+    </el-container>
+    `
+};