初始化

This commit is contained in:
2025-07-28 15:52:07 +08:00
commit cd0e77b332
1304 changed files with 302802 additions and 0 deletions

View File

@@ -0,0 +1,700 @@
<template>
<div class="app-container">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span class="el-icon-document">待办任务</span>
<el-tag style="margin-left: 10px">发起人:{{ startUser }}</el-tag>
<el-tag>任务节点:{{ taskName }}</el-tag>
<el-button style="float: right" size="mini" type="danger" @click="goBack">关闭</el-button>
</div>
<el-tabs tab-position="top" v-model="activeName" @tab-click="handleClick">
<!--表单信息-->
<el-tab-pane label="表单信息" name="1">
<el-col :span="16" :offset="4">
<div class="">
<!-- 退学 -->
<el-descriptions class="margin-top" title="" :column="3" size="medium" border style="width: 100%" v-if="disqualificationForm">
<el-descriptions-item>
<template slot="label"> 学号 </template>
{{ form.stuNo }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 姓名 </template>
{{ form.stuName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 辅导员 </template>
{{ form.applicantName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 性别 </template>
{{ form.gender }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 院部 </template>
{{ form.departmentName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 年级 </template>
{{ form.gradeName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 班级 </template>
{{ form.className }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 籍贯/自治区/直辖市 </template>
{{ form.jg }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 辅导员 </template>
{{ form.applicantName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 退学类别 </template>
{{ quitSchoolMethodFormat(form) }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 附件上传 </template>
<Affix v-model="form.attachmentUpload" :disabled="true"></Affix>
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 辅导员联系情况 </template>
{{ form.ideologicalEducation }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 在校时间说明 </template>
{{ form.instructionSchoolHours }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 退学文号 </template>
{{ form.reentryNumber }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 注销类型 </template>
{{ quitSchoolMethodFormat(form) }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 退学年份 </template>
{{ reentryYearMethodFormat(form) }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 退学下文 </template>
{{ form.dropOutGLKSHGDShow }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 备注 </template>
{{ form.remark }}
</el-descriptions-item>
</el-descriptions>
<!-- 给予退学 -->
</div>
<div style="margin-left: 15%; margin-bottom: 20px; font-size: 14px; margin-top: 20px">
<el-button v-if="!formKeyExist" icon="el-icon-edit-outline" type="success" size="mini" @click="handleComplete">同意 </el-button>
<!-- <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleDelegate">委派</el-button>-->
<!-- <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleAssign">转办</el-button>-->
<!-- <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleDelegate">签收</el-button>-->
<el-button icon="el-icon-refresh-left" type="warning" v-if="rejectBtn" size="mini" @click="handleReturn">退回</el-button>
<el-button icon="el-icon-circle-close" type="danger" v-if="rejectBtn" size="mini" @click="handleReject">驳回</el-button>
</div>
</el-col>
</el-tab-pane>
<!--流程流转记录-->
<el-tab-pane label="流转记录" name="2">
<!--flowRecordList-->
<el-col :span="16" :offset="4">
<div class="block">
<el-timeline>
<el-timeline-item v-for="(item, index) in flowRecordList" :key="index" :icon="setIcon(item.finishTime)" :color="setColor(item.finishTime)">
<p style="font-weight: 700">{{ item.taskName }}</p>
<el-card :body-style="{ padding: '10px' }">
<el-descriptions class="margin-top" :column="1" size="small" border>
<el-descriptions-item v-if="item.assigneeName" label-class-name="my-label">
<template slot="label"><i class="el-icon-user"></i>办理人</template>
{{ item.assigneeName }}
<el-tag type="info" size="mini">{{ item.deptName }}</el-tag>
</el-descriptions-item>
<el-descriptions-item v-if="item.candidate" label-class-name="my-label">
<template slot="label"><i class="el-icon-user"></i>候选办理</template>
{{ item.candidate }}
</el-descriptions-item>
<el-descriptions-item label-class-name="my-label">
<template slot="label"><i class="el-icon-date"></i>接收时间</template>
{{ item.createTime }}
</el-descriptions-item>
<el-descriptions-item v-if="item.finishTime" label-class-name="my-label">
<template slot="label"><i class="el-icon-date"></i>处理时间</template>
{{ item.finishTime }}
</el-descriptions-item>
<el-descriptions-item v-if="item.duration" label-class-name="my-label">
<template slot="label"><i class="el-icon-time"></i>耗时</template>
{{ item.duration }}
</el-descriptions-item>
<el-descriptions-item v-if="item.comment" label-class-name="my-label">
<template slot="label"><i class="el-icon-tickets"></i>处理意见</template>
{{ item.comment.comment }}
</el-descriptions-item>
</el-descriptions>
</el-card>
</el-timeline-item>
</el-timeline>
</div>
</el-col>
</el-tab-pane>
<!--流程图-->
<el-tab-pane label="流程图" name="3">
<flow :flowData="flowData" />
</el-tab-pane>
</el-tabs>
<!--审批任务-->
<el-dialog :title="completeTitle" class="certificate-service" :visible.sync="completeOpen" width="60%" append-to-body>
<el-button @click="fileUpload" type="danger">下载退学下文</el-button>
<el-form ref="taskForm" :model="taskForm" :rules="rules" label-width="130px">
<el-form-item prop="targetKey">
<flow-user v-if="checkSendUser" :checkType="checkType" @handleUserSelect="handleUserSelect"></flow-user>
<flow-role v-if="checkSendRole" @handleRoleSelect="handleRoleSelect"></flow-role>
</el-form-item>
<!-- 退学表单学生教育管理科审核归档 -->
<el-form-item label="退学文号" prop="reentryNumber" v-if="dropOutGLKSHGDShow">
<el-input v-model="taskForm.reentryNumber" placeholder="请输入退学文号" />
</el-form-item>
<el-form-item label="注销类型" prop="disqualificatioType" v-if="dropOutGLKSHGDShow">
<el-select v-model="taskForm.disqualificatioType" placeholder="请选择注销类型">
<el-option v-for="dict in dict.type.rt_logout_type" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item label="退学年份" prop="reentryYear" v-if="dropOutGLKSHGDShow">
<el-select clearable v-model="taskForm.reentryYear" placeholder="请选择退学年份">
<el-option v-for="dict in dict.type.sys_teacher_kpi_filling_year" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item label="退学下文" v-if="dropOutGLKSHGDShow" prop="ihandlingSuggestion">
<file-upload v-model="taskForm.ihandlingSuggestion" :disabled="true" />
</el-form-item>
<el-form-item label="备注" prop="remark" v-if="dropOutGLKSHGDShow">
<el-input v-model="taskForm.remark" placeholder="请输入备注" type="textarea" rows="3" />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="completeOpen = false"> </el-button>
<el-button type="primary" @click="taskComplete"> </el-button>
</span>
</el-dialog>
<!--退回流程-->
<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-item label="退回意见" prop="comment" :rules="[{ required: true, message: '请输入意见', trigger: 'blur' }]">
<el-input style="width: 50%" type="textarea" v-model="taskForm.comment" placeholder="请输入意见" />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="returnOpen = false"> </el-button>
<el-button type="primary" @click="taskReturn"> </el-button>
</span>
</el-dialog>
<!--驳回流程-->
<el-dialog :title="rejectTitle" :visible.sync="rejectOpen" width="40%" append-to-body>
<el-form ref="taskForm" :model="taskForm" label-width="80px">
<el-form-item label="驳回意见" prop="comment" :rules="[{ required: true, message: '请输入意见', trigger: 'blur' }]">
<el-input style="width: 50%" type="textarea" v-model="taskForm.comment" placeholder="请输入意见" />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="rejectOpen = false"> </el-button>
<el-button type="primary" @click="taskReject"> </el-button>
</span>
</el-dialog>
</el-card>
</div>
</template>
<script>
import { flowXmlAndNode, getProcessVariables } from '@/api/flowable/definition'
import { flowRecord } from '@/api/flowable/finished'
import { complete, delegate, flowTaskForm, getNextFlowNode, rejectTask, returnList, returnTask } from '@/api/flowable/todo'
import { getRtStuDisqualificationByProcInsId, updateDisqualification } from '@/api/routine/disqualification'
import FlowRole from '@/components/flow/Role'
import FlowUser from '@/components/flow/User'
import Parser from '@/components/parser/Parser'
import download from '@/plugins/download'
import { checkRole } from '@/utils/permission'; // 权限判断函数
import flow from '@/views/flowable/task/todo/detail/flow'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import pdf from 'vue-pdf'
export default {
name: 'DisqualificationIndex',
dicts: ['rt_penalty_type', 'rt_penalty_status', 'rt_quit_type', 'sys_teacher_kpi_filling_year', 'rt_logout_type'],
components: {
Parser,
flow,
FlowUser,
FlowRole,
pdf,
},
props: {},
data() {
return {
// 模型xml数据
xmlData: '',
flowData: {},
activeName: '1',
// 部门名称
deptName: undefined,
// 部门树选项
// 用户表格数据
userList: null,
defaultProps: {
children: 'children',
label: 'label',
},
// 查询参数
queryParams: {
deptId: undefined,
},
// 遮罩层
loading: true,
flowRecordList: [], // 流程流转数据
formConfCopy: {},
src: null,
rules: {
reentryNumber: [{ required: true, message: '请输入退学文号', trigger: 'blur' }],
disqualificatioType: [{ required: true, message: '请选择注销类型', trigger: 'blur' }],
reentryYear: [{ required: true, message: '请选择退学年份', trigger: 'blur' }],
ihandlingSuggestion: [{ required: true, message: '请上传退学下文', trigger: 'blur' }],
}, // 表单校验
variablesForm: {}, // 流程变量数据
taskForm: {
returnTaskShow: false, // 是否展示回退表单
delegateTaskShow: false, // 是否展示回退表单
defaultTaskShow: true, // 默认处理
comment: '', // 意见内容
procInsId: '', // 流程实例编号
instanceId: '', // 流程实例编号
deployId: '', // 流程定义编号
taskId: '', // 流程任务编号
procDefId: '', // 流程编号
targetKey: '',
variables: {
variables: {},
},
penaltyNumber: '',
letterServiceContent: '',
violationDate: '',
relieveNumber: '',
dispositionServiceContent: '',
ideologicalEducation: '',
},
assignee: null,
formConf: {}, // 默认表单数据
variables: [], // 流程变量数据
variablesData: {}, // 流程变量数据
returnTaskList: [], // 回退列表数据
completeTitle: null,
completeOpen: false,
returnTitle: null,
returnOpen: false,
rejectOpen: false,
rejectTitle: null,
userData: [],
checkSendUser: false, // 是否展示人员选择模块
checkSendRole: false, // 是否展示角色选择模块
checkType: 'single', // 选择类型
taskName: null, // 任务节点
startUser: null, // 发起人信息,
multiInstanceVars: '', // 会签节点
formKeyExist: false, // 当前节点是否存在表单
// 表单参数:目前是考勤表单
form: {},
// 学生基础信息
stuInfo: {},
baseUrl: process.env.VUE_APP_BASE_API,
category: null, // 流程分类
disqualificationForm: false, // 退学申请表单
dropOutShow: false, // 退学申请输入框显示
dropOutGLKSHGDShow: false, // 学生退学教育管理科审核归档
rejectBtn: true, //驳回按钮
dispositionServiceContent: '', //处分下文
pdfURL: '', // pdf路径
letterServiceContent: '', // 送达书文字
showFileDowload: false, //是否显示下载下文
quitTypeOptions: [], //退学类别
}
},
created() {
if (this.$route.query) {
this.taskName = this.$route.query.taskName
this.startUser = this.$route.query.startUser
this.taskForm.deployId = this.$route.query.deployId
this.taskForm.taskId = this.$route.query.taskId
this.taskForm.procInsId = this.$route.query.procInsId
this.taskForm.executionId = this.$route.query.executionId
this.taskForm.instanceId = this.$route.query.procInsId
this.category = this.$route.query.category
// 如果任务名是其中的两个,则改变审批意见的输入框内容
if (this.category == 'disqualification') {
this.disqualificationForm = true
this.getRtStuDisqualificationByProcInsId(this.taskForm.procInsId)
if (this.taskName == '学生教育管理科审批归档') {
this.dropOutGLKSHGDShow = true
}
}
if (this.taskName == '学生接收' || (this.taskName == '辅导员接收' && this.category == 'disqualification')) {
this.showFileDowload = true
}
// 流程任务获取变量信息
if (this.taskForm.taskId) {
this.processVariables(this.taskForm.taskId)
this.getFlowTaskForm(this.taskForm.taskId)
}
this.getFlowRecordList(this.taskForm.procInsId, this.taskForm.deployId)
this.rejectBtn = !checkRole(['teststu'])
}
},
methods: {
reentryYearMethodFormat(row, column) {
return this.selectDictLabel(this.dict.type.sys_teacher_kpi_filling_year, row.reentryYear)
},
penaltyTypeMethodFormat(row, column) {
return this.selectDictLabel(this.dict.type.rt_penalty_type, row.penaltyType)
},
quitSchoolMethodFormat(row, column) {
return this.selectDictLabel(this.dict.type.rt_logout_type, row.disqualificatioType)
},
// 查询退学表单信息
getRtStuDisqualificationByProcInsId(procInsId) {
getRtStuDisqualificationByProcInsId(procInsId).then((res) => {
this.form = res.data
this.pdfURL = this.baseUrl + this.form.ihandlingSuggestion
})
},
handleClick(tab, event) {
if (tab.name === '3') {
flowXmlAndNode({ procInsId: this.taskForm.procInsId, deployId: this.taskForm.deployId }).then((res) => {
this.flowData = res.data
})
}
},
setIcon(val) {
if (val) {
return 'el-icon-check'
} else {
return 'el-icon-time'
}
},
setColor(val) {
if (val) {
return '#2bc418'
} else {
return '#b3bdbb'
}
},
// 用户信息选中数据
handleUserSelect(selection) {
if (selection) {
if (selection instanceof Array) {
const selectVal = selection.map((item) => item.userId)
if (this.multiInstanceVars) {
this.$set(this.taskForm.variables, this.multiInstanceVars, selectVal)
} else {
this.$set(this.taskForm.variables, 'approval', selectVal.join(','))
}
} else {
this.$set(this.taskForm.variables, 'approval', selection.userId.toString())
}
}
},
// 角色信息选中数据
handleRoleSelect(selection) {
if (selection) {
if (selection instanceof Array) {
const selectVal = selection.map((item) => item.roleId)
this.$set(this.taskForm.variables, 'approval', selectVal.join(','))
} else {
this.$set(this.taskForm.variables, 'approval', selection)
}
}
},
/** 流程流转记录 */
getFlowRecordList(procInsId, deployId) {
const that = this
const params = { procInsId: procInsId, deployId: deployId }
flowRecord(params)
.then((res) => {
that.flowRecordList = res.data.flowList
})
.catch((res) => {
this.goBack()
})
},
fillFormData(form, data) {
form.fields.forEach((item) => {
const val = data[item.__vModel__]
if (val) {
item.__config__.defaultValue = val
}
})
},
/** 获取流程变量内容 */
processVariables(taskId) {
if (taskId) {
// 提交流程申请时填写的表单存入了流程变量中后续任务处理时需要展示
getProcessVariables(taskId).then((res) => {
this.variablesData = res.data.variables
})
}
},
/** 流程节点表单 */
getFlowTaskForm(taskId) {
if (taskId) {
// 提交流程申请时填写的表单存入了流程变量中后续任务处理时需要展示
flowTaskForm({ taskId: taskId }).then((res) => {
this.variablesData = res.data.formData
this.taskForm.variables = res.data.formData
this.formKeyExist = res.data.formKeyExist
})
}
},
/** 加载审批任务弹框 */
handleComplete() {
// this.completeOpen = true;
// this.completeTitle = "流程审批";
this.submitForm(null)
},
/** 用户审批任务 */
taskComplete() {
// if (!this.taskForm.variables && this.checkSendUser) {
// this.$modal.msgError('请选择流程接收人员!')
// return
// }
// if (!this.taskForm.variables && this.checkSendRole) {
// this.$modal.msgError('请选择流程接收角色组!')
// return
// }
this.$refs['taskForm'].validate((valid) => {
if (valid) {
this.$modal.loading('正在努力加载中,请稍等。。。')
this.taskForm.comment = '同意'
// 流程设计人员类型配置为固定人员接收任务时,直接提交任务到下一步
complete(this.taskForm).then((response) => {
if (this.taskName == '学生教育管理科审批归档' && this.category == 'disqualification') {
// 学生教育管理科审核,赋值
this.form.reentryNumber = this.taskForm.reentryNumber
this.form.disqualificatioType = this.taskForm.disqualificatioType
this.form.reentryYear = this.taskForm.reentryYear
this.form.ihandlingSuggestion = this.taskForm.ihandlingSuggestion
this.form.remark = this.taskForm.remark
this.updateDisqualification()
} else {
this.$modal.msgSuccess(response.msg)
}
this.$modal.closeLoading()
this.goBack()
})
}
})
},
updateDisqualification() {
updateDisqualification(this.form).then((response) => {
this.$modal.msgSuccess(response.msg)
})
},
/** 委派任务 */
handleDelegate() {
this.taskForm.delegateTaskShow = true
this.taskForm.defaultTaskShow = false
},
handleAssign() {},
/** 返回页面 */
goBack() {
// 关闭当前标签页并返回上个页面
const obj = { path: '/task/todo', query: { t: Date.now() } }
console.log(obj)
this.$tab.closeOpenPage(obj)
},
/** 驳回任务 */
handleReject() {
this.rejectOpen = true
this.rejectTitle = '驳回流程'
},
/** 驳回任务 */
taskReject() {
this.$refs['taskForm'].validate((valid) => {
if (valid) {
rejectTask(this.taskForm).then((res) => {
this.$modal.msgSuccess(res.msg)
this.goBack()
})
}
})
},
/** 可退回任务列表 */
handleReturn() {
this.returnOpen = true
this.returnTitle = '退回流程'
returnList(this.taskForm).then((res) => {
this.returnTaskList = res.data
this.taskForm.variables = null
})
},
/** 提交退回任务 */
taskReturn() {
this.$refs['taskForm'].validate((valid) => {
if (valid) {
returnTask(this.taskForm).then((res) => {
this.$modal.msgSuccess(res.msg)
this.goBack()
})
}
})
},
/** 取消回退任务按钮 */
cancelTask() {
this.taskForm.returnTaskShow = false
this.taskForm.defaultTaskShow = true
this.returnTaskList = []
},
/** 委派任务 */
submitDeleteTask() {
this.$refs['taskForm'].validate((valid) => {
if (valid) {
delegate(this.taskForm).then((response) => {
this.$modal.msgSuccess(response.msg)
this.goBack()
})
}
})
},
/** 取消回退任务按钮 */
cancelDelegateTask() {
this.taskForm.delegateTaskShow = false
this.taskForm.defaultTaskShow = true
this.returnTaskList = []
},
/** 申请流程表单数据提交 */
submitForm(formData) {
// 根据当前任务或者流程设计配置的下一步节点 todo 暂时未涉及到考虑网关、表达式和多节点情况
const params = { taskId: this.taskForm.taskId }
getNextFlowNode(params).then((res) => {
const data = res.data
this.taskForm.formData = formData
// if (data) {
// if (data.dataType === 'dynamic') {
// if (data.type === 'assignee') { // 指定人员
// this.checkSendUser = true;
// this.checkType = "single";
// } else if (data.type === 'candidateUsers') { // 候选人员(多个)
// this.checkSendUser = true;
// this.checkType = "multiple";
// } else if (data.type === 'candidateGroups') { // 指定组(所属角色接收任务)
// this.checkSendRole = true;
// } else { // 会签
// // 流程设计指定的 elementVariable 作为会签人员列表
// this.multiInstanceVars = data.vars;
// this.checkSendUser = true;
// this.checkType = "multiple";
// }
// }
// }
this.completeOpen = true
this.completeTitle = '流程审批'
})
},
fileUpload() {
download.resource(this.pdfURL)
},
},
}
</script>
<style lang="scss" scoped>
.test-form {
margin: 15px auto;
width: 800px;
padding: 15px;
}
.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;
}
.my-label {
background: #e1f3d8;
}
.indented-text {
text-indent: 1em;
}
.gongzhang {
margin-right: 10px;
margin-bottom: 10px;
position: relative;
}
.gongzhang img {
position: absolute;
top: -20px;
/* 根据需要调整图片的垂直位置 */
left: 0;
/* 根据需要调整图片的水平位置 */
}
.gongzhang p {
margin-top: 20px;
/* 根据需要调整两个 p 标签之间的垂直距离 */
}
.certificate-service {
.desc {
text-indent: 2em;
}
.stamp {
text-align: right;
& > div {
margin-top: -70px;
margin-right: 25px;
}
img {
width: 120px;
height: 120px;
}
}
}
</style>

View File

@@ -0,0 +1,730 @@
<template>
<div class="app-container">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span class="el-icon-document">待办任务</span>
<el-tag style="margin-left: 10px">发起人:{{ startUser }}</el-tag>
<el-tag>任务节点:{{ taskName }}</el-tag>
<el-button style="float: right" size="mini" type="danger" @click="goBack">关闭</el-button>
</div>
<el-tabs tab-position="top" v-model="activeName" @tab-click="handleClick">
<!--表单信息-->
<el-tab-pane label="表单信息" name="1">
<el-col :span="16" :offset="4">
<div class="">
<!-- 退学 -->
<el-descriptions class="margin-top" title="" :column="3" size="medium" border style="width: 100%" v-if="dropOutForm">
<el-descriptions-item>
<template slot="label"> 学号 </template>
{{ form.stuNo }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 姓名 </template>
{{ form.stuName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 性别 </template>
{{ form.gender }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 院部 </template>
{{ form.departmentName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 年级 </template>
{{ form.gradeName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 班级 </template>
{{ form.className }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 出生日期 </template>
{{ form.birthday }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 家长姓名 </template>
{{ form.parentName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 家长电话 </template>
{{ form.parentPhone }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 民族 </template>
{{ form.mz }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 籍贯/自治区/直辖市 </template>
{{ form.jg }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 退学类型 </template>
{{ quitSchoolMethodFormat(form) }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 附件上传 </template>
<Affix v-model="form.attachmentUpload" :disabled="true"></Affix>
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 申请原因 </template>
{{ form.reasonApplying }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 签名 </template>
<img v-if="form.applySignature" :src="baseUrl + form.applySignature" width="200px" height="200px" class="avatar" />
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 辅导员联系情况 </template>
{{ form.ideologicalEducation }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 在校时间说明 </template>
{{ form.instructionSchoolHours }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 退学文号 </template>
{{ form.quitNumber }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 退学类别 </template>
{{ quitSchoolCategoryMethodFormat(form) }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 退学年份 </template>
{{ form.quitYear }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 备注 </template>
{{ form.remark }}
</el-descriptions-item>
</el-descriptions>
<!-- 复学 -->
<!-- 给予退学 -->
</div>
<div style="margin-left: 15%; margin-bottom: 20px; font-size: 14px; margin-top: 20px">
<el-button v-if="!formKeyExist" icon="el-icon-edit-outline" type="success" size="mini" @click="handleComplete">同意 </el-button>
<!-- <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleDelegate">委派</el-button>-->
<!-- <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleAssign">转办</el-button>-->
<!-- <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleDelegate">签收</el-button>-->
<el-button icon="el-icon-refresh-left" type="warning" v-if="rejectBtn" size="mini" @click="handleReturn">退回</el-button>
<el-button icon="el-icon-circle-close" type="danger" v-if="rejectBtn" size="mini" @click="handleReject">驳回</el-button>
</div>
</el-col>
</el-tab-pane>
<!--流程流转记录-->
<el-tab-pane label="流转记录" name="2">
<!--flowRecordList-->
<el-col :span="16" :offset="4">
<div class="block">
<el-timeline>
<el-timeline-item v-for="(item, index) in flowRecordList" :key="index" :icon="setIcon(item.finishTime)" :color="setColor(item.finishTime)">
<p style="font-weight: 700">{{ item.taskName }}</p>
<el-card :body-style="{ padding: '10px' }">
<el-descriptions class="margin-top" :column="1" size="small" border>
<el-descriptions-item v-if="item.assigneeName" label-class-name="my-label">
<template slot="label"><i class="el-icon-user"></i>办理人</template>
{{ item.assigneeName }}
<el-tag type="info" size="mini">{{ item.deptName }}</el-tag>
</el-descriptions-item>
<el-descriptions-item v-if="item.candidate" label-class-name="my-label">
<template slot="label"><i class="el-icon-user"></i>候选办理</template>
{{ item.candidate }}
</el-descriptions-item>
<el-descriptions-item label-class-name="my-label">
<template slot="label"><i class="el-icon-date"></i>接收时间</template>
{{ item.createTime }}
</el-descriptions-item>
<el-descriptions-item v-if="item.finishTime" label-class-name="my-label">
<template slot="label"><i class="el-icon-date"></i>处理时间</template>
{{ item.finishTime }}
</el-descriptions-item>
<el-descriptions-item v-if="item.duration" label-class-name="my-label">
<template slot="label"><i class="el-icon-time"></i>耗时</template>
{{ item.duration }}
</el-descriptions-item>
<el-descriptions-item v-if="item.comment" label-class-name="my-label">
<template slot="label"><i class="el-icon-tickets"></i>处理意见</template>
{{ item.comment.comment }}
</el-descriptions-item>
</el-descriptions>
</el-card>
</el-timeline-item>
</el-timeline>
</div>
</el-col>
</el-tab-pane>
<!--流程图-->
<el-tab-pane label="流程图" name="3">
<flow :flowData="flowData" />
</el-tab-pane>
</el-tabs>
<!--审批任务-->
<el-dialog :title="completeTitle" class="certificate-service" :visible.sync="completeOpen" width="60%" append-to-body>
<el-form ref="taskForm" :model="taskForm" :rules="rules" label-width="130px">
<el-form-item prop="targetKey">
<flow-user v-if="checkSendUser" :checkType="checkType" @handleUserSelect="handleUserSelect"></flow-user>
<flow-role v-if="checkSendRole" @handleRoleSelect="handleRoleSelect"></flow-role>
</el-form-item>
<!-- 退学辅导员表单 -->
<el-form-item label="辅导员联系情况" prop="ideologicalEducation" v-if="dropOutShow">
<el-input v-model="taskForm.ideologicalEducation" placeholder="请输入辅导员联系情况" type="textarea" rows="4" />
</el-form-item>
<el-form-item label="在校时间说明 " prop="instructionSchoolHours" v-if="dropOutShow">
<el-input v-model="taskForm.instructionSchoolHours" placeholder="在校时间说明" type="textarea" rows="1" />
</el-form-item>
<!-- 退学表单学生教育管理科审核 -->
<el-form-item label="退学文号" prop="quitNumber" v-if="dropOutGLKSHShow">
<el-input v-model="taskForm.quitNumber" placeholder="请输入退学文号" />
</el-form-item>
<el-form-item label="退学类别" prop="dropOutCategory" v-if="dropOutGLKSHShow">
<el-select v-model="taskForm.dropOutCategory" placeholder="请选择退学类别">
<el-option v-for="dict in dict.type.rt_logout_type" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item label="退学年份" prop="quitYear" v-if="dropOutGLKSHShow">
<el-select clearable v-model="taskForm.quitYear" placeholder="请退学年份">
<el-option v-for="dict in dict.type.sys_teacher_kpi_filling_year" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item label="备注" prop="remark" v-if="dropOutGLKSHShow">
<el-input v-model="taskForm.remark" placeholder="请输入备注" />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="completeOpen = false"> </el-button>
<el-button type="primary" @click="taskComplete"> </el-button>
</span>
</el-dialog>
<!--退回流程-->
<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-item label="退回意见" prop="comment" :rules="[{ required: true, message: '请输入意见', trigger: 'blur' }]">
<el-input style="width: 50%" type="textarea" v-model="taskForm.comment" placeholder="请输入意见" />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="returnOpen = false"> </el-button>
<el-button type="primary" @click="taskReturn"> </el-button>
</span>
</el-dialog>
<!--驳回流程-->
<el-dialog :title="rejectTitle" :visible.sync="rejectOpen" width="40%" append-to-body>
<el-form ref="taskForm" :model="taskForm" label-width="80px">
<el-form-item label="驳回意见" prop="comment" :rules="[{ required: true, message: '请输入意见', trigger: 'blur' }]">
<el-input style="width: 50%" type="textarea" v-model="taskForm.comment" placeholder="请输入意见" />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="rejectOpen = false"> </el-button>
<el-button type="primary" @click="taskReject"> </el-button>
</span>
</el-dialog>
</el-card>
</div>
</template>
<script>
import { flowXmlAndNode, getProcessVariables } from '@/api/flowable/definition'
import { flowRecord } from '@/api/flowable/finished'
import { complete, delegate, flowTaskForm, getNextFlowNode, rejectTask, returnList, returnTask } from '@/api/flowable/todo'
import { getRtStuDropOutSchoolByprocInsId, updateRtStuDropOutSchool } from '@/api/routine/rtStuDropOutSchool'
import FlowRole from '@/components/flow/Role'
import FlowUser from '@/components/flow/User'
import Parser from '@/components/parser/Parser'
import download from '@/plugins/download'
import { checkRole } from '@/utils/permission'; // 权限判断函数
import flow from '@/views/flowable/task/todo/detail/flow'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import pdf from 'vue-pdf'
export default {
name: 'DropOutIndex',
dicts: ['rt_penalty_type', 'rt_penalty_status', 'rt_quit_type', 'sys_teacher_kpi_filling_year', 'rt_logout_type', 'rt_reentry_type'],
components: {
Parser,
flow,
FlowUser,
FlowRole,
pdf,
},
props: {},
data() {
return {
// 模型xml数据
xmlData: '',
flowData: {},
activeName: '1',
// 部门名称
deptName: undefined,
// 部门树选项
// 用户表格数据
userList: null,
defaultProps: {
children: 'children',
label: 'label',
},
// 查询参数
queryParams: {
deptId: undefined,
},
// 遮罩层
loading: true,
flowRecordList: [], // 流程流转数据
formConfCopy: {},
src: null,
rules: {
quitNumber: [{ required: true, message: '请输入退学文号', trigger: 'blur' }],
dropOutCategory: [{ required: true, message: '请选择退学类别', trigger: 'blur' }],
quitYear: [{ required: true, message: '请选择退学年份', trigger: 'blur' }],
instructionSchoolHours: [{ required: true, message: '请输入在校时间说明', trigger: 'blur' }],
ideologicalEducation: [{ required: true, message: '请输入辅导员联系情况', trigger: 'blur' }],
}, // 表单校验
variablesForm: {}, // 流程变量数据
taskForm: {
returnTaskShow: false, // 是否展示回退表单
delegateTaskShow: false, // 是否展示回退表单
defaultTaskShow: true, // 默认处理
comment: '', // 意见内容
procInsId: '', // 流程实例编号
instanceId: '', // 流程实例编号
deployId: '', // 流程定义编号
taskId: '', // 流程任务编号
procDefId: '', // 流程编号
targetKey: '',
variables: {
variables: {},
},
penaltyNumber: '',
letterServiceContent: '',
violationDate: '',
relieveNumber: '',
dispositionServiceContent: '',
ideologicalEducation: '',
},
assignee: null,
formConf: {}, // 默认表单数据
variables: [], // 流程变量数据
variablesData: {}, // 流程变量数据
returnTaskList: [], // 回退列表数据
completeTitle: null,
completeOpen: false,
returnTitle: null,
returnOpen: false,
rejectOpen: false,
rejectTitle: null,
userData: [],
checkSendUser: false, // 是否展示人员选择模块
checkSendRole: false, // 是否展示角色选择模块
checkType: 'single', // 选择类型
taskName: null, // 任务节点
startUser: null, // 发起人信息,
multiInstanceVars: '', // 会签节点
formKeyExist: false, // 当前节点是否存在表单
// 表单参数:目前是考勤表单
form: {},
// 学生基础信息
stuInfo: {},
baseUrl: process.env.VUE_APP_BASE_API,
category: null, // 流程分类
dropOutForm: false, // 退学申请表单
dropOutShow: false, // 退学申请输入框显示
dropOutGLKSHShow: false, // 学生退学教育管理科审核
rejectBtn: true, //驳回按钮
dispositionServiceContent: '', //处分下文
pdfURL: '', // pdf路径
letterServiceContent: '', // 送达书文字
showFileDowload: false, //是否显示下载下文
quitTypeOptions: [], //退学类别
}
},
created() {
if (this.$route.query) {
this.taskName = this.$route.query.taskName
this.startUser = this.$route.query.startUser
this.taskForm.deployId = this.$route.query.deployId
this.taskForm.taskId = this.$route.query.taskId
this.taskForm.procInsId = this.$route.query.procInsId
this.taskForm.executionId = this.$route.query.executionId
this.taskForm.instanceId = this.$route.query.procInsId
this.category = this.$route.query.category
// 如果任务名是其中的两个,则改变审批意见的输入框内容
if (this.category == 'dropOut') {
this.dropOutForm = true
this.getRtStuDropOutSchoolByprocInsId(this.taskForm.procInsId)
if (this.taskName == '辅导员联系情况') {
this.dropOutShow = true
}
if (this.taskName == '学生教育管理科审核') {
this.dropOutGLKSHShow = true
}
}
// 流程任务获取变量信息
if (this.taskForm.taskId) {
this.processVariables(this.taskForm.taskId)
this.getFlowTaskForm(this.taskForm.taskId)
}
this.getFlowRecordList(this.taskForm.procInsId, this.taskForm.deployId)
this.rejectBtn = !checkRole(['teststu'])
}
},
methods: {
quitSchoolMethodFormat(row, column) {
return this.selectDictLabel(this.dict.type.rt_reentry_type, row.dropOutType)
},
// 类别
quitSchoolCategoryMethodFormat(row, column) {
return this.selectDictLabel(this.dict.type.rt_logout_type, row.dropOutCategory)
},
// 查询退学表单信息
getRtStuDropOutSchoolByprocInsId(procInsId) {
getRtStuDropOutSchoolByprocInsId(procInsId).then((res) => {
this.form = res.data
})
},
handleClick(tab, event) {
if (tab.name === '3') {
flowXmlAndNode({ procInsId: this.taskForm.procInsId, deployId: this.taskForm.deployId }).then((res) => {
this.flowData = res.data
})
}
},
setIcon(val) {
if (val) {
return 'el-icon-check'
} else {
return 'el-icon-time'
}
},
setColor(val) {
if (val) {
return '#2bc418'
} else {
return '#b3bdbb'
}
},
// 用户信息选中数据
handleUserSelect(selection) {
if (selection) {
if (selection instanceof Array) {
const selectVal = selection.map((item) => item.userId)
if (this.multiInstanceVars) {
this.$set(this.taskForm.variables, this.multiInstanceVars, selectVal)
} else {
this.$set(this.taskForm.variables, 'approval', selectVal.join(','))
}
} else {
this.$set(this.taskForm.variables, 'approval', selection.userId.toString())
}
}
},
// 角色信息选中数据
handleRoleSelect(selection) {
if (selection) {
if (selection instanceof Array) {
const selectVal = selection.map((item) => item.roleId)
this.$set(this.taskForm.variables, 'approval', selectVal.join(','))
} else {
this.$set(this.taskForm.variables, 'approval', selection)
}
}
},
/** 流程流转记录 */
getFlowRecordList(procInsId, deployId) {
const that = this
const params = { procInsId: procInsId, deployId: deployId }
flowRecord(params)
.then((res) => {
that.flowRecordList = res.data.flowList
})
.catch((res) => {
this.goBack()
})
},
fillFormData(form, data) {
form.fields.forEach((item) => {
const val = data[item.__vModel__]
if (val) {
item.__config__.defaultValue = val
}
})
},
/** 获取流程变量内容 */
processVariables(taskId) {
if (taskId) {
// 提交流程申请时填写的表单存入了流程变量中后续任务处理时需要展示
getProcessVariables(taskId).then((res) => {
this.variablesData = res.data.variables
})
}
},
/** 流程节点表单 */
getFlowTaskForm(taskId) {
if (taskId) {
// 提交流程申请时填写的表单存入了流程变量中后续任务处理时需要展示
flowTaskForm({ taskId: taskId }).then((res) => {
this.variablesData = res.data.formData
this.taskForm.variables = res.data.formData
this.formKeyExist = res.data.formKeyExist
})
}
},
/** 加载审批任务弹框 */
handleComplete() {
// this.completeOpen = true;
// this.completeTitle = "流程审批";
this.submitForm(null)
},
/** 用户审批任务 */
taskComplete() {
// if (!this.taskForm.variables && this.checkSendUser) {
// this.$modal.msgError('请选择流程接收人员!')
// return
// }
// if (!this.taskForm.variables && this.checkSendRole) {
// this.$modal.msgError('请选择流程接收角色组!')
// return
// }
this.$refs['taskForm'].validate((valid) => {
if (valid) {
this.$modal.loading('正在努力加载中,请稍等。。。')
this.taskForm.comment = '同意'
// 流程设计人员类型配置为固定人员接收任务时,直接提交任务到下一步
complete(this.taskForm).then((response) => {
if (this.taskName == '辅导员联系情况' && this.category == 'dropOut') {
this.form.ideologicalEducation = this.taskForm.ideologicalEducation
this.form.instructionSchoolHours = this.taskForm.instructionSchoolHours
this.updateRtStuDropOutSchool()
} else if (this.taskName == '学生教育管理科审核' && this.category == 'dropOut') {
// 学生教育管理科审核,赋值
this.form.dropOutCategory = this.taskForm.dropOutCategory
this.form.quitNumber = this.taskForm.quitNumber
this.form.quitYear = this.taskForm.quitYear
this.form.remark = this.taskForm.remark
this.updateRtStuDropOutSchool()
} else {
this.$modal.msgSuccess(response.msg)
}
this.$modal.closeLoading()
this.goBack()
})
}
})
},
updateRtStuDropOutSchool() {
updateRtStuDropOutSchool(this.form).then((response) => {
this.$modal.msgSuccess(response.msg)
})
},
/** 委派任务 */
handleDelegate() {
this.taskForm.delegateTaskShow = true
this.taskForm.defaultTaskShow = false
},
handleAssign() {},
/** 返回页面 */
goBack() {
// 关闭当前标签页并返回上个页面
const obj = { path: '/task/todo', query: { t: Date.now() } }
console.log(obj)
this.$tab.closeOpenPage(obj)
},
/** 驳回任务 */
handleReject() {
this.rejectOpen = true
this.rejectTitle = '驳回流程'
},
/** 驳回任务 */
taskReject() {
this.$refs['taskForm'].validate((valid) => {
if (valid) {
rejectTask(this.taskForm).then((res) => {
this.$modal.msgSuccess(res.msg)
this.goBack()
})
}
})
},
/** 可退回任务列表 */
handleReturn() {
this.returnOpen = true
this.returnTitle = '退回流程'
returnList(this.taskForm).then((res) => {
this.returnTaskList = res.data
this.taskForm.variables = null
})
},
/** 提交退回任务 */
taskReturn() {
this.$refs['taskForm'].validate((valid) => {
if (valid) {
returnTask(this.taskForm).then((res) => {
this.$modal.msgSuccess(res.msg)
this.goBack()
})
}
})
},
/** 取消回退任务按钮 */
cancelTask() {
this.taskForm.returnTaskShow = false
this.taskForm.defaultTaskShow = true
this.returnTaskList = []
},
/** 委派任务 */
submitDeleteTask() {
this.$refs['taskForm'].validate((valid) => {
if (valid) {
delegate(this.taskForm).then((response) => {
this.$modal.msgSuccess(response.msg)
this.goBack()
})
}
})
},
/** 取消回退任务按钮 */
cancelDelegateTask() {
this.taskForm.delegateTaskShow = false
this.taskForm.defaultTaskShow = true
this.returnTaskList = []
},
/** 申请流程表单数据提交 */
submitForm(formData) {
// 根据当前任务或者流程设计配置的下一步节点 todo 暂时未涉及到考虑网关、表达式和多节点情况
const params = { taskId: this.taskForm.taskId }
getNextFlowNode(params).then((res) => {
const data = res.data
this.taskForm.formData = formData
// if (data) {
// if (data.dataType === 'dynamic') {
// if (data.type === 'assignee') { // 指定人员
// this.checkSendUser = true;
// this.checkType = "single";
// } else if (data.type === 'candidateUsers') { // 候选人员(多个)
// this.checkSendUser = true;
// this.checkType = "multiple";
// } else if (data.type === 'candidateGroups') { // 指定组(所属角色接收任务)
// this.checkSendRole = true;
// } else { // 会签
// // 流程设计指定的 elementVariable 作为会签人员列表
// this.multiInstanceVars = data.vars;
// this.checkSendUser = true;
// this.checkType = "multiple";
// }
// }
// }
this.completeOpen = true
this.completeTitle = '流程审批'
})
},
fileUpload() {
download.resource(this.pdfURL)
},
},
}
</script>
<style lang="scss" scoped>
.test-form {
margin: 15px auto;
width: 800px;
padding: 15px;
}
.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;
}
.my-label {
background: #e1f3d8;
}
.indented-text {
text-indent: 1em;
}
.gongzhang {
margin-right: 10px;
margin-bottom: 10px;
position: relative;
}
.gongzhang img {
position: absolute;
top: -20px;
/* 根据需要调整图片的垂直位置 */
left: 0;
/* 根据需要调整图片的水平位置 */
}
.gongzhang p {
margin-top: 20px;
/* 根据需要调整两个 p 标签之间的垂直距离 */
}
.certificate-service {
.desc {
text-indent: 2em;
}
.stamp {
text-align: right;
& > div {
margin-top: -70px;
margin-right: 25px;
}
img {
width: 120px;
height: 120px;
}
}
}
</style>

View File

@@ -0,0 +1,24 @@
<template>
<div>
<flow-view :flowData="flowData"/>
</div>
</template>
<script>
import FlowView from './flowview'
export default {
name: "Flow",
components: {
FlowView
},
props: {
flowData: {
type: Object,
default: () => {}
},
},
data() {
return {};
}
};
</script>

View File

@@ -0,0 +1,238 @@
<template>
<div class="containers main-box">
<el-button type="success"
size="small"
icon="el-icon-zoom-in"
@click="zoomViewport(true)">放大</el-button>
<el-button type="warning"
size="small"
icon="el-icon-zoom-out"
@click="zoomViewport(false)">缩小</el-button>
<el-button type="info"
size="small"
icon="el-icon-rank"
@click="fitViewport">适中</el-button>
<div class="canvas" ref="flowCanvas"></div>
</div>
</template>
<script>
import { CustomViewer as BpmnViewer } from "@/components/customBpmn";
export default {
name: "FlowView",
props: {
flowData: {
type: Object,
default: () => {}
},
},
data() {
return {
bpmnViewer: null
};
},
watch: {
flowData: {
handler(newVal) {
if (Object.keys(newVal).length > 0) {
// 生成实例
this.bpmnViewer && this.bpmnViewer.destroy();
this.bpmnViewer = new BpmnViewer({
container: this.$refs.flowCanvas,
height: 'calc(100vh - 200px)',
});
this.loadFlowCanvas(newVal);
}
},
immediate: true, // 立即生效
deep: true //监听对象或数组的时候,要用到深度监听
}
},
mounted() {
},
methods: {
// 加载流程
async loadFlowCanvas(flowData) {
const self = this
try {
await self.bpmnViewer.importXML(flowData.xmlData);
self.fitViewport()
if (flowData.nodeData !==undefined && flowData.nodeData.length > 0 ) {
self.fillColor(flowData.nodeData)
}
} catch (err) {
console.error(err.message, err.warnings)
}
},
// 设置高亮颜色的class
setNodeColor(nodeCodes, colorClass, canvas) {
for (let i = 0; i < nodeCodes.length; i++) {
canvas.addMarker(nodeCodes[i], colorClass);
}
},
// 让图能自适应屏幕
fitViewport() {
this.zoom = this.bpmnViewer.get('canvas').zoom("fit-viewport", "auto")
},
// 放大缩小
zoomViewport(zoomIn = true) {
this.zoom = this.bpmnViewer.get('canvas').zoom()
this.zoom += (zoomIn ? 0.1 : -0.1)
if(this.zoom >= 0.2) this.bpmnViewer.get('canvas').zoom(this.zoom)
},
// 设置高亮颜色的
fillColor(nodeData) {
const canvas = this.bpmnViewer.get('canvas')
this.bpmnViewer.getDefinitions().rootElements[0].flowElements.forEach(n => {
const completeTask = nodeData.find(m => m.key === n.id)
const todoTask = nodeData.find(m => !m.completed)
const endTask = nodeData[nodeData.length - 1]
if (n.$type === 'bpmn:UserTask') {
if (completeTask) {
canvas.addMarker(n.id, completeTask.completed ? 'highlight' : 'highlight-todo')
n.outgoing?.forEach(nn => {
const targetTask = nodeData.find(m => m.key === nn.targetRef.id)
if (targetTask) {
if (todoTask && completeTask.key === todoTask.key && !todoTask.completed){
canvas.addMarker(nn.id, todoTask.completed ? 'highlight' : 'highlight-todo')
canvas.addMarker(nn.targetRef.id, todoTask.completed ? 'highlight' : 'highlight-todo')
}else {
canvas.addMarker(nn.id, targetTask.completed ? 'highlight' : 'highlight-todo')
canvas.addMarker(nn.targetRef.id, targetTask.completed ? 'highlight' : 'highlight-todo')
}
}
})
}
}
// 排他网关
else if (n.$type === 'bpmn:ExclusiveGateway') {
if (completeTask) {
canvas.addMarker(n.id, completeTask.completed ? 'highlight' : 'highlight-todo')
n.outgoing?.forEach(nn => {
const targetTask = nodeData.find(m => m.key === nn.targetRef.id)
if (targetTask) {
canvas.addMarker(nn.id, targetTask.completed ? 'highlight' : 'highlight-todo')
canvas.addMarker(nn.targetRef.id, targetTask.completed ? 'highlight' : 'highlight-todo')
}
})
}
}
// 并行网关
else if (n.$type === 'bpmn:ParallelGateway') {
if (completeTask) {
canvas.addMarker(n.id, completeTask.completed ? 'highlight' : 'highlight-todo')
n.outgoing?.forEach(nn => {
const targetTask = nodeData.find(m => m.key === nn.targetRef.id)
if (targetTask) {
canvas.addMarker(nn.id, targetTask.completed ? 'highlight' : 'highlight-todo')
canvas.addMarker(nn.targetRef.id, targetTask.completed ? 'highlight' : 'highlight-todo')
}
})
}
}
else if (n.$type === 'bpmn:StartEvent') {
n.outgoing.forEach(nn => {
const completeTask = nodeData.find(m => m.key === nn.targetRef.id)
if (completeTask) {
canvas.addMarker(nn.id, 'highlight')
canvas.addMarker(n.id, 'highlight')
return
}
})
}
else if (n.$type === 'bpmn:EndEvent') {
if (endTask.key === n.id && endTask.completed) {
canvas.addMarker(n.id, 'highlight')
return
}
}
})
},
}
};
</script>
<style lang="scss">
.bjs-powered-by {
display: none;
}
.view-mode {
.el-header, .el-aside, .djs-palette, .bjs-powered-by {
display: none;
}
.el-loading-mask {
background-color: initial;
}
.el-loading-spinner {
display: none;
}
}
.containers {
// background-color: #ffffff;
width: 100%;
height: 100%;
.canvas {
width: 100%;
height: 100%;
}
.panel {
position: absolute;
right: 0;
top: 50px;
width: 300px;
}
.load {
margin-right: 10px;
}
.el-form-item__label{
font-size: 13px;
}
.djs-palette{
left: 0px!important;
top: 0px;
border-top: none;
}
.djs-container svg {
min-height: 650px;
}
.highlight.djs-shape .djs-visual > :nth-child(1) {
fill: green !important;
stroke: green !important;
fill-opacity: 0.2 !important;
}
.highlight.djs-shape .djs-visual > :nth-child(2) {
fill: green !important;
}
.highlight.djs-shape .djs-visual > path {
fill: green !important;
fill-opacity: 0.2 !important;
stroke: green !important;
}
.highlight.djs-connection > .djs-visual > path {
stroke: green !important;
}
.highlight-todo.djs-connection > .djs-visual > path {
stroke: orange !important;
stroke-dasharray: 4px !important;
fill-opacity: 0.2 !important;
}
.highlight-todo.djs-shape .djs-visual > :nth-child(1) {
fill: orange !important;
stroke: orange !important;
stroke-dasharray: 4px !important;
fill-opacity: 0.2 !important;
}
.overlays-div {
font-size: 10px;
color: red;
width: 100px;
top: -20px !important;
}
}
</style>

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,775 @@
<template>
<div class="app-container">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span class="el-icon-document">待办任务</span>
<el-tag style="margin-left: 10px">发起人:{{ startUser }}</el-tag>
<el-tag>任务节点:{{ taskName }}</el-tag>
<el-button style="float: right" size="mini" type="danger" @click="goBack">关闭</el-button>
</div>
<el-tabs tab-position="top" v-model="activeName" @tab-click="handleClick">
<!--表单信息-->
<el-tab-pane label="表单信息" name="1">
<el-col :span="16" :offset="4">
<div class="">
<!-- 休学申请表单 -->
<el-descriptions class="margin-top" title="" :column="3" size="medium" border style="width: 100%" v-if="quitSchoolForm">
<el-descriptions-item>
<template slot="label"> 学号 </template>
{{ form.stuNo }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 姓名 </template>
{{ form.stuName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 性别 </template>
{{ form.gender }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 院部 </template>
{{ form.departmentName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 年级 </template>
{{ form.gradeName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 班级 </template>
{{ form.className }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 出生日期 </template>
{{ form.birthday }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 家长姓名 </template>
{{ form.parentName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 家长电话 </template>
{{ form.parentPhone }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 民族 </template>
{{ form.mz }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 籍贯/自治区/直辖市 </template>
{{ form.jg }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 休学类型 </template>
{{ quitSchoolTypeMethodFormat(form) }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 附件上传 </template>
<Affix v-model="form.attachmentUpload" :disabled="true"></Affix>
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 申请原因 </template>
{{ form.reasonApplying }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 签名 </template>
<img v-if="form.applySignature" :src="baseUrl + form.applySignature" width="200px" height="200px" class="avatar" />
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 辅导员联系情况 </template>
{{ form.ideologicalEducation }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 在校时间说明 </template>
{{ form.instructionSchoolHours }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 休学文号 </template>
{{ form.quitNumber }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 休学开始时间 </template>
{{ form.quitStartTime }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 休学结束时间 </template>
{{ form.quitEndTime }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 休学类别 </template>
{{ quitSchoolCategoryMethodFormat(form) }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 休学年份 </template>
{{ reentryYearMethodFormat(form) }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 备注 </template>
{{ form.remark }}
</el-descriptions-item>
</el-descriptions>
</div>
<div style="margin-left: 15%; margin-bottom: 20px; font-size: 14px; margin-top: 20px">
<el-button v-if="!formKeyExist" icon="el-icon-edit-outline" type="success" size="mini" @click="handleComplete">同意 </el-button>
<!-- <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleDelegate">委派</el-button>-->
<!-- <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleAssign">转办</el-button>-->
<!-- <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleDelegate">签收</el-button>-->
<el-button icon="el-icon-refresh-left" type="warning" v-if="rejectBtn" size="mini" @click="handleReturn">退回</el-button>
<el-button icon="el-icon-circle-close" type="danger" v-if="rejectBtn" size="mini" @click="handleReject">驳回</el-button>
</div>
</el-col>
</el-tab-pane>
<!--流程流转记录-->
<el-tab-pane label="流转记录" name="2">
<!--flowRecordList-->
<el-col :span="16" :offset="4">
<div class="block">
<el-timeline>
<el-timeline-item v-for="(item, index) in flowRecordList" :key="index" :icon="setIcon(item.finishTime)" :color="setColor(item.finishTime)">
<p style="font-weight: 700">{{ item.taskName }}</p>
<el-card :body-style="{ padding: '10px' }">
<el-descriptions class="margin-top" :column="1" size="small" border>
<el-descriptions-item v-if="item.assigneeName" label-class-name="my-label">
<template slot="label"><i class="el-icon-user"></i>办理人</template>
{{ item.assigneeName }}
<el-tag type="info" size="mini">{{ item.deptName }}</el-tag>
</el-descriptions-item>
<el-descriptions-item v-if="item.candidate" label-class-name="my-label">
<template slot="label"><i class="el-icon-user"></i>候选办理</template>
{{ item.candidate }}
</el-descriptions-item>
<el-descriptions-item label-class-name="my-label">
<template slot="label"><i class="el-icon-date"></i>接收时间</template>
{{ item.createTime }}
</el-descriptions-item>
<el-descriptions-item v-if="item.finishTime" label-class-name="my-label">
<template slot="label"><i class="el-icon-date"></i>处理时间</template>
{{ item.finishTime }}
</el-descriptions-item>
<el-descriptions-item v-if="item.duration" label-class-name="my-label">
<template slot="label"><i class="el-icon-time"></i>耗时</template>
{{ item.duration }}
</el-descriptions-item>
<el-descriptions-item v-if="item.comment" label-class-name="my-label">
<template slot="label"><i class="el-icon-tickets"></i>处理意见</template>
{{ item.comment.comment }}
</el-descriptions-item>
</el-descriptions>
</el-card>
</el-timeline-item>
</el-timeline>
</div>
</el-col>
</el-tab-pane>
<!--流程图-->
<el-tab-pane label="流程图" name="3">
<flow :flowData="flowData" />
</el-tab-pane>
</el-tabs>
<!--审批任务-->
<el-dialog :title="completeTitle" class="certificate-service" :visible.sync="completeOpen" width="60%" append-to-body>
<div v-if="showQuitSchoolProve">
<div id="quitSchool" class="certificate">
<h1>休学证明</h1>
<h4>桂水电院 {{ form.quitYear }} 休字第 {{ form.quitNumber }}</h4>
<p>{{ form.stuName }},{{ form.gender }},{{ form.mz }},{{ form.birthday }}出生{{ form.jg }}{{ form.className }}学生学号{{ form.stuNo }}该生于个人原因-{{ form.reasonApplying }}申请休学经学校研究同意休学时间从{{ form.quitStartTime }}{{ form.quitEndTime }}</p>
<p>抄送教务处财务处{{ form.departmentName }}</p>
<div class="stamp">
<img src="https://gss0.baidu.com/7Po3dSag_xI4khGko9WTAnF6hhy/zhidao/wh%3D450%2C600/sign=debd0a4bb2fd5266a77e34109e28bb1d/8d5494eef01f3a297283d36e9d25bc315d607cc2.jpg" alt="Stamp" />
<div>
<span>学生工作处</span>
<span>{{ form.quitStartTime }}</span>
</div>
</div>
</div>
</div>
<el-form ref="taskForm" :model="taskForm" :rules="rules" label-width="130px">
<el-form-item prop="targetKey">
<flow-user v-if="checkSendUser" :checkType="checkType" @handleUserSelect="handleUserSelect"></flow-user>
<flow-role v-if="checkSendRole" @handleRoleSelect="handleRoleSelect"></flow-role>
</el-form-item>
<!-- 休学表单 -->
<el-form-item label="辅导员联系情况" prop="ideologicalEducation" v-if="quitSchoolShow">
<el-input v-model="taskForm.ideologicalEducation" placeholder="请输入辅导员联系情况" type="textarea" rows="4" />
</el-form-item>
<el-form-item label="在校时间说明 " prop="instructionSchoolHours" v-if="quitSchoolShow">
<el-input v-model="taskForm.instructionSchoolHours" placeholder="在校时间说明" type="textarea" rows="1" />
</el-form-item>
<!-- 休学表单学生教育管理科审核 -->
<el-form-item label="休学文号" prop="quitNumber" v-if="quitSchoolGLKSHShow">
<el-input v-model="taskForm.quitNumber" placeholder="请输入休学文号" />
</el-form-item>
<el-form-item label="休学开始时间" prop="quitStartTime" v-if="quitSchoolGLKSHShow">
<el-date-picker v-model="taskForm.quitStartTime" type="date" placeholder="开始时间"> </el-date-picker>
</el-form-item>
<el-form-item label="休学结束时间" prop="quitEndTime" v-if="quitSchoolGLKSHShow">
<el-date-picker v-model="taskForm.quitEndTime" type="date" placeholder="结束时间"> </el-date-picker>
</el-form-item>
<el-form-item label="休学类别" prop="quitCategory" v-if="quitSchoolGLKSHShow">
<el-select v-model="taskForm.quitCategory" placeholder="请选择休学类别">
<el-option v-for="dict in dict.type.rt_transaction_type" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item label="休学年份" prop="quitYear" v-if="quitSchoolGLKSHShow">
<el-select clearable v-model="taskForm.quitYear" placeholder="请退学年份">
<el-option v-for="dict in dict.type.sys_teacher_kpi_filling_year" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item label="休学备注" prop="remark" v-if="quitSchoolGLKSHShow">
<el-input v-model="taskForm.remark" placeholder="请输入备注" rows="2"/>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="completeOpen = false"> </el-button>
<el-button type="primary" @click="taskComplete"> </el-button>
</span>
</el-dialog>
<!--退回流程-->
<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-item label="退回意见" prop="comment" :rules="[{ required: true, message: '请输入意见', trigger: 'blur' }]">
<el-input style="width: 50%" type="textarea" v-model="taskForm.comment" placeholder="请输入意见" />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="returnOpen = false"> </el-button>
<el-button type="primary" @click="taskReturn"> </el-button>
</span>
</el-dialog>
<!--驳回流程-->
<el-dialog :title="rejectTitle" :visible.sync="rejectOpen" width="40%" append-to-body>
<el-form ref="taskForm" :model="taskForm" label-width="80px">
<el-form-item label="驳回意见" prop="comment" :rules="[{ required: true, message: '请输入意见', trigger: 'blur' }]">
<el-input style="width: 50%" type="textarea" v-model="taskForm.comment" placeholder="请输入意见" />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="rejectOpen = false"> </el-button>
<el-button type="primary" @click="taskReject"> </el-button>
</span>
</el-dialog>
</el-card>
</div>
</template>
<script>
import { flowXmlAndNode, getProcessVariables } from '@/api/flowable/definition'
import { flowRecord } from '@/api/flowable/finished'
import { complete, delegate, flowTaskForm, getNextFlowNode, rejectTask, returnList, returnTask } from '@/api/flowable/todo'
import { getRtStuQuitSchoolByProcInsId, updateRtStuQuitSchool } from '@/api/routine/rtStuQuitSchool'
import FlowRole from '@/components/flow/Role'
import FlowUser from '@/components/flow/User'
import Parser from '@/components/parser/Parser'
import download from '@/plugins/download'
import { checkRole } from '@/utils/permission'; // 权限判断函数
import flow from '@/views/flowable/task/todo/detail/flow'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import pdf from 'vue-pdf'
export default {
name: 'QuitSchoolIndex',
dicts: ['rt_penalty_type', 'rt_penalty_status', 'rt_quit_type', 'sys_teacher_kpi_filling_year', 'rt_logout_type', 'rt_reentry_type','rt_transaction_type'],
components: {
Parser,
flow,
FlowUser,
FlowRole,
pdf,
},
props: {},
data() {
return {
// 模型xml数据
xmlData: '',
flowData: {},
activeName: '1',
// 部门名称
deptName: undefined,
// 部门树选项
// 用户表格数据
userList: null,
defaultProps: {
children: 'children',
label: 'label',
},
// 查询参数
queryParams: {
deptId: undefined,
},
// 遮罩层
loading: true,
flowRecordList: [], // 流程流转数据
formConfCopy: {},
src: null,
rules: {
ideologicalEducation: [{ required: true, message: '请输入处分期间表现', trigger: 'blur' }],
quitNumber: [{ required: true, message: '请输入休学文号', trigger: 'blur' }],
quitStartTime: [{ required: true, message: '请选择休学开始时间', trigger: 'blur' }],
quitEndTime: [{ required: true, message: '请选择休学结束时间', trigger: 'blur' }],
quitType: [{ required: true, message: '请选择休学类型', trigger: 'blur' }],
quitCategory: [{ required: true, message: '请选择休学类别', trigger: 'blur' }],
quitYear: [{ required: true, message: '请选择休学年份', trigger: 'blur' }],
instructionSchoolHours: [{ required: true, message: '请输入在校时间说明', trigger: 'blur' }],
ideologicalEducation: [{ required: true, message: '请输入辅导员联系情况', trigger: 'blur' }],
}, // 表单校验
variablesForm: {}, // 流程变量数据
taskForm: {
returnTaskShow: false, // 是否展示回退表单
delegateTaskShow: false, // 是否展示回退表单
defaultTaskShow: true, // 默认处理
comment: '', // 意见内容
procInsId: '', // 流程实例编号
instanceId: '', // 流程实例编号
deployId: '', // 流程定义编号
taskId: '', // 流程任务编号
procDefId: '', // 流程编号
targetKey: '',
variables: {
variables: {},
},
penaltyNumber: '',
letterServiceContent: '',
violationDate: '',
relieveNumber: '',
dispositionServiceContent: '',
ideologicalEducation: '',
},
assignee: null,
formConf: {}, // 默认表单数据
variables: [], // 流程变量数据
variablesData: {}, // 流程变量数据
returnTaskList: [], // 回退列表数据
completeTitle: null,
completeOpen: false,
returnTitle: null,
returnOpen: false,
rejectOpen: false,
rejectTitle: null,
userData: [],
checkSendUser: false, // 是否展示人员选择模块
checkSendRole: false, // 是否展示角色选择模块
checkType: 'single', // 选择类型
taskName: null, // 任务节点
startUser: null, // 发起人信息,
multiInstanceVars: '', // 会签节点
formKeyExist: false, // 当前节点是否存在表单
// 表单参数:目前是考勤表单
form: {},
// 学生基础信息
stuInfo: {},
baseUrl: process.env.VUE_APP_BASE_API,
category: null, // 流程分类
dropOutForm: false, // 退学申请表单
dropOutShow: false, // 退学申请输入框显示
dropOutGLKSHShow: false, // 学生退学教育管理科审核
rejectBtn: true, //驳回按钮
dispositionServiceContent: '', //处分下文
pdfURL: '', // pdf路径
letterServiceContent: '', // 送达书文字
showFileDowload: false, //是否显示下载下文
quitTypeOptions: [], //退学类别
quitSchoolForm: false, // 休学申请表单
showQuitSchoolProve: false, //休学证明
quitSchoolGLKSHShow: false, // 学生教育管理科审核
}
},
created() {
if (this.$route.query) {
this.taskName = this.$route.query.taskName
this.startUser = this.$route.query.startUser
this.taskForm.deployId = this.$route.query.deployId
this.taskForm.taskId = this.$route.query.taskId
this.taskForm.procInsId = this.$route.query.procInsId
this.taskForm.executionId = this.$route.query.executionId
this.taskForm.instanceId = this.$route.query.procInsId
this.category = this.$route.query.category
// 如果任务名是其中的两个,则改变审批意见的输入框内容
if ((this.taskName == '学生接收' || this.taskName == '辅导员接收') && this.category == 'quitSchool') {
this.showQuitSchoolProve = true
}
if (this.category == 'quitSchool') {
this.quitSchoolForm = true
this.getRtStuQuitSchoolByProcInsId(this.taskForm.procInsId)
if (this.taskName == '辅导员联系情况') {
this.quitSchoolShow = true
}
if (this.taskName == '学生教育管理科审核') {
this.quitSchoolGLKSHShow = true
}
}
// 流程任务获取变量信息
if (this.taskForm.taskId) {
this.processVariables(this.taskForm.taskId)
this.getFlowTaskForm(this.taskForm.taskId)
}
this.getFlowRecordList(this.taskForm.procInsId, this.taskForm.deployId)
this.rejectBtn = !checkRole(['teststu'])
}
},
methods: {
reentryYearMethodFormat(row, column) {
return this.selectDictLabel(this.dict.type.sys_teacher_kpi_filling_year, row.quitYear)
},
quitSchoolTypeMethodFormat(row, column) {
return this.selectDictLabel(this.dict.type.rt_quit_type, row.quitType)
},
quitSchoolCategoryMethodFormat(row, column) {
return this.selectDictLabel(this.dict.type.rt_transaction_type, row.quitCategory)
},
quitSchoolMethodFormat(row, column) {
return this.selectDictLabel(this.dict.type.rt_reentry_type, row.dropOutType)
},
// 休学表单信息
getRtStuQuitSchoolByProcInsId(procInsId) {
getRtStuQuitSchoolByProcInsId(procInsId).then((res) => {
this.form = res.data
this.taskForm.quitType = this.form.quitType
})
},
handleClick(tab, event) {
if (tab.name === '3') {
flowXmlAndNode({ procInsId: this.taskForm.procInsId, deployId: this.taskForm.deployId }).then((res) => {
this.flowData = res.data
})
}
},
setIcon(val) {
if (val) {
return 'el-icon-check'
} else {
return 'el-icon-time'
}
},
setColor(val) {
if (val) {
return '#2bc418'
} else {
return '#b3bdbb'
}
},
// 用户信息选中数据
handleUserSelect(selection) {
if (selection) {
if (selection instanceof Array) {
const selectVal = selection.map((item) => item.userId)
if (this.multiInstanceVars) {
this.$set(this.taskForm.variables, this.multiInstanceVars, selectVal)
} else {
this.$set(this.taskForm.variables, 'approval', selectVal.join(','))
}
} else {
this.$set(this.taskForm.variables, 'approval', selection.userId.toString())
}
}
},
// 角色信息选中数据
handleRoleSelect(selection) {
if (selection) {
if (selection instanceof Array) {
const selectVal = selection.map((item) => item.roleId)
this.$set(this.taskForm.variables, 'approval', selectVal.join(','))
} else {
this.$set(this.taskForm.variables, 'approval', selection)
}
}
},
/** 流程流转记录 */
getFlowRecordList(procInsId, deployId) {
const that = this
const params = { procInsId: procInsId, deployId: deployId }
flowRecord(params)
.then((res) => {
that.flowRecordList = res.data.flowList
})
.catch((res) => {
this.goBack()
})
},
fillFormData(form, data) {
form.fields.forEach((item) => {
const val = data[item.__vModel__]
if (val) {
item.__config__.defaultValue = val
}
})
},
/** 获取流程变量内容 */
processVariables(taskId) {
if (taskId) {
// 提交流程申请时填写的表单存入了流程变量中后续任务处理时需要展示
getProcessVariables(taskId).then((res) => {
this.variablesData = res.data.variables
})
}
},
/** 流程节点表单 */
getFlowTaskForm(taskId) {
if (taskId) {
// 提交流程申请时填写的表单存入了流程变量中后续任务处理时需要展示
flowTaskForm({ taskId: taskId }).then((res) => {
this.variablesData = res.data.formData
this.taskForm.variables = res.data.formData
this.formKeyExist = res.data.formKeyExist
})
}
},
/** 加载审批任务弹框 */
handleComplete() {
// this.completeOpen = true;
// this.completeTitle = "流程审批";
this.submitForm(null)
},
/** 用户审批任务 */
taskComplete() {
// if (!this.taskForm.variables && this.checkSendUser) {
// this.$modal.msgError('请选择流程接收人员!')
// return
// }
// if (!this.taskForm.variables && this.checkSendRole) {
// this.$modal.msgError('请选择流程接收角色组!')
// return
// }
this.$refs['taskForm'].validate((valid) => {
if (valid) {
this.$modal.loading('正在努力加载中,请稍等。。。')
this.taskForm.comment = '同意'
// 流程设计人员类型配置为固定人员接收任务时,直接提交任务到下一步
complete(this.taskForm).then((response) => {
if (this.taskName == '辅导员联系情况' && this.category == 'quitSchool') {
this.form.ideologicalEducation = this.taskForm.ideologicalEducation
this.form.instructionSchoolHours = this.taskForm.instructionSchoolHours
this.updateRtStuQuitSchool()
} else if (this.taskName == '学生教育管理科审核' && this.category == 'quitSchool') {
// 学生教育管理科审核,赋值
this.form.quitStartTime = this.taskForm.quitStartTime
this.form.quitEndTime = this.taskForm.quitEndTime
this.form.quitType = this.taskForm.quitType
this.form.quitCategory = this.taskForm.quitCategory
this.form.quitNumber = this.taskForm.quitNumber
this.form.remark = this.taskForm.remark
this.form.quitYear = this.taskForm.quitYear
this.updateRtStuQuitSchool()
} else {
this.$modal.msgSuccess(response.msg)
}
this.$modal.closeLoading()
this.goBack()
})
}
})
},
updateRtStuQuitSchool() {
updateRtStuQuitSchool(this.form).then((response) => {
this.$modal.msgSuccess(response.msg)
})
},
/** 委派任务 */
handleDelegate() {
this.taskForm.delegateTaskShow = true
this.taskForm.defaultTaskShow = false
},
handleAssign() {},
/** 返回页面 */
goBack() {
// 关闭当前标签页并返回上个页面
const obj = { path: '/task/todo', query: { t: Date.now() } }
console.log(obj)
this.$tab.closeOpenPage(obj)
},
/** 驳回任务 */
handleReject() {
this.rejectOpen = true
this.rejectTitle = '驳回流程'
},
/** 驳回任务 */
taskReject() {
this.$refs['taskForm'].validate((valid) => {
if (valid) {
rejectTask(this.taskForm).then((res) => {
this.$modal.msgSuccess(res.msg)
this.goBack()
})
}
})
},
/** 可退回任务列表 */
handleReturn() {
this.returnOpen = true
this.returnTitle = '退回流程'
returnList(this.taskForm).then((res) => {
this.returnTaskList = res.data
this.taskForm.variables = null
})
},
/** 提交退回任务 */
taskReturn() {
this.$refs['taskForm'].validate((valid) => {
if (valid) {
returnTask(this.taskForm).then((res) => {
this.$modal.msgSuccess(res.msg)
this.goBack()
})
}
})
},
/** 取消回退任务按钮 */
cancelTask() {
this.taskForm.returnTaskShow = false
this.taskForm.defaultTaskShow = true
this.returnTaskList = []
},
/** 委派任务 */
submitDeleteTask() {
this.$refs['taskForm'].validate((valid) => {
if (valid) {
delegate(this.taskForm).then((response) => {
this.$modal.msgSuccess(response.msg)
this.goBack()
})
}
})
},
/** 取消回退任务按钮 */
cancelDelegateTask() {
this.taskForm.delegateTaskShow = false
this.taskForm.defaultTaskShow = true
this.returnTaskList = []
},
/** 申请流程表单数据提交 */
submitForm(formData) {
// 根据当前任务或者流程设计配置的下一步节点 todo 暂时未涉及到考虑网关、表达式和多节点情况
const params = { taskId: this.taskForm.taskId }
getNextFlowNode(params).then((res) => {
const data = res.data
this.taskForm.formData = formData
// if (data) {
// if (data.dataType === 'dynamic') {
// if (data.type === 'assignee') { // 指定人员
// this.checkSendUser = true;
// this.checkType = "single";
// } else if (data.type === 'candidateUsers') { // 候选人员(多个)
// this.checkSendUser = true;
// this.checkType = "multiple";
// } else if (data.type === 'candidateGroups') { // 指定组(所属角色接收任务)
// this.checkSendRole = true;
// } else { // 会签
// // 流程设计指定的 elementVariable 作为会签人员列表
// this.multiInstanceVars = data.vars;
// this.checkSendUser = true;
// this.checkType = "multiple";
// }
// }
// }
this.completeOpen = true
this.completeTitle = '流程审批'
})
},
fileUpload() {
download.resource(this.pdfURL)
},
},
}
</script>
<style lang="scss" scoped>
.test-form {
margin: 15px auto;
width: 800px;
padding: 15px;
}
.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;
}
.my-label {
background: #e1f3d8;
}
.indented-text {
text-indent: 1em;
}
.gongzhang {
margin-right: 10px;
margin-bottom: 10px;
position: relative;
}
.gongzhang img {
position: absolute;
top: -20px;
/* 根据需要调整图片的垂直位置 */
left: 0;
/* 根据需要调整图片的水平位置 */
}
.gongzhang p {
margin-top: 20px;
/* 根据需要调整两个 p 标签之间的垂直距离 */
}
.certificate-service {
.desc {
text-indent: 2em;
}
.stamp {
text-align: right;
& > div {
margin-top: -70px;
margin-right: 25px;
}
img {
width: 120px;
height: 120px;
}
}
}
</style>

View File

@@ -0,0 +1,893 @@
<template>
<div class="app-container">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span class="el-icon-document">待办任务</span>
<el-tag style="margin-left: 10px">发起人:{{ startUser }}</el-tag>
<el-tag>任务节点:{{ taskName }}</el-tag>
<el-button style="float: right" size="mini" type="danger" @click="goBack">关闭</el-button>
</div>
<el-tabs tab-position="top" v-model="activeName" @tab-click="handleClick">
<!--表单信息-->
<el-tab-pane label="表单信息" name="1">
<el-col :span="16" :offset="4">
<div class="">
<!-- 复学 -->
<el-descriptions class="margin-top" title="" :column="3" size="medium" border style="width: 100%" v-if="dropOutForm">
<el-descriptions-item>
<template slot="label"> 学号 </template>
{{ form.stuNo }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 姓名 </template>
{{ form.stuName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 性别 </template>
{{ form.gender }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 院部 </template>
{{ form.departmentName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 年级 </template>
{{ form.gradeName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 班级 </template>
{{ form.className }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 出生日期 </template>
{{ form.birthday }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 家长姓名 </template>
{{ form.parentName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 家长电话 </template>
{{ form.parentPhone }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 民族 </template>
{{ form.mz }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label"> 籍贯/自治区/直辖市 </template>
{{ form.jg }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 复学类别 </template>
{{ reentrySchoolMethodFormat(form) }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 附件上传 </template>
<Affix v-model="form.attachmentUpload" :disabled="true"></Affix>
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 申请原因 </template>
{{ form.reasonApplying }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 签名 </template>
<img v-if="form.applySignature" :src="baseUrl + form.applySignature" width="200px" height="200px" class="avatar" />
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 辅导员 </template>
{{ form.applicantName }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 辅导员联系情况 </template>
{{ form.ideologicalEducation }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 在校时间说明 </template>
{{ form.instructionSchoolHours }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 辅导员处理意见 </template>
{{ form.ihandlingSuggestion }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 休学时间 </template>
{{ form.quitTime }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 复学时间 </template>
{{ form.reentryTime }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 复学班级 </template>
{{ form.className }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 复学原因 </template>
{{ form.reentryCause }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 复学年份 </template>
{{ reentryYearMethodFormat(form) }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 复学文号 </template>
{{ form.reentryNumber }}
</el-descriptions-item>
<el-descriptions-item span="3">
<template slot="label"> 休学类别 </template>
{{ transactionTypeMethodFormat(form) }}
</el-descriptions-item>
</el-descriptions>
</div>
<div style="margin-left: 15%; margin-bottom: 20px; font-size: 14px; margin-top: 20px">
<el-button v-if="!formKeyExist" icon="el-icon-edit-outline" type="success" size="mini" @click="handleComplete">同意 </el-button>
<!-- <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleDelegate">委派</el-button>-->
<!-- <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleAssign">转办</el-button>-->
<!-- <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleDelegate">签收</el-button>-->
<el-button icon="el-icon-refresh-left" type="warning" v-if="rejectBtn" size="mini" @click="handleReturn">退回</el-button>
<el-button icon="el-icon-circle-close" type="danger" v-if="rejectBtn" size="mini" @click="handleReject">驳回</el-button>
</div>
</el-col>
</el-tab-pane>
<!--流程流转记录-->
<el-tab-pane label="流转记录" name="2">
<!--flowRecordList-->
<el-col :span="16" :offset="4">
<div class="block">
<el-timeline>
<el-timeline-item v-for="(item, index) in flowRecordList" :key="index" :icon="setIcon(item.finishTime)" :color="setColor(item.finishTime)">
<p style="font-weight: 700">{{ item.taskName }}</p>
<el-card :body-style="{ padding: '10px' }">
<el-descriptions class="margin-top" :column="1" size="small" border>
<el-descriptions-item v-if="item.assigneeName" label-class-name="my-label">
<template slot="label"><i class="el-icon-user"></i>办理人</template>
{{ item.assigneeName }}
<el-tag type="info" size="mini">{{ item.deptName }}</el-tag>
</el-descriptions-item>
<el-descriptions-item v-if="item.candidate" label-class-name="my-label">
<template slot="label"><i class="el-icon-user"></i>候选办理</template>
{{ item.candidate }}
</el-descriptions-item>
<el-descriptions-item label-class-name="my-label">
<template slot="label"><i class="el-icon-date"></i>接收时间</template>
{{ item.createTime }}
</el-descriptions-item>
<el-descriptions-item v-if="item.finishTime" label-class-name="my-label">
<template slot="label"><i class="el-icon-date"></i>处理时间</template>
{{ item.finishTime }}
</el-descriptions-item>
<el-descriptions-item v-if="item.duration" label-class-name="my-label">
<template slot="label"><i class="el-icon-time"></i>耗时</template>
{{ item.duration }}
</el-descriptions-item>
<el-descriptions-item v-if="item.comment" label-class-name="my-label">
<template slot="label"><i class="el-icon-tickets"></i>处理意见</template>
{{ item.comment.comment }}
</el-descriptions-item>
</el-descriptions>
</el-card>
</el-timeline-item>
</el-timeline>
</div>
</el-col>
</el-tab-pane>
<!--流程图-->
<el-tab-pane label="流程图" name="3">
<flow :flowData="flowData" />
</el-tab-pane>
</el-tabs>
<!--审批任务-->
<el-dialog :title="completeTitle" class="certificate-service" :visible.sync="completeOpen" width="60%" append-to-body>
<div v-if="showReentryProve">
<div id="quitSchool" class="certificate">
<h1>复学证明</h1>
<h4>桂水电院 {{ form.quitYear }} 复字第 {{ form.quitNumber }}</h4>
<p>
{{ form.stuName }},{{ form.gender }},{{ form.mz }},{{ form.birthday }}出生{{ form.jg }}{{ form.className }}学生学号{{ form.stuNo }}该生于{{ form.quitTime }}日因{{ transactionTypeMethodFormat(form) }}申请休学{{ form.reentryTime }} 申请复学{{
form.instructionSchoolHours
}}经学校研究同意复学安排在{{ form.className }}学习
</p>
<p>抄送教务处财务处{{ form.departmentName }}</p>
<div class="stamp">
<img src="https://gss0.baidu.com/7Po3dSag_xI4khGko9WTAnF6hhy/zhidao/wh%3D450%2C600/sign=debd0a4bb2fd5266a77e34109e28bb1d/8d5494eef01f3a297283d36e9d25bc315d607cc2.jpg" alt="Stamp" />
<div>
<span>学生工作处</span>
<span>{{ form.reentryTime }}</span>
</div>
</div>
</div>
</div>
<el-form ref="taskForm" :model="taskForm" :rules="rules" label-width="130px">
<el-form-item prop="targetKey">
<flow-user v-if="checkSendUser" :checkType="checkType" @handleUserSelect="handleUserSelect"></flow-user>
<flow-role v-if="checkSendRole" @handleRoleSelect="handleRoleSelect"></flow-role>
</el-form-item>
<!-- 复学辅导员表单 -->
<el-form-item label="辅导员联系情况" prop="ideologicalEducation" v-if="dropOutShow">
<el-input v-model="taskForm.ideologicalEducation" placeholder="请输入辅导员联系情况" type="textarea" rows="4" />
</el-form-item>
<el-form-item label="在校时间说明 " prop="instructionSchoolHours" v-if="dropOutShow">
<el-input v-model="taskForm.instructionSchoolHours" placeholder="在校时间说明" type="textarea" rows="1" />
</el-form-item>
<el-form-item label="辅导员处理意见 " prop="ihandlingSuggestion" v-if="dropOutShow">
<el-input v-model="taskForm.ihandlingSuggestion" placeholder="辅导员处理意见" type="textarea" rows="3" />
</el-form-item>
<el-form-item label="休学时间" prop="quitTime" v-if="dropOutShow">
<el-date-picker v-model="taskForm.quitTime" type="date" placeholder="休学时间"> </el-date-picker>
</el-form-item>
<el-form-item label="复学时间" prop="reentryTime" v-if="dropOutShow">
<el-date-picker v-model="taskForm.reentryTime" type="date" placeholder="复学时间"> </el-date-picker>
</el-form-item>
<el-form-item label="复学班级" prop="reentryClass" v-if="dropOutShow">
<el-cascader ref="cascader" placeholder="请选择班级" v-model="taskForm.reentryClass" :props="{ checkStrictly: true }" :show-all-levels="false" :options="ClassNameList" @change="handleChange1" clearable filterable>
<template slot-scope="{ node, data }">
<span>{{ data.label }}</span>
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
</template>
</el-cascader>
</el-form-item>
<!-- 复学表单学生教育管理科审核 -->
<el-form-item label="复学原因" prop="reentryCause" v-if="dropOutGLKSHShow">
<el-input v-model="taskForm.reentryCause" placeholder="请输入退学原因" rows="3" />
</el-form-item>
<el-form-item label="复学年份" prop="reentryYear" v-if="dropOutGLKSHShow">
<el-select clearable v-model="taskForm.reentryYear" placeholder="请复学年份">
<el-option v-for="dict in dict.type.sys_teacher_kpi_filling_year" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item label="复学文号" prop="reentryNumber" v-if="dropOutGLKSHShow">
<el-input v-model="taskForm.reentryNumber" placeholder="请输入复学文号" />
</el-form-item>
<el-form-item label="休学类别" prop="quitCategory" v-if="dropOutGLKSHShow">
<el-select v-model="taskForm.quitCategory" placeholder="请选择休学类别">
<el-option v-for="dict in dict.type.rt_transaction_type" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="completeOpen = false"> </el-button>
<el-button type="primary" @click="taskComplete"> </el-button>
</span>
</el-dialog>
<!--退回流程-->
<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-item label="退回意见" prop="comment" :rules="[{ required: true, message: '请输入意见', trigger: 'blur' }]">
<el-input style="width: 50%" type="textarea" v-model="taskForm.comment" placeholder="请输入意见" />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="returnOpen = false"> </el-button>
<el-button type="primary" @click="taskReturn"> </el-button>
</span>
</el-dialog>
<!--驳回流程-->
<el-dialog :title="rejectTitle" :visible.sync="rejectOpen" width="40%" append-to-body>
<el-form ref="taskForm" :model="taskForm" label-width="80px">
<el-form-item label="驳回意见" prop="comment" :rules="[{ required: true, message: '请输入意见', trigger: 'blur' }]">
<el-input style="width: 50%" type="textarea" v-model="taskForm.comment" placeholder="请输入意见" />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="rejectOpen = false"> </el-button>
<el-button type="primary" @click="taskReject"> </el-button>
</span>
</el-dialog>
</el-card>
</div>
</template>
<script>
import { flowXmlAndNode, getProcessVariables } from '@/api/flowable/definition'
import { flowRecord } from '@/api/flowable/finished'
import { complete, delegate, flowTaskForm, getNextFlowNode, rejectTask, returnList, returnTask } from '@/api/flowable/todo'
import { getRtStuReentrySchoolByProcInsId, updateRtStuReentrySchool } from '@/api/routine/rtStuReentrySchool'
import { getClass } from '@/api/stuCQS/basedata/class'
import { getClassName } from '@/api/stuCQS/basedata/student'
import FlowRole from '@/components/flow/Role'
import FlowUser from '@/components/flow/User'
import Parser from '@/components/parser/Parser'
import download from '@/plugins/download'
import { checkRole } from '@/utils/permission'; // 权限判断函数
import { getMonth } from '@/utils/ruoyi'
import flow from '@/views/flowable/task/todo/detail/flow'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import pdf from 'vue-pdf'
export default {
name: 'DropOutIndex',
dicts: ['rt_penalty_type', 'rt_penalty_status', 'rt_quit_type', 'sys_teacher_kpi_filling_year', 'rt_logout_type', 'rt_transaction_type', 'rt_reentry_type'],
components: {
Parser,
flow,
FlowUser,
FlowRole,
pdf,
},
props: {},
data() {
return {
// 模型xml数据
xmlData: '',
flowData: {},
activeName: '1',
// 部门名称
deptName: undefined,
// 部门树选项
// 用户表格数据
userList: null,
defaultProps: {
children: 'children',
label: 'label',
},
// 查询参数
queryParams: {
deptId: undefined,
},
// 遮罩层
loading: true,
flowRecordList: [], // 流程流转数据
formConfCopy: {},
src: null,
rules: {
ideologicalEducation: [{ required: true, message: '请输入辅导员联系情况', trigger: 'blur' }],
instructionSchoolHours: [{ required: true, message: '请输入在校时间说明', trigger: 'blur' }],
ihandlingSuggestion: [{ required: true, message: '请输入辅导员处理意见', trigger: 'blur' }],
quitTime: [{ required: true, message: '请输入休学时间', trigger: 'blur' }],
reentryTime: [{ required: true, message: '请选择复学时间', trigger: 'blur' }],
reentryClass: [{ required: true, message: '请选择班级', trigger: 'blur' }],
reentryCause: [{ required: true, message: '请输入退学原因', trigger: 'blur' }],
reentryYear: [{ required: true, message: '请复学年份', trigger: 'blur' }],
reentryNumber: [{ required: true, message: '请输入复学文号', trigger: 'blur' }],
quitCategory: [{ required: true, message: '请选择休学类别', trigger: 'blur' }],
}, // 表单校验
variablesForm: {}, // 流程变量数据
taskForm: {
returnTaskShow: false, // 是否展示回退表单
delegateTaskShow: false, // 是否展示回退表单
defaultTaskShow: true, // 默认处理
comment: '', // 意见内容
procInsId: '', // 流程实例编号
instanceId: '', // 流程实例编号
deployId: '', // 流程定义编号
taskId: '', // 流程任务编号
procDefId: '', // 流程编号
targetKey: '',
variables: {
variables: {},
},
penaltyNumber: '',
letterServiceContent: '',
violationDate: '',
relieveNumber: '',
dispositionServiceContent: '',
ideologicalEducation: '',
reentryClass: '',
},
assignee: null,
formConf: {}, // 默认表单数据
variables: [], // 流程变量数据
variablesData: {}, // 流程变量数据
returnTaskList: [], // 回退列表数据
completeTitle: null,
completeOpen: false,
returnTitle: null,
returnOpen: false,
rejectOpen: false,
rejectTitle: null,
userData: [],
checkSendUser: false, // 是否展示人员选择模块
checkSendRole: false, // 是否展示角色选择模块
checkType: 'single', // 选择类型
taskName: null, // 任务节点
startUser: null, // 发起人信息,
multiInstanceVars: '', // 会签节点
formKeyExist: false, // 当前节点是否存在表单
// 表单参数:目前是考勤表单
form: {},
// 学生基础信息
stuInfo: {},
baseUrl: process.env.VUE_APP_BASE_API,
category: null, // 流程分类
dropOutForm: false, // 退学申请表单
dropOutShow: false, // 退学申请输入框显示
dropOutGLKSHShow: false, // 学生退学教育管理科审核
rejectBtn: true, //驳回按钮
dispositionServiceContent: '', //处分下文
pdfURL: '', // pdf路径
letterServiceContent: '', // 送达书文字
showFileDowload: false, //是否显示下载下文
quitCategoryOptions: [], //退学类别
classVlue1: [], //班级搜索选择
classVlue2: [], //班级添加修改选择
ClassNameList: [], //班级名称
showReentryProve: false, // 复学证明
}
},
created() {
if (this.$route.query) {
this.taskName = this.$route.query.taskName
this.startUser = this.$route.query.startUser
this.taskForm.deployId = this.$route.query.deployId
this.taskForm.taskId = this.$route.query.taskId
this.taskForm.procInsId = this.$route.query.procInsId
this.taskForm.executionId = this.$route.query.executionId
this.taskForm.instanceId = this.$route.query.procInsId
this.category = this.$route.query.category
// 如果任务名是其中的两个,则改变审批意见的输入框内容
if (this.category == 'reentry') {
this.dropOutForm = true
this.getRtStuReentrySchoolByProcInsId(this.taskForm.procInsId)
if (this.taskName == '辅导员提交申报') {
this.dropOutShow = true
}
if (this.taskName == '学生教育管理科审核') {
this.dropOutGLKSHShow = true
}
if (this.taskName == '辅导员接收' || this.taskName == '学生接收') {
this.showReentryProve = true
}
}
// 流程任务获取变量信息
if (this.taskForm.taskId) {
this.processVariables(this.taskForm.taskId)
this.getFlowTaskForm(this.taskForm.taskId)
}
this.getFlowRecordList(this.taskForm.procInsId, this.taskForm.deployId)
this.rejectBtn = !checkRole(['teststu'])
}
this.getClassNameList()
},
methods: {
reentryYearMethodFormat(row, column) {
return this.selectDictLabel(this.dict.type.sys_teacher_kpi_filling_year, row.reentryYear)
},
transactionTypeMethodFormat(row, column) {
return this.selectDictLabel(this.dict.type.rt_transaction_type, row.quitCategory)
},
reentrySchoolMethodFormat(row, column) {
return this.selectDictLabel(this.dict.type.rt_reentry_type, row.reentryType)
},
penaltyTypeMethodFormat(row, column) {
return this.selectDictLabel(this.dict.type.rt_penalty_type, row.penaltyType)
},
quitSchoolMethodFormat(row, column) {
return this.selectDictLabel(this.dict.type.rt_quit_type, row.dropOutType)
},
// 查询复学表单信息
getRtStuReentrySchoolByProcInsId(procInsId) {
getRtStuReentrySchoolByProcInsId(procInsId).then((res) => {
this.form = res.data
this.taskForm.dropOutType = this.form.dropOutType
// 开始时间
const quitTime = this.form.quitTime
// 结束时间
const reentryTime = this.form.reentryTime
//帮我根据开始时间和结束时间,计算这两个时间段的月份
const month = getMonth(quitTime, reentryTime)
this.form.month = month
if (this.form.reentryClass) {
getClass(this.form.reentryClass).then((res) => {
this.form.className = res.data.className
})
}
})
},
handleClick(tab, event) {
if (tab.name === '3') {
flowXmlAndNode({ procInsId: this.taskForm.procInsId, deployId: this.taskForm.deployId }).then((res) => {
this.flowData = res.data
})
}
},
setIcon(val) {
if (val) {
return 'el-icon-check'
} else {
return 'el-icon-time'
}
},
setColor(val) {
if (val) {
return '#2bc418'
} else {
return '#b3bdbb'
}
},
// 用户信息选中数据
handleUserSelect(selection) {
if (selection) {
if (selection instanceof Array) {
const selectVal = selection.map((item) => item.userId)
if (this.multiInstanceVars) {
this.$set(this.taskForm.variables, this.multiInstanceVars, selectVal)
} else {
this.$set(this.taskForm.variables, 'approval', selectVal.join(','))
}
} else {
this.$set(this.taskForm.variables, 'approval', selection.userId.toString())
}
}
},
// 角色信息选中数据
handleRoleSelect(selection) {
if (selection) {
if (selection instanceof Array) {
const selectVal = selection.map((item) => item.roleId)
this.$set(this.taskForm.variables, 'approval', selectVal.join(','))
} else {
this.$set(this.taskForm.variables, 'approval', selection)
}
}
},
/** 流程流转记录 */
getFlowRecordList(procInsId, deployId) {
const that = this
const params = { procInsId: procInsId, deployId: deployId }
flowRecord(params)
.then((res) => {
that.flowRecordList = res.data.flowList
})
.catch((res) => {
this.goBack()
})
},
fillFormData(form, data) {
form.fields.forEach((item) => {
const val = data[item.__vModel__]
if (val) {
item.__config__.defaultValue = val
}
})
},
/** 获取流程变量内容 */
processVariables(taskId) {
if (taskId) {
// 提交流程申请时填写的表单存入了流程变量中后续任务处理时需要展示
getProcessVariables(taskId).then((res) => {
this.variablesData = res.data.variables
})
}
},
/** 流程节点表单 */
getFlowTaskForm(taskId) {
if (taskId) {
// 提交流程申请时填写的表单存入了流程变量中后续任务处理时需要展示
flowTaskForm({ taskId: taskId }).then((res) => {
this.variablesData = res.data.formData
this.taskForm.variables = res.data.formData
this.formKeyExist = res.data.formKeyExist
})
}
},
/** 加载审批任务弹框 */
handleComplete() {
// this.completeOpen = true;
// this.completeTitle = "流程审批";
this.submitForm(null)
},
/** 用户审批任务 */
taskComplete() {
// if (!this.taskForm.variables && this.checkSendUser) {
// this.$modal.msgError('请选择流程接收人员!')
// return
// }
// if (!this.taskForm.variables && this.checkSendRole) {
// this.$modal.msgError('请选择流程接收角色组!')
// return
// }
this.$refs['taskForm'].validate((valid) => {
if (valid) {
this.$modal.loading('正在努力加载中,请稍等。。。')
this.taskForm.comment = '同意'
// 流程设计人员类型配置为固定人员接收任务时,直接提交任务到下一步
complete(this.taskForm).then((response) => {
if (this.taskName == '辅导员提交申报' && this.category == 'reentry') {
this.form.ideologicalEducation = this.taskForm.ideologicalEducation
this.form.instructionSchoolHours = this.taskForm.instructionSchoolHours
this.form.ihandlingSuggestion = this.taskForm.ihandlingSuggestion
this.form.quitTime = this.taskForm.quitTime
this.form.reentryTime = this.taskForm.reentryTime
this.form.reentryClass = this.taskForm.reentryClass[2]
this.updateRtStuReentrySchool()
} else if (this.taskName == '学生教育管理科审核' && this.category == 'reentry') {
// 学生教育管理科审核,赋值
this.form.reentryCause = this.taskForm.reentryCause
this.form.reentryYear = this.taskForm.reentryYear
this.form.reentryNumber = this.taskForm.reentryNumber
this.form.quitCategory = this.taskForm.quitCategory
this.updateRtStuReentrySchool()
} else {
this.$modal.msgSuccess(response.msg)
}
this.$modal.closeLoading()
this.goBack()
})
}
})
},
updateRtStuReentrySchool() {
console.log(this.form)
updateRtStuReentrySchool(this.form).then((response) => {
this.$modal.msgSuccess(response.msg)
})
},
/** 委派任务 */
handleDelegate() {
this.taskForm.delegateTaskShow = true
this.taskForm.defaultTaskShow = false
},
handleAssign() {},
/** 返回页面 */
goBack() {
// 关闭当前标签页并返回上个页面
const obj = { path: '/task/todo', query: { t: Date.now() } }
console.log(obj)
this.$tab.closeOpenPage(obj)
},
/** 驳回任务 */
handleReject() {
this.rejectOpen = true
this.rejectTitle = '驳回流程'
},
/** 驳回任务 */
taskReject() {
this.$refs['taskForm'].validate((valid) => {
if (valid) {
rejectTask(this.taskForm).then((res) => {
this.$modal.msgSuccess(res.msg)
this.goBack()
})
}
})
},
/** 可退回任务列表 */
handleReturn() {
this.returnOpen = true
this.returnTitle = '退回流程'
returnList(this.taskForm).then((res) => {
this.returnTaskList = res.data
this.taskForm.variables = null
})
},
/** 提交退回任务 */
taskReturn() {
this.$refs['taskForm'].validate((valid) => {
if (valid) {
returnTask(this.taskForm).then((res) => {
this.$modal.msgSuccess(res.msg)
this.goBack()
})
}
})
},
/** 取消回退任务按钮 */
cancelTask() {
this.taskForm.returnTaskShow = false
this.taskForm.defaultTaskShow = true
this.returnTaskList = []
},
/** 委派任务 */
submitDeleteTask() {
this.$refs['taskForm'].validate((valid) => {
if (valid) {
delegate(this.taskForm).then((response) => {
this.$modal.msgSuccess(response.msg)
this.goBack()
})
}
})
},
/** 取消回退任务按钮 */
cancelDelegateTask() {
this.taskForm.delegateTaskShow = false
this.taskForm.defaultTaskShow = true
this.returnTaskList = []
},
/** 申请流程表单数据提交 */
submitForm(formData) {
// 根据当前任务或者流程设计配置的下一步节点 todo 暂时未涉及到考虑网关、表达式和多节点情况
const params = { taskId: this.taskForm.taskId }
getNextFlowNode(params).then((res) => {
const data = res.data
this.taskForm.formData = formData
// if (data) {
// if (data.dataType === 'dynamic') {
// if (data.type === 'assignee') { // 指定人员
// this.checkSendUser = true;
// this.checkType = "single";
// } else if (data.type === 'candidateUsers') { // 候选人员(多个)
// this.checkSendUser = true;
// this.checkType = "multiple";
// } else if (data.type === 'candidateGroups') { // 指定组(所属角色接收任务)
// this.checkSendRole = true;
// } else { // 会签
// // 流程设计指定的 elementVariable 作为会签人员列表
// this.multiInstanceVars = data.vars;
// this.checkSendUser = true;
// this.checkType = "multiple";
// }
// }
// }
this.completeOpen = true
this.completeTitle = '流程审批'
})
},
fileUpload() {
download.resource(this.pdfURL)
},
getClassNameList() {
getClassName().then((res) => {
this.ClassNameList = res.data
})
},
//搜索班级选择
handleChange1(value) {
this.form.reentryClass = value[2]
console.log('班级', value[2])
},
},
}
</script>
<style lang="scss" scoped>
.test-form {
margin: 15px auto;
width: 800px;
padding: 15px;
}
.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;
}
.my-label {
background: #e1f3d8;
}
.indented-text {
text-indent: 1em;
}
.gongzhang {
margin-right: 10px;
margin-bottom: 10px;
position: relative;
}
.gongzhang img {
position: absolute;
top: -20px;
/* 根据需要调整图片的垂直位置 */
left: 0;
/* 根据需要调整图片的水平位置 */
}
.gongzhang p {
margin-top: 20px;
/* 根据需要调整两个 p 标签之间的垂直距离 */
}
.certificate-service {
.desc {
text-indent: 2em;
}
.stamp {
text-align: right;
& > div {
margin-top: -70px;
margin-right: 25px;
}
img {
width: 120px;
height: 120px;
}
}
}
.certificate {
padding: 0 50px;
h1 {
text-align: center;
font-size: 34px;
}
h4 {
text-align: center;
color: #868585;
}
p {
text-indent: 32px;
line-height: 30px;
color: #333;
letter-spacing: 2px;
}
.stamp {
position: relative;
height: 115px;
margin-top: 50px;
display: flex;
flex-direction: column;
color: #333;
line-height: 35px;
letter-spacing: 3px;
align-items: flex-end;
& > div {
display: flex;
flex-direction: column;
margin-right: 28px;
}
img {
width: 180px;
height: 180px;
top: -54px;
position: absolute;
z-index: -1;
}
}
}
</style>