feat(wms/attendance): 新增批量修改排班功能,优化设备巡检表格展示

1. 新增批量修改排班API接口和页面弹窗功能
2. 设备巡检表格移除固定宽度并添加溢出提示,新增现场图像展示列
This commit is contained in:
2026-05-25 15:39:03 +08:00
parent 015ec7d70b
commit 501abc4821
4 changed files with 170 additions and 21 deletions

View File

@@ -60,3 +60,12 @@ export function batchGenerateSchedule(data) {
data: data
})
}
// 批量修改指定日期多个员工的班次
export function batchUpdateSchedule(data) {
return request({
url: '/wms/attendanceSchedule/batchUpdate',
method: 'put',
data: data
})
}

View File

@@ -95,12 +95,12 @@
<el-table :data="equipmentChecklistList" height="calc(100% - 20px)"
@selection-change="handleChecklistSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="检验编号" align="center" prop="checkNo" width="120" />
<el-table-column label="检验编号" align="center" prop="checkNo" />
<el-table-column label="设备部件名称" align="center" prop="partName" width="120" />
<el-table-column label="检验内容" align="center" prop="checkContent" min-width="120" />
<el-table-column label="设备状态" align="center" prop="equipmentState" width="80" />
<el-table-column label="检验标准" align="center" prop="checkStandard" min-width="120" />
<el-table-column label="备注" align="center" prop="remark" width="120" />
<el-table-column label="检验内容" align="center" prop="checkContent" show-overflow-tooltip />
<el-table-column label="设备状态" align="center" prop="equipmentState" />
<el-table-column label="检验标准" align="center" prop="checkStandard" show-overflow-tooltip />
<el-table-column label="备注" align="center" prop="remark" show-overflow-tooltip />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="180">
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-document-copy"

View File

@@ -112,6 +112,18 @@
</template>
</el-table-column>
<el-table-column label="巡检人" align="center" prop="inspector" />
<el-table-column label="现场图像" align="center" prop="photo">
<template slot-scope="scope">
<el-image
v-if="scope.row.photo"
:src="scope.row.photo"
fit="fill"
:preview-src-list="[scope.row.photo]"
style="width: 100px; height: 100px;"
/>
</template>
</el-table-column>
<el-table-column label="异常描述" align="center" prop="abnormalDesc" />
<el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">

View File

@@ -12,6 +12,7 @@
<el-button plain type="primary" icon="el-icon-plus" @click="handleCreate">创建排班</el-button>
<el-button plain type="info" icon="el-icon-refresh" @click="handleRefresh">刷新</el-button>
<el-button plain type="success" icon="el-icon-setting" @click="showTemplateManager = true">管理模板</el-button>
<el-button plain type="warning" icon="el-icon-edit" @click="handleBatchUpdate">批量修改</el-button>
</div>
<el-alert type="info" title="提示:双击排班单元格可编辑排班"></el-alert>
@@ -198,9 +199,45 @@
</div>
</el-dialog>
<!-- 批量修改弹窗 -->
<el-dialog title="批量修改排班" :visible.sync="batchDialogVisible" width="600px">
<el-form ref="batchForm" :model="batchForm" label-width="100px">
<el-form-item label="日期" prop="workDate" :rules="[{ required: true, message: '请选择日期', trigger: 'change' }]">
<el-date-picker v-model="batchForm.workDate" type="date" placeholder="选择日期"
value-format="yyyy-MM-dd" style="width: 100%;" />
</el-form-item>
<el-form-item label="班次" prop="shiftId" :rules="[{ required: true, message: '请选择班次', trigger: 'change' }]">
<el-select v-model="batchForm.shiftId" placeholder="选择班次" style="width: 100%;" clearable>
<el-option v-for="shift in shiftList" :key="shift.shiftId" :label="shift.shiftName" :value="shift.shiftId" />
</el-select>
<div v-if="batchForm.shiftId" class="shift-detail" style="margin-top: 8px;">
<div>
<span class="time-label">时段一</span>
<span class="time-value">{{ getShiftTime(batchForm.shiftId) }}</span>
</div>
</div>
</el-form-item>
<el-form-item label="员工" prop="userIds" :rules="[{ required: true, message: '请选择员工', trigger: 'change' }]">
<EmployeeSelector v-model="batchForm.userIds" :multiple="true" placeholder="选择要修改的员工"
title="选择员工" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="batchDialogVisible = false">取消</el-button>
<el-button type="primary" @click="submitBatchUpdate" :loading="buttonLoading">确定修改</el-button>
</div>
</el-dialog>
<!-- 编辑班次弹窗 -->
<el-dialog title="编辑班次" :visible.sync="editDialogVisible" width="400px">
<el-dialog :title="editDialogTitle" :visible.sync="editDialogVisible" :width="editForm.batchEdit ? '600px' : '400px'">
<el-form ref="editForm" :model="editForm" label-width="80px">
<el-form-item label="批量编辑">
<el-checkbox v-model="editForm.batchEdit" @change="handleBatchEditChange">勾选后可选择多个员工批量修改</el-checkbox>
</el-form-item>
<el-form-item v-if="editForm.batchEdit" label="员工">
<EmployeeSelector v-model="editForm.batchUserIds" :multiple="true" placeholder="选择要批量修改的员工"
title="选择员工" />
</el-form-item>
<el-form-item label="班次">
<el-select v-model="editForm.shiftId" placeholder="选择班次" style="width: 100%;">
<el-option v-for="shift in shiftList" :key="shift.shiftId" :label="shift.shiftName"
@@ -224,7 +261,7 @@
<div slot="footer" class="dialog-footer">
<el-button @click="cancelEdit">取消</el-button>
<el-button type="danger"
v-if="currentEditRow && currentEditRow[currentEditDate] && currentEditRow[currentEditDate].scheduleId"
v-if="!editForm.batchEdit && currentEditRow && currentEditRow[currentEditDate] && currentEditRow[currentEditDate].scheduleId"
@click="handleDelete">删除排班</el-button>
<el-button type="primary" @click="submitEdit" :disabled="!editForm.shiftId">确定</el-button>
</div>
@@ -236,7 +273,7 @@
import TimeRangePicker from '@/views/wms/report/components/timeRangePicker.vue'
import EmployeeSelector from '@/components/EmployeeSelector/index.vue'
import AttendanceTemplateManager from '@/components/AttendanceTemplateManager/index.vue'
import { listAttendanceSchedule, generateenerateSchedule, updateAttendanceSchedule, addAttendanceSchedule, delAttendanceSchedule } from '@/api/wms/attendanceSchedule'
import { listAttendanceSchedule, generateenerateSchedule, updateAttendanceSchedule, addAttendanceSchedule, delAttendanceSchedule, batchUpdateSchedule } from '@/api/wms/attendanceSchedule'
import { listShift } from '@/api/wms/attendanceShift'
import { listAttendanceShiftRule } from '@/api/wms/attendanceShiftRule'
import { listEmployeeInfo } from '@/api/wms/employeeInfo'
@@ -256,6 +293,12 @@ export default {
shiftList: [],
shiftRuleList: [],
dialogVisible: false,
batchDialogVisible: false,
batchForm: {
workDate: '',
shiftId: '',
userIds: ''
},
editDialogVisible: false,
showTemplateDialog: false,
showTemplateManager: false,
@@ -270,7 +313,9 @@ export default {
]
},
editForm: {
shiftId: ''
shiftId: '',
batchEdit: false,
batchUserIds: ''
},
currentEditRow: null,
currentEditDate: '',
@@ -332,6 +377,13 @@ export default {
})
return count
},
editDialogTitle() {
if (this.editForm.batchEdit) {
const employeeIds = this.editForm.batchUserIds ? this.editForm.batchUserIds.split(',').filter(id => id.trim()) : []
return `批量编辑排班 - ${this.currentEditDate || ''} (已选 ${employeeIds.length} 人)`
}
return `编辑排班 - ${this.currentEditDate || ''}`
},
currentShift() {
if (!this.editForm.shiftId) {
return null
@@ -501,6 +553,8 @@ export default {
} else {
this.editForm.shiftId = ''
}
this.editForm.batchEdit = false
this.editForm.batchUserIds = ''
this.editDialogVisible = true
},
@@ -508,13 +562,15 @@ export default {
cancelEdit() {
this.editDialogVisible = false
this.editForm.shiftId = ''
this.editForm.batchEdit = false
this.editForm.batchUserIds = ''
this.currentEditRow = null
this.currentEditDate = ''
},
// 提交编辑
submitEdit() {
if (!this.editForm.shiftId || !this.currentEditRow) {
if (!this.editForm.shiftId || (!this.currentEditRow && !this.editForm.batchEdit)) {
return
}
@@ -524,6 +580,30 @@ export default {
}
const date = this.currentEditDate
if (this.editForm.batchEdit) {
const userIds = this.editForm.batchUserIds.split(',').filter(id => id.trim())
if (userIds.length === 0) {
this.$message.warning('请选择要批量修改的员工')
return
}
this.buttonLoading = true
batchUpdateSchedule({
userIds: userIds,
workDate: date,
shiftId: shift.shiftId,
shiftName: shift.shiftName
}).then(() => {
this.$message.success(`批量修改成功,共修改 ${userIds.length} 名员工`)
this.buttonLoading = false
this.getScheduleList()
this.cancelEdit()
}).catch(() => {
this.buttonLoading = false
})
return
}
const employeeId = this.currentEditRow.employeeId
if (this.currentEditRow[date]) {
@@ -555,20 +635,16 @@ export default {
})
}
// this.currentEditRow[date] = {
// scheduleId: this.currentEditRow[date]?.scheduleId,
// shiftId: shift.shiftId,
// shiftName: shift.shiftName,
// shiftType: shift.shiftType,
// shiftStartTime: shift.startTime,
// shiftEndTime: shift.endTime,
// shiftStartTime2: shift.startTime2,
// shiftEndTime2: shift.endTime2
// }
this.cancelEdit()
},
// 批量编辑模式切换
handleBatchEditChange(val) {
if (!val) {
this.editForm.batchUserIds = ''
}
},
// 删除排班
handleDelete() {
const scheduleId = this.currentEditRow[this.currentEditDate]?.scheduleId
@@ -626,6 +702,58 @@ export default {
})
},
// 批量修改排班
handleBatchUpdate() {
this.batchForm = {
workDate: '',
shiftId: '',
userIds: ''
}
this.batchDialogVisible = true
},
// 提交批量修改
submitBatchUpdate() {
this.$refs['batchForm'].validate(valid => {
if (!valid) return
const userIds = this.batchForm.userIds.split(',').filter(id => id.trim())
if (userIds.length === 0) {
this.$message.warning('请选择员工')
return
}
const shift = this.shiftList.find(s => s.shiftId === this.batchForm.shiftId)
if (!shift) {
this.$message.warning('请选择班次')
return
}
this.$confirm(`确定要为 ${userIds.length} 名员工修改 ${this.batchForm.workDate} 的班次为「${shift.shiftName}」吗?`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.buttonLoading = true
batchUpdateSchedule({
userIds: userIds,
workDate: this.batchForm.workDate,
shiftId: shift.shiftId,
shiftName: shift.shiftName
}).then(() => {
this.$message.success('批量修改成功')
this.batchDialogVisible = false
this.buttonLoading = false
this.getScheduleList()
}).catch(() => {
this.buttonLoading = false
})
}).catch(() => {
this.$message.info('已取消')
})
})
},
// 处理班次变更
handleShiftChange(employeeId, date, shiftId) {
if (!shiftId) {