From 769bd2b7b423183fa14b05f9feb7ec02b6410dae Mon Sep 17 00:00:00 2001
From: Nelson <1475262689@qq.com>
Date: Thu, 9 Jul 2026 15:11:24 +0800
Subject: [PATCH] Replace dashboard date range picker

---
 .../apps/admin-web/src/App.vue                | 28 +++++++++++--------
 .../apps/admin-web/src/styles.css             |  8 ++++++
 2 files changed, 24 insertions(+), 12 deletions(-)

diff --git a/ai_knowledge_base_v2/apps/admin-web/src/App.vue b/ai_knowledge_base_v2/apps/admin-web/src/App.vue
index 1bb6d0e..7507af5 100644
--- a/ai_knowledge_base_v2/apps/admin-web/src/App.vue
+++ b/ai_knowledge_base_v2/apps/admin-web/src/App.vue
@@ -23,7 +23,10 @@ const loading = ref(false);
 
 const loginForm = reactive({ username: "admin", password: "admin123456" });
 const stats = ref<DashboardStats | null>(null);
-const dashboardDateRange = ref<[string, string] | null>(null);
+const dashboardFilters = reactive({
+  start: "",
+  end: "",
+});
 const users = ref<AdminUser[]>([]);
 const userKeyword = ref("");
 const knowledge = ref<KnowledgeItem[]>([]);
@@ -504,8 +507,7 @@ async function switchMenu(menu: string) {
 }
 
 async function loadDashboard() {
-  const [start, end] = dashboardDateRange.value ?? ["", ""];
-  stats.value = await api.dashboard(start, end);
+  stats.value = await api.dashboard(dashboardFilters.start, dashboardFilters.end);
 }
 
 async function loadCurrentMenu() {
@@ -1110,15 +1112,17 @@ function formatRecordDateTime(value: string, boundary: "start" | "end") {
         <template v-if="activeMenu === 'dashboard'">
           <div class="page-head inline">
             <div><h2>数据看板</h2><p>核心业务数据概览。</p></div>
-            <el-date-picker
-              v-model="dashboardDateRange"
-              type="daterange"
-              range-separator="至"
-              start-placeholder="开始日期"
-              end-placeholder="结束日期"
-              value-format="YYYY-MM-DD"
-              @change="loadDashboard"
-            />
+            <div class="dashboard-date-range" aria-label="看板日期范围">
+              <label class="record-date-field dashboard-date-field">
+                <span>开始日期</span>
+                <input v-model="dashboardFilters.start" type="date" aria-label="开始日期" @change="loadDashboard" />
+              </label>
+              <span class="record-date-sep">至</span>
+              <label class="record-date-field dashboard-date-field">
+                <span>结束日期</span>
+                <input v-model="dashboardFilters.end" type="date" aria-label="结束日期" @change="loadDashboard" />
+              </label>
+            </div>
           </div>
           <div class="stats-grid">
             <div class="stat"><span>用户数</span><strong>{{ stats?.userCount ?? 0 }}</strong></div>
diff --git a/ai_knowledge_base_v2/apps/admin-web/src/styles.css b/ai_knowledge_base_v2/apps/admin-web/src/styles.css
index 0c1c7df..1b116d0 100644
--- a/ai_knowledge_base_v2/apps/admin-web/src/styles.css
+++ b/ai_knowledge_base_v2/apps/admin-web/src/styles.css
@@ -256,12 +256,20 @@ textarea {
   align-items: center;
   justify-content: space-between;
   gap: 16px;
+  flex-wrap: wrap;
 }
 
 .page-head.inline .el-input {
   width: 260px;
 }
 
+.dashboard-date-range {
+  display: flex;
+  flex-wrap: nowrap;
+  gap: 8px;
+  align-items: center;
+}
+
 .stats-grid {
   display: grid;
   grid-template-columns: repeat(4, minmax(0, 1fr));