Browse Source

feat: 新增薪资管理页面,修改钉钉端周日报样式

qiny 1 year ago
parent
commit
512d12baf8

+ 8 - 0
client/src/router/modules/remaining.ts

@@ -320,6 +320,14 @@ const remainingRouter: AppRouteRecordRaw[] = [
         meta: {
         meta: {
           title: '客户详情'
           title: '客户详情'
         }
         }
+      },
+      {
+        path: 'salaryManagement',
+        component: () => import('@/views/OaSystem/salaryManagement/Manage/index.vue'),
+        name: 'salaryManagement',
+        meta: {
+          title: '薪资管理'
+        }
       }
       }
     ]
     ]
   },
   },

+ 155 - 0
client/src/views/OaSystem/salaryManagement/Manage/index.vue

@@ -0,0 +1,155 @@
+<template>
+  <div class="oa-sys-list-view">
+    <div class="title">薪资管理</div>
+    <div class="searchBox">
+      <div class="form">
+        <span class="formSpan">月份:</span>
+        <el-date-picker
+          v-model="queryParams.date"
+          type="month"
+          placeholder="请选择月份"
+          :clearable="false"
+        />
+      </div>
+      <div class="dept-and-user">
+        <DeptAndUserSelect :deptOnChange="deptOnChange" :userOnChange="userOnChange" />
+      </div>
+      <div class="from">
+        <div class="btnBox">
+          <el-button type="primary" style="background: #3485ff" @click="onSearchHandle">
+            <img src="@/assets/imgs/OA/search.png" class="mr-8px" alt="" />
+            查询</el-button
+          >
+          <el-button type="primary" style="background: #3485ff" @click="openModel">
+            导入工资表</el-button
+          >
+          <el-button type="primary" style="background: #3485ff" @click="() => {}">
+            模版下载</el-button
+          >
+        </div>
+      </div>
+      <TemplateImport />
+    </div>
+    <div class="infoBox">
+      <ul>
+        <li v-for="(item, index) in infoList" :key="index" class="mr-40px">
+          <p>{{ item.name }}:</p>
+          <h4 class="font-size-18px">{{ item.num.toFixed(2) }}</h4>
+        </li>
+      </ul>
+    </div>
+    <div class="tableBox">
+      <div class="table">
+        <el-table :data="[]" style="width: 100%">
+          <el-table-column label="序号" width="60">
+            <template #default="scope">{{ scope.$index + 1 }}</template>
+          </el-table-column>
+          <el-table-column prop="dept" label="部门" />
+          <el-table-column prop="name" label="姓名" />
+          <el-table-column prop="JBGZ" label="基本工资 单位:元" width="100" />
+          <el-table-column prop="JXGZ" label="绩效工资 单位:元" width="100" />
+          <el-table-column prop="YDJX" label="绩效考核 单位:元" width="100" />
+          <el-table-column prop="CT" label="餐贴 单位:元" />
+          <el-table-column prop="GWBT" label="高温补贴 单位:元" width="100" />
+          <el-table-column prop="other" label="其他(含加班费)" />
+          <el-table-column prop="KQKK" label="考勤扣款 单位:元" width="100" />
+          <el-table-column prop="YFGG" label="应发工资 单位:元" width="100" />
+          <el-table-column prop="SBJS" label="社保代扣基数 单位:元" />
+          <el-table-column prop="GJJJS" label="公积金代扣基数 单位:元" />
+          <el-table-column prop="YLJ" label="养老险 单位:元" />
+          <el-table-column prop="YLY" label="医疗险 单位:元" />
+          <el-table-column prop="SYX" label="失业险 单位:元" />
+          <el-table-column prop="GJJ" label="公积金 单位:元" />
+          <el-table-column prop="YXKC" label="允许扣除 单位:元" width="100" />
+          <el-table-column prop="YJGS" label="应缴个税 单位:元" width="100" />
+          <el-table-column prop="SFGZ" label="实发工资 单位:元" width="100" />
+        </el-table>
+      </div>
+      <div class="pageBox">
+        <el-pagination
+          :page-size="20"
+          background
+          layout="total, prev, pager, next"
+          :total="pageTotal"
+          :current-page="pageNo"
+          @current-change="currentChange"
+        />
+      </div>
+    </div>
+  </div>
+</template>
+<script lang="ts" setup>
+import moment from 'moment'
+import DeptAndUserSelect from '@/components/DeptAndUserSelect/index.vue'
+import TemplateImport from '../components/TemplateImport.vue'
+import PubsubService from '@/utils/PubsubService'
+
+/**
+ * @description 薪资管理
+ */
+const queryParams = reactive<any>({
+  date: moment().format('YYYY-MM'),
+  dept: '',
+  user: ''
+})
+const openModel = () => {
+  PubsubService.publish('TemplateImport-showDialog', () => {})
+}
+const pageNo = ref(1)
+const pageTotal = ref(0)
+const infoList: any = ref([
+  {
+    name: '应发总人数',
+    num: 0
+  },
+  {
+    name: '应发总金额',
+    num: 0
+  }
+])
+
+// 部门及人员变化时触发
+const deptOnChange = (val: any) => {
+  console.log('deptOnChange', val)
+  queryParams.dept = val
+}
+const userOnChange = (val: any) => {
+  console.log('deptOnChange', val)
+  queryParams.user = val
+}
+
+// 查询
+const onSearchHandle: () => void = () => {
+  console.log('queryParams', queryParams)
+}
+
+// 切换页面
+const currentChange = (page) => {
+  pageNo.value = page
+}
+</script>
+<style scoped lang="scss">
+.oa-sys-list-view {
+  .title {
+    height: 32px;
+    font-weight: bold;
+    font-size: 24px;
+    color: #121518;
+    margin-bottom: 20px;
+  }
+  .formSpan {
+    width: auto !important;
+  }
+  .dept-and-user {
+    width: 560px;
+    height: 100%;
+    margin-right: 40px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    :deep(.el-form-item) {
+      margin-bottom: 0 !important;
+    }
+  }
+}
+</style>

+ 53 - 0
client/src/views/OaSystem/salaryManagement/components/TemplateImport.vue

@@ -0,0 +1,53 @@
+<template>
+  <el-dialog title="导入工资表" v-model="dialogVisible" width="500px" :show-close="false">
+    <el-form :model="formData" label-width="100px">
+      <el-form-item label="选择导入月份">
+        <el-date-picker
+          v-model="importDate"
+          type="month"
+          placeholder="请选择月份"
+          :clearable="false"
+        />
+      </el-form-item>
+      <el-form-item label="选择导入文件">
+        <el-input v-model="formData.file" />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="onClose">取消</el-button>
+        <el-button type="primary" @click="submitForm">导入</el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+<script lang="ts" setup>
+import { ref } from 'vue'
+import moment from 'moment'
+import PubsubService from '@/utils/PubsubService'
+
+/**
+ * @description 导入模板
+ */
+
+onMounted(() => {
+  // 订阅打开弹窗事件
+  PubsubService.subscribe('TemplateImport-showDialog', () => {
+    dialogVisible.value = true
+  })
+})
+
+const dialogVisible = ref(false)
+const formData = ref({
+  file: ''
+})
+const importDate = moment().format('YYYY-MM')
+const onClose = () => {
+  dialogVisible.value = false
+}
+const submitForm = () => {
+  console.log('submit')
+  dialogVisible.value = false
+}
+</script>
+<style scoped lang="scss"></style>

+ 15 - 1
client_h5/src/pages/myLogs/Daily/MyLogs.vue

@@ -2,6 +2,7 @@
   <div class="log-calendar">
   <div class="log-calendar">
     <van-calendar
     <van-calendar
       title="手机端仅能查看近两个月填报情况"
       title="手机端仅能查看近两个月填报情况"
+      :show-title="true"
       :poppable="false"
       :poppable="false"
       :show-confirm="false"
       :show-confirm="false"
       :style="{ height: '500px' }"
       :style="{ height: '500px' }"
@@ -33,8 +34,15 @@ onMounted(async () => {
 // 格式化日历
 // 格式化日历
 const formatter = (day: any) => {
 const formatter = (day: any) => {
   const date = moment(day.date).format("YYYY-MM-DD");
   const date = moment(day.date).format("YYYY-MM-DD");
-  if (logObj.value[date]) {
+  if (moment(day.date).isAfter(moment())) {
+    // 如果未到,不做处理
+    day.topInfo = "";
+  } else if (logObj.value[date]) {
     day.topInfo = "已填";
     day.topInfo = "已填";
+    day.className = "filled-in";
+  } else {
+    day.topInfo = "未填";
+    day.className = "not-fill";
   }
   }
   return day;
   return day;
 };
 };
@@ -54,4 +62,10 @@ const jumpDetail = (day: any) => {
 .log-calendar {
 .log-calendar {
   padding: 20px 10px;
   padding: 20px 10px;
 }
 }
+:deep(.filled-in) {
+  color: #1989fa;
+}
+:deep(.not-fill) {
+  color: red;
+}
 </style>
 </style>

+ 1 - 0
client_h5/src/pages/myLogs/Daily/index.vue

@@ -21,6 +21,7 @@
     <ProjectList type="daily" :onChange="projectChange" />
     <ProjectList type="daily" :onChange="projectChange" />
     <div class="title">接收人</div>
     <div class="title">接收人</div>
     <SelectUser v-model="formData.receiveUserIds" />
     <SelectUser v-model="formData.receiveUserIds" />
+    <div class="blank-line"></div>
     <van-button round type="primary" block class="send-btn" @click="onSubmit"
     <van-button round type="primary" block class="send-btn" @click="onSubmit"
       >发送</van-button
       >发送</van-button
     >
     >

+ 1 - 0
client_h5/src/pages/myLogs/Weekly/index.vue

@@ -27,6 +27,7 @@
     <ProjectList type="weekly" :onChange="projectChange" />
     <ProjectList type="weekly" :onChange="projectChange" />
     <div class="title">接收人</div>
     <div class="title">接收人</div>
     <SelectUser v-model="formData.receiveUserIds" />
     <SelectUser v-model="formData.receiveUserIds" />
+    <div class="blank-line"></div>
     <van-button round type="primary" block class="send-btn" @click="onSubmit"
     <van-button round type="primary" block class="send-btn" @click="onSubmit"
       >发送</van-button
       >发送</van-button
     >
     >

+ 2 - 2
client_h5/src/pages/myLogs/http.ts

@@ -100,8 +100,8 @@ export const http = {
       request.get(api.logList, {
       request.get(api.logList, {
         params: {
         params: {
           reportType: type,
           reportType: type,
-          reportYear: nearThreeMonth[1].reportYear,
-          reportMonth: nearThreeMonth[1].reportMonth,
+          reportYear: nearThreeMonth[2].reportYear,
+          reportMonth: nearThreeMonth[2].reportMonth,
           userId: userInfo.id ?? "",
           userId: userInfo.id ?? "",
         },
         },
       }),
       }),

+ 8 - 1
client_h5/src/pages/myLogs/page.scss

@@ -6,9 +6,11 @@
   box-sizing: border-box;
   box-sizing: border-box;
   .timer {
   .timer {
     :deep(.van-cell__title) {
     :deep(.van-cell__title) {
-      color: #323233;
+      width: 70px !important;
       font-size: 14px;
       font-size: 14px;
       font-weight: 600;
       font-weight: 600;
+      color: #323233;
+      flex: none !important;
     }
     }
   }
   }
 
 
@@ -120,4 +122,9 @@
       }
       }
     }
     }
   }
   }
+
+  // 差劲的空格样式
+  .blank-line {
+    height: 100px;
+  }
 }
 }

+ 1 - 0
client_h5/src/pages/myLogs/service.ts

@@ -122,6 +122,7 @@ export const setWorkDayListToWeek = (data: any) => {
       };
       };
     }
     }
   });
   });
+  // console.log("weekObj", weekObj);
   return weekObj;
   return weekObj;
 };
 };
 // 处理数据,将工作周划分和周日报填报情况进行合并
 // 处理数据,将工作周划分和周日报填报情况进行合并

+ 3 - 2
client_h5/src/utils/tools.ts

@@ -7,11 +7,12 @@ export const getUserInfo = () => {
   // 先模拟数据
   // 先模拟数据
   const userInfo = {
   const userInfo = {
     id: "ea81aaf2-74fe-429f-acaa-25a9a898abcf",
     id: "ea81aaf2-74fe-429f-acaa-25a9a898abcf",
-    nickname: "源",
+    nickname: "管理源",
     avatar:
     avatar:
       "https://static-legacy.dingtalk.com/media/lQLPM44eP2eGrFfNAxjNAxiwthCI7LPuiz0FRw-0RwC5AA_792_792.png",
       "https://static-legacy.dingtalk.com/media/lQLPM44eP2eGrFfNAxjNAxiwthCI7LPuiz0FRw-0RwC5AA_792_792.png",
     deptId: "264",
     deptId: "264",
     deptName: "数智产业研发部",
     deptName: "数智产业研发部",
   };
   };
-  return userInfo;
+  // 从localStorage中获取用户信息并返回
+  return JSON.parse(localStorage.getItem("_userInfo") as string) ?? userInfo;
 };
 };