556 lines
20 KiB
Vue
556 lines
20 KiB
Vue
<template>
|
|
<div class="process">
|
|
<div class="process_box">
|
|
<process-header v-if="$route.query.isBegin || $route.query.isDraft" :title="'发起流程'"></process-header>
|
|
<process-header v-else-if="$route.query.type == 'yiban'" :title="'已办流程'" :proceesNum="prcNum"></process-header>
|
|
<process-header v-else :title="'发起人修改'" :proceesNum="prcNum"></process-header>
|
|
<div class="procedure">
|
|
<div class="process_content">
|
|
<span class="base_title">基础信息</span>
|
|
<el-form ref="processFormRef" :model="processForm" label-width="150px"
|
|
:rules="processFormRule" class="label-input-form" size="medium">
|
|
<el-row>
|
|
<el-col :span="9">
|
|
<el-form-item label="流程名称:" prop="prcName">
|
|
<el-input :disabled="formControl || formControlname" v-model="processForm.prcName"
|
|
placeholder="请输入流程名称"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
<el-row>
|
|
<report-table v-model="tableData" @updateTable="getV" :disabled="showTableD"></report-table>
|
|
</el-row>
|
|
<el-row>
|
|
<el-form ref="applicationFormRef" :model="applicationForm" label-width="150px"
|
|
class="label-input-form" size="medium" :rules="applicationFormRule"
|
|
>
|
|
<el-row>
|
|
<el-col :span="9">
|
|
<el-form-item label="申请原因:" prop="applyReason">
|
|
<el-input :disabled="formControl" type="textarea" v-model="applicationForm.applyReason"
|
|
placeholder="请输入申请原因"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="9" :offset="6">
|
|
<el-form-item label="选择申请权限:" prop="power">
|
|
<el-select :disabled="formControl" v-model="applicationForm.power" placeholder="请选择申请权限">
|
|
<el-option
|
|
v-for="item in PERMISSION"
|
|
:key="item.value"
|
|
:label="item.label"
|
|
:value="item.value">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
</el-row>
|
|
</div>
|
|
<div class="process_content" v-if="initShow">
|
|
<span class="base_title">审批历史</span>
|
|
<process-approval-history :prcNum="prcNum"></process-approval-history>
|
|
</div>
|
|
<div class="process_content">
|
|
<span class="base_title">指派信息</span>
|
|
<el-form ref="assignFormRef" :model="assignForm" label-width="150px"
|
|
:rules="assignFormRules" class="label-input-form" size="medium">
|
|
<el-row>
|
|
<el-col :span="9">
|
|
<el-form-item label="选择一级审批人员:" prop="oneApprove">
|
|
<el-input readonly :disabled="formControl" v-model="assignForm.oneApproveName"
|
|
@click.native="handleCheck('spr1')"
|
|
placeholder="请选择一级审批人员"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="9">
|
|
<el-form-item label="选择二级审批人员:" prop="twoApprove">
|
|
<el-input readonly :disabled="formControl" v-model="assignForm.twoApproveName"
|
|
@click.native="handleCheck('spr2')"
|
|
placeholder="请选择二级审批人员"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="24">
|
|
<el-form-item label="说明:" prop="remark">
|
|
<el-input type="textarea" :disabled="formControl" v-model="assignForm.remark" placeholder="请输入说明"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
</div>
|
|
</div>
|
|
<process-footer
|
|
v-if="!formControl"
|
|
showCancel
|
|
:show-save="isShowSave"
|
|
:show-submit="isShowSubmit"
|
|
:submitLoading="isSubmit"
|
|
:resetLoading="saveLoading"
|
|
@save="handleSave"
|
|
@submit="handleSubmit"
|
|
></process-footer>
|
|
<orgTable :visible.sync="visibleOrgTable" title="人员列表" dialog-model :config="{
|
|
value: orgTableVal,
|
|
valueName: orgTableValName
|
|
}" :workNumFlag="true" :maxSelected="1" @confirm="isTreeOk"></orgTable>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import processHeader from '@/components/ProcessHeader'
|
|
import processFooter from '@/components/ProcessFooter'
|
|
import processApprovalHistory from '@/components/ProcessApprovalHistory'
|
|
import reportTable from './components/reportTable'
|
|
import {PERMISSION} from '@/utils/Enum/enum'
|
|
import orgTable from '../../components/OrgTable'
|
|
import processMixin from "../../components/ProcessMixin";
|
|
|
|
export default {
|
|
name: 'launch',
|
|
components: {
|
|
processHeader,
|
|
reportTable,
|
|
processFooter,
|
|
processApprovalHistory,
|
|
orgTable
|
|
},
|
|
mixins: [processMixin],
|
|
data() {
|
|
return {
|
|
delData:[],
|
|
showTableD: false,
|
|
initShow: false, // 控制审批历史是否显示 只有在不是第一次的时候才是true
|
|
treeType: '',
|
|
orgTableVal: '',
|
|
orgTableValName: '',
|
|
visibleOrgTable: false,
|
|
isSubmit: false,
|
|
saveLoading: false,
|
|
isShowSave: false,
|
|
isShowSubmit: true,
|
|
formControl: false,
|
|
formControlname: false,
|
|
assignForm: {
|
|
oneApprove: '',
|
|
twoApprove: '',
|
|
twoApproveName: '',
|
|
oneApproveName: '',
|
|
remark:''
|
|
},
|
|
tableData: [],
|
|
applicationForm: {
|
|
applyReason: '',
|
|
power: ''
|
|
},
|
|
q: {
|
|
pageSize: 10000,
|
|
pageNo: 1
|
|
},
|
|
PERMISSION,
|
|
processForm: {
|
|
prcName: ''
|
|
},
|
|
processFormRule: {
|
|
prcName: [{
|
|
required: true,
|
|
message: '请输入流程名称',
|
|
trigger: 'change'
|
|
}, {
|
|
max: 100,
|
|
message: '流程名称最多填写100字符',
|
|
trigger: 'change'
|
|
}]
|
|
},
|
|
applicationFormRule: {
|
|
applyReason: [{
|
|
max: 500, message: '申请原因最多填写500字符'
|
|
}],
|
|
power: [{
|
|
required: true,
|
|
message: '请选择申请权限'
|
|
}]
|
|
},
|
|
assignFormRules: {
|
|
oneApprove: [{
|
|
required: true,
|
|
message: '请选择一级审批人员',
|
|
trigger: 'change'
|
|
}],
|
|
twoApprove: [{
|
|
required: true,
|
|
message: '请选择二级审批人员',
|
|
trigger: 'change'
|
|
}],
|
|
remark: [{
|
|
max: 500, message: '说明最多填写500字符'
|
|
}]
|
|
},
|
|
prcType: 1,
|
|
prcName:''
|
|
}
|
|
},
|
|
async created() {
|
|
// 第一次进入此页面 需要清楚校验
|
|
if (this.$route.query.isBegin) {
|
|
// if (this.$route.query.ids.split(',').length > 0) {
|
|
// this.reportList(this.$route.query.ids)
|
|
// }
|
|
this.isShowSave = true
|
|
this.$store.commit('setHandleProcess','')
|
|
this.handleReset()
|
|
}
|
|
// 如果是从草稿进入的
|
|
if (this.$route.query.isDraft) {
|
|
this.isShowSave = true
|
|
this.taskId = this.$store.getters.handleProcess?.taskId
|
|
this.prcNum = this.$store.getters.handleProcess?.prcNum
|
|
this.prcId = this.$store.getters.handleProcess?.prcId
|
|
this.prcName = this.$store.getters.handleProcess?.prcName
|
|
this.getDraftDetail().then(res => {
|
|
this.$set(this.processForm,'prcName', this.prcName)
|
|
let tableData = JSON.parse(this.processOld.dataJson)
|
|
this.$set(this.applicationForm,'power',tableData[0].power)
|
|
this.$set(this.applicationForm,'applyReason',tableData[0].applyReason)
|
|
if(tableData[0].reportId){
|
|
this.tableData=tableData
|
|
}
|
|
if(this.processOld.submitJson !== '{}'){
|
|
let submitJson=JSON.parse(this.processOld.submitJson)
|
|
this.$set(this.assignForm,'oneApprove',submitJson.oneApprove)
|
|
this.$set(this.assignForm,'oneApproveName',submitJson.oneApproveName)
|
|
this.$set(this.assignForm,'twoApprove',submitJson.twoApprove)
|
|
this.$set(this.assignForm,'twoApproveName',submitJson.twoApproveName)
|
|
this.$set(this.assignForm,'remark',submitJson.remark)
|
|
}
|
|
this.$nextTick(()=>{
|
|
this.$refs.processFormRef.clearValidate()
|
|
this.$refs.applicationFormRef.clearValidate()
|
|
this.$refs.assignFormRef.clearValidate()
|
|
})
|
|
})
|
|
|
|
}
|
|
if (this.$route.query.taskDefinitionKey == 'aid4' ) {
|
|
this.taskId = this.$store.getters.handleProcess.taskId
|
|
this.prcNum = this.$store.getters.handleProcess.prcNum
|
|
this.prcId = this.$store.getters.handleProcess.prcId
|
|
this.prcName = this.$store.getters.handleProcess.prcName
|
|
this.prcName = JSON.stringify(this.prcName)
|
|
this.initShow = true
|
|
this.formControlname = true
|
|
this.$set(this.processForm,'prcName',this.$route.query.prcName)
|
|
await this.getProcessDetail()
|
|
let submitJson = JSON.parse(this.processOld.submitJson)
|
|
// this.applicationForm.applyReason = applyReason.applyReason
|
|
this.tableData = JSON.parse(this.processOld.dataJson)
|
|
if(this.tableData.length>0){
|
|
this.$set(this.applicationForm,'power',this.tableData[0].power)
|
|
this.$set(this.applicationForm,'applyReason',this.tableData[0].applyReason)
|
|
}
|
|
this.$set(this.assignForm,'oneApprove',submitJson.oneApprove)
|
|
this.$set(this.assignForm,'oneApproveName',submitJson.oneApproveName)
|
|
this.$set(this.assignForm,'twoApprove',submitJson.twoApprove)
|
|
this.$set(this.assignForm,'twoApproveName',submitJson.twoApproveName)
|
|
this.$set(this.assignForm,'remark',submitJson.remark)
|
|
//指派信息
|
|
// ({oneApprove:this.assignForm.oneApprove,oneApproveName:this.assignForm.oneApproveName,twoApprove:this.assignForm.twoApprove,twoApproveName:this.assignForm.twoApproveName,remark:this.assignForm.remark}= JSON.parse(this.processOld.submitJson))
|
|
// this.getProcessDetail().then(res => {
|
|
// //基础信息
|
|
// let applyReason = JSON.parse(res.processOld.dataJson)
|
|
// res.tableData = JSON.parse(res.processOld.dataJson)
|
|
// res.applicationForm.power = res.tableData[0].power
|
|
// debugger
|
|
// res.applicationForm.applyReason = applyReason[0]?.applyReason
|
|
//
|
|
// //指派信息
|
|
// ({oneApprove:res.assignForm.oneApprove,oneApproveName:res.assignForm.oneApproveName,twoApprove:res.assignForm.twoApprove,twoApproveName:res.assignForm.twoApproveName,remark:res.assignForm.remark}= JSON.parse(res.processOld.submitJson))
|
|
// })
|
|
}
|
|
if (this.$route.query.type == 'yiban') {
|
|
this.taskId = this.$store.getters.handleProcess.taskId
|
|
this.prcNum = this.$store.getters.handleProcess.prcNum
|
|
this.prcId = this.$store.getters.handleProcess.prcId
|
|
this.prcName = this.$store.getters.handleProcess.prcName
|
|
this.formControl = true
|
|
this.initShow = true
|
|
this.showTableD = true
|
|
this.$set(this.processForm,'prcName', this.prcName)
|
|
this.getProcessDetail().then((res) => {
|
|
let submitJson = JSON.parse(this.processOld.submitJson)
|
|
// this.applicationForm.applyReason = applyReason.applyReason
|
|
this.tableData = JSON.parse(this.processOld.dataJson)
|
|
this.$set(this.applicationForm,'power',this?.tableData[0].power)
|
|
this.$set(this.applicationForm,'applyReason',this?.tableData[0].applyReason)
|
|
this.$set(this.assignForm,'oneApprove',submitJson.oneApprove)
|
|
this.$set(this.assignForm,'oneApproveName',submitJson.oneApproveName)
|
|
this.$set(this.assignForm,'twoApprove',submitJson.twoApprove)
|
|
this.$set(this.assignForm,'twoApproveName',submitJson.twoApproveName)
|
|
this.$set(this.assignForm,'remark',submitJson.remark)
|
|
})
|
|
}
|
|
},
|
|
methods: {
|
|
getV(newValue,jiaVlue)
|
|
{
|
|
debugger
|
|
if(jiaVlue &&jiaVlue.length > 0){
|
|
jiaVlue.forEach(item=>{
|
|
this.delData.push({
|
|
prcId:this.prcId,
|
|
reportId:item
|
|
})
|
|
})
|
|
|
|
this.$set(this,'delData',this.delData)
|
|
}
|
|
this.$set(this,'tableData',newValue)
|
|
// this.tableData=newValue;
|
|
// this.delData=jiaVlue
|
|
},
|
|
// 真删除接口
|
|
delDatas(){
|
|
|
|
return new Promise((resolve,reject)=>{
|
|
this.$api.permissionProcess.deletReport({powerApplyList:this.delData}).then(()=>{
|
|
resolve()
|
|
})
|
|
|
|
})
|
|
|
|
},
|
|
handleCheck(name) {
|
|
if (this.formControl) {
|
|
return false
|
|
}
|
|
this.treeType = name
|
|
this.orgTableVal = ''
|
|
this.orgTableValName = ''
|
|
if (name === 'spr1') {
|
|
this.orgTableVal = this.assignForm.oneApprove ? this.assignForm.oneApprove : ''
|
|
this.orgTableValName = this.assignForm.oneApproveName ? this.assignForm.oneApproveName : ''
|
|
} else {
|
|
this.orgTableVal = this.assignForm.twoApprove ? this.assignForm.twoApprove : ''
|
|
this.orgTableValName = this.assignForm.twoApproveName ? this.assignForm.twoApproveName : ''
|
|
}
|
|
this.visibleOrgTable = true
|
|
},
|
|
// 树点击
|
|
isTreeOk(checkedList) {
|
|
// console.log(checkedList)
|
|
const parts = []
|
|
const partsName = []
|
|
console.log(checkedList, '0009999')
|
|
checkedList.map((item, index) => {
|
|
parts.push(item.userId || item.USID)
|
|
partsName.push(item.uname)
|
|
})
|
|
this.qcrList = checkedList
|
|
if (this.treeType === 'spr1') {
|
|
this.assignForm.oneApprove = parts.toString()
|
|
this.assignForm.oneApproveName = partsName.toString()
|
|
} else if (this.treeType === 'spr2') {
|
|
this.assignForm.twoApprove = parts.toString()
|
|
this.assignForm.twoApproveName = partsName.toString()
|
|
}
|
|
// console.log(this.assignForm.name1Id, this.assignForm.name2Id)
|
|
},
|
|
// 获取表格列表 吧查询到的值传给子组件
|
|
reportList(ids) {
|
|
this.$api.permissionProcess.getReportLisy({
|
|
pageSize:1000,
|
|
pageNo:1,
|
|
ids: ids.split(',')
|
|
}).then(({data}) => {
|
|
this.tableData = data.records.map(item => {
|
|
item.reportId = item['id']
|
|
delete item['id']
|
|
return item
|
|
})
|
|
})
|
|
},
|
|
handleReset() {
|
|
this.processForm.prcName = ''
|
|
if(this.$route.query.taskDefinitionKey == 'aid4'){
|
|
this.processForm.prcName = this.prcName
|
|
}
|
|
this.applicationForm = {
|
|
applyReason: '',
|
|
power: ''
|
|
}
|
|
|
|
this.assignForm = {
|
|
oneApprove: '',
|
|
twoApprove: ''
|
|
}
|
|
this.$nextTick(() => {
|
|
this.$refs.applicationFormRef.clearValidate()
|
|
this.$refs.assignFormRef.clearValidate()
|
|
})
|
|
|
|
},
|
|
// 整理数据
|
|
organizeData() {
|
|
let userId = this.$store.getters.userInfo.usid
|
|
this.tableData = this.tableData.map(item => {
|
|
item = {...item, ...this.applicationForm, userId: userId}
|
|
return item
|
|
})
|
|
},
|
|
// 保存
|
|
handleSave(){
|
|
this.saveLoading = true
|
|
if(this.tableData.length > 0){
|
|
// 处理表格数据
|
|
this.organizeData()
|
|
}else{
|
|
this.tableData=[{...this.applicationForm}]
|
|
}
|
|
let submitJson = JSON.stringify({...this.assignForm, userId: this.$store.getters.userInfo.usid,approvalOpinion:this.assignForm.remark})
|
|
let dataJson = JSON.stringify(this.tableData)
|
|
let params = {
|
|
prcName: this.processForm.prcName,
|
|
userId: this.$store.getters.userInfo.usid,
|
|
prcType: this.prcType,
|
|
createUserName: this.$store.getters.userInfo.usname,
|
|
createUser: this.$store.getters.userInfo.usid,
|
|
submitJson,
|
|
dataJson,
|
|
id: this.$store.getters.handleProcess?.id
|
|
}
|
|
this.saveProcess(params).then(
|
|
()=>{
|
|
this.saveLoading = false
|
|
this.$message['success']('保存成功')
|
|
this.$router.push({
|
|
path: "/userCenter/processCenter",
|
|
query: {
|
|
id: 'AEHJB8YNJ3'
|
|
}
|
|
})
|
|
}
|
|
).catch(()=>{
|
|
this.saveLoading = false
|
|
})
|
|
},
|
|
// 提交
|
|
handleSubmit() {
|
|
console.log(this.$store.getters.userInfo.usid, " this.$store.getters.userInfo.USID")
|
|
this.$refs.assignFormRef.validate(v => {
|
|
this.$refs.applicationFormRef.validate(m => {
|
|
this.$refs.processFormRef.validate(async z => {
|
|
if (v && m && z) {
|
|
// 过了校验 需要把数据都整合 this.tableData this.applicationForm this.assignForm
|
|
// 表格数据没有不能提交 需要提示
|
|
if (this.tableData.length == 0) {
|
|
this.$message.warning('至少需要选择一条报告数据')
|
|
} else {
|
|
// 调用流程数据
|
|
console.log("发送数据")
|
|
// 处理表格数据
|
|
|
|
//如果不是第一次
|
|
if (this.initShow) {
|
|
let flag=await this.JuggleSub(this.taskId)
|
|
if(flag){
|
|
console.log(this.delData,"flagflagflagflag")
|
|
debugger
|
|
if(this.delData){
|
|
this.delDatas().then(()=>{
|
|
this.organizeData()
|
|
let dataJson = JSON.stringify(this.tableData)
|
|
let submitJson = JSON.stringify({...this.assignForm, userId: this.$store.getters.userInfo.usid,approvalOpinion:this.assignForm.remark})
|
|
this.completeProcess({
|
|
dataJson,
|
|
submitJson,
|
|
taskId: this.taskId,
|
|
userId: this.$store.getters.userInfo.usid,
|
|
prcType: this.prcType
|
|
})
|
|
})
|
|
}else{
|
|
this.organizeData()
|
|
let dataJson = JSON.stringify(this.tableData)
|
|
let submitJson = JSON.stringify({...this.assignForm, userId: this.$store.getters.userInfo.usid,approvalOpinion:this.assignForm.remark})
|
|
this.completeProcess({
|
|
dataJson,
|
|
submitJson,
|
|
taskId: this.taskId,
|
|
userId: this.$store.getters.userInfo.usid,
|
|
prcType: this.prcType
|
|
})
|
|
}
|
|
|
|
}
|
|
} else {
|
|
this.isSendDraft().then(()=>{
|
|
this.organizeData()
|
|
this.startProcess()
|
|
})
|
|
}
|
|
}
|
|
} else {
|
|
this.$message.warning('请检查表单填写完整')
|
|
}
|
|
})
|
|
})
|
|
})
|
|
},
|
|
//修改参数
|
|
changeParam() {
|
|
|
|
},
|
|
// 草稿发起 需要先调用这个接口
|
|
isSendDraft(){
|
|
let ids=this.tableData.map(item=>{
|
|
return item.reportId
|
|
})
|
|
return new Promise((resolve,reject)=>{
|
|
this.$api.permissionProcess.selectReport({ids:ids}).then((res)=>{
|
|
if(res.data.length==0){
|
|
resolve(true)
|
|
}else{
|
|
this.$message.warning("报告"+res.data.join(',')+"已经在流程中")
|
|
reject()
|
|
}
|
|
|
|
})
|
|
})
|
|
},
|
|
startProcess() {
|
|
//把表单都整合到form中
|
|
// dataJson与submitJson需要发到completeProcess
|
|
let form = {}
|
|
form = {
|
|
approveData: {
|
|
...this.applicationForm, ...this.processForm, ...this.assignForm,
|
|
userId: this.$store.getters.userInfo.usid
|
|
}, dataMsg: this.tableData
|
|
}
|
|
form.approvalOpinion = this.assignForm.remark
|
|
form.prcType = this.prcType
|
|
form.prcName = this.processForm.prcName
|
|
form.userId = this.$store.getters.userInfo.usid
|
|
form.bpnId = this.$store.getters.handleProcess?.id
|
|
//...this.applicationForm,...this.processForm,
|
|
let dataJson = JSON.stringify(this.tableData)
|
|
let submitJson = JSON.stringify({...this.assignForm, userId: this.$store.getters.userInfo.usid,approvalOpinion:this.assignForm.remark})
|
|
this.$api.process.startProcess(form).then(({data}) => {
|
|
this.completeProcess({dataJson, submitJson, taskId: data.result, userId: form.userId, prcType: this.prcType})
|
|
})
|
|
},
|
|
//获取流程详细信息
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
</style>
|