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" width="160">
<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>
<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>
<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>
<el-button :loading="buttonLoading" icon="el-icon-delete" size="mini" @click="handleDelete(scope.row)"
v-if="scope.row.approvalStatus === '已驳回'">删除</el-button>
</template>
</el-table-column>
</el-table>
@@ -121,7 +123,7 @@
<script>
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 FileUpload from '@/components/FileUpload'
import EmployeeSelector from '@/components/EmployeeSelector'
@@ -190,6 +192,11 @@ export default {
this.deptOptions = response.data
})
},
canDelete(row) {
// 需要row.tasks下的每一项都为已驳回状态
console.log(row);
// return row.tasks.every(task => task.taskStatus === 'rejected');
},
// 获取部门负责人
getDeptLeader() {
const selectedDept = this.deptOptions.find(item => item.deptId === this.form.deptId)
@@ -222,6 +229,24 @@ export default {
handleReset() {
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() {
this.form = {

View File

@@ -75,7 +75,7 @@
<div style="text-align: center;">
<el-button type="primary" @click="handleSubmit" v-loading="buttonLoading">{{ form.leaveId ? '更新申请' :
'批量提交申请'
}}</el-button>
}}</el-button>
<el-button @click="handleReset">重置表单</el-button>
</div>
</el-card>
@@ -128,9 +128,11 @@
<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" width="160">
<template slot-scope="scope" v-if="scope.row.approvalStatus === '待审批'">
<el-button 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>
<template slot-scope="scope" >
<el-button :loading="buttonLoading" v-if="scope.row.approvalStatus === '待审批'" icon="el-icon-edit" size="mini" @click="handleEdit(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>
</el-table-column>
</el-table>
@@ -144,7 +146,7 @@
<script>
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 FileUpload from '@/components/FileUpload'
import EmployeeSelector from '@/components/EmployeeSelector'
@@ -218,6 +220,7 @@ export default {
}
this.form.approverName = approverName
},
/** 查询员工请假申请列表 */
getList() {
this.loading = true;
@@ -255,6 +258,25 @@ export default {
}
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() {
this.reset()
},

View File

@@ -145,6 +145,15 @@
>
驳回
</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>
</el-table-column>
@@ -215,7 +224,7 @@
</template>
<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'
@@ -324,6 +333,28 @@ export default {
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) {
if (row.applyType === 'seal') {