更多ruoyi-nbcio功能请看演示系统
gitee源代码地址
前后端代码: https://gitee.com/nbacheng/ruoyi-nbcio
演示地址:RuoYi-Nbcio后台管理系统 http://218.75.87.38:9666/
更多nbcio-boot功能请看演示系统
gitee源代码地址
后端代码: https://gitee.com/nbacheng/nbcio-boot
前端代码:https://gitee.com/nbacheng/nbcio-vue.git
在线演示(包括H5) : http://218.75.87.38:9888
1、后端增加一个接口
/** * 查询用户列表,用于用户选择场景 */ @SaCheckLogin @GetMapping("/selectUser") public TableDataInfo<SysUserVo> selectUser(SysUserBo user, PageQuery pageQuery) { return userService.selectPageUserList(user, pageQuery); }
2、WfIdentityMapper.xml最后增加一个d,否则多租户情况下会报错
<?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd"> <mapper namespace="com.nbcio.workflow.mapper.WfIdentityMapper"> <select id="selectPageUserList" resultType="java.util.Map"> select user_id as userId, user_name as userName, nick_name as nickName, phonenumber as phonenumber from sys_user <where> <if test="deptId != null"> and dept_id = #{deptId} </if> </where> </select> <select id="selectDeptList" resultType="java.util.Map"> select dept_id as deptId, parent_id as parentId, dept_name as deptName, order_num as orderNum from sys_dept d </select> </mapper>
3、跳转前端对话框代码修改如下
<!--跳转流程--> <el-dialog :z-index="100" :title="jumpTitle" @cancel="jumpOpen = false" v-model="jumpOpen" :width="'40%'" append-to-body> <template #header> <span>跳转节点</span> </template> <el-form ref="jumpForm" :model="jumpForm" label-width="160px"> <el-form-item label="跳转节点" prop="jumpType" :rules="[{ required: true, message: '请选择跳转节点', trigger: 'blur' }]"> <a-table size="middle" :columns="jumpNodeColumns" :loading="jumpNodeLoading" :pagination="false" :dataSource="jumpNodeData" :rowKey="(record) => record.id" :rowSelection="rowSelection" /> </el-form-item> </el-form> <template #footer> <span class="dialog-footer"> <a-button type="primary" @click="jumpOpen = false">取 消</a-button> <a-button type="primary" @click="jumpComplete(true)">确 定</a-button> </span> </template> </el-dialog>
实际上就是变量重新命名了,其它也没什么变selectedJumpRows,同时//selectedRowKeys: selectedRowKeys,这个部分注释掉
const jumpComplete = () => { if ( selectedJumpRows.value.length < 1 ) { proxy?.$modal.msgWarning('请选择跳转节点') return } // 流程信息 jumpForm.taskId = route.query && route.query.taskId as string;; jumpForm.procInsId = route.params && route.params.procInsId as string;; //对formdesigner后续加签审批的时候需要用到 jumpForm.comment = taskForm.comment; //目标选择的节点信息 jumpForm.targetActId = selectedJumpRows.value[0].id; jumpForm.targetActName = selectedJumpRows.value[0].name; console.log("jumpForm=",jumpForm); jumpTask(jumpForm).then(res => { console.log(" jumpTask",res); if (res.code == 200) { proxy?.$modal.msgSuccess('跳转成功') jumpOpen.value = false; goBack(); } else { proxy?.$modal.msgError('跳转失败:' + res.msg) } });
4、加签前端对话框
<!--加签流程--> <el-dialog :z-index="100" title="addSignTitle" @cancel="addSignOpen = false" v-model="addSignOpen" :width="'40%'" append-to-body> <template #header> <span>{{ addSignTitle }}</span> </template> <el-form ref="addSignForm" :model="addSignForm" label-width="160px"> <el-form-item label="加签类型" prop="addSignType" :rules="[{ required: true, message: '请选择加签类型', trigger: 'blur' }]"> <el-radio-group v-model="addSignType" @change="changeAddSignType"> <el-radio :value = "0" >前加签</el-radio> <el-radio :value = "1" >后加签</el-radio> <el-radio :value = "2" >多实例加签</el-radio> </el-radio-group> </el-form-item> <el-form-item label="用户选择" prop="copyUserIds" :rules="[{ required: true, message: '请选择用户', trigger: 'blur' }]"> <el-tag :key="index" v-for="(item, index) in addSignUser" 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="small" circle @click="onSelectAddSignUsers" /> </el-form-item> </el-form> <template #footer> <span class="dialog-footer"> <el-button type="primary" @click="addSignOpen = false">取 消</el-button> <el-button type="primary" @click="addSignComplete(true)">确 定</el-button> </span> </template> </el-dialog>
主要问题也是 const addSignType = ref(0) //加签类型 不单独出来好像vue3操作有问题(vue2版本是放在addSignForm里),其它逻辑也没多大变化
/** 加签 */ const handleAddSign = () => { taskFormRef.value.validate(valid => { if (valid) { addSignType.value = 0; addSignTitle.value = "前加签流程"; addSignOpen.value = true; console.log("handleAddSign addSignForm",addSignForm) } }); } const changeAddSignType = (val) => { addSignType.value = val; if(addSignType.value === 0) { addSignTitle.value = "前加签流程"; } if(addSignType.value === 1) { addSignTitle.value = "后加签流程"; } if(addSignType.value === 2) { addSignTitle.value = "多实例加签流程"; } } /** 加签任务 */ const addSignComplete = () => { addSignForm.value.addSignUsers = taskForm.addSignUsers; addSignForm.value.addSignType = addSignType.value if (!addSignForm.value.addSignUsers ) { proxy?.$modal.msgError("请选择用户"); return; } // 流程信息 addSignForm.value.taskId = route.query && route.query.taskId as string;; addSignForm.value.procInsId = route.params && route.params.procInsId as string;; //对VForm3后续加签审批的时候需要用到 addSignForm.value.comment = taskForm.comment; console.log("addSignForm=",addSignForm); if(addSignForm.value.addSignType === 2) { multiInstanceAddSignTask(addSignForm).then(response => { proxy?.$modal.msgSuccess(response.msg); addSignOpen.value = false; goBack(); }); } else { addSignTask(addSignForm.value).then(response => { proxy?.$modal.msgSuccess(response.msg); addSignOpen.value = false; goBack(); }); } }
5、效果图如下: