|
|
|
@ -3,144 +3,156 @@ |
|
|
|
@ 时间: 2024-04-03 13:39:16 |
|
|
|
@ 备注: 列表内容展示 |
|
|
|
--> |
|
|
|
<script lang='ts' setup> |
|
|
|
import { submitButton, afreshSubmitButton,editFormCont,draftSubmitButton,editLookFormCont } from "@/utils/workflow/const"; |
|
|
|
import { json2string,objToStringify,string2json,stringToObj } from '@/utils/DesignForm/form' |
|
|
|
import { gainTaskFormInfo,generateFlow,gainEditDataLog,draftsInitiateApproval,afreshRunWorkflow } from '@/api/taskapi/management' |
|
|
|
import { Close } from '@element-plus/icons-vue' |
|
|
|
import { judgeSubmitCancel,startRunFlow } from '@/api/DesignForm/requestapi' |
|
|
|
import { submitButtonEs } from '@/api/DesignForm/tableButton' |
|
|
|
<script lang="ts" setup> |
|
|
|
import { |
|
|
|
constFormBtnEvent, |
|
|
|
constFormProps |
|
|
|
} from '@/api/DesignForm/utils' |
|
|
|
|
|
|
|
import RunFlowStep from '@/views/taskplatform/taskmanagement/runFlowStep.vue' |
|
|
|
submitButton, |
|
|
|
afreshSubmitButton, |
|
|
|
editFormCont, |
|
|
|
draftSubmitButton, |
|
|
|
editLookFormCont, |
|
|
|
} from "@/utils/workflow/const"; |
|
|
|
import { |
|
|
|
json2string, |
|
|
|
objToStringify, |
|
|
|
string2json, |
|
|
|
stringToObj, |
|
|
|
} from "@/utils/DesignForm/form"; |
|
|
|
import { |
|
|
|
gainTaskFormInfo, |
|
|
|
generateFlow, |
|
|
|
gainEditDataLog, |
|
|
|
draftsInitiateApproval, |
|
|
|
afreshRunWorkflow, |
|
|
|
} from "@/api/taskapi/management"; |
|
|
|
import { Close } from "@element-plus/icons-vue"; |
|
|
|
import { judgeSubmitCancel, startRunFlow } from "@/api/DesignForm/requestapi"; |
|
|
|
import { submitButtonEs } from "@/api/DesignForm/tableButton"; |
|
|
|
import { constFormBtnEvent, constFormProps } from "@/api/DesignForm/utils"; |
|
|
|
|
|
|
|
import RunFlowStep from "@/views/taskplatform/taskmanagement/runFlowStep.vue"; |
|
|
|
|
|
|
|
const props = defineProps({ |
|
|
|
isShow:{ |
|
|
|
type:Boolean, |
|
|
|
default:false, |
|
|
|
isShow: { |
|
|
|
type: Boolean, |
|
|
|
default: false, |
|
|
|
}, |
|
|
|
drawerWith:{ |
|
|
|
type:Number, |
|
|
|
default:0 |
|
|
|
drawerWith: { |
|
|
|
type: Number, |
|
|
|
default: 0, |
|
|
|
}, |
|
|
|
tablePageClass:{ |
|
|
|
type:Number, |
|
|
|
default:1 |
|
|
|
tablePageClass: { |
|
|
|
type: Number, |
|
|
|
default: 1, |
|
|
|
}, |
|
|
|
operState: { |
|
|
|
type: Number, |
|
|
|
default: 1, |
|
|
|
}, |
|
|
|
pageInfo: { |
|
|
|
type: Object, |
|
|
|
default() { |
|
|
|
return {}; |
|
|
|
}, |
|
|
|
operState:{ |
|
|
|
type:Number, |
|
|
|
default:1 |
|
|
|
}, |
|
|
|
pageInfo:{ |
|
|
|
type:Object, |
|
|
|
default(){ |
|
|
|
return {} |
|
|
|
} |
|
|
|
} |
|
|
|
}); |
|
|
|
const formEl = ref<any>(); |
|
|
|
const emits = defineEmits(["update:isShow","getPageData"]); |
|
|
|
const emits = defineEmits(["update:isShow", "getPageData"]); |
|
|
|
const formLoading = ref(false); |
|
|
|
const flowAry = ref<any[]>(); //流程列表 |
|
|
|
const currentProgress = ref<number>(1); //当前步进值 |
|
|
|
const runstep = ref(null) |
|
|
|
const runstep = ref(null); |
|
|
|
//表单ID |
|
|
|
const openOfClose = computed({ |
|
|
|
get() { |
|
|
|
return props.isShow |
|
|
|
return props.isShow; |
|
|
|
}, |
|
|
|
set(val: boolean) { |
|
|
|
emits('update:isShow', val) |
|
|
|
} |
|
|
|
emits("update:isShow", val); |
|
|
|
}, |
|
|
|
}); |
|
|
|
const formProps = inject(constFormProps, {}) as any |
|
|
|
const formProps = inject(constFormProps, {}) as any; |
|
|
|
/** |
|
|
|
@ 作者: 秦东 |
|
|
|
@ 时间: 2024-04-03 14:09:24 |
|
|
|
@ 功能: 监听状态变化处理数据 |
|
|
|
*/ |
|
|
|
watch(()=>props.isShow,(val:bool)=>{ |
|
|
|
|
|
|
|
if(val){ |
|
|
|
watch( |
|
|
|
() => props.isShow, |
|
|
|
(val: bool) => { |
|
|
|
if (val) { |
|
|
|
formLoading.value = true; |
|
|
|
getCustomrrFormInfo(); |
|
|
|
} |
|
|
|
}) |
|
|
|
} |
|
|
|
); |
|
|
|
/** |
|
|
|
@ 作者: 秦东 |
|
|
|
@ 时间: 2024-04-03 14:25:15 |
|
|
|
@ 功能: 关闭抽屉 |
|
|
|
*/ |
|
|
|
const closeDrawer = () => { |
|
|
|
emits('update:isShow', false) |
|
|
|
} |
|
|
|
emits("update:isShow", false); |
|
|
|
}; |
|
|
|
|
|
|
|
//表单相关内容 |
|
|
|
const formState = reactive({ |
|
|
|
formData: { |
|
|
|
list: [], |
|
|
|
form: {}, |
|
|
|
config: {} |
|
|
|
config: {}, |
|
|
|
}, |
|
|
|
dict: {}, |
|
|
|
formId: props.pageInfo.id, |
|
|
|
id: 1, |
|
|
|
loading: true |
|
|
|
}) |
|
|
|
const pageLog = ref<any[]>([]) |
|
|
|
loading: true, |
|
|
|
}); |
|
|
|
const pageLog = ref<any[]>([]); |
|
|
|
/** |
|
|
|
@ 作者: 秦东 |
|
|
|
@ 时间: 2024-04-03 14:33:15 |
|
|
|
@ 功能: 获取自定义表单内容 |
|
|
|
*/ |
|
|
|
const getCustomrrFormInfo = () => { |
|
|
|
gainTaskFormInfo({id:props.pageInfo.masters_key}) |
|
|
|
.then(({data})=>{ |
|
|
|
// console.log("获取自定义表单内容",data,data.structure) |
|
|
|
formState.formData = stringToObj(data.structure.mastesform) |
|
|
|
gainTaskFormInfo({ id: props.pageInfo.masters_key }) |
|
|
|
.then(({ data }) => { |
|
|
|
console.log("获取自定义表单内容", data, data.structure); |
|
|
|
formState.formData = stringToObj(data.structure.mastesform); |
|
|
|
// console.log("获取自定义表单内容--->",formState) |
|
|
|
formState.dict = string2json(data.structure.dict) |
|
|
|
formState.dict = string2json(data.structure.dict); |
|
|
|
// formState.formData.list.push(editLookFormCont) |
|
|
|
if(props.tablePageClass != 4){ |
|
|
|
judgeSubmitCancel({"name":data.structure.mastesformjson}) |
|
|
|
.then((data:any) =>{ |
|
|
|
if(data.code == 0){ |
|
|
|
if (data.data == 3 || data.data == 4){ |
|
|
|
if (props.tablePageClass != 4) { |
|
|
|
judgeSubmitCancel({ name: data.structure.mastesformjson }).then((data: any) => { |
|
|
|
if (data.code == 0) { |
|
|
|
if (data.data == 3 || data.data == 4) { |
|
|
|
// formState.formData.list.push(submitButtonEs) |
|
|
|
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) |
|
|
|
}else if(props.operState == 5){ |
|
|
|
formState.formData.list.push(submitButtonEs) |
|
|
|
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); |
|
|
|
} else if (props.operState == 5) { |
|
|
|
formState.formData.list.push(submitButtonEs); |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
}) |
|
|
|
}); |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
nextTick(()=>{ |
|
|
|
// console.log("获取自定义表单内容-1111-->",data.tableData) |
|
|
|
formEl.value.setValue(data.tableData) |
|
|
|
}) |
|
|
|
nextTick(() => { |
|
|
|
// console.log("获取自定义表单内容-1111-->", formEl.value, data.tableData); |
|
|
|
formEl.value.setValue(data.tableData); |
|
|
|
}); |
|
|
|
}) |
|
|
|
.finally(()=>{ |
|
|
|
.finally(() => { |
|
|
|
formLoading.value = false; |
|
|
|
//alert(props.pageInfo.masters_key) |
|
|
|
gainEditDataLog({id:props.pageInfo.masters_key}) |
|
|
|
.then(({data})=>{ |
|
|
|
gainEditDataLog({ id: props.pageInfo.masters_key }).then(({ data }) => { |
|
|
|
// console.log("获取修改记录-1111-->",data) |
|
|
|
pageLog.value = data |
|
|
|
pageLog.value = data; |
|
|
|
}); |
|
|
|
}) |
|
|
|
} |
|
|
|
}); |
|
|
|
}; |
|
|
|
/** |
|
|
|
@ 作者: 秦东 |
|
|
|
@ 时间: 2024-04-07 10:55:34 |
|
|
|
@ -148,97 +160,94 @@ const getCustomrrFormInfo = () => { |
|
|
|
*/ |
|
|
|
const afterSubmit = (type: string) => { |
|
|
|
// console.log("表单提交成功") |
|
|
|
if (type === 'success') { |
|
|
|
if (type === "success") { |
|
|
|
// router.go(-1) |
|
|
|
// console.log("表单提交成功") |
|
|
|
emits("getPageData"); |
|
|
|
closeDrawer(); |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
}; |
|
|
|
const closeAppSubmit = () => { |
|
|
|
closeDrawer() |
|
|
|
} |
|
|
|
closeDrawer(); |
|
|
|
}; |
|
|
|
//流程执行 |
|
|
|
const drawerBeforeClose = () => { |
|
|
|
// console.log("监听打开关闭",false) |
|
|
|
// emits("getmytodolist") |
|
|
|
// emits("update:isshow", false); |
|
|
|
} |
|
|
|
}; |
|
|
|
//提交审批 |
|
|
|
const sendDraftSubmit = (type: string,val?:any) => { |
|
|
|
const sendDraftSubmit = (type: string, val?: any) => { |
|
|
|
// console.log("提交审批",type,val) |
|
|
|
// emits("getmytodolist") |
|
|
|
if (type === 'success') { |
|
|
|
if(props.pageInfo.flowIsOpen == 1){ |
|
|
|
let sendInfo ={ |
|
|
|
id:val.data.runFlowId, |
|
|
|
flowList:flowAry.value, |
|
|
|
state:3 |
|
|
|
} |
|
|
|
if (type === "success") { |
|
|
|
if (props.pageInfo.flowIsOpen == 1) { |
|
|
|
let sendInfo = { |
|
|
|
id: val.data.runFlowId, |
|
|
|
flowList: flowAry.value, |
|
|
|
state: 3, |
|
|
|
}; |
|
|
|
// console.log("草稿提交审批--1-<",sendInfo) |
|
|
|
draftsInitiateApproval(sendInfo) |
|
|
|
.then((data:any) =>{ |
|
|
|
draftsInitiateApproval(sendInfo).then((data: any) => { |
|
|
|
// console.log("草稿提交审批---<",sendInfo,data) |
|
|
|
if(data.code == 0){ |
|
|
|
ElMessage.success(data.msg || '提交成功!') |
|
|
|
if(runstep.value){ |
|
|
|
runstep.value.gainRunFlowTask() |
|
|
|
if (data.code == 0) { |
|
|
|
ElMessage.success(data.msg || "提交成功!"); |
|
|
|
if (runstep.value) { |
|
|
|
runstep.value.gainRunFlowTask(); |
|
|
|
} |
|
|
|
emits("getPageData"); |
|
|
|
closeDrawer() |
|
|
|
closeDrawer(); |
|
|
|
} |
|
|
|
}) |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
}; |
|
|
|
//保存草稿箱(带流程) |
|
|
|
const saveEditFormInfo = (type: string,val?:any) => { |
|
|
|
const saveEditFormInfo = (type: string, val?: any) => { |
|
|
|
// console.log("草稿提交审批--1-<",type,val) |
|
|
|
if(type == "success"){ |
|
|
|
runstep.value.gainRunFlowTask() |
|
|
|
if (type == "success") { |
|
|
|
runstep.value.gainRunFlowTask(); |
|
|
|
emits("getPageData"); |
|
|
|
closeDrawer() |
|
|
|
closeDrawer(); |
|
|
|
} |
|
|
|
} |
|
|
|
}; |
|
|
|
|
|
|
|
//重新提交审核 |
|
|
|
const anewSubmit = (type: string,val?:any) => { |
|
|
|
const anewSubmit = (type: string, val?: any) => { |
|
|
|
// console.log("重新提交数据-11--<",type,val) |
|
|
|
if(type == "success"){ |
|
|
|
afreshRunWorkflow({id:val.data.runFlowId}) |
|
|
|
.then((data:any) => { |
|
|
|
if (type == "success") { |
|
|
|
afreshRunWorkflow({ id: val.data.runFlowId }) |
|
|
|
.then((data: any) => { |
|
|
|
// console.log("重新提交数据---<",data,runstep.value) |
|
|
|
runstep.value.gainRunFlowTask() |
|
|
|
runstep.value.gainRunFlowTask(); |
|
|
|
}) |
|
|
|
.finally(() => { |
|
|
|
emits("getPageData"); |
|
|
|
closeDrawer() |
|
|
|
}) |
|
|
|
closeDrawer(); |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
}; |
|
|
|
/** |
|
|
|
@ 作者: 秦东 |
|
|
|
@ 时间: 2024-04-11 11:35:24 |
|
|
|
@ 功能: 申请修改 |
|
|
|
*/ |
|
|
|
//修改完毕 |
|
|
|
const submitEdit = (type: string,val?:any) => { |
|
|
|
const submitEdit = (type: string, val?: any) => { |
|
|
|
// console("修改完毕----->",type,val) |
|
|
|
if(type == "success"){ |
|
|
|
runstep.value.gainRunFlowTask() |
|
|
|
if (type == "success") { |
|
|
|
runstep.value.gainRunFlowTask(); |
|
|
|
emits("getPageData"); |
|
|
|
closeDrawer() |
|
|
|
closeDrawer(); |
|
|
|
} |
|
|
|
} |
|
|
|
}; |
|
|
|
const jsuanKuandu = () => { |
|
|
|
if(props.pageInfo.flowIsOpen==1){ |
|
|
|
return 900 + 350 |
|
|
|
}else{ |
|
|
|
return 900 |
|
|
|
if (props.pageInfo.flowIsOpen == 1) { |
|
|
|
return 900 + 350; |
|
|
|
} else { |
|
|
|
return 900; |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
}; |
|
|
|
</script> |
|
|
|
<template> |
|
|
|
<el-drawer |
|
|
|
@ -250,14 +259,13 @@ const jsuanKuandu = () => { |
|
|
|
:close-on-press-escape="false" |
|
|
|
:destroy-on-close="true" |
|
|
|
> |
|
|
|
<div v-if="props.pageInfo.flowIsOpen==1" class="common-layout"> |
|
|
|
|
|
|
|
<div v-if="props.pageInfo.flowIsOpen == 1" class="common-layout"> |
|
|
|
<el-container> |
|
|
|
<el-main> |
|
|
|
|
|
|
|
<ak-form |
|
|
|
ref="formEl" |
|
|
|
v-loading="formLoading" element-loading-text="Loading..." |
|
|
|
v-loading="formLoading" |
|
|
|
element-loading-text="Loading..." |
|
|
|
:form-data="formState.formData" |
|
|
|
:type="props.tablePageClass" |
|
|
|
:dict="formState.dict" |
|
|
|
@ -267,33 +275,57 @@ const jsuanKuandu = () => { |
|
|
|
:before-submit="beforeSubmit" |
|
|
|
:close-app-submit="closeDrawer" |
|
|
|
:change-key-val="changeKeyVal" |
|
|
|
:anew-submit = "anewSubmit" |
|
|
|
:anew-submit="anewSubmit" |
|
|
|
:save-edit-form-info="saveEditFormInfo" |
|
|
|
:send-draft-submit= "sendDraftSubmit" |
|
|
|
:send-draft-submit="sendDraftSubmit" |
|
|
|
:after-submit="afterSubmit" |
|
|
|
:submit-edit="submitEdit" |
|
|
|
/> |
|
|
|
<el-divider v-if="pageLog&&pageLog.length > 0" content-position="left">历史记录</el-divider> |
|
|
|
<el-divider v-if="pageLog && pageLog.length > 0" content-position="left" |
|
|
|
>历史记录</el-divider |
|
|
|
> |
|
|
|
<el-timeline style="width: 100%"> |
|
|
|
<el-timeline-item v-for="(item,index) in pageLog" :key="index" :timestamp="item.time+' 操作人:'+item.creater" placement="top"> |
|
|
|
<el-timeline-item |
|
|
|
v-for="(item, index) in pageLog" |
|
|
|
:key="index" |
|
|
|
:timestamp="item.time + ' 操作人:' + item.creater" |
|
|
|
placement="top" |
|
|
|
> |
|
|
|
<el-card> |
|
|
|
<el-descriptions border> |
|
|
|
<el-descriptions-item v-for="(mastItem,mastIndex) in item.masterdata" :key="mastItem.label" :label="mastItem.label"> |
|
|
|
{{mastItem.label}} |
|
|
|
<el-descriptions-item |
|
|
|
v-for="(mastItem, mastIndex) in item.masterdata" |
|
|
|
:key="mastItem.label" |
|
|
|
:label="mastItem.label" |
|
|
|
> |
|
|
|
{{ mastItem.label }} |
|
|
|
</el-descriptions-item> |
|
|
|
</el-descriptions> |
|
|
|
<el-tabs v-if="item.sunList" type="border-card" style="margin-top:20px;"> |
|
|
|
<el-tab-pane v-for="(sonItem,sonIndex) in item.sunList" :label="sonIndex" :key="sonIndex"> |
|
|
|
<el-descriptions v-for="(sonVal,sonIndex) in sonItem" :key="sonIndex" border> |
|
|
|
<el-descriptions-item v-for="(sonCentor,sonKey) in sonVal" :key="sonKey" :label="sonKey"> {{sonCentor}} |
|
|
|
<el-tabs v-if="item.sunList" type="border-card" style="margin-top: 20px"> |
|
|
|
<el-tab-pane |
|
|
|
v-for="(sonItem, sonIndex) in item.sunList" |
|
|
|
:label="sonIndex" |
|
|
|
:key="sonIndex" |
|
|
|
> |
|
|
|
<el-descriptions |
|
|
|
v-for="(sonVal, sonIndex) in sonItem" |
|
|
|
:key="sonIndex" |
|
|
|
border |
|
|
|
> |
|
|
|
<el-descriptions-item |
|
|
|
v-for="(sonCentor, sonKey) in sonVal" |
|
|
|
:key="sonKey" |
|
|
|
:label="sonKey" |
|
|
|
> |
|
|
|
{{ sonCentor }} |
|
|
|
</el-descriptions-item> |
|
|
|
</el-descriptions> |
|
|
|
</el-tab-pane> |
|
|
|
</el-tabs> |
|
|
|
<table style="margin-top:20px;"> |
|
|
|
<table style="margin-top: 20px"> |
|
|
|
<tr> |
|
|
|
<td class="biankuang" width="100">修改说明:</td> |
|
|
|
<td class="biankuang">{{item.explicate}}</td> |
|
|
|
<td class="biankuang">{{ item.explicate }}</td> |
|
|
|
</tr> |
|
|
|
</table> |
|
|
|
</el-card> |
|
|
|
@ -308,11 +340,15 @@ const jsuanKuandu = () => { |
|
|
|
</div> |
|
|
|
</el-header> |
|
|
|
<el-scrollbar class="scorllbarBox"> |
|
|
|
|
|
|
|
<RunFlowStep ref="runstep" v-model:flowary="flowAry" :flow-key="props.pageInfo.runFlowId" :current-progress="currentProgress" @updatelist="drawerBeforeClose" /> |
|
|
|
<RunFlowStep |
|
|
|
ref="runstep" |
|
|
|
v-model:flowary="flowAry" |
|
|
|
:flow-key="props.pageInfo.runFlowId" |
|
|
|
:current-progress="currentProgress" |
|
|
|
@updatelist="drawerBeforeClose" |
|
|
|
/> |
|
|
|
</el-scrollbar> |
|
|
|
</el-aside> |
|
|
|
|
|
|
|
</el-container> |
|
|
|
</div> |
|
|
|
<div v-else class="common-layout"> |
|
|
|
@ -321,7 +357,8 @@ const jsuanKuandu = () => { |
|
|
|
</el-header> |
|
|
|
<ak-form |
|
|
|
ref="formEl" |
|
|
|
v-loading="formLoading" element-loading-text="Loading..." |
|
|
|
v-loading="formLoading" |
|
|
|
element-loading-text="Loading..." |
|
|
|
:form-data="formState.formData" |
|
|
|
:type="props.tablePageClass" |
|
|
|
:dict="formState.dict" |
|
|
|
@ -331,44 +368,74 @@ const jsuanKuandu = () => { |
|
|
|
:before-submit="beforeSubmit" |
|
|
|
:close-app-submit="closeDrawer" |
|
|
|
:change-key-val="changeKeyVal" |
|
|
|
:anew-submit = "anewSubmit" |
|
|
|
:anew-submit="anewSubmit" |
|
|
|
:after-submit="afterSubmit" |
|
|
|
:save-edit-form-info="saveEditFormInfo" |
|
|
|
:send-draft-submit= "sendDraftSubmit" |
|
|
|
:send-draft-submit="sendDraftSubmit" |
|
|
|
:submit-edit="submitEdit" |
|
|
|
/> |
|
|
|
<el-divider v-if="pageLog&&pageLog.length > 0" content-position="left">历史记录</el-divider> |
|
|
|
<el-divider v-if="pageLog && pageLog.length > 0" content-position="left" |
|
|
|
>历史记录</el-divider |
|
|
|
> |
|
|
|
<el-timeline style="width: 100%"> |
|
|
|
<el-timeline-item v-for="(item,index) in pageLog" :key="index" :timestamp="item.time+' 操作人:'+item.creater" placement="top"> |
|
|
|
<el-card > |
|
|
|
<el-timeline-item |
|
|
|
v-for="(item, index) in pageLog" |
|
|
|
:key="index" |
|
|
|
:timestamp="item.time + ' 操作人:' + item.creater" |
|
|
|
placement="top" |
|
|
|
> |
|
|
|
<el-card> |
|
|
|
<el-tabs> |
|
|
|
<el-tab-pane label="主要信息"> |
|
|
|
<el-descriptions border :column="1"> |
|
|
|
<el-descriptions-item v-for="(mastItem,mastIndex) in item.masterdata" :key="mastIndex" label-align="right" width="150px" > |
|
|
|
<el-descriptions-item |
|
|
|
v-for="(mastItem, mastIndex) in item.masterdata" |
|
|
|
:key="mastIndex" |
|
|
|
label-align="right" |
|
|
|
width="150px" |
|
|
|
> |
|
|
|
<template #label> |
|
|
|
<div style="width: 100px;"> |
|
|
|
{{mastItem.label}} |
|
|
|
<div style="width: 100px"> |
|
|
|
{{ mastItem.label }} |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
|
|
<div v-if="mastItem.types=='lowcodeImage'"> |
|
|
|
<el-image style="width: 100px; height: 100px" :src="mastItem.value" fit="cover" /> |
|
|
|
<div v-if="mastItem.types == 'lowcodeImage'"> |
|
|
|
<el-image |
|
|
|
style="width: 100px; height: 100px" |
|
|
|
:src="mastItem.value" |
|
|
|
fit="cover" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div v-if="mastItem.types=='lowcodeCarsusel'"> |
|
|
|
<div v-if="mastItem.types == 'lowcodeCarsusel'"> |
|
|
|
<el-carousel :interval="5000" type="card" height="200px"> |
|
|
|
<el-carousel-item v-for="item in mastItem.value" :key="item.imgId"> |
|
|
|
<el-image style="width: 100%; height: 100%" :src="item.imgUrl" fit="fill" /> |
|
|
|
<el-carousel-item |
|
|
|
v-for="item in mastItem.value" |
|
|
|
:key="item.imgId" |
|
|
|
> |
|
|
|
<el-image |
|
|
|
style="width: 100%; height: 100%" |
|
|
|
:src="item.imgUrl" |
|
|
|
fit="fill" |
|
|
|
/> |
|
|
|
</el-carousel-item> |
|
|
|
</el-carousel> |
|
|
|
</div> |
|
|
|
<div v-else-if="mastItem.types=='signaturemap'"> |
|
|
|
<el-image style="width: 200px; height: 150px" :src="mastItem.value" fit="cover" /> |
|
|
|
<div v-else-if="mastItem.types == 'signaturemap'"> |
|
|
|
<el-image |
|
|
|
style="width: 200px; height: 150px" |
|
|
|
:src="mastItem.value" |
|
|
|
fit="cover" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div v-else-if="mastItem.types=='colorPicker'"> |
|
|
|
<div :style="'width: 30px; height: 30px; background-color: '+mastItem.value" ></div> |
|
|
|
<div v-else-if="mastItem.types == 'colorPicker'"> |
|
|
|
<div |
|
|
|
:style=" |
|
|
|
'width: 30px; height: 30px; background-color: ' + mastItem.value |
|
|
|
" |
|
|
|
></div> |
|
|
|
</div> |
|
|
|
<div v-else-if="mastItem.types=='switch'"> |
|
|
|
<div v-else-if="mastItem.types == 'switch'"> |
|
|
|
<el-switch |
|
|
|
v-model="mastItem.value" |
|
|
|
class="ml-2" |
|
|
|
@ -377,37 +444,41 @@ const jsuanKuandu = () => { |
|
|
|
disabled |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div v-else-if="mastItem.types=='rate'"> |
|
|
|
<div v-else-if="mastItem.types == 'rate'"> |
|
|
|
<el-rate v-model="mastItem.value" disabled /> |
|
|
|
</div> |
|
|
|
<div v-else-if="mastItem.types=='slider'" style="max-width: 300px;"> |
|
|
|
<div v-else-if="mastItem.types == 'slider'" style="max-width: 300px"> |
|
|
|
<el-slider v-model="mastItem.value" disabled /> |
|
|
|
</div> |
|
|
|
<div v-else-if="mastItem.types=='videoUpAndPlay'"> |
|
|
|
|
|
|
|
<div v-else-if="mastItem.types == 'videoUpAndPlay'"> |
|
|
|
<el-carousel :interval="5000" arrow="always" height="250px"> |
|
|
|
<el-carousel-item v-for="item in mastItem.value" :key="item.id"> |
|
|
|
<video |
|
|
|
:src="item.url" |
|
|
|
style="width: 100%; height: 250px" |
|
|
|
controls |
|
|
|
> |
|
|
|
</video> |
|
|
|
></video> |
|
|
|
</el-carousel-item> |
|
|
|
</el-carousel> |
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
<div v-else-if="mastItem.types=='upload'"> |
|
|
|
<div v-if="mastItem.auxiliary=='picture-card'"> |
|
|
|
<el-image style="width: 100px; height: 100px" :src="mastItem.value" fit="cover" /> |
|
|
|
<div v-else-if="mastItem.types == 'upload'"> |
|
|
|
<div v-if="mastItem.auxiliary == 'picture-card'"> |
|
|
|
<el-image |
|
|
|
style="width: 100px; height: 100px" |
|
|
|
:src="mastItem.value" |
|
|
|
fit="cover" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div v-else-if="mastItem.auxiliary=='picture'"> |
|
|
|
<el-image style="width: 100px; height: 100px" :src="mastItem.value" fit="cover" /> |
|
|
|
<div v-else-if="mastItem.auxiliary == 'picture'"> |
|
|
|
<el-image |
|
|
|
style="width: 100px; height: 100px" |
|
|
|
:src="mastItem.value" |
|
|
|
fit="cover" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div v-else v-html="mastItem.value"></div> |
|
|
|
</div> |
|
|
|
<div v-else-if="mastItem.types=='baidumap'"> |
|
|
|
<div v-else-if="mastItem.types == 'baidumap'"> |
|
|
|
<BaiduMapLook :address="mastItem.value" /> |
|
|
|
</div> |
|
|
|
<div v-else v-html="mastItem.value"></div> |
|
|
|
@ -415,72 +486,102 @@ const jsuanKuandu = () => { |
|
|
|
</el-descriptions> |
|
|
|
</el-tab-pane> |
|
|
|
</el-tabs> |
|
|
|
<el-tabs v-if="item.sunData" type="border-card" style="margin-top:20px;"> |
|
|
|
<el-tab-pane v-for="(sonItem,sonIndex) in item.sunData" :label="sonIndex" :key="sonIndex"> |
|
|
|
|
|
|
|
<el-descriptions v-for="(sonVal,sonIndex) in sonItem" :key="sonIndex" border> |
|
|
|
<el-descriptions-item v-for="(sonCentor,sonKey) in sonVal" :key="sonKey" width="150px" > |
|
|
|
<el-tabs v-if="item.sunData" type="border-card" style="margin-top: 20px"> |
|
|
|
<el-tab-pane |
|
|
|
v-for="(sonItem, sonIndex) in item.sunData" |
|
|
|
:label="sonIndex" |
|
|
|
:key="sonIndex" |
|
|
|
> |
|
|
|
<el-descriptions |
|
|
|
v-for="(sonVal, sonIndex) in sonItem" |
|
|
|
:key="sonIndex" |
|
|
|
border |
|
|
|
> |
|
|
|
<el-descriptions-item |
|
|
|
v-for="(sonCentor, sonKey) in sonVal" |
|
|
|
:key="sonKey" |
|
|
|
width="150px" |
|
|
|
> |
|
|
|
<template #label> |
|
|
|
<div style="width: 100px;"> |
|
|
|
{{sonCentor.label}} |
|
|
|
<div style="width: 100px"> |
|
|
|
{{ sonCentor.label }} |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<div v-if="sonCentor.types=='lowcodeImage'"> |
|
|
|
<el-image style="width: 100px; height: 100px" :src="sonCentor.value" fit="cover" /> |
|
|
|
<div v-if="sonCentor.types == 'lowcodeImage'"> |
|
|
|
<el-image |
|
|
|
style="width: 100px; height: 100px" |
|
|
|
:src="sonCentor.value" |
|
|
|
fit="cover" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div v-if="sonCentor.types=='lowcodeCarsusel'"> |
|
|
|
<div v-if="sonCentor.types == 'lowcodeCarsusel'"> |
|
|
|
<el-carousel :interval="5000" type="card" height="200px"> |
|
|
|
<el-carousel-item v-for="item in sonCentor.value" :key="item.imgId"> |
|
|
|
<el-image style="width: 100%; height: 100%" :src="item.imgUrl" fit="fill" /> |
|
|
|
<el-carousel-item |
|
|
|
v-for="item in sonCentor.value" |
|
|
|
:key="item.imgId" |
|
|
|
> |
|
|
|
<el-image |
|
|
|
style="width: 100%; height: 100%" |
|
|
|
:src="item.imgUrl" |
|
|
|
fit="fill" |
|
|
|
/> |
|
|
|
</el-carousel-item> |
|
|
|
</el-carousel> |
|
|
|
</div> |
|
|
|
<div v-else-if="sonCentor.types=='signaturemap'"> |
|
|
|
<el-image style="width: 200px; height: 150px" :src="sonCentor.value" fit="cover" /> |
|
|
|
<div v-else-if="sonCentor.types == 'signaturemap'"> |
|
|
|
<el-image |
|
|
|
style="width: 200px; height: 150px" |
|
|
|
:src="sonCentor.value" |
|
|
|
fit="cover" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div v-else-if="sonCentor.types=='colorPicker'"> |
|
|
|
<div :style="'width: 30px; height: 30px; background-color: '+sonCentor.value" ></div> |
|
|
|
<div v-else-if="sonCentor.types == 'colorPicker'"> |
|
|
|
<div |
|
|
|
:style=" |
|
|
|
'width: 30px; height: 30px; background-color: ' + |
|
|
|
sonCentor.value |
|
|
|
" |
|
|
|
></div> |
|
|
|
</div> |
|
|
|
<div v-else-if="sonCentor.types=='rate'"> |
|
|
|
<div v-else-if="sonCentor.types == 'rate'"> |
|
|
|
<el-rate v-model="sonCentor.value" disabled /> |
|
|
|
</div> |
|
|
|
<div v-else-if="sonCentor.types=='slider'" style="max-width: 300px;"> |
|
|
|
<div v-else-if="sonCentor.types == 'slider'" style="max-width: 300px"> |
|
|
|
<el-slider v-model="sonCentor.value" disabled /> |
|
|
|
</div> |
|
|
|
<div v-else-if="sonCentor.types=='videoUpAndPlay'"> |
|
|
|
|
|
|
|
<div v-else-if="sonCentor.types == 'videoUpAndPlay'"> |
|
|
|
<el-carousel :interval="5000" arrow="always" height="250px"> |
|
|
|
<el-carousel-item v-for="item in sonCentor.value" :key="item.id"> |
|
|
|
<video |
|
|
|
:src="item.url" |
|
|
|
style="width: 100%; height: 250px" |
|
|
|
controls |
|
|
|
> |
|
|
|
</video> |
|
|
|
></video> |
|
|
|
</el-carousel-item> |
|
|
|
</el-carousel> |
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
<div v-else-if="sonCentor.types=='upload'"> |
|
|
|
<div v-if="sonCentor.auxiliary=='picture-card'"> |
|
|
|
<el-image style="width: 100px; height: 100px" :src="sonCentor.value" fit="cover" /> |
|
|
|
<div v-else-if="sonCentor.types == 'upload'"> |
|
|
|
<div v-if="sonCentor.auxiliary == 'picture-card'"> |
|
|
|
<el-image |
|
|
|
style="width: 100px; height: 100px" |
|
|
|
:src="sonCentor.value" |
|
|
|
fit="cover" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div v-else-if="sonCentor.auxiliary=='picture'"> |
|
|
|
<el-image style="width: 100px; height: 100px" :src="sonCentor.value" fit="cover" /> |
|
|
|
<div v-else-if="sonCentor.auxiliary == 'picture'"> |
|
|
|
<el-image |
|
|
|
style="width: 100px; height: 100px" |
|
|
|
:src="sonCentor.value" |
|
|
|
fit="cover" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div v-else v-html="sonCentor.value"></div> |
|
|
|
</div> |
|
|
|
<div v-else-if="sonCentor.types=='baidumap'"> |
|
|
|
<div v-else-if="sonCentor.types == 'baidumap'"> |
|
|
|
<BaiduMapLook :address="sonCentor.value" /> |
|
|
|
</div> |
|
|
|
<div v-else v-html="sonCentor.value"></div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</el-descriptions-item> |
|
|
|
</el-descriptions> |
|
|
|
</el-tab-pane> |
|
|
|
@ -491,40 +592,38 @@ const jsuanKuandu = () => { |
|
|
|
</div> |
|
|
|
</el-drawer> |
|
|
|
</template> |
|
|
|
<style lang='scss' scoped> |
|
|
|
.common-layout{ |
|
|
|
<style lang="scss" scoped> |
|
|
|
.common-layout { |
|
|
|
height: 100vh; |
|
|
|
padding: 0 15px; |
|
|
|
.el-main{ |
|
|
|
.el-main { |
|
|
|
height: 100vh; |
|
|
|
padding:0; |
|
|
|
padding: 0; |
|
|
|
} |
|
|
|
.flowBox{ |
|
|
|
.flowBox { |
|
|
|
height: 100vh; |
|
|
|
border-left: 1px solid #ccc; |
|
|
|
.scorllbarBox{ |
|
|
|
height: calc(100vh - 35px) |
|
|
|
.scorllbarBox { |
|
|
|
height: calc(100vh - 35px); |
|
|
|
} |
|
|
|
.workFlowHead{ |
|
|
|
.workFlowHead { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: space-between; |
|
|
|
} |
|
|
|
} |
|
|
|
.el-header{ |
|
|
|
padding:0 10px; |
|
|
|
line-height:30px; |
|
|
|
text-align:right; |
|
|
|
font-size:20px; |
|
|
|
i{ |
|
|
|
cursor:pointer; |
|
|
|
.el-header { |
|
|
|
padding: 0 10px; |
|
|
|
line-height: 30px; |
|
|
|
text-align: right; |
|
|
|
font-size: 20px; |
|
|
|
i { |
|
|
|
cursor: pointer; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
.biankuang{ |
|
|
|
border: 1px solid #D4D7DE; |
|
|
|
padding:10px 10px; |
|
|
|
|
|
|
|
.biankuang { |
|
|
|
border: 1px solid #d4d7de; |
|
|
|
padding: 10px 10px; |
|
|
|
} |
|
|
|
</style> |
|
|
|
|