新增 Web 浏览端(Go+Vue 报表系统)

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

web/frontend/src/App.vue

@@ -0,0 +1,91 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+import { useRouter, useRoute } from 'vue-router'
+import { useAuthStore } from '@/stores/auth'
+
+const auth = useAuthStore()
+const router = useRouter()
+const route = useRoute()
+
+const showLayout = computed(() => route.meta.layout !== 'blank' && !!auth.token)
+
+function logout() {
+  auth.logout()
+  router.replace('/login')
+}
+</script>
+
+<template>
+  <el-container v-if="showLayout" class="app">
+    <el-aside width="220px" class="aside">
+      <div class="brand">期货报告</div>
+      <el-menu
+        :default-active="route.path"
+        router
+        background-color="#1f2d3d"
+        text-color="#cfd8e3"
+        active-text-color="#ffffff"
+      >
+        <el-menu-item index="/scores">打分列表</el-menu-item>
+        <el-menu-item index="/chart">K 线 / 持仓</el-menu-item>
+        <el-menu-item v-if="auth.isAdmin" index="/admin/users">用户管理</el-menu-item>
+      </el-menu>
+    </el-aside>
+    <el-container>
+      <el-header class="header">
+        <div class="user">
+          <span>{{ auth.user?.username }}</span>
+          <el-tag size="small" :type="auth.isAdmin ? 'danger' : 'info'">
+            {{ auth.isAdmin ? '管理员' : '普通用户' }}
+          </el-tag>
+        </div>
+        <el-button type="primary" link @click="logout">退出登录</el-button>
+      </el-header>
+      <el-main>
+        <router-view />
+      </el-main>
+    </el-container>
+  </el-container>
+  <router-view v-else />
+</template>
+
+<style>
+html,
+body,
+#app {
+  height: 100%;
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', sans-serif;
+}
+.app {
+  height: 100%;
+}
+.aside {
+  background: #1f2d3d;
+  color: #cfd8e3;
+}
+.brand {
+  height: 60px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 18px;
+  letter-spacing: 2px;
+  border-bottom: 1px solid #344558;
+}
+.header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  background: #fff;
+  border-bottom: 1px solid #ebeef5;
+}
+.user {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+}
+.el-menu {
+  border-right: none !important;
+}
+</style>