feat: 代码评审修改
Lesan
parent
535ccd3389
commit
d64b49ba94
|
|
@ -3,7 +3,9 @@ import * as ProcessInstanceApi from '@/api/bpm/processInstance'
|
|||
import { useUserStore } from '@/store/modules/user'
|
||||
import { formatDate } from '@/utils/formatTime'
|
||||
import { DICT_TYPE, getDictLabel } from '@/utils/dict'
|
||||
import { decodeFields } from '@/utils/formCreate'
|
||||
import { decodeFields, setConfAndFields2 } from '@/utils/formCreate'
|
||||
import type { ApiAttrs } from '@form-create/element-ui/types/config'
|
||||
import formCreate from "@form-create/element-ui";
|
||||
|
||||
const userStore = useUserStore()
|
||||
|
||||
|
|
@ -16,6 +18,21 @@ const printTime = ref(formatDate(new Date(), 'YYYY-MM-DD HH:mm'))
|
|||
const formFields = ref()
|
||||
const printDataMap = ref({})
|
||||
|
||||
const fApi = ref<ApiAttrs>()
|
||||
const detailForm = ref({
|
||||
rule: [],
|
||||
option: {},
|
||||
value: {}
|
||||
})
|
||||
|
||||
const fApiH = ref<ApiAttrs>()
|
||||
const detailFormH = ref({
|
||||
rule: [],
|
||||
option: {},
|
||||
value: {}
|
||||
})
|
||||
const fcRef = ref()
|
||||
|
||||
const open = async (id: string) => {
|
||||
loading.value = true
|
||||
try {
|
||||
|
|
@ -30,9 +47,38 @@ const open = async (id: string) => {
|
|||
defineExpose({ open })
|
||||
|
||||
const parseFormFields = () => {
|
||||
const processInstance = printData.value.processInstance
|
||||
const processDefinition = processInstance.processDefinition
|
||||
setConfAndFields2(
|
||||
detailForm,
|
||||
processDefinition.formConf,
|
||||
processDefinition.formFields,
|
||||
processInstance.formVariables
|
||||
)
|
||||
detailForm.value.option = {
|
||||
submitBtn: false,
|
||||
resetBtn: false,
|
||||
form: {
|
||||
disabled: true
|
||||
}
|
||||
}
|
||||
setConfAndFields2(
|
||||
detailFormH,
|
||||
processDefinition.formConf,
|
||||
processDefinition.formFields,
|
||||
processInstance.formVariables
|
||||
)
|
||||
detailFormH.value.option = {
|
||||
submitBtn: false,
|
||||
resetBtn: false,
|
||||
form: {
|
||||
disabled: true
|
||||
}
|
||||
}
|
||||
return
|
||||
// TODO @lesan：form field 有可能基于 form-create 什么 api 生成么？好像也挺难的 = =
|
||||
const formFieldsObj = decodeFields(printData.value.formFields)
|
||||
const processVariables = printData.value.processVariables
|
||||
const processVariables = printData.value.processInstance.formVariables
|
||||
let res: any = []
|
||||
for (const item of formFieldsObj) {
|
||||
const id = item['field']
|
||||
|
|
@ -40,6 +86,7 @@ const parseFormFields = () => {
|
|||
let html = '暂不支持此类型的表单展示'
|
||||
// TODO 完善各类型表单的展示
|
||||
// TODO @lesan：要不 UploadImg、UploadFile 特殊处理下，其它就 else processVariables[item['field']]？
|
||||
// TODO @芋艿：感觉很多都要处理一下，select那些都要转为可读的label，还有子表单那些，都需要处理一下...
|
||||
if (item['type'] === 'input') {
|
||||
html = processVariables[item['field']]
|
||||
} else if (item['type'] === 'UploadImg') {
|
||||
|
|
@ -52,15 +99,15 @@ const parseFormFields = () => {
|
|||
}
|
||||
|
||||
const initPrintDataMap = () => {
|
||||
printDataMap.value['startUser'] = printData.value.startUser.nickname
|
||||
printDataMap.value['startUserDept'] = printData.value.startUser.deptName
|
||||
printDataMap.value['processName'] = printData.value.processName
|
||||
printDataMap.value['processNum'] = printData.value.processInstanceId
|
||||
printDataMap.value['startTime'] = printData.value.startTime
|
||||
printDataMap.value['endTime'] = printData.value.endTime
|
||||
printDataMap.value['startUser'] = printData.value.processInstance.startUser.nickname
|
||||
printDataMap.value['startUserDept'] = printData.value.processInstance.startUser.deptName
|
||||
printDataMap.value['processName'] = printData.value.processInstance.name
|
||||
printDataMap.value['processNum'] = printData.value.processInstance.id
|
||||
printDataMap.value['startTime'] = formatDate(printData.value.processInstance.startTime)
|
||||
printDataMap.value['endTime'] = formatDate(printData.value.processInstance.endTime)
|
||||
printDataMap.value['processStatus'] = getDictLabel(
|
||||
DICT_TYPE.BPM_PROCESS_INSTANCE_STATUS,
|
||||
printData.value.processStatus
|
||||
printData.value.processInstance.status
|
||||
)
|
||||
printDataMap.value['printUsername'] = userName.value
|
||||
printDataMap.value['printTime'] = printTime.value
|
||||
|
|
@ -96,12 +143,12 @@ const getPrintTemplateHTML = () => {
|
|||
headTd.innerHTML = '流程节点'
|
||||
headTr.appendChild(headTd)
|
||||
processRecordTable.appendChild(headTr)
|
||||
printData.value.approveNodes.forEach((item) => {
|
||||
printData.value.tasks.forEach((item) => {
|
||||
const tr = document.createElement('tr')
|
||||
const td1 = document.createElement('td')
|
||||
td1.innerHTML = item.nodeName
|
||||
td1.innerHTML = item.name
|
||||
const td2 = document.createElement('td')
|
||||
td2.innerHTML = item.nodeDesc
|
||||
td2.innerHTML = item.description
|
||||
tr.appendChild(td1)
|
||||
tr.appendChild(td2)
|
||||
processRecordTable.appendChild(tr)
|
||||
|
|
@ -114,6 +161,25 @@ const getPrintTemplateHTML = () => {
|
|||
return doc.body.innerHTML
|
||||
}
|
||||
|
||||
const html = ref('')
|
||||
const handleDialogOpened = async () => {
|
||||
const processInstance = printData.value.processInstance
|
||||
const processDefinition = processInstance.processDefinition
|
||||
let fcData = {
|
||||
rule: [],
|
||||
option: {},
|
||||
value: {}
|
||||
}
|
||||
setConfAndFields2(
|
||||
fcData,
|
||||
processDefinition.formConf,
|
||||
processDefinition.formFields,
|
||||
processInstance.formVariables
|
||||
)
|
||||
const api = formCreate.create(fcData.rule,fcData.option)
|
||||
console.log(api)
|
||||
}
|
||||
|
||||
const printObj = ref({
|
||||
id: 'printDivTag',
|
||||
popTitle: ' ',
|
||||
|
|
@ -128,26 +194,31 @@ const printObj = ref({
|
|||
<div id="printDivTag">
|
||||
<div v-if="printData.printTemplateEnable" v-html="getPrintTemplateHTML()"></div>
|
||||
<div v-else>
|
||||
<h2 class="text-center">{{ printData.processName }}</h2>
|
||||
<h2 class="text-center">{{ printData.processInstance.name }}</h2>
|
||||
<div class="text-right text-15px">{{ '打印人员: ' + userName }}</div>
|
||||
<div class="flex justify-between">
|
||||
<div class="text-15px">{{ '流程编号: ' + printData.processInstanceId }}</div>
|
||||
<div class="text-15px">{{ '流程编号: ' + printData.processInstance.id }}</div>
|
||||
<div class="text-15px">{{ '打印时间: ' + printTime }}</div>
|
||||
</div>
|
||||
<table class="mt-20px w-100%" border="1" style="border-collapse: collapse">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="p-5px w-25%">发起人</td>
|
||||
<td class="p-5px w-25%">{{ printData.startUser.nickname }}</td>
|
||||
<td class="p-5px w-25%">{{ printData.processInstance.startUser.nickname }}</td>
|
||||
<td class="p-5px w-25%">发起时间</td>
|
||||
<td class="p-5px w-25%">{{ printData.startTime }}</td>
|
||||
<td class="p-5px w-25%">{{ formatDate(printData.processInstance.startTime) }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="p-5px w-25%">所属部门</td>
|
||||
<td class="p-5px w-25%">{{ printData.startUser.deptName }}</td>
|
||||
<td class="p-5px w-25%">{{ printData.processInstance.startUser.deptName }}</td>
|
||||
<td class="p-5px w-25%">流程状态</td>
|
||||
<td class="p-5px w-25%">
|
||||
{{ getDictLabel(DICT_TYPE.BPM_PROCESS_INSTANCE_STATUS, printData.processStatus) }}
|
||||
{{
|
||||
getDictLabel(
|
||||
DICT_TYPE.BPM_PROCESS_INSTANCE_STATUS,
|
||||
printData.processInstance.status
|
||||
)
|
||||
}}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
|
|
@ -155,12 +226,14 @@ const printObj = ref({
|
|||
<h4>表单内容</h4>
|
||||
</td>
|
||||
</tr>
|
||||
<tr v-for="item in formFields" :key="item.id">
|
||||
<td class="p-5px w-20%">
|
||||
{{ item.name }}
|
||||
</td>
|
||||
<td class="p-5px w-80%" colspan="3">
|
||||
<div v-html="item.html"></div>
|
||||
<tr>
|
||||
<td class="p-5px w-100% text-center" colspan="4">
|
||||
<form-create
|
||||
v-model="detailForm.value"
|
||||
v-model:api="fApi"
|
||||
:option="detailForm.option"
|
||||
:rule="detailForm.rule"
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
|
|
@ -168,12 +241,12 @@ const printObj = ref({
|
|||
<h4>流程节点</h4>
|
||||
</td>
|
||||
</tr>
|
||||
<tr v-for="item in printData.approveNodes" :key="item.nodeId">
|
||||
<tr v-for="item in printData.tasks" :key="item.id">
|
||||
<td class="p-5px w-20%">
|
||||
{{ item.nodeName }}
|
||||
{{ item.name }}
|
||||
</td>
|
||||
<td class="p-5px w-80%" colspan="3">
|
||||
{{ item.nodeDesc }}
|
||||
{{ item.description }}
|
||||
<div v-if="item.signUrl !== ''">
|
||||
<img class="w-90px h-40px" :src="item.signUrl" alt="" />
|
||||
</div>
|
||||
|
|
@ -185,7 +258,7 @@ const printObj = ref({
|
|||
</div>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="visible = false">取 消</el-button>
|
||||
<el-button @click="handleDialogOpened">取 消</el-button>
|
||||
<el-button type="primary" v-print="printObj"> 打 印</el-button>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
Loading…
Reference in New Issue