人员薪资

zhangwencui

3 天以前 c61bc857b627a58cd741207cb9e93d8e446e357e

人员薪资

 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

@@ -858,18 +858,32 @@
      }
    },
    {
      "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"
      }
    }
  ],
  "subPackages": [

 src/pages/humanResources/attendance/checkin.vue

ÎļþÃû´Ó src/pages/attendance/checkin.vue ÐÞ¸Ä
@@ -186,7 +186,7 @@
  // å¯¼èˆªåˆ°è¯¦ç»†æŠ¥å‘Šé¡µé¢
  const navigateToReport = () => {
    uni.navigateTo({
      url: "/pages/attendance/report",
      url: "/pages/humanResources/attendance/report",
    });
  };


 src/pages/humanResources/attendance/report.vue

 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

@@ -454,29 +454,29 @@
      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",
      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",
    // },
  ]);

  // å¤„理常用功能点击
@@ -769,7 +769,12 @@
        break;
      case "打卡签到":
        uni.navigateTo({
          url: "/pages/attendance/checkin",
          url: "/pages/humanResources/attendance/checkin",
        });
        break;
      case "人员薪资":
        uni.navigateTo({
          url: "/pages/humanResources/monthlyStatistics/index",
        });
        break;
      default: