'commit'

static/index.html

@@ -2,7 +2,9 @@
 <html>
 <head>
 <meta charset="utf-8">
-<title>多供应商分时电价分析大屏</title>
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>驿来特AI智能数据分析平台</title>
+<link rel="stylesheet" href="css/element-plus.index.css">
 <link rel="stylesheet" href="css/app.css">
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.16.9/katex.min.css">
 <script src="https://cdnjs.cloudflare.com/ajax/libs/marked/12.0.0/marked.min.js"></script>
@@ -12,8 +14,14 @@
 <body>
 <div id="app">
   <header class="dashboard-header">
-    <div class="dashboard-title">⚡ 充电站电价分析驾驶舱</div>
-    <div class="controls">
+    <div class="dashboard-title">⚡ 驿来特AI智能数据分析平台</div>
+    
+    <div class="nav-tabs">
+        <button class="nav-tab" :class="{active: activeTab==='dashboard'}" @click="activeTab='dashboard'">分时电价分析</button>
+        <button class="nav-tab" :class="{active: activeTab==='degree'}" @click="activeTab='degree'">智能数据查询</button>
+    </div>
+
+    <div class="controls" v-if="activeTab==='dashboard'">
       <button class="btn-primary" @click="exportAllPrices" :disabled="exporting">
         <span v-if="!exporting">📊 导出分时段电价表</span>
         <span v-else>⏳ 导出中...</span>
@@ -23,9 +31,13 @@
         <span v-else>⏳ 生成中...</span>
       </button>
     </div>
+    <div class="controls" v-else>
+        <!-- Placeholder for degree tab specific controls if any -->
+    </div>
   </header>
   
-  <div class="main-content">
+  <!-- Dashboard Tab -->
+  <div class="main-content" v-show="activeTab==='dashboard'">
     <div class="left-panel">
       <div class="station-list">
         <div class="station-list-header">全网供应商24小时电价监控</div>
@@ -77,10 +89,88 @@
       </div>
     </div>
   </div>
+
+  <!-- Degree Query Tab -->
+  <div class="degree-container" v-show="activeTab==='degree'">
+    <!-- 悬浮二维码 -->
+    <div class="qr-sidebar">
+        <div id="qrcode" class="qr-code"></div>
+        <p class="qr-text">手机扫码访问</p>
+    </div>
+
+    <div class="query-section">
+        <h1 class="page-title">驿来特AI智能数据查询</h1>
+        <p class="page-subtitle">基于大语言模型，为您提供实时、精准的业务数据分析</p>
+        
+        <div class="input-wrapper">
+            <el-input
+                v-model="userQuery"
+                placeholder="请输入您的问题，例如：帮我查询12月份充电量TOP 10场站的充电情况"
+                class="search-input"
+                size="large"
+                @keyup.enter="handleDegreeSearch"
+                :disabled="queryLoading"
+            >
+                <template #append>
+                    <el-button @click="handleDegreeSearch" :loading="queryLoading" type="primary">
+                        {{ queryLoading ? '分析中...' : '开始查询' }}
+                    </el-button>
+                </template>
+            </el-input>
+        </div>
+
+        <div class="example-tags">
+            <el-tag 
+                v-for="(text, index) in examples" 
+                :key="index"
+                class="example-tag"
+                effect="plain"
+                round
+                size="large"
+                @click="setExample(text)"
+            >
+                {{ text }}
+            </el-tag>
+        </div>
+    </div>
+
+    <div class="result-section" v-if="queryResult || queryLoading">
+        <div class="result-header">
+            <div class="result-title">
+                <span>分析结果</span>
+                <el-tag size="small" type="success" effect="dark" v-if="!queryLoading">完成</el-tag>
+                <el-tag size="small" type="warning" effect="dark" v-if="queryLoading">生成中</el-tag>
+            </div>
+            <el-button 
+                v-if="queryLoading" 
+                type="danger" 
+                link 
+                @click="stopGeneration"
+            >
+                停止生成
+            </el-button>
+        </div>
+        
+        <div class="markdown-body" v-html="renderedQueryResult"></div>
+        <div v-if="queryLoading && !queryResult" class="loading-container">
+            <p>正在分析数据，请稍候...</p>
+        </div>
+        <span v-if="queryLoading" class="cursor-blink">|</span>
+    </div>
+  </div>
+
 </div>
 <script src="js/vue.global.js"></script>
+<script src="js/element-plus.index.full.js"></script>
+<script src="js/element-plus.zh-cn.min.js"></script>
+<script src="js/qrcode.min.js"></script>
 <script src="js/axios.min.js"></script>
 <script src="js/echarts.min.js"></script>
+<script src="js/marked.min.js"></script>
+<!-- Katex for Math Rendering -->
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.8/dist/katex.min.css">
+<script src="https://cdn.jsdelivr.net/npm/katex@0.16.8/dist/katex.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/katex@0.16.8/dist/contrib/auto-render.min.js"></script>
 <script src="js/app.js"></script>
 </body>
 </html>