You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
318 lines
8.6 KiB
318 lines
8.6 KiB
2 years ago
|
<!--
|
||
|
|
@ 作者: 秦东
|
||
|
|
@ 时间: 2023-12-01 13:57:39
|
||
|
|
@ 备注: 流程结束后进行数据修改
|
||
|
|
-->
|
||
|
|
<script lang='ts' setup>
|
||
|
|
import { submitButton, afreshSubmitButton,editFormCont,draftSubmitButton } from "@/utils/workflow/const";
|
||
|
|
import {
|
||
|
|
json2string,
|
||
|
|
objToStringify,
|
||
|
|
string2json,
|
||
|
|
stringToObj
|
||
|
|
} from '@/utils/DesignForm/form'
|
||
|
|
import { haveCustomerFormVersion,generateFlow } from '@/api/taskapi/management'
|
||
|
|
import RunFlowStep from '@/views/taskplatform/taskmanagement/runFlowStep.vue'
|
||
|
|
import { judgeSubmitCancel,startRunFlow,afreshRunFlow,onlyPublishFlow,gainEditFormFlowInfo } from '@/api/DesignForm/requestapi'
|
||
|
|
const props = defineProps({
|
||
|
|
isshow:{
|
||
|
|
type:Boolean,
|
||
|
|
default:true
|
||
|
|
},
|
||
|
|
drawerWith:{
|
||
|
|
type:Number,
|
||
|
|
default:0
|
||
|
|
},
|
||
|
|
flowLogInfo:{
|
||
|
|
type:Object,
|
||
|
|
default(){
|
||
|
|
return {}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
operState:{
|
||
|
|
type:Number,
|
||
|
|
default:1
|
||
|
|
}
|
||
|
|
})
|
||
|
|
const flowAry = ref<any[]>();
|
||
|
|
const emits = defineEmits(["update:isshow","getmytodolist"]);
|
||
|
|
const isOpen = computed({
|
||
|
|
get: () => props.isshow,
|
||
|
|
set: (val) => {
|
||
|
|
emits("update:isshow", val);
|
||
|
|
},
|
||
|
|
});
|
||
|
|
const logistrue = ref(false)
|
||
|
|
const formLoading = ref(false)
|
||
|
|
const loadingData = ref(false) //加载表单数据
|
||
|
|
const flowLoading = ref(false) //加载流程数据
|
||
|
|
const versiontitle = ref<any>("")
|
||
|
|
const flowMap = ref<any>()
|
||
|
|
const nextStep = ref(0)
|
||
|
|
const nodeKey = ref<string>('');
|
||
|
|
const currentProgress = ref<number>(1);
|
||
|
|
const newLogAry = ref<any>("")
|
||
|
|
const oldLogAry = ref<any>("")
|
||
|
|
//表单相关内容
|
||
|
|
const formState = reactive({
|
||
|
|
formData: {
|
||
|
|
list: [],
|
||
|
|
form: {},
|
||
|
|
config: {}
|
||
|
|
},
|
||
|
|
dict: {},
|
||
|
|
formId: 25,
|
||
|
|
id: 1,
|
||
|
|
loading: true
|
||
|
|
})
|
||
|
|
//获取表单内容
|
||
|
|
const gainFormData = () =>{
|
||
|
|
formLoading.value = true;
|
||
|
|
console.log("获取表单内容--->",props.flowLogInfo)
|
||
|
|
nextStep.value = props.flowLogInfo.nextStep
|
||
|
|
nodeKey.value = props.flowLogInfo.nodeKey;
|
||
|
|
currentProgress.value = props.flowLogInfo.currentStep
|
||
|
|
console.log("props.flowLogInfo--5-------->",props.flowLogInfo.mastesform)
|
||
|
|
formState.formData = stringToObj(props.flowLogInfo.mastesform)
|
||
|
|
// formState.formData.list.push(submitButton)
|
||
|
|
haveCustomerFormVersion({id:props.flowLogInfo.formVersionId})
|
||
|
|
.then(({ data }) =>{
|
||
|
|
console.log("res----------->",props.flowLogInfo.flowkeys, data)
|
||
|
|
// formState.formData = stringToObj(data.mastesform)
|
||
|
|
formState.dict = string2json(data.dict)
|
||
|
|
if(props.operState == 2 || props.operState == 3 || props.operState == 4){
|
||
|
|
judgeSubmitCancel({"name":data.mastesformjson})
|
||
|
|
.then((dataBut:any) =>{
|
||
|
|
console.log("res----判断按钮------->",dataBut,props.operState)
|
||
|
|
if(dataBut.code == 0){
|
||
|
|
// formState.formData.list.push(afreshSubmitButton)
|
||
|
|
// console.log("res----判断按钮------->",dataBut,props.operState)
|
||
|
|
if (dataBut.data == 3 || dataBut.data == 4){
|
||
|
|
|
||
|
|
if(props.operState == 2){
|
||
|
|
formState.formData.list.push(afreshSubmitButton)
|
||
|
|
}else if(props.operState == 3){
|
||
|
|
formState.formData.list.push(editFormCont)
|
||
|
|
}else if(props.operState == 4){
|
||
|
|
formState.formData.list.push(draftSubmitButton)
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
})
|
||
|
|
}
|
||
|
|
nextTick(() => {
|
||
|
|
// formEl.value.getEditData({ id: props.flowLogInfo.flowkeys,version: props.flowLogInfo.formVersionId})
|
||
|
|
|
||
|
|
// formState.loading = false
|
||
|
|
})
|
||
|
|
formLoading.value = false
|
||
|
|
})
|
||
|
|
.finally(() => {
|
||
|
|
gainEditFormFlowInfo({ id: props.flowLogInfo.flowkeys})
|
||
|
|
.then((data:any)=>{
|
||
|
|
console.log("res----获得数据回显------->",data)
|
||
|
|
formEl.value.setValue(data.data.masterDataInfo)
|
||
|
|
newLogAry.value = data.data.newData
|
||
|
|
oldLogAry.value = data.data.oldData
|
||
|
|
logistrue.value = data.data.logistrue
|
||
|
|
})
|
||
|
|
|
||
|
|
})
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
const formType = computed(() => {
|
||
|
|
// 带有参数id为编辑状态
|
||
|
|
if (true) {
|
||
|
|
return 2
|
||
|
|
} else {
|
||
|
|
return 1
|
||
|
|
}
|
||
|
|
// return props.operState
|
||
|
|
})
|
||
|
|
|
||
|
|
const formEl = ref<any>()
|
||
|
|
const drawerBeforeClose = () => {
|
||
|
|
console.log("监听打开关闭",false)
|
||
|
|
emits("getmytodolist")
|
||
|
|
emits("update:isshow", false);
|
||
|
|
}
|
||
|
|
//关闭拉窗
|
||
|
|
const closeAppSubmit = () => {
|
||
|
|
drawerBeforeClose();
|
||
|
|
}
|
||
|
|
onMounted(()=>{
|
||
|
|
versiontitle.value = "修改" + props.flowLogInfo.title + "数据"
|
||
|
|
flowMap.value = JSON.parse(props.flowLogInfo.flowcont)
|
||
|
|
gainFormData()
|
||
|
|
})
|
||
|
|
</script>
|
||
|
|
<template>
|
||
|
|
<el-drawer v-model="isOpen" v-loading="loadingData" element-loading-my-text="Loading..." :title="versiontitle" :close-on-click-modal="false" :close-on-press-escape="false" :destroy-on-close="true" :size="props.drawerWith" class="drawerClass" :before-close="drawerBeforeClose">
|
||
|
|
<table border="0" class="tableFlowBox">
|
||
|
|
<tr>
|
||
|
|
<td valign="top">
|
||
|
|
<div class="drawerFormBox boxLeft">
|
||
|
|
|
||
|
|
<ak-form
|
||
|
|
ref="formEl"
|
||
|
|
v-loading="formLoading" element-loading-text="Loading..."
|
||
|
|
:form-data="formState.formData"
|
||
|
|
:type="formType"
|
||
|
|
:dict="formState.dict"
|
||
|
|
request-url="getFormContent"
|
||
|
|
add-url="saveFormContent"
|
||
|
|
edit-url="editFormContent"
|
||
|
|
:submit-edit="submitEdit"
|
||
|
|
:close-app-submit="closeAppSubmit"
|
||
|
|
/>
|
||
|
|
|
||
|
|
<el-divider v-if="logistrue" content-position="left">修改记录{{logistrue}}}</el-divider>
|
||
|
|
<el-timeline>
|
||
|
|
<el-timeline-item v-if="newLogAry.length > 0" :timestamp="newLogAry.logTime" placement="top">
|
||
|
|
<el-card>
|
||
|
|
<el-descriptions
|
||
|
|
direction="vertical"
|
||
|
|
:column="4"
|
||
|
|
size="24px"
|
||
|
|
border
|
||
|
|
>
|
||
|
|
<div v-for="(item,index) in newLogAry" :key="index">
|
||
|
|
<el-descriptions-item v-if="!Array.isArray(item)&&index!='logTime'" :label="index">
|
||
|
|
{{ item }}
|
||
|
|
</el-descriptions-item>
|
||
|
|
<el-descriptions-item v-if="Array.isArray(item)&&index!='logTime'" :label="index" span="4">
|
||
|
|
|
||
|
|
<el-descriptions
|
||
|
|
|
||
|
|
direction="vertical"
|
||
|
|
:column="4"
|
||
|
|
size="24px"
|
||
|
|
border
|
||
|
|
>
|
||
|
|
<el-descriptions-item v-for="(items,indexs) in item[0]" :key="indexs" :label="indexs">
|
||
|
|
{{ items }}
|
||
|
|
</el-descriptions-item>
|
||
|
|
</el-descriptions>
|
||
|
|
|
||
|
|
</el-descriptions-item>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</el-descriptions>
|
||
|
|
|
||
|
|
</el-card>
|
||
|
|
</el-timeline-item>
|
||
|
|
|
||
|
|
<el-timeline-item v-for="itemss in oldLogAry" :key="itemss.id" :timestamp="itemss.logTime" placement="top">
|
||
|
|
<el-card>
|
||
|
|
<el-descriptions
|
||
|
|
direction="vertical"
|
||
|
|
:column="4"
|
||
|
|
size="24px"
|
||
|
|
border
|
||
|
|
>
|
||
|
|
<div v-for="(item,index) in itemss" :key="index">
|
||
|
|
<el-descriptions-item v-if="!Array.isArray(item)&&index!='logTime'" :label="index">
|
||
|
|
{{ item }}
|
||
|
|
</el-descriptions-item>
|
||
|
|
<el-descriptions-item v-if="Array.isArray(item)&&index!='logTime'" :label="index" span="4">
|
||
|
|
|
||
|
|
<el-descriptions
|
||
|
|
|
||
|
|
direction="vertical"
|
||
|
|
:column="4"
|
||
|
|
size="24px"
|
||
|
|
border
|
||
|
|
>
|
||
|
|
<el-descriptions-item v-for="(items,indexs) in item[0]" :key="indexs" :label="indexs">
|
||
|
|
{{ items }}
|
||
|
|
</el-descriptions-item>
|
||
|
|
</el-descriptions>
|
||
|
|
|
||
|
|
</el-descriptions-item>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</el-descriptions>
|
||
|
|
</el-card>
|
||
|
|
</el-timeline-item>
|
||
|
|
|
||
|
|
</el-timeline>
|
||
|
|
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</td>
|
||
|
|
<td valign="top" width="350">
|
||
|
|
<RunFlowStep ref="runstep" v-model:flowary="flowAry" :flow-key="props.flowLogInfo.flowkeys" :current-progress="currentProgress" @updatelist="drawerBeforeClose" />
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
</table>
|
||
|
|
</el-drawer>
|
||
|
|
</template>
|
||
|
|
<style lang='scss' scoped>
|
||
|
|
.tableFlowBox{
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
// background-color: #000000;
|
||
|
|
.drawerFormBox{
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
// background-color: #ff0000;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.boxLeft{
|
||
|
|
padding: 0 10px 0 15px;
|
||
|
|
overflow: hidden;
|
||
|
|
overflow-y: auto;
|
||
|
|
}
|
||
|
|
.flowBox{
|
||
|
|
padding: 0 5px 0 10px;
|
||
|
|
}
|
||
|
|
.boxRight{
|
||
|
|
overflow: hidden;
|
||
|
|
overflow-y: auto;
|
||
|
|
border-left: 1px solid #EEEEEE;
|
||
|
|
}
|
||
|
|
.approvalBoard{
|
||
|
|
padding: 5px 10px;
|
||
|
|
background-color: #FFFFFF;
|
||
|
|
border-top: 1px solid #EEEEEE;
|
||
|
|
.juzhong{
|
||
|
|
padding: 10px 0;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
.appBoardTitle{
|
||
|
|
padding: 5px 0 10px 0;
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<style lang='scss'>
|
||
|
|
|
||
|
|
.drawerClass ::v-deep.el-drawer__header {
|
||
|
|
font-size: 22px;
|
||
|
|
text-align: center;
|
||
|
|
margin-bottom: 0px;
|
||
|
|
padding: 0;
|
||
|
|
.el-drawer__close-btn{
|
||
|
|
background-color: rgb(255, 77, 79);
|
||
|
|
color: white;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
::v-deep .el-drawer__body {
|
||
|
|
padding: 0px;
|
||
|
|
}
|
||
|
|
.details {
|
||
|
|
width: 80%;
|
||
|
|
margin-right: 0px;
|
||
|
|
margin-left: 20%;
|
||
|
|
box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);
|
||
|
|
}
|
||
|
|
.drawerBody{
|
||
|
|
padding: 20px;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
</style>
|
||
|
|
|