From cd6eb9089e893cf7fa998543af1125dbef81a355 Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期五, 15 八月 2025 14:29:28 +0800
Subject: [PATCH] 电表采集页面添加
---
src/views/collaborativeApproval/attendanceManagement/index.vue | 714 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 714 insertions(+), 0 deletions(-)
diff --git a/src/views/collaborativeApproval/attendanceManagement/index.vue b/src/views/collaborativeApproval/attendanceManagement/index.vue
new file mode 100644
index 0000000..37b3d59
--- /dev/null
+++ b/src/views/collaborativeApproval/attendanceManagement/index.vue
@@ -0,0 +1,714 @@
+<template>
+ <div class="app-container">
+ <el-tabs v-model="activeTab" type="border-card">
+ <!-- 鍋囨湡璁剧疆 -->
+ <el-tab-pane label="鍋囨湡璁剧疆" name="holiday">
+ <div class="tab-content">
+ <el-button type="primary" @click="openDialog('holiday', 'add')">鏂板鍋囨湡</el-button>
+
+ <el-table :data="holidayData" border style="width: 100%; margin-top: 20px;">
+ <el-table-column prop="name" label="鍋囨湡鍚嶇О" />
+ <el-table-column prop="type" label="鍋囨湡绫诲瀷">
+ <template #default="scope">
+ <el-tag :type="getTagType(scope.row.type)">{{ getTypeLabel(scope.row.type) }}</el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column prop="startDate" label="寮�濮嬫棩鏈�" />
+ <el-table-column prop="endDate" label="缁撴潫鏃ユ湡" />
+ <el-table-column prop="days" label="澶╂暟" align="center" />
+ <el-table-column prop="status" label="鐘舵��" >
+ <template #default="scope">
+ <el-tag :type="scope.row.status === 'active' ? 'success' : 'info'">
+ {{ scope.row.status === 'active' ? '鍚敤' : '鍋滅敤' }}
+ </el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column label="鎿嶄綔" fixed="right">
+ <template #default="scope">
+ <el-button type="primary" size="small" @click="openDialog('holiday', 'edit', scope.row)">缂栬緫</el-button>
+ <el-button type="danger" size="small" @click="deleteItem('holiday', scope.row)">鍒犻櫎</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ </div>
+ </el-tab-pane>
+
+ <!-- 骞村亣璁剧疆 -->
+ <el-tab-pane label="骞村亣璁剧疆" name="annual">
+ <div class="tab-content">
+ <el-button type="primary" @click="openDialog('annual', 'add')">鏂板骞村亣瑙勫垯</el-button>
+
+ <el-table :data="annualData" border style="width: 100%; margin-top: 20px;">
+ <el-table-column prop="employeeType" label="鍛樺伐绫诲瀷"/>
+ <el-table-column prop="workYears" label="宸ヤ綔骞撮檺" />
+ <el-table-column prop="annualDays" label="骞村亣澶╂暟" align="center" />
+ <el-table-column prop="maxCarryOver" label="鏈�澶х粨杞ぉ鏁�" align="center" />
+ <el-table-column prop="status" label="鐘舵��">
+ <template #default="scope">
+ <el-tag :type="scope.row.status === 'active' ? 'success' : 'info'">
+ {{ scope.row.status === 'active' ? '鍚敤' : '鍋滅敤' }}
+ </el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column label="鎿嶄綔" fixed="right">
+ <template #default="scope">
+ <el-button type="primary" size="small" @click="openDialog('annual', 'edit', scope.row)">缂栬緫</el-button>
+ <el-button type="danger" size="small" @click="deleteItem('annual', scope.row)">鍒犻櫎</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ </div>
+ </el-tab-pane>
+
+ <!-- 鍔犵彮璁剧疆 -->
+ <el-tab-pane label="鍔犵彮璁剧疆" name="overtime">
+ <div class="tab-content">
+ <el-button type="primary" @click="openDialog('overtime', 'add')">鏂板鍔犵彮瑙勫垯</el-button>
+
+ <el-table :data="overtimeData" border style="width: 100%; margin-top: 20px;">
+ <el-table-column prop="name" label="瑙勫垯鍚嶇О" />
+ <el-table-column prop="type" label="鍔犵彮绫诲瀷" >
+ <template #default="scope">
+ <el-tag :type="getTagType(scope.row.type)">{{ getTypeLabel(scope.row.type) }}</el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column prop="startTime" label="寮�濮嬫椂闂�" />
+ <el-table-column prop="endTime" label="缁撴潫鏃堕棿" />
+ <el-table-column prop="rate" label="鍊嶇巼" align="center" />
+ <el-table-column prop="status" label="鐘舵��" >
+ <template #default="scope">
+ <el-tag :type="scope.row.status === 'active' ? 'success' : 'info'">
+ {{ scope.row.status === 'active' ? '鍚敤' : '鍋滅敤' }}
+ </el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column label="鎿嶄綔" fixed="right">
+ <template #default="scope">
+ <el-button type="primary" size="small" @click="openDialog('overtime', 'edit', scope.row)">缂栬緫</el-button>
+ <el-button type="danger" size="small" @click="deleteItem('overtime', scope.row)">鍒犻櫎</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ </div>
+ </el-tab-pane>
+
+ <!-- 涓婄彮鏃堕棿璁剧疆 -->
+ <el-tab-pane label="涓婄彮鏃堕棿璁剧疆" name="worktime">
+ <div class="tab-content">
+ <el-button type="primary" @click="openDialog('worktime', 'add')">鏂板鏃堕棿娈�</el-button>
+
+ <el-table :data="worktimeData" border style="width: 100%; margin-top: 20px;">
+ <el-table-column prop="name" label="鏃堕棿娈靛悕绉�" />
+ <el-table-column prop="startTime" label="涓婄彮鏃堕棿"/>
+ <el-table-column prop="endTime" label="涓嬬彮鏃堕棿" />
+ <el-table-column prop="flexibleStart" label="寮规�т笂鐝�">
+ <template #default="scope">
+ <el-tag :type="scope.row.flexibleStart ? 'success' : 'info'">
+ {{ scope.row.flexibleStart ? '鏄�' : '鍚�' }}
+ </el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column prop="flexibleMinutes" label="寮规�ф椂闂�(鍒嗛挓)" width="120" align="center" />
+ <el-table-column prop="status" label="鐘舵��" >
+ <template #default="scope">
+ <el-tag :type="scope.row.status === 'active' ? 'success' : 'info'">
+ {{ scope.row.status === 'active' ? '鍚敤' : '鍋滅敤' }}
+ </el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column label="鎿嶄綔" fixed="right">
+ <template #default="scope">
+ <el-button type="primary" size="small" @click="openDialog('worktime', 'edit', scope.row)">缂栬緫</el-button>
+ <el-button type="danger" size="small" @click="deleteItem('worktime', scope.row)">鍒犻櫎</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ </div>
+ </el-tab-pane>
+ </el-tabs>
+
+ <!-- 閫氱敤寮圭獥 -->
+ <el-dialog v-model="dialogVisible" :title="dialogTitle" width="600px">
+ <el-form ref="formRef" :model="form" :rules="rules" label-width="100px">
+ <el-form-item label="鍚嶇О" prop="name" v-if="currentType !== 'annual'">
+ <el-input v-model="form.name" placeholder="璇疯緭鍏ュ悕绉�" />
+ </el-form-item>
+
+ <el-form-item label="绫诲瀷" prop="type" v-if="currentType === 'holiday' || currentType === 'overtime'">
+ <el-select v-model="form.type" placeholder="璇烽�夋嫨绫诲瀷" style="width: 100%">
+ <el-option
+ v-for="option in getTypeOptions()"
+ :key="option.value"
+ :label="option.label"
+ :value="option.value"
+ />
+ </el-select>
+ </el-form-item>
+
+ <el-form-item label="鍛樺伐绫诲瀷" prop="employeeType" v-if="currentType === 'annual'">
+ <el-select v-model="form.employeeType" placeholder="璇烽�夋嫨鍛樺伐绫诲瀷" style="width: 100%">
+ <el-option label="姝ｅ紡鍛樺伐" value="regular" />
+ <el-option label="璇曠敤鏈熷憳宸�" value="probation" />
+ <el-option label="瀹炰範鐢�" value="intern" />
+ </el-select>
+ </el-form-item>
+
+ <el-form-item label="宸ヤ綔骞撮檺" prop="workYears" v-if="currentType === 'annual'">
+ <el-input v-model="form.workYears" placeholder="濡傦細1-3骞淬��3-5骞寸瓑" />
+ </el-form-item>
+
+ <el-form-item label="骞村亣澶╂暟" prop="annualDays" v-if="currentType === 'annual'">
+ <el-input-number v-model="form.annualDays" :min="0" :max="365" style="width: 100%" />
+ </el-form-item>
+
+ <el-form-item label="鏈�澶х粨杞ぉ鏁�" prop="maxCarryOver" v-if="currentType === 'annual'">
+ <el-input-number v-model="form.maxCarryOver" :min="0" :max="30" style="width: 100%" />
+ </el-form-item>
+
+ <el-form-item label="鏃ユ湡鑼冨洿" prop="dateRange" v-if="currentType === 'holiday'">
+ <el-date-picker
+ v-model="form.dateRange"
+ type="daterange"
+ range-separator="鑷�"
+ start-placeholder="寮�濮嬫棩鏈�"
+ end-placeholder="缁撴潫鏃ユ湡"
+ style="width: 100%"
+ @change="calculateDays"
+ />
+ </el-form-item>
+
+ <el-form-item label="澶╂暟" prop="days" v-if="currentType === 'holiday'">
+ <el-input-number v-model="form.days" :min="0" style="width: 100%" />
+ </el-form-item>
+
+ <el-form-item label="寮�濮嬫椂闂�" prop="startTime" v-if="currentType === 'overtime'">
+ <el-time-picker
+ v-model="form.startTime"
+ placeholder="寮�濮嬫椂闂�"
+ format="HH:mm"
+ value-format="HH:mm"
+ style="width: 100%"
+ @change="validateTimeField('startTime')"
+ />
+ </el-form-item>
+
+ <el-form-item label="缁撴潫鏃堕棿" prop="endTime" v-if="currentType === 'overtime'">
+ <el-time-picker
+ v-model="form.endTime"
+ placeholder="缁撴潫鏃堕棿"
+ format="HH:mm"
+ value-format="HH:mm"
+ style="width: 100%"
+ @change="validateTimeField('endTime')"
+ />
+ </el-form-item>
+
+ <el-form-item label="鍊嶇巼" prop="rate" v-if="currentType === 'overtime'">
+ <el-input-number v-model="form.rate" :min="1" :max="3" :step="0.5" style="width: 100%" />
+ </el-form-item>
+
+ <el-form-item label="涓婄彮鏃堕棿" prop="workStartTime" v-if="currentType === 'worktime'">
+ <el-time-picker
+ v-model="form.workStartTime"
+ placeholder="涓婄彮鏃堕棿"
+ format="HH:mm"
+ value-format="HH:mm"
+ style="width: 100%"
+ @change="validateTimeField('workStartTime')"
+ />
+ </el-form-item>
+
+ <el-form-item label="涓嬬彮鏃堕棿" prop="workEndTime" v-if="currentType === 'worktime'">
+ <el-time-picker
+ v-model="form.workEndTime"
+ placeholder="涓嬬彮鏃堕棿"
+ format="HH:mm"
+ value-format="HH:mm"
+ style="width: 100%"
+ @change="validateTimeField('workEndTime')"
+ />
+ </el-form-item>
+
+ <el-form-item label="寮规�т笂鐝�" prop="flexibleStart" v-if="currentType === 'worktime'">
+ <el-switch v-model="form.flexibleStart" />
+ </el-form-item>
+
+ <el-form-item label="寮规�ф椂闂�(鍒嗛挓)" prop="flexibleMinutes" v-if="currentType === 'worktime' && form.flexibleStart">
+ <el-input-number v-model="form.flexibleMinutes" :min="0" :max="120" style="width: 100%" />
+ </el-form-item>
+
+ <el-form-item label="鐘舵��" prop="status">
+ <el-radio-group v-model="form.status">
+ <el-radio value="active">鍚敤</el-radio>
+ <el-radio value="inactive">鍋滅敤</el-radio>
+ </el-radio-group>
+ </el-form-item>
+ </el-form>
+
+ <template #footer>
+ <span class="dialog-footer">
+ <el-button @click="dialogVisible = false">鍙栨秷</el-button>
+ <el-button type="primary" @click="submitForm">纭畾</el-button>
+ </span>
+ </template>
+ </el-dialog>
+ </div>
+</template>
+
+<script setup>
+import { ref, reactive, onMounted, onUnmounted } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+
+// 褰撳墠婵�娲荤殑鏍囩椤�
+const activeTab = ref('holiday')
+
+// 寮圭獥鐩稿叧
+const dialogVisible = ref(false)
+const dialogTitle = ref('')
+const currentType = ref('')
+const currentAction = ref('')
+const currentEditId = ref('')
+const formRef = ref()
+
+// 琛ㄥ崟鏁版嵁
+const form = reactive({
+ name: '',
+ type: '',
+ dateRange: [],
+ days: 0,
+ employeeType: '',
+ workYears: '',
+ annualDays: 0,
+ maxCarryOver: 0,
+ startTime: '', // 鍔犵彮寮�濮嬫椂闂�
+ endTime: '', // 鍔犵彮缁撴潫鏃堕棿
+ workStartTime: '', // 涓婄彮鏃堕棿
+ workEndTime: '', // 涓嬬彮鏃堕棿
+ rate: 1.5,
+ flexibleStart: false,
+ flexibleMinutes: 30,
+ status: 'active'
+})
+
+// 琛ㄥ崟楠岃瘉瑙勫垯
+const rules = {
+ name: [{ required: true, message: '璇疯緭鍏ュ悕绉�', trigger: 'blur' }],
+ type: [{ required: true, message: '璇烽�夋嫨绫诲瀷', trigger: 'change' }],
+ dateRange: [{ required: true, message: '璇烽�夋嫨鏃ユ湡鑼冨洿', trigger: 'change' }],
+ days: [{ required: true, message: '璇疯緭鍏ュぉ鏁�', trigger: 'blur' }],
+ employeeType: [{ required: true, message: '璇烽�夋嫨鍛樺伐绫诲瀷', trigger: 'change' }],
+ workYears: [{ required: true, message: '璇疯緭鍏ュ伐浣滃勾闄�', trigger: 'blur' }],
+ annualDays: [{ required: true, message: '璇疯緭鍏ュ勾鍋囧ぉ鏁�', trigger: 'blur' }],
+ maxCarryOver: [{ required: true, message: '璇疯緭鍏ユ渶澶х粨杞ぉ鏁�', trigger: 'blur' }],
+ startTime: [{
+ required: true,
+ message: '璇烽�夋嫨寮�濮嬫椂闂�',
+ trigger: 'change',
+ validator: (rule, value, callback) => {
+ if (!value) {
+ callback(new Error('璇烽�夋嫨寮�濮嬫椂闂�'))
+ } else {
+ callback()
+ }
+ }
+ }],
+ endTime: [{
+ required: true,
+ message: '璇烽�夋嫨缁撴潫鏃堕棿',
+ trigger: 'change',
+ validator: (rule, value, callback) => {
+ if (!value) {
+ callback(new Error('璇烽�夋嫨缁撴潫鏃堕棿'))
+ } else {
+ callback()
+ }
+ }
+ }],
+ workStartTime: [{
+ required: true,
+ message: '璇烽�夋嫨涓婄彮鏃堕棿',
+ trigger: 'change',
+ validator: (rule, value, callback) => {
+ if (!value) {
+ callback(new Error('璇烽�夋嫨涓婄彮鏃堕棿'))
+ } else {
+ callback()
+ }
+ }
+ }],
+ workEndTime: [{
+ required: true,
+ message: '璇烽�夋嫨涓嬬彮鏃堕棿',
+ trigger: 'change',
+ validator: (rule, value, callback) => {
+ if (!value) {
+ callback(new Error('璇烽�夋嫨涓嬬彮鏃堕棿'))
+ } else {
+ callback()
+ }
+ }
+ }],
+ rate: [{ required: true, message: '璇疯緭鍏ュ�嶇巼', trigger: 'blur' }]
+}
+
+// 妯℃嫙鏁版嵁
+const holidayData = ref([
+ { id: '1', name: '鏄ヨ妭', type: 'legal', startDate: '2024-02-10', endDate: '2024-02-17', days: 8, status: 'active' },
+ { id: '2', name: '娓呮槑鑺�', type: 'legal', startDate: '2024-04-05', endDate: '2024-04-05', days: 1, status: 'active' },
+ { id: '3', name: '鍔冲姩鑺�', type: 'legal', startDate: '2024-05-01', endDate: '2024-05-05', days: 5, status: 'active' }
+])
+
+const annualData = ref([
+ { id: '1', employeeType: 'regular', workYears: '1-3骞�', annualDays: 5, maxCarryOver: 2, status: 'active' },
+ { id: '2', employeeType: 'regular', workYears: '3-5骞�', annualDays: 10, maxCarryOver: 5, status: 'active' },
+ { id: '3', employeeType: 'regular', workYears: '5骞翠互涓�', annualDays: 15, maxCarryOver: 10, status: 'active' }
+])
+
+const overtimeData = ref([
+ { id: '1', name: '宸ヤ綔鏃ュ姞鐝�', type: 'weekday', startTime: '18:00', endTime: '22:00', rate: 1.5, status: 'active' },
+ { id: '2', name: '鍛ㄦ湯鍔犵彮', type: 'weekend', startTime: '09:00', endTime: '18:00', rate: 2.0, status: 'active' },
+ { id: '3', name: '娣卞鍔犵彮', type: 'night', startTime: '22:00', endTime: '06:00', rate: 2.5, status: 'active' }
+])
+
+const worktimeData = ref([
+ { id: '1', name: '鏍囧噯宸ヤ綔鏃堕棿', startTime: '09:00', endTime: '18:00', flexibleStart: true, flexibleMinutes: 30, status: 'active' },
+ { id: '2', name: '鏃╃彮鏃堕棿', startTime: '08:00', endTime: '17:00', flexibleStart: false, flexibleMinutes: 0, status: 'active' },
+ { id: '3', name: '鏅氱彮鏃堕棿', startTime: '14:00', endTime: '23:00', flexibleStart: false, flexibleMinutes: 0, status: 'active' }
+])
+
+// 宸ュ叿鍑芥暟
+const getTagType = (type) => {
+ const tagMap = {
+ legal: 'success', adjustment: 'warning', special: 'info', company: 'primary',
+ weekday: 'primary', weekend: 'warning', holiday: 'danger', night: 'info'
+ }
+ return tagMap[type] || 'info'
+}
+
+const getTypeLabel = (type) => {
+ const labelMap = {
+ legal: '娉曞畾鑺傚亣鏃�', adjustment: '璋冧紤鏃�', special: '鐗规畩鍋囨湡', company: '鍏徃鍋囨湡',
+ weekday: '宸ヤ綔鏃ュ姞鐝�', weekend: '鍛ㄦ湯鍔犵彮', holiday: '鑺傚亣鏃ュ姞鐝�', night: '娣卞鍔犵彮'
+ }
+ return labelMap[type] || type
+}
+
+const getTypeOptions = () => {
+ if (currentType.value === 'holiday') {
+ return [
+ { label: '娉曞畾鑺傚亣鏃�', value: 'legal' },
+ { label: '璋冧紤鏃�', value: 'adjustment' },
+ { label: '鐗规畩鍋囨湡', value: 'special' },
+ { label: '鍏徃鍋囨湡', value: 'company' }
+ ]
+ } else if (currentType.value === 'overtime') {
+ return [
+ { label: '宸ヤ綔鏃ュ姞鐝�', value: 'weekday' },
+ { label: '鍛ㄦ湯鍔犵彮', value: 'weekend' },
+ { label: '鑺傚亣鏃ュ姞鐝�', value: 'holiday' },
+ { label: '娣卞鍔犵彮', value: 'night' }
+ ]
+ }
+ return []
+}
+
+// 璁＄畻鍋囨湡澶╂暟
+const calculateDays = () => {
+ try {
+ if (form.dateRange && form.dateRange.length === 2 && form.dateRange[0] && form.dateRange[1]) {
+ const start = new Date(form.dateRange[0])
+ const end = new Date(form.dateRange[1])
+
+ 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
+ form.days = diffDays
+ }
+ } catch (error) {
+ console.error('璁＄畻澶╂暟澶辫触:', error)
+ }
+}
+
+// 楠岃瘉鏃堕棿鏍煎紡
+const validateTime = (time) => {
+ if (!time) return ''
+ if (typeof time === 'string') return time
+ if (time instanceof Date) {
+ return time.toTimeString().slice(0, 5)
+ }
+ return ''
+}
+
+// 楠岃瘉鏃堕棿瀛楁
+const validateTimeField = (fieldName) => {
+ try {
+ const value = form[fieldName]
+ if (value && typeof value === 'object' && value.hour !== undefined) {
+ // 濡傛灉鏄椂闂村璞★紝杞崲涓哄瓧绗︿覆鏍煎紡
+ const hours = value.hour.toString().padStart(2, '0')
+ const minutes = value.minute.toString().padStart(2, '0')
+ form[fieldName] = `${hours}:${minutes}`
+ }
+ } catch (error) {
+ console.error(`楠岃瘉鏃堕棿瀛楁 ${fieldName} 澶辫触:`, error)
+ form[fieldName] = ''
+ }
+}
+
+// 鎵撳紑寮圭獥
+const openDialog = (type, action, row = null) => {
+ try {
+ currentType.value = type
+ currentAction.value = action
+
+ if (action === 'add') {
+ dialogTitle.value = `鏂板${getTypeName(type)}`
+ currentEditId.value = ''
+ resetForm()
+ } else if (action === 'edit' && row) {
+ dialogTitle.value = `缂栬緫${getTypeName(type)}`
+ currentEditId.value = row.id
+ fillForm(row)
+ }
+
+ dialogVisible.value = true
+ } catch (error) {
+ console.error('鎵撳紑寮圭獥澶辫触:', error)
+ ElMessage.error('鎵撳紑寮圭獥澶辫触锛岃閲嶈瘯')
+ }
+}
+
+const getTypeName = (type) => {
+ const nameMap = {
+ holiday: '鍋囨湡',
+ annual: '骞村亣瑙勫垯',
+ overtime: '鍔犵彮瑙勫垯',
+ worktime: '鏃堕棿娈�'
+ }
+ return nameMap[type] || ''
+}
+
+const resetForm = () => {
+ Object.assign(form, {
+ name: '',
+ type: '',
+ dateRange: [],
+ days: 0,
+ employeeType: '',
+ workYears: '',
+ annualDays: 0,
+ maxCarryOver: 0,
+ startTime: '',
+ endTime: '',
+ workStartTime: '',
+ workEndTime: '',
+ rate: 1.5,
+ flexibleStart: false,
+ flexibleMinutes: 30,
+ status: 'active'
+ })
+}
+
+const fillForm = (row) => {
+ if (currentType.value === 'holiday') {
+ Object.assign(form, {
+ name: row.name,
+ type: row.type,
+ dateRange: [new Date(row.startDate), new Date(row.endDate)],
+ days: row.days,
+ status: row.status
+ })
+ } else if (currentType.value === 'annual') {
+ Object.assign(form, {
+ employeeType: row.employeeType,
+ workYears: row.workYears,
+ annualDays: row.annualDays,
+ maxCarryOver: row.maxCarryOver,
+ status: row.status
+ })
+ } else if (currentType.value === 'overtime') {
+ Object.assign(form, {
+ name: row.name,
+ type: row.type,
+ startTime: row.startTime || '',
+ endTime: row.endTime || '',
+ rate: row.rate,
+ status: row.status
+ })
+ } else if (currentType.value === 'worktime') {
+ Object.assign(form, {
+ name: row.name,
+ workStartTime: row.startTime || '',
+ workEndTime: row.endTime || '',
+ flexibleStart: row.flexibleStart,
+ flexibleMinutes: row.flexibleMinutes,
+ status: row.status
+ })
+ }
+}
+
+// 鎻愪氦琛ㄥ崟
+const submitForm = async () => {
+ try {
+ if (!formRef.value) {
+ ElMessage.error('琛ㄥ崟寮曠敤涓嶅瓨鍦�')
+ return
+ }
+
+ await formRef.value.validate()
+
+ if (currentAction.value === 'add') {
+ addItem()
+ } else if (currentAction.value === 'edit') {
+ editItem()
+ }
+
+ dialogVisible.value = false
+ ElMessage.success('鎿嶄綔鎴愬姛')
+ } catch (error) {
+ console.error('琛ㄥ崟楠岃瘉澶辫触:', error)
+ ElMessage.error('琛ㄥ崟楠岃瘉澶辫触锛岃妫�鏌ヨ緭鍏�')
+ }
+}
+
+const addItem = () => {
+ const newItem = { ...form, id: Date.now().toString() }
+
+ if (currentType.value === 'holiday') {
+ newItem.startDate = form.dateRange[0].toISOString().split('T')[0]
+ newItem.endDate = form.dateRange[1].toISOString().split('T')[0]
+ holidayData.value.push(newItem)
+ } else if (currentType.value === 'annual') {
+ annualData.value.push(newItem)
+ } else if (currentType.value === 'overtime') {
+ newItem.startTime = form.startTime || ''
+ newItem.endTime = form.endTime || ''
+ overtimeData.value.push(newItem)
+ } else if (currentType.value === 'worktime') {
+ newItem.startTime = form.workStartTime || ''
+ newItem.endTime = form.workEndTime || ''
+ worktimeData.value.push(newItem)
+ }
+}
+
+const editItem = () => {
+ let dataArray
+ let index
+
+ if (currentType.value === 'holiday') {
+ dataArray = holidayData.value
+ index = dataArray.findIndex(item => item.id === currentEditId.value)
+ if (index > -1) {
+ dataArray[index] = {
+ ...dataArray[index],
+ name: form.name,
+ type: form.type,
+ startDate: form.dateRange[0].toISOString().split('T')[0],
+ endDate: form.dateRange[1].toISOString().split('T')[0],
+ days: form.days,
+ status: form.status
+ }
+ }
+ } else if (currentType.value === 'annual') {
+ dataArray = annualData.value
+ index = dataArray.findIndex(item => item.id === currentEditId.value)
+ if (index > -1) {
+ dataArray[index] = {
+ ...dataArray[index],
+ employeeType: form.employeeType,
+ workYears: form.workYears,
+ annualDays: form.annualDays,
+ maxCarryOver: form.maxCarryOver,
+ status: form.status
+ }
+ }
+ } else if (currentType.value === 'overtime') {
+ dataArray = overtimeData.value
+ index = dataArray.findIndex(item => item.id === currentEditId.value)
+ if (index > -1) {
+ dataArray[index] = {
+ ...dataArray[index],
+ name: form.name,
+ type: form.type,
+ startTime: form.startTime || '',
+ endTime: form.endTime || '',
+ rate: form.rate,
+ status: form.status
+ }
+ }
+ } else if (currentType.value === 'worktime') {
+ dataArray = worktimeData.value
+ index = dataArray.findIndex(item => item.id === currentEditId.value)
+ if (index > -1) {
+ dataArray[index] = {
+ ...dataArray[index],
+ name: form.name,
+ startTime: form.workStartTime || '',
+ endTime: form.workEndTime || '',
+ flexibleStart: form.flexibleStart,
+ flexibleMinutes: form.flexibleMinutes,
+ status: form.status
+ }
+ }
+ }
+}
+
+// 鍒犻櫎椤圭洰
+const deleteItem = (type, row) => {
+ ElMessageBox.confirm('纭畾瑕佸垹闄よ繖涓」鐩悧锛�', '鎻愮ず', {
+ confirmButtonText: '纭畾',
+ cancelButtonText: '鍙栨秷',
+ type: 'warning'
+ }).then(() => {
+ let dataArray
+ if (type === 'holiday') dataArray = holidayData.value
+ else if (type === 'annual') dataArray = annualData.value
+ else if (type === 'overtime') dataArray = overtimeData.value
+ else if (type === 'worktime') dataArray = worktimeData.value
+
+ const index = dataArray.findIndex(item => item.id === row.id)
+ if (index > -1) {
+ dataArray.splice(index, 1)
+ ElMessage.success('鍒犻櫎鎴愬姛')
+ }
+ })
+}
+
+onMounted(() => {
+ console.log('鑰冨嫟绠＄悊椤甸潰鍔犺浇瀹屾垚')
+})
+
+onUnmounted(() => {
+ // 娓呯悊宸ヤ綔
+ dialogVisible.value = false
+ currentType.value = ''
+ currentAction.value = ''
+ currentEditId.value = ''
+})
+</script>
+
+<style scoped>
+.app-container {
+ padding: 20px;
+}
+
+.tab-content {
+ padding: 20px 0;
+}
+
+.dialog-footer {
+ text-align: right;
+}
+
+:deep(.el-tabs__content) {
+ padding: 20px;
+}
+
+:deep(.el-form-item) {
+ margin-bottom: 20px;
+}
+</style>
--
Gitblit v1.9.3