From db42d47f5692ef64e5436c5a6d29dcb537b44596 Mon Sep 17 00:00:00 2001
From: zouyu <2723363702@qq.com>
Date: 星期一, 26 一月 2026 16:36:13 +0800
Subject: [PATCH] 浪潮对接单点登录:mis调整
---
src/views/personnelManagement/selfService/index.vue | 800 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 800 insertions(+), 0 deletions(-)
diff --git a/src/views/personnelManagement/selfService/index.vue b/src/views/personnelManagement/selfService/index.vue
new file mode 100644
index 0000000..647f149
--- /dev/null
+++ b/src/views/personnelManagement/selfService/index.vue
@@ -0,0 +1,800 @@
+<template>
+ <div class="app-container self-service-container">
+
+ <!-- 鍔熻兘瀵艰埅鍗＄墖 -->
+ <el-row :gutter="20" class="nav-cards">
+ <el-col :span="6" v-for="(item, index) in navItems" :key="index">
+ <el-card class="nav-card" @click="handleNavClick(item.type)">
+ <div class="nav-content">
+ <el-icon :size="40" class="nav-icon">
+ <component :is="item.icon" />
+ </el-icon>
+ <h3>{{ item.title }}</h3>
+ <p>{{ item.desc }}</p>
+ </div>
+ </el-card>
+ </el-col>
+ </el-row>
+
+ <!-- 涓昏鍐呭鍖哄煙 -->
+ <div class="main-content">
+ <!-- 鑰冨嫟璁板綍 -->
+ <el-card v-if="currentView === 'attendance'" class="content-card">
+ <template #header>
+ <div class="card-header">
+ <span>涓汉鑰冨嫟璁板綍</span>
+ <el-button type="primary" @click="addAttendanceRecord">鏂板璁板綍</el-button>
+ </div>
+ </template>
+ <el-table :data="attendanceData" style="width: 100%" :loading="tableLoading">
+ <el-table-column prop="date" label="鏃ユ湡" />
+ <el-table-column prop="checkIn" label="绛惧埌鏃堕棿" />
+ <el-table-column prop="checkOut" label="绛鹃��鏃堕棿" />
+ <el-table-column prop="workHours" label="宸ヤ綔鏃堕暱" width="100" />
+ <el-table-column prop="status" label="鐘舵��" width="100">
+ <template #default="scope">
+ <el-tag :type="scope.row.status === '姝ｅ父' ? 'success' : 'danger'">
+ {{ scope.row.status }}
+ </el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column label="鎿嶄綔" width="150">
+ <template #default="scope">
+ <el-button size="small" @click="editAttendanceRecord(scope.row)">缂栬緫</el-button>
+ <el-button size="small" type="danger" @click="deleteAttendanceRecord(scope.row)">鍒犻櫎</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ </el-card>
+
+ <!-- 钖祫鍗� -->
+ <el-card v-if="currentView === 'salary'" class="content-card">
+ <template #header>
+ <div class="card-header">
+ <span>钖祫鍗曟煡璇�</span>
+ <el-date-picker v-model="payDateStr" type="month" placeholder="閫夋嫨鏈堜唤" value-format="YYYY-MM" format="YYYY-MM" @change="changMonth"/>
+ </div>
+ </template>
+ <el-table :data="salaryData" style="width: 100%">
+ <el-table-column prop="payDate" label="鏈堜唤" />
+ <el-table-column prop="basicSalary" label="鍩烘湰宸ヨ祫" />
+ <el-table-column prop="bonus" label="濂栭噾" />
+ <el-table-column prop="deduction" label="鎵ｆ" />
+ <el-table-column prop="actualWages" label="瀹炲彂宸ヨ祫" />
+ <el-table-column prop="status" label="鐘舵��" >
+ <template #default="scope">
+ <el-tag :type="scope.row.status === '宸插彂鏀�' ? 'success' : 'warning'">
+ {{ scope.row.status }}
+ </el-tag>
+ </template>
+ </el-table-column>
+ </el-table>
+ </el-card>
+
+ <!-- 鍋囨湡鐢宠 -->
+ <el-card v-if="currentView === 'leave'" class="content-card">
+ <template #header>
+ <div class="card-header">
+ <span>鍋囨湡鐢宠绠＄悊</span>
+ <el-button type="primary" @click="openLeaveForm">鐢宠鍋囨湡</el-button>
+ </div>
+ </template>
+ <el-table :data="leaveData" style="width: 100%">
+ <el-table-column prop="type" label="鍋囨湡绫诲瀷" />
+ <el-table-column prop="startDate" label="寮�濮嬫棩鏈�" />
+ <el-table-column prop="endDate" label="缁撴潫鏃ユ湡" />
+ <el-table-column prop="days" label="澶╂暟" width="80" />
+ <el-table-column prop="reason" label="鐢宠鍘熷洜" />
+ <el-table-column prop="status" label="瀹℃壒鐘舵��" width="100">
+ <template #default="scope">
+ <el-tag :type="getStatusType(scope.row.status)">
+ {{ scope.row.status }}
+ </el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column label="鎿嶄綔" width="150">
+ <template #default="scope">
+ <el-button size="small" @click="editLeaveRecord(scope.row)">缂栬緫</el-button>
+ <el-button size="small" type="danger" @click="deleteLeaveRecord(scope.row)">鍒犻櫎</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ </el-card>
+
+ <!-- 涓汉淇℃伅 -->
+ <el-card v-if="currentView === 'profile'" class="content-card">
+ <template #header>
+ <div class="card-header">
+ <span>涓汉淇℃伅缁存姢</span>
+ <el-button type="primary" @click="editProfileForm">缂栬緫淇℃伅</el-button>
+ </div>
+ </template>
+ <el-descriptions :column="2" border>
+ <el-descriptions-item label="濮撳悕">{{ profile.name }}</el-descriptions-item>
+ <el-descriptions-item label="宸ュ彿">{{ profile.employeeId }}</el-descriptions-item>
+ <el-descriptions-item label="閮ㄩ棬">{{ profile.department }}</el-descriptions-item>
+ <el-descriptions-item label="鑱屼綅">{{ profile.position }}</el-descriptions-item>
+ <el-descriptions-item label="鍏ヨ亴鏃ユ湡">{{ profile.hireDate }}</el-descriptions-item>
+ <el-descriptions-item label="鑱旂郴鐢佃瘽">{{ profile.phone }}</el-descriptions-item>
+ <el-descriptions-item label="閭">{{ profile.email }}</el-descriptions-item>
+ <el-descriptions-item label="鍦板潃">{{ profile.adress }}</el-descriptions-item>
+ </el-descriptions>
+ </el-card>
+ </div>
+
+ <!-- 鍋囨湡鐢宠寮圭獥 -->
+ <el-dialog v-model="showLeaveDialog" :title="leaveOperationType === 'add' ? '鐢宠鍋囨湡' : '缂栬緫鍋囨湡'" width="500px">
+ <el-form :model="leaveForm" label-width="100px">
+ <el-form-item label="鍋囨湡绫诲瀷">
+ <el-select v-model="leaveForm.type" placeholder="璇烽�夋嫨鍋囨湡绫诲瀷">
+ <el-option label="骞村亣" value="骞村亣" />
+ <el-option label="鐥呭亣" value="鐥呭亣" />
+ <el-option label="璋冧紤" value="璋冧紤" />
+ <el-option label="浜嬪亣" value="浜嬪亣" />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="寮�濮嬫棩鏈�">
+ <el-date-picker v-model="leaveForm.startDate" type="date" placeholder="閫夋嫨寮�濮嬫棩鏈�" />
+ </el-form-item>
+ <el-form-item label="缁撴潫鏃ユ湡">
+ <el-date-picker v-model="leaveForm.endDate" type="date" placeholder="閫夋嫨缁撴潫鏃ユ湡" />
+ </el-form-item>
+ <el-form-item label="鐢宠鍘熷洜">
+ <el-input v-model="leaveForm.reason" type="textarea" rows="3" />
+ </el-form-item>
+ <!-- <el-form-item label="瀹℃壒鐘舵��">
+ <el-select v-model="leaveForm.status" placeholder="璇烽�夋嫨瀹℃壒鐘舵��">
+ <el-option label="瀹℃壒涓�" value="瀹℃壒涓�" />
+ <el-option label="宸查�氳繃" value="宸查�氳繃" />
+ <el-option label="宸叉嫆缁�" value="宸叉嫆缁�" />
+ </el-select>
+ </el-form-item> -->
+ </el-form>
+ <template #footer>
+ <el-button @click="showLeaveDialog = false">鍙栨秷</el-button>
+ <el-button type="primary" @click="submitLeaveApplication">鎻愪氦鐢宠</el-button>
+ </template>
+ </el-dialog>
+
+ <!-- 鏂板-缂栬緫鑰冨嫟璁板綍寮圭獥 -->
+ <el-dialog v-model="showAttendanceDialog" :title="operationType === 'add' ? '鏂板鑰冨嫟璁板綍' : '缂栬緫鑰冨嫟璁板綍'" width="500px">
+ <el-form :model="attendanceForm" :rules="attendanceRules" ref="attendanceFormRef" label-width="100px">
+ <el-form-item label="鏃ユ湡" prop="date">
+ <el-date-picker v-model="attendanceForm.date" type="date" value-format="YYYY-MM-DD" format="YYYY-MM-DD" placeholder="閫夋嫨鏃ユ湡" />
+ </el-form-item>
+ <el-form-item label="绛惧埌鏃堕棿" prop="checkIn">
+ <el-time-picker v-model="attendanceForm.checkIn" placeholder="閫夋嫨绛惧埌鏃堕棿" format="HH:mm" value-format="HH:mm" />
+ </el-form-item>
+ <el-form-item label="绛鹃��鏃堕棿" prop="checkOut">
+ <el-time-picker v-model="attendanceForm.checkOut" placeholder="閫夋嫨绛鹃��鏃堕棿" format="HH:mm" value-format="HH:mm" />
+ </el-form-item>
+ <el-form-item label="鐘舵��" prop="status">
+ <el-select v-model="attendanceForm.status" placeholder="璇烽�夋嫨鐘舵��">
+ <el-option label="姝ｅ父" value="姝ｅ父" />
+ <el-option label="杩熷埌" value="杩熷埌" />
+ <el-option label="鏃╅��" value="鏃╅��" />
+ <el-option label="缂哄嫟" value="缂哄嫟" />
+ </el-select>
+ </el-form-item>
+ </el-form>
+ <template #footer>
+ <el-button @click="showAttendanceDialog = false">鍙栨秷</el-button>
+ <el-button type="primary" @click="submitAttendance">鎻愪氦</el-button>
+ </template>
+ </el-dialog>
+
+ <!-- 涓汉淇℃伅缂栬緫寮圭獥 -->
+ <el-dialog v-model="editProfile" title="缂栬緫涓汉淇℃伅" width="500px">
+ <el-form :model="profileForm" label-width="100px">
+ <el-form-item label="濮撳悕">
+ <el-input v-model="profileForm.name" />
+ </el-form-item>
+ <el-form-item label="鑱旂郴鐢佃瘽">
+ <el-input v-model="profileForm.phone" />
+ </el-form-item>
+ <el-form-item label="閭">
+ <el-input v-model="profileForm.email" />
+ </el-form-item>
+ <el-form-item label="鍦板潃">
+ <el-input v-model="profileForm.adress" type="textarea" rows="2" />
+ </el-form-item>
+ </el-form>
+ <template #footer>
+ <el-button @click="editProfile = false">鍙栨秷</el-button>
+ <el-button type="primary" @click="saveProfile">淇濆瓨</el-button>
+ </template>
+ </el-dialog>
+ </div>
+</template>
+
+<script setup>
+import { ref, reactive, watch, onMounted } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import {
+ Calendar,
+ Money,
+ Clock,
+ User
+} from '@element-plus/icons-vue'
+import { personalAttendanceRecordsListPage, personalAttendanceRecordsAdd, personalAttendanceRecordsUpdate, personalAttendanceRecordsDelete, holidayApplicationListPage, holidayApplicationAdd, holidayApplicationUpdate, holidayApplicationDelete } from '@/api/personnelManagement/selfService'
+import { compensationListPage, compensationAdd, compensationUpdate, compensationDelete } from '@/api/personnelManagement/payrollManagement'
+
+const { proxy } = getCurrentInstance()
+import { getUserProfile } from '@/api/system/user.js'
+import {staffOnJobListPage, updateStaffOnJob} from "@/api/personnelManagement/staffOnJob.js";
+
+const tableLoading = ref(false)
+// 鍒嗛〉鍙傛暟
+const page = reactive({
+ current: 1,
+ size: 10,
+ total: 0
+})
+
+// 褰撳墠瑙嗗浘
+const currentView = ref('attendance')
+
+// 瀵艰埅椤�
+const navItems = [
+ { type: 'attendance', title: '鑰冨嫟璁板綍', desc: '鏌ヨ涓汉鑰冨嫟淇℃伅', icon: 'Calendar' },
+ { type: 'salary', title: '钖祫鍗�', desc: '鏌ョ湅钖祫鍙戞斁璁板綍', icon: 'Money' },
+ { type: 'leave', title: '鍋囨湡鐢宠', desc: '鍦ㄧ嚎鐢宠鍚勭被鍋囨湡', icon: 'Clock' },
+ { type: 'profile', title: '涓汉淇℃伅', desc: '缁存姢涓汉鍩烘湰淇℃伅', icon: 'User' }
+]
+
+// 鑰冨嫟鏁版嵁
+const attendanceData = ref([])
+
+// 钖祫鏁版嵁
+const salaryData = ref([])
+
+
+// 鍋囨湡鏁版嵁
+const leaveData = ref([])
+
+const currentUser = ref()
+const user= ref()
+// 涓汉淇℃伅
+const profile = ref({
+ id: '',
+ name: '',
+ employeeId: '',
+ department: '',
+ position: '',
+ hireDate: '',
+ phone: '',
+ email: '',
+ adress: ''
+ })
+
+// 寮圭獥鎺у埗
+const showLeaveDialog = ref(false)
+const editProfile = ref(false)
+const payDateStr = ref('')
+
+// 琛ㄥ崟鏁版嵁
+const leaveForm = reactive({
+ id: '',
+ type: '',
+ startDate: '',
+ endDate: '',
+ days: 0,
+ reason: '',
+ status: ''
+})
+const profileForm = reactive({
+ name: "",
+ email: "",
+ adress: "",
+ phone: "",
+})
+const joinForm = reactive({
+ id: "",
+ staffNo: "",
+ staffName: "",
+ email: "",
+ adress: "",
+ sex: "",
+ nativePlace: "",
+ postJob: "",
+ firstStudy: "",
+ profession: "",
+ age: 0,
+ phone: "",
+ emergencyContact: "",
+ emergencyContactPhone: "",
+ contractTerm: 0,
+ contractStartTime: "",
+ contractEndTime: "",
+ staffState: 1,
+})
+
+// 鏂板鑰冨嫟璁板綍锛氬脊绐椾笌琛ㄥ崟
+const operationType = ref('add')
+const leaveOperationType = ref('add')
+const showAttendanceDialog = ref(false)
+const attendanceFormRef = ref(null)
+const attendanceForm = reactive({
+ id: '',
+ date: '',
+ checkIn: '',
+ checkOut: '',
+ workHours: '',
+ status: '姝ｅ父'
+})
+const attendanceRules = {
+ date: [{ required: true, message: '璇烽�夋嫨鏃ユ湡', trigger: 'change' }],
+ checkIn: [{ required: true, message: '璇烽�夋嫨绛惧埌鏃堕棿', trigger: 'change' }],
+ checkOut: [{ required: true, message: '璇烽�夋嫨绛鹃��鏃堕棿', trigger: 'change' }],
+ status: [{ required: true, message: '璇烽�夋嫨鐘舵��', trigger: 'change' }]
+}
+
+// 澶勭悊瀵艰埅鐐瑰嚮
+const handleNavClick = (type) => {
+ currentView.value = type
+}
+
+// 鑾峰彇鐘舵�佺被鍨�
+const getStatusType = (status) => {
+ const types = {
+ '宸查�氳繃': 'success',
+ '瀹℃壒涓�': 'warning',
+ '宸叉嫆缁�': 'danger'
+ }
+ return types[status] || 'info'
+}
+
+// 鏂板鑰冨嫟璁板綍锛堟墦寮�寮圭獥骞堕濉粯璁ゅ�硷級
+const addAttendanceRecord = () => {
+ operationType.value = 'add'
+ attendanceForm.date = new Date().toISOString().split('T')[0]
+ attendanceForm.checkIn = '09:00'
+ attendanceForm.checkOut = '18:00'
+ attendanceForm.status = '姝ｅ父'
+ showAttendanceDialog.value = true
+}
+
+// 璁＄畻宸ユ椂
+const computeWorkHours = (inStr, outStr) => {
+ const [inH, inM] = inStr.split(':').map(n => parseInt(n, 10))
+ const [outH, outM] = outStr.split(':').map(n => parseInt(n, 10))
+ const inMin = inH * 60 + inM
+ const outMin = outH * 60 + outM
+ const diff = Math.max(0, outMin - inMin)
+ const h = Math.floor(diff / 60)
+ const m = diff % 60
+ return m === 0 ? `${h}灏忔椂` : `${h}灏忔椂${m}鍒哷
+}
+
+// 缂栬緫鑰冨嫟璁板綍
+const editAttendanceRecord = (row) => {
+ operationType.value = 'edit'
+ Object.assign(attendanceForm, row)
+ showAttendanceDialog.value = true
+}
+// 鎻愪氦鏂板-缂栬緫鑰冨嫟璁板綍
+const submitAttendance = () => {
+ // if (!attendanceFormRef.value) return
+ const workHours = computeWorkHours(attendanceForm.checkIn, attendanceForm.checkOut)
+ const newRecord = {
+ date: attendanceForm.date,
+ checkIn: attendanceForm.checkIn,
+ checkOut: attendanceForm.checkOut,
+ workHours,
+ status: attendanceForm.status
+ }
+ if (operationType.value === 'add') {
+ personalAttendanceRecordsAdd(newRecord)
+ .then(res => {
+ if (res.code === 200) {
+ ElMessage.success('鑰冨嫟璁板綍娣诲姞鎴愬姛')
+ getPersonalAttendanceRecordsList()
+ showAttendanceDialog.value = false
+ // 閲嶇疆琛ㄥ崟
+ attendanceForm.date = ''
+ attendanceForm.checkIn = ''
+ attendanceForm.checkOut = ''
+ attendanceForm.status = '姝ｅ父'
+ }
+ }).catch(err => {
+ ElMessage.error('鑰冨嫟璁板綍娣诲姞澶辫触')
+ })
+ }else{
+ attendanceForm.workHours = computeWorkHours(attendanceForm.checkIn, attendanceForm.checkOut)
+ personalAttendanceRecordsUpdate(attendanceForm)
+ .then(res => {
+ if (res.code === 200) {
+ ElMessage.success('鑰冨嫟璁板綍鏇存柊鎴愬姛')
+ getPersonalAttendanceRecordsList()
+ showAttendanceDialog.value = false
+ // 閲嶇疆琛ㄥ崟
+ attendanceForm.date = ''
+ attendanceForm.checkIn = ''
+ attendanceForm.checkOut = ''
+ attendanceForm.status = '姝ｅ父'
+ }
+ }).catch(err => {
+ ElMessage.error('鑰冨嫟璁板綍鏇存柊澶辫触')
+ })
+ }
+ // attendanceFormRef.value.validate((valid) => {
+ // if (!valid) return
+
+
+ // })
+}
+// 鍒犻櫎鑰冨嫟璁板綍
+const deleteAttendanceRecord = (row) => {
+
+ ElMessageBox.confirm('纭畾鍒犻櫎璇ヨ�冨嫟璁板綍鍚楋紵', '鎻愮ず', {
+ confirmButtonText: '纭畾',
+ cancelButtonText: '鍙栨秷',
+ type: 'warning'
+ }).then(() => {
+ personalAttendanceRecordsDelete(row.id)
+ .then(res => {
+ if (res.code === 200) {
+ ElMessage.success('鑰冨嫟璁板綍鍒犻櫎鎴愬姛')
+ getPersonalAttendanceRecordsList()
+ }
+ }).catch(err => {
+ ElMessage.error('鑰冨嫟璁板綍鍒犻櫎澶辫触')
+ })
+ }).catch(() => {
+ ElMessage({
+ type: 'info',
+ message: '宸插彇娑堝垹闄�'
+ })
+ })
+}
+// 鐢宠鍋囨湡
+const openLeaveForm = () => {
+ leaveOperationType.value = 'add'
+ showLeaveDialog.value = true
+ // leaveForm.type = ''
+ // leaveForm.startDate = ''
+ // leaveForm.endDate = ''
+ // leaveForm.days = 0
+ // leaveForm.reason = ''
+ // leaveForm.status = 'warning'
+}
+// 缂栬緫鍋囨湡璁板綍
+const editLeaveRecord = (row) => {
+ leaveOperationType.value = 'edit'
+ showLeaveDialog.value = true
+ Object.assign(leaveForm, row)
+ // ElMessage.info('缂栬緫鍔熻兘寮�鍙戜腑...')
+}
+
+// 鍒犻櫎鍋囨湡璁板綍
+const deleteLeaveRecord = (row) => {
+ ElMessageBox.confirm('纭畾鍒犻櫎璇ュ亣鏈熻褰曞悧锛�', '鎻愮ず', {
+ confirmButtonText: '纭畾',
+ cancelButtonText: '鍙栨秷',
+ type: 'warning'
+ }).then(() => {
+ holidayApplicationDelete(row.id)
+ .then(res => {
+ if (res.code === 200) {
+ ElMessage.success('鍋囨湡璁板綍鍒犻櫎鎴愬姛')
+ getHolidayApplicationList()
+ }
+ }).catch(err => {
+ ElMessage.error('鍋囨湡璁板綍鍒犻櫎澶辫触')
+ })
+ }).catch(() => {
+ ElMessage({
+ type: 'info',
+ message: '宸插彇娑堝垹闄�'
+ })
+ })
+}
+
+//璁＄畻鍋囨湡澶╂暟
+const calculateDays = () => {
+ try {
+ if (leaveForm.startDate && leaveForm.endDate) {
+ const start = new Date(leaveForm.startDate)
+ const end = new Date(leaveForm.endDate)
+ leaveForm.startDate = start.toISOString().split('T')[0]
+ leaveForm.endDate = end.toISOString().split('T')[0]
+
+ if (isNaN(start.getTime()) || isNaN(end.getTime())) {
+ console.warn('鏃犳晥鐨勬棩鏈熸牸寮�')
+ return
+ }
+
+ const diffTime = Math.abs(end - start)
+ const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24)) + 1
+ leaveForm.days = diffDays
+ }
+ } catch (error) {
+ console.error('璁＄畻澶╂暟澶辫触:', error)
+ }
+}
+
+// 鎻愪氦鍋囨湡鐢宠
+const submitLeaveApplication = () => {
+ if (leaveOperationType.value === 'add') {
+ if (!leaveForm.type || !leaveForm.startDate || !leaveForm.endDate || !leaveForm.reason) {
+ ElMessage.warning('璇峰～鍐欏畬鏁翠俊鎭�')
+ return
+ }
+ calculateDays()
+ const newLeave = {
+ type: leaveForm.type,
+ startDate: leaveForm.startDate,
+ endDate: leaveForm.endDate,
+ days: leaveForm.days, // 绠�鍗曡绠�
+ reason: leaveForm.reason,
+ status: '瀹℃壒涓�'
+ }
+
+ holidayApplicationAdd(newLeave)
+ .then(res => {
+ if (res.code === 200) {
+ ElMessage.success('鍋囨湡鐢宠鎻愪氦鎴愬姛')
+ getHolidayApplicationList()
+ showLeaveDialog.value = false
+ // 閲嶇疆琛ㄥ崟
+ Object.keys(leaveForm).forEach(key => {
+ leaveForm[key] = ''
+ })
+ }
+ }).catch(err => {
+ ElMessage.error('鍋囨湡鐢宠鎻愪氦澶辫触')
+ })
+ }else{
+ calculateDays()
+ holidayApplicationUpdate(leaveForm)
+ .then(res => {
+ if (res.code === 200) {
+ ElMessage.success('鍋囨湡鐢宠鏇存柊鎴愬姛')
+ getHolidayApplicationList()
+ showLeaveDialog.value = false
+ // 閲嶇疆琛ㄥ崟
+ Object.keys(leaveForm).forEach(key => {
+ leaveForm[key] = ''
+ })
+ }
+ }).catch(err => {
+ ElMessage.error('鍋囨湡鐢宠鏇存柊澶辫触')
+ })
+ }
+}
+
+// 鑾峰彇涓汉淇℃伅
+const getProfile = () => {
+ tableLoading.value = true;
+ getUserProfile().then(res => {
+ if (res.code === 200) {
+ currentUser.value = res.data
+ // console.log("----",currentUser.value)
+ //寰楀埌浜哄憳鍒楄〃
+ staffOnJobListPage({staffState: 1}).then(res => {
+ //绛涢�夊嚭鍜宑urrentUser鍚屽悕鐨勪汉鍛�
+ // let tableData = res.data.records
+ user.value = res.data.records.find(item => item.staffName === currentUser.value.userName)
+ // console.log("++++",user.value)
+ if(user.value){
+ profile.value.id=user.value.id
+ profile.value.name=user.value.staffName
+ profile.value.employeeId=user.value.staffNo
+ profile.value.phone=user.value.phone
+ profile.value.email=currentUser.value.email
+ profile.value.adress=user.value.adress
+ profile.value.position=user.value.postJob
+ profile.value.hireDate=user.value.createTime
+ profile.value.department=currentUser.value.deptNames
+ }
+ // console.log(profile.value)
+ // tableLoading.value = false;
+ }).catch(err => {})
+ }
+ }).catch(err => {
+ tableLoading.value = false;
+ ElMessage.error('鑾峰彇涓汉淇℃伅澶辫触')
+ })
+}
+// 淇濆瓨涓汉淇℃伅
+const saveProfile = async () => {
+ tableLoading.value = true;
+ try {
+ const userRes = await getUserProfile();
+ if (userRes.code === 200) {
+ currentUser.value = userRes.data;
+ const staffListRes = await staffOnJobListPage({ staffState: 1 });
+ user.value = staffListRes.data.records.find(item => item.staffName === currentUser.value.userName);
+ Object.assign(joinForm, user.value);
+ joinForm.staffName = profileForm.name;
+ joinForm.phone = profileForm.phone;
+ joinForm.email = profileForm.email;
+ joinForm.adress = profileForm.adress;
+ // 璋冪敤鏇存柊涓汉淇℃伅鐨勬帴鍙�
+ updateStaffOnJob(user.value.id, joinForm).then(res => {
+ if (res.code === 200) {
+ ElMessage.success('涓汉淇℃伅淇濆瓨鎴愬姛');
+ getProfile();
+ editProfile.value = false;
+ }
+ }).catch(err => {
+ ElMessage.error('涓汉淇℃伅淇濆瓨澶辫触');
+ })
+ }
+ } catch (err) {
+ ElMessage.error('鑾峰彇涓汉淇℃伅澶辫触');
+ } finally {
+ tableLoading.value = false;
+ }
+};
+
+// 缂栬緫涓汉淇℃伅
+const editProfileForm = () => {
+ editProfile.value = true;
+ Object.assign(profileForm, {
+ name: profile.value.name,
+ phone: profile.value.phone,
+ email: profile.value.email,
+ adress: profile.value.adress,
+ });
+};
+
+//鏈堜唤鏀瑰彉
+const changMonth = () => {
+ getCompensationList()
+}
+//鑾峰彇鑰冨嫟璁板綍鍒楄〃
+const getPersonalAttendanceRecordsList = async () => {
+ tableLoading.value = true
+ personalAttendanceRecordsListPage(page)
+ .then(res => {
+
+ attendanceData.value = res.data.records
+ page.value.total = res.data.total;
+ tableLoading.value = false;
+
+ }).catch(err => {
+ tableLoading.value = false;
+ })
+}
+//钖祫鍗曟煡璇�
+const getCompensationList = async () => {
+ tableLoading.value = true
+ compensationListPage({...page,payDateStr:payDateStr.value})
+ .then(res => {
+ salaryData.value = res.data.records
+ //杩囨护鍑哄綋鍓嶆湀浠界殑鎵ｆ鍚堣
+ salaryData.value.forEach(item => {
+ item.deduction =0 + item.deductionAbsenteeism+item.sickLeaveDeductions+item.deductionPersonalLeave+item.forgetClockDeduct,
+ item.bonus=0,
+ item.status='宸插彂鏀�'
+ })
+
+ page.value.total = res.data.total;
+ tableLoading.value = false;
+ }).catch(err => {
+ tableLoading.value = false;
+ })
+}
+//鑾峰彇鍋囨湡鐢宠鍒楄〃
+const getHolidayApplicationList = async () => {
+ tableLoading.value = true
+ holidayApplicationListPage(page)
+ .then(res => {
+ leaveData.value = res.data.records
+ page.value.total = res.data.total;
+ tableLoading.value = false;
+ }).catch(err => {
+ tableLoading.value = false;
+ })
+}
+onMounted(() => {
+ // 鍒濆鍖�
+ getPersonalAttendanceRecordsList()
+ getCompensationList()
+ getHolidayApplicationList()
+ getProfile()
+})
+</script>
+
+<style scoped>
+.self-service-container {
+ padding: 20px;
+ background-color: #f5f7fa;
+ min-height: 100vh;
+}
+
+.page-header {
+ text-align: center;
+ margin-bottom: 30px;
+ padding: 20px;
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+ border-radius: 12px;
+ color: white;
+}
+
+.page-header h2 {
+ color: white;
+ margin-bottom: 10px;
+ font-size: 28px;
+ font-weight: 600;
+}
+
+.page-header p {
+ color: rgba(255, 255, 255, 0.9);
+ font-size: 14px;
+ margin: 0;
+}
+
+.nav-cards {
+ margin-bottom: 30px;
+}
+
+.nav-card {
+ cursor: pointer;
+ transition: all 0.3s ease;
+ border-radius: 12px;
+ border: none;
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+}
+
+.nav-card:hover {
+ transform: translateY(-5px);
+ box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
+}
+
+.nav-content {
+ text-align: center;
+ padding: 20px;
+}
+
+.nav-icon {
+ color: #409EFF;
+ margin-bottom: 15px;
+}
+
+.nav-content h3 {
+ margin: 0 0 10px 0;
+ color: #303133;
+ font-size: 18px;
+}
+
+.nav-content p {
+ margin: 0;
+ color: #909399;
+ font-size: 14px;
+}
+
+.main-content {
+ margin-bottom: 30px;
+}
+
+.content-card {
+ border-radius: 12px;
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+ border: none;
+}
+
+.card-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ font-weight: 600;
+ color: #303133;
+}
+
+/* 鍝嶅簲寮忚璁� */
+@media (max-width: 768px) {
+ .self-service-container {
+ padding: 10px;
+ }
+
+ .nav-cards .el-col {
+ margin-bottom: 15px;
+ }
+
+ .page-header h2 {
+ font-size: 24px;
+ }
+}
+</style>
--
Gitblit v1.9.3