src/api/login.js

@@ -57,4 +57,23 @@
    method: 'post',
    data: data
  })
}


// æŸ¥è¯¢å…¬å‘Šåˆ—表
export function listNotice(query) {
  return request({
    url: '/system/notice/list',
    method: 'get',
    params: query
  })
}

// èŽ·å–未读消息数量
export function getNoticeCount(consigneeId) {
  return request({
    url: '/system/notice/getCount',
    method: 'get',
    params: { consigneeId }
  })
}

 src/api/menu.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,9 @@
import request from '@/utils/request'

// èŽ·å–路由
export const getRouters = () => {
  return request({
    url: '/getRouters',
    method: 'get'
  })
}

 src/api/personnelManagement/attendance.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,26 @@
import request from '@/utils/request'


export function createPersonalAttendanceRecord(params) {
    return request({
        url: "/personalAttendanceRecords",
        method: "post",
        data: params,
    });
}

export function findPersonalAttendanceRecords(query) {
    return request({
        url: "/personalAttendanceRecords/listPage",
        method: "get",
        params: query,
    });
}

export function findTodayPersonalAttendanceRecord(query) {
    return request({
        url: "/personalAttendanceRecords/today",
        method: "get",
        params: query,
    });
}

 src/api/personnelManagement/monthlyStatistics.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,65 @@
import request from "@/utils/request";

// äººå‘˜è–ªèµ„台账列表
export function monthlyStatisticsListPage(query) {
  return request({
    url: "/compensationPerformance/listPage",
    method: "get",
    params: query,
  });
}

// äººå‘˜è–ªèµ„台账详情
export function monthlyStatisticsGet(id) {
  return request({
    url: "/monthlyStatistics/get",
    method: "get",
    params: { id },
  });
}

// æ–°å¢žäººå‘˜è–ªèµ„台账
export function monthlyStatisticsAdd(data) {
  return request({
    url: "/compensationPerformance/add",
    method: "post",
    data,
  });
}

// ç¼–辑人员薪资台账
export function monthlyStatisticsUpdate(data) {
  return request({
    url: "/compensationPerformance/update",
    method: "post",
    data,
  });
}

// åˆ é™¤äººå‘˜è–ªèµ„台账
export function monthlyStatisticsDelete(ids) {
  return request({
    url: "/compensationPerformance/delete",
    method: "delete",
    data: ids,
  });
}

// å¯¼å‡ºäººå‘˜è–ªèµ„台账
export function monthlyStatisticsExport(query) {
  return request({
    url: "/compensationPerformance/export",
    method: "get",
    params: query,
    responseType: "blob",
  });
}

// äººå‘˜åˆ—表
export function staffOnJobList(query) {
  return request({
    url: "/staff/staffOnJob/list",
    method: "get",
    params: query,
  });
}

 src/pages.json

@@ -312,7 +312,7 @@
    {
      "path": "pages/cooperativeOffice/collaborativeApproval/index7",
      "style": {
        "navigationBarTitleText": "出库管理",
        "navigationBarTitleText": "发货审批",
        "navigationStyle": "custom"
      }
    },
@@ -671,7 +671,7 @@
    {
      "path": "pages/safeProduction/safeQualifications/index",
      "style": {
        "navigationBarTitleText": "规程资质",
        "navigationBarTitleText": "规程与资质",
        "navigationStyle": "custom"
      }
    },
@@ -783,7 +783,7 @@
    {
      "path": "pages/safeProduction/hazardousMaterialsControl/index",
      "style": {
        "navigationBarTitleText": "危险物料",
        "navigationBarTitleText": "危险物料管控",
        "navigationStyle": "custom"
      }
    },
@@ -858,17 +858,37 @@
      }
    },
    {
      "path": "pages/attendance/checkin",
      "path": "pages/humanResources/attendance/checkin",
      "style": {
        "navigationBarTitleText": "打卡签到",
        "navigationStyle": "custom"
      }
    },
    {
      "path": "pages/attendance/report",
      "path": "pages/humanResources/attendance/report",
      "style": {
        "navigationBarTitleText": "考勤日报",
        "navigationStyle": "custom"
      }
    },
    {
      "path": "pages/humanResources/monthlyStatistics/index",
      "style": {
        "navigationBarTitleText": "薪资台账",
        "navigationStyle": "custom"
      }
    },
    {
      "path": "pages/humanResources/monthlyStatistics/detail",
      "style": {
        "navigationBarTitleText": "薪资台账详情",
        "navigationStyle": "custom"
      }
    },
    {
      "path": "pages/message",
      "style": {
        "navigationBarTitleText": "消息中心"
      }
    }
  ],
@@ -1082,6 +1102,12 @@
        "text": "首页"
      },
      {
        "pagePath": "pages/message",
        "iconPath": "static/images/tabbar/work.png",
        "selectedIconPath": "static/images/tabbar/work_.png",
        "text": "消息"
      },
      {
        "pagePath": "pages/mine",
        "iconPath": "static/images/tabbar/mine.png",
        "selectedIconPath": "static/images/tabbar/mine_.png",

 src/pages/cooperativeOffice/collaborativeApproval/index.vue

@@ -157,8 +157,8 @@
      4: "报销管理",
      5: "采购管理",
      6: "报价管理",
      7: "出库管理",
      8: "危险作业管理",
      7: "发货审批",
      8: "危险作业审批",
    };
    return titleMap[type] || "审批管理";
  };

 src/pages/humanResources/attendance/checkin.vue

ÎļþÃû´Ó src/pages/attendance/checkin.vue ÐÞ¸Ä
@@ -14,14 +14,14 @@
          <u-icon name="calendar"
                  color="#348fe2"
                  size="16"></u-icon>
          <text class="shift-text">白班: 09:00-18:00</text>
          <text class="shift-text">白班: {{ workTimeDict.startAt }}-{{ workTimeDict.endAt }}</text>
        </view>
      </view>
      <!-- æ‰“卡按钮 -->
      <view class="checkin-button-container">
        <view class="checkin-button-wrapper">
          <view class="checkin-button"
                :class="{ 'disabled': checkInOutText === '已打卡' }"
                :class="{ 'disabled': todayRecord.workEndAt }"
                @click="handleCheckInOut">
            <text class="checkin-button-text">{{ checkInOutText }}</text>
            <text class="checkin-time">{{ nowTime.split(' ')[1] }}</text>
@@ -41,53 +41,53 @@
      <view class="employee-info">
        <view class="info-item">
          <text class="info-label">部门</text>
          <text class="info-value">{{ currentUser.dept }}</text>
          <text class="info-value">{{ todayRecord.deptName || '-' }}</text>
        </view>
        <view class="info-item">
          <text class="info-label">姓名</text>
          <text class="info-value">{{ currentUser.name }}</text>
          <text class="info-value">{{ todayRecord.staffName || '-' }}</text>
        </view>
        <view class="info-item">
          <text class="info-label">工号</text>
          <text class="info-value">{{ currentUser.no }}</text>
          <text class="info-value">{{ todayRecord.staffNo || '-' }}</text>
        </view>
      </view>
      <!-- ä»Šæ—¥è€ƒå‹¤çŠ¶æ€ -->
      <view class="today-status">
        <u-icon :name="todayRecord ? 'checkmark-circle' : 'close-circle'"
                :color="todayRecord ? '#4cd964' : '#ff3b30'"
        <u-icon :name="todayRecord.id ? 'checkmark-circle' : 'close-circle'"
                :color="todayRecord.id ? '#4cd964' : '#ff3b30'"
                size="16"></u-icon>
        <text class="status-text">
          {{ todayRecord ? `今日考勤: ä¸Šç­ ${todayRecord.checkInTime}` : '今日未打卡' }}
          {{ todayRecord.id ? `今日考勤: ä¸Šç­ ${todayRecord.workStartAt || '-'}` : '今日未打卡' }}
        </text>
      </view>
      <!-- ä¸‹ç­è€ƒå‹¤çŠ¶æ€ -->
      <view v-if="todayRecord && todayRecord.checkOutTime"
      <view v-if="todayRecord.id && todayRecord.workEndAt"
            class="today-status">
        <u-icon :name="todayRecord ? 'checkmark-circle' : 'close-circle'"
                :color="todayRecord ? '#4cd964' : '#ff3b30'"
        <u-icon name="checkmark-circle"
                color="#4cd964"
                size="16"></u-icon>
        <text class="status-text">
          {{ `今日考勤: ä¸‹ç­ ${todayRecord.checkOutTime}` }}
          {{ `今日考勤: ä¸‹ç­ ${todayRecord.workEndAt}` }}
        </text>
      </view>
      <!-- æ‰“卡状态 -->
      <view v-if="todayRecord"
            class="today-status">
        <u-icon :name="todayRecord.status === 'normal' ? 'checkmark-circle' : 'clock'"
                :color="todayRecord.status === 'normal' ? '#4cd964' : '#ff3b30'"
      <view class="today-status">
        <u-icon :name="todayRecord.id ? (todayRecord.status === 0 ? 'checkmark-circle' : 'clock') : 'clock'"
                :color="todayRecord.id ? (todayRecord.status === 0 ? '#4cd964' : '#ff3b30') : '#ff3b30'"
                size="16"></u-icon>
        <text class="status-text">
          {{ `打卡状态: ${todayRecord.statusText}` }}
          {{ `打卡状态: ${todayStatusText}` }}
        </text>
      </view>
      <view v-else
      <!-- å·¥æ—¶ä¿¡æ¯ -->
      <view v-if="todayRecord.id && todayRecord.workHours"
            class="today-status">
        <u-icon name="clock"
                color="#ff3b30"
                color="#348fe2"
                size="16"></u-icon>
        <text class="status-text">
          æ‰“卡状态: ç¼ºå¡
          {{ `工时(小时): ${todayRecord.workHours}` }}
        </text>
      </view>
    </view>
@@ -97,45 +97,19 @@
<script setup>
  import { ref, reactive, computed, onMounted, onBeforeUnmount } from "vue";
  import PageHeader from "@/components/PageHeader.vue";
  // æ¨¡æ‹Ÿå½“前登录员工
  const currentUser = reactive({
    id: 1,
    name: "张三",
    no: "E10001",
    dept: "生产一部",
  });
  import { getDicts } from "@/api/system/dict/data";
  import {
    createPersonalAttendanceRecord,
    findTodayPersonalAttendanceRecord,
  } from "@/api/personnelManagement/attendance.js";
  // ä»Šæ—¥æ‰“卡记录
  const todayRecord = ref({});

  // æ¨¡æ‹Ÿè€ƒå‹¤åŽŸå§‹æ•°æ®
  const rawAttendance = ref([
    {
      id: 2,
      date: "2026-02-08",
      userId: 1,
      name: "张三",
      no: "E10001",
      dept: "生产一部",
      checkInTime: "09:15",
      checkOutTime: "18:05",
      workHours: 8.8,
      status: "late",
      statusText: "迟到",
      remark: "因交通拥堵迟到",
    },
    {
      id: 3,
      date: "2026-02-07",
      userId: 1,
      name: "张三",
      no: "E10001",
      dept: "生产一部",
      checkInTime: "08:45",
      checkOutTime: "18:30",
      workHours: 9.7,
      status: "normal",
      statusText: "正常",
      remark: "加班0.5小时",
    },
  ]);
  // ç­æ¬¡ä¿¡æ¯
  const workTimeDict = ref({
    startAt: "09:00",
    endAt: "18:00",
  });

  // å½“前时间展示
  const nowTime = ref("");
@@ -143,6 +117,12 @@
  // è¿”回上一页
  const goBack = () => {
    uni.navigateBack();
  };
  // æŸ¥è¯¢ä»Šæ—¥æ‰“卡信息
  const fetchTodayData = () => {
    findTodayPersonalAttendanceRecord({}).then(res => {
      todayRecord.value = res.data;
    });
  };

  // æ‰“卡范围状态
@@ -165,28 +145,45 @@
  // ä»Šæ—¥æ—¥æœŸ
  const todayStr = computed(() => nowTime.value.slice(0, 10));

  // å½“日当前员工考勤记录
  const todayRecord = computed(() =>
    rawAttendance.value.find(
      item => item.userId === currentUser.id && item.date === todayStr.value
    )
  );

  // æ‰“卡按钮文本
  const checkInOutText = computed(() => {
    if (!todayRecord.value || !todayRecord.value.checkInTime) {
    if (!todayRecord.value || !todayRecord.value.workStartAt) {
      return "上班打卡";
    }
    if (!todayRecord.value.checkOutTime) {
    if (!todayRecord.value.workEndAt) {
      return "下班打卡";
    }
    return "已打卡";
  });

  // ä»Šæ—¥çŠ¶æ€æ ‡ç­¾ç±»åž‹
  const todayStatusTag = computed(() => {
    if (!todayRecord.value.id) return "info";
    if (todayRecord.value.status === 0) return "success";
    return "danger";
  });

  // ä»Šæ—¥çŠ¶æ€æ–‡æœ¬
  const todayStatusText = computed(() => {
    if (!todayRecord.value.id) return "未打卡";
    switch (todayRecord.value.status) {
      case 0:
        return "正常";
      case 1:
        return "迟到";
      case 2:
        return "早退";
      case 3:
        return "迟到、早退";
      case 4:
        return "缺勤";
    }
  });

  // å¯¼èˆªåˆ°è¯¦ç»†æŠ¥å‘Šé¡µé¢
  const navigateToReport = () => {
    uni.navigateTo({
      url: "/pages/attendance/report",
      url: "/pages/humanResources/attendance/report",
    });
  };

@@ -243,8 +240,32 @@
    });
  };

  // æ‰“卡逻辑（仅前端模拟）
  // èŽ·å–班次字典数据
  const getWorkTimeDict = () => {
    getDicts("sys_work_time")
      .then(res => {
        if (res.data && res.data.length > 0) {
          const dictData = res.data;
          workTimeDict.value = {
            startAt: dictData[0].dictValue || "-",
            endAt: dictData[1].dictValue || "-",
          };
        }
      })
      .catch(error => {
        console.error("获取班次字典失败:", error);
      });
  };

  // æ‰“卡逻辑
  const handleCheckInOut = async () => {
    if (todayRecord.value.workEndAt) {
      uni.showToast({
        title: "您已经打过卡了,无需重复打卡!!!",
        icon: "none",
      });
      return;
    }
    // æ£€æŸ¥æ˜¯å¦åœ¨æ‰“卡范围内
    if (!inCheckRange.value) {
      uni.showToast({
@@ -254,75 +275,30 @@
      return;
    }

    const [dateStr, timeStr] = nowTime.value.split(" ");
    if (!dateStr || !timeStr) return;

    // ä¸Šç­æ‰“卡
    if (!todayRecord.value) {
      const newId = rawAttendance.value.length
        ? Math.max(...rawAttendance.value.map(i => i.id)) + 1
        : 1;
      const status = timeStr > "09:00:00" ? "late" : "normal";
      const statusText = status === "late" ? "迟到" : "正常";
      rawAttendance.value.push({
        id: newId,
        date: dateStr,
        userId: currentUser.id,
        name: currentUser.name,
        no: currentUser.no,
        dept: currentUser.dept,
        checkInTime: timeStr.slice(0, 5),
        checkOutTime: "",
        workHours: null,
        status,
        statusText,
        remark: "",
    // è°ƒç”¨æ‰“卡API
    createPersonalAttendanceRecord({})
      .then(res => {
        uni.showToast({
          title: "打卡成功！",
          icon: "success",
        });
        // é‡æ–°èŽ·å–今日打卡信息
        fetchTodayData();
      })
      .catch(error => {
        console.error("打卡失败:", error);
        uni.showToast({
          title: error.msg || "打卡失败，请重试",
          icon: "none",
        });
      });
      uni.showToast({
        title: "上班打卡成功",
        icon: "success",
      });
    } else if (!todayRecord.value.checkOutTime) {
      // ä¸‹ç­æ‰“卡
      todayRecord.value.checkOutTime = timeStr.slice(0, 5);
      // ç®€å•æŒ‰ 9:00-18:00 è®¡ç®—工时
      const start = todayRecord.value.checkInTime || "09:00";
      const [sh, sm] = start.split(":").map(v => parseInt(v, 10));
      const [eh, em] = todayRecord.value.checkOutTime
        .split(":")
        .map(v => parseInt(v, 10));
      const diff = (eh * 60 + em - (sh * 60 + sm)) / 60;
      todayRecord.value.workHours = Number(Math.max(diff, 0).toFixed(1));

      // æ—©é€€åˆ¤æ–­ï¼š18:00 å‰ç¦»å¼€è§†ä¸ºæ—©é€€ï¼ˆåªç¤ºæ„ï¼‰
      if (timeStr < "18:00:00") {
        if (todayRecord.value.status === "late") {
          // æ—¢è¿Ÿåˆ°åˆæ—©é€€
          todayRecord.value.status = "late-early";
          todayRecord.value.statusText = "迟到 + æ—©é€€";
        } else {
          // ä»…早退
          todayRecord.value.status = "early";
          todayRecord.value.statusText = "早退";
        }
      } else if (todayRecord.value.status === "normal") {
        todayRecord.value.statusText = "正常";
      }
      uni.showToast({
        title: "下班打卡成功",
        icon: "success",
      });
    } else {
      uni.showToast({
        title: "今日已完成上下班打卡",
        icon: "none",
      });
    }
  };

  onMounted(async () => {
    fetchTodayData();
    updateNowTime();
    timer = setInterval(updateNowTime, 1000);
    getWorkTimeDict();

    // èŽ·å–位置权限并检查位置
    try {

 src/pages/humanResources/attendance/report.vue

ÎļþÃû´Ó src/pages/attendance/report.vue ÐÞ¸Ä
@@ -26,33 +26,43 @@
                        @cancel="showDatePicker = false"
                        title="搜索日期" />
    <view class="record-list">
      <view v-for="(item) in tableData"
      <!-- åŠ è½½çŠ¶æ€ -->
      <view v-if="loading"
            class="loading-state">
        <u-icon name="loading"
                size="40"
                color="#348fe2"></u-icon>
        <text class="loading-text">加载中...</text>
      </view>
      <view v-else
            v-for="(item) in tableData"
            :key="item.id"
            class="record-item-card"
            :class="{ 'abnormal': item.status !== 'normal' }">
            :class="{ 'abnormal': item.status !== 0 }">
        <view class="record-item-header">
          <text class="record-date">{{ item.date }}</text>
          <u-tag :type="item.status === 'normal' ? 'success' : 'error'"
          <u-tag :type="item.status === 0 ? 'success' : 'error'"
                 size="small">
            {{ item.statusText }}
            <!-- {{ item.status === 0 ? '正常' : (item.status === 1 ? '迟到' : (item.status === 2 ? '早退' : '迟到、早退')) }} -->
            {{ getStatusText(item.status) }}
          </u-tag>
        </view>
        <view class="record-item-body">
          <view class="record-detail">
            <text class="detail-label">员工</text>
            <text class="detail-value">{{ item.name }} ({{ item.no }})</text>
            <text class="detail-value">{{ item.staffName }} ({{ item.staffNo }})</text>
          </view>
          <view class="record-detail">
            <text class="detail-label">部门</text>
            <text class="detail-value">{{ item.dept }}</text>
            <text class="detail-value">{{ item.deptName }}</text>
          </view>
          <view class="record-detail">
            <text class="detail-label">上班时间</text>
            <text class="detail-value">{{ item.checkInTime ? item.checkInTime : '缺卡' }}</text>
            <text class="detail-value">{{ item.workStartAt || '缺卡' }}</text>
          </view>
          <view class="record-detail">
            <text class="detail-label">下班时间</text>
            <text class="detail-value">{{ item.checkOutTime? item.checkOutTime : '缺卡' }}</text>
            <text class="detail-value">{{ item.workEndAt || '缺卡' }}</text>
          </view>
          <view class="record-detail">
            <text class="detail-label">工时</text>
@@ -66,11 +76,11 @@
        </view>
      </view>
      <!-- ç©ºçŠ¶æ€ -->
      <view v-if="tableData.length === 0"
      <view v-if="tableData.length === 0 && !loading"
            class="empty-state">
        <u-icon name="clock-o"
        <!-- <u-icon name="clock-o"
                size="60"
                color="#999"></u-icon>
                color="#999"></u-icon> -->
        <text class="empty-text">暂无考勤记录</text>
      </view>
    </view>
@@ -89,96 +99,25 @@
  import { ref, reactive, onMounted } from "vue";
  import PageHeader from "@/components/PageHeader.vue";
  import dayjs from "dayjs";

  // æ¨¡æ‹Ÿå½“前登录员工
  const currentUser = reactive({
    id: 1,
    name: "张三",
    no: "E10001",
    dept: "生产一部",
  });

  // æ¨¡æ‹Ÿè€ƒå‹¤åŽŸå§‹æ•°æ®
  const rawAttendance = ref([
    {
      id: 1,
      date: "2026-02-09",
      userId: 1,
      name: "张三",
      no: "E10001",
      dept: "生产一部",
      checkInTime: "08:58",
      checkOutTime: "",
      workHours: null,
      status: "normal",
      statusText: "正常",
      remark: "",
    },
    {
      id: 2,
      date: "2026-02-08",
      userId: 1,
      name: "张三",
      no: "E10001",
      dept: "生产一部",
      checkInTime: "09:15",
      checkOutTime: "18:05",
      workHours: 8.8,
      status: "late",
      statusText: "迟到",
      remark: "因交通拥堵迟到",
    },
    {
      id: 3,
      date: "2026-02-07",
      userId: 1,
      name: "张三",
      no: "E10001",
      dept: "生产一部",
      checkInTime: "08:45",
      checkOutTime: "18:30",
      workHours: 9.7,
      status: "normal",
      statusText: "正常",
      remark: "加班0.5小时",
    },
    {
      id: 4,
      date: "2026-02-06",
      userId: 1,
      name: "张三",
      no: "E10001",
      dept: "生产一部",
      checkInTime: "08:50",
      checkOutTime: "17:45",
      workHours: 8.9,
      status: "early",
      statusText: "早退",
      remark: "家中有事提前离开",
    },
    {
      id: 5,
      date: "2026-02-05",
      userId: 1,
      name: "张三",
      no: "E10001",
      dept: "生产一部",
      checkInTime: "08:40",
      checkOutTime: "18:20",
      workHours: 9.7,
      status: "normal",
      statusText: "正常",
      remark: "加班0.5小时",
    },
  ]);
  import { findPersonalAttendanceRecords } from "@/api/personnelManagement/attendance.js";

  // æŸ¥è¯¢è¡¨å•
  const searchForm = reactive({
    date: "",
  });

  // åˆ†é¡µå‚æ•°
  const page = reactive({
    current: -1,
    size: -1,
    total: 0,
  });

  // è¡¨æ ¼æ•°æ®
  const tableData = ref([]);

  // åŠ è½½çŠ¶æ€
  const loading = ref(false);

  // è¿”回上一页
  const goBack = () => {
@@ -196,6 +135,20 @@
    showDatePicker.value = false;
    handleQuery();
  };
  const getStatusText = status => {
    switch (status) {
      case 0:
        return "正常";
      case 1:
        return "迟到";
      case 2:
        return "早退";
      case 3:
        return "迟到、早退";
      case 4:
        return "缺勤";
    }
  };

  // æ˜¾ç¤ºæ—¥æœŸé€‰æ‹©å™¨
  const selectDate = () => {
@@ -204,27 +157,42 @@

  // æ¸…除日期选择
  const clearDate = () => {
    resetQuery();
  };

  // æŸ¥è¯¢
  const handleQuery = () => {
    loading.value = true;
    console.log(searchForm, "searchForm");

    findPersonalAttendanceRecords({
      ...page,
      ...searchForm,
    })
      .then(res => {
        tableData.value = res.data.records;
        page.total = res.data.total;
      })
      .catch(error => {
        console.error("查询失败:", error);
        uni.showToast({
          title: "查询失败，请重试",
          icon: "none",
        });
      })
      .finally(() => {
        loading.value = false;
      });
  };

  // é‡ç½®æŸ¥è¯¢
  const resetQuery = () => {
    searchForm.date = "";
    handleQuery();
  };

  // æŸ¥è¯¢
  const recomputeTable = () => {
    const list = rawAttendance.value.filter(item => {
      if (searchForm.date && item.date !== searchForm.date) {
        return false;
      }
      return true;
    });
    tableData.value = list;
  };

  const handleQuery = () => {
    recomputeTable();
  };

  onMounted(() => {
    recomputeTable();
    handleQuery();
  });
</script>

@@ -307,6 +275,24 @@
    margin: 0 20rpx 24rpx;
  }

  /* åŠ è½½çŠ¶æ€ */
  .loading-state {
    background-color: $card-bg;
    border-radius: 16rpx;
    box-shadow: $shadow-md;
    text-align: center;
    padding: 120rpx 0;
    margin: 0 20rpx;
    transition: all 0.3s ease;
  }

  .loading-text {
    font-size: 14px;
    color: $text-tertiary;
    margin-top: 24rpx;
    font-weight: 500;
  }

  .record-item-card {
    background-color: $card-bg;
    border-radius: 16rpx;

 src/pages/humanResources/monthlyStatistics/detail.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,357 @@
<template>
  <view class="hazard-source-detail">
    <PageHeader :title="isEdit ? '编辑薪资台账' : '新增薪资台账'"
                @back="goBack" />
    <u-form @submit="handleSubmit"
            ref="formRef"
            label-width="110">
      <!-- è–ªèµ„信息 -->
      <u-cell-group title="薪资信息">
        <u-form-item label="统计月份"
                     prop="payDate"
                     required
                     border-bottom>
          <u-input v-model="form.payDate"
                   placeholder="请选择月份"
                   @click="showDatePicker"
                   readonly />
          <template #right>
            <up-icon name="arrow-right"
                     @click="showDatePicker"></up-icon>
          </template>
        </u-form-item>
        <u-form-item label="员工姓名"
                     prop="staffId"
                     required
                     border-bottom>
          <u-input v-model="form.staffName"
                   placeholder="请选择员工"
                   @click="showStaffSheet"
                   readonly />
          <template #right>
            <up-icon name="arrow-right"
                     @click="showStaffSheet"></up-icon>
          </template>
        </u-form-item>
        <u-form-item label="基本工资"
                     prop="basicSalary"
                     required
                     border-bottom>
          <u-input v-model="form.basicSalary"
                   type="number"
                   placeholder="请输入基本工资" />
        </u-form-item>
        <u-form-item label="计件工资"
                     prop="pieceworkSalary"
                     border-bottom>
          <u-input v-model="form.pieceworkSalary"
                   type="number"
                   placeholder="请输入计件工资" />
        </u-form-item>
        <u-form-item label="计时工资"
                     prop="hourlySalary"
                     border-bottom>
          <u-input v-model="form.hourlySalary"
                   type="number"
                   placeholder="请输入计时工资" />
        </u-form-item>
        <u-form-item label="其他收入"
                     prop="otherIncome"
                     border-bottom>
          <u-input v-model="form.otherIncome"
                   type="number"
                   placeholder="请输入其他收入" />
        </u-form-item>
        <u-form-item label="社保个人"
                     prop="socialSecurityIndividuals"
                     border-bottom>
          <u-input v-model="form.socialSecurityIndividuals"
                   type="number"
                   placeholder="请输入社保个人" />
        </u-form-item>
        <u-form-item label="公积金个人"
                     prop="providentFundIndividuals"
                     border-bottom>
          <u-input v-model="form.providentFundIndividuals"
                   type="number"
                   placeholder="请输入公积金个人" />
        </u-form-item>
        <u-form-item label="个人所得税"
                     prop="personalIncomeTax"
                     border-bottom>
          <u-input v-model="form.personalIncomeTax"
                   type="number"
                   placeholder="请输入个人所得税" />
        </u-form-item>
        <u-form-item label="其他扣款"
                     prop="otherDeductions"
                     border-bottom>
          <u-input v-model="form.otherDeductions"
                   type="number"
                   placeholder="请输入其他扣款" />
        </u-form-item>
        <u-form-item label="备注"
                     prop="remark"
                     border-bottom>
          <u-textarea v-model="form.remark"
                      placeholder="请输入备注"
                      :rows="3"
                      :autoHeight="true" />
        </u-form-item>
      </u-cell-group>
      <!-- æäº¤æŒ‰é’® -->
      <view class="footer-btns">
        <u-button class="cancel-btn"
                  @click="goBack">取消</u-button>
        <u-button class="sign-btn"
                  type="primary"
                  @click="handleSubmit"
                  :loading="loading">{{ isEdit ? '更新' : '保存' }}</u-button>
      </view>
    </u-form>
    <!-- å‘˜å·¥é€‰æ‹©å™¨ -->
    <up-action-sheet :show="staffSheetVisible"
                     :actions="staffOptions"
                     @select="handleStaffSelect"
                     @close="staffSheetVisible = false"
                     title="选择员工" />
    <!-- æ—¥æœŸé€‰æ‹©å™¨ -->
    <up-datetime-picker :show="datePickerVisible"
                        v-model="currentDate"
                        @confirm="onDateConfirm"
                        @cancel="datePickerVisible = false"
                        mode="month" />
  </view>
</template>

<script setup>
  // æ›¿æ¢ toast æ–¹æ³•
  defineOptions({ name: "monthly-statistics-detail" });
  const showToast = message => {
    uni.showToast({
      title: message,
      icon: "none",
    });
  };

  import { ref, onMounted } from "vue";
  import PageHeader from "@/components/PageHeader.vue";
  import {
    monthlyStatisticsAdd,
    monthlyStatisticsUpdate,
    staffOnJobList,
  } from "@/api/personnelManagement/monthlyStatistics";
  import dayjs from "dayjs";
  import { onLoad } from "@dcloudio/uni-app";

  // è¡¨å•æ•°æ®
  const form = ref({
    id: "",
    payDate: "",
    staffId: "",
    staffName: "",
    basicSalary: 0,
    pieceworkSalary: 0,
    hourlySalary: 0,
    otherIncome: 0,
    socialSecurityIndividuals: 0,
    providentFundIndividuals: 0,
    personalIncomeTax: 0,
    otherDeductions: 0,
    payableWages: 0,
    deductibleWages: 0,
    actualWages: 0,
    remark: "",
  });

  // é¡µé¢çŠ¶æ€
  const loading = ref(false);
  const formRef = ref(null);
  const isEdit = ref(false);

  // å‘˜å·¥é€‰æ‹©å™¨
  const staffSheetVisible = ref(false);
  const staffOptions = ref([]);
  const staffList = ref([]);
  const showStaffSheet = () => {
    if (staffOptions.value.length === 0) {
      loadStaffList();
    } else {
      staffSheetVisible.value = true;
    }
  };
  const handleStaffSelect = item => {
    const staff = staffList.value.find(s => s.id === item.value);
    if (staff) {
      form.value.staffId = staff.id;
      form.value.staffName = staff.staffName;
    }
    staffSheetVisible.value = false;
  };
  const loadStaffList = () => {
    staffOnJobList().then(res => {
      if (res.code === 200) {
        staffList.value = res.data || [];
        staffOptions.value = staffList.value.map(item => ({
          value: item.id,
          name: item.staffName,
          subname: `工号: ${item.staffNo}`,
        }));
        staffSheetVisible.value = true;
      }
    });
  };

  // æ—¥æœŸé€‰æ‹©å™¨
  const datePickerVisible = ref(false);
  const currentDate = ref(Date.now());
  const showDatePicker = () => {
    datePickerVisible.value = true;
  };
  const onDateConfirm = e => {
    form.value.payDate = dayjs(e.value).format("YYYY-MM");
    currentDate.value = e.value;
    datePickerVisible.value = false;
  };

  // è¿”回上一页
  const goBack = () => {
    // è¿”回时清除本地存储的数据
    uni.removeStorageSync("monthlyStatistics");
    uni.navigateBack();
  };

  // æäº¤è¡¨å•
  const handleSubmit = async () => {
    if (!form.value.payDate) {
      showToast("请选择统计月份");
      return;
    }

    if (!form.value.staffId) {
      showToast("请选择员工");
      return;
    }

    if (!form.value.basicSalary) {
      showToast("请输入基本工资");
      return;
    }

    // è®¡ç®—应发工资、应扣工资和实发工资
    const payableWages =
      Number(form.value.basicSalary) +
      Number(form.value.pieceworkSalary) +
      Number(form.value.hourlySalary) +
      Number(form.value.otherIncome);
    const deductibleWages =
      Number(form.value.socialSecurityIndividuals) +
      Number(form.value.providentFundIndividuals) +
      Number(form.value.personalIncomeTax) +
      Number(form.value.otherDeductions);
    const actualWages = payableWages - deductibleWages;

    const submitData = {
      ...form.value,
      payableWages,
      deductibleWages,
      actualWages,
    };

    try {
      loading.value = true;

      if (isEdit.value) {
        const { code } = await monthlyStatisticsUpdate(submitData);
        if (code === 200) {
          showToast("更新成功");
          setTimeout(() => {
            goBack();
          }, 500);
        } else {
          loading.value = false;
          showToast("更新失败，请重试");
        }
      } else {
        const { code } = await monthlyStatisticsAdd(submitData);
        if (code === 200) {
          showToast("保存成功");
          setTimeout(() => {
            goBack();
          }, 500);
        } else {
          loading.value = false;
          showToast("保存失败，请重试");
        }
      }
    } catch (e) {
      loading.value = false;
      console.error("提交失败:", e);
      showToast("提交失败，请重试");
    }
  };

  onLoad(() => {
    // ç¼–辑薪资台账时，从本地存储获取数据
    const monthlyStatistics = uni.getStorageSync("monthlyStatistics");
    if (monthlyStatistics.id) {
      form.value = monthlyStatistics;
      isEdit.value = true;
    } else {
      isEdit.value = false;
    }
  });

  onMounted(() => {
    // è®¾ç½®é»˜è®¤æ—¶é—´
    if (!isEdit.value) {
      form.value.payDate = dayjs().format("YYYY-MM");
      currentDate.value = Date.now();
    }
  });
</script>

<style scoped lang="scss">
  @import "@/static/scss/form-common.scss";
  .hazard-source-detail {
    min-height: 100vh;
    background: #f8f9fa;
    padding-bottom: 5rem;
  }

  .footer-btns {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    display: flex;
    justify-content: space-around;
    align-items: center;
    padding: 0.75rem 0;
    box-shadow: 0 -0.125rem 0.5rem rgba(0, 0, 0, 0.05);
    z-index: 1000;
  }

  .cancel-btn {
    font-weight: 400;
    font-size: 1rem;
    color: #666;
    background: #f5f5f5;
    border: 1px solid #ddd;
    width: 45%;
    height: 2.5rem;
    border-radius: 2.5rem 2.5rem 2.5rem 2.5rem;
  }

  .sign-btn {
    font-weight: 500;
    font-size: 1rem;
    color: #fff;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border: none;
    width: 45%;
    height: 2.5rem;
    border-radius: 2.5rem 2.5rem 2.5rem 2.5rem;
  }
</style>

 src/pages/humanResources/monthlyStatistics/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,247 @@
<template>
  <view class="sales-accoun">
    <!-- ä½¿ç”¨é€šç”¨é¡µé¢å¤´éƒ¨ç»„件 -->
    <PageHeader title="薪资台账"
                @back="goBack" />
    <!-- æœç´¢å’Œç­›é€‰åŒºåŸŸ -->
    <view class="search-section">
      <view class="search-bar">
        <view class="search-input">
          <up-input class="search-text"
                    placeholder="请输入员工姓名"
                    v-model="searchKeyword"
                    @blur="getList"
                    clearable />
        </view>
        <view class="filter-button"
              @click="getList">
          <u-icon name="search"
                  size="24"
                  color="#999"></u-icon>
        </view>
      </view>
    </view>
    <!-- è–ªèµ„台账列表 -->
    <view class="ledger-list"
          v-if="ledgerList.length > 0">
      <view v-for="(item, index) in ledgerList"
            :key="index">
        <view class="ledger-item">
          <view class="item-header">
            <view class="item-left">
              <view class="document-icon">
                <up-icon name="file-text"
                         size="16"
                         color="#ffffff"></up-icon>
              </view>
              <text class="item-id">薪资月份：{{ item.payDate }}</text>
            </view>
          </view>
          <up-divider></up-divider>
          <view class="item-details">
            <view class="detail-row">
              <text class="detail-label">员工姓名</text>
              <text class="detail-value">{{ item.staffName || '-' }}</text>
            </view>
            <view class="detail-row">
              <text class="detail-label">基本工资</text>
              <text class="detail-value">{{ item.basicSalary || 0 }}</text>
            </view>
            <view class="detail-row">
              <text class="detail-label">计件工资</text>
              <text class="detail-value">{{ item.pieceworkSalary || 0 }}</text>
            </view>
            <view class="detail-row">
              <text class="detail-label">计时工资</text>
              <text class="detail-value">{{ item.hourlySalary || 0 }}</text>
            </view>
            <view class="detail-row">
              <text class="detail-label">其他收入</text>
              <text class="detail-value">{{ item.otherIncome || 0 }}</text>
            </view>
            <view class="detail-row">
              <text class="detail-label">应发工资</text>
              <text class="detail-value">{{ item.payableWages || 0 }}</text>
            </view>
            <view class="detail-row">
              <text class="detail-label">应扣工资</text>
              <text class="detail-value">{{ item.deductibleWages || 0 }}</text>
            </view>
            <view class="detail-row">
              <text class="detail-label">实发工资</text>
              <text class="detail-value">{{ item.actualWages || 0 }}</text>
            </view>
          </view>
          <!-- æŒ‰é’®åŒºåŸŸ -->
          <view class="action-buttons">
            <u-button type="primary"
                      size="small"
                      class="action-btn"
                      @click="editItem(item)">
              ç¼–辑
            </u-button>
            <u-button type="error"
                      size="small"
                      class="action-btn"
                      @click="deleteItem(item)">
              åˆ é™¤
            </u-button>
          </view>
        </view>
      </view>
    </view>
    <view v-else
          class="no-data">
      <text>暂无薪资台账数据</text>
    </view>
    <!-- æµ®åŠ¨æ–°å¢žæŒ‰é’® -->
    <view class="fab-button"
          @click="addItem">
      <up-icon name="plus"
               size="24"
               color="#ffffff"></up-icon>
    </view>
  </view>
</template>

<script setup>
  import { ref, onMounted } from "vue";
  import { onShow } from "@dcloudio/uni-app";
  import PageHeader from "@/components/PageHeader.vue";
  import {
    monthlyStatisticsListPage,
    monthlyStatisticsDelete,
  } from "@/api/personnelManagement/monthlyStatistics";
  import useUserStore from "@/store/modules/user";

  // æ›¿æ¢ toast æ–¹æ³•
  defineOptions({ name: "monthly-statistics-index" });
  const showToast = message => {
    uni.showToast({
      title: message,
      icon: "none",
    });
  };

  const userStore = useUserStore();

  // æœç´¢å…³é”®è¯
  const searchKeyword = ref("");

  // è–ªèµ„台账数据
  const ledgerList = ref([]);
  // è¿”回上一页
  const goBack = () => {
    uni.navigateBack();
  };

  // æŸ¥è¯¢åˆ—表
  const getList = () => {
    showLoadingToast("加载中...");
    const params = {
      current: -1,
      size: -1,
      staffName: searchKeyword.value,
    };
    monthlyStatisticsListPage(params)
      .then(res => {
        ledgerList.value = res.records || res.data?.records || [];
        closeToast();
      })
      .catch(() => {
        closeToast();
        showToast("获取数据失败");
      });
  };

  // æ˜¾ç¤ºåŠ è½½æç¤º
  const showLoadingToast = message => {
    uni.showLoading({
      title: message,
      mask: true,
    });
  };

  // å…³é—­æç¤º
  const closeToast = () => {
    uni.hideLoading();
  };

  // æ–°å¢žè–ªèµ„台账
  const addItem = () => {
    uni.setStorageSync("monthlyStatistics", {});
    uni.navigateTo({
      url: "/pages/humanResources/monthlyStatistics/detail",
    });
  };
  // ç¼–辑薪资台账
  const editItem = item => {
    uni.setStorageSync("monthlyStatistics", item);
    uni.navigateTo({
      url: "/pages/humanResources/monthlyStatistics/detail",
    });
  };
  // åˆ é™¤è–ªèµ„台账
  const deleteItem = item => {
    uni.showModal({
      title: "删除确认",
      content: `确定要删除该薪资台账记录吗？`,
      success: res => {
        if (res.confirm) {
          deleteItemById(item.id);
        }
      },
    });
  };

  // åˆ é™¤è–ªèµ„台账记录
  const deleteItemById = id => {
    showLoadingToast("删除中...");
    monthlyStatisticsDelete([id])
      .then(() => {
        closeToast();
        showToast("删除成功");
        getList();
      })
      .catch(() => {
        closeToast();
        showToast("删除失败");
      });
  };

  onMounted(() => {
    getList();
  });

  onShow(() => {
    getList();
  });
</script>

<style scoped lang="scss">
  @import "../../../styles/sales-common.scss";

  // é¡µé¢ç‰¹å®šçš„样式覆盖
  .sales-accoun {
    min-height: 100vh;
    background: #f8f9fa;
    position: relative;
    padding-bottom: 80px;
  }

  // ç‰¹å®šçš„图标样式
  .document-icon {
    background: #667eea; // ä¿æŒé¡µé¢ç‰¹æœ‰çš„背景色
  }

  // ç‰¹æœ‰æ ·å¼
  .detail-value {
    word-break: break-all; // ä¿ç•™é¡µé¢ç‰¹æœ‰çš„文本换行样式
  }

  // ç‰¹å®šçš„浮动按钮样式
  .fab-button {
    background: #667eea; // ä¿æŒé¡µé¢ç‰¹æœ‰çš„背景色
    box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3); // ä¿æŒé¡µé¢ç‰¹æœ‰çš„阴影效果
  }
</style>

 src/pages/index.vue

@@ -38,7 +38,8 @@
    <!--            </view>-->
    <!--        </view>-->
    <!-- è¥é”€ç®¡ç†æ¨¡å— -->
    <view class="common-module marketing-module">
    <view class="common-module marketing-module"
          v-if="hasMarketingItems">
      <view class="module-header">
        <view class="module-title-container">
          <text class="module-title">营销管理</text>
@@ -62,7 +63,8 @@
      </view>
    </view>
    <!--    &lt;!&ndash; é‡‡è´­ç®¡ç†æ¨¡å— &ndash;&gt;-->
    <view class="common-module purchase-module">
    <view class="common-module purchase-module"
          v-if="hasPurchaseItems">
      <view class="module-header">
        <view class="module-title-container">
          <text class="module-title">采购管理</text>
@@ -86,7 +88,8 @@
      </view>
    </view>
    <!-- &lt;!&ndash; ååŒåŠžå…¬æ¨¡å— &ndash;&gt; -->
    <view class="common-module collaboration-module">
    <view class="common-module collaboration-module"
          v-if="hasCollaborationItems">
      <view class="module-header">
        <view class="module-title-container">
          <text class="module-title">协同办公</text>
@@ -110,7 +113,8 @@
      </view>
    </view>
    <!-- å®‰å…¨ç”Ÿäº§æ¨¡å— -->
    <view class="common-module collaboration-module">
    <view class="common-module collaboration-module"
          v-if="hasSafetyItems">
      <view class="module-header">
        <view class="module-title-container">
          <text class="module-title">安全生产</text>
@@ -134,7 +138,8 @@
      </view>
    </view>
    <!-- äººåŠ›èµ„源模块 -->
    <view class="common-module collaboration-module">
    <view class="common-module collaboration-module"
          v-if="hasHumanResourcesItems">
      <view class="module-header">
        <view class="module-title-container">
          <text class="module-title">人力资源</text>
@@ -158,36 +163,8 @@
      </view>
    </view>
    <!-- ç”Ÿäº§ç®¡æŽ§æ¨¡å— -->
    <!--        <view class="common-module production-module">-->
    <!--            <view class="module-header">-->
    <!--                <view class="module-title-container">-->
    <!--                    <text class="module-title">生产管控</text>-->
    <!--                </view>-->
    <!--            </view>-->
    <!--            <view class="module-content">-->
    <!--                <up-grid-->
    <!--                    :border="false"-->
    <!--                    col="4"-->
    <!--                >-->
    <!--                    <up-grid-item-->
    <!--                        v-for="(item, index) in productionItems"-->
    <!--                        :key="index"-->
    <!--                        @click="handleCommonItemClick(item)"-->
    <!--                    >-->
    <!--                        <view class="icon-container" :style="{ background: item.bgColor }">-->
    <!--                            <up-icon-->
    <!--                                :name="item.icon"-->
    <!--                                :size="58"-->
    <!--                                color="#ffffff"-->
    <!--                            ></up-icon>-->
    <!--                        </view>-->
    <!--                        <text class="item-label">{{item.label}}</text>-->
    <!--                    </up-grid-item>-->
    <!--                </up-grid>-->
    <!--            </view>-->
    <!--        </view>-->
    <!-- ç”Ÿäº§ç®¡æŽ§æ¨¡å— -->
    <view class="common-module equipment-module">
    <view class="common-module equipment-module"
          v-if="hasProductionItems">
      <view class="module-header">
        <view class="module-title-container">
          <text class="module-title">生产管控</text>
@@ -211,7 +188,8 @@
      </view>
    </view>
    <!-- è®¾å¤‡ç®¡ç†æ¨¡å— -->
    <view class="common-module equipment-module">
    <view class="common-module equipment-module"
          v-if="hasEquipmentItems">
      <view class="module-header">
        <view class="module-title-container">
          <text class="module-title">设备管理</text>
@@ -238,7 +216,7 @@
</template>

<script setup>
  import { ref, onMounted, nextTick, reactive } from "vue";
  import { ref, onMounted, nextTick, reactive, computed } from "vue";
  import { userLoginFacotryList } from "@/api/login";
  import { getProductWorkOrderById } from "@/api/productionManagement/productionReporting";
  import modal from "@/plugins/modal";
@@ -335,7 +313,7 @@
  const safetyItems = reactive([
    {
      icon: "/static/images/icon/caigoutaizhang@2x.png",
      label: "规程资质",
      label: "规程与资质",
    },
    {
      icon: "/static/images/icon/caigoutaizhang@2x.png",
@@ -343,38 +321,34 @@
    },
    {
      icon: "/static/images/icon/caigoutaizhang@2x.png",
      label: "危险作业",
      label: "危险作业审批",
    },
    {
      icon: "/static/images/icon/guzhangfenxi@2x.png",
      label: "隐患排查",
      label: "隐患排查上报",
    },
    {
      icon: "/static/images/icon/guzhangfenxi@2x.png",
      label: "危险物料",
      label: "危险物料管控",
    },
    {
      icon: "/static/images/icon/guzhangfenxi@2x.png",
      label: "应急预案",
      label: "应急预案查阅",
    },
    {
      icon: "/static/images/icon/guzhangfenxi@2x.png",
      label: "事故上报",
      label: "事故上报记录",
    },
    {
      icon: "/static/images/icon/guzhangfenxi@2x.png",
      label: "安全培训",
      label: "安全培训考核",
    },
  ]);
  // ååŒåŠžå…¬åŠŸèƒ½æ•°æ®
  const collaborationItems = reactive([
    {
      icon: "/static/images/icon/gongchuguanli@2x.png",
      label: "考勤管理",
    },
    {
      icon: "/static/images/icon/baoxiaoguanli.png",
      label: "财务管理",
      label: "协同审批",
    },
    {
      icon: "/static/images/icon/huiyiliebiao@2x.png",
@@ -396,10 +370,6 @@
      icon: "/static/images/icon/guizhangzhidu@2x.png",
      label: "规章制度",
    },
    // {
    //   icon: "/static/images/icon/xietongshenpi@2x.png",
    //   label: "协同审批",
    // },
    {
      icon: "/static/images/icon/kehubaifang@2x.png",
      label: "客户拜访",
@@ -452,26 +422,6 @@
    {
      icon: "/static/images/icon/shbeibaoyang@2x.png",
      label: "设备保养",
    },
    {
      icon: "/static/images/icon/guzhangfenxi@2x.png",
      label: "分析追溯",
      bgColor: "#ff9800",
    },
    {
      icon: "/static/images/icon/zhinengpaidan@2x.png",
      label: "智能派单",
      bgColor: "#ff6b35",
    },
    {
      icon: "/static/images/icon/zuoyezhidao@2x.png",
      label: "作业指导",
      bgColor: "#4caf50",
    },
    {
      icon: "/static/images/icon/jieguoyanzheng@2x.png",
      label: "结果验证",
      bgColor: "#9c27b0",
    },
    {
      icon: "/static/images/icon/xunjianshangchuan@2x.png",
@@ -563,19 +513,39 @@
          url: "/pages/cooperativeOffice/collaborativeApproval/index4",
        });
        break;
      case "考勤管理":
      case "协同审批":
        uni.navigateTo({
          url: "/pages/indexItem?label=考勤管理",
        });
        break;
      case "财务管理":
        uni.navigateTo({
          url: "/pages/indexItem?label=财务管理",
          url: "/pages/indexItem?label=协同审批",
        });
        break;
      case "会议管理":
        uni.navigateTo({
          url: "/pages/indexItem?label=会议管理",
        });
        break;
      case "通知公告":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/noticeManagement/index",
        });
        break;
      case "知识库":
        uni.navigateTo({
          url: "/pages/managementMeetings/knowledgeBase/index",
        });
        break;
      case "用印管理":
        uni.navigateTo({
          url: "/pages/managementMeetings/sealManagement/index",
        });
        break;
      case "规章制度":
        uni.navigateTo({
          url: "/pages/managementMeetings/rulesRegulationsManagement/index",
        });
        break;
      case "客户拜访":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/clientVisit/index",
        });
        break;
      case "采购管理":
@@ -588,7 +558,7 @@
          url: "/pages/cooperativeOffice/collaborativeApproval/index6",
        });
        break;
      case "出库管理":
      case "发货审批":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/collaborativeApproval/index7",
        });
@@ -626,37 +596,6 @@
      case "会议看板":
        uni.navigateTo({
          url: "/pages/managementMeetings/meetingBoard/index",
        });
        break;
      case "通知公告":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/noticeManagement/index",
        });
        break;
      case "知识库":
        uni.navigateTo({
          url: "/pages/managementMeetings/knowledgeBase/index",
        });
        break;
      case "用印管理":
        uni.navigateTo({
          url: "/pages/managementMeetings/sealManagement/index",
        });
        break;
      case "规章制度":
        uni.navigateTo({
          url: "/pages/managementMeetings/rulesRegulationsManagement/index",
        });
        break;

      case "协同审批":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/collaborativeApproval/index",
        });
        break;
      case "客户拜访":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/clientVisit/index",
        });
        break;
      case "生产订单":
@@ -727,7 +666,7 @@
          url: "/pages/equipmentManagement/verification/index",
        });
        break;
      case "规程资质":
      case "规程与资质":
        uni.navigateTo({
          url: "/pages/safeProduction/safeQualifications/index",
        });
@@ -737,39 +676,44 @@
          url: "/pages/safeProduction/hazardSourceLedger/index",
        });
        break;
      case "危险作业":
      case "危险作业审批":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/collaborativeApproval/index8",
        });
        break;
      case "隐患排查":
      case "隐患排查上报":
        uni.navigateTo({
          url: "/pages/safeProduction/dangerInvestigation/index",
        });
        break;
      case "危险物料":
      case "危险物料管控":
        uni.navigateTo({
          url: "/pages/safeProduction/hazardousMaterialsControl/index",
        });
        break;
      case "应急预案":
      case "应急预案查阅":
        uni.navigateTo({
          url: "/pages/safeProduction/emergencyPlanReview/index",
        });
        break;
      case "事故上报":
      case "事故上报记录":
        uni.navigateTo({
          url: "/pages/safeProduction/accidentReportingRecord/index",
        });
        break;
      case "安全培训":
      case "安全培训考核":
        uni.navigateTo({
          url: "/pages/safeProduction/safetyTrainingAssessment/index",
        });
        break;
      case "打卡签到":
        uni.navigateTo({
          url: "/pages/attendance/checkin",
          url: "/pages/humanResources/attendance/checkin",
        });
        break;
      case "人员薪资":
        uni.navigateTo({
          url: "/pages/humanResources/monthlyStatistics/index",
        });
        break;
      default:
@@ -874,8 +818,6 @@
            return;
          }
        }

        console.log(orderRow, "orderRow======@@@@@@@@");
        // æ‰«ç æˆåŠŸåŽè·³è½¬åˆ°ç”Ÿäº§æŠ¥å·¥é¡µé¢ï¼Œå¹¶ä¼ é€’orderRow参数
        uni.navigateTo({
          url: `/pages/productionManagement/productionReport/index?orderRow=${orderRow}`,
@@ -910,6 +852,17 @@
      });
  };
  function loginSuccess(result) {
    // èŽ·å–路由权限
    userStore
      .getRouters()
      .then(() => {
        console.log("路由权限获取成功");
        // è¿‡æ»¤èœå•é¡¹
        filterMenuItemsByRoutes();
      })
      .catch(error => {
        console.error("获取路由权限失败:", error);
      });
    uni.reLaunch({
      url: "/pages/index",
    });
@@ -922,9 +875,169 @@
    }
  };

  // æ ¹æ®è·¯ç”±æƒé™è¿‡æ»¤èœå•é¡¹
  const filterMenuItemsByRoutes = () => {
    const routers = userStore.routers || [];

    // å¦‚果没有路由权限数据，不进行过滤（显示所有菜单）
    if (!routers || routers.length === 0) {
      console.log("暂无路由权限数据，显示所有菜单");
      return;
    }

    // æ”¶é›†æ‰€æœ‰æœ‰æƒé™çš„菜单标题（根据 meta.title）
    const allowedMenuTitles = new Set();
    const collectMenuTitles = routes => {
      if (!Array.isArray(routes)) return;
      routes.forEach(route => {
        // æ”¶é›†å½“前路由的标题
        if (route.meta && route.meta.title) {
          allowedMenuTitles.add(route.meta.title);
        }
        // é€’归处理子路由
        if (route.children && route.children.length > 0) {
          collectMenuTitles(route.children);
        }
      });
    };
    collectMenuTitles(routers);

    // è¿‡æ»¤è¥é”€ç®¡ç†èœå•
    const originalMarketing = [
      { icon: "/static/images/icon/xiaoshoutaizhang@2x.png", label: "销售台账" },
      { icon: "/static/images/icon/kaipiaodengji@2x.png", label: "开票登记" },
      { icon: "/static/images/icon/kaipiaotaizhang@2x.png", label: "开票台账" },
      { icon: "/static/images/icon/huikuandengji@2x.png", label: "回款登记" },
      { icon: "/static/images/icon/huikuanliushui@2x.png", label: "回款流水" },
      { icon: "/static/images/icon/kehuwanglai@2x.png", label: "客户往来" },
    ];
    const filteredMarketing = originalMarketing.filter(item => {
      return allowedMenuTitles.has(item.label);
    });
    marketingItems.splice(0, marketingItems.length, ...filteredMarketing);

    // è¿‡æ»¤ååŒåŠžå…¬èœå•
    const originalCollaboration = [
      { icon: "/static/images/icon/baoxiaoguanli.png", label: "协同审批" },
      { icon: "/static/images/icon/huiyiliebiao@2x.png", label: "会议管理" },
      { icon: "/static/images/icon/tongzhigonggao@2x.png", label: "通知公告" },
      { icon: "/static/images/icon/zhishiku@2x.png", label: "知识库" },
      { icon: "/static/images/icon/yongyinguanli@2x.png", label: "用印管理" },
      { icon: "/static/images/icon/guizhangzhidu@2x.png", label: "规章制度" },
      { icon: "/static/images/icon/kehubaifang@2x.png", label: "客户拜访" },
    ];
    const filteredCollaboration = originalCollaboration.filter(item => {
      // å¤„理标题不完全匹配的情况
      let matched = allowedMenuTitles.has(item.label);
      // ç‰¹æ®Šå¤„理：规章制度 -> è§„章制度管理
      if (!matched && item.label === "规章制度") {
        matched = allowedMenuTitles.has("规章制度管理");
      }
      return matched;
    });
    collaborationItems.splice(
      0,
      collaborationItems.length,
      ...filteredCollaboration
    );

    // è¿‡æ»¤é‡‡è´­ç®¡ç†èœå•
    const originalPurchase = [
      { icon: "/static/images/icon/caigoutaizhang@2x.png", label: "采购台账" },
      { icon: "/static/images/icon/laipiaodengji@2x.png", label: "来票登记" },
      { icon: "/static/images/icon/laipiaotaizhang@2x.png", label: "来票台账" },
      { icon: "/static/images/icon/fukuanjingji@2x.png", label: "付款登记" },
      { icon: "/static/images/icon/fukuanliushui@2x.png", label: "付款流水" },
      {
        icon: "/static/images/icon/gongyingshangwanglai@2x.png",
        label: "供应商往来",
      },
    ];
    const filteredPurchase = originalPurchase.filter(item => {
      return allowedMenuTitles.has(item.label);
    });
    purchaseItems.splice(0, purchaseItems.length, ...filteredPurchase);

    // è¿‡æ»¤å®‰å…¨ç”Ÿäº§èœå•
    const originalSafety = [
      { icon: "/static/images/icon/caigoutaizhang@2x.png", label: "规程与资质" },
      { icon: "/static/images/icon/caigoutaizhang@2x.png", label: "危险源台账" },
      {
        icon: "/static/images/icon/caigoutaizhang@2x.png",
        label: "危险作业审批",
      },
      { icon: "/static/images/icon/guzhangfenxi@2x.png", label: "隐患排查上报" },
      { icon: "/static/images/icon/guzhangfenxi@2x.png", label: "危险物料管控" },
      { icon: "/static/images/icon/guzhangfenxi@2x.png", label: "应急预案查阅" },
      { icon: "/static/images/icon/guzhangfenxi@2x.png", label: "事故上报记录" },
      { icon: "/static/images/icon/guzhangfenxi@2x.png", label: "安全培训考核" },
    ];
    const filteredSafety = originalSafety.filter(item => {
      return allowedMenuTitles.has(item.label);
    });
    safetyItems.splice(0, safetyItems.length, ...filteredSafety);

    // è¿‡æ»¤äººåŠ›èµ„源菜单
    const originalHumanResources = [
      { icon: "/static/images/icon/caigoutaizhang@2x.png", label: "打卡签到" },
      { icon: "/static/images/icon/caigoutaizhang@2x.png", label: "人员薪资" },
    ];
    const filteredHumanResources = originalHumanResources.filter(item => {
      return allowedMenuTitles.has(item.label);
    });
    humanResourcesItems.splice(
      0,
      humanResourcesItems.length,
      ...filteredHumanResources
    );

    // è¿‡æ»¤ç”Ÿäº§ç®¡æŽ§èœå•
    const originalProduction = [
      {
        icon: "/static/images/icon/shengchanbaogong@2x.png",
        label: "生产报工",
        bgColor: "#673AB7",
      },
    ];
    const filteredProduction = originalProduction.filter(item => {
      return allowedMenuTitles.has(item.label);
    });
    productionItems.splice(0, productionItems.length, ...filteredProduction);

    // è¿‡æ»¤è®¾å¤‡ç®¡ç†èœå•
    const originalEquipment = [
      { icon: "/static/images/icon/shbeibaoxiu@2x.png", label: "运行管理" },
      { icon: "/static/images/icon/shbeibaoxiu@2x.png", label: "设备报修" },
      { icon: "/static/images/icon/shbeibaoyang@2x.png", label: "设备保养" },
      { icon: "/static/images/icon/xunjianshangchuan@2x.png", label: "巡检上传" },
    ];
    const filteredEquipment = originalEquipment.filter(item => {
      return allowedMenuTitles.has(item.label);
    });
    equipmentItems.splice(0, equipmentItems.length, ...filteredEquipment);
  };

  // æ£€æŸ¥æ¨¡å—是否有菜单项需要显示
  const hasMarketingItems = computed(() => marketingItems.length > 0);
  const hasPurchaseItems = computed(() => purchaseItems.length > 0);
  const hasCollaborationItems = computed(() => collaborationItems.length > 0);
  const hasSafetyItems = computed(() => safetyItems.length > 0);
  const hasHumanResourcesItems = computed(() => humanResourcesItems.length > 0);
  const hasProductionItems = computed(() => productionItems.length > 0);
  const hasEquipmentItems = computed(() => equipmentItems.length > 0);

  onMounted(() => {
    // è®¾ç½®ç”¨æˆ·ä¿¡æ¯
    userStore.getInfo();
    // æ¯æ¬¡è¿›å…¥é¦–页都强制刷新用户信息和路由权限，不做本地缓存判断
    userStore.getInfo().then(() => {
      userStore
        .getRouters()
        .then(() => {
          filterMenuItemsByRoutes();
        })
        .catch(error => {
          console.error("获取路由权限失败:", error);
        });
    });
    getUserLoginFacotryList();
    // å¯åŠ¨é€šçŸ¥çŠ¶æ€å®šæ—¶å™¨
    startStatusTimer();
@@ -936,7 +1049,7 @@
  .content {
    background: #f6f7fb;
    min-height: 100vh;
    padding: 12px;
    // padding: 12px;
    /* ä¸ºæ‰€æœ‰è®¾å¤‡è®¾ç½®åŸºç¡€padding-top（包含安全区） */
    padding-top: calc(env(safe-area-inset-top) + 30px);
    position: relative;
@@ -1010,6 +1123,7 @@
  }

  .hero-section {
    margin: 0 12px;
    margin-bottom: 12px;
    animation: fadeInUp 0.6s ease-out 0.1s both;
  }
@@ -1062,7 +1176,9 @@
  .hero-content {
    position: relative;
    z-index: 1;

    padding: 14px 14px 18px 14px;
    margin: 0 12px;
    height: 100%;
  }
  .hero-wave {
@@ -1238,7 +1354,7 @@
  .common-module {
    margin-bottom: 12px;
    background: linear-gradient(135deg, #ffffff 0%, #f9fbff 100%);
    border-radius: 14px;
    // border-radius: 14px;
    padding: 12px;
    box-shadow: 0 8px 22px rgba(17, 24, 39, 0.06);
    border: none;
@@ -1516,8 +1632,9 @@
  .common-module {
    margin-bottom: 12px;
    background: #ffffff;
    border-radius: 16px;
    padding: 12px;
    // border-radius: 16px;
    // padding: 0px;
    padding: 12px 0;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
    border: 1px solid rgba(148, 163, 184, 0.18);
    position: relative;
@@ -1566,7 +1683,8 @@
  }

  .module-header {
    margin-bottom: 10px;
    margin-bottom: 18px;
    padding-left: 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
@@ -1591,8 +1709,8 @@
  }

  .icon-container {
    width: 52px;
    height: 52px;
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: flex;
    align-items: center;
@@ -1639,9 +1757,9 @@
  }

  .item-label {
    font-size: 12px;
    font-size: 22rpx;
    margin-top: 4px;
    margin-bottom: 6px;
    margin-bottom: 20px;
  }
  .grid-text {
    font-size: 0.875rem;

 src/pages/indexItem.vue

@@ -56,15 +56,46 @@
    },
    {
      icon: "/static/images/icon/caigouguanli.png",
      label: "采购管理",
      label: "采购审批",
    },
    {
      icon: "/static/images/icon/baojiaguanli.png",
      label: "报价管理",
      label: "报价审批",
    },
    {
      icon: "/static/images/icon/chukuguanli@2x.png",
      label: "出库管理",
      label: "发货审批",
    },
  ]);
  // è€ƒå‹¤è´¢åŠ¡åˆå¹¶èœå•ï¼ˆè€ƒå‹¤3个 + è´¢åŠ¡4个 = 7个）
  const kaoqinCaiwu = reactive([
    {
      icon: "/static/images/icon/gongchuguanli@2x.png",
      label: "公出管理",
    },
    {
      icon: "/static/images/icon/qingjiaguanli@2x.png",
      label: "请假管理",
    },
    {
      icon: "/static/images/icon/chuchaiguanli@2x.png",
      label: "出差管理",
    },
    {
      icon: "/static/images/icon/baoxiaoguanli.png",
      label: "报销管理",
    },
    {
      icon: "/static/images/icon/caigouguanli.png",
      label: "采购审批",
    },
    {
      icon: "/static/images/icon/baojiaguanli.png",
      label: "报价审批",
    },
    {
      icon: "/static/images/icon/chukuguanli@2x.png",
      label: "发货审批",
    },
  ]);

@@ -183,17 +214,17 @@
          url: "/pages/cooperativeOffice/collaborativeApproval/index4",
        });
        break;
      case "采购管理":
      case "采购审批":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/collaborativeApproval/index5",
        });
        break;
      case "报价管理":
      case "报价审批":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/collaborativeApproval/index6",
        });
        break;
      case "出库管理":
      case "发货审批":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/collaborativeApproval/index7",
        });
@@ -350,6 +381,9 @@
        commonItems.value = huiyi;
      } else if (operationType.value === "财务管理") {
        commonItems.value = caiwu;
      } else if (operationType.value === "协同审批") {
        commonItems.value = kaoqinCaiwu;
        operationType.value = "协同审批";
      }
    }
    console.log(operationType.value);

 src/pages/login.vue

@@ -48,7 +48,11 @@
      icon: "none",
    });
  };
  import { userLoginFacotryList, updateClientId } from "@/api/login";
  import {
    userLoginFacotryList,
    updateClientId,
    getNoticeCount,
  } from "@/api/login";
  import { ref, onMounted } from "vue";
  import useUserStore from "@/store/modules/user";
  import { getWxCode } from "@/utils/geek";
@@ -160,14 +164,57 @@
  function loginSuccess(result) {
    // è®¾ç½®ç”¨æˆ·ä¿¡æ¯
    userStore.getInfo().then(res => {
      const userId = res.user.userId;
      // èŽ·å–路由权限
      userStore
        .getRouters()
        .then(() => {
          console.log("路由权限获取成功");
        })
        .catch(error => {
          console.error("获取路由权限失败:", error);
        });
      // ç™»å½•æˆåŠŸåŽï¼Œå°†å®¢æˆ·ç«¯æŽ¨é€æ ‡è¯†å‘送到服务器
      sendClientIdToServer();
      uni.switchTab({
        url: "/pages/index",
      });
      // å¯åŠ¨å®šæ—¶èŽ·å–未读消息数量的定时器
      startNoticeCountTimer(userId);
      uni.switchTab({ url: "/pages/index" });
    });
  }

  // å¯åŠ¨å®šæ—¶èŽ·å–未读消息数量的定时器
  function startNoticeCountTimer(userId) {
    // ç«‹å³èŽ·å–一次未读消息数量
    updateNoticeCount(userId);
    // è®¾ç½®å®šæ—¶å™¨ï¼Œæ¯30秒获取一次
    setInterval(() => {
      updateNoticeCount(userId);
    }, 30000);
  }

  // æ›´æ–°æœªè¯»æ¶ˆæ¯æ•°é‡
  function updateNoticeCount(userId) {
    getNoticeCount(userId)
      .then(res => {
        const count = res.data || 0;
        console.log("未读消息数量:", count);
        // æ›´æ–°tabbar的角标
        if (count > 0) {
          uni.setTabBarBadge({
            index: 1, // æ¶ˆæ¯æ ‡ç­¾é¡µçš„索引
            text: count.toString(),
          });
        } else {
          uni.removeTabBarBadge({
            index: 1,
          });
        }
      })
      .catch(error => {
        console.error("获取未读消息数量失败:", error);
      });
  }

  // å°†å®¢æˆ·ç«¯æŽ¨é€æ ‡è¯†å‘送到服务器
  function sendClientIdToServer() {
    // èŽ·å–本地存储的客户端标识

 src/pages/message.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,423 @@
<template>
  <view class="message-page">
    <!-- é¡µé¢å¤´éƒ¨ -->
    <!-- <PageHeader title="消息中心"
                :showBack="false" /> -->
    <!-- ç­›é€‰æ ‡ç­¾ -->
    <view class="tabs-container">
      <up-tabs v-model="activeTab"
               @change="handleTabChange"
               :list="tabList"
               :current="activeTab"
               itemStyle="width: 50%;height: 80rpx;"></up-tabs>
    </view>
    <!-- æ¶ˆæ¯åˆ—表 -->
    <scroll-view class="message-list"
                 scroll-y="true"
                 refresher-enabled="true"
                 :refresher-triggered="triggered"
                 :refresher-threshold="100"
                 refresher-background="#f5f7fa"
                 @refresherrefresh="onRefresh"
                 @scrolltolower="loadMore">
      <!-- åŠ è½½çŠ¶æ€ -->
      <view v-if="loading"
            class="loading-state">
        <text class="loading-text">加载中...</text>
      </view>
      <!-- æ¶ˆæ¯åˆ—表 -->
      <view v-else
            v-for="(item) in messageList"
            :key="item.id"
            class="message-item"
            :class="{ 'unread': !item.read }">
        <view class="message-content">
          <view class="message-header">
            <text class="message-title">{{ item.noticeTitle }}</text>
            <text class="message-time">{{ formatTime(item.createTime) }}</text>
          </view>
          <text class="message-desc">{{ item.noticeContent }}</text>
          <view class="message-footer">
            <text class="message-view"
                  @click="goToDetail(item)">
              åŽ»æŸ¥çœ‹ >
            </text>
          </view>
        </view>
      </view>
      <!-- ç©ºçŠ¶æ€ -->
      <view v-if="!loading && messageList.length === 0"
            class="empty-state">
        <text class="empty-text">暂无消息</text>
      </view>
      <!-- åŠ è½½æ›´å¤šçŠ¶æ€ -->
      <view v-if="loadingMore"
            class="loading-more-state">
        <text class="loading-more-text">加载更多...</text>
      </view>
    </scroll-view>
  </view>
</template>

<script setup>
  import { ref, reactive, onMounted } from "vue";
  import { listNotice } from "@/api/login.js";
  import useUserStore from "@/store/modules/user";

  // æ ‡ç­¾é¡µæ•°æ®
  const tabList = [
    { name: "未读", id: 0 },
    { name: "已读", id: 1 },
  ];

  // å½“前激活的标签
  const activeTab = ref(0);

  // æ¶ˆæ¯åˆ—表数据
  const messageList = ref([]);
  const loading = ref(false);
  const loadingMore = ref(false);
  const total = ref(0);
  const triggered = ref(false);

  // åˆ†é¡µå‚æ•°
  const page = reactive({
    current: 1,
    size: 10,
  });

  // æ ¼å¼åŒ–时间
  const formatTime = time => {
    if (!time) return "";
    const date = new Date(time);
    const Y = date.getFullYear();
    const M = String(date.getMonth() + 1).padStart(2, "0");
    const D = String(date.getDate()).padStart(2, "0");
    const h = String(date.getHours()).padStart(2, "0");
    const m = String(date.getMinutes()).padStart(2, "0");
    return `${Y}-${M}-${D} ${h}:${m}`;
  };

  // è·³è½¬åˆ°è¯¦æƒ…页
  const goToDetail = item => {
    if (item.appJumpPath.indexOf("/") === 0) {
      uni.navigateTo({
        url: item.appJumpPath,
      });
    } else {
      uni.navigateTo({
        url: "/" + item.appJumpPath,
      });
    }
  };
  const userStore = useUserStore();
  const userId = ref("");
  const getUserId = () => {
    return userStore.getInfo().then(res => {
      console.log(res.user.userId, "res@@@@@@@@@@@2");
      userId.value = res.user.userId;
    });
  };

  // å¤„理标签页切换
  const handleTabChange = val => {
    console.log(val);
    activeTab.value = val.id;
    page.current = 1;
    loadMessages(false);
  };

  // åŠ è½½æ¶ˆæ¯åˆ—表
  const loadMessages = (append = false) => {
    if (append) {
      loadingMore.value = true;
    } else {
      loading.value = true;
    }

    // æž„建查询参数
    const params = {
      consigneeId: userId.value,
      current: page.current,
      size: page.size,
      status: activeTab.value,
    };
    console.log(params, "===========");
    return listNotice(params)
      .then(res => {
        const records = res?.data?.records || [];
        total.value = res?.data?.total || 0;

        if (append) {
          messageList.value = [...messageList.value, ...records];
        } else {
          messageList.value = records;
        }
      })
      .catch(error => {
        console.error("获取消息失败:", error);
        uni.showToast({ title: "获取消息失败，请重试", icon: "none" });
      })
      .finally(() => {
        loading.value = false;
        loadingMore.value = false;
      });
  };

  // åŠ è½½æ›´å¤š
  const loadMore = () => {
    console.log("===========");
    if (loading.value || loadingMore.value) return;
    if (messageList.value.length >= total.value) return;

    page.current++;
    loadMessages(true);
  };

  // ä¸‹æ‹‰åˆ·æ–°
  const onRefresh = () => {
    triggered.value = true;
    // é‡ç½®é¡µç 
    page.current = 1;
    // é‡æ–°åŠ è½½æ¶ˆæ¯
    loadMessages(false).finally(() => {
      // å…³é—­åˆ·æ–°çŠ¶æ€
      setTimeout(() => {
        triggered.value = false;
      }, 500);
    });
  };

  // é¡µé¢åŠ è½½æ—¶èŽ·å–消息列表
  onMounted(() => {
    getUserId().then(() => {
      loadMessages();
    });
  });
</script>

<style scoped lang="scss">
  // å…¨å±€å˜é‡
  $primary-color: #2c7be5;
  $primary-light: #4a90e2;
  $success-color: #4cd964;
  $warning-color: #ff9500;
  $danger-color: #ff3b30;
  $text-primary: #333333;
  $text-secondary: #666666;
  $text-tertiary: #999999;
  $bg-color: #f5f7fa;
  $card-bg: #ffffff;
  $border-color: #e8e8e8;
  $shadow-sm: 0 2rpx 8rpx rgba(0, 0, 0, 0.08);

  .message-page {
    min-height: 100vh;
    background-color: $bg-color;
    padding-bottom: 30rpx;
  }

  /* æ ‡ç­¾é¡µå®¹å™¨ */
  .tabs-container {
    background-color: #ffffff;
    margin-bottom: 20rpx;
    box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.08);
  }

  /* æ¶ˆæ¯åˆ—表 */
  .message-list {
    margin: 0 20rpx 20rpx;
    min-height: 600rpx;
    height: calc(100vh - 200rpx);
  }

  /* åŠ è½½çŠ¶æ€ */
  .loading-state {
    background-color: $card-bg;
    border-radius: 16rpx;
    box-shadow: $shadow-sm;
    text-align: center;
    padding: 120rpx 0;
    margin-bottom: 20rpx;
  }

  .loading-text {
    font-size: 14px;
    color: $text-tertiary;
    margin-top: 24rpx;
    font-weight: 500;
  }

  /* æ¶ˆæ¯é¡¹ */
  .message-item {
    display: flex;
    align-items: flex-start;
    background-color: $card-bg;
    border-radius: 16rpx;
    box-shadow: $shadow-sm;
    padding: 24rpx;
    margin-bottom: 20rpx;
    margin-right: 40rpx;
    transition: all 0.3s ease;
  }

  .message-item:hover {
    box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.12);
    transform: translateY(-2rpx);
  }

  .message-item.unread {
    border-left: 4rpx solid $primary-color;
  }

  /* æ¶ˆæ¯å›¾æ ‡ */
  .message-icon {
    margin-right: 20rpx;
    margin-top: 4rpx;
  }

  /* æ¶ˆæ¯å†…容 */
  .message-content {
    flex: 1;
  }

  /* æ¶ˆæ¯å¤´éƒ¨ */
  .message-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12rpx;
  }

  .message-title {
    font-size: 16px;
    font-weight: 600;
    color: $text-primary;
    flex: 1;
    margin-right: 20rpx;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .message-time {
    font-size: 12px;
    color: $text-tertiary;
  }

  /* æ¶ˆæ¯æè¿° */
  .message-desc {
    font-size: 14px;
    color: $text-secondary;
    line-height: 1.4;
    margin-bottom: 16rpx;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* æ¶ˆæ¯åº•éƒ¨ */
  .message-footer {
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }

  .message-creator {
    font-size: 12px;
    color: $text-tertiary;
  }

  /* ç©ºçŠ¶æ€ */
  .empty-state {
    background-color: $card-bg;
    border-radius: 16rpx;
    box-shadow: $shadow-sm;
    text-align: center;
    padding: 160rpx 0;
    margin: 40rpx 0;
  }

  .empty-text {
    font-size: 14px;
    color: $text-tertiary;
    margin-top: 24rpx;
    font-weight: 500;
  }

  /* åŠ è½½æ›´å¤šçŠ¶æ€ */
  .loading-more-state {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30rpx 0;
    margin-top: 10rpx;
  }

  .loading-more-text {
    font-size: 14px;
    color: $text-tertiary;
    margin-left: 10rpx;
  }

  /* åŠ è½½æ›´å¤š */
  .load-more {
    text-align: center;
    padding: 30rpx 0;
    font-size: 14px;
    color: $primary-color;
    font-weight: 500;
    margin-top: 20rpx;
  }

  .load-more-text {
    display: inline-block;
    padding: 10rpx 30rpx;
    background-color: rgba($primary-color, 0.1);
    border-radius: 20rpx;
    transition: all 0.3s ease;
  }

  .load-more-text:hover {
    background-color: rgba($primary-color, 0.2);
    transform: translateY(-2rpx);
  }

  /* åŠ¨ç”»æ•ˆæžœ */
  @keyframes fadeInUp {
    from {
      opacity: 0;
      transform: translateY(20rpx);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  .message-item {
    animation: fadeInUp 0.3s ease-out;
  }

  .message-item:nth-child(2) {
    animation-delay: 0.1s;
  }

  .message-item:nth-child(3) {
    animation-delay: 0.2s;
  }

  .message-item:nth-child(4) {
    animation-delay: 0.3s;
  }

  .message-item:nth-child(5) {
    animation-delay: 0.4s;
  }
  .message-view {
    float: right;
    color: $primary-color;
  }
</style>

 src/pages/safeProduction/emergencyPlanReview/index.vue

@@ -1,7 +1,7 @@
<template>
  <view class="emergency-plan-review">
    <!-- ä½¿ç”¨é€šç”¨é¡µé¢å¤´éƒ¨ç»„件 -->
    <PageHeader title="应急预案审核"
    <PageHeader title="应急预案查阅"
                @back="goBack" />
    <!-- æœç´¢å’Œç­›é€‰åŒºåŸŸ -->
    <view class="search-section">

 src/pages_template/pages/login/index2.vue

@@ -199,9 +199,16 @@
  // ç™»å½•æˆåŠŸåŽï¼Œå¤„理函数
  const loginSuccess = result => {
    // è®¾ç½®ç”¨æˆ·ä¿¡æ¯
    useUserStore()
    const userStore = useUserStore();
    userStore
      .getInfo()
      .then(res => {
        // èŽ·å–路由权限
        userStore.getRouters().then(() => {
          console.log("路由权限获取成功");
        }).catch(error => {
          console.error("获取路由权限失败:", error);
        });
        // ç™»å½•æˆåŠŸåŽï¼Œå°†å®¢æˆ·ç«¯æŽ¨é€æ ‡è¯†å‘送到服务器
        sendClientIdToServer();
        tab.reLaunch("/pages/index");

 src/store/modules/user.ts

@@ -1,4 +1,5 @@
import {logout, getInfo, loginCheckFactory} from "@/api/login";
import { getRouters as getRoutersApi } from "@/api/menu";
import { getToken, setToken, removeToken } from "@/utils/auth";
import defAva from "@/static/images/profile.jpg";
import { defineStore } from "pinia";
@@ -22,6 +23,7 @@
    currentLoginTime: "",
    roles: Array(),
    permissions: [],
    routers: [], // è·¯ç”±æƒé™æ•°æ®
  }),
  actions: {
    // éƒ¨é—¨ç™»å½•
@@ -75,6 +77,7 @@
            this.token = "";
            this.roles = [];
            this.permissions = [];
            this.routers = [];
            this.name = "";
            this.avatar = "";
            removeToken();
@@ -95,6 +98,20 @@
      const seconds = String(now.getSeconds()).padStart(2, '0');  // ç§’数补零
      return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
    },
    // èŽ·å–路由权限
    getRouters() {
      return new Promise((resolve, reject) => {
        getRoutersApi()
          .then((res: any) => {
            // å­˜å‚¨è·¯ç”±æƒé™æ•°æ®
            this.routers = res.data || [];
            resolve(res);
          })
          .catch((error) => {
            reject(error);
          });
      });
    },
  },
});