修改监控流程详情

This commit is contained in:
zhoulingpo
2023-04-21 17:04:51 +08:00
parent 6ed94496e7
commit 4fa262ebce
7 changed files with 166 additions and 421 deletions
+1 -1
View File
@@ -52,7 +52,7 @@ export default {
//转办
changeAssignee (data){
return request({
url: '/api/changeAssignee',
url: '/api/changeAssigneeNew',
method: 'get',
params: data
})
+4 -3
View File
@@ -35,13 +35,13 @@
// 表单的样式
.label-input-form{
padding-right: 80px;
.el-form-item.el-form-item__label{
.el-form-item .el-form-item__label{
line-height: 40px;
font-size: 15px;
color:#555 !important;
}
.el-form-item.el-input__inner,.el-form-item {
.el-form-item .el-input__inner {
height: 40px;
line-height: 40px;
font-size: 15px;
}
@@ -59,3 +59,4 @@
}
}
+7
View File
@@ -5,3 +5,10 @@ export const PERMISSION = new Esenum([
{ label: '预览', value: 0 },
{ label: '预览+下载', value: 2 }
])
// 流程状态
export const PROCESSSTATE = new Esenum(
{
COMPLETED: {name: '已完成', index: 1},
INCOMPLETED: {name: '未完成', index: 0}
}
)
+5 -4
View File
@@ -46,13 +46,14 @@ instance.interceptors.response.use(function (response) {
// 登录超时
if (response.data.respCode === '401') {
store.commit('saveUserInfo', null)
store.commit('saveUserInfo', null)
store.commit('savePathUrl', null)
store.commit('saveMenuName', null)
store.commit('saveMenuData', null)
router.push('/login')
Message.error('登录超时过期')
//清除vuex
this.$store.commit('saveUserInfo', null)
this.$store.commit('savePathUrl', null)
this.$store.commit('saveMenuName', null)
this.$store.commit('saveMenuData', null)
// var url = 'http://192.168.144.22:9966/login?loginType=1'
// // var url = 'http://10.64.23.30:7766/home'
//
@@ -33,7 +33,8 @@
<div class="flow-list">
<!-- <loading :loading="loading">流程列表加载中</loading>-->
<vxe-table ref="xTable" :data="detailData" :empty-render="{name: 'NotData'}" align="center" border stripe
v-table-min-height="'calc(100% - 50px)'" max-height="95%">
v-table-min-height="'calc(100% - 50px)'" max-height="95%"
@checkbox-all="selectAllEvent" @checkbox-change="selectChangeEvent">
<vxe-column type="checkbox" width="60"></vxe-column>
<vxe-column show-overflow show-header-overflow field="taskId"
title="任务步骤"></vxe-column>
@@ -46,36 +47,13 @@
<vxe-column show-overflow show-header-overflow field="status"
title="状态"></vxe-column>
</vxe-table>
<el-drawer
title="调整处理人"
:visible.sync="drawerModal"
size="300px"
:before-close="treeCancel"
>
<div class="demo-drawer-content">
<dept-tree
treeDivId="drawerModalTree"
ref="drawerModalTree"
@treeClick="selcetTree"
allDept
showUser
:editable="false"
>
</dept-tree>
</div>
<div class="demo-drawer-footer">
<el-button size="small" class="common-button-primary" icon="el-icon-check" type="primary" :loading="assigneeNewLoading" @click="addTree">确定</el-button>
<el-button size="small" class="common-button-default" icon="el-icon-close" @click="treeCancel">取消</el-button>
</div>
</el-drawer>
</div>
<monitorModal ref="monitorModal"></monitorModal>
</div>
</template>
<script>
import axios from "axios";
import { mapMutations } from 'vuex'
import {PROCESSSTATE} from '@/utils/Enum/enum'
import monitorModal from './monitorModal.vue'
import ProcessMixin from "@/components/ProcessMixin";
export default {
@@ -84,6 +62,7 @@ export default {
data () {
return {
PROCESSSTATE,
assigneeNewLoading: false, // 调整处理人确定loading
loginPeople: '',
// 调整处理人抽屉状态
@@ -109,170 +88,52 @@ export default {
processState: true, // 判断当前流程
detailsList: [],
shunxu: '',
paixu: ''
paixu: '',
checkIds: [],
checkList: []
}
},
methods: {
showDialog() {
this.$refs.monitorModal.open()
},
formatIssueDate(str) {
const momentDate = this.$moment(str)
if (momentDate.isValid()) {
return this.$moment(str).format('YYYY-MM-DD HH:mm:ss')
} else {
return str
}
},
/**
* @author liruohao
* @date 2019/4/22
* @Description: 查看流程最后一步
*/
seeProcessLast () {
let index = this.detailData.length - 1 // 当前流程任务最后一步index
let isEnd = true
let row = {...this.detailData[index]}
row.taskIds = row.id
row.taskInfo = row.name
row.tabsName = this.$route.query.tabsName
let prcType = this.detailData[index].prcType // 流程类型
// 判断当前流程是否已全部办理完成
this.detailData.map(item => {
if (!item.endTime) {
isEnd = false
}
selectAllEvent ({ checked }) {
const records = this.$refs.xTable.getCheckboxRecords()
this.checkIds = records.map(item => {
return item.id
})
if (isEnd) {
if (this.$store.state.detailMap !== '') {
let lastDetailMap = this.$store.getters.getLastDetailMap
lastDetailMap.push(this.$store.state.detailMap)
this.$store.commit('setLastDetailMap', JSON.stringify(lastDetailMap))
}
this.$store.commit('setDetailMap', this.$route.path)
row.isEnd = isEnd
this.setHandleInfo((JSON.stringify(row)))
this.setPrcLastDetail((JSON.stringify(row)))
// 根据type判断跳转具体流程页面
switch (prcType) {
case '1':
break
}
} else {
this.$message.warning('当前流程未全部办理完成,无法查看')
}
this.checkList = records
},
// table行选择事件
tableChange (row) {
this.tableRow = row
selectChangeEvent ({ checked }) {
const records = this.$refs.xTable.getCheckboxRecords()
this.checkIds = records.map(item => {
return item.id
})
this.checkList = records
},
//转办
Transfer(){
},
// 催办
urgeRow () {
if (this.tableRow.length === 1 && !this.tableRow[0].endTime) {
this.$confirm('您确认要催办该任务吗', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
confirmButtonClass: 'common-button-primary',
}).then(() => {
this.urge(this.tableRow[0])
})
} else {
this.$message.warning('请选择一条未完成的数据')
}
},
handleCommand (command) {
switch (command[1]) {
case '查看':
this.classAdd(command[0])
break
case '删除':
this.classDel(command[0])
break
}
},
// 清空条件
clearanceCondition () {
this.completeFlagType = true
this.tableRow = []
},
back () {
// this.$router.push({
// name: 'ProcessCenter',
// query: {
// tabsName: this.$route.query.tabsName
// }
// })
//要返回上一级
this.$router.back()
},
// 调整处理人确定事件
addTree () {
if (this.userId === '') {
this.$message.warning('请选择一个处理人进行调整')
} else {
this.assigneeNewLoading = true
changeAssigneeNew({
taskId: this.selectPeople.id, // 任务id
assignee: this.userId, // 被委托人
userId: this.selectPeople.assigneeId, // 委托人
pId: this.selectPeople.processInstanceId // 流程实例
}).then(res => {
this.assigneeNewLoading = false
if (res.success) {
this.drawerModal = false
this.$message.success('调整成功')
this.userId = ''
this.processNum()
this.processTable()
} else {
this.$message.warning(res.message)
showDialog() {
if(this.checkList.length < 0){
this.$message.warning("至少选择一条数据")
}else{
let check=[]
check = this.checkList.filter(item=>{
if(+item.state == this.PROCESSSTATE['COMPLETED'].index){
return item
}
})
if(check.length > 0){
this.$message.warning("请选择状态为未完成的数据")
}else{
this.$refs.monitorModal.open(this.checkIds)
}
}
},
// 取消
treeCancel () {
this.drawerModal = false
this.$refs.drawerModalTree.treeReload()
this.userId = ''
},
// 树点击
selcetTree (treeId, treeNode) {
this.userId = treeNode.id
},
selectAll () {
let processId = this.$route.params.id
let processNumber = this.$route.params.processNumber
window.open('/api/activiti/busProcess/exportTaskInfos?id=' + processId + '&taskName=' + this.taskNames + '&processNumber=' + processNumber)
},
/**
* @description: 流程催办
* @author: chenxiaoxi
* @date: 2018/10/11 13:41:45
*/
urge (row) {
this.$http.postData('person/personMsg/saveNew',
{
msgContent: '流程编号为' + row.prcNum + '的流程,请尽快办理。',
msgTitle: '流程编号' + row.prcNum,
userId: row.assigneeId,
msgType: 'TEXT'
},
{
loading: 'loading',
_this: this
}, res => {
this.clearanceCondition()
this.processTable()
this.$message.success('催办成功')
}, e => {
})
back () {
this.$router.push({
path: '/userCenter/processCenter',
query: {
id:'AEHJB8YNJ3',
tabsName: "fourth"
}
})
//要返回上一级
},
// 请求转换流程图
processNum (row) {
@@ -302,170 +163,18 @@ export default {
sortWord: this.shunxu ? this.paixu : '',
shunxu: this.shunxu
}).then(res=>{
this.detailData = [{name:1},{name:1},{name:1},]
res[res.length - 1].endTime ? this.urgeRowFlag = false : this.urgeRowFlag = true
this.detailData = [{name:1,state:'1'},{name:1},{name:1},]
// res[res.length - 1].endTime ? this.urgeRowFlag = false : this.urgeRowFlag = true
})
},
// 导出事件
exportStandard () {
let ids = []
let exportName = []
// if (this.tableRow.length > 0) {
// this.tableRow.map(item => {
// ids.push(item.id)
// })
// } else {
// this.detailData.map(item => {
// ids.push(item.id)
// })
// }
this.processTypeList.map(item => {
if(item.value == this.detailData[0].prcType){
exportName = item.label
}
})
this.$http.downGetFun('lawss/activiti/historyExport', {
prcNum: this.$route.query.prcNum,
sortWord: this.shunxu ? this.paixu : '',
shunxu: this.shunxu,
exportName: exportName
}, {_this: this},data=>{
const disposition = data.headers['content-disposition'];
let fileName = disposition.substring(disposition.indexOf('fileName=') + 9, disposition.length);
var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
var isOpera = userAgent.indexOf("Opera") > -1;
//判断是否IE浏览器
if (userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera) {
fileName = decodeUtf8(fileName)
} else {
// iso8859-1的字符转换成中文
fileName = decodeURI(escape(fileName));
// 去掉双引号
fileName = fileName.replace(/\"/g, "");
}
// console.log(fileName, 666)
function decodeUtf8(bytes) {
var encoded = "";
for (var i = 0; i < bytes.length; i++) {
encoded += '%' + bytes[i].toString(16);
}
return decodeURIComponent(encoded);
}
if (!data.data || data.data.size === 0) {
this.$message.warning("文件下载失败")
return
}
if (typeof window.navigator.msSaveBlob !== 'undefined') {
window.navigator.msSaveBlob(new Blob([data.data], {type: 'application/zip'}), fileName)
} else {
let url = window.URL.createObjectURL(new Blob([data.data], {type: 'application/zip'}))
let link = document.createElement('a')
link.style.display = 'none'
link.href = url
link.setAttribute('download', fileName)
document.body.appendChild(link)
link.click()
document.body.removeChild(link) //下载完成移除元素
window.URL.revokeObjectURL(url) //释放掉blob对象
}
})
// window.location.href = '/api/lawss/activiti/historyExport?sortWord=' + this.shunxu ? this.paixu : '' + '&exportName=' + exportName + '&prcNum=' + this.$route.query.prcNum + '&shunxu=' + this.shunxu
// this.$message.success('导出文件成功')
},
// 表格排序
sortChange (sortObj) {
if (sortObj.column.order !== 'normal') {
this.shunxu = ''
this.paixu = ''
let order = sortObj.column.order
switch (sortObj.column.property) {
// 任务步骤
case 'name' :
// 后台联调
this.paixu = 'name'
if (order === 'ascending'){
this.shunxu = 'asc'
} else if (order === 'descending') {
this.shunxu = 'desc'
}
break
// 任务受理人
case 'assignee' :
// 后台联调
this.paixu = 'assignee'
if (order === 'ascending'){
this.shunxu = 'asc'
} else if (order === 'descending') {
this.shunxu = 'desc'
}
break
// 创建时间
case 'createTime' :
// 后台联调
this.paixu = 'startTime'
if (order === 'ascending'){
this.shunxu = 'asc'
} else if (order === 'descending') {
this.shunxu = 'desc'
}
break
}
}
this.processTable()
},
queryFlowRelInfoByFlowNum(){
this.$http.postData('lawss/activiti/queryFlowRelInfoByFlowNum', {
flowNum: this.$route.query.prcNum,
flowType: 82
}, {
loading: 'loading',
_this: this
}, res => {
if (res.success){
this.processNum(res.result)
this.processTable(res.result)
}
}, e => {})
},
},
components: {
monitorModal
},
props: {},
computed: {
listNoDataText () {
return this.processType === 1 ? '暂无待办流程' : '暂无已办流程'
},
urgeRowMenu () {
let flag = false
this.$store.getters.getMenuList.map((menu) => {
if (menu.id === 'ZDE6GT7UG5' || this.loginPeople === this.$store.getters.userInfo.userId) {
flag = true
}
})
return flag
},
/**
* 调整处理人按钮是否显示
*/
tzclrEnable() {
return this.$route.query.tabsName === 'MonitorProcess'
}
},
watch: {},
beforeUpdate () {
if (this.detailData.length > 0) {
sessionStorage.setItem('processInstance', JSON.stringify(this.detailData[0]))
}
},
mounted () {
if (this.$route.query.prcType == 82){
this.queryFlowRelInfoByFlowNum()
} else{
this.processNum()
this.processTable()
}
}
}
</script>
@@ -523,4 +232,15 @@ export default {
align-items: center;
}
}
.back{
width: 45px;
height: 45px;
background: #1890FF;
color: #fff;
text-align: center;
line-height: 45px;
font-size: 30px;
font-weight: 700;
cursor: pointer;
}
</style>
@@ -1,13 +1,15 @@
<template>
<div>
<el-dialog title="调整处理人" :visible.sync="dialogVisible" :before-close="handleClose">
<div class="form-container">
<el-form ref="form" :model="form" label-width="80px" :rules="rules">
<el-form-item label="选择人员" prop="select" >
<el-select v-model="form.select" placeholder="请选择调整处理人">
<el-option label="张三" value="1"></el-option>
<el-option label="李四" value="2"></el-option>
</el-select>
<el-dialog title="调整处理人" :visible.sync="dialogVisible" width="500px">
<div class="label-input-form addModel">
<el-form ref="form" :model="form" label-width="120px" :rules="rules" class="formData">
<el-form-item label="选择人员" prop="assignee" class="el-form-item">
<el-select v-model="form.assignee" class="icon-auth" collapse-tags
placeholder="请选择">
<template v-for="item in userList">
<el-option :label="item.USNAME" :value="item.USID" :key="item.USID"></el-option>
</template>
</el-select>
</el-form-item>
</el-form>
</div>
@@ -24,72 +26,89 @@ export default {
name: 'modal',
data() {
return {
userList: [],
dialogVisible: false,
form: {},
form: {
assignee:''
},
rules: {
select: [
{
required: 'true',
trigger: 'change',
message: '请选择调整处理人'
}
assignee: [
{
required: 'true',
trigger: 'change',
message: '请选择调整处理人'
}
]
}
},
taskId:''
};
},
mounted() {
this.sysUserList()
},
methods: {
handleClose() {
this.dialogVisible = true
},
open() {
this.form.name
this.dialogVisible = true
},
submit() {
this.$refs.form.validate((valid) => {
if (valid) {
alert(11)
this.dialogVisible = false
}
})
changeSelect(val) {
this.checked = (val.length || this.reportF.reportUserIdList.length) === this.userList.length;
// this.$emit('update:updateMultipleSelect',this.reportF.reportUserIdList);
},
// 获取所有用户
sysUserList() {
this.$api.user.sysUserList({ pageNo: 1, pageSize: 999999 }).then(({ data }) => {
this.userList = data.records;
})
},
open(taskId) {
this.taskId=taskId
this.form.name={
assignee:''
}
this.dialogVisible = true
},
submit() {
this.$refs.form.validate((valid) => {
if (valid) {
let userId=this.form.assignee
let assignee=this.$store.getters.userInfo.USID
this.$api.process.changeAssignee({
taskId:this.taskId.join(','),
assignee:assignee,
userId: userId,
pId:this.pId
})
.then(res=>{
//转办完应该跳到哪个页面?
//转办完这个人还能看到这个监控流程吗
this.dialogVisible = false
})
}
})
}
}
}
</script>
<style lang="scss" scoped>
.dialog-footer {
display: flex;
justify-content: center;
margin-bottom: 30px;
.dialog-footer{
margin: 20px 20px ;
.el-button {
width: 80px;
height: 36px;
padding: 0;
font-size: 14px;
}
}
::v-deep .el-dialog {
width: 600px;
::v-deep .el-dialog__footer{
padding-bottom: 20px;
}
::v-deep .el-dialog .el-dialog__body {
font-size: 50px;
height: 230px;
display: flex;
justify-content: center;
align-items: center;
.addModel{
padding: 20px;
}
::v-deep .el-input__inner {
height: 40px;
line-height: 40px;
.el-form-item{
::v-deep .el-select{
width: 300px;
vertical-align: center;
}
}
::v-deep .el-form-item--mini .el-form-item__label {
line-height: 40px !important;
}
::v-deep .btn {
width: 90px;
height: 40px;
border-radius: 30px;
margin-right: 30px;
}</style>
</style>
+16 -19
View File
@@ -2,16 +2,16 @@
<div>
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="待办流程" name="first">
<gencyProcess :firstData="firstData" v-if="activeName=='first'"></gencyProcess>
<gencyProcess v-if="activeName=='first'"></gencyProcess>
</el-tab-pane>
<el-tab-pane label="已办流程" name="second">
<finishProcess :secondData="secondData" v-if="activeName=='second'"></finishProcess>
<finishProcess v-if="activeName=='second'"></finishProcess>
</el-tab-pane>
<el-tab-pane label="已发流程" name="third">
<sentProcess :thirdData="thirdData" v-if="activeName=='third'"></sentProcess>
<sentProcess v-if="activeName=='third'"></sentProcess>
</el-tab-pane>
<el-tab-pane label="监控流程" name="fourth">
<monitorProcesses :fourthData="fourthData" v-if="activeName=='fourth'"></monitorProcesses>
<monitorProcesses v-if="activeName=='fourth'"></monitorProcesses>
</el-tab-pane>
</el-tabs>
</div>
@@ -46,27 +46,24 @@ export default {
};
},
watch: {
tableData(newValue, oldValue) {
if(this.activeName == 'first'){
this.firstData=newValue
}else if(this.activeName == 'second'){
this.secondData=newValue
}else if(this.activeName == 'third'){
this.thirdData=newValue
}else{
this.fourthData=newValue
}
}
},
created () {
;
},
mounted () {
;
let tabName=this.$route.query.tabsName?this.$route.query.tabsName:'first'
this.activeName=tabName
},
methods: {
handleClick(tab, event) {
this.$bus.$emit('clearForm')
this.$router.push({
path: '/userCenter/processCenter',
query: {
id:'AEHJB8YNJ3',
tabsName: this.activeName
}
})
this.$bus.$emit('clearForm')
}
}
}
@@ -74,4 +71,4 @@ export default {
<style lang="sass" scoped>
</style>
</style>