GuangYu/QuestionProject
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Replace dashboard date range picker

Browse Source
This commit is contained in:
Nelson
2026-07-09 15:11:24 +08:00
parent 0b0ff6b9dc
commit 769bd2b7b4
2 changed files with 24 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
ai_knowledge_base_v2/apps/admin-web/src/App.vue
View File

@@ -23,7 +23,10 @@ const loading = ref(false);
const loginForm = reactive({ username: "admin", password: "admin123456" }); const loginForm = reactive({ username: "admin", password: "admin123456" });
const stats = ref<DashboardStats | null>(null); const stats = ref<DashboardStats | null>(null);
const dashboardDateRange = ref<[string, string] | null>(null); const dashboardFilters = reactive({
start: "",
end: "",
});
const users = ref<AdminUser[]>([]); const users = ref<AdminUser[]>([]);
const userKeyword = ref(""); const userKeyword = ref("");
const knowledge = ref<KnowledgeItem[]>([]); const knowledge = ref<KnowledgeItem[]>([]);
@@ -504,8 +507,7 @@ async function switchMenu(menu: string) {
} }
async function loadDashboard() { async function loadDashboard() {
const [start, end] = dashboardDateRange.value ?? ["", ""]; stats.value = await api.dashboard(dashboardFilters.start, dashboardFilters.end);
stats.value = await api.dashboard(start, end);
} }
async function loadCurrentMenu() { async function loadCurrentMenu() {
@@ -1110,15 +1112,17 @@ function formatRecordDateTime(value: string, boundary: "start" | "end") {
<template v-if="activeMenu === 'dashboard'"> <template v-if="activeMenu === 'dashboard'">
<div class="page-head inline"> <div class="page-head inline">
<div><h2>数据看板</h2><p>核心业务数据概览。</p></div> <div><h2>数据看板</h2><p>核心业务数据概览。</p></div>
<el-date-picker <div class="dashboard-date-range" aria-label="看板日期范围">
v-model="dashboardDateRange" <label class="record-date-field dashboard-date-field">
type="daterange" <span>开始日期</span>
range-separator="至" <input v-model="dashboardFilters.start" type="date" aria-label="开始日期" @change="loadDashboard" />
start-placeholder="开始日期" </label>
end-placeholder="结束日期" <span class="record-date-sep">至</span>
value-format="YYYY-MM-DD" <label class="record-date-field dashboard-date-field">
@change="loadDashboard" <span>结束日期</span>
/> <input v-model="dashboardFilters.end" type="date" aria-label="结束日期" @change="loadDashboard" />
</label>
</div>
</div> </div>
<div class="stats-grid"> <div class="stats-grid">
<div class="stat"><span>用户数</span><strong>{{ stats?.userCount ?? 0 }}</strong></div> <div class="stat"><span>用户数</span><strong>{{ stats?.userCount ?? 0 }}</strong></div>

8
ai_knowledge_base_v2/apps/admin-web/src/styles.css
View File

@@ -256,12 +256,20 @@ textarea {
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
gap: 16px; gap: 16px;
flex-wrap: wrap;
} }
.page-head.inline .el-input { .page-head.inline .el-input {
width: 260px; width: 260px;
} }
.dashboard-date-range {
display: flex;
flex-wrap: nowrap;
gap: 8px;
align-items: center;
}
.stats-grid { .stats-grid {
display: grid; display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-columns: repeat(4, minmax(0, 1fr));