feat(HRM): 为待办和申请页面添加删除驳回记录功能

为待办列表和外出/请假申请页面添加删除按钮,允许用户删除状态为"已驳回"的记录。同时为所有操作按钮添加loading状态防止重复点击。

- 在待办列表(index.vue)中添加删除按钮,处理驳回状态的记录
- 在外出申请(goout.vue)和请假申请(leave.vue)页面添加删除按钮
- 为所有操作按钮添加loading状态
- 新增删除API调用方法
This commit is contained in:
2026-04-29 15:11:44 +08:00
parent 7d4d2282fe
commit 6c1a15b952
3 changed files with 89 additions and 11 deletions

View File

@@ -100,12 +100,14 @@
<el-table-column label="外出原因" align="center" prop="outReason" show-overflow-tooltip /> <el-table-column label="外出原因" align="center" prop="outReason" show-overflow-tooltip />
<el-table-column label="操作" align="center" width="160"> <el-table-column label="操作" align="center" width="160">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button icon="el-icon-printer" size="mini" v-if="scope.row.approvalStatus === '已同意'" <el-button :loading="buttonLoading" icon="el-icon-printer" size="mini" v-if="scope.row.approvalStatus === '已同意'"
@click="handlePrint(scope.row)">打印</el-button> @click="handlePrint(scope.row)">打印</el-button>
<el-button icon="el-icon-edit" size="mini" @click="handleEdit(scope.row)" <el-button :loading="buttonLoading" icon="el-icon-edit" size="mini" @click="handleEdit(scope.row)"
v-if="scope.row.approvalStatus === '待审批'">修改</el-button> v-if="scope.row.approvalStatus === '待审批'">修改</el-button>
<el-button icon="el-icon-delete" size="mini" @click="handleWithdraw(scope.row)" <el-button :loading="buttonLoading" icon="el-icon-delete" size="mini" @click="handleWithdraw(scope.row)"
v-if="scope.row.approvalStatus === '待审批'">撤回</el-button> v-if="scope.row.approvalStatus === '待审批'">撤回</el-button>
<el-button :loading="buttonLoading" icon="el-icon-delete" size="mini" @click="handleDelete(scope.row)"
v-if="scope.row.approvalStatus === '已驳回'">删除</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
@@ -121,7 +123,7 @@
<script> <script>
import { getOutRequest, addOutRequest, updateOutRequest } from "@/api/wms/outRequest"; import { getOutRequest, addOutRequest, updateOutRequest } from "@/api/wms/outRequest";
import { listApproval, updateApproval, withdrawApproval } from "@/api/wms/approval" import { listApproval, updateApproval, withdrawApproval, delApproval } from "@/api/wms/approval"
import { listDept } from "@/api/wms/dept" import { listDept } from "@/api/wms/dept"
import FileUpload from '@/components/FileUpload' import FileUpload from '@/components/FileUpload'
import EmployeeSelector from '@/components/EmployeeSelector' import EmployeeSelector from '@/components/EmployeeSelector'
@@ -190,6 +192,11 @@ export default {
this.deptOptions = response.data this.deptOptions = response.data
}) })
}, },
canDelete(row) {
// 需要row.tasks下的每一项都为已驳回状态
console.log(row);
// return row.tasks.every(task => task.taskStatus === 'rejected');
},
// 获取部门负责人 // 获取部门负责人
getDeptLeader() { getDeptLeader() {
const selectedDept = this.deptOptions.find(item => item.deptId === this.form.deptId) const selectedDept = this.deptOptions.find(item => item.deptId === this.form.deptId)
@@ -222,6 +229,24 @@ export default {
handleReset() { handleReset() {
this.reset() this.reset()
}, },
/** 删除按钮操作 */
handleDelete(row) {
this.$confirm('确认删除吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.buttonLoading = true;
delApproval(row.approvalId).then(response => {
this.buttonLoading = false;
this.$message({
message: '删除成功',
type: 'success'
});
this.getList();
});
})
},
// 表单重置 // 表单重置
reset() { reset() {
this.form = { this.form = {

View File

@@ -75,7 +75,7 @@
<div style="text-align: center;"> <div style="text-align: center;">
<el-button type="primary" @click="handleSubmit" v-loading="buttonLoading">{{ form.leaveId ? '更新申请' : <el-button type="primary" @click="handleSubmit" v-loading="buttonLoading">{{ form.leaveId ? '更新申请' :
'批量提交申请' '批量提交申请'
}}</el-button> }}</el-button>
<el-button @click="handleReset">重置表单</el-button> <el-button @click="handleReset">重置表单</el-button>
</div> </div>
</el-card> </el-card>
@@ -128,9 +128,11 @@
<el-table-column label="具体原因" align="center" prop="leaveReason" show-overflow-tooltip /> <el-table-column label="具体原因" align="center" prop="leaveReason" show-overflow-tooltip />
<el-table-column label="请假小时" align="center" prop="leaveDays" /> <el-table-column label="请假小时" align="center" prop="leaveDays" />
<el-table-column label="操作" align="center" width="160"> <el-table-column label="操作" align="center" width="160">
<template slot-scope="scope" v-if="scope.row.approvalStatus === '待审批'"> <template slot-scope="scope" >
<el-button icon="el-icon-edit" size="mini" @click="handleEdit(scope.row)">修改</el-button> <el-button :loading="buttonLoading" v-if="scope.row.approvalStatus === '待审批'" icon="el-icon-edit" size="mini" @click="handleEdit(scope.row)">修改</el-button>
<el-button icon="el-icon-delete" size="mini" @click="handleWithdraw(scope.row)">撤回</el-button> <el-button :loading="buttonLoading" v-if="scope.row.approvalStatus === '待审批'" icon="el-icon-delete" size="mini" @click="handleWithdraw(scope.row)">撤回</el-button>
<el-button :loading="buttonLoading" icon="el-icon-delete" size="mini" @click="handleDelete(scope.row)"
v-if="scope.row.approvalStatus === '已驳回'">删除</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
@@ -144,7 +146,7 @@
<script> <script>
import { getLeaveRequest, addLeaveRequest, updateLeaveRequest } from "@/api/wms/leaveRequest"; import { getLeaveRequest, addLeaveRequest, updateLeaveRequest } from "@/api/wms/leaveRequest";
import { listApproval, updateApproval, withdrawApproval } from "@/api/wms/approval" import { listApproval, updateApproval, withdrawApproval, delApproval } from "@/api/wms/approval"
import { listDept } from "@/api/wms/dept" import { listDept } from "@/api/wms/dept"
import FileUpload from '@/components/FileUpload' import FileUpload from '@/components/FileUpload'
import EmployeeSelector from '@/components/EmployeeSelector' import EmployeeSelector from '@/components/EmployeeSelector'
@@ -218,6 +220,7 @@ export default {
} }
this.form.approverName = approverName this.form.approverName = approverName
}, },
/** 查询员工请假申请列表 */ /** 查询员工请假申请列表 */
getList() { getList() {
this.loading = true; this.loading = true;
@@ -255,6 +258,25 @@ export default {
} }
this.form.list.splice(index, 1); this.form.list.splice(index, 1);
}, },
// 删除按钮操作
handleDelete(row) {
// 确认删除
this.$confirm('确认删除该请假申请吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.buttonLoading = true;
delApproval(row.approvalId).then(response => {
this.buttonLoading = false;
this.$message({
message: '删除成功',
type: 'success'
});
this.getList();
});
});
},
handleReset() { handleReset() {
this.reset() this.reset()
}, },
@@ -325,7 +347,7 @@ export default {
this.buttonLoading = true; this.buttonLoading = true;
const { list, ...commonFields } = this.form; // 拆分公共字段和时段列表 const { list, ...commonFields } = this.form; // 拆分公共字段和时段列表
let successCount = 0; let successCount = 0;
let failCount = 0; let failCount = 0;
const failReasons = []; const failReasons = [];
// 2. 循环处理每个时段,逐个发送请求 // 2. 循环处理每个时段,逐个发送请求

View File

@@ -145,6 +145,15 @@
> >
驳回 驳回
</el-button> </el-button>
<el-button
v-if="scope.row.taskStatus === 'rejected'"
size="small"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
:loading="buttonLoading"
>
删除
</el-button>
</template> </template>
</template> </template>
</el-table-column> </el-table-column>
@@ -215,7 +224,7 @@
</template> </template>
<script> <script>
import { listApprovalTask, rejectApprovalTask, resolveApprovalTask } from '@/api/wms/approvalTask' import { listApprovalTask, rejectApprovalTask, resolveApprovalTask, delApprovalTask } from '@/api/wms/approvalTask'
import FileList from '@/components/FileList/index.vue' import FileList from '@/components/FileList/index.vue'
@@ -324,6 +333,28 @@ export default {
this.getTodoList() this.getTodoList()
}, },
// 删除按钮操作
handleDelete(row) {
this.buttonLoading = true
// 确认删除
this.$confirm('确认删除该待办吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}).then(async () => {
this.buttonLoading = true
try {
await delApprovalTask(row.taskId)
this.$message.success('删除成功!')
this.getTodoList() // 重新查询列表
} catch (err) {
this.$message.error('删除失败:' + err.message)
} finally {
this.buttonLoading = false
}
})
},
// 查看详情 // 查看详情
handleDetail(row) { handleDetail(row) {
if (row.applyType === 'seal') { if (row.applyType === 'seal') {