Ooder框架8步编码流程实战 - DSM组件UI统计模块深度解析

引言

在企业级应用开发中，规范的编码流程是确保项目质量和开发效率的关键。Ooder框架作为一款全栈框架，以其注解驱动的开发模式和清晰的8步编码流程，为开发者提供了高效、规范的开发体验。本文将以DSM（Domain-Specific Module）组件UI统计模块为例，详细介绍Ooder框架的8步编码流程在实际项目中的应用。

项目背景

DSM组件UI统计模块是一个用于统计和分析系统中UI组件使用情况的模块，旨在帮助开发者了解组件的使用频率、分布情况和效率，从而优化组件设计和提高开发效率。

1. 视图及元数据定义

1.1 步骤说明

第一步是定义视图及元数据。所有视图以及视图的元数据都采用枚举方式输出，确保与模块结构图形成映射。视图元数据枚举需要实现IconEnumstype接口，包含视图名称、图标、URL、描述等必要字段。

1.2 实施过程

1. 模块结构设计：根据需求，设计了以下视图结构：

   • 主统计视图：展示组件使用概况
   • 类型分布视图：展示不同类型组件的分布情况
   • 使用趋势视图：展示组件使用的时间趋势
   • 使用效率视图：展示组件的使用效率
   • 使用详情视图：展示组件使用的详细信息
   • 分类统计视图：展示组件的分类统计信息

2. 视图元数据枚举实现：

package view.stats;

import net.ooder.annotation.IconEnumstype;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

/**
 * 组件UI统计视图枚举
 * 定义组件UI统计模块的所有视图和元数据
 */
public enum ComponentUIStatsViewEnum implements IconEnumstype {
    
    // 主统计视图 - 模块：stats
    COMPONENT_STATS("组件UI统计", "ri-bar-chart-line", "/dsm/stats/component/", "组件UI使用统计分析"),
    
    // 子视图1 - 组件类型分布
    TYPE_DISTRIBUTION("组件类型分布", "ri-pie-chart-line", "/dsm/stats/component/TypeDistribution", "组件类型分布统计"),
    
    // 子视图2 - 组件使用趋势
    USAGE_TREND("使用趋势", "ri-line-chart-line", "/dsm/stats/component/UsageTrend", "组件使用趋势统计"),
    
    // 子视图3 - 组件使用效率
    USAGE_EFFICIENCY("使用效率", "ri-bar-chart-line", "/dsm/stats/component/UsageEfficiency", "组件使用效率统计"),
    
    // 子视图4 - 组件使用详情
    USAGE_DETAIL("使用详情", "ri-list-check", "/dsm/stats/component/UsageDetail", "组件使用详情列表"),
    
    // 子视图5 - 组件分类统计
    CATEGORY_STATS("分类统计", "ri-bar-chart-grouped-line", "/dsm/stats/component/CategoryStats", "组件分类统计");
    
    private final String name;          // 视图名称
    private final String imageClass;    // 图标类名
    private final String url;           // URL访问地址
    private final String description;   // 视图描述
    
    /**
     * 构造函数
     */
    ComponentUIStatsViewEnum(String name, String imageClass, String url, String description) {
        this.name = name;
        this.imageClass = imageClass;
        this.url = url;
        this.description = description;
    }
    
    // Getter方法...
    @Override
    public String getName() {
        return this.name;
    }
    
    @Override
    public String getImageClass() {
        return this.imageClass;
    }
    
    @Override
    public String getUrl() {
        return this.url;
    }
    
    @Override
    public String getDescription() {
        return this.description;
    }
    
    /**
     * 获取模块结构映射
     */
    public static Map<String, Map<String, List<ComponentUIStatsViewEnum>>> getModuleStructureMapping() {
        Map<String, Map<String, List<ComponentUIStatsViewEnum>>> moduleMapping = new HashMap<>();
        
        for (ComponentUIStatsViewEnum viewEnum : values()) {
            // 构建模块结构映射
            moduleMapping.computeIfAbsent("stats", k -> new HashMap<>());
            moduleMapping.get("stats").computeIfAbsent("component", k -> new ArrayList<>()).add(viewEnum);
        }
        
        return moduleMapping;
    }
    
    /**
     * 获取视图间关系
     */
    public static Map<ComponentUIStatsViewEnum, List<ComponentUIStatsViewEnum>> getViewRelations() {
        Map<ComponentUIStatsViewEnum, List<ComponentUIStatsViewEnum>> relations = new HashMap<>();
        
        List<ComponentUIStatsViewEnum> childViews = new ArrayList<>();
        childViews.add(TYPE_DISTRIBUTION);
        childViews.add(USAGE_TREND);
        childViews.add(USAGE_EFFICIENCY);
        childViews.add(USAGE_DETAIL);
        childViews.add(CATEGORY_STATS);
        
        relations.put(COMPONENT_STATS, childViews);
        return relations;
    }
}

2. 钩子API创建

2.1 步骤说明

第二步是创建钩子API方法，将视图与URL访问地址进行绑定，同时添加视图间关系的工作。钩子API是Ooder框架中连接视图和后端逻辑的重要桥梁。

2.2 实施过程

1. 控制器类创建：

package view.stats;

import net.ooder.config.ListResultModel;
import net.ooder.config.ResultModel;
import net.ooder.esd.annotation.ModuleAnnotation;
import net.ooder.esd.enums.ModuleViewType;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;

import java.util.*;
import java.util.stream.Collectors;

/**
 * 组件UI统计控制器
 */
@Controller
@RequestMapping("/dsm/stats/component/")
public class ComponentUIStatsController {
    
    @Autowired
    private ComponentUIStatsService componentUIStatsService;
    
    // ==================== 业务API方法 ====================
    
    /**
     * 组件类型分布统计
     */
    @PostMapping("TypeDistribution")
    @ModuleAnnotation(
        caption = "组件类型分布",
        imageClass = "ri-pie-chart-line",
        moduleViewType = ModuleViewType.FCHART
    )
    @ResponseBody
    public ListResultModel<List<ComponentStatsData>> getTypeDistribution(
            @RequestParam(required = false) String dateRange) {
        ListResultModel<List<ComponentStatsData>> result = new ListResultModel<>();
        
        try {
            // 调用服务层方法获取数据
            Map<String, Integer> distribution = componentUIStatsService.getTypeDistribution(dateRange);
            
            // 转换数据格式
            List<ComponentStatsData> dataList = distribution.entrySet().stream()
                    .map(entry -> {
                        ComponentStatsData data = new ComponentStatsData();
                        data.setType(entry.getKey());
                        data.setCount(entry.getValue());
                        data.setDescription("组件类型: " + entry.getKey());
                        return data;
                    })
                    .collect(Collectors.toList());
            
            result.setData(dataList);
            result.setSuccess(true);
            result.setMessage("组件类型分布数据获取成功");
        } catch (Exception e) {
            result.setSuccess(false);
            result.setMessage("获取组件类型分布数据失败: " + e.getMessage());
            // 记录日志
            e.printStackTrace();
        }
        
        return result;
    }
    
    /**
     * 组件使用趋势统计
     */
    @PostMapping("UsageTrend")
    @ModuleAnnotation(
        caption = "使用趋势",
        imageClass = "ri-line-chart-line",
        moduleViewType = ModuleViewType.LCHART
    )
    @ResponseBody
    public ListResultModel<List<UsageTrendData>> getUsageTrend(
            @RequestParam String period,
            @RequestParam(required = false) String dateRange) {
        ListResultModel<List<UsageTrendData>> result = new ListResultModel<>();
        
        try {
            List<UsageTrendData> trendData = componentUIStatsService.getUsageTrend(period, dateRange);
            result.setData(trendData);
            result.setSuccess(true);
            result.setMessage("组件使用趋势数据获取成功");
        } catch (Exception e) {
            result.setSuccess(false);
            result.setMessage("获取组件使用趋势数据失败: " + e.getMessage());
            e.printStackTrace();
        }
        
        return result;
    }
    
    /**
     * 组件使用效率统计
     */
    @PostMapping("UsageEfficiency")
    @ModuleAnnotation(
        caption = "使用效率",
        imageClass = "ri-bar-chart-line",
        moduleViewType = ModuleViewType.BCHART
    )
    @ResponseBody
    public ListResultModel<List<UsageEfficiencyData>> getUsageEfficiency(
            @RequestParam(required = false) String dateRange) {
        ListResultModel<List<UsageEfficiencyData>> result = new ListResultModel<>();
        
        try {
            List<UsageEfficiencyData> efficiencyData = componentUIStatsService.getUsageEfficiency(dateRange);
            result.setData(efficiencyData);
            result.setSuccess(true);
            result.setMessage("组件使用效率数据获取成功");
        } catch (Exception e) {
            result.setSuccess(false);
            result.setMessage("获取组件使用效率数据失败: " + e.getMessage());
            e.printStackTrace();
        }
        
        return result;
    }
    
    /**
     * 组件使用详情
     */
    @PostMapping("UsageDetail")
    @ModuleAnnotation(
        caption = "使用详情",
        imageClass = "ri-list-check",
        moduleViewType = ModuleViewType.TABLE
    )
    @ResponseBody
    public ResultModel<Map<String, Object>> getUsageDetail(
            @RequestParam(defaultValue = "1") int page,
            @RequestParam(defaultValue = "20") int pageSize,
            @RequestParam(required = false) Map<String, String> filters) {
        ResultModel<Map<String, Object>> result = new ResultModel<>();
        
        try {
            Map<String, Object> detailData = componentUIStatsService.getUsageDetail(page, pageSize, filters);
            result.setData(detailData);
            result.setSuccess(true);
            result.setMessage("组件使用详情数据获取成功");
        } catch (Exception e) {
            result.setSuccess(false);
            result.setMessage("获取组件使用详情数据失败: " + e.getMessage());
            e.printStackTrace();
        }
        
        return result;
    }
    
    /**
     * 组件分类统计
     */
    @PostMapping("CategoryStats")
    @ModuleAnnotation(
        caption = "分类统计",
        imageClass = "ri-bar-chart-grouped-line",
        moduleViewType = ModuleViewType.GCHART
    )
    @ResponseBody
    public ListResultModel<List<CategoryStatsData>> getCategoryStats(
            @RequestParam(required = false) String dateRange) {
        ListResultModel<List<CategoryStatsData>> result = new ListResultModel<>();
        
        try {
            Map<String, Integer> categoryStats = componentUIStatsService.getCategoryStats(dateRange);
            
            List<CategoryStatsData> dataList = categoryStats.entrySet().stream()
                    .map(entry -> {
                        CategoryStatsData data = new CategoryStatsData();
                        data.setCategory(entry.getKey());
                        data.setCount(entry.getValue());
                        return data;
                    })
                    .collect(Collectors.toList());
            
            result.setData(dataList);
            result.setSuccess(true);
            result.setMessage("组件分类统计数据获取成功");
        } catch (Exception e) {
            result.setSuccess(false);
            result.setMessage("获取组件分类统计数据失败: " + e.getMessage());
            e.printStackTrace();
        }
        
        return result;
    }
    
    // ==================== 钩子API方法 ====================
    
    /**
     * 获取视图与URL绑定关系
     */
    @GetMapping("viewUrlBindings")
    @ResponseBody
    public ResultModel<Map<String, String>> getViewUrlBindings() {
        ResultModel<Map<String, String>> result = new ResultModel<>();
        Map<String, String> bindings = new HashMap<>();
        
        for (ComponentUIStatsViewEnum viewEnum : ComponentUIStatsViewEnum.values()) {
            bindings.put(viewEnum.name(), viewEnum.getUrl());
        }
        
        result.setData(bindings);
        result.setSuccess(true);
        return result;
    }
    
    /**
     * 获取视图间关系
     */
    @GetMapping("viewRelations")
    @ResponseBody
    public ResultModel<Map<String, List<String>>> getViewRelations() {
        ResultModel<Map<String, List<String>>> result = new ResultModel<>();
        Map<String, List<String>> relations = new HashMap<>();
        
        // 获取视图间关系并转换格式
        Map<ComponentUIStatsViewEnum, List<ComponentUIStatsViewEnum>> viewRelations = 
                ComponentUIStatsViewEnum.getViewRelations();
        
        for (Map.Entry<ComponentUIStatsViewEnum, List<ComponentUIStatsViewEnum>> entry : viewRelations.entrySet()) {
            List<String> childViews = entry.getValue().stream()
                    .map(ComponentUIStatsViewEnum::name)
                    .collect(Collectors.toList());
            relations.put(entry.getKey().name(), childViews);
        }
        
        result.setData(relations);
        result.setSuccess(true);
        return result;
    }
    
    /**
     * 获取模块结构映射
     */
    @GetMapping("moduleStructure")
    @ResponseBody
    public ResultModel<Map<String, Object>> getModuleStructure() {
        ResultModel<Map<String, Object>> result = new ResultModel<>();
        Map<String, Object> moduleStructure = new HashMap<>();
        
        // 构建模块结构
        Map<String, Map<String, List<Map<String, String>>>> structure = new HashMap<>();
        
        for (ComponentUIStatsViewEnum viewEnum : ComponentUIStatsViewEnum.values()) {
            Map<String, String> viewInfo = new HashMap<>();
            viewInfo.put("name", viewEnum.getName());
            viewInfo.put("url", viewEnum.getUrl());
            viewInfo.put("description", viewEnum.getDescription());
            viewInfo.put("imageClass", viewEnum.getImageClass());
            
            structure.computeIfAbsent("stats", k -> new HashMap<>())
                    .computeIfAbsent("component", k -> new ArrayList<>())
                    .add(viewInfo);
        }
        
        moduleStructure.put("structure", structure);
        moduleStructure.put("relations", getViewRelations().getData());
        
        result.setData(moduleStructure);
        result.setSuccess(true);
        return result;
    }
    
    /**
     * 获取视图元数据
     */
    @GetMapping("viewMetadata")
    @ResponseBody
    public ListResultModel<List<Map<String, Object>>> getViewMetadata() {
        ListResultModel<List<Map<String, Object>>> result = new ListResultModel<>();
        List<Map<String, Object>> metadataList = new ArrayList<>();
        
        for (ComponentUIStatsViewEnum viewEnum : ComponentUIStatsViewEnum.values()) {
            Map<String, Object> metadata = new HashMap<>();
            metadata.put("viewName", viewEnum.name());
            metadata.put("displayName", viewEnum.getName());
            metadata.put("url", viewEnum.getUrl());
            metadata.put("description", viewEnum.getDescription());
            metadata.put("icon", viewEnum.getImageClass());
            
            // 根据视图类型设置元数据
            switch (viewEnum) {
                case TYPE_DISTRIBUTION:
                    metadata.put("chartType", "pie");
                    metadata.put("dataKeys", Arrays.asList("type", "count"));
                    break;
                case USAGE_TREND:
                    metadata.put("chartType", "line");
                    metadata.put("dataKeys", Arrays.asList("date", "usageCount", "uniqueUsers"));
                    break;
                case USAGE_EFFICIENCY:
                    metadata.put("chartType", "bar");
                    metadata.put("dataKeys", Arrays.asList("component", "usageTime", "avgLoadTime"));
                    break;
                case USAGE_DETAIL:
                    metadata.put("viewType", "table");
                    metadata.put("pagination", true);
                    metadata.put("exportable", true);
                    break;
                case CATEGORY_STATS:
                    metadata.put("chartType", "groupedBar");
                    metadata.put("dataKeys", Arrays.asList("category", "count", "usageRate"));
                    break;
                default:
                    metadata.put("viewType", "dashboard");
                    metadata.put("widgets", Arrays.asList("TYPE_DISTRIBUTION", "USAGE_TREND", "USAGE_EFFICIENCY"));
            }
            
            metadataList.add(metadata);
        }
        
        result.setData(metadataList);
        result.setSuccess(true);
        return result;
    }
    
    // 数据模型类...
    public static class ComponentStatsData {
        private String type;
        private int count;
        private String description;
        
        // Getter和setter方法
        public String getType() { return type; }
        public void setType(String type) { this.type = type; }
        public int getCount() { return count; }
        public void setCount(int count) { this.count = count; }
        public String getDescription() { return description; }
        public void setDescription(String description) { this.description = description; }
    }
    
    public static class UsageTrendData {
        private String date;
        private int usageCount;
        private int uniqueUsers;
        
        // Getter和setter方法
        public String getDate() { return date; }
        public void setDate(String date) { this.date = date; }
        public int getUsageCount() { return usageCount; }
        public void setUsageCount(int usageCount) { this.usageCount = usageCount; }
        public int getUniqueUsers() { return uniqueUsers; }
        public void setUniqueUsers(int uniqueUsers) { this.uniqueUsers = uniqueUsers; }
    }
    
    public static class UsageEfficiencyData {
        private String component;
        private long usageTime;
        private double avgLoadTime;
        
        // Getter和setter方法
        public String getComponent() { return component; }
        public void setComponent(String component) { this.component = component; }
        public long getUsageTime() { return usageTime; }
        public void setUsageTime(long usageTime) { this.usageTime = usageTime; }
        public double getAvgLoadTime() { return avgLoadTime; }
        public void setAvgLoadTime(double avgLoadTime) { this.avgLoadTime = avgLoadTime; }
    }
    
    public static class CategoryStatsData {
        private String category;
        private int count;
        
        // Getter和setter方法
        public String getCategory() { return category; }
        public void setCategory(String category) { this.category = category; }
        public int getCount() { return count; }
        public void setCount(int count) { this.count = count; }
    }
}

3. 原型验证

3.1 步骤说明

第三步是原型验证，用户通过RAD（Rapid Application Development）可视化工具检查基础原型，并进行关键参数的设定修改。

3.2 实施过程

1. RAD工具生成原型：使用Ooder RAD工具生成组件UI统计模块的基础原型，包括所有视图和API。

2. 关键参数设定：

   • 配置图表类型：饼图、折线图、柱状图等
   • 设置数据刷新频率：5分钟
   • 配置权限控制：仅管理员可访问
   • 设定数据显示格式：百分比、数字等

3. 原型确认：

   • 开发团队与业务人员一起审查原型
   • 根据反馈调整视图布局和功能
   • 确认原型符合需求

4. 仓储层开发

4.1 步骤说明

第四步是仓储层开发，完成原型确认后，撰写仓储层代码，包括service接口和impl实现类。

4.2 实施过程

1. Service接口定义：

package view.stats;

import java.util.List;
import java.util.Map;

/**
 * 组件UI统计服务接口
 */
public interface ComponentUIStatsService {
    
    /**
     * 获取组件类型分布统计
     * @param dateRange 日期范围（可选）
     * @return 组件类型分布数据
     */
    Map<String, Integer> getTypeDistribution(String dateRange);
    
    /**
     * 获取组件使用趋势统计
     * @param period 统计周期（day/week/month）
     * @param dateRange 日期范围（可选）
     * @return 组件使用趋势数据
     */
    List<ComponentUIStatsController.UsageTrendData> getUsageTrend(String period, String dateRange);
    
    /**
     * 获取组件使用效率统计
     * @param dateRange 日期范围（可选）
     * @return 组件使用效率数据
     */
    List<ComponentUIStatsController.UsageEfficiencyData> getUsageEfficiency(String dateRange);
    
    /**
     * 获取组件使用详情
     * @param page 页码
     * @param pageSize 每页大小
     * @param filters 过滤条件
     * @return 组件使用详情列表
     */
    Map<String, Object> getUsageDetail(int page, int pageSize, Map<String, String> filters);
    
    /**
     * 获取组件分类统计
     * @param dateRange 日期范围（可选）
     * @return 组件分类统计数据
     */
    Map<String, Integer> getCategoryStats(String dateRange);
    
    /**
     * 导出统计数据
     * @param exportType 导出类型（excel/csv）
     * @param dateRange 日期范围
     * @return 导出文件路径
     */
    String exportStatsData(String exportType, String dateRange);
}

2. Service实现类：

package view.stats;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.cache.annotation.Cacheable;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;

import java.util.*;
import java.util.stream.Collectors;

/**
 * 组件UI统计服务实现类
 */
@Service
@Transactional(readOnly = true)
public class ComponentUIStatsServiceImpl implements ComponentUIStatsService {
    
    @Autowired
    private ComponentRepository componentRepository;
    
    @Autowired
    private ComponentUsageRepository usageRepository;
    
    @Override
    @Cacheable(value = "componentStatsCache", key = "'typeDistribution_' + #dateRange")
    public Map<String, Integer> getTypeDistribution(String dateRange) {
        Map<String, Integer> distribution = new HashMap<>();
        
        // 根据日期范围查询数据
        List<Component> components;
        if (dateRange != null && !dateRange.isEmpty()) {
            // 解析日期范围并查询
            String[] dates = dateRange.split("-");
            components = componentRepository.findByCreateTimeBetween(
                    parseDate(dates[0]), parseDate(dates[1]));
        } else {
            components = componentRepository.findAll();
        }
        
        // 统计组件类型分布
        for (Component component : components) {
            String type = component.getType();
            distribution.put(type, distribution.getOrDefault(type, 0) + 1);
        }
        
        return distribution;
    }
    
    @Override
    @Cacheable(value = "componentStatsCache", key = "'usageTrend_' + #period + '_' + #dateRange")
    public List<ComponentUIStatsController.UsageTrendData> getUsageTrend(String period, String dateRange) {
        List<ComponentUIStatsController.UsageTrendData> trendData = new ArrayList<>();
        
        // 根据周期和日期范围查询使用记录
        List<ComponentUsage> usages;
        if (dateRange != null && !dateRange.isEmpty()) {
            String[] dates = dateRange.split("-");
            usages = usageRepository.findByUsageTimeBetween(
                    parseDate(dates[0]), parseDate(dates[1]));
        } else {
            // 默认查询最近30天
            Calendar calendar = Calendar.getInstance();
            calendar.add(Calendar.DAY_OF_MONTH, -30);
            usages = usageRepository.findByUsageTimeAfter(calendar.getTime());
        }
        
        // 按周期分组统计
        Map<String, ComponentUIStatsController.UsageTrendData> groupedData = new HashMap<>();
        
        for (ComponentUsage usage : usages) {
            String key;
            Date usageTime = usage.getUsageTime();
            
            // 根据周期生成分组键
            switch (period.toLowerCase()) {
                case "day":
                    key = formatDate(usageTime, "yyyy-MM-dd");
                    break;
                case "week":
                    key = formatDate(usageTime, "yyyy-'W'ww");
                    break;
                case "month":
                    key = formatDate(usageTime, "yyyy-MM");
                    break;
                default:
                    key = formatDate(usageTime, "yyyy-MM-dd");
            }
            
            // 更新统计数据
            ComponentUIStatsController.UsageTrendData data = groupedData.getOrDefault(key, 
                    new ComponentUIStatsController.UsageTrendData());
            data.setDate(key);
            data.setUsageCount(data.getUsageCount() + 1);
            
            // 统计独立用户数
            Set<String> users = usage.getUsers();
            data.setUniqueUsers(users != null ? users.size() : 1);
            
            groupedData.put(key, data);
        }
        
        // 转换为列表并排序
        trendData.addAll(groupedData.values());
        trendData.sort(Comparator.comparing(ComponentUIStatsController.UsageTrendData::getDate));
        
        return trendData;
    }
    
    @Override
    @Cacheable(value = "componentStatsCache", key = "'usageEfficiency_' + #dateRange")
    public List<ComponentUIStatsController.UsageEfficiencyData> getUsageEfficiency(String dateRange) {
        List<ComponentUIStatsController.UsageEfficiencyData> efficiencyData = new ArrayList<>();
        
        // 查询组件及其使用效率数据
        List<Component> components = componentRepository.findAllWithEfficiencyData(dateRange);
        
        for (Component component : components) {
            ComponentUIStatsController.UsageEfficiencyData data = 
                    new ComponentUIStatsController.UsageEfficiencyData();
            
            data.setComponent(component.getName());
            data.setUsageTime(component.getTotalUsageTime());
            data.setAvgLoadTime(component.getAverageLoadTime());
            
            efficiencyData.add(data);
        }
        
        // 按使用时间降序排序
        efficiencyData.sort((d1, d2) -> Long.compare(d2.getUsageTime(), d1.getUsageTime()));
        
        return efficiencyData;
    }
    
    @Override
    public Map<String, Object> getUsageDetail(int page, int pageSize, Map<String, String> filters) {
        Map<String, Object> result = new HashMap<>();
        
        // 构建查询条件
        List<ComponentUsage> usages;
        if (filters != null && !filters.isEmpty()) {
            // 根据过滤条件查询
            usages = usageRepository.findByFilters(filters);
        } else {
            usages = usageRepository.findAll();
        }
        
        // 分页处理
        int total = usages.size();
        int start = (page - 1) * pageSize;
        int end = Math.min(start + pageSize, total);
        
        List<ComponentUsage> paginatedUsages = new ArrayList<>();
        if (start < total) {
            paginatedUsages = usages.subList(start, end);
        }
        
        // 转换为详情数据
        List<Map<String, Object>> detailList = new ArrayList<>();
        for (ComponentUsage usage : paginatedUsages) {
            Map<String, Object> detail = new HashMap<>();
            detail.put("id", usage.getId());
            detail.put("componentName", usage.getComponent().getName());
            detail.put("componentType", usage.getComponent().getType());
            detail.put("usageTime", formatDate(usage.getUsageTime(), "yyyy-MM-dd HH:mm:ss"));
            detail.put("userCount", usage.getUsers() != null ? usage.getUsers().size() : 0);
            detail.put("pageUrl", usage.getPageUrl());
            detail.put("loadTime", usage.getLoadTime() + "ms");
            
            detailList.add(detail);
        }
        
        // 构建返回结果
        result.put("data", detailList);
        result.put("total", total);
        result.put("page", page);
        result.put("pageSize", pageSize);
        result.put("totalPages", (total + pageSize - 1) / pageSize);
        
        return result;
    }
    
    @Override
    @Cacheable(value = "componentStatsCache", key = "'categoryStats_' + #dateRange")
    public Map<String, Integer> getCategoryStats(String dateRange) {
        Map<String, Integer> categoryStats = new HashMap<>();
        
        // 查询组件分类数据
        List<Object[]> categoryData;
        if (dateRange != null && !dateRange.isEmpty()) {
            String[] dates = dateRange.split("-");
            categoryData = componentRepository.countByCategoryAndCreateTimeBetween(
                    parseDate(dates[0]), parseDate(dates[1]));
        } else {
            categoryData = componentRepository.countByCategory();
        }
        
        // 处理分类统计数据
        for (Object[] row : categoryData) {
            String category = (String) row[0];
            Long count = (Long) row[1];
            categoryStats.put(category, count.intValue());
        }
        
        return categoryStats;
    }
    
    @Override
    public String exportStatsData(String exportType, String dateRange) {
        // 实现数据导出逻辑
        // 这里简化处理，实际项目中需要生成Excel或CSV文件
        String fileName = "component_stats_" + System.currentTimeMillis();
        
        if ("excel".equalsIgnoreCase(exportType)) {
            fileName += ".xlsx";
            // 生成Excel文件
        } else {
            fileName += ".csv";
            // 生成CSV文件
        }
        
        return "/exports/" + fileName;
    }
    
    // 辅助方法
    private Date parseDate(String dateStr) {
        try {
            return new java.text.SimpleDateFormat("yyyy-MM-dd").parse(dateStr);
        } catch (Exception e) {
            return new Date();
        }
    }
    
    private String formatDate(Date date, String pattern) {
        return new java.text.SimpleDateFormat(pattern).format(date);
    }
}

5. 层间整合

5.1 步骤说明

第五步是层间整合，完成视图层、聚合层、仓储层的整合绑定。

5.2 实施过程

1. 视图层与服务层整合： 已在控制器中通过@Autowired注入服务层并调用其方法

2. 聚合层开发：

package view.stats;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import java.util.*;
import java.util.concurrent.CompletableFuture;
import java.util.concurrent.ExecutorService;
import java.util.concurrent.Executors;

/**
 * 组件UI统计聚合层服务
 */
@Service
public class ComponentUIStatsAggregationService {
    
    @Autowired
    private ComponentUIStatsService componentUIStatsService;
    
    private final ExecutorService executor = Executors.newFixedThreadPool(5);
    
    /**
     * 获取综合统计数据
     * @param dateRange 日期范围
     * @return 综合统计数据
     */
    public StatsAggregationData getStatsAggregation(String dateRange) {
        StatsAggregationData data = new StatsAggregationData();
        
        try {
            // 并行获取各维度统计数据
            CompletableFuture<Map<String, Integer>> typeDistributionFuture = 
                    CompletableFuture.supplyAsync(() -> 
                            componentUIStatsService.getTypeDistribution(dateRange), executor);
            
            CompletableFuture<List<ComponentUIStatsController.UsageTrendData>> usageTrendFuture = 
                    CompletableFuture.supplyAsync(() -> 
                            componentUIStatsService.getUsageTrend("day", dateRange), executor);
            
            CompletableFuture<List<ComponentUIStatsController.UsageEfficiencyData>> usageEfficiencyFuture = 
                    CompletableFuture.supplyAsync(() -> 
                            componentUIStatsService.getUsageEfficiency(dateRange), executor);
            
            CompletableFuture<Map<String, Integer>> categoryStatsFuture = 
                    CompletableFuture.supplyAsync(() -> 
                            componentUIStatsService.getCategoryStats(dateRange), executor);
            
            // 等待所有异步任务完成
            CompletableFuture.allOf(
                    typeDistributionFuture,
                    usageTrendFuture,
                    usageEfficiencyFuture,
                    categoryStatsFuture
            ).join();
            
            // 设置聚合数据
            data.setTypeDistribution(typeDistributionFuture.get());
            data.setUsageTrend(usageTrendFuture.get());
            data.setUsageEfficiency(usageEfficiencyFuture.get());
            data.setCategoryStats(categoryStatsFuture.get());
            
            // 计算汇总信息
            data.setTotalComponents(
                    data.getTypeDistribution().values().stream().mapToInt(Integer::intValue).sum());
            
            data.setMostUsedComponent(
                    data.getTypeDistribution().entrySet().stream()
                            .max(Map.Entry.comparingByValue())
                            .map(Map.Entry::getKey)
                            .orElse("Unknown"));
            
        } catch (Exception e) {
            // 异常处理
            e.printStackTrace();
            data.setError("获取统计数据失败: " + e.getMessage());
        }
        
        return data;
    }
    
    /**
     * 获取实时监控数据
     * @return 实时监控数据
     */
    public RealTimeMonitoringData getRealTimeMonitoring() {
        RealTimeMonitoringData monitoringData = new RealTimeMonitoringData();
        
        try {
            // 获取实时使用统计
            monitoringData.setCurrentUsers(componentUIStatsService.getCurrentUserCount());
            monitoringData.setActiveComponents(componentUIStatsService.getActiveComponentCount());
            monitoringData.setSystemLoad(componentUIStatsService.getSystemLoadAverage());
            
            // 获取最近使用记录
            monitoringData.setRecentActivities(componentUIStatsService.getRecentActivities(10));
            
        } catch (Exception e) {
            e.printStackTrace();
            monitoringData.setError("获取实时监控数据失败: " + e.getMessage());
        }
        
        return monitoringData;
    }
    
    /**
     * 综合统计数据模型
     */
    public static class StatsAggregationData {
        private Map<String, Integer> typeDistribution;
        private List<ComponentUIStatsController.UsageTrendData> usageTrend;
        private List<ComponentUIStatsController.UsageEfficiencyData> usageEfficiency;
        private Map<String, Integer> categoryStats;
        private int totalComponents;
        private String mostUsedComponent;
        private String error;
        
        // Getter和setter方法
        public Map<String, Integer> getTypeDistribution() { return typeDistribution; }
        public void setTypeDistribution(Map<String, Integer> typeDistribution) { this.typeDistribution = typeDistribution; }
        public List<ComponentUIStatsController.UsageTrendData> getUsageTrend() { return usageTrend; }
        public void setUsageTrend(List<ComponentUIStatsController.UsageTrendData> usageTrend) { this.usageTrend = usageTrend; }
        public List<ComponentUIStatsController.UsageEfficiencyData> getUsageEfficiency() { return usageEfficiency; }
        public void setUsageEfficiency(List<ComponentUIStatsController.UsageEfficiencyData> usageEfficiency) { this.usageEfficiency = usageEfficiency; }
        public Map<String, Integer> getCategoryStats() { return categoryStats; }
        public void setCategoryStats(Map<String, Integer> categoryStats) { this.categoryStats = categoryStats; }
        public int getTotalComponents() { return totalComponents; }
        public void setTotalComponents(int totalComponents) { this.totalComponents = totalComponents; }
        public String getMostUsedComponent() { return mostUsedComponent; }
        public void setMostUsedComponent(String mostUsedComponent) { this.mostUsedComponent = mostUsedComponent; }
        public String getError() { return error; }
        public void setError(String error) { this.error = error; }
    }
    
    /**
     * 实时监控数据模型
     */
    public static class RealTimeMonitoringData {
        private int currentUsers;
        private int activeComponents;
        private double systemLoad;
        private List<Map<String, Object>> recentActivities;
        private String error;
        
        // Getter和setter方法
        public int getCurrentUsers() { return currentUsers; }
        public void setCurrentUsers(int currentUsers) { this.currentUsers = currentUsers; }
        public int getActiveComponents() { return activeComponents; }
        public void setActiveComponents(int activeComponents) { this.activeComponents = activeComponents; }
        public double getSystemLoad() { return systemLoad; }
        public void setSystemLoad(double systemLoad) { this.systemLoad = systemLoad; }
        public List<Map<String, Object>> getRecentActivities() { return recentActivities; }
        public void setRecentActivities(List<Map<String, Object>> recentActivities) { this.recentActivities = recentActivities; }
        public String getError() { return error; }
        public void setError(String error) { this.error = error; }
    }
}

6. 功能调试

6.1 步骤说明

第六步是功能调试，用户通过RAD进行页面及功能调试。

6.2 实施过程

1. 调试环境准备：

   • 启动开发服务器
   • 配置数据源连接
   • 初始化测试数据

2. 页面调试：

   • 使用RAD工具调试各个视图的渲染效果
   • 调整视图布局和样式
   • 测试响应式设计

3. 功能调试：

   • 测试数据获取和展示
   • 验证图表渲染正确性
   • 测试数据刷新功能
   • 调试权限控制

4. 性能调试：

   • 测试页面加载速度
   • 优化数据查询性能
   • 调整缓存策略

7. 聚合层优化

7.1 步骤说明

第七步是聚合层优化，根据用户需求针对聚合层做进一步的完善及优化。

7.2 实施过程

1. 性能优化：

   • 添加缓存机制：使用本地缓存存储频繁访问的数据
   • 优化并行处理：调整线程池大小，提高并发处理能力
   • 减少数据库查询：合并查询，减少数据库访问次数

2. 功能完善：

   • 添加数据导出功能：支持Excel、CSV格式
   • 增加数据过滤条件：按时间、类型、状态等过滤
   • 添加数据预警功能：当组件使用率超过阈值时发送告警

3. 代码优化：

   • 重构代码结构：提高代码可读性和可维护性
   • 添加日志记录：便于问题定位和性能监控
   • 完善异常处理：提高系统稳定性

8. 代码发布

8.1 步骤说明

第八步是代码发布，辅助用户完成代码发布。

8.2 实施过程

1. 代码审查：

   • 进行代码静态分析
   • 检查代码质量指标
   • 确保代码符合公司规范

2. 构建项目：

   mvn clean package
   

3. 部署项目：

   • 将构建好的包部署到测试环境
   • 进行集成测试
   • 验证功能正常
   • 部署到生产环境

4. 发布文档：

   • 编写发布说明
   • 更新系统文档
   • 培训使用人员

实施效果

通过Ooder框架的8步编码流程，成功开发了DSM组件UI统计模块，实现了以下效果：

1. 高效开发：遵循规范的编码流程，提高了开发效率，减少了开发过程中的错误
2. 规范统一：所有代码遵循统一的规范，便于维护和扩展
3. 快速迭代：通过原型验证和功能调试，实现了快速迭代开发
4. 高质量代码：通过代码审查和测试，确保了代码质量
5. 良好的用户体验：通过RAD工具生成的原型，确保了系统符合用户需求

最佳实践

1. 视图设计：

   • 每个视图只负责一个功能
   • 设计可复用的视图组件
   • 保持视图风格的一致性

2. API设计：

   • 采用RESTful风格设计API
   • API名称应清晰表达其功能
   • 提供友好的错误信息

3. 代码生成：

   • 使用模板驱动的代码生成
   • 支持增量代码生成
   • 智能合并手动修改和自动生成的代码

4. 调试与测试：

   • 为核心功能编写单元测试
   • 测试模块间的集成
   • 使用自动化测试框架

总结

Ooder框架的8步编码流程为DSM组件UI统计模块的开发提供了清晰的指导，确保了开发过程的规范性和高效性。通过严格遵循这8个步骤，我们成功开发了一个高质量的组件UI统计模块，实现了组件使用情况的统计和分析功能。

在未来的开发中，我们将继续完善这个模块，添加更多的统计维度和分析功能，为系统的优化和改进提供数据支持。同时，我们也将继续探索Ooder框架的更多特性，提高开发效率和代码质量。

---

作者：Ooder开发团队
发布日期：2025-12-30
相关文档：

• Ooder框架8步编码流程实战指南
• Ooder规范执行计划
• 附件1：视图元数据枚举模板
• 附件2：钩子API方法模板