首页大型更新，修正通信ui

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

@@ -0,0 +1,86 @@
+<template>
+  <div class="announcements">
+    <el-card>
+      <h2>公告</h2>
+      <el-skeleton v-if="loading" rows="3" animated />
+      <div v-else>
+        <div
+          class="announcement-item"
+          v-for="(announcement, index) in noticeList"
+          :key="index"
+          @click="openDrawer(announcement)"
+          style="cursor: pointer;"
+        >
+          <el-tooltip class="item" effect="dark" content="点击查看详情" placement="top">
+            <div style="display: flex;justify-content: space-between">
+              <span>{{ announcement.noticeTitle }}</span>
+              <span style="font-weight: 100;font-size: small">{{ announcement.createTime }}</span>
+            </div>
+
+
+          </el-tooltip>
+        </div>
+      </div>
+    </el-card>
+
+    <!--    </div>-->
+    <el-drawer
+      :title="selectNotice.noticeTitle"
+      :visible.sync="drawerVisible"
+      :with-header="true">
+      <div class="drawer-con">
+        <div style="font-size: small;font-weight: lighter">发布时间：{{selectNotice.createTime}}</div>
+        <div v-html="selectNotice.noticeContent"></div>
+      </div>
+
+    </el-drawer>
+  </div>
+</template>
+
+<script>
+import {listNoticeLimit} from "../../api/system/notice";
+
+export default {
+  name: 'Announcements',
+  props: {
+
+  },
+  data() {
+    return {
+      noticeList: [], // 存储公告数据
+      loading: true, // 加载状态
+      drawerVisible: false, // 控制Drawer显示
+      selectNotice:{}
+    };
+  },
+  methods: {
+    fetchNotices() {
+      this.loading = true;
+      // 调用接口获取公告数据
+      listNoticeLimit()
+        .then((response) => {
+          this.noticeList = response; // 假设接口返回的数据是数组
+          this.loading = false;
+        })
+    },
+    openDrawer(announcement) {
+      // 打开Drawer并设置内容
+      this.selectNotice = announcement;
+      this.drawerVisible = true;
+    },
+  },
+  mounted() {
+    this.fetchNotices(); // 组件挂载后获取数据
+  },
+};
+</script>
+
+<style scoped>
+.drawer-con{
+  padding: 10px;
+}
+
+.announcement-item {
+  margin-bottom: 5px;
+}
+</style>

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

@@ -0,0 +1,193 @@
+<template>
+  <el-card>
+    <h2>财务分析</h2>
+    <div style="display: flex; justify-content: space-between;">
+      <!-- 月度收入与支出对比柱状图 -->
+      <div id="bar-chart" style="height: 400px;width: 50%;"></div>
+
+      <!-- 年度费用分类占比饼图 -->
+      <div id="pie-chart" style="height: 400px; width: 48%; margin-top: 20px;"></div>
+    </div>
+
+    <!-- 项目活跃度堆叠条形图 -->
+    <div id="activity-chart" style="width: 100%; height: 450px; margin-top: 20px;"></div>
+  </el-card>
+</template>
+
+<script>
+import * as echarts from 'echarts';
+import {findFinanceList, listFinance, pieData} from "../../api/oa/finance";
+import {projectDataByMonthAndDate} from "../../api/oa/project";
+import loadTinymce from "../../utils/loadTinymce";
+
+export default {
+  name: 'FinancialCharts',
+  data() {
+    return {
+      // 示例数据：每个项目在不同日期的进度
+      activityData: [
+        {date: "2024-12-01", project: "项目A", progress: 5},
+        {date: "2024-12-01", project: "项目B", progress: 3},
+        {date: "2024-12-01", project: "项目C", progress: 2},
+        {date: "2024-12-02", project: "项目A", progress: 7},
+        {date: "2024-12-02", project: "项目B", progress: 4},
+        {date: "2024-12-02", project: "项目C", progress: 3},
+        {date: "2024-12-03", project: "项目A", progress: 6},
+        {date: "2024-12-03", project: "项目B", progress: 5},
+        {date: "2024-12-03", project: "项目C", progress: 3}
+      ],
+      queryFinanceParams:{
+        pageNum: 1,
+        pageSize: 9999,
+        financeType: '0',
+        projectId:0
+      }
+    };
+  },
+  mounted() {
+    this.currentBlurList()
+
+  },
+  methods: {
+
+    /**
+     * 最近六个月核算情况，如果显示更多月份，请修改控制器：int[] integers = {0,1, 2, 3, 4, 5};
+     */
+    currentBlurList() {
+      findFinanceList().then(res => {
+        this.currentList = res.data.reverse();
+        pieData(this.queryFinanceParams).then(response => {
+          this.financeListOut =response.data;
+          this.initCharts();
+        })
+
+
+      })
+
+
+
+      // 获取活动图数据
+      projectDataByMonthAndDate().then(res => {
+        this.projects = res.data;
+        this.drawActivityChart();  // 绘制项目活跃度堆叠条形图
+
+      })
+
+    },
+    // 初始化财务图表
+    initCharts() {
+      const barChart = echarts.init(document.getElementById('bar-chart'));
+      const months = this.currentList.map(item => item.onMonth);
+      const financeCome = this.currentList.map(item => parseFloat(item.financeCome));
+      const financeOut = this.currentList.map(item => parseFloat(item.financeOut));
+      const barOption = {
+        title: {text: '月度收入与支出对比', left: 'center'},
+        tooltip: {trigger: 'axis'},
+        xAxis: {
+          type: 'category',
+          data: months,
+          axisLabel: {
+            rotate: 45  // 设置X轴标签为斜体显示
+          }
+        },
+        yAxis: {
+          type: 'value',
+          axisLabel: {
+            formatter: '{value}',
+            rotate: 60  // 设置Y轴标签为斜体显示
+          }
+        },
+        series: [
+          {name: '收入', type: 'bar', data: financeCome, color: '#5470C6'},
+          {name: '支出', type: 'bar', data: financeOut, color: '#91CC75'},
+        ],
+      };
+      barChart.setOption(barOption);
+
+      const pieChart = echarts.init(document.getElementById('pie-chart'));
+      // 提取后端返回的 `detailList` 数据
+      const detailList = this.financeListOut.map(item => ({
+        name: item.outType || '其他', // 使用 financeParties 作为分类名，默认 "其他"
+        value: parseFloat(item.outMoney) || 0, // 使用 financeTitle 或默认值 0
+      }));
+
+      const pieOption = {
+        title: {text: '年度费用分类占比', left: 'center'},
+        tooltip: {trigger: 'item', formatter: '{a} <br/>{b}: {c} ({d}%)'},
+        series: [
+          {
+            name: '费用分类',
+            type: 'pie',
+            radius: '50%',
+            data: detailList,
+          },
+        ],
+      };
+      pieChart.setOption(pieOption);
+    },
+
+    // 绘制项目活跃度堆叠条形图
+    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 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;
+        })
+      }));
+
+      // 配置项
+      const option = {
+        title: {
+          text: '项目活跃度',
+          subtext: '显示每个项目的参与进度',
+          top:0,
+        },
+        grid: {
+          top: '20%', // 设置 grid 上部距离，确保有空间放置 title
+          bottom: '30%', // 保证底部有足够空间放置 legend
+        },
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {type: 'shadow'}
+        },
+        legend: {
+          align: 'left', // 对齐方式
+          itemWidth: 10, // 图例标记的宽度
+          itemHeight: 20, // 图例标记的高度
+          data: projects,
+          bottom:0
+        },
+        xAxis: {
+          type: 'category',
+          data: dates,
+        },
+        yAxis: {
+          type: 'value',
+        },
+        series: series
+      };
+
+
+      // 使用配置项
+      chart.setOption(option);
+    }
+  }
+};
+</script>
+
+<style scoped>
+#bar-chart, #pie-chart, #activity-chart {
+  width: 48%;
+  height: 400px;
+}
+</style>

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

@@ -0,0 +1,67 @@
+<template>
+  <el-card>
+    <div style="display: flex;justify-content: space-between">
+      <h2>最近出库记录</h2>
+      <el-button type="text" @click="goTarget('ware/oaOutWarehouse')">更多
+        <i class="el-icon-arrow-right"></i>
+      </el-button>
+    </div>
+
+
+    <el-skeleton v-if="loading" rows="3" animated />
+    <div v-else class="inventory-item" v-for="(item, index) in outWareHouseList" :key="index">
+      {{ item.createTime }}
+      <div>
+        项目{{item.projectName}}出库了
+        <strong>
+          {{ item.warehouseName }}
+        </strong>
+      </div>
+    </div>
+  </el-card>
+</template>
+
+<script>
+import {listOaOutWarehouse} from "../../api/oa/oaOutWarehouse";
+
+export default {
+  name: 'Inventory',
+  data() {
+    return {
+
+      queryParams:{
+        pageNum: 1,
+        pageSize: 3,
+      },
+      outWareHouseList:[],
+      loading: true
+    };
+  },
+  mounted() {
+    this.getList()
+  },
+  methods: {
+    /** 查询仓库出库列表 */
+    getList() {
+      this.loading = true;
+      listOaOutWarehouse(this.queryParams).then(res => {
+        this.outWareHouseList = res.rows
+        console.log(res.rows)
+        this.total = res.total
+        this.loading = false
+      })
+    },
+    goTarget(href) {
+      this.$router.push({ path: href});
+    },
+  }
+};
+</script>
+
+<style scoped>
+.inventory-item {
+  margin-bottom: 10px;
+  padding: 10px;
+  border-bottom: 1px solid #eee;
+}
+</style>

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

@@ -0,0 +1,65 @@
+<template>
+  <el-card>
+    <div style="display: flex;justify-content: space-between">
+      <h2>
+        正在进行中的项目
+      </h2>
+      <el-button type="text" @click="goTarget('project/project')">更多
+        <i class="el-icon-arrow-right"></i>
+      </el-button>
+    </div>
+
+    <el-skeleton v-if="loading" rows="3" animated />
+    <div v-else class="project-item" v-for="(project, index) in projects" :key="index">
+      <strong>{{ project.projectName }}</strong>
+      <div>开始日期：{{ project.beginTime }}</div>
+       <div> 负责人：{{ project.functionary }}</div>
+    </div>
+  </el-card>
+</template>
+
+<script>
+import {listProject} from "../../api/oa/project";
+
+export default {
+  name: 'ProjectManagement',
+  data() {
+    return {
+      projects: [
+
+      ],
+      queryParams: {
+        pageNum: 1,
+        pageSize: 4,
+      },
+      loading: true
+    };
+  },
+  mounted() {
+    this.getList()
+  },
+  methods: {
+    /** 查询项目管理列表 */
+    getList() {
+      this.loading = true;
+      listProject(this.queryParams).then(response => {
+        this.projects = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    //路由跳转
+    goTarget(href) {
+      this.$router.push({ path: href});
+    },
+  }
+};
+</script>
+
+<style scoped>
+.project-item {
+  margin-bottom: 10px;
+  padding: 10px;
+  border-bottom: 1px solid #eee;
+}
+</style>

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

@@ -0,0 +1,37 @@
+<template>
+  <el-card>
+    <h2>快捷入口</h2>
+    <div class="shortcut" v-for="(item, index) in shortcuts" :key="index">
+      <el-button type="primary" :icon="item.icon" @click="goTarget(item.url)">{{ item.name }}</el-button>
+    </div>
+  </el-card>
+</template>
+
+<script>
+export default {
+  name: 'QuickAccess',
+  data() {
+    return {
+      shortcuts: [
+        { name: '人员考勤' ,url:'produce/attendance',icon:'el-icon-data-line'},
+        { name: '日常财务' ,url:'finance/finance',icon:'el-icon-edit-outline'},
+        { name: '出库管理' ,url:'ware/oaOutWarehouse',icon:'el-icon-document'},
+      ]
+    };
+  },
+  methods: {
+    //路由跳转
+    goTarget(href) {
+      this.$router.push({ path: href});
+      console.log(999,href)
+    },
+
+  }
+};
+</script>
+
+<style scoped>
+.shortcut {
+  margin-bottom: 10px;
+}
+</style>