1.实现了工作流引擎 中 请假流程demo(定义在 resources/leave.bpmn)

2.增加一个一级菜单 OA 办公 下面两个菜单: 请假申请,待办任务
3.暂时不知如何找部门领导, 暂时写死为 admin
4.activity 用户组使用 用户岗位来代替。
5.新增一个用户 hradmin, 密码 123456  岗位是 人力资源
6.演示流程。
  a. admin 登陆 申请请假
  b. admin 待办任务(审批)
  c. hradmin 登陆 待办任务(审批)
  d. admin 登陆 待办任务 (确认)
This commit is contained in:
jason
2021-10-13 23:43:03 +08:00
parent 1bb10d007e
commit ee8dcd0888
43 changed files with 2405 additions and 17 deletions

View File

@ -0,0 +1,54 @@
import request from '@/utils/request'
// 创建请假申请
export function createLeave(data) {
return request({
url: '/oa/leave/create',
method: 'post',
data: data
})
}
// 更新请假申请
export function updateLeave(data) {
return request({
url: '/oa/leave/update',
method: 'put',
data: data
})
}
// 删除请假申请
export function deleteLeave(id) {
return request({
url: '/oa/leave/delete?id=' + id,
method: 'delete'
})
}
// 获得请假申请
export function getLeave(id) {
return request({
url: '/oa/leave/get?id=' + id,
method: 'get'
})
}
// 获得请假申请分页
export function getLeavePage(query) {
return request({
url: '/oa/leave/page',
method: 'get',
params: query
})
}
// 导出请假申请 Excel
export function exportLeaveExcel(query) {
return request({
url: '/oa/leave/export-excel',
method: 'get',
params: query,
responseType: 'blob'
})
}

View File

@ -0,0 +1,75 @@
import request from '@/utils/request'
// 创建请假申请
export function createLeave(data) {
return request({
url: '/oa/leave/create',
method: 'post',
data: data
})
}
// 更新请假申请
export function updateLeave(data) {
return request({
url: '/oa/leave/update',
method: 'put',
data: data
})
}
// 删除请假申请
export function deleteLeave(id) {
return request({
url: '/oa/leave/delete?id=' + id,
method: 'delete'
})
}
// 获得请假申请
export function getLeave(id) {
return request({
url: '/oa/leave/get?id=' + id,
method: 'get'
})
}
// 获得待办任务分页
export function getTodoTaskPage(query) {
return request({
url: '/workflow/task/todo/page',
method: 'get',
params: query
})
}
// 签收任务
export function claimTask(id) {
return request({
url: '/workflow/task/claim?id=' + id,
method: 'get'
})
}
export function completeTask(data) {
return request({
url: '/workflow/task/complete',
method: 'post',
data: data
})
}
export function taskSteps(data) {
return request({
url: '/workflow/task/task-steps',
method: 'post',
data: data
})
}
export function processHistorySteps(id) {
return request({
url: '/workflow/task/process/history-steps?id='+id,
method: 'get'
})
}

View File

@ -29,6 +29,9 @@ export const DICT_TYPE = {
INF_API_ERROR_LOG_PROCESS_STATUS: 'inf_api_error_log_process_status',
TOOL_CODEGEN_TEMPLATE_TYPE: 'tool_codegen_template_type',
OA_LEAVE_STATUS: 'oa_leave_status',
OA_LEAVE_TYPE: 'oa_leave_type'
}
/**

View File

@ -0,0 +1,347 @@
<template>
<div class="app-container">
<!-- 搜索工作栏 -->
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="流程id" prop="processInstanceId">
<el-input v-model="queryParams.processInstanceId" placeholder="请输入流程id" clearable size="small" @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="状态" prop="status">
<el-select v-model="queryParams.status" placeholder="请选择状态">
<el-option
v-for="dict in leaveStatusData"
:key="parseInt(dict.value)"
:label="dict.label"
:value="parseInt(dict.value)"
/>
</el-select>
</el-form-item>
<el-form-item label="开始时间">
<el-date-picker v-model="dateRangeStartTime" size="small" style="width: 240px" value-format="yyyy-MM-dd"
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" />
</el-form-item>
<el-form-item label="结束时间">
<el-date-picker v-model="dateRangeEndTime" size="small" style="width: 240px" value-format="yyyy-MM-dd"
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" />
</el-form-item>
<el-form-item label="请假类型" prop="leaveType">
<el-select v-model="queryParams.leaveType" placeholder="请选择请假类型">
<el-option
v-for="dict in leaveTypeDictData"
:key="parseInt(dict.value)"
:label="dict.label"
:value="parseInt(dict.value)"
/>
</el-select>
</el-form-item>
<el-form-item label="原因" prop="reason">
<el-input v-model="queryParams.reason" placeholder="请输入原因" clearable size="small" @keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item label="申请时间">
<el-date-picker v-model="dateRangeApplyTime" size="small" style="width: 240px" value-format="yyyy-MM-dd"
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<!-- 操作工具栏 -->
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
v-hasPermi="['oa:leave:create']">新增</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<!-- 列表 -->
<el-table v-loading="loading" :data="list">
<el-table-column label="请假表单主键" align="center" prop="id" />
<el-table-column label="状态" align="center" prop="status" :formatter="statusFormat" />
<el-table-column label="申请人id" align="center" prop="userId" />
<el-table-column label="开始时间" align="center" prop="startTime" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.startTime) }}</span>
</template>
</el-table-column>
<el-table-column label="结束时间" align="center" prop="endTime" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.endTime) }}</span>
</template>
</el-table-column>
<el-table-column label="请假类型" align="center" prop="leaveType" />
<el-table-column label="原因" align="center" prop="reason" />
<el-table-column label="申请时间" align="center" prop="applyTime" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.applyTime) }}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleStep(scope.row)">审批进度</el-button>
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleDetail(scope.row)">详情</el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页组件 -->
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
@pagination="getList"/>
<!-- 对话框(添加 / 修改) -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="开始时间" prop="startTime">
<el-date-picker clearable size="small" v-model="form.startTime" type="date" value-format="timestamp" placeholder="选择开始时间" />
</el-form-item>
<el-form-item label="结束时间" prop="endTime">
<el-date-picker clearable size="small" v-model="form.endTime" type="date" value-format="timestamp" placeholder="选择结束时间" />
</el-form-item>
<el-form-item label="请假类型" prop="leaveType">
<el-select v-model="form.leaveType" placeholder="请选择">
<el-option
v-for="dict in leaveTypeDictData"
:key="parseInt(dict.value)"
:label="dict.label"
:value="parseInt(dict.value)"
/>
</el-select>
</el-form-item>
<el-form-item label="原因" prop="reason">
<el-input v-model="form.reason" placeholder="请输入原因" />
</el-form-item>
<el-form-item label="申请时间" prop="applyTime">
<el-date-picker clearable size="small" v-model="form.applyTime" type="date" value-format="timestamp" placeholder="选择申请时间" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
<el-dialog :title="title" :visible.sync="dialogDetailVisible" width="500px" append-to-body>
<el-form ref="form" :model="form" label-width="80px">
<el-form-item label="状态" >
{{ getDictDataLabel(DICT_TYPE.OA_LEAVE_STATUS, form.status) }}
</el-form-item>
<el-form-item label="申请人id" >{{form.userId}}</el-form-item>
<el-form-item label="开始时间" >{{ parseTime(form.startTime) }}</el-form-item>
<el-form-item label="结束时间" prop="endTime">{{ parseTime(form.endTime) }}</el-form-item>
<el-form-item label="请假类型" prop="leaveType">
{{ getDictDataLabel(DICT_TYPE.OA_LEAVE_TYPE, form.leaveType) }}
</el-form-item>
<el-form-item label="原因" prop="reason">{{form.reason}}</el-form-item>
<el-form-item label="申请时间" prop="applyTime">{{ parseTime(form.applyTime) }}</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="dialogDetailVisible = false"> </el-button>
<el-button @click="dialogDetailVisible = false"> </el-button>
</div>
</el-dialog>
<el-dialog :title="title" :visible.sync="dialogStepsVisible" width="600px" append-to-body>
<el-steps :active="handleTask.historyTask.length-1" finish-status="success" >
<el-step :title="item.stepName " :description="' 办理人:' + item.assignee " icon="el-icon-edit" v-for="(item) in handleTask.historyTask"></el-step>
</el-steps>
<br/>
<el-steps direction="vertical" :active="handleTask.historyTask.length-1">
<el-step :title="item.stepName" :description=" ' 意见:'+ item.comment" v-for="(item) in handleTask.historyTask"></el-step>
</el-steps>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="dialogStepsVisible = false"> </el-button>
<el-button @click="dialogStepsVisible = false"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { createLeave, updateLeave, deleteLeave, getLeave, getLeavePage, exportLeaveExcel } from "@/api/oa/leave"
import { getDictDataLabel, getDictDatas, DICT_TYPE } from '@/utils/dict'
import { processHistorySteps } from '@/api/oa/todo'
export default {
name: "Leave",
components: {
},
data() {
return {
// 遮罩层
loading: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 请假申请列表
list: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
//进度弹出层
dialogDetailVisible: false,
//审批进度弹出层
dialogStepsVisible: false,
dateRangeStartTime: [],
dateRangeEndTime: [],
dateRangeApplyTime: [],
// 查询参数
queryParams: {
pageNo: 1,
pageSize: 10,
processInstanceId: null,
status: null,
userId: null,
leaveType: null,
reason: null,
},
// 表单参数
form: {},
handleTask: {
historyTask:[{
stepName:"步骤一"
}
],
taskVariable: "",
formObject: {}
},
steps:[{
stepName:"步骤一"
}],
// 表单校验
rules: {
startTime: [{ required: true, message: "开始时间不能为空", trigger: "blur" }],
endTime: [{ required: true, message: "结束时间不能为空", trigger: "blur" }],
applyTime: [{ required: true, message: "申请时间不能为空", trigger: "blur" }],
},
statusFormat(row, column) {
return getDictDataLabel(DICT_TYPE.OA_LEAVE_STATUS, row.status)
},
leaveTypeDictData: getDictDatas(DICT_TYPE.OA_LEAVE_TYPE),
leaveStatusData: getDictDatas(DICT_TYPE.OA_LEAVE_STATUS)
};
},
created() {
this.getList();
},
methods: {
/** 查询列表 */
getList() {
this.loading = true;
// 处理查询参数
let params = {...this.queryParams};
this.addBeginAndEndTime(params, this.dateRangeStartTime, 'startTime');
this.addBeginAndEndTime(params, this.dateRangeEndTime, 'endTime');
this.addBeginAndEndTime(params, this.dateRangeApplyTime, 'applyTime');
// 执行查询
getLeavePage(params).then(response => {
this.list = response.data.list;
this.total = response.data.total;
this.loading = false;
});
},
/** 取消按钮 */
cancel() {
this.open = false;
this.reset();
},
/** 表单重置 */
reset() {
this.form = {
id: undefined,
processInstanceId: undefined,
status: undefined,
userId: undefined,
startTime: undefined,
endTime: undefined,
leaveType: undefined,
reason: undefined,
applyTime: undefined,
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNo = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.dateRangeStartTime = [];
this.dateRangeEndTime = [];
this.dateRangeApplyTime = [];
this.resetForm("queryForm");
this.handleQuery();
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加请假申请";
},
/** 详情按钮操作 */
handleDetail(row) {
this.reset();
const id = row.id;
getLeave(id).then(response => {
this.form = response.data;
this.dialogDetailVisible = true
this.title = "请假详情";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (!valid) {
return;
}
// 修改的提交
if (this.form.id != null) {
updateLeave(this.form).then(response => {
this.msgSuccess("修改成功");
this.open = false;
this.getList();
});
return;
}
// 添加的提交
createLeave(this.form).then(response => {
this.msgSuccess("新增成功");
this.open = false;
this.getList();
});
});
},
/** 审批进度 */
handleStep(row) {
const id = row.processInstanceId;
processHistorySteps(id).then(response => {
this.handleTask.historyTask = response.data;
this.dialogStepsVisible = true
this.title = "审批进度";
});
},
/** 导出按钮操作 */
handleExport() {
// 处理查询参数
let params = {...this.queryParams};
params.pageNo = undefined;
params.pageSize = undefined;
this.addBeginAndEndTime(params, this.dateRangeStartTime, 'startTime');
this.addBeginAndEndTime(params, this.dateRangeEndTime, 'endTime');
this.addBeginAndEndTime(params, this.dateRangeApplyTime, 'applyTime');
// 执行导出
this.$confirm('是否确认导出所有请假申请数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function() {
return exportLeaveExcel(params);
}).then(response => {
this.downloadExcel(response, '请假申请.xls');
})
}
}
};
</script>

View File

@ -0,0 +1,284 @@
<template>
<div class="app-container">
<!-- 搜索工作栏 -->
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="状态" prop="status">
<el-select v-model="queryParams.status" placeholder="请选择状态">
<el-option
v-for="dict in leaveStatusData"
:key="parseInt(dict.value)"
:label="dict.label"
:value="parseInt(dict.value)"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<!-- 列表 -->
<el-table v-loading="loading" :data="list">
<el-table-column label="任务Id" align="center" prop="id" />
<el-table-column label="流程名称" align="center" prop="processName" />
<el-table-column label="任务状态" align="center" :formatter="statusFormat" prop="status" />
<!-- <el-table-column label="申请人id" align="center" prop="userId" />-->
<!-- <el-table-column label="开始时间" align="center" prop="startTime" width="180">-->
<!-- <template slot-scope="scope">-->
<!-- <span>{{ parseTime(scope.row.startTime) }}</span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column label="结束时间" align="center" prop="endTime" width="180">-->
<!-- <template slot-scope="scope">-->
<!-- <span>{{ parseTime(scope.row.endTime) }}</span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column label="请假类型" align="center" prop="leaveType" />-->
<!-- <el-table-column label="原因" align="center" prop="reason" />-->
<!-- <el-table-column label="申请时间" align="center" prop="applyTime" width="180">-->
<!-- <template slot-scope="scope">-->
<!-- <span>{{ parseTime(scope.row.applyTime) }}</span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" v-if="scope.row.status == 1" @click="handleClaim(scope.row)">签收</el-button>
<el-button size="mini" type="text" icon="el-icon-edit" v-if="scope.row.status == 2" @click="handleLeaveApprove(scope.row)">办理</el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页组件 -->
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
@pagination="getList"/>
<el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
<el-tabs tab-position="left" style="height: 500px;">
<el-tab-pane label="详情">
<el-form ref="form" :model="handleTask.formObject" label-width="80px">
<el-form-item label="状态" >
{{ getDictDataLabel(DICT_TYPE.OA_LEAVE_STATUS, handleTask.formObject.status) }}
</el-form-item>
<el-form-item label="申请人id" >{{handleTask.formObject.userId}}</el-form-item>
<el-form-item label="开始时间" >{{ parseTime(handleTask.formObject.startTime) }}</el-form-item>
<el-form-item label="结束时间" prop="endTime">{{ parseTime(handleTask.formObject.endTime) }}</el-form-item>
<el-form-item label="请假类型" prop="leaveType">
{{ getDictDataLabel(DICT_TYPE.OA_LEAVE_TYPE, handleTask.formObject.leaveType) }}
</el-form-item>
<el-form-item label="原因" prop="reason">{{handleTask.formObject.reason}}</el-form-item>
<el-form-item label="申请时间" prop="applyTime">{{ parseTime(handleTask.formObject.applyTime) }}</el-form-item>
</el-form>
</el-tab-pane>
<el-tab-pane label="任务处理">
<el-steps :active="handleTask.historyTask.length-1" simple finish-status="success">
<el-step :title="item.stepName" icon="el-icon-edit" v-for="(item) in handleTask.historyTask" ></el-step>
</el-steps>
<br/>
<el-steps direction="vertical" :active="handleTask.historyTask.length-1" finish-status="success" space="60px">
<el-step :title="item.stepName" :description="item.comment" v-for="(item) in handleTask.historyTask" ></el-step>
</el-steps>
<br/>
<el-form ref="taskForm" :model="task" label-width="80px" v-show="handleTask.taskVariable !=''">
<el-form-item label="处理意见" prop="approved">
<el-select v-model="task.approved" placeholder="处理意见">
<el-option
v-for="dict in approvedData"
:key="parseInt(dict.value)"
:label="dict.label"
:value="parseInt(dict.value)"
/>
</el-select>
</el-form-item>
<el-input
type="textarea"
:rows="2"
v-model="task.comment">
</el-input>
</el-form>
<br/>
<el-button type="primary" @click="submitTask">提交</el-button>
</el-tab-pane>
</el-tabs>
</el-dialog>
</div>
</template>
<script>
import { completeTask, taskSteps, deleteLeave, getLeave, getTodoTaskPage, claimTask } from "@/api/oa/todo";
import { getDictDataLabel, getDictDatas, DICT_TYPE } from '@/utils/dict'
export default {
name: "Todo",
components: {
},
data() {
return {
// 遮罩层
loading: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 请假申请列表
list: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNo: 1,
pageSize: 10
},
// 表单参数
form: {},
handleTask: {
historyTask:[{
stepName:"步骤一"
}
],
taskVariable: "",
formObject: {}
},
steps:[{
stepName:"步骤一"
}],
task: {
approved : 1,
variables: {},
taskId: undefined,
comment: ""
},
rules: {
},
leaveTypeDictData: getDictDatas(DICT_TYPE.OA_LEAVE_TYPE),
leaveStatusData: getDictDatas(DICT_TYPE.OA_LEAVE_STATUS),
approvedData: [
{
value: 1,
label: '同意'
},
{
value: 0,
label: '不同意'
}
]
};
},
created() {
this.getList();
},
methods: {
/** 查询列表 */
getList() {
this.loading = true;
// 处理查询参数
let params = {...this.queryParams};
// 执行查询
getTodoTaskPage(params).then(response => {
this.list = response.data.list;
this.total = response.data.total;
this.loading = false;
});
},
/** 取消按钮 */
cancel() {
this.open = false;
this.reset();
},
/** 表单重置 */
reset() {
this.form = {
id: undefined,
processInstanceId: undefined,
status: undefined,
userId: undefined,
startTime: undefined,
endTime: undefined,
leaveType: undefined,
reason: undefined,
applyTime: undefined,
};
this.resetForm("form");
},
statusFormat(row, column) {
return row.status == 1 ? "未签收" : "已签收";
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNo = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.dateRangeStartTime = [];
this.dateRangeEndTime = [];
this.dateRangeApplyTime = [];
this.resetForm("queryForm");
this.handleQuery();
},
handleLeaveApprove(row) {
this.reset();
const businessKey = row.businessKey;
const taskId = row.id;
const processKey = row.processKey;
const data = {
taskId : taskId,
businessKey: businessKey,
processKey: processKey
}
taskSteps(data).then(response => {
this.form = {};
this.handleTask = response.data;
this.task.taskId = taskId;
this.open = true;
this.title = "任务办理";
});
},
/** 任务签收操作 */
handleClaim(row) {
this.reset();
const id = row.id;
claimTask(id).then(() => {
this.getList();
this.msgSuccess("签收成功");
});
},
/** 提交任务 */
submitTask() {
const taskVariableName = this.handleTask.taskVariable;
if (taskVariableName != "") {
if (this.task.approved == 1) {
this.task.variables[taskVariableName] = true;
}
if (this.task.approved == 0) {
this.task.variables[taskVariableName] = false;
}
}
completeTask(this.task).then(response => {
this.msgSuccess("执行任务成功");
this.open = false;
this.getList();
})
},
/** 删除按钮操作 */
handleDelete(row) {
const id = row.id;
this.$confirm('是否确认删除请假申请编号为"' + id + '"的数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function() {
return deleteLeave(id);
}).then(() => {
this.getList();
this.msgSuccess("删除成功");
})
}
}
};
</script>