feat: 新增管理端工作台总览
- 新增 Dashboard 统计接口、菜单迁移与权限点 - 管理端工作台页面切换为真实概览数据和趋势图 - 默认首页切换到工作台
This commit is contained in:
@@ -0,0 +1,31 @@
|
|||||||
|
package tech.easyflow.admin.controller.dashboard;
|
||||||
|
|
||||||
|
import cn.dev33.satoken.annotation.SaCheckPermission;
|
||||||
|
import org.springframework.web.bind.annotation.GetMapping;
|
||||||
|
import org.springframework.web.bind.annotation.RequestMapping;
|
||||||
|
import org.springframework.web.bind.annotation.RestController;
|
||||||
|
import tech.easyflow.admin.model.dashboard.DashboardOverviewQuery;
|
||||||
|
import tech.easyflow.admin.model.dashboard.DashboardOverviewVo;
|
||||||
|
import tech.easyflow.admin.service.dashboard.DashboardService;
|
||||||
|
import tech.easyflow.common.domain.Result;
|
||||||
|
import tech.easyflow.common.satoken.util.SaTokenUtil;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 管理端工作台统计接口。
|
||||||
|
*/
|
||||||
|
@RestController
|
||||||
|
@RequestMapping("/api/v1/dashboard")
|
||||||
|
public class DashboardController {
|
||||||
|
|
||||||
|
private final DashboardService dashboardService;
|
||||||
|
|
||||||
|
public DashboardController(DashboardService dashboardService) {
|
||||||
|
this.dashboardService = dashboardService;
|
||||||
|
}
|
||||||
|
|
||||||
|
@GetMapping("/overview")
|
||||||
|
@SaCheckPermission("/api/v1/dashboard/query")
|
||||||
|
public Result<DashboardOverviewVo> overview(DashboardOverviewQuery query) {
|
||||||
|
return Result.ok(dashboardService.getOverview(SaTokenUtil.getLoginAccount(), query));
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,87 @@
|
|||||||
|
package tech.easyflow.admin.model.dashboard;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 工作台分布/排行项。
|
||||||
|
*/
|
||||||
|
public class DashboardDistributionItemVo {
|
||||||
|
|
||||||
|
private String key;
|
||||||
|
|
||||||
|
private String label;
|
||||||
|
|
||||||
|
private Long value;
|
||||||
|
|
||||||
|
private Long userTotal;
|
||||||
|
|
||||||
|
private Long activeUserTotal;
|
||||||
|
|
||||||
|
private Long botTotal;
|
||||||
|
|
||||||
|
private Long workflowTotal;
|
||||||
|
|
||||||
|
private Long knowledgeBaseTotal;
|
||||||
|
|
||||||
|
public String getKey() {
|
||||||
|
return key;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setKey(String key) {
|
||||||
|
this.key = key;
|
||||||
|
}
|
||||||
|
|
||||||
|
public String getLabel() {
|
||||||
|
return label;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setLabel(String label) {
|
||||||
|
this.label = label;
|
||||||
|
}
|
||||||
|
|
||||||
|
public Long getValue() {
|
||||||
|
return value;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setValue(Long value) {
|
||||||
|
this.value = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
public Long getUserTotal() {
|
||||||
|
return userTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setUserTotal(Long userTotal) {
|
||||||
|
this.userTotal = userTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
public Long getActiveUserTotal() {
|
||||||
|
return activeUserTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setActiveUserTotal(Long activeUserTotal) {
|
||||||
|
this.activeUserTotal = activeUserTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
public Long getBotTotal() {
|
||||||
|
return botTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setBotTotal(Long botTotal) {
|
||||||
|
this.botTotal = botTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
public Long getWorkflowTotal() {
|
||||||
|
return workflowTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setWorkflowTotal(Long workflowTotal) {
|
||||||
|
this.workflowTotal = workflowTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
public Long getKnowledgeBaseTotal() {
|
||||||
|
return knowledgeBaseTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setKnowledgeBaseTotal(Long knowledgeBaseTotal) {
|
||||||
|
this.knowledgeBaseTotal = knowledgeBaseTotal;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,17 @@
|
|||||||
|
package tech.easyflow.admin.model.dashboard;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 工作台统计查询参数。
|
||||||
|
*/
|
||||||
|
public class DashboardOverviewQuery {
|
||||||
|
|
||||||
|
private String range;
|
||||||
|
|
||||||
|
public String getRange() {
|
||||||
|
return range;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setRange(String range) {
|
||||||
|
this.range = range;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,60 @@
|
|||||||
|
package tech.easyflow.admin.model.dashboard;
|
||||||
|
|
||||||
|
import java.util.Date;
|
||||||
|
import java.util.List;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 工作台总览返回对象。
|
||||||
|
*/
|
||||||
|
public class DashboardOverviewVo {
|
||||||
|
|
||||||
|
private DashboardSummaryVo summary;
|
||||||
|
|
||||||
|
private List<DashboardTrendItemVo> trends;
|
||||||
|
|
||||||
|
private List<DashboardDistributionItemVo> distribution;
|
||||||
|
|
||||||
|
private DashboardOverviewQuery query;
|
||||||
|
|
||||||
|
private Date updatedAt;
|
||||||
|
|
||||||
|
public DashboardSummaryVo getSummary() {
|
||||||
|
return summary;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setSummary(DashboardSummaryVo summary) {
|
||||||
|
this.summary = summary;
|
||||||
|
}
|
||||||
|
|
||||||
|
public List<DashboardTrendItemVo> getTrends() {
|
||||||
|
return trends;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setTrends(List<DashboardTrendItemVo> trends) {
|
||||||
|
this.trends = trends;
|
||||||
|
}
|
||||||
|
|
||||||
|
public List<DashboardDistributionItemVo> getDistribution() {
|
||||||
|
return distribution;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setDistribution(List<DashboardDistributionItemVo> distribution) {
|
||||||
|
this.distribution = distribution;
|
||||||
|
}
|
||||||
|
|
||||||
|
public DashboardOverviewQuery getQuery() {
|
||||||
|
return query;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setQuery(DashboardOverviewQuery query) {
|
||||||
|
this.query = query;
|
||||||
|
}
|
||||||
|
|
||||||
|
public Date getUpdatedAt() {
|
||||||
|
return updatedAt;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setUpdatedAt(Date updatedAt) {
|
||||||
|
this.updatedAt = updatedAt;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,57 @@
|
|||||||
|
package tech.easyflow.admin.model.dashboard;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 工作台汇总指标。
|
||||||
|
*/
|
||||||
|
public class DashboardSummaryVo {
|
||||||
|
|
||||||
|
private Long userTotal;
|
||||||
|
|
||||||
|
private Long activeUserTotal;
|
||||||
|
|
||||||
|
private Long botTotal;
|
||||||
|
|
||||||
|
private Long workflowTotal;
|
||||||
|
|
||||||
|
private Long knowledgeBaseTotal;
|
||||||
|
|
||||||
|
public Long getUserTotal() {
|
||||||
|
return userTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setUserTotal(Long userTotal) {
|
||||||
|
this.userTotal = userTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
public Long getActiveUserTotal() {
|
||||||
|
return activeUserTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setActiveUserTotal(Long activeUserTotal) {
|
||||||
|
this.activeUserTotal = activeUserTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
public Long getBotTotal() {
|
||||||
|
return botTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setBotTotal(Long botTotal) {
|
||||||
|
this.botTotal = botTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
public Long getWorkflowTotal() {
|
||||||
|
return workflowTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setWorkflowTotal(Long workflowTotal) {
|
||||||
|
this.workflowTotal = workflowTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
public Long getKnowledgeBaseTotal() {
|
||||||
|
return knowledgeBaseTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setKnowledgeBaseTotal(Long knowledgeBaseTotal) {
|
||||||
|
this.knowledgeBaseTotal = knowledgeBaseTotal;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,37 @@
|
|||||||
|
package tech.easyflow.admin.model.dashboard;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 工作台趋势项。
|
||||||
|
*/
|
||||||
|
public class DashboardTrendItemVo {
|
||||||
|
|
||||||
|
private String key;
|
||||||
|
|
||||||
|
private String label;
|
||||||
|
|
||||||
|
private Long activeUserTotal;
|
||||||
|
|
||||||
|
public String getKey() {
|
||||||
|
return key;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setKey(String key) {
|
||||||
|
this.key = key;
|
||||||
|
}
|
||||||
|
|
||||||
|
public String getLabel() {
|
||||||
|
return label;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setLabel(String label) {
|
||||||
|
this.label = label;
|
||||||
|
}
|
||||||
|
|
||||||
|
public Long getActiveUserTotal() {
|
||||||
|
return activeUserTotal;
|
||||||
|
}
|
||||||
|
|
||||||
|
public void setActiveUserTotal(Long activeUserTotal) {
|
||||||
|
this.activeUserTotal = activeUserTotal;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
package tech.easyflow.admin.service.dashboard;
|
||||||
|
|
||||||
|
import tech.easyflow.admin.model.dashboard.DashboardOverviewQuery;
|
||||||
|
import tech.easyflow.admin.model.dashboard.DashboardOverviewVo;
|
||||||
|
import tech.easyflow.common.entity.LoginAccount;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 工作台统计服务。
|
||||||
|
*/
|
||||||
|
public interface DashboardService {
|
||||||
|
|
||||||
|
DashboardOverviewVo getOverview(LoginAccount loginAccount, DashboardOverviewQuery query);
|
||||||
|
}
|
||||||
@@ -0,0 +1,307 @@
|
|||||||
|
package tech.easyflow.admin.service.dashboard.impl;
|
||||||
|
|
||||||
|
import com.easyagents.flow.core.chain.ChainStatus;
|
||||||
|
import com.mybatisflex.core.query.QueryWrapper;
|
||||||
|
import com.mybatisflex.core.row.Db;
|
||||||
|
import com.mybatisflex.core.row.Row;
|
||||||
|
import org.springframework.stereotype.Service;
|
||||||
|
import org.springframework.util.StringUtils;
|
||||||
|
import tech.easyflow.admin.model.dashboard.DashboardDistributionItemVo;
|
||||||
|
import tech.easyflow.admin.model.dashboard.DashboardOverviewQuery;
|
||||||
|
import tech.easyflow.admin.model.dashboard.DashboardOverviewVo;
|
||||||
|
import tech.easyflow.admin.model.dashboard.DashboardSummaryVo;
|
||||||
|
import tech.easyflow.admin.model.dashboard.DashboardTrendItemVo;
|
||||||
|
import tech.easyflow.admin.service.dashboard.DashboardService;
|
||||||
|
import tech.easyflow.common.constant.Constants;
|
||||||
|
import tech.easyflow.common.entity.LoginAccount;
|
||||||
|
import tech.easyflow.common.web.exceptions.BusinessException;
|
||||||
|
import tech.easyflow.system.entity.SysAccountRole;
|
||||||
|
import tech.easyflow.system.entity.SysRole;
|
||||||
|
import tech.easyflow.system.service.SysAccountRoleService;
|
||||||
|
import tech.easyflow.system.service.SysRoleService;
|
||||||
|
|
||||||
|
import javax.annotation.Resource;
|
||||||
|
import java.math.BigInteger;
|
||||||
|
import java.time.LocalDate;
|
||||||
|
import java.time.LocalDateTime;
|
||||||
|
import java.time.LocalTime;
|
||||||
|
import java.time.ZoneId;
|
||||||
|
import java.time.format.DateTimeFormatter;
|
||||||
|
import java.util.ArrayList;
|
||||||
|
import java.util.Date;
|
||||||
|
import java.util.HashMap;
|
||||||
|
import java.util.List;
|
||||||
|
import java.util.Map;
|
||||||
|
import java.util.stream.Collectors;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 工作台统计服务实现。
|
||||||
|
*/
|
||||||
|
@Service
|
||||||
|
public class DashboardServiceImpl implements DashboardService {
|
||||||
|
|
||||||
|
private static final ZoneId DEFAULT_ZONE_ID = ZoneId.systemDefault();
|
||||||
|
@Resource
|
||||||
|
private SysAccountRoleService sysAccountRoleService;
|
||||||
|
@Resource
|
||||||
|
private SysRoleService sysRoleService;
|
||||||
|
|
||||||
|
@Override
|
||||||
|
public DashboardOverviewVo getOverview(LoginAccount loginAccount, DashboardOverviewQuery query) {
|
||||||
|
DashboardQueryContext context = buildContext(loginAccount, query);
|
||||||
|
|
||||||
|
DashboardSummaryVo summary = buildSummary(context);
|
||||||
|
List<DashboardTrendItemVo> trends = buildTrends(context);
|
||||||
|
List<DashboardDistributionItemVo> distribution = buildDistribution(context, summary);
|
||||||
|
|
||||||
|
DashboardOverviewVo result = new DashboardOverviewVo();
|
||||||
|
result.setSummary(summary);
|
||||||
|
result.setTrends(trends);
|
||||||
|
result.setDistribution(distribution);
|
||||||
|
|
||||||
|
DashboardOverviewQuery normalizedQuery = new DashboardOverviewQuery();
|
||||||
|
normalizedQuery.setRange(context.range);
|
||||||
|
result.setQuery(normalizedQuery);
|
||||||
|
result.setUpdatedAt(new Date());
|
||||||
|
return result;
|
||||||
|
}
|
||||||
|
|
||||||
|
private DashboardSummaryVo buildSummary(DashboardQueryContext context) {
|
||||||
|
DashboardSummaryVo summary = new DashboardSummaryVo();
|
||||||
|
summary.setUserTotal(countScopedTable("tb_sys_account", "a", true, context));
|
||||||
|
summary.setActiveUserTotal(countActiveUsers(context));
|
||||||
|
summary.setBotTotal(countScopedTable("tb_bot", "b", false, context));
|
||||||
|
summary.setWorkflowTotal(countScopedTable("tb_workflow", "w", false, context));
|
||||||
|
summary.setKnowledgeBaseTotal(countScopedTable("tb_document_collection", "d", false, context));
|
||||||
|
return summary;
|
||||||
|
}
|
||||||
|
|
||||||
|
private List<DashboardTrendItemVo> buildTrends(DashboardQueryContext context) {
|
||||||
|
List<TimeBucket> buckets = buildBuckets(context.range);
|
||||||
|
String bucketFormat = "today".equals(context.range) ? "%Y-%m-%d %H:00:00" : "%Y-%m-%d";
|
||||||
|
|
||||||
|
Map<String, Long> activeUserMap = queryActiveUserTrend(context, bucketFormat);
|
||||||
|
|
||||||
|
List<DashboardTrendItemVo> items = new ArrayList<>(buckets.size());
|
||||||
|
for (TimeBucket bucket : buckets) {
|
||||||
|
long activeUserTotal = activeUserMap.getOrDefault(bucket.key, 0L);
|
||||||
|
|
||||||
|
DashboardTrendItemVo item = new DashboardTrendItemVo();
|
||||||
|
item.setKey(bucket.key);
|
||||||
|
item.setLabel(bucket.label);
|
||||||
|
item.setActiveUserTotal(activeUserTotal);
|
||||||
|
items.add(item);
|
||||||
|
}
|
||||||
|
return items;
|
||||||
|
}
|
||||||
|
|
||||||
|
private List<DashboardDistributionItemVo> buildDistribution(DashboardQueryContext context, DashboardSummaryVo summary) {
|
||||||
|
return buildResourceDistribution(summary);
|
||||||
|
}
|
||||||
|
|
||||||
|
private List<DashboardDistributionItemVo> buildResourceDistribution(DashboardSummaryVo summary) {
|
||||||
|
List<DashboardDistributionItemVo> items = new ArrayList<>();
|
||||||
|
items.add(buildPlatformItem("userTotal", "用户总量", summary.getUserTotal()));
|
||||||
|
items.add(buildPlatformItem("activeUserTotal", "活跃用户", summary.getActiveUserTotal()));
|
||||||
|
items.add(buildPlatformItem("botTotal", "助手数量", summary.getBotTotal()));
|
||||||
|
items.add(buildPlatformItem("workflowTotal", "工作流数量", summary.getWorkflowTotal()));
|
||||||
|
items.add(buildPlatformItem("knowledgeBaseTotal", "知识库数量", summary.getKnowledgeBaseTotal()));
|
||||||
|
return items;
|
||||||
|
}
|
||||||
|
|
||||||
|
private DashboardDistributionItemVo buildPlatformItem(String key, String label, Long value) {
|
||||||
|
DashboardDistributionItemVo item = new DashboardDistributionItemVo();
|
||||||
|
item.setKey(key);
|
||||||
|
item.setLabel(label);
|
||||||
|
item.setValue(defaultLong(value));
|
||||||
|
return item;
|
||||||
|
}
|
||||||
|
|
||||||
|
private Map<String, Long> queryActiveUserTrend(DashboardQueryContext context, String bucketFormat) {
|
||||||
|
StringBuilder sql = new StringBuilder();
|
||||||
|
List<Object> params = new ArrayList<>();
|
||||||
|
|
||||||
|
sql.append("SELECT DATE_FORMAT(l.created, '").append(bucketFormat).append("') AS bucket_key, ")
|
||||||
|
.append("COUNT(DISTINCT l.account_id) AS total ")
|
||||||
|
.append("FROM tb_sys_log l ")
|
||||||
|
.append("INNER JOIN tb_sys_account a ON a.id = l.account_id AND a.is_deleted IS NULL ")
|
||||||
|
.append("WHERE l.created >= ? AND l.created < ? ");
|
||||||
|
params.add(toDate(context.startTime));
|
||||||
|
params.add(toDate(context.endTime));
|
||||||
|
appendOptionalTenantFilter(sql, params, context.tenantFilterId, "a.tenant_id");
|
||||||
|
appendOptionalDeptFilter(sql, params, context.deptFilterId, "a.dept_id");
|
||||||
|
sql.append("GROUP BY bucket_key ORDER BY bucket_key ASC");
|
||||||
|
|
||||||
|
Map<String, Long> data = new HashMap<>();
|
||||||
|
for (Row row : Db.selectListBySql(sql.toString(), params.toArray())) {
|
||||||
|
data.put(asString(row.get("bucket_key")), asLong(row.get("total")));
|
||||||
|
}
|
||||||
|
return data;
|
||||||
|
}
|
||||||
|
|
||||||
|
private long countScopedTable(String tableName, String alias, boolean containsLogicDelete, DashboardQueryContext context) {
|
||||||
|
StringBuilder sql = new StringBuilder();
|
||||||
|
List<Object> params = new ArrayList<>();
|
||||||
|
|
||||||
|
sql.append("SELECT COUNT(*) AS total FROM ").append(tableName).append(" ").append(alias).append(" WHERE 1 = 1 ");
|
||||||
|
if (containsLogicDelete) {
|
||||||
|
sql.append("AND ").append(alias).append(".is_deleted IS NULL ");
|
||||||
|
}
|
||||||
|
appendOptionalTenantFilter(sql, params, context.tenantFilterId, alias + ".tenant_id");
|
||||||
|
appendOptionalDeptFilter(sql, params, context.deptFilterId, alias + ".dept_id");
|
||||||
|
return queryForLong(sql.toString(), params);
|
||||||
|
}
|
||||||
|
|
||||||
|
private long countActiveUsers(DashboardQueryContext context) {
|
||||||
|
StringBuilder sql = new StringBuilder();
|
||||||
|
List<Object> params = new ArrayList<>();
|
||||||
|
|
||||||
|
sql.append("SELECT COUNT(DISTINCT l.account_id) AS total ")
|
||||||
|
.append("FROM tb_sys_log l ")
|
||||||
|
.append("INNER JOIN tb_sys_account a ON a.id = l.account_id AND a.is_deleted IS NULL ")
|
||||||
|
.append("WHERE l.created >= ? AND l.created < ? ");
|
||||||
|
params.add(toDate(context.startTime));
|
||||||
|
params.add(toDate(context.endTime));
|
||||||
|
appendOptionalTenantFilter(sql, params, context.tenantFilterId, "a.tenant_id");
|
||||||
|
appendOptionalDeptFilter(sql, params, context.deptFilterId, "a.dept_id");
|
||||||
|
return queryForLong(sql.toString(), params);
|
||||||
|
}
|
||||||
|
|
||||||
|
private long queryForLong(String sql, List<Object> params) {
|
||||||
|
Object result = Db.selectObject(sql, params.toArray());
|
||||||
|
return asLong(result);
|
||||||
|
}
|
||||||
|
|
||||||
|
private void appendOptionalTenantFilter(StringBuilder sql, List<Object> params, BigInteger tenantId, String columnName) {
|
||||||
|
if (tenantId != null) {
|
||||||
|
sql.append(" AND ").append(columnName).append(" = ? ");
|
||||||
|
params.add(tenantId);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private void appendOptionalDeptFilter(StringBuilder sql, List<Object> params, BigInteger deptId, String columnName) {
|
||||||
|
if (deptId != null) {
|
||||||
|
sql.append(" AND ").append(columnName).append(" = ? ");
|
||||||
|
params.add(deptId);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private DashboardQueryContext buildContext(LoginAccount loginAccount, DashboardOverviewQuery query) {
|
||||||
|
DashboardQueryContext context = new DashboardQueryContext();
|
||||||
|
context.range = normalizeRange(query == null ? null : query.getRange());
|
||||||
|
context.superAdmin = isSuperAdmin(loginAccount);
|
||||||
|
|
||||||
|
LocalDate today = LocalDate.now(DEFAULT_ZONE_ID);
|
||||||
|
if ("today".equals(context.range)) {
|
||||||
|
context.startTime = LocalDateTime.of(today, LocalTime.MIN);
|
||||||
|
context.endTime = context.startTime.plusDays(1);
|
||||||
|
} else if ("7d".equals(context.range)) {
|
||||||
|
context.startTime = LocalDateTime.of(today.minusDays(6), LocalTime.MIN);
|
||||||
|
context.endTime = LocalDateTime.of(today.plusDays(1), LocalTime.MIN);
|
||||||
|
} else {
|
||||||
|
context.startTime = LocalDateTime.of(today.minusDays(29), LocalTime.MIN);
|
||||||
|
context.endTime = LocalDateTime.of(today.plusDays(1), LocalTime.MIN);
|
||||||
|
}
|
||||||
|
|
||||||
|
context.tenantFilterId = context.superAdmin ? null : loginAccount.getTenantId();
|
||||||
|
|
||||||
|
return context;
|
||||||
|
}
|
||||||
|
|
||||||
|
private boolean isSuperAdmin(LoginAccount loginAccount) {
|
||||||
|
if (loginAccount == null || loginAccount.getId() == null) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
QueryWrapper roleMappingWrapper = QueryWrapper.create();
|
||||||
|
roleMappingWrapper.eq(SysAccountRole::getAccountId, loginAccount.getId());
|
||||||
|
List<BigInteger> roleIds = sysAccountRoleService.list(roleMappingWrapper)
|
||||||
|
.stream()
|
||||||
|
.map(SysAccountRole::getRoleId)
|
||||||
|
.collect(Collectors.toList());
|
||||||
|
if (roleIds.isEmpty()) {
|
||||||
|
return Constants.SUPER_ADMIN_ID.equals(loginAccount.getId());
|
||||||
|
}
|
||||||
|
|
||||||
|
QueryWrapper roleWrapper = QueryWrapper.create();
|
||||||
|
roleWrapper.in(SysRole::getId, roleIds);
|
||||||
|
roleWrapper.eq(SysRole::getRoleKey, Constants.SUPER_ADMIN_ROLE_CODE);
|
||||||
|
return sysRoleService.count(roleWrapper) > 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
private String normalizeRange(String range) {
|
||||||
|
if (!StringUtils.hasText(range)) {
|
||||||
|
return "7d";
|
||||||
|
}
|
||||||
|
if ("today".equals(range) || "7d".equals(range) || "30d".equals(range)) {
|
||||||
|
return range;
|
||||||
|
}
|
||||||
|
throw new BusinessException("不支持的时间范围: " + range);
|
||||||
|
}
|
||||||
|
|
||||||
|
private List<TimeBucket> buildBuckets(String range) {
|
||||||
|
List<TimeBucket> buckets = new ArrayList<>();
|
||||||
|
LocalDate today = LocalDate.now(DEFAULT_ZONE_ID);
|
||||||
|
|
||||||
|
if ("today".equals(range)) {
|
||||||
|
DateTimeFormatter keyFormatter = DateTimeFormatter.ofPattern("yyyy-MM-dd HH:00:00");
|
||||||
|
DateTimeFormatter labelFormatter = DateTimeFormatter.ofPattern("HH:00");
|
||||||
|
LocalDateTime start = LocalDateTime.of(today, LocalTime.MIN);
|
||||||
|
for (int hour = 0; hour < 24; hour++) {
|
||||||
|
LocalDateTime current = start.plusHours(hour);
|
||||||
|
buckets.add(new TimeBucket(current.format(keyFormatter), current.format(labelFormatter)));
|
||||||
|
}
|
||||||
|
return buckets;
|
||||||
|
}
|
||||||
|
|
||||||
|
int days = "7d".equals(range) ? 7 : 30;
|
||||||
|
DateTimeFormatter keyFormatter = DateTimeFormatter.ofPattern("yyyy-MM-dd");
|
||||||
|
DateTimeFormatter labelFormatter = DateTimeFormatter.ofPattern("MM-dd");
|
||||||
|
LocalDate start = today.minusDays(days - 1L);
|
||||||
|
for (int i = 0; i < days; i++) {
|
||||||
|
LocalDate current = start.plusDays(i);
|
||||||
|
buckets.add(new TimeBucket(current.format(keyFormatter), current.format(labelFormatter)));
|
||||||
|
}
|
||||||
|
return buckets;
|
||||||
|
}
|
||||||
|
|
||||||
|
private Date toDate(LocalDateTime dateTime) {
|
||||||
|
return Date.from(dateTime.atZone(DEFAULT_ZONE_ID).toInstant());
|
||||||
|
}
|
||||||
|
|
||||||
|
private long defaultLong(Long value) {
|
||||||
|
return value == null ? 0L : value;
|
||||||
|
}
|
||||||
|
|
||||||
|
private String asString(Object value) {
|
||||||
|
return value == null ? "" : String.valueOf(value);
|
||||||
|
}
|
||||||
|
|
||||||
|
private long asLong(Object value) {
|
||||||
|
if (value == null) {
|
||||||
|
return 0L;
|
||||||
|
}
|
||||||
|
if (value instanceof Number) {
|
||||||
|
return ((Number) value).longValue();
|
||||||
|
}
|
||||||
|
return Long.parseLong(String.valueOf(value));
|
||||||
|
}
|
||||||
|
|
||||||
|
private static class DashboardQueryContext {
|
||||||
|
private String range;
|
||||||
|
private BigInteger tenantFilterId;
|
||||||
|
private BigInteger deptFilterId;
|
||||||
|
private boolean superAdmin;
|
||||||
|
private LocalDateTime startTime;
|
||||||
|
private LocalDateTime endTime;
|
||||||
|
}
|
||||||
|
|
||||||
|
private static class TimeBucket {
|
||||||
|
private final String key;
|
||||||
|
private final String label;
|
||||||
|
|
||||||
|
private TimeBucket(String key, String label) {
|
||||||
|
this.key = key;
|
||||||
|
this.label = label;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,39 @@
|
|||||||
|
SET NAMES utf8mb4;
|
||||||
|
|
||||||
|
INSERT INTO `tb_sys_menu` (
|
||||||
|
`id`, `parent_id`, `menu_type`, `menu_title`, `menu_url`, `component`, `menu_icon`,
|
||||||
|
`is_show`, `permission_tag`, `sort_no`, `status`, `created`, `created_by`, `modified`, `modified_by`, `remark`
|
||||||
|
) VALUES (
|
||||||
|
366200000000000001, 0, 0, 'menus.dashboard.workspace', '/dashboard/workspace', '/dashboard/workspace/index',
|
||||||
|
'carbon:workspace', 1, '', 1, 0, '2026-03-24 10:00:00', 1, '2026-03-24 10:00:00', 1, '管理员工作台'
|
||||||
|
);
|
||||||
|
|
||||||
|
INSERT INTO `tb_sys_menu` (
|
||||||
|
`id`, `parent_id`, `menu_type`, `menu_title`, `menu_url`, `component`, `menu_icon`,
|
||||||
|
`is_show`, `permission_tag`, `sort_no`, `status`, `created`, `created_by`, `modified`, `modified_by`, `remark`
|
||||||
|
) VALUES (
|
||||||
|
366200000000000002, 366200000000000001, 1, '查询', '', '', '',
|
||||||
|
0, '/api/v1/dashboard/query', 1, 0, '2026-03-24 10:00:00', 1, '2026-03-24 10:00:00', 1, '工作台统计查询权限'
|
||||||
|
);
|
||||||
|
|
||||||
|
INSERT INTO `tb_sys_role_menu` (`id`, `role_id`, `menu_id`)
|
||||||
|
SELECT
|
||||||
|
CASE r.role_key
|
||||||
|
WHEN 'super_admin' THEN 366200000000000101
|
||||||
|
WHEN 'tenant_admin' THEN 366200000000000102
|
||||||
|
END AS `id`,
|
||||||
|
r.id AS `role_id`,
|
||||||
|
366200000000000001 AS `menu_id`
|
||||||
|
FROM `tb_sys_role` r
|
||||||
|
WHERE r.role_key IN ('super_admin', 'tenant_admin');
|
||||||
|
|
||||||
|
INSERT INTO `tb_sys_role_menu` (`id`, `role_id`, `menu_id`)
|
||||||
|
SELECT
|
||||||
|
CASE r.role_key
|
||||||
|
WHEN 'super_admin' THEN 366200000000000103
|
||||||
|
WHEN 'tenant_admin' THEN 366200000000000104
|
||||||
|
END AS `id`,
|
||||||
|
r.id AS `role_id`,
|
||||||
|
366200000000000002 AS `menu_id`
|
||||||
|
FROM `tb_sys_role` r
|
||||||
|
WHERE r.role_key IN ('super_admin', 'tenant_admin');
|
||||||
49
easyflow-ui-admin/app/src/api/dashboard.ts
Normal file
49
easyflow-ui-admin/app/src/api/dashboard.ts
Normal file
@@ -0,0 +1,49 @@
|
|||||||
|
import { requestClient } from '#/api/request';
|
||||||
|
|
||||||
|
export type DashboardRange = '7d' | '30d' | 'today';
|
||||||
|
|
||||||
|
export interface DashboardOverviewQuery {
|
||||||
|
range?: DashboardRange;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface DashboardSummary {
|
||||||
|
activeUserTotal: number;
|
||||||
|
botTotal: number;
|
||||||
|
knowledgeBaseTotal: number;
|
||||||
|
userTotal: number;
|
||||||
|
workflowTotal: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface DashboardTrendItem {
|
||||||
|
activeUserTotal: number;
|
||||||
|
key: string;
|
||||||
|
label: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface DashboardDistributionItem {
|
||||||
|
activeUserTotal: number;
|
||||||
|
botTotal: number;
|
||||||
|
key: string;
|
||||||
|
knowledgeBaseTotal: number;
|
||||||
|
label: string;
|
||||||
|
userTotal: number;
|
||||||
|
value: number;
|
||||||
|
workflowTotal: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface DashboardOverviewResponse {
|
||||||
|
distribution: DashboardDistributionItem[];
|
||||||
|
query: DashboardOverviewQuery;
|
||||||
|
summary: DashboardSummary;
|
||||||
|
trends: DashboardTrendItem[];
|
||||||
|
updatedAt: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function getDashboardOverview(params: DashboardOverviewQuery) {
|
||||||
|
return requestClient.get<DashboardOverviewResponse>(
|
||||||
|
'/api/v1/dashboard/overview',
|
||||||
|
{
|
||||||
|
params,
|
||||||
|
},
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -1,4 +1,7 @@
|
|||||||
{
|
{
|
||||||
|
"dashboard": {
|
||||||
|
"workspace": "Workspace"
|
||||||
|
},
|
||||||
"system": {
|
"system": {
|
||||||
"title": "System",
|
"title": "System",
|
||||||
"sysAccount": "Account",
|
"sysAccount": "Account",
|
||||||
|
|||||||
@@ -1,4 +1,7 @@
|
|||||||
{
|
{
|
||||||
|
"dashboard": {
|
||||||
|
"workspace": "工作台"
|
||||||
|
},
|
||||||
"system": {
|
"system": {
|
||||||
"title": "系统管理",
|
"title": "系统管理",
|
||||||
"sysAccount": "用户管理",
|
"sysAccount": "用户管理",
|
||||||
|
|||||||
@@ -1,266 +1,326 @@
|
|||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import type {
|
import type { EchartsUIType } from '@easyflow/plugins/echarts';
|
||||||
WorkbenchProjectItem,
|
|
||||||
WorkbenchQuickNavItem,
|
|
||||||
WorkbenchTodoItem,
|
|
||||||
WorkbenchTrendItem,
|
|
||||||
} from '@easyflow/common-ui';
|
|
||||||
|
|
||||||
import { ref } from 'vue';
|
import type {
|
||||||
import { useRouter } from 'vue-router';
|
DashboardOverviewQuery,
|
||||||
|
DashboardOverviewResponse,
|
||||||
|
DashboardRange,
|
||||||
|
DashboardSummary,
|
||||||
|
DashboardTrendItem,
|
||||||
|
} from '#/api/dashboard';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
AnalysisChartCard,
|
computed,
|
||||||
WorkbenchHeader,
|
nextTick,
|
||||||
WorkbenchProject,
|
onBeforeUnmount,
|
||||||
WorkbenchQuickNav,
|
onMounted,
|
||||||
WorkbenchTodo,
|
reactive,
|
||||||
WorkbenchTrends,
|
ref,
|
||||||
} from '@easyflow/common-ui';
|
} from 'vue';
|
||||||
import { preferences } from '@easyflow/preferences';
|
|
||||||
|
import { AnalysisChartCard } from '@easyflow/common-ui';
|
||||||
|
import { EchartsUI, useEcharts } from '@easyflow/plugins/echarts';
|
||||||
import { useUserStore } from '@easyflow/stores';
|
import { useUserStore } from '@easyflow/stores';
|
||||||
import { openWindow } from '@easyflow/utils';
|
|
||||||
|
|
||||||
import AnalyticsVisitsSource from '../analytics/analytics-visits-source.vue';
|
import { RefreshRight } from '@element-plus/icons-vue';
|
||||||
|
import { ElButton, ElEmpty, ElRadioButton, ElRadioGroup } from 'element-plus';
|
||||||
|
|
||||||
|
import { getDashboardOverview } from '#/api/dashboard';
|
||||||
|
|
||||||
|
interface SummaryCardItem {
|
||||||
|
label: string;
|
||||||
|
value: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
let greetingTimer: null | ReturnType<typeof setInterval> = null;
|
||||||
const userStore = useUserStore();
|
const userStore = useUserStore();
|
||||||
|
const now = ref(new Date());
|
||||||
|
|
||||||
// 这是一个示例数据,实际项目中需要根据实际情况进行调整
|
const filters = reactive<Required<DashboardOverviewQuery>>({
|
||||||
// url 也可以是内部路由,在 navTo 方法中识别处理,进行内部跳转
|
range: '7d',
|
||||||
// 例如:url: /dashboard/workspace
|
});
|
||||||
const projectItems: WorkbenchProjectItem[] = [
|
|
||||||
{
|
const overview = ref<DashboardOverviewResponse | null>(null);
|
||||||
color: '',
|
const isLoading = ref(false);
|
||||||
content: '不要等待机会,而要创造机会。',
|
const errorMessage = ref('');
|
||||||
date: '2021-04-01',
|
|
||||||
group: '开源组',
|
const trendChartRef = ref<EchartsUIType>();
|
||||||
icon: 'carbon:logo-github',
|
const { renderEcharts: renderTrendEcharts } = useEcharts(trendChartRef);
|
||||||
title: 'Github',
|
|
||||||
url: 'https://github.com',
|
const rangeOptions: Array<{ label: string; value: DashboardRange }> = [
|
||||||
},
|
{ label: '今日', value: 'today' },
|
||||||
{
|
{ label: '近 7 天', value: '7d' },
|
||||||
color: '#3fb27f',
|
{ label: '近 30 天', value: '30d' },
|
||||||
content: '现在的你决定将来的你。',
|
|
||||||
date: '2021-04-01',
|
|
||||||
group: '算法组',
|
|
||||||
icon: 'ion:logo-vue',
|
|
||||||
title: 'Vue',
|
|
||||||
url: 'https://vuejs.org',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
color: '#e18525',
|
|
||||||
content: '没有什么才能比努力更重要。',
|
|
||||||
date: '2021-04-01',
|
|
||||||
group: '上班摸鱼',
|
|
||||||
icon: 'ion:logo-html5',
|
|
||||||
title: 'Html5',
|
|
||||||
url: 'https://developer.mozilla.org/zh-CN/docs/Web/HTML',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
color: '#bf0c2c',
|
|
||||||
content: '热情和欲望可以突破一切难关。',
|
|
||||||
date: '2021-04-01',
|
|
||||||
group: 'UI',
|
|
||||||
icon: 'ion:logo-angular',
|
|
||||||
title: 'Angular',
|
|
||||||
url: 'https://angular.io',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
color: '#00d8ff',
|
|
||||||
content: '健康的身体是实现目标的基石。',
|
|
||||||
date: '2021-04-01',
|
|
||||||
group: '技术牛',
|
|
||||||
icon: 'bx:bxl-react',
|
|
||||||
title: 'React',
|
|
||||||
url: 'https://reactjs.org',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
color: '#EBD94E',
|
|
||||||
content: '路是走出来的,而不是空想出来的。',
|
|
||||||
date: '2021-04-01',
|
|
||||||
group: '架构组',
|
|
||||||
icon: 'ion:logo-javascript',
|
|
||||||
title: 'Js',
|
|
||||||
url: 'https://developer.mozilla.org/zh-CN/docs/Web/JavaScript',
|
|
||||||
},
|
|
||||||
];
|
];
|
||||||
|
|
||||||
// 同样,这里的 url 也可以使用以 http 开头的外部链接
|
const emptySummary: DashboardSummary = {
|
||||||
const quickNavItems: WorkbenchQuickNavItem[] = [
|
activeUserTotal: 0,
|
||||||
{
|
botTotal: 0,
|
||||||
color: '#1fdaca',
|
knowledgeBaseTotal: 0,
|
||||||
icon: 'ion:home-outline',
|
userTotal: 0,
|
||||||
title: '首页',
|
workflowTotal: 0,
|
||||||
url: '/',
|
};
|
||||||
},
|
|
||||||
{
|
|
||||||
color: '#bf0c2c',
|
|
||||||
icon: 'ion:grid-outline',
|
|
||||||
title: '仪表盘',
|
|
||||||
url: '/dashboard',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
color: '#e18525',
|
|
||||||
icon: 'ion:layers-outline',
|
|
||||||
title: '组件',
|
|
||||||
url: '/demos/features/icons',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
color: '#3fb27f',
|
|
||||||
icon: 'ion:settings-outline',
|
|
||||||
title: '系统管理',
|
|
||||||
url: '/demos/features/login-expired', // 这里的 URL 是示例,实际项目中需要根据实际情况进行调整
|
|
||||||
},
|
|
||||||
{
|
|
||||||
color: '#4daf1bc9',
|
|
||||||
icon: 'ion:key-outline',
|
|
||||||
title: '权限管理',
|
|
||||||
url: '/demos/access/page-control',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
color: '#00d8ff',
|
|
||||||
icon: 'ion:bar-chart-outline',
|
|
||||||
title: '图表',
|
|
||||||
url: '/analytics',
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
const todoItems = ref<WorkbenchTodoItem[]>([
|
const summary = computed(() => overview.value?.summary ?? emptySummary);
|
||||||
|
const trends = computed<DashboardTrendItem[]>(
|
||||||
|
() => overview.value?.trends ?? [],
|
||||||
|
);
|
||||||
|
|
||||||
|
const summaryCards = computed<SummaryCardItem[]>(() => [
|
||||||
|
{ label: '用户总量', value: formatCount(summary.value.userTotal) },
|
||||||
|
{ label: '活跃用户', value: formatCount(summary.value.activeUserTotal) },
|
||||||
|
{ label: '助手数量', value: formatCount(summary.value.botTotal) },
|
||||||
|
{ label: '工作流数量', value: formatCount(summary.value.workflowTotal) },
|
||||||
{
|
{
|
||||||
completed: false,
|
label: '知识库数量',
|
||||||
content: `审查最近提交到Git仓库的前端代码,确保代码质量和规范。`,
|
value: formatCount(summary.value.knowledgeBaseTotal),
|
||||||
date: '2024-07-30 11:00:00',
|
|
||||||
title: '审查前端代码提交',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
completed: true,
|
|
||||||
content: `检查并优化系统性能,降低CPU使用率。`,
|
|
||||||
date: '2024-07-30 11:00:00',
|
|
||||||
title: '系统性能优化',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
completed: false,
|
|
||||||
content: `进行系统安全检查,确保没有安全漏洞或未授权的访问。 `,
|
|
||||||
date: '2024-07-30 11:00:00',
|
|
||||||
title: '安全检查',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
completed: false,
|
|
||||||
content: `更新项目中的所有npm依赖包,确保使用最新版本。`,
|
|
||||||
date: '2024-07-30 11:00:00',
|
|
||||||
title: '更新项目依赖',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
completed: false,
|
|
||||||
content: `修复用户报告的页面UI显示问题,确保在不同浏览器中显示一致。 `,
|
|
||||||
date: '2024-07-30 11:00:00',
|
|
||||||
title: '修复UI显示问题',
|
|
||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
const trendItems: WorkbenchTrendItem[] = [
|
|
||||||
{
|
|
||||||
avatar: 'svg:avatar-1',
|
|
||||||
content: `在 <a>开源组</a> 创建了项目 <a>Vue</a>`,
|
|
||||||
date: '刚刚',
|
|
||||||
title: '威廉',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
avatar: 'svg:avatar-2',
|
|
||||||
content: `关注了 <a>威廉</a> `,
|
|
||||||
date: '1个小时前',
|
|
||||||
title: '艾文',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
avatar: 'svg:avatar-3',
|
|
||||||
content: `发布了 <a>个人动态</a> `,
|
|
||||||
date: '1天前',
|
|
||||||
title: '克里斯',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
avatar: 'svg:avatar-4',
|
|
||||||
content: `发表文章 <a>如何编写一个Vite插件</a> `,
|
|
||||||
date: '2天前',
|
|
||||||
title: 'EasyFlow',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
avatar: 'svg:avatar-1',
|
|
||||||
content: `回复了 <a>杰克</a> 的问题 <a>如何进行项目优化?</a>`,
|
|
||||||
date: '3天前',
|
|
||||||
title: '皮特',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
avatar: 'svg:avatar-2',
|
|
||||||
content: `关闭了问题 <a>如何运行项目</a> `,
|
|
||||||
date: '1周前',
|
|
||||||
title: '杰克',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
avatar: 'svg:avatar-3',
|
|
||||||
content: `发布了 <a>个人动态</a> `,
|
|
||||||
date: '1周前',
|
|
||||||
title: '威廉',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
avatar: 'svg:avatar-4',
|
|
||||||
content: `推送了代码到 <a>Github</a>`,
|
|
||||||
date: '2021-04-01 20:00',
|
|
||||||
title: '威廉',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
avatar: 'svg:avatar-4',
|
|
||||||
content: `发表文章 <a>如何编写使用 Admin EasyFlow</a> `,
|
|
||||||
date: '2021-03-01 20:00',
|
|
||||||
title: 'EasyFlow',
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
const router = useRouter();
|
const updatedAtText = computed(() => {
|
||||||
|
if (!overview.value?.updatedAt) {
|
||||||
// 这是一个示例方法,实际项目中需要根据实际情况进行调整
|
return '尚未获取';
|
||||||
// This is a sample method, adjust according to the actual project requirements
|
|
||||||
function navTo(nav: WorkbenchProjectItem | WorkbenchQuickNavItem) {
|
|
||||||
if (nav.url?.startsWith('http')) {
|
|
||||||
openWindow(nav.url);
|
|
||||||
return;
|
|
||||||
}
|
}
|
||||||
if (nav.url?.startsWith('/')) {
|
return formatDateTime(overview.value.updatedAt);
|
||||||
router.push(nav.url).catch((error) => {
|
});
|
||||||
console.error('Navigation failed:', error);
|
|
||||||
|
const displayName = computed(() => {
|
||||||
|
return (
|
||||||
|
userStore.userInfo?.nickname?.trim() ||
|
||||||
|
userStore.userInfo?.loginName?.trim() ||
|
||||||
|
'同学'
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
const greetingText = computed(() => {
|
||||||
|
const hour = now.value.getHours();
|
||||||
|
if (hour < 11) {
|
||||||
|
return '上午好';
|
||||||
|
}
|
||||||
|
if (hour < 14) {
|
||||||
|
return '中午好';
|
||||||
|
}
|
||||||
|
if (hour < 18) {
|
||||||
|
return '下午好';
|
||||||
|
}
|
||||||
|
return '晚上好';
|
||||||
|
});
|
||||||
|
|
||||||
|
const greetingTitle = computed(
|
||||||
|
() => `${greetingText.value},${displayName.value}`,
|
||||||
|
);
|
||||||
|
|
||||||
|
async function loadOverview() {
|
||||||
|
isLoading.value = true;
|
||||||
|
errorMessage.value = '';
|
||||||
|
|
||||||
|
try {
|
||||||
|
const data = await getDashboardOverview({
|
||||||
|
range: filters.range,
|
||||||
});
|
});
|
||||||
} else {
|
overview.value = data;
|
||||||
console.warn(`Unknown URL for navigation item: ${nav.title} -> ${nav.url}`);
|
await renderCharts();
|
||||||
|
} catch (error) {
|
||||||
|
overview.value = null;
|
||||||
|
errorMessage.value =
|
||||||
|
(error as Error)?.message || '工作台数据加载失败,请稍后重试。';
|
||||||
|
} finally {
|
||||||
|
isLoading.value = false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function renderCharts() {
|
||||||
|
await nextTick();
|
||||||
|
renderTrendChart();
|
||||||
|
}
|
||||||
|
|
||||||
|
function renderTrendChart() {
|
||||||
|
const xAxisData = trends.value.map((item) => item.label);
|
||||||
|
const activeUserData = trends.value.map((item) => item.activeUserTotal);
|
||||||
|
|
||||||
|
renderTrendEcharts({
|
||||||
|
color: ['hsl(var(--primary))'],
|
||||||
|
grid: {
|
||||||
|
bottom: 18,
|
||||||
|
containLabel: true,
|
||||||
|
left: 12,
|
||||||
|
right: 12,
|
||||||
|
top: 24,
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
itemGap: 18,
|
||||||
|
top: 0,
|
||||||
|
},
|
||||||
|
tooltip: {
|
||||||
|
trigger: 'axis',
|
||||||
|
},
|
||||||
|
xAxis: {
|
||||||
|
axisLine: {
|
||||||
|
lineStyle: {
|
||||||
|
color: 'hsl(var(--border))',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
data: xAxisData,
|
||||||
|
type: 'category',
|
||||||
|
},
|
||||||
|
yAxis: {
|
||||||
|
axisLine: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
splitLine: {
|
||||||
|
lineStyle: {
|
||||||
|
color: 'hsl(var(--border))',
|
||||||
|
type: 'dashed',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
type: 'value',
|
||||||
|
},
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
data: activeUserData,
|
||||||
|
name: '活跃用户',
|
||||||
|
smooth: true,
|
||||||
|
symbolSize: 8,
|
||||||
|
type: 'line',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleRangeChange(value: boolean | number | string | undefined) {
|
||||||
|
if (value !== 'today' && value !== '7d' && value !== '30d') {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
filters.range = value;
|
||||||
|
void loadOverview();
|
||||||
|
}
|
||||||
|
|
||||||
|
function formatCount(value?: number) {
|
||||||
|
return Number(value || 0).toLocaleString('zh-CN');
|
||||||
|
}
|
||||||
|
|
||||||
|
function formatDateTime(value: string) {
|
||||||
|
const date = new Date(value);
|
||||||
|
if (Number.isNaN(date.getTime())) {
|
||||||
|
return value;
|
||||||
|
}
|
||||||
|
return date.toLocaleString('zh-CN', {
|
||||||
|
hour12: false,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(async () => {
|
||||||
|
greetingTimer = setInterval(() => {
|
||||||
|
now.value = new Date();
|
||||||
|
}, 60 * 1000);
|
||||||
|
await loadOverview();
|
||||||
|
});
|
||||||
|
|
||||||
|
onBeforeUnmount(() => {
|
||||||
|
if (greetingTimer) {
|
||||||
|
clearInterval(greetingTimer);
|
||||||
|
greetingTimer = null;
|
||||||
|
}
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="p-5">
|
<div class="space-y-6 px-5 pb-5 pt-1">
|
||||||
<WorkbenchHeader
|
<section>
|
||||||
:avatar="userStore.userInfo?.avatar || preferences.app.defaultAvatar"
|
<div
|
||||||
>
|
class="flex flex-col gap-4 lg:flex-row lg:items-start lg:justify-between"
|
||||||
<template #title>
|
>
|
||||||
早安, {{ userStore.userInfo?.realName }}, 开始您一天的工作吧!
|
<div>
|
||||||
</template>
|
<div class="text-3xl font-semibold tracking-tight lg:text-4xl">
|
||||||
<template #description> 今日晴,20℃ - 32℃! </template>
|
{{ greetingTitle }}
|
||||||
</WorkbenchHeader>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="flex flex-col gap-3 sm:flex-row sm:flex-wrap sm:items-center sm:justify-end"
|
||||||
|
>
|
||||||
|
<ElRadioGroup
|
||||||
|
:model-value="filters.range"
|
||||||
|
size="default"
|
||||||
|
@update:model-value="handleRangeChange"
|
||||||
|
>
|
||||||
|
<ElRadioButton
|
||||||
|
v-for="item in rangeOptions"
|
||||||
|
:key="item.value"
|
||||||
|
:value="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
>
|
||||||
|
{{ item.label }}
|
||||||
|
</ElRadioButton>
|
||||||
|
</ElRadioGroup>
|
||||||
|
|
||||||
<div class="mt-5 flex flex-col lg:flex-row">
|
<ElButton :icon="RefreshRight" @click="loadOverview">刷新</ElButton>
|
||||||
<div class="mr-4 w-full lg:w-3/5">
|
</div>
|
||||||
<WorkbenchProject :items="projectItems" title="项目" @click="navTo" />
|
|
||||||
<WorkbenchTrends :items="trendItems" class="mt-5" title="最新动态" />
|
|
||||||
</div>
|
</div>
|
||||||
<div class="w-full lg:w-2/5">
|
|
||||||
<WorkbenchQuickNav
|
<div class="text-muted-foreground mt-4 text-sm">
|
||||||
:items="quickNavItems"
|
最新更新时间:{{ updatedAtText }}
|
||||||
class="mt-5 lg:mt-0"
|
</div>
|
||||||
title="快捷导航"
|
</section>
|
||||||
@click="navTo"
|
|
||||||
/>
|
<section
|
||||||
<WorkbenchTodo :items="todoItems" class="mt-5" title="待办事项" />
|
v-if="isLoading && !overview"
|
||||||
<AnalysisChartCard class="mt-5" title="访问来源">
|
class="grid gap-4 md:grid-cols-2 xl:grid-cols-4"
|
||||||
<AnalyticsVisitsSource />
|
>
|
||||||
|
<div
|
||||||
|
v-for="item in 8"
|
||||||
|
:key="item"
|
||||||
|
class="border-border bg-muted/50 h-28 animate-pulse rounded-3xl border"
|
||||||
|
></div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section
|
||||||
|
v-else-if="errorMessage"
|
||||||
|
class="border-border bg-card rounded-3xl border border-dashed p-10"
|
||||||
|
>
|
||||||
|
<ElEmpty description="工作台加载失败">
|
||||||
|
<template #default>
|
||||||
|
<div class="space-y-3 text-center">
|
||||||
|
<p class="text-muted-foreground text-sm">{{ errorMessage }}</p>
|
||||||
|
<ElButton type="primary" @click="loadOverview">重新加载</ElButton>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</ElEmpty>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<template v-else>
|
||||||
|
<section class="grid gap-4 sm:grid-cols-2 xl:grid-cols-5">
|
||||||
|
<div
|
||||||
|
v-for="item in summaryCards"
|
||||||
|
:key="item.label"
|
||||||
|
class="border-border/70 bg-card rounded-3xl border px-5 py-5 transition-all duration-200 hover:-translate-y-0.5 hover:shadow-sm"
|
||||||
|
>
|
||||||
|
<div class="text-muted-foreground text-xs font-medium">
|
||||||
|
{{ item.label }}
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="text-foreground mt-3 text-3xl font-semibold tracking-tight"
|
||||||
|
>
|
||||||
|
{{ item.value }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section>
|
||||||
|
<AnalysisChartCard title="趋势变化">
|
||||||
|
<div class="space-y-2">
|
||||||
|
<p class="text-muted-foreground text-sm">
|
||||||
|
观察活跃用户在所选时间范围内的变化趋势。
|
||||||
|
</p>
|
||||||
|
<EchartsUI ref="trendChartRef" height="360px" />
|
||||||
|
</div>
|
||||||
</AnalysisChartCard>
|
</AnalysisChartCard>
|
||||||
</div>
|
</section>
|
||||||
</div>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -19,7 +19,7 @@ const defaultPreferences: Preferences = {
|
|||||||
contentPaddingTop: 0,
|
contentPaddingTop: 0,
|
||||||
defaultAvatar:
|
defaultAvatar:
|
||||||
'https://unpkg.com/@easyflow/static-source@0.1.7/source/avatar-v1.webp',
|
'https://unpkg.com/@easyflow/static-source@0.1.7/source/avatar-v1.webp',
|
||||||
defaultHomePath: '/ai/bots',
|
defaultHomePath: '/dashboard/workspace',
|
||||||
dynamicTitle: true,
|
dynamicTitle: true,
|
||||||
enableCheckUpdates: true,
|
enableCheckUpdates: true,
|
||||||
enablePreferences: true,
|
enablePreferences: true,
|
||||||
|
|||||||
Reference in New Issue
Block a user