refactor(workflow): 移除工作流相关代码和文件
移除工作流模块的前端代码，包括API接口、路由配置、组件和页面视图 删除与工作流相关的表单、分类、任务、模型等API调用和页面逻辑 清理不再使用的组件和依赖项
This commit is contained in:
砂糖
@@ -1,53 +0,0 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
// 查询流程分类列表
|
||||
export function listCategory(query) {
|
||||
return request({
|
||||
url: '/workflow/category/list',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 查询流程分类列表
|
||||
export function listAllCategory(query) {
|
||||
return request({
|
||||
url: '/workflow/category/listAll',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 查询流程分类详细
|
||||
export function getCategory(categoryId) {
|
||||
return request({
|
||||
url: '/workflow/category/' + categoryId,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
// 新增流程分类
|
||||
export function addCategory(data) {
|
||||
return request({
|
||||
url: '/workflow/category',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 修改流程分类
|
||||
export function updateCategory(data) {
|
||||
return request({
|
||||
url: '/workflow/category',
|
||||
method: 'put',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 删除流程分类
|
||||
export function delCategory(categoryId) {
|
||||
return request({
|
||||
url: '/workflow/category/' + categoryId,
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
@@ -1,51 +0,0 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
// 查询流程部署列表
|
||||
export function listDeploy(query) {
|
||||
return request({
|
||||
url: '/workflow/deploy/list',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
export function listPublish(query) {
|
||||
return request({
|
||||
url: '/workflow/deploy/publishList',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 获取流程模型流程图
|
||||
export function getBpmnXml(definitionId) {
|
||||
return request({
|
||||
url: '/workflow/deploy/bpmnXml/' + definitionId,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
// 修改流程状态
|
||||
export function changeState(params) {
|
||||
return request({
|
||||
url: '/workflow/deploy/changeState',
|
||||
method: 'put',
|
||||
params: params
|
||||
})
|
||||
}
|
||||
|
||||
// 删除流程部署
|
||||
export function delDeploy(deployIds) {
|
||||
return request({
|
||||
url: '/workflow/deploy/' + deployIds,
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
|
||||
// 查询流程部署关联表单信息
|
||||
export function getFormByDeployId(deployId) {
|
||||
return request({
|
||||
url: '/workflow/deploy/form/' + deployId,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
@@ -1,10 +0,0 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
// 撤回任务
|
||||
export function revokeProcess(data) {
|
||||
return request({
|
||||
url: '/workflow/task/revokeProcess',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
@@ -1,52 +0,0 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
// 查询流程表单列表
|
||||
export function listForm(query) {
|
||||
return request({
|
||||
url: '/workflow/form/list',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 查询流程表单详细
|
||||
export function getForm(formId) {
|
||||
return request({
|
||||
url: '/workflow/form/' + formId,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
// 新增流程表单
|
||||
export function addForm(data) {
|
||||
return request({
|
||||
url: '/workflow/form',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 修改流程表单
|
||||
export function updateForm(data) {
|
||||
return request({
|
||||
url: '/workflow/form',
|
||||
method: 'put',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
// 挂载表单
|
||||
export function addDeployForm(data) {
|
||||
return request({
|
||||
url: '/workflow/form/addDeployForm',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 删除流程表单
|
||||
export function delForm(formId) {
|
||||
return request({
|
||||
url: '/workflow/form/' + formId,
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
@@ -1,10 +0,0 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
// 查询流程实例详情信息
|
||||
export function getDetailInstance(query) {
|
||||
return request({
|
||||
url: '/workflow/instance/detail',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
@@ -1,84 +0,0 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
// 查询流程模型信息
|
||||
export function listModel(query) {
|
||||
return request({
|
||||
url: '/workflow/model/list',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 查询流程模型信息
|
||||
export function historyModel(query) {
|
||||
return request({
|
||||
url: '/workflow/model/historyList',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
export function getModel(modelId) {
|
||||
return request({
|
||||
url: '/workflow/model/' + modelId,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
// 新增模型信息
|
||||
export function addModel(data) {
|
||||
return request({
|
||||
url: '/workflow/model',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 修改模型信息
|
||||
export function updateModel(data) {
|
||||
return request({
|
||||
url: '/workflow/model',
|
||||
method: 'put',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 保存流程模型
|
||||
export function saveModel(data) {
|
||||
return request({
|
||||
url: '/workflow/model/save',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
export function latestModel(params) {
|
||||
return request({
|
||||
url: '/workflow/model/latest',
|
||||
method: 'post',
|
||||
params: params
|
||||
})
|
||||
}
|
||||
|
||||
export function delModel(modelIds) {
|
||||
return request({
|
||||
url: '/workflow/model/' + modelIds,
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
|
||||
export function deployModel(params) {
|
||||
return request({
|
||||
url: '/workflow/model/deploy',
|
||||
method: 'post',
|
||||
params: params
|
||||
})
|
||||
}
|
||||
|
||||
// 获取流程模型流程图
|
||||
export function getBpmnXml(modelId) {
|
||||
return request({
|
||||
url: '/workflow/model/bpmnXml/' + modelId,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
@@ -1,106 +0,0 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
// 查询流程列表
|
||||
export function listProcess(query) {
|
||||
return request({
|
||||
url: '/workflow/process/list',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 查询流程列表
|
||||
export function getProcessForm(query) {
|
||||
return request({
|
||||
url: '/workflow/process/getProcessForm',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 部署流程实例
|
||||
export function startProcess(processDefId, data) {
|
||||
return request({
|
||||
url: '/workflow/process/start/' + processDefId,
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 删除流程实例
|
||||
export function delProcess(ids) {
|
||||
return request({
|
||||
url: '/workflow/process/instance/' + ids,
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
|
||||
// 获取流程图
|
||||
export function getBpmnXml(processDefId) {
|
||||
return request({
|
||||
url: '/workflow/process/bpmnXml/' + processDefId,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
export function detailProcess(query) {
|
||||
return request({
|
||||
url: '/workflow/process/detail',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 我的发起的流程
|
||||
export function listOwnProcess(query) {
|
||||
return request({
|
||||
url: '/workflow/process/ownList',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 我待办的流程
|
||||
export function listTodoProcess(query) {
|
||||
return request({
|
||||
url: '/workflow/process/todoList',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 我待签的流程
|
||||
export function listClaimProcess(query) {
|
||||
return request({
|
||||
url: '/workflow/process/claimList',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 我已办的流程
|
||||
export function listFinishedProcess(query) {
|
||||
return request({
|
||||
url: '/workflow/process/finishedList',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 查询流程抄送列表
|
||||
export function listCopyProcess(query) {
|
||||
return request({
|
||||
url: '/workflow/process/copyList',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 取消申请
|
||||
export function stopProcess(data) {
|
||||
return request({
|
||||
url: '/workflow/task/stopProcess',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
@@ -1,64 +0,0 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
// 完成任务
|
||||
export function complete(data) {
|
||||
return request({
|
||||
url: '/workflow/task/complete',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 委派任务
|
||||
export function delegate(data) {
|
||||
return request({
|
||||
url: '/workflow/task/delegate',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 转办任务
|
||||
export function transfer(data) {
|
||||
return request({
|
||||
url: '/workflow/task/transfer',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 退回任务
|
||||
export function returnTask(data) {
|
||||
return request({
|
||||
url: '/workflow/task/return',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 拒绝任务
|
||||
export function rejectTask(data) {
|
||||
return request({
|
||||
url: '/workflow/task/reject',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 签收任务
|
||||
export function claimTask(data) {
|
||||
return request({
|
||||
url: '/workflow/task/claim',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
// 可退回任务列表
|
||||
export function returnList(data) {
|
||||
return request({
|
||||
url: '/workflow/task/returnList',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
@@ -1,132 +0,0 @@
|
||||
<template>
|
||||
<div class="order-analysis-dashboard" v-loading="loading">
|
||||
<!-- 业绩区 -->
|
||||
<el-tabs v-model="activeTab">
|
||||
<el-tab-pane label="我的流程" name="my">
|
||||
<KLPTable v-loading="loading" :data="ownProcessList">
|
||||
<el-table-column label="流程编号" align="center" prop="procInsId" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="流程名称" align="center" prop="procDefName" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="流程类别" align="center" prop="category" />
|
||||
<el-table-column label="流程版本" align="center" width="80px">
|
||||
<template slot-scope="scope">
|
||||
<el-tag size="medium">v{{ scope.row.procDefVersion }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="当前节点" align="center" prop="taskName" />
|
||||
<el-table-column label="提交时间" align="center" prop="createTime" width="180" />
|
||||
<el-table-column label="流程状态" align="center" width="100">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.wf_process_status" :value="scope.row.processStatus" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="耗时" align="center" prop="duration" width="180" />
|
||||
</KLPTable>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="代办任务" name="todo">
|
||||
<KLPTable v-loading="loading" :data="todoList">
|
||||
<el-table-column label="任务编号" align="center" prop="taskId" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="流程名称" align="center" prop="procDefName" />
|
||||
<el-table-column label="任务节点" align="center" prop="taskName" />
|
||||
<el-table-column label="流程版本" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-tag size="medium">v{{ scope.row.procDefVersion }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="流程发起人" align="center">
|
||||
<template slot-scope="scope">
|
||||
<label>{{ scope.row.startUserName }}</label>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="接收时间" align="center" prop="createTime" width="180" />
|
||||
<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-outline" @click="handleProcess(scope.row)"
|
||||
v-hasPermi="['workflow:process:approval']">办理
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listOwnProcess } from '@/api/workflow/process';
|
||||
import { listTodoProcess } from '@/api/workflow/process';
|
||||
|
||||
export default {
|
||||
name: 'OrderAnalysisDashboard',
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
activeTab: 'my',
|
||||
ownProcessList: [],
|
||||
todoList: [],
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20
|
||||
},
|
||||
dateRange: []
|
||||
}
|
||||
},
|
||||
dicts: ['wf_process_status'],
|
||||
created() {
|
||||
this.loading = true;
|
||||
Promise.all([this.getList1(), this.getList2()]).then(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
/** 查询流程定义列表 */
|
||||
async getList1() {
|
||||
const response = await listOwnProcess(this.addDateRange(this.queryParams, this.dateRange));
|
||||
this.ownProcessList = response.rows;
|
||||
},
|
||||
async getList2() {
|
||||
const response = await listTodoProcess(this.addDateRange(this.queryParams, this.dateRange));
|
||||
this.todoList = response.rows;
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.order-analysis-dashboard {
|
||||
padding: 24px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.section-row {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
margin-bottom: 20px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.section-title h2 {
|
||||
margin: 0 0 8px 0;
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
}
|
||||
|
||||
.section-title p {
|
||||
margin: 0;
|
||||
font-size: 14px;
|
||||
color: #909399;
|
||||
}
|
||||
|
||||
.top-row,
|
||||
.chart-row {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.chart-row>.el-col {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: stretch;
|
||||
}
|
||||
</style>
|
||||
@@ -162,7 +162,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listForm } from "@/api/workflow/form";
|
||||
// import { listForm } from "@/api/workflow/form";
|
||||
|
||||
export default {
|
||||
name: "ElementForm",
|
||||
|
||||
@@ -175,26 +175,6 @@ export const dynamicRoutes = [
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/workflow/process',
|
||||
component: Layout,
|
||||
hidden: true,
|
||||
permissions: ['workflow:process:query'],
|
||||
children: [
|
||||
{
|
||||
path: 'start/:deployId([\\w|\\-]+)',
|
||||
component: () => import('@/views/workflow/work/start'),
|
||||
name: 'WorkStart',
|
||||
meta: { title: '发起流程', icon: '' }
|
||||
},
|
||||
{
|
||||
path: 'detail/:procInsId([\\w|\\-]+)',
|
||||
component: () => import('@/views/workflow/work/detail'),
|
||||
name: 'WorkDetail',
|
||||
meta: { title: '流程详情', activeMenu: '/work/own' }
|
||||
}
|
||||
]
|
||||
},
|
||||
]
|
||||
|
||||
// 防止连续点击多次路由报错
|
||||
|
||||
@@ -1,132 +0,0 @@
|
||||
<template>
|
||||
<div class="order-analysis-dashboard" v-loading="loading">
|
||||
<!-- 业绩区 -->
|
||||
<el-tabs v-model="activeTab">
|
||||
<el-tab-pane label="我的流程" name="my">
|
||||
<KLPTable v-loading="loading" :data="ownProcessList">
|
||||
<el-table-column label="流程编号" align="center" prop="procInsId" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="流程名称" align="center" prop="procDefName" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="流程类别" align="center" prop="category" />
|
||||
<el-table-column label="流程版本" align="center" width="80px">
|
||||
<template slot-scope="scope">
|
||||
<el-tag size="medium">v{{ scope.row.procDefVersion }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="当前节点" align="center" prop="taskName" />
|
||||
<el-table-column label="提交时间" align="center" prop="createTime" width="180" />
|
||||
<el-table-column label="流程状态" align="center" width="100">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.wf_process_status" :value="scope.row.processStatus" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="耗时" align="center" prop="duration" width="180" />
|
||||
</KLPTable>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="代办任务" name="todo">
|
||||
<KLPTable v-loading="loading" :data="todoList">
|
||||
<el-table-column label="任务编号" align="center" prop="taskId" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="流程名称" align="center" prop="procDefName" />
|
||||
<el-table-column label="任务节点" align="center" prop="taskName" />
|
||||
<el-table-column label="流程版本" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-tag size="medium">v{{ scope.row.procDefVersion }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="流程发起人" align="center">
|
||||
<template slot-scope="scope">
|
||||
<label>{{ scope.row.startUserName }}</label>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="接收时间" align="center" prop="createTime" width="180" />
|
||||
<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-outline" @click="handleProcess(scope.row)"
|
||||
v-hasPermi="['workflow:process:approval']">办理
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listOwnProcess } from '@/api/workflow/process';
|
||||
import { listTodoProcess } from '@/api/workflow/process';
|
||||
|
||||
export default {
|
||||
name: 'OrderAnalysisDashboard',
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
activeTab: 'my',
|
||||
ownProcessList: [],
|
||||
todoList: [],
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20
|
||||
},
|
||||
dateRange: []
|
||||
}
|
||||
},
|
||||
dicts: ['wf_process_status'],
|
||||
created() {
|
||||
this.loading = true;
|
||||
Promise.all([this.getList1(), this.getList2()]).then(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
/** 查询流程定义列表 */
|
||||
async getList1() {
|
||||
const response = await listOwnProcess(this.addDateRange(this.queryParams, this.dateRange));
|
||||
this.ownProcessList = response.rows;
|
||||
},
|
||||
async getList2() {
|
||||
const response = await listTodoProcess(this.addDateRange(this.queryParams, this.dateRange));
|
||||
this.todoList = response.rows;
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.order-analysis-dashboard {
|
||||
padding: 24px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.section-row {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
margin-bottom: 20px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.section-title h2 {
|
||||
margin: 0 0 8px 0;
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
}
|
||||
|
||||
.section-title p {
|
||||
margin: 0;
|
||||
font-size: 14px;
|
||||
color: #909399;
|
||||
}
|
||||
|
||||
.top-row,
|
||||
.chart-row {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.chart-row>.el-col {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: stretch;
|
||||
}
|
||||
</style>
|
||||
@@ -20,7 +20,6 @@
|
||||
<script>
|
||||
import StatisticGroup from '@/components/HomeModules/StatisticGroup.vue'
|
||||
import AllApplications from '@/components/HomeModules/AllApplications.vue'
|
||||
import FlowTable from '@/components/HomeModules/FlowTable.vue'
|
||||
import MiniCalendar from '@/components/HomeModules/MiniCalendar.vue'
|
||||
|
||||
const lineChartData = {
|
||||
@@ -48,7 +47,6 @@ export default {
|
||||
// PanelGroup,
|
||||
StatisticGroup,
|
||||
AllApplications,
|
||||
FlowTable,
|
||||
MiniCalendar,
|
||||
},
|
||||
data() {
|
||||
|
||||
@@ -155,7 +155,7 @@ import DraggableItem from './DraggableItem'
|
||||
import { getDrawingList, saveDrawingList, getIdGlobal, saveIdGlobal, getFormConf } from '@/utils/db'
|
||||
import loadBeautifier from '@/utils/loadBeautifier'
|
||||
import Tinymce from '@/components/tinymce/index.vue'
|
||||
import { getForm, addForm, updateForm } from '@/api/workflow/form'
|
||||
// import { getForm, addForm, updateForm } from '@/api/workflow/form'
|
||||
import axios from 'axios'
|
||||
import Vue from 'vue';
|
||||
|
||||
|
||||
@@ -1,290 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="分类名称" prop="categoryName">
|
||||
<el-input
|
||||
v-model="queryParams.categoryName"
|
||||
placeholder="请输入分类名称"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="分类编码" prop="code">
|
||||
<el-input
|
||||
v-model="queryParams.code"
|
||||
placeholder="请输入分类编码"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</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="['workflow:category:add']"
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
v-hasPermi="['workflow:category:edit']"
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
v-hasPermi="['workflow:category:remove']"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
v-hasPermi="['workflow:category:export']"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="categoryList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="分类编号" align="center" prop="categoryId" v-if="true"/>
|
||||
<el-table-column label="分类名称" align="center" prop="categoryName" />
|
||||
<el-table-column label="分类编码" align="center" prop="code" />
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<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="handleUpdate(scope.row)"
|
||||
v-hasPermi="['workflow:category:edit']"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
v-hasPermi="['workflow:category:remove']"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
: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="categoryName">
|
||||
<el-input v-model="form.categoryName" placeholder="请输入分类名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="分类编码" prop="code">
|
||||
<el-input v-model="form.code" placeholder="请输入分类编码" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listCategory, getCategory, delCategory, addCategory, updateCategory } from "@/api/workflow/category";
|
||||
|
||||
export default {
|
||||
name: "Category",
|
||||
data() {
|
||||
return {
|
||||
// 按钮loading
|
||||
buttonLoading: false,
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 【请填写功能名称】表格数据
|
||||
categoryList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
categoryName: undefined,
|
||||
code: undefined,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
categoryName: [
|
||||
{ required: true, message: "分类名称不能为空", trigger: "blur" }
|
||||
],
|
||||
code: [
|
||||
{ required: true, message: "分类编码不能为空", trigger: "blur" }
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询【请填写功能名称】列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listCategory(this.queryParams).then(response => {
|
||||
this.categoryList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
categoryId: undefined,
|
||||
categoryName: undefined,
|
||||
code: undefined,
|
||||
createBy: undefined,
|
||||
createTime: undefined,
|
||||
updateBy: undefined,
|
||||
updateTime: undefined,
|
||||
remark: undefined,
|
||||
delFlag: undefined
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.categoryId)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加流程分类";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.loading = true;
|
||||
this.reset();
|
||||
const categoryId = row.categoryId || this.ids
|
||||
getCategory(categoryId).then(response => {
|
||||
this.loading = false;
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改流程分类";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
this.buttonLoading = true;
|
||||
if (this.form.categoryId != null) {
|
||||
updateCategory(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
} else {
|
||||
addCategory(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const categoryIds = row.categoryId || this.ids;
|
||||
this.$modal.confirm('是否确认删除【请填写功能名称】编号为"' + categoryIds + '"的数据项？').then(() => {
|
||||
this.loading = true;
|
||||
return delCategory(categoryIds);
|
||||
}).then(() => {
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('workflow/category/export', {
|
||||
...this.queryParams
|
||||
}, `category_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,335 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="流程标识" prop="processKey">
|
||||
<el-input
|
||||
v-model="queryParams.processKey"
|
||||
placeholder="请输入流程标识"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="流程名称" prop="processName">
|
||||
<el-input
|
||||
v-model="queryParams.processName"
|
||||
placeholder="请输入流程名称"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="流程分类" prop="category">
|
||||
<el-select v-model="queryParams.category" clearable placeholder="请选择" size="small">
|
||||
<el-option
|
||||
v-for="item in categoryOptions"
|
||||
:key="item.categoryId"
|
||||
:label="item.categoryName"
|
||||
:value="item.code">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="state">
|
||||
<el-select v-model="queryParams.state" size="small" clearable placeholder="请选择状态">
|
||||
<el-option :key="1" label="激活" value="active" />
|
||||
<el-option :key="2" label="挂起" value="suspended" />
|
||||
</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-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
v-hasPermi="['workflow:deploy:remove']"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<KLPTable v-loading="loading" fit :data="deployList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="流程标识" align="center" prop="processKey" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="流程名称" align="center" :show-overflow-tooltip="true">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" @click="handleProcessView(scope.row)">
|
||||
<span>{{ scope.row.processName }}</span>
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="流程分类" align="center" prop="categoryName" :formatter="categoryFormat" />
|
||||
<el-table-column label="流程版本" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-tag size="medium" >v{{ scope.row.version }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-tag type="success" v-if="!scope.row.suspended">激活</el-tag>
|
||||
<el-tag type="warning" v-if="scope.row.suspended">挂起</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="部署时间" align="center" prop="deploymentTime" width="180"/>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
icon="el-icon-price-tag"
|
||||
@click.native="handlePublish(scope.row)"
|
||||
v-hasPermi="['workflow:deploy:list']"
|
||||
>版本管理</el-button>
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
v-hasPermi="['workflow:deploy:remove']"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</el-row>
|
||||
|
||||
<!-- 流程图 -->
|
||||
<el-dialog :title="processView.title" :visible.sync="processView.open" width="70%" append-to-body>
|
||||
<process-viewer :key="`designer-${processView.index}`" :xml="processView.xmlData" :style="{height: '400px'}" />
|
||||
</el-dialog>
|
||||
|
||||
<!-- 版本管理 -->
|
||||
<el-dialog title="版本管理" :visible.sync="publish.open" width="50%" append-to-body>
|
||||
<KLPTable v-loading="publish.loading" :data="publish.dataList">
|
||||
<el-table-column label="流程标识" align="center" prop="processKey" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="流程名称" align="center" :show-overflow-tooltip="true">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" @click="handleProcessView(scope.row)">
|
||||
<span>{{ scope.row.processName }}</span>
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="流程版本" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-tag size="medium" >v{{ scope.row.version }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-tag type="success" v-if="!scope.row.suspended">激活</el-tag>
|
||||
<el-tag type="warning" v-if="scope.row.suspended">挂起</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
icon="el-icon-video-pause"
|
||||
v-if="!scope.row.suspended"
|
||||
@click.native="handleChangeState(scope.row, 'suspended')"
|
||||
v-hasPermi="['workflow:deploy:status']"
|
||||
>挂起</el-button>
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
icon="el-icon-video-play"
|
||||
v-if="scope.row.suspended"
|
||||
@click.native="handleChangeState(scope.row, 'active')"
|
||||
v-hasPermi="['workflow:deploy:status']"
|
||||
>激活</el-button>
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
v-hasPermi="['workflow:deploy:remove']"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
<pagination
|
||||
v-show="publishTotal > 0"
|
||||
:total="publishTotal"
|
||||
:page.sync="publishQueryParams.pageNum"
|
||||
:limit.sync="publishQueryParams.pageSize"
|
||||
@pagination="getPublishList"
|
||||
/>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listAllCategory } from '@/api/workflow/category'
|
||||
import { listDeploy, listPublish, getBpmnXml, changeState, delDeploy } from '@/api/workflow/deploy'
|
||||
import ProcessViewer from '@/components/ProcessViewer'
|
||||
|
||||
export default {
|
||||
name: 'Deploy',
|
||||
components: {
|
||||
ProcessViewer
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
processKey: null,
|
||||
processName: null,
|
||||
category: null,
|
||||
state: null
|
||||
},
|
||||
deployList: [],
|
||||
categoryOptions: [],
|
||||
processView: {
|
||||
title: '',
|
||||
open: false,
|
||||
index: undefined,
|
||||
xmlData:"",
|
||||
},
|
||||
publish: {
|
||||
open: false,
|
||||
loading: false,
|
||||
dataList: []
|
||||
},
|
||||
publishTotal: 0,
|
||||
publishQueryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
processKey: ""
|
||||
},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getCategoryList();
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询流程分类列表 */
|
||||
getCategoryList() {
|
||||
listAllCategory().then(response => this.categoryOptions = response.data);
|
||||
},
|
||||
/** 查询流程部署列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listDeploy(this.queryParams).then(response => {
|
||||
this.deployList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
id: null,
|
||||
processKey: null,
|
||||
processName: null,
|
||||
category: null,
|
||||
state: null
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.deploymentId)
|
||||
this.single = selection.length !== 1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 查看流程图 */
|
||||
handleProcessView(row) {
|
||||
let definitionId = row.definitionId;
|
||||
this.processView.title = "流程图";
|
||||
this.processView.index = definitionId;
|
||||
// 发送请求，获取xml
|
||||
getBpmnXml(definitionId).then(response => {
|
||||
this.processView.xmlData = response.data;
|
||||
})
|
||||
this.processView.open = true;
|
||||
},
|
||||
getPublishList() {
|
||||
this.publish.loading = true;
|
||||
listPublish(this.publishQueryParams).then(response => {
|
||||
this.publish.dataList = response.rows;
|
||||
this.publishTotal = response.total;
|
||||
this.publish.loading = false;
|
||||
})
|
||||
},
|
||||
handlePublish(row) {
|
||||
this.publishQueryParams.processKey = row.processKey;
|
||||
this.publish.open = true;
|
||||
this.getPublishList();
|
||||
},
|
||||
/** 挂起/激活流程 */
|
||||
handleChangeState(row, state) {
|
||||
const params = {
|
||||
definitionId: row.definitionId,
|
||||
state: state
|
||||
}
|
||||
changeState(params).then(res => {
|
||||
this.$modal.msgSuccess(res.msg)
|
||||
this.getPublishList();
|
||||
});
|
||||
},
|
||||
handleDelete(row) {
|
||||
const deploymentIds = row.deploymentId || this.ids;
|
||||
this.$modal.confirm('是否确认删除选中的数据项？').then(() => {
|
||||
this.loading = true;
|
||||
return delDeploy(deploymentIds);
|
||||
}).then(() => {
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
categoryFormat(row, column) {
|
||||
return this.categoryOptions.find(k => k.code === row.category)?.categoryName ?? '';
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -1,311 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="表单名称" prop="formName">
|
||||
<el-input
|
||||
v-model="queryParams.formName"
|
||||
placeholder="请输入表单名称"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</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="['workflow:form:add']"
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
v-hasPermi="['workflow:form:edit']"
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
v-hasPermi="['workflow:form:remove']"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
v-hasPermi="['workflow:form:export']"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="formList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="表单主键" align="center" prop="formId" />
|
||||
<el-table-column label="表单名称" align="center" prop="formName" />
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<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-view"
|
||||
@click="handleDetail(scope.row)"
|
||||
>详情</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['workflow:form:edit']"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
v-hasPermi="['workflow:form:remove']"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
: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="formName">
|
||||
<el-input v-model="form.formName" placeholder="请输入表单名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="表单内容">
|
||||
<editor v-model="form.content" :min-height="192"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" 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="formTitle" :visible.sync="formConfOpen" width="60%" append-to-body>
|
||||
<div class="test-form">
|
||||
<parser :key="new Date().getTime()" :form-conf="formConf" />
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listForm, getForm, delForm, addForm, updateForm } from "@/api/workflow/form";
|
||||
import Editor from '@/components/Editor';
|
||||
import Parser from '@/utils/generator/parser'
|
||||
export default {
|
||||
name: "Form",
|
||||
components: {
|
||||
Editor,
|
||||
Parser
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 流程表单表格数据
|
||||
formList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
formConf: {}, // 默认表单数据
|
||||
formConfOpen: false,
|
||||
formTitle: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
formName: null,
|
||||
content: null,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
activated() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询流程表单列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listForm(this.queryParams).then(response => {
|
||||
this.formList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
formId: null,
|
||||
formName: null,
|
||||
content: null,
|
||||
createTime: null,
|
||||
updateTime: null,
|
||||
createBy: null,
|
||||
updateBy: null,
|
||||
remark: null
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.formId)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 表单配置信息 */
|
||||
handleDetail(row){
|
||||
this.formConfOpen = true;
|
||||
this.formTitle = "流程表单配置详细";
|
||||
this.formConf = JSON.parse(row.content)
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
// this.reset();
|
||||
// this.open = true;
|
||||
// this.title = "添加流程表单";
|
||||
this.$router.push({ path: '/tool/build/index', query: {formId: null }})
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
// this.reset();
|
||||
// const formId = row.formId || this.ids
|
||||
// getForm(formId).then(response => {
|
||||
// this.form = response.data;
|
||||
// this.open = true;
|
||||
// this.title = "修改流程表单";
|
||||
// });
|
||||
this.$router.push({ path: '/tool/build/index', query: {formId: row.formId }})
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
if (this.form.formId != null) {
|
||||
updateForm(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
} else {
|
||||
addForm(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const formIds = row.formId || this.ids;
|
||||
this.$confirm('是否确认删除流程表单编号为"' + formIds + '"的数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return delForm(formIds);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
let _this = this
|
||||
this.$confirm('是否确认导出所有流程表单数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
_this.download('/workflow/form/export', {
|
||||
..._this.queryParams
|
||||
}, `form_${new Date().getTime()}.xlsx`)
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.test-form {
|
||||
margin: 15px auto;
|
||||
width: 800px;
|
||||
padding: 15px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,635 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="模型标识" prop="modelKey">
|
||||
<el-input
|
||||
v-model="queryParams.modelKey"
|
||||
placeholder="请输入模型标识"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="模型名称" prop="modelName">
|
||||
<el-input
|
||||
v-model="queryParams.modelName"
|
||||
placeholder="请输入模型名称"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="流程分类" prop="category">
|
||||
<el-select v-model="queryParams.category" clearable placeholder="请选择" size="small">
|
||||
<el-option
|
||||
v-for="item in categoryOptions"
|
||||
:key="item.categoryId"
|
||||
:label="item.categoryName"
|
||||
:value="item.code">
|
||||
</el-option>
|
||||
</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-row :gutter="10" class="mb8">
|
||||
<!-- <el-col :span="1.5">-->
|
||||
<!-- <el-button-->
|
||||
<!-- type="primary"-->
|
||||
<!-- plain-->
|
||||
<!-- icon="el-icon-upload"-->
|
||||
<!-- size="mini"-->
|
||||
<!-- @click="handleImport"-->
|
||||
<!-- v-hasPermi="['workflow:model:import']"-->
|
||||
<!-- >导入</el-button>-->
|
||||
<!-- </el-col>-->
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
v-hasPermi="['workflow:model:add']"
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
v-hasPermi="['workflow:model:remove']"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
v-hasPermi="['workflow:model:export']"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" fit :data="modelList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="模型标识" align="center" prop="modelKey" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="模型名称" align="center" :show-overflow-tooltip="true">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" @click="handleProcessView(scope.row)">
|
||||
<span>{{ scope.row.modelName }}</span>
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="流程分类" align="center" prop="categoryName" :formatter="categoryFormat" />
|
||||
<el-table-column label="模型版本" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-tag size="medium" >v{{ scope.row.version }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="描述" align="center" prop="description" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180"/>
|
||||
<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="handleUpdate(scope.row)"
|
||||
v-hasPermi="['workflow:model:edit']"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
icon="el-icon-brush"
|
||||
@click="handleDesigner(scope.row)"
|
||||
v-hasPermi="['workflow:model:designer']"
|
||||
>设计</el-button>
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
icon="el-icon-video-play"
|
||||
v-hasPermi="['workflow:model:deploy']"
|
||||
@click.native="handleDeploy(scope.row)"
|
||||
>部署</el-button>
|
||||
<el-dropdown size="mini" v-hasPermi="['workflow:model:query', 'workflow:model:list', 'workflow:model:remove']">
|
||||
<el-button size="mini" type="text" icon="el-icon-d-arrow-right">更多</el-button>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item
|
||||
icon="el-icon-view"
|
||||
@click.native="handleProcessView(scope.row)"
|
||||
v-hasPermi="['workflow:model:query']"
|
||||
>流程图</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
icon="el-icon-price-tag"
|
||||
@click.native="handleHistory(scope.row)"
|
||||
v-hasPermi="['workflow:model:list']"
|
||||
>历史</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
icon="el-icon-delete"
|
||||
@click.native="handleDelete(scope.row)"
|
||||
v-hasPermi="['workflow:model:remove']"
|
||||
>删除</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 添加或修改模型信息对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="30%" append-to-body @close="cancel()">
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="模型标识" prop="modelKey">
|
||||
<el-input v-model="form.modelKey" clearable disabled />
|
||||
</el-form-item>
|
||||
<el-form-item label="模型名称" prop="modelName">
|
||||
<el-input v-model="form.modelName" clearable :disabled="form.modelId !== undefined" />
|
||||
</el-form-item>
|
||||
<el-form-item label="流程分类" prop="category">
|
||||
<el-select v-model="form.category" placeholder="请选择" clearable style="width:100%">
|
||||
<el-option v-for="item in categoryOptions" :key="item.categoryId" :label="item.categoryName" :value="item.code" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="描述" prop="description">
|
||||
<el-input v-model="form.description" type="textarea" placeholder="请输入内容" maxlength="200" show-word-limit/>
|
||||
</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>
|
||||
|
||||
|
||||
<!-- <!– bpmn20.xml导入对话框 –>-->
|
||||
<!-- <el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body @close="cancel('uploadForm')">-->
|
||||
<!-- <el-upload-->
|
||||
<!-- ref="upload"-->
|
||||
<!-- :limit="1"-->
|
||||
<!-- accept=".xml"-->
|
||||
<!-- :headers="upload.headers"-->
|
||||
<!-- :action="upload.url + '?name=' + upload.name+'&category='+ upload.category"-->
|
||||
<!-- :disabled="upload.isUploading"-->
|
||||
<!-- :on-progress="handleFileUploadProgress"-->
|
||||
<!-- :on-success="handleFileSuccess"-->
|
||||
<!-- :auto-upload="false"-->
|
||||
<!-- drag-->
|
||||
<!-- >-->
|
||||
<!-- <i class="el-icon-upload"></i>-->
|
||||
<!-- <div class="el-upload__text">-->
|
||||
<!-- 将文件拖到此处，或-->
|
||||
<!-- <em>点击上传</em>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="el-upload__tip" slot="tip">-->
|
||||
<!-- <el-form ref="uploadForm" :model="upload" size="mini" :rules="rules" label-width="80px">-->
|
||||
<!-- <el-form-item label="流程名称" prop="name">-->
|
||||
<!-- <el-input v-model="upload.name" clearable/>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- <el-form-item label="流程分类" prop="category">-->
|
||||
<!-- <el-select v-model="upload.category" placeholder="请选择" clearable style="width:100%">-->
|
||||
<!-- <el-option v-for="item in categoryOptions" :key="item.categoryId" :label="item.categoryName"-->
|
||||
<!-- :value="item.code"/>-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-form>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="el-upload__tip" style="color:red" slot="tip">提示：仅允许导入“bpmn20.xml”格式文件！</div>-->
|
||||
<!-- </el-upload>-->
|
||||
<!-- <div slot="footer" class="dialog-footer">-->
|
||||
<!-- <el-button type="primary" @click="submitFileForm">确 定</el-button>-->
|
||||
<!-- <el-button @click="cancel('uploadForm')">取 消</el-button>-->
|
||||
<!-- </div>-->
|
||||
<!-- </el-dialog>-->
|
||||
|
||||
<!-- 流程图 -->
|
||||
<el-dialog :title="processView.title" :visible.sync="processView.open" width="70%" append-to-body>
|
||||
<process-viewer :key="`designer-${processView.index}`" :xml="processView.xmlData" :style="{height: '400px'}" />
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog title="模型历史" :visible.sync="history.open" width="70%" >
|
||||
<KLPTable v-loading="history.loading" fit :data="historyList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="模型标识" align="center" prop="modelKey" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="模型名称" align="center" :show-overflow-tooltip="true">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" @click="handleProcessView(scope.row)">
|
||||
<span>{{ scope.row.modelName }}</span>
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="流程分类" align="center" prop="categoryName" :formatter="categoryFormat" />
|
||||
<el-table-column label="模型版本" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-tag size="medium" >v{{ scope.row.version }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="描述" align="center" prop="description" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180"/>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
icon="el-icon-video-play"
|
||||
v-hasPermi="['workflow:model:deploy']"
|
||||
@click.native="handleDeploy(scope.row)"
|
||||
>部署</el-button>
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
icon="el-icon-star-off"
|
||||
v-hasPermi="['workflow:model:save']"
|
||||
@click.native="handleLatest(scope.row)"
|
||||
>设为最新</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="historyTotal > 0"
|
||||
:total="historyTotal"
|
||||
:page.sync="queryHistoryParams.pageNum"
|
||||
:limit.sync="queryHistoryParams.pageSize"
|
||||
@pagination="getHistoryList"
|
||||
/>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog :title="designerData.title" :visible.sync="designerOpen" append-to-body fullscreen>
|
||||
<process-designer
|
||||
:key="designerOpen"
|
||||
style="border:1px solid rgba(0, 0, 0, 0.1);"
|
||||
ref="modelDesigner"
|
||||
v-loading="designerData.loading"
|
||||
:bpmnXml="designerData.bpmnXml"
|
||||
:designerForm="designerData.form"
|
||||
@save="onSaveDesigner"
|
||||
/>
|
||||
</el-dialog>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getBpmnXml, listModel, historyModel, latestModel, addModel, updateModel, saveModel, delModel, deployModel } from "@/api/workflow/model";
|
||||
import { listCategory } from '@/api/workflow/category'
|
||||
import ProcessDesigner from '@/components/ProcessDesigner';
|
||||
import ProcessViewer from '@/components/ProcessViewer'
|
||||
import { getToken } from "@/utils/auth";
|
||||
|
||||
export default {
|
||||
name: "Model",
|
||||
components: {
|
||||
ProcessDesigner,
|
||||
ProcessViewer,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 流程模型表格数据
|
||||
modelList: [],
|
||||
categoryOptions: [],
|
||||
title: '',
|
||||
open: false,
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
modelKey: [
|
||||
{ required: true, message: "模型标识不能为空", trigger: "blur" }
|
||||
],
|
||||
modelName: [
|
||||
{ required: true, message: "模型名称不能为空", trigger: "blur" }
|
||||
],
|
||||
category: [
|
||||
{ required: true, message: "请选择类型", trigger: "change" }
|
||||
],
|
||||
},
|
||||
designerOpen: false,
|
||||
designerData: {
|
||||
loading: false,
|
||||
bpmnXml: '',
|
||||
modelId: null,
|
||||
form: {
|
||||
processName: null,
|
||||
processKey: null
|
||||
}
|
||||
},
|
||||
designerModelId: null,
|
||||
processView: {
|
||||
title: '',
|
||||
open: false,
|
||||
index: undefined,
|
||||
xmlData:"",
|
||||
},
|
||||
// bpmn.xml 导入
|
||||
upload: {
|
||||
// 是否显示弹出层（xml导入）
|
||||
open: false,
|
||||
// 弹出层标题（xml导入）
|
||||
title: "",
|
||||
// 是否禁用上传
|
||||
isUploading: false,
|
||||
name: null,
|
||||
category: null,
|
||||
// 设置上传的请求头部
|
||||
headers: { Authorization: "Bearer " + getToken() },
|
||||
// 上传的地址
|
||||
url: process.env.VUE_APP_BASE_API + "/workflow/definition/import"
|
||||
},
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
modelKey: null,
|
||||
modelName: null,
|
||||
category: null
|
||||
},
|
||||
currentRow: null,
|
||||
history: {
|
||||
open: false,
|
||||
loading: false
|
||||
},
|
||||
historyList: [],
|
||||
historyTotal: 0,
|
||||
queryHistoryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
modelKey: null
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getCategoryList();
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询流程分类列表 */
|
||||
getCategoryList() {
|
||||
listCategory().then(response => this.categoryOptions = response.rows)
|
||||
},
|
||||
/** 查询流程模型列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listModel(this.queryParams).then(response => {
|
||||
this.modelList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
cancel() {
|
||||
this.reset();
|
||||
// 关闭dialog
|
||||
this.open = false
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
modelId: undefined,
|
||||
modelKey: undefined,
|
||||
modelName: undefined,
|
||||
category: undefined,
|
||||
description: undefined
|
||||
};
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.$refs.queryForm.resetFields()
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.modelId)
|
||||
this.single = selection.length !== 1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 部署流程 */
|
||||
handleDeploy(row) {
|
||||
this.loading = true;
|
||||
deployModel({
|
||||
modelId: row.modelId
|
||||
}).then(response => {
|
||||
this.$modal.msgSuccess(response.msg);
|
||||
let obj = { name: 'Deploy', path: '/workflow/deploy' }
|
||||
return this.$store.dispatch('tagsView/delCachedView', obj).then(() => {
|
||||
this.$router.push(obj);
|
||||
});
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
})
|
||||
},
|
||||
/** 查看流程图 */
|
||||
handleProcessView(row) {
|
||||
let modelId = row.modelId;
|
||||
this.processView.title = "流程图";
|
||||
this.processView.index = modelId;
|
||||
// 发送请求，获取xml
|
||||
getBpmnXml(modelId).then(response => {
|
||||
this.processView.xmlData = response.data;
|
||||
})
|
||||
this.processView.open = true;
|
||||
},
|
||||
getHistoryList() {
|
||||
this.history.loading = true;
|
||||
historyModel(this.queryHistoryParams).then(response => {
|
||||
this.historyTotal = response.total;
|
||||
this.historyList = response.rows;
|
||||
this.history.loading = false;
|
||||
})
|
||||
},
|
||||
handleHistory(row) {
|
||||
this.history.open = true;
|
||||
this.queryHistoryParams.modelKey = row.modelKey;
|
||||
this.getHistoryList();
|
||||
},
|
||||
/** 设为最新版 */
|
||||
handleLatest(row) {
|
||||
this.$modal.confirm('是否确认将此版本设为最新？').then(() => {
|
||||
this.history.loading = true;
|
||||
latestModel({
|
||||
modelId: row.modelId
|
||||
}).then(response => {
|
||||
this.history.open = false;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess(response.msg);
|
||||
}).finally(() => {
|
||||
this.history.loading = false;
|
||||
})
|
||||
})
|
||||
},
|
||||
handleCurrentChange(data) {
|
||||
if (data) {
|
||||
this.currentRow = JSON.parse(data.content);
|
||||
}
|
||||
},
|
||||
handleAdd() {
|
||||
this.title = "新增流程模型";
|
||||
const dateTime = new Date().getTime();
|
||||
this.form = {
|
||||
modelKey: `Process_${dateTime}`,
|
||||
modelName: `业务流程_${dateTime}`
|
||||
}
|
||||
this.open = true;
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.title = "修改流程模型";
|
||||
this.form = {
|
||||
modelId: row.modelId,
|
||||
modelKey: row.modelKey,
|
||||
modelName: row.modelName,
|
||||
category: row.category,
|
||||
description: row.description
|
||||
};
|
||||
this.open = true;
|
||||
},
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
if (this.form.modelId !== undefined) {
|
||||
updateModel(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
} else {
|
||||
addModel(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 设计按钮操作 */
|
||||
handleDesigner(row) {
|
||||
this.designerData.title = "流程设计 - " + row.modelName;
|
||||
this.designerData.modelId = row.modelId;
|
||||
this.designerData.form = {
|
||||
processName: row.modelName,
|
||||
processKey: row.modelKey
|
||||
}
|
||||
if (row.modelId) {
|
||||
this.designerData.loading = true;
|
||||
getBpmnXml(row.modelId).then(response => {
|
||||
this.designerData.bpmnXml = response.data || '';
|
||||
this.designerData.loading = false;
|
||||
this.designerOpen = true;
|
||||
})
|
||||
}
|
||||
},
|
||||
onSaveDesigner(bpmnXml) {
|
||||
this.bpmnXml = bpmnXml;
|
||||
let dataBody = {
|
||||
modelId: this.designerData.modelId,
|
||||
bpmnXml: this.bpmnXml
|
||||
}
|
||||
this.$confirm("是否将此模型保存为新版本？", "提示", {
|
||||
distinguishCancelAndClose: true,
|
||||
confirmButtonText: '是',
|
||||
cancelButtonText: '否'
|
||||
}).then(() => {
|
||||
this.confirmSave(dataBody, true)
|
||||
}).catch(action => {
|
||||
if (action === 'cancel') {
|
||||
this.confirmSave(dataBody, false)
|
||||
}
|
||||
})
|
||||
},
|
||||
confirmSave(body, newVersion) {
|
||||
this.designerData.loading = true;
|
||||
saveModel(Object.assign(body, {
|
||||
newVersion: newVersion
|
||||
})).then(() => {
|
||||
this.designerOpen = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.designerData.loading = false;
|
||||
})
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const modelIds = row.modelId || this.ids;
|
||||
this.$modal.confirm('是否确认删除模型编号为"' + modelIds + '"的数据项？').then(() => {
|
||||
this.loading = true;
|
||||
return delModel(modelIds);
|
||||
}).then(() => {
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('workflow/model/export', {
|
||||
...this.queryParams
|
||||
}, `wf_model_${new Date().getTime()}.xlsx`)
|
||||
},
|
||||
/** 导入bpmn.xml文件 */
|
||||
handleImport() {
|
||||
this.upload.title = "bpmn20.xml文件导入";
|
||||
this.upload.open = true;
|
||||
},
|
||||
// 文件上传中处理
|
||||
handleFileUploadProgress(event, file, fileList) {
|
||||
this.upload.isUploading = true;
|
||||
},
|
||||
// 文件上传成功处理
|
||||
handleFileSuccess(response, file, fileList) {
|
||||
this.upload.open = false;
|
||||
this.upload.isUploading = false;
|
||||
this.$refs.upload.clearFiles();
|
||||
this.$message.success(response.msg);
|
||||
this.getList();
|
||||
},
|
||||
// 提交上传文件
|
||||
submitFileForm() {
|
||||
this.$refs.uploadForm.validate(valid => {
|
||||
if (valid) {
|
||||
this.$refs.upload.submit();
|
||||
}
|
||||
});
|
||||
},
|
||||
categoryFormat(row, column) {
|
||||
return this.categoryOptions.find(k => k.code === row.category)?.categoryName ?? '';
|
||||
},
|
||||
submitSave() {
|
||||
this.getList();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,175 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="流程名称" prop="processName">
|
||||
<el-input
|
||||
v-model="queryParams.processName"
|
||||
placeholder="请输入流程名称"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="接收时间">
|
||||
<el-date-picker
|
||||
v-model="dateRange"
|
||||
style="width: 240px"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
type="daterange"
|
||||
range-separator="-"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
:default-time="['00:00:00', '23:59:59']"
|
||||
></el-date-picker>
|
||||
</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="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
v-hasPermi="['workflow:process:claimExport']"
|
||||
@click="handleExport"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="claimList">
|
||||
<el-table-column type="selection" width="55" align="center"/>
|
||||
<el-table-column label="任务编号" align="center" prop="taskId" :show-overflow-tooltip="true"/>
|
||||
<el-table-column label="流程名称" align="center" prop="procDefName"/>
|
||||
<el-table-column label="任务节点" align="center" prop="taskName"/>
|
||||
<el-table-column label="流程版本" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-tag size="medium" >v{{scope.row.procDefVersion}}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="流程发起人" align="center">
|
||||
<template slot-scope="scope">
|
||||
<label>{{scope.row.startUserName}}</label>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="接收时间" align="center" prop="createTime" width="180"/>
|
||||
<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-s-claim"
|
||||
@click="handleClaim(scope.row)"
|
||||
v-hasPermi="['workflow:process:claim']"
|
||||
>签收
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listClaimProcess } from '@/api/workflow/process';
|
||||
import { claimTask } from '@/api/workflow/task';
|
||||
|
||||
export default {
|
||||
name: 'Claim',
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 流程待办任务表格数据
|
||||
claimList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 日期范围
|
||||
dateRange: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
name: null,
|
||||
processName: null
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {}
|
||||
};
|
||||
},
|
||||
beforeRouteEnter(to, from, next) {
|
||||
next(vm => {
|
||||
vm.getList()
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
/** 查询流程定义列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listClaimProcess(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
|
||||
this.claimList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRange = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 签收 */
|
||||
handleClaim(row) {
|
||||
claimTask({taskId: row.taskId}).then(response => {
|
||||
this.$modal.msgSuccess(response.msg);
|
||||
this.$router.push({
|
||||
path: '/work/todo'
|
||||
})
|
||||
})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('workflow/process/claimExport', {
|
||||
...this.queryParams
|
||||
}, `wf_claim_process_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -1,207 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="流程名称" prop="processName">
|
||||
<el-input
|
||||
v-model="queryParams.processName"
|
||||
placeholder="请输入流程名称"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="发起人" prop="originatorName">
|
||||
<el-input
|
||||
v-model="queryParams.originatorName"
|
||||
placeholder="请输入发起人"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</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="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
v-hasPermi="['workflow:process:copyExport']"
|
||||
@click="handleExport"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="copyList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="抄送编号" align="center" prop="copyId" />
|
||||
<el-table-column label="标题" align="center" prop="title" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="流程名称" align="center" prop="processName" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="发起人" align="center" prop="originatorName" />
|
||||
<el-table-column label="创建时间" align="center" prop="createTime">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</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-tickets"
|
||||
@click="handleFlowRecord(scope.row)"
|
||||
v-hasPermi="['workflow:process:query']"
|
||||
>详情</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listCopyProcess } from "@/api/workflow/process"
|
||||
|
||||
export default {
|
||||
name: "Copy",
|
||||
data() {
|
||||
return {
|
||||
// 按钮loading
|
||||
buttonLoading: false,
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 流程抄送表格数据
|
||||
copyList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
processId: undefined,
|
||||
processName: undefined,
|
||||
categoryId: undefined,
|
||||
taskId: undefined,
|
||||
userId: undefined,
|
||||
originatorName: undefined,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
copyId: [
|
||||
{ required: true, message: "抄送主键不能为空", trigger: "blur" }
|
||||
],
|
||||
processId: [
|
||||
{ required: true, message: "流程主键不能为空", trigger: "blur" }
|
||||
],
|
||||
processName: [
|
||||
{ required: true, message: "流程名称不能为空", trigger: "blur" }
|
||||
],
|
||||
categoryId: [
|
||||
{ required: true, message: "流程分类主键不能为空", trigger: "blur" }
|
||||
],
|
||||
taskId: [
|
||||
{ required: true, message: "任务主键不能为空", trigger: "blur" }
|
||||
],
|
||||
userId: [
|
||||
{ required: true, message: "用户主键不能为空", trigger: "blur" }
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询流程抄送列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listCopyProcess(this.queryParams).then(response => {
|
||||
this.copyList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
copyId: undefined,
|
||||
processId: undefined,
|
||||
processName: undefined,
|
||||
categoryId: undefined,
|
||||
taskId: undefined,
|
||||
userId: undefined,
|
||||
originatorName: undefined,
|
||||
createBy: undefined,
|
||||
createTime: undefined,
|
||||
updateBy: undefined,
|
||||
updateTime: undefined,
|
||||
delFlag: undefined
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.copyId)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 查看详情 */
|
||||
handleFlowRecord(row){
|
||||
console.log(row);
|
||||
this.$router.push({
|
||||
path: '/workflow/process/detail/' + row.instanceId,
|
||||
query: {
|
||||
processed: false
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('workflow/process/copyExport', {
|
||||
...this.queryParams
|
||||
}, `wf_copy_process_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,670 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-tabs tab-position="top" :value="processed === true ? 'approval' : 'form'">
|
||||
|
||||
<el-tab-pane label="任务办理" name="approval" v-if="processed === true">
|
||||
<el-card class="box-card" shadow="hover" v-if="taskFormOpen">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>填写表单</span>
|
||||
</div>
|
||||
<el-col :span="20" :offset="2">
|
||||
<parser :form-conf="taskFormData" ref="taskFormParser"/>
|
||||
</el-col>
|
||||
</el-card>
|
||||
<el-card class="box-card" shadow="hover">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>审批流程</span>
|
||||
</div>
|
||||
<el-row>
|
||||
<el-col :span="20" :offset="2">
|
||||
<el-form ref="taskForm" :model="taskForm" :rules="rules" label-width="120px">
|
||||
<el-form-item label="审批意见" prop="comment">
|
||||
<el-input type="textarea" :rows="5" v-model="taskForm.comment" placeholder="请输入 审批意见" />
|
||||
</el-form-item>
|
||||
<el-form-item label="抄送人" prop="copyUserIds">
|
||||
<el-tag
|
||||
:key="index"
|
||||
v-for="(item, index) in copyUser"
|
||||
closable
|
||||
:disable-transitions="false"
|
||||
@close="handleClose('copy', item)">
|
||||
{{ item.nickName }}
|
||||
</el-tag>
|
||||
<el-button class="button-new-tag" type="primary" icon="el-icon-plus" size="mini" circle @click="onSelectCopyUsers" />
|
||||
</el-form-item>
|
||||
<el-form-item label="指定审批人" prop="copyUserIds">
|
||||
<el-tag
|
||||
:key="index"
|
||||
v-for="(item, index) in nextUser"
|
||||
closable
|
||||
:disable-transitions="false"
|
||||
@close="handleClose('next', item)">
|
||||
{{ item.nickName }}
|
||||
</el-tag>
|
||||
<el-button class="button-new-tag" type="primary" icon="el-icon-plus" size="mini" circle @click="onSelectNextUsers" />
|
||||
<div class="form-item-tip">
|
||||
<i class="el-icon-info"></i>
|
||||
<span>您可以指定下一个任务的处理人，系统将自动将任务分配给指定的人员</span>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="10" type="flex" justify="center" >
|
||||
<el-col :span="1.5">
|
||||
<el-button icon="el-icon-circle-check" type="success" @click="handleComplete">通过</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button icon="el-icon-chat-line-square" type="primary" @click="handleDelegate">委派</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button icon="el-icon-thumb" type="success" @click="handleTransfer">转办</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button icon="el-icon-refresh-left" type="warning" @click="handleReturn">退回</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button icon="el-icon-circle-close" type="danger" @click="handleReject">拒绝</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label="表单信息" name="form">
|
||||
<div v-if="formOpen">
|
||||
<el-card class="box-card" shadow="never" v-for="(formInfo, index) in processFormList" :key="index">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ formInfo.title }}</span>
|
||||
</div>
|
||||
<!--流程处理表单模块-->
|
||||
<el-col :span="20" :offset="2">
|
||||
<parser :form-conf="formInfo"/>
|
||||
</el-col>
|
||||
</el-card>
|
||||
</div>
|
||||
</el-tab-pane >
|
||||
|
||||
<el-tab-pane label="流转记录" name="record">
|
||||
<el-card class="box-card" shadow="never">
|
||||
<el-col :span="20" :offset="2">
|
||||
<div class="block">
|
||||
<el-timeline>
|
||||
<el-timeline-item v-for="(item,index) in historyProcNodeList" :key="index" :icon="setIcon(item.endTime)" :color="setColor(item.endTime)">
|
||||
<p style="font-weight: 700">{{ item.activityName }}</p>
|
||||
<el-card v-if="item.activityType === 'startEvent'" class="box-card" shadow="hover">
|
||||
{{ item.assigneeName }} 在 {{ item.createTime }} 发起流程
|
||||
</el-card>
|
||||
<el-card v-if="item.activityType === 'userTask'" class="box-card" shadow="hover">
|
||||
<el-descriptions :column="5" :labelStyle="{'font-weight': 'bold'}">
|
||||
<el-descriptions-item label="实际办理">{{ item.assigneeName || '-'}}</el-descriptions-item>
|
||||
<el-descriptions-item label="候选办理">{{ item.candidate || '-'}}</el-descriptions-item>
|
||||
<el-descriptions-item label="接收时间">{{ item.createTime || '-'}}</el-descriptions-item>
|
||||
<el-descriptions-item label="办结时间">{{ item.endTime || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="耗时">{{ item.duration || '-'}}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<div v-if="item.commentList && item.commentList.length > 0">
|
||||
<div v-for="(comment, index) in item.commentList" :key="index">
|
||||
<el-divider content-position="left">
|
||||
<el-tag :type="approveTypeTag(comment.type)" size="mini">{{ commentType(comment.type) }}</el-tag>
|
||||
<el-tag type="info" effect="plain" size="mini">{{ comment.time }}</el-tag>
|
||||
</el-divider>
|
||||
<span>{{ comment.fullMessage }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
<el-card v-if="item.activityType === 'endEvent'" class="box-card" shadow="hover">
|
||||
{{ item.createTime }} 结束流程
|
||||
</el-card>
|
||||
</el-timeline-item>
|
||||
</el-timeline>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-card>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label="流程跟踪" name="track">
|
||||
<el-card class="box-card" shadow="never">
|
||||
<process-viewer :key="`designer-${loadIndex}`" :style="'height:' + height" :xml="xmlData"
|
||||
:finishedInfo="finishedInfo" :allCommentList="historyProcNodeList"
|
||||
/>
|
||||
</el-card>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
|
||||
<!--退回流程-->
|
||||
<el-dialog :title="returnTitle" :visible.sync="returnOpen" width="40%" append-to-body>
|
||||
<el-form ref="taskForm" :model="taskForm" label-width="80px" >
|
||||
<el-form-item label="退回节点" prop="targetKey">
|
||||
<el-radio-group v-model="taskForm.targetKey">
|
||||
<el-radio-button
|
||||
v-for="item in returnTaskList"
|
||||
:key="item.id"
|
||||
:label="item.id"
|
||||
>{{item.name}}</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="returnOpen = false">取 消</el-button>
|
||||
<el-button type="primary" @click="submitReturn">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog :title="userData.title" :visible.sync="userData.open" width="60%" append-to-body>
|
||||
<el-row type="flex" :gutter="20">
|
||||
<!--部门数据-->
|
||||
<el-col :span="5">
|
||||
<el-card shadow="never" style="height: 100%">
|
||||
<div slot="header">
|
||||
<span>部门列表</span>
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<el-input v-model="deptName" placeholder="请输入部门名称" clearable size="small" prefix-icon="el-icon-search"/>
|
||||
<el-tree
|
||||
:data="deptOptions"
|
||||
:props="deptProps"
|
||||
:expand-on-click-node="false"
|
||||
:filter-node-method="filterNode"
|
||||
ref="tree"
|
||||
default-expand-all
|
||||
@node-click="handleNodeClick"
|
||||
/>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="18">
|
||||
<KLPTable ref="userTable"
|
||||
:key="userData.type"
|
||||
height="500"
|
||||
v-loading="userLoading"
|
||||
:data="userList"
|
||||
highlight-current-row
|
||||
@current-change="changeCurrentUser"
|
||||
@selection-change="handleSelectionChange">
|
||||
<el-table-column v-if="userData.type === 'copy' || userData.type === 'next'" width="55" type="selection" />
|
||||
<el-table-column v-else width="30">
|
||||
<template slot-scope="scope">
|
||||
<el-radio :label="scope.row.userId" v-model="currentUserId">{{''}}</el-radio>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="用户名" align="center" prop="nickName" />
|
||||
<el-table-column label="手机" align="center" prop="phonenumber" />
|
||||
<el-table-column label="部门" align="center" prop="dept.deptName" />
|
||||
</KLPTable>
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="userData.open = false">取 消</el-button>
|
||||
<el-button type="primary" @click="submitUserData">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { detailProcess } from '@/api/workflow/process'
|
||||
import Parser from '@/utils/generator/parser'
|
||||
import { complete, delegate, transfer, rejectTask, returnList, returnTask } from '@/api/workflow/task'
|
||||
import { selectUser, deptTreeSelect } from '@/api/system/user'
|
||||
import ProcessViewer from '@/components/ProcessViewer'
|
||||
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
|
||||
import Treeselect from '@riophae/vue-treeselect'
|
||||
|
||||
export default {
|
||||
name: "WorkDetail",
|
||||
components: {
|
||||
ProcessViewer,
|
||||
Parser,
|
||||
Treeselect
|
||||
},
|
||||
props: {},
|
||||
computed: {
|
||||
commentType() {
|
||||
return val => {
|
||||
switch (val) {
|
||||
case '1': return '通过'
|
||||
case '2': return '退回'
|
||||
case '3': return '驳回'
|
||||
case '4': return '委派'
|
||||
case '5': return '转办'
|
||||
case '6': return '终止'
|
||||
case '7': return '撤回'
|
||||
}
|
||||
}
|
||||
},
|
||||
approveTypeTag() {
|
||||
return val => {
|
||||
switch (val) {
|
||||
case '1': return 'success'
|
||||
case '2': return 'warning'
|
||||
case '3': return 'danger'
|
||||
case '4': return 'primary'
|
||||
case '5': return 'success'
|
||||
case '6': return 'danger'
|
||||
case '7': return 'info'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
height: document.documentElement.clientHeight - 205 + 'px;',
|
||||
// 模型xml数据
|
||||
loadIndex: 0,
|
||||
xmlData: undefined,
|
||||
finishedInfo: {
|
||||
finishedSequenceFlowSet: [],
|
||||
finishedTaskSet: [],
|
||||
unfinishedTaskSet: [],
|
||||
rejectedTaskSet: []
|
||||
},
|
||||
historyProcNodeList: [],
|
||||
// 部门名称
|
||||
deptName: undefined,
|
||||
// 部门树选项
|
||||
deptOptions: undefined,
|
||||
userLoading: false,
|
||||
// 用户表格数据
|
||||
userList: null,
|
||||
deptProps: {
|
||||
children: "children",
|
||||
label: "label"
|
||||
},
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
deptId: undefined
|
||||
},
|
||||
total: 0,
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
taskForm:{
|
||||
comment:"", // 意见内容
|
||||
procInsId: "", // 流程实例编号
|
||||
taskId: "" ,// 流程任务编号
|
||||
copyUserIds: "", // 抄送人Id
|
||||
vars: "",
|
||||
targetKey:""
|
||||
},
|
||||
rules: {
|
||||
comment: [{ required: true, message: '请输入审批意见', trigger: 'blur' }],
|
||||
},
|
||||
currentUserId: null,
|
||||
variables: [], // 流程变量数据
|
||||
taskFormOpen: false,
|
||||
taskFormData: {}, // 流程变量数据
|
||||
processFormList: [], // 流程变量数据
|
||||
formOpen: false, // 是否加载流程变量数据
|
||||
returnTaskList: [], // 回退列表数据
|
||||
processed: false,
|
||||
returnTitle: null,
|
||||
returnOpen: false,
|
||||
rejectOpen: false,
|
||||
rejectTitle: null,
|
||||
userData: {
|
||||
title: '',
|
||||
type: '',
|
||||
open: false,
|
||||
},
|
||||
copyUser: [],
|
||||
nextUser: [],
|
||||
userMultipleSelection: [],
|
||||
userDialogTitle: '',
|
||||
userOpen: false
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.initData();
|
||||
},
|
||||
methods: {
|
||||
initData() {
|
||||
this.taskForm.procInsId = this.$route.params && this.$route.params.procInsId;
|
||||
this.taskForm.taskId = this.$route.query && this.$route.query.taskId;
|
||||
this.processed = this.$route.query && eval(this.$route.query.processed || false);
|
||||
// 流程任务重获取变量表单
|
||||
this.getProcessDetails(this.taskForm.procInsId, this.taskForm.taskId);
|
||||
this.loadIndex = this.taskForm.procInsId;
|
||||
},
|
||||
/** 查询部门下拉树结构 */
|
||||
getTreeSelect() {
|
||||
deptTreeSelect().then(response => {
|
||||
this.deptOptions = response.data;
|
||||
});
|
||||
},
|
||||
/** 查询用户列表 */
|
||||
getList() {
|
||||
this.userLoading = true;
|
||||
selectUser(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
|
||||
this.userList = response.rows;
|
||||
this.total = response.total;
|
||||
this.toggleSelection(this.userMultipleSelection);
|
||||
this.userLoading = false;
|
||||
});
|
||||
},
|
||||
// 筛选节点
|
||||
filterNode(value, data) {
|
||||
if (!value) return true;
|
||||
return data.label.indexOf(value) !== -1;
|
||||
},
|
||||
// 节点单击事件
|
||||
handleNodeClick(data) {
|
||||
this.queryParams.deptId = data.id;
|
||||
this.getList();
|
||||
},
|
||||
setIcon(val) {
|
||||
if (val) {
|
||||
return "el-icon-check";
|
||||
} else {
|
||||
return "el-icon-time";
|
||||
}
|
||||
},
|
||||
setColor(val) {
|
||||
if (val) {
|
||||
return "#2bc418";
|
||||
} else {
|
||||
return "#b3bdbb";
|
||||
}
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.userMultipleSelection = selection
|
||||
},
|
||||
toggleSelection(selection) {
|
||||
if (selection && selection.length > 0) {
|
||||
this.$nextTick(()=> {
|
||||
selection.forEach(item => {
|
||||
let row = this.userList.find(k => k.userId === item.userId);
|
||||
this.$refs.userTable.toggleRowSelection(row);
|
||||
})
|
||||
})
|
||||
} else {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.userTable.clearSelection();
|
||||
});
|
||||
}
|
||||
},
|
||||
// 关闭标签
|
||||
handleClose(type, tag) {
|
||||
let userObj = this.userMultipleSelection.find(item => item.userId === tag.id);
|
||||
this.userMultipleSelection.splice(this.userMultipleSelection.indexOf(userObj), 1);
|
||||
if (type === 'copy') {
|
||||
this.copyUser = this.userMultipleSelection;
|
||||
// 设置抄送人ID
|
||||
if (this.copyUser && this.copyUser.length > 0) {
|
||||
const val = this.copyUser.map(item => item.id);
|
||||
this.taskForm.copyUserIds = val instanceof Array ? val.join(',') : val;
|
||||
} else {
|
||||
this.taskForm.copyUserIds = '';
|
||||
}
|
||||
} else if (type === 'next') {
|
||||
this.nextUser = this.userMultipleSelection;
|
||||
// 设置抄送人ID
|
||||
if (this.nextUser && this.nextUser.length > 0) {
|
||||
const val = this.nextUser.map(item => item.id);
|
||||
this.taskForm.nextUserIds = val instanceof Array ? val.join(',') : val;
|
||||
} else {
|
||||
this.taskForm.nextUserIds = '';
|
||||
}
|
||||
}
|
||||
},
|
||||
/** 流程变量赋值 */
|
||||
handleCheckChange(val) {
|
||||
if (val instanceof Array) {
|
||||
this.taskForm.values = {
|
||||
"approval": val.join(',')
|
||||
}
|
||||
} else {
|
||||
this.taskForm.values = {
|
||||
"approval": val
|
||||
}
|
||||
}
|
||||
},
|
||||
getProcessDetails(procInsId, taskId) {
|
||||
const params = {procInsId: procInsId, taskId: taskId}
|
||||
detailProcess(params).then(res => {
|
||||
const data = res.data;
|
||||
this.xmlData = data.bpmnXml;
|
||||
this.processFormList = data.processFormList;
|
||||
this.taskFormOpen = data.existTaskForm;
|
||||
if (this.taskFormOpen) {
|
||||
this.taskFormData = data.taskFormData;
|
||||
}
|
||||
this.historyProcNodeList = data.historyProcNodeList;
|
||||
this.finishedInfo = data.flowViewer;
|
||||
this.formOpen = true
|
||||
})
|
||||
},
|
||||
onSelectCopyUsers() {
|
||||
this.userMultipleSelection = this.copyUser;
|
||||
this.onSelectUsers('添加抄送人', 'copy')
|
||||
},
|
||||
onSelectNextUsers() {
|
||||
this.userMultipleSelection = this.nextUser;
|
||||
this.onSelectUsers('指定审批人', 'next')
|
||||
},
|
||||
onSelectUsers(title, type) {
|
||||
this.userData.title = title;
|
||||
this.userData.type = type;
|
||||
this.getTreeSelect();
|
||||
this.getList()
|
||||
this.userData.open = true;
|
||||
},
|
||||
/** 通过任务 */
|
||||
handleComplete() {
|
||||
// 校验表单
|
||||
const taskFormRef = this.$refs.taskFormParser;
|
||||
const isExistTaskForm = taskFormRef !== undefined;
|
||||
// 若无任务表单，则 taskFormPromise 为 true，即不需要校验
|
||||
const taskFormPromise = !isExistTaskForm ? true : new Promise((resolve, reject) => {
|
||||
taskFormRef.$refs[taskFormRef.formConfCopy.formRef].validate(valid => {
|
||||
valid ? resolve() : reject()
|
||||
})
|
||||
});
|
||||
const approvalPromise = new Promise((resolve, reject) => {
|
||||
this.$refs['taskForm'].validate(valid => {
|
||||
valid ? resolve() : reject()
|
||||
})
|
||||
});
|
||||
Promise.all([taskFormPromise, approvalPromise]).then(() => {
|
||||
if (isExistTaskForm) {
|
||||
this.taskForm.variables = taskFormRef[taskFormRef.formConfCopy.formModel]
|
||||
}
|
||||
complete(this.taskForm).then(response => {
|
||||
this.$modal.msgSuccess(response.msg);
|
||||
this.goBack();
|
||||
});
|
||||
})
|
||||
},
|
||||
/** 委派任务 */
|
||||
handleDelegate() {
|
||||
this.$refs["taskForm"].validate(valid => {
|
||||
if (valid) {
|
||||
this.userData.type = 'delegate';
|
||||
this.userData.title = '委派任务'
|
||||
this.userData.open = true;
|
||||
this.getTreeSelect();
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 转办任务 */
|
||||
handleTransfer(){
|
||||
this.$refs["taskForm"].validate(valid => {
|
||||
if (valid) {
|
||||
this.userData.type = 'transfer';
|
||||
this.userData.title = '转办任务';
|
||||
this.userData.open = true;
|
||||
this.getTreeSelect();
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 拒绝任务 */
|
||||
handleReject() {
|
||||
this.$refs["taskForm"].validate(valid => {
|
||||
if (valid) {
|
||||
const _this = this;
|
||||
this.$modal.confirm('拒绝审批单流程会终止，是否继续？').then(function() {
|
||||
return rejectTask(_this.taskForm);
|
||||
}).then(res => {
|
||||
this.$modal.msgSuccess(res.msg);
|
||||
this.goBack();
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
changeCurrentUser(val) {
|
||||
this.currentUserId = val.userId
|
||||
},
|
||||
/** 返回页面 */
|
||||
goBack() {
|
||||
// 关闭当前标签页并返回上个页面
|
||||
this.$tab.closePage(this.$route)
|
||||
this.$router.back()
|
||||
},
|
||||
/** 接收子组件传的值 */
|
||||
getData(data) {
|
||||
if (data) {
|
||||
const variables = [];
|
||||
data.fields.forEach(item => {
|
||||
let variableData = {};
|
||||
variableData.label = item.__config__.label
|
||||
// 表单值为多个选项时
|
||||
if (item.__config__.defaultValue instanceof Array) {
|
||||
const array = [];
|
||||
item.__config__.defaultValue.forEach(val => {
|
||||
array.push(val)
|
||||
})
|
||||
variableData.val = array;
|
||||
} else {
|
||||
variableData.val = item.__config__.defaultValue
|
||||
}
|
||||
variables.push(variableData)
|
||||
})
|
||||
this.variables = variables;
|
||||
}
|
||||
},
|
||||
submitUserData() {
|
||||
let type = this.userData.type;
|
||||
if (type === 'copy' || type === 'next') {
|
||||
if (!this.userMultipleSelection || this.userMultipleSelection.length <= 0) {
|
||||
this.$modal.msgError("请选择用户");
|
||||
return false;
|
||||
}
|
||||
let userIds = this.userMultipleSelection.map(k => k.userId);
|
||||
if (type === 'copy') {
|
||||
// 设置抄送人ID信息
|
||||
this.copyUser = this.userMultipleSelection;
|
||||
this.taskForm.copyUserIds = userIds instanceof Array ? userIds.join(',') : userIds;
|
||||
} else if (type === 'next') {
|
||||
// 设置下一级审批人ID信息
|
||||
this.nextUser = this.userMultipleSelection;
|
||||
this.taskForm.nextUserIds = userIds instanceof Array ? userIds.join(',') : userIds;
|
||||
}
|
||||
this.userData.open = false;
|
||||
} else {
|
||||
if (!this.taskForm.comment) {
|
||||
this.$modal.msgError("请输入审批意见");
|
||||
return false;
|
||||
}
|
||||
if (!this.currentUserId) {
|
||||
this.$modal.msgError("请选择用户");
|
||||
return false;
|
||||
}
|
||||
this.taskForm.userId = this.currentUserId;
|
||||
if (type === 'delegate') {
|
||||
delegate(this.taskForm).then(res => {
|
||||
this.$modal.msgSuccess(res.msg);
|
||||
this.goBack();
|
||||
});
|
||||
}
|
||||
if (type === 'transfer') {
|
||||
transfer(this.taskForm).then(res => {
|
||||
this.$modal.msgSuccess(res.msg);
|
||||
this.goBack();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
/** 可退回任务列表 */
|
||||
handleReturn() {
|
||||
this.$refs['taskForm'].validate(valid => {
|
||||
if (valid) {
|
||||
this.returnTitle = "退回流程";
|
||||
returnList(this.taskForm).then(res => {
|
||||
this.returnTaskList = res.data;
|
||||
this.taskForm.values = null;
|
||||
this.returnOpen = true;
|
||||
})
|
||||
}
|
||||
});
|
||||
|
||||
},
|
||||
/** 提交退回任务 */
|
||||
submitReturn() {
|
||||
this.$refs["taskForm"].validate(valid => {
|
||||
if (valid) {
|
||||
if (!this.taskForm.targetKey) {
|
||||
this.$modal.msgError("请选择退回节点！");
|
||||
}
|
||||
returnTask(this.taskForm).then(res => {
|
||||
this.$modal.msgSuccess(res.msg);
|
||||
this.goBack()
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.clearfix:before,
|
||||
.clearfix:after {
|
||||
display: table;
|
||||
content: "";
|
||||
}
|
||||
.clearfix:after {
|
||||
clear: both
|
||||
}
|
||||
|
||||
.box-card {
|
||||
width: 100%;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.el-tag + .el-tag {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.el-row {
|
||||
margin-bottom: 20px;
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
.el-col {
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.button-new-tag {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.form-item-tip {
|
||||
margin-top: 8px;
|
||||
font-size: 12px;
|
||||
color: #909399;
|
||||
line-height: 1.5;
|
||||
|
||||
i {
|
||||
margin-right: 4px;
|
||||
color: #E6A23C;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,243 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="流程名称" prop="processName">
|
||||
<el-input
|
||||
v-model="queryParams.processName"
|
||||
placeholder="请输入流程名称"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="审批时间">
|
||||
<el-date-picker
|
||||
v-model="dateRange"
|
||||
style="width: 240px"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
type="daterange"
|
||||
range-separator="-"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
:default-time="['00:00:00', '23:59:59']"
|
||||
></el-date-picker>
|
||||
</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="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
v-hasPermi="['workflow:process:finishedExport']"
|
||||
@click="handleExport"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="finishedList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="任务编号" align="center" prop="taskId" :show-overflow-tooltip="true"/>
|
||||
<el-table-column label="流程名称" align="center" prop="procDefName" :show-overflow-tooltip="true"/>
|
||||
<el-table-column label="任务节点" align="center" prop="taskName" />
|
||||
<el-table-column label="流程发起人" align="center">
|
||||
<template slot-scope="scope">
|
||||
<label>{{scope.row.startUserName}}</label>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="接收时间" align="center" prop="createTime" width="180"/>
|
||||
<el-table-column label="审批时间" align="center" prop="finishTime" width="180"/>
|
||||
<el-table-column label="耗时" align="center" prop="duration" width="180"/>
|
||||
<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-tickets"
|
||||
@click="handleFlowRecord(scope.row)"
|
||||
v-hasPermi="['workflow:process:query']"
|
||||
>流转记录</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-tickets"
|
||||
@click="handleRevoke(scope.row)"
|
||||
v-hasPermi="['workflow:process:revoke']"
|
||||
>撤回
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listFinishedProcess } from '@/api/workflow/process';
|
||||
import { revokeProcess } from "@/api/workflow/finished";
|
||||
|
||||
export default {
|
||||
name: "Finished",
|
||||
components: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 已办任务列表数据
|
||||
finishedList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
src: "",
|
||||
dateRange: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
name: null,
|
||||
category: null,
|
||||
key: null,
|
||||
tenantId: null,
|
||||
deployTime: null,
|
||||
derivedFrom: null,
|
||||
derivedFromRoot: null,
|
||||
parentDeploymentId: null,
|
||||
engineVersion: null
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
}
|
||||
};
|
||||
},
|
||||
beforeRouteEnter(to, from, next) {
|
||||
next(vm => {
|
||||
vm.getList()
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
/** 查询流程定义列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listFinishedProcess(this.queryParams).then(response => {
|
||||
this.finishedList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
id: null,
|
||||
name: null,
|
||||
category: null,
|
||||
key: null,
|
||||
tenantId: null,
|
||||
deployTime: null,
|
||||
derivedFrom: null,
|
||||
derivedFromRoot: null,
|
||||
parentDeploymentId: null,
|
||||
engineVersion: null
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
setIcon(val){
|
||||
if (val){
|
||||
return "el-icon-check";
|
||||
}else {
|
||||
return "el-icon-time";
|
||||
}
|
||||
|
||||
},
|
||||
setColor(val){
|
||||
if (val){
|
||||
return "#2bc418";
|
||||
}else {
|
||||
return "#b3bdbb";
|
||||
}
|
||||
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRange = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.id)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加流程定义";
|
||||
},
|
||||
/** 流程流转记录 */
|
||||
handleFlowRecord(row){
|
||||
this.$router.push({
|
||||
path: '/workflow/process/detail/' + row.procInsId,
|
||||
query: {
|
||||
processed: false
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 撤回任务 */
|
||||
handleRevoke(row) {
|
||||
const params = {
|
||||
procInsId: row.procInsId,
|
||||
taskId: row.taskId
|
||||
};
|
||||
revokeProcess(params).then(res => {
|
||||
this.$modal.msgSuccess(res.msg);
|
||||
this.getList();
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('workflow/process/finishedExport', {
|
||||
...this.queryParams
|
||||
}, `wf_finished_process_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,204 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="流程标识" prop="processKey">
|
||||
<el-input
|
||||
v-model="queryParams.processKey"
|
||||
placeholder="请输入流程标识"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="流程名称" prop="processName">
|
||||
<el-input
|
||||
v-model="queryParams.processName"
|
||||
placeholder="请输入流程名称"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="流程分类" prop="category">
|
||||
<el-select v-model="queryParams.category" clearable placeholder="请选择" size="small">
|
||||
<el-option
|
||||
v-for="item in categoryOptions"
|
||||
:key="item.categoryId"
|
||||
:label="item.categoryName"
|
||||
:value="item.code">
|
||||
</el-option>
|
||||
</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-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
v-hasPermi="['workflow:process:startExport']"
|
||||
@click="handleExport"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
<KLPTable v-loading="loading" fit :data="processList">
|
||||
<el-table-column label="序号" type="index" width="50"></el-table-column>
|
||||
<el-table-column label="流程标识" align="center" prop="processKey" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="流程名称" align="center" :show-overflow-tooltip="true">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" @click="handleProcessView(scope.row)">
|
||||
<span>{{ scope.row.processName }}</span>
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="流程分类" align="center" prop="categoryName" :formatter="categoryFormat" />
|
||||
<el-table-column label="流程版本" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-tag size="medium" >v{{ scope.row.version }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-tag type="success" v-if="!scope.row.suspended">激活</el-tag>
|
||||
<el-tag type="warning" v-if="scope.row.suspended">挂起</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="部署时间" align="center" prop="deploymentTime" width="180"/>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
icon="el-icon-video-play"
|
||||
@click="handleStart(scope.row)"
|
||||
v-hasPermi="['workflow:process:start']"
|
||||
>发起</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 流程图 -->
|
||||
<el-dialog :title="processView.title" :visible.sync="processView.open" width="70%" append-to-body>
|
||||
<process-viewer :key="`designer-${processView.index}`" :xml="processView.xmlData" :style="{height: '400px'}" />
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listProcess, getBpmnXml } from "@/api/workflow/process";
|
||||
import { listAllCategory } from '@/api/workflow/category'
|
||||
import ProcessViewer from '@/components/ProcessViewer'
|
||||
|
||||
export default {
|
||||
name: 'WorkProcess',
|
||||
components: {
|
||||
ProcessViewer
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
processKey: undefined,
|
||||
processName: undefined,
|
||||
category: undefined
|
||||
},
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
filterCategoryText: '',
|
||||
categoryOptions: [],
|
||||
categoryProps: {
|
||||
label: 'categoryName',
|
||||
value: 'code'
|
||||
},
|
||||
// 流程定义表格数据
|
||||
processList: [],
|
||||
processView: {
|
||||
title: '',
|
||||
open: false,
|
||||
index: undefined,
|
||||
xmlData:"",
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getCategoryList();
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询流程分类列表 */
|
||||
getCategoryList() {
|
||||
listAllCategory().then(response => this.categoryOptions = response.data)
|
||||
},
|
||||
/** 查询流程定义列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listProcess(this.queryParams).then(response => {
|
||||
this.processList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
// 搜索按钮操作
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
// 重置按钮操作
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 查看流程图 */
|
||||
handleProcessView(row) {
|
||||
let definitionId = row.definitionId;
|
||||
this.processView.title = "流程图";
|
||||
this.processView.index = definitionId;
|
||||
// 发送请求，获取xml
|
||||
getBpmnXml(definitionId).then(res => {
|
||||
this.processView.xmlData = res.data;
|
||||
})
|
||||
this.processView.open = true;
|
||||
},
|
||||
handleStart(row) {
|
||||
this.$router.push({
|
||||
path: '/workflow/process/start/' + row.deploymentId,
|
||||
query: {
|
||||
definitionId: row.definitionId,
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('workflow/process/startExport', {
|
||||
...this.queryParams
|
||||
}, `wf_start_process_${new Date().getTime()}.xlsx`)
|
||||
},
|
||||
categoryFormat(row, column) {
|
||||
return this.categoryOptions.find(k => k.code === row.category)?.categoryName ?? '';
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -1,301 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="流程标识" prop="processKey">
|
||||
<el-input
|
||||
v-model="queryParams.processKey"
|
||||
placeholder="请输入流程标识"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="流程名称" prop="processName">
|
||||
<el-input
|
||||
v-model="queryParams.processName"
|
||||
placeholder="请输入流程名称"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="流程分类" prop="category">
|
||||
<el-select v-model="queryParams.category" clearable placeholder="请选择" size="small">
|
||||
<el-option
|
||||
v-for="item in categoryOptions"
|
||||
:key="item.categoryId"
|
||||
:label="item.categoryName"
|
||||
:value="item.code">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="提交时间">
|
||||
<el-date-picker
|
||||
v-model="dateRange"
|
||||
style="width: 240px"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
type="daterange"
|
||||
range-separator="-"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
:default-time="['00:00:00', '23:59:59']"
|
||||
></el-date-picker>
|
||||
</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="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
v-hasPermi="['workflow:process:ownExport']"
|
||||
@click="handleExport"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="ownProcessList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="流程编号" align="center" prop="procInsId" :show-overflow-tooltip="true"/>
|
||||
<el-table-column label="流程名称" align="center" prop="procDefName" :show-overflow-tooltip="true"/>
|
||||
<el-table-column label="流程类别" align="center" prop="category" :formatter="categoryFormat" />
|
||||
<el-table-column label="流程版本" align="center" width="80px">
|
||||
<template slot-scope="scope">
|
||||
<el-tag size="medium" >v{{ scope.row.procDefVersion }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="当前节点" align="center" prop="taskName"/>
|
||||
<el-table-column label="提交时间" align="center" prop="createTime" width="180"/>
|
||||
<el-table-column label="流程状态" align="center" width="100">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.wf_process_status" :value="scope.row.processStatus"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="耗时" align="center" prop="duration" width="180"/>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
icon="el-icon-tickets"
|
||||
@click="handleFlowRecord(scope.row)"
|
||||
v-hasPermi="['workflow:process:query']"
|
||||
>详情</el-button>
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
v-if="scope.row.finishTime"
|
||||
v-hasPermi="['workflow:process:remove']"
|
||||
>删除</el-button>
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
icon="el-icon-circle-close"
|
||||
@click="handleStop(scope.row)"
|
||||
v-hasPermi="['workflow:process:cancel']"
|
||||
>取消</el-button>
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
icon="el-icon-refresh-right"
|
||||
v-hasPermi="['workflow:process:start']"
|
||||
@click="handleAgain(scope.row)"
|
||||
>重新发起</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listOwnProcess, stopProcess, delProcess } from '@/api/workflow/process';
|
||||
import { listAllCategory } from '@/api/workflow/category';
|
||||
export default {
|
||||
name: "Own",
|
||||
dicts: ['wf_process_status'],
|
||||
components: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
processLoading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
categoryOptions: [],
|
||||
processTotal:0,
|
||||
// 我发起的流程列表数据
|
||||
ownProcessList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
src: "",
|
||||
definitionList:[],
|
||||
// 日期范围
|
||||
dateRange: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
processKey: undefined,
|
||||
processName: undefined,
|
||||
category: undefined
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
},
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getCategoryList();
|
||||
},
|
||||
beforeRouteEnter(to, from, next) {
|
||||
next(vm => {
|
||||
vm.getList()
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
/** 查询流程分类列表 */
|
||||
getCategoryList() {
|
||||
listAllCategory().then(response => this.categoryOptions = response.data)
|
||||
},
|
||||
/** 查询流程定义列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listOwnProcess(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
|
||||
this.ownProcessList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
id: null,
|
||||
name: null,
|
||||
category: null,
|
||||
key: null,
|
||||
tenantId: null,
|
||||
deployTime: null,
|
||||
derivedFrom: null,
|
||||
derivedFromRoot: null,
|
||||
parentDeploymentId: null,
|
||||
engineVersion: null
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRange = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.procInsId);
|
||||
this.single = selection.length !== 1;
|
||||
this.multiple = !selection.length;
|
||||
},
|
||||
handleAgain(row) {
|
||||
this.$router.push({
|
||||
path: '/workflow/process/start/' + row.deployId,
|
||||
query: {
|
||||
definitionId: row.procDefId,
|
||||
procInsId: row.procInsId
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 取消流程申请 */
|
||||
handleStop(row){
|
||||
const params = {
|
||||
procInsId: row.procInsId
|
||||
}
|
||||
stopProcess(params).then( res => {
|
||||
this.$modal.msgSuccess(res.msg);
|
||||
this.getList();
|
||||
});
|
||||
},
|
||||
/** 流程流转记录 */
|
||||
handleFlowRecord(row) {
|
||||
this.$router.push({
|
||||
path: '/workflow/process/detail/' + row.procInsId,
|
||||
query: {
|
||||
processed: false
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const ids = row.procInsId || this.ids;
|
||||
this.$confirm('是否确认删除流程定义编号为"' + ids + '"的数据项?', "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(function() {
|
||||
return delProcess(ids);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('workflow/process/ownExport', {
|
||||
...this.queryParams
|
||||
}, `wf_own_process_${new Date().getTime()}.xlsx`)
|
||||
},
|
||||
categoryFormat(row, column) {
|
||||
return this.categoryOptions.find(k => k.code === row.category)?.categoryName ?? '';
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,328 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>发起流程</span>
|
||||
</div>
|
||||
<el-col :span="18" :offset="3">
|
||||
<div class="form-conf" v-if="formOpen">
|
||||
<parser :key="parserKey" :form-conf="formData" ref="parser" @getData="getData"/>
|
||||
</div>
|
||||
|
||||
<!-- 审批负责人设置 -->
|
||||
<el-col :span="10" :offset="3">
|
||||
<el-form ref="approvalForm" :model="approvalForm" label-width="120px">
|
||||
<el-form-item label="指定审批人">
|
||||
<el-tag
|
||||
:key="index"
|
||||
v-for="(item, index) in approvalUsers"
|
||||
closable
|
||||
:disable-transitions="false"
|
||||
@close="handleClose(item)">
|
||||
{{ item.nickName }}
|
||||
</el-tag>
|
||||
<el-button class="button-new-tag" type="primary" icon="el-icon-plus" size="mini" circle @click="onSelectUsers" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-col>
|
||||
|
||||
<!-- 提交和重置按钮 -->
|
||||
<div class="submit-buttons" v-if="formOpen">
|
||||
<el-button type="primary" @click="submitForm">提交</el-button>
|
||||
<el-button @click="resetForm">重置</el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-card>
|
||||
|
||||
<!-- 用户选择对话框 -->
|
||||
<el-dialog title="选择审批人" :visible.sync="userData.open" width="60%" append-to-body>
|
||||
<el-row type="flex" :gutter="20">
|
||||
<!--部门数据-->
|
||||
<el-col :span="5">
|
||||
<el-card shadow="never" style="height: 100%">
|
||||
<div slot="header">
|
||||
<span>部门列表</span>
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<el-input v-model="deptName" placeholder="请输入部门名称" clearable size="small" prefix-icon="el-icon-search"/>
|
||||
<el-tree
|
||||
:data="deptOptions"
|
||||
:props="deptProps"
|
||||
:expand-on-click-node="false"
|
||||
:filter-node-method="filterNode"
|
||||
ref="tree"
|
||||
default-expand-all
|
||||
@node-click="handleNodeClick"
|
||||
/>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="18">
|
||||
<KLPTable ref="userTable"
|
||||
height="500"
|
||||
v-loading="userLoading"
|
||||
:data="userList"
|
||||
highlight-current-row
|
||||
@selection-change="handleSelectionChange">
|
||||
<el-table-column width="55" type="selection" />
|
||||
<el-table-column label="用户名" align="center" prop="nickName" />
|
||||
<el-table-column label="手机" align="center" prop="phonenumber" />
|
||||
<el-table-column label="部门" align="center" prop="dept.deptName" />
|
||||
</KLPTable>
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="userData.open = false">取 消</el-button>
|
||||
<el-button type="primary" @click="submitUserData">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getProcessForm, startProcess } from '@/api/workflow/process'
|
||||
import Parser from '@/utils/generator/parser'
|
||||
import { selectUser, deptTreeSelect } from '@/api/system/user'
|
||||
import Pagination from '@/components/Pagination'
|
||||
|
||||
export default {
|
||||
name: 'WorkStart',
|
||||
components: {
|
||||
Parser,
|
||||
Pagination
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
definitionId: null,
|
||||
deployId: null,
|
||||
procInsId: null,
|
||||
formOpen: false,
|
||||
formData: {},
|
||||
parserKey: 1,
|
||||
// 审批表单
|
||||
approvalForm: {
|
||||
approvalType: 1, // 默认指定用户
|
||||
},
|
||||
// 审批用户
|
||||
approvalUsers: [],
|
||||
userMultipleSelection: [],
|
||||
// 部门名称
|
||||
deptName: undefined,
|
||||
// 部门树选项
|
||||
deptOptions: undefined,
|
||||
userLoading: false,
|
||||
// 用户表格数据
|
||||
userList: null,
|
||||
deptProps: {
|
||||
children: "children",
|
||||
label: "label"
|
||||
},
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
deptId: undefined
|
||||
},
|
||||
total: 0,
|
||||
// 用户数据
|
||||
userData: {
|
||||
open: false
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.initData();
|
||||
},
|
||||
methods: {
|
||||
initData() {
|
||||
this.deployId = this.$route.params && this.$route.params.deployId;
|
||||
this.definitionId = this.$route.query && this.$route.query.definitionId;
|
||||
this.procInsId = this.$route.query && this.$route.query.procInsId;
|
||||
getProcessForm({
|
||||
definitionId: this.definitionId,
|
||||
deployId: this.deployId,
|
||||
procInsId: this.procInsId
|
||||
}).then(res => {
|
||||
if (res.data) {
|
||||
this.formData = res.data;
|
||||
// 表单按钮隐藏
|
||||
this.formData.formBtns = false;
|
||||
this.parserKey++ // 只有加载新表单时才更新 key
|
||||
this.formOpen = true
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 接收子组件传的值 */
|
||||
getData(data) {
|
||||
if (data) {
|
||||
const variables = [];
|
||||
data.fields.forEach(item => {
|
||||
const variableData = {};
|
||||
variableData.label = item.__config__.label
|
||||
// 表单值为多个选项时
|
||||
if (item.__config__.defaultValue instanceof Array) {
|
||||
const array = [];
|
||||
item.__config__.defaultValue.forEach(val => {
|
||||
array.push(val)
|
||||
})
|
||||
variableData.val = array;
|
||||
} else {
|
||||
variableData.val = item.__config__.defaultValue
|
||||
}
|
||||
variables.push(variableData)
|
||||
})
|
||||
this.variables = variables;
|
||||
}
|
||||
},
|
||||
// 提交表单
|
||||
submitForm() {
|
||||
const parserRef = this.$refs.parser;
|
||||
if (!parserRef) {
|
||||
this.$modal.msgError("表单未加载完成");
|
||||
return;
|
||||
}
|
||||
|
||||
// 获取表单数据
|
||||
parserRef.getData();
|
||||
|
||||
// 验证表单
|
||||
parserRef.$refs[parserRef.formConfCopy.formRef].validate(valid => {
|
||||
if (valid) {
|
||||
const formData = parserRef[parserRef.formConfCopy.formModel];
|
||||
|
||||
// 添加审批人信息到表单数据
|
||||
// 根据审批类型添加不同的审批人信息
|
||||
if (this.approvalForm.approvalType === 1 && this.approvalUsers.length > 0) {
|
||||
// 指定用户
|
||||
formData.flowable = formData.flowable || {};
|
||||
formData.flowable.candidateUsers = this.approvalUsers.map(user => user.userId).join(',');
|
||||
formData.flowable.candidateGroups = '';
|
||||
formData.flowable.text = this.approvalUsers.map(user => user.nickName).join(',');
|
||||
}
|
||||
|
||||
// 启动流程并将表单数据加入流程变量
|
||||
if (this.definitionId) {
|
||||
startProcess(this.definitionId, JSON.stringify(formData)).then(res => {
|
||||
this.$modal.msgSuccess(res.msg);
|
||||
this.$tab.closeOpenPage({
|
||||
path: '/work/own'
|
||||
});
|
||||
});
|
||||
} else {
|
||||
this.$modal.msgError("流程定义ID不存在");
|
||||
}
|
||||
} else {
|
||||
this.$modal.msgError("表单验证失败，请检查填写的内容");
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 重置表单
|
||||
resetForm() {
|
||||
const parserRef = this.$refs.parser;
|
||||
if (parserRef) {
|
||||
parserRef.$refs[parserRef.formConfCopy.formRef].resetFields();
|
||||
}
|
||||
this.approvalUsers = [];
|
||||
this.userMultipleSelection = [];
|
||||
this.approvalForm.approvalType = 1;
|
||||
},
|
||||
/** 查询部门下拉树结构 */
|
||||
getTreeSelect() {
|
||||
deptTreeSelect().then(response => {
|
||||
this.deptOptions = response.data;
|
||||
});
|
||||
},
|
||||
/** 查询用户列表 */
|
||||
getList() {
|
||||
this.userLoading = true;
|
||||
selectUser(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
|
||||
this.userList = response.rows;
|
||||
this.total = response.total;
|
||||
this.toggleSelection(this.userMultipleSelection);
|
||||
this.userLoading = false;
|
||||
});
|
||||
},
|
||||
// 筛选节点
|
||||
filterNode(value, data) {
|
||||
if (!value) return true;
|
||||
return data.label.indexOf(value) !== -1;
|
||||
},
|
||||
// 节点单击事件
|
||||
handleNodeClick(data) {
|
||||
this.queryParams.deptId = data.id;
|
||||
this.getList();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.userMultipleSelection = selection;
|
||||
},
|
||||
toggleSelection(selection) {
|
||||
if (selection && selection.length > 0) {
|
||||
this.$nextTick(()=> {
|
||||
selection.forEach(item => {
|
||||
let row = this.userList.find(k => k.userId === item.userId);
|
||||
if (row) {
|
||||
this.$refs.userTable.toggleRowSelection(row);
|
||||
}
|
||||
})
|
||||
})
|
||||
} else {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.userTable.clearSelection();
|
||||
});
|
||||
}
|
||||
},
|
||||
// 关闭标签
|
||||
handleClose(tag) {
|
||||
let userObj = this.userMultipleSelection.find(item => item.userId === tag.userId);
|
||||
if (userObj) {
|
||||
this.userMultipleSelection.splice(this.userMultipleSelection.indexOf(userObj), 1);
|
||||
}
|
||||
this.approvalUsers = this.userMultipleSelection;
|
||||
},
|
||||
onSelectUsers() {
|
||||
this.userMultipleSelection = this.approvalUsers;
|
||||
this.userData.open = true;
|
||||
this.getTreeSelect();
|
||||
this.getList();
|
||||
},
|
||||
submitUserData() {
|
||||
if (!this.userMultipleSelection || this.userMultipleSelection.length <= 0) {
|
||||
this.$modal.msgError("请选择用户");
|
||||
return false;
|
||||
}
|
||||
this.approvalUsers = this.userMultipleSelection;
|
||||
this.userData.open = false;
|
||||
},
|
||||
// 添加日期范围
|
||||
addDateRange(params, dateRange, propName) {
|
||||
let search = params;
|
||||
search = typeof(search) === 'object' && search !== null && !Array.isArray(search) ? search : {};
|
||||
dateRange = Array.isArray(dateRange) ? dateRange : [];
|
||||
if (typeof(propName) === 'undefined') {
|
||||
search['beginTime'] = dateRange[0];
|
||||
search['endTime'] = dateRange[1];
|
||||
} else {
|
||||
search['begin' + propName] = dateRange[0];
|
||||
search['end' + propName] = dateRange[1];
|
||||
}
|
||||
return search;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.form-conf {
|
||||
margin: 15px auto;
|
||||
width: 80%;
|
||||
padding: 15px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,203 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="流程名称" prop="processName">
|
||||
<el-input
|
||||
v-model="queryParams.processName"
|
||||
placeholder="请输入流程名称"
|
||||
clearable
|
||||
size="small"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="接收时间">
|
||||
<el-date-picker
|
||||
v-model="dateRange"
|
||||
style="width: 240px"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
type="daterange"
|
||||
range-separator="-"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
:default-time="['00:00:00', '23:59:59']"
|
||||
></el-date-picker>
|
||||
</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="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
v-hasPermi="['workflow:process:todoExport']"
|
||||
@click="handleExport"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="todoList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center"/>
|
||||
<el-table-column label="任务编号" align="center" prop="taskId" :show-overflow-tooltip="true"/>
|
||||
<el-table-column label="流程名称" align="center" prop="procDefName"/>
|
||||
<el-table-column label="任务节点" align="center" prop="taskName"/>
|
||||
<el-table-column label="流程版本" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-tag size="medium" >v{{scope.row.procDefVersion}}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="流程发起人" align="center">
|
||||
<template slot-scope="scope">
|
||||
<label>{{scope.row.startUserName}}</label>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="接收时间" align="center" prop="createTime" width="180"/>
|
||||
<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-outline"
|
||||
@click="handleProcess(scope.row)"
|
||||
v-hasPermi="['workflow:process:approval']"
|
||||
>办理
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listTodoProcess } from '@/api/workflow/process';
|
||||
|
||||
export default {
|
||||
name: "Todo",
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 流程待办任务表格数据
|
||||
todoList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 日期范围
|
||||
dateRange: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
name: null,
|
||||
category: null
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {}
|
||||
};
|
||||
},
|
||||
beforeRouteEnter(to, from, next) {
|
||||
next(vm => {
|
||||
vm.getList()
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
/** 查询流程定义列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listTodoProcess(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
|
||||
this.todoList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 跳转到处理页面
|
||||
handleProcess(row) {
|
||||
this.$router.push({
|
||||
path: '/workflow/process/detail/' + row.procInsId,
|
||||
query: {
|
||||
taskId: row.taskId,
|
||||
processed: true
|
||||
}
|
||||
})
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
id: null,
|
||||
name: null,
|
||||
category: null,
|
||||
key: null,
|
||||
tenantId: null,
|
||||
deployTime: null,
|
||||
derivedFrom: null,
|
||||
derivedFromRoot: null,
|
||||
parentDeploymentId: null,
|
||||
engineVersion: null
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRange = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.id)
|
||||
this.single = selection.length !== 1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加流程定义";
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('workflow/process/todoExport', {
|
||||
...this.queryParams
|
||||
}, `wf_todo_process_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
Reference in New Issue
Block a user