|
|
@@ -0,0 +1,95 @@
|
|
|
+<template>
|
|
|
+ <div class="min-h-screen bg-gradient-to-r from-white to-purple-100">
|
|
|
+ <!-- Top Navigation -->
|
|
|
+ <header class="bg-white border-b">
|
|
|
+ <div class="flex items-center justify-between px-4 py-2">
|
|
|
+ <div class="flex items-center space-x-2">
|
|
|
+ <div class="text-blue-600">
|
|
|
+ <div class="w-8 h-8">
|
|
|
+ <div class="w-full h-full" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <span class="text-xl font-medium">ProductName</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="flex-1 max-w-xl mx-4">
|
|
|
+ <div class="relative">
|
|
|
+ <Search class="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400" size={20} />
|
|
|
+ <input
|
|
|
+ type="text"
|
|
|
+ placeholder="输入内容查询"
|
|
|
+ class="w-full pl-10 pr-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="flex items-center space-x-4">
|
|
|
+ <MessageCircle class="w-6 h-6 text-blue-500" />
|
|
|
+ <Bell class="w-6 h-6 text-blue-500" />
|
|
|
+ <Settings class="w-6 h-6 text-gray-400" />
|
|
|
+ <div class="w-8 h-8 rounded-full bg-gray-200"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </header>
|
|
|
+
|
|
|
+ <div class="flex">
|
|
|
+ <!-- Sidebar -->
|
|
|
+ <aside class="w-64 min-h-screen bg-[#08002E] text-white border-r">
|
|
|
+ <nav class="p-4">
|
|
|
+ <ul class="space-y-2">
|
|
|
+ <li>
|
|
|
+ <a href="#/" class="flex items-center px-4 py-2 text-white hover:bg-[#11113D] rounded-lg">
|
|
|
+ <Home class="w-5 h-5 mr-3" />
|
|
|
+ 首页
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <a href="#/project-management" class="flex items-center px-4 py-2 text-white hover:bg-[#11113D] rounded-lg">
|
|
|
+ <Box class="w-5 h-5 mr-3" />
|
|
|
+ 项目管理
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <a href="#/data-analysis" class="flex items-center px-4 py-2 text-white hover:bg-[#11113D] rounded-lg">
|
|
|
+ <LayoutGrid class="w-5 h-5 mr-3" />
|
|
|
+ 数据分析
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </nav>
|
|
|
+ </aside>
|
|
|
+
|
|
|
+ <!-- Main Content -->
|
|
|
+ <main class="flex-1 p-6">
|
|
|
+ <!-- Lightweight and Easy-to-Use Module -->
|
|
|
+ <div class="grid grid-cols-2 gap-6 mb-6">
|
|
|
+ <div class="bg-white rounded-lg p-6 shadow-sm">
|
|
|
+ <h2 class="text-lg font-medium mb-4">生成用户故事模块</h2>
|
|
|
+ <a href="#/user-story" class="text-blue-600 hover:underline">
|
|
|
+ 跳转到生成用户故事界面
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ <div class="bg-white rounded-lg p-6 shadow-sm">
|
|
|
+ <h2 class="text-lg font-medium mb-4">生成测试脚本模块</h2>
|
|
|
+ <a href="#/test-script" class="text-blue-600 hover:underline">
|
|
|
+ 跳转到生成测试脚本界面
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- Intelligent Project Analysis Module -->
|
|
|
+ <div class="bg-white rounded-lg p-6 shadow-sm">
|
|
|
+ <h2 class="text-lg font-medium mb-4">智能项目分析模块</h2>
|
|
|
+ <!-- Content for intelligent project analysis goes here -->
|
|
|
+ </div>
|
|
|
+ </main>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import {
|
|
|
+ Search, MessageCircle, Bell, Settings,
|
|
|
+ Home, Box, LayoutGrid
|
|
|
+} from 'lucide-vue-next'
|
|
|
+</script>
|
genlitex