移动端加入

ruoyi-ui/src/components/FinancialCharts/index.vue

@@ -129,21 +129,30 @@ export default {
     // 绘制项目活跃度堆叠条形图
     drawActivityChart() {
       const chart = echarts.init(document.getElementById('activity-chart'));
-      console.log(this.projects)
+
       // 处理数据：转化为堆叠条形图所需的格式
-      const dates = [...new Set(this.projects.map(item => item.createTime.substring(0 ,10)))]; // 获取所有日期
+      const dates = [...new Set(this.projects.map(item => item.createTime.substring(0 ,10)))].sort(); // 获取所有日期
       const projects = [...new Set(this.projects.map(item => item.projectName))]; // 获取所有项目
 
-      // 创建数据系列：每个项目一个系列
-      const series = projects.map(project => ({
-        name: project,
-        type: 'bar',
-        stack: 'total',
-        data: dates.map(date => {
-          const progress = this.projects.find(item => item.projectName === project && item.createTime.substring(0 ,10) === date.substring(0 ,10));
-          return progress ? progress.laborCost : 0;
-        })
-      }));
+      // 创建数据系列：每个项目一个系列，颜色使用项目的 color 属性
+      const series = projects.map(projectName => {
+        const projectColor = this.projects.find(item => item.projectName === projectName)?.color || '#000'; // 默认黑色
+        return {
+          name: projectName,
+          type: 'bar',
+          stack: 'total',
+          data: dates.map(date => {
+            const progress = this.projects.find(
+              item => item.projectName === projectName && item.createTime.substring(0, 10) === date
+            );
+            return progress ? progress.laborCost : 0;
+          }),
+          itemStyle: {
+            color: projectColor, // 使用项目的颜色
+          },
+        };
+      });
+
 
       // 配置项
       const option = {