This commit is contained in:
吴红兵
2025-12-02 10:37:49 +08:00
commit 1f645dad3e
1183 changed files with 147673 additions and 0 deletions

View File

@@ -0,0 +1,202 @@
<template>
<div>
<div class="layout-padding-auto layout-padding-view">
<form-render ref="formCreateRef" :currFlowForm="data.currFlowFormClone" v-if="!validateNull(data.currFlowFormClone)"
:initFormPermPrint="initFormPermPrint">
</form-render>
<footer class="el-dialog__footer" v-if="data.submitBtn">
<span class="dialog-footer">
<el-button type="primary" @click="printForm" v-if="data.currFlowForm.printInfo">{{
t('jfI18n.print')
}}
</el-button>
<el-button type="primary" @click="submitForm" :disabled="loading">{{
t('jfI18n.submit')
}}
</el-button>
</span>
</footer>
<footer class="el-dialog__footer" v-else>
<span class="dialog-footer">
<el-button type="primary" @click="printForm" v-if="data.currFlowForm.printInfo">{{
t('jfI18n.print')
}}
</el-button>
</span>
</footer>
</div>
<!-- 打印表单 -->
<el-dialog v-model="data.showTinymceView" top="20px" width="700px"
:title="data.tinymceTitle" append-to-body
@close="closePrint">
<tinymce-view v-if="data.showTinymceView" :currFlowForm="data.currFlowForm"></tinymce-view>
</el-dialog>
</div>
</template>
<script setup lang="ts" name="RunApplicationForm">
import * as runApplication from '/@/api/order/run-application'
import * as orderVue from "/@/api/order/order-key-vue";
import {parseWithFunctions} from "/@/flow";
import {handleDesignFormPerm, handleFormPrint} from "/@/flow/utils/form-perm";
import {useI18n} from "vue-i18n";
import {useMessage} from "/@/hooks/message";
import {validateNull} from "/@/utils/validate";
import {deepClone} from "/@/utils/other";
import {initJobDataByApp} from "/@/flow/support/extend";
import {initFormMethods} from "../index";
const emits = defineEmits(["handleJob"]);
const FormRender = defineAsyncComponent(() => import('/@/flow/components/form-create/render.vue'));
const formCreateRef = ref(null)
// 引入组件
const TinymceView = defineAsyncComponent(() => import('/@/flow/components/tinymce/TinymceView.vue'));
const {t} = useI18n();
const loading = ref(false);
const props = defineProps({
currJob: {
type: Object,
default: {},
},
currElTab: {
type: Object,
default: {},
},
});
const data = reactive({
// 兼容app端监听printInfo
currFlowForm: {
type: Object,
default: {},
},
// 含可选表单formInfo
currFlowFormClone: {},
elTab: null,
initFormData: {},
showTinymceView: false,
tinymceTitle: null,
submitBtn: true
})
const methods = initFormMethods(formCreateRef, data)
const $route = useRoute();
async function initJobData() {
// 兼容移动端
await initJobDataByApp($route, props);
// 判断是否存在该表单
data.elTab = orderVue.currElTabIsExist(props.currJob, props.currElTab.id);
handleGetObj(props.currJob.orderId)
}
function handleGetObj(id) {
runApplication.getObj(id).then(async resp => {
let form = resp.data ? resp.data : {}
data.currFlowForm = form
data.currFlowForm.runJobId = props.currJob.id
rowEditInitData(form)
})
}
function rowEditInitData(form: Object) {
let formInfoStr = form.formInfo
// 判断是否为可选表单
if (data.elTab.id !== form.formId) formInfoStr = data.elTab.formInfo
data.currFlowFormClone = deepClone(form)
data.currFlowFormClone.formInfo = formInfoStr
// 记录原始值
let formData = parseWithFunctions(form.formData)
Object.assign(data.initFormData, formData)
}
async function initFormPermPrint(cloneFormInfo) {
let form = data.currFlowForm
// 判断是否为可选表单
let formType = form.type, formId = form.formId
if (data.elTab.id !== form.formId) {
formType = data.elTab.type
formId = data.elTab.id
}
let res = await handleDesignFormPerm(props, cloneFormInfo, data.elTab, formType, formId);
// 判断是否仅查看
await orderVue.currElTabIsView(methods, props.currJob, props.currElTab.id, submitForm, res.callback, res.widgetList)
await handleFormPrint(form, formType, formId, '1')
return data.elTab;
}
function printForm() {
data.currFlowForm.formData = formCreateRef.value.design.formData
data.currFlowForm.modelRefList = []
let children = formCreateRef.value.design.fApi.children;
if (children && children.length > 0) {
children.forEach(each => data.currFlowForm.modelRefList.push({model: each.model}))
}
data.currFlowForm.rule = formCreateRef.value.design.rule
data.tinymceTitle = data.currFlowForm.formName
data.showTinymceView = true
}
function closePrint(isSave){
delete data.currFlowForm.modelRefList
delete data.currFlowForm.rule
if (isSave) delete data.currFlowForm.printInfo
}
async function submitForm() {
try {
loading.value = true;
let state = await formCreateRef.value.design.fApi.validate();
let formData = formCreateRef.value.design.formData
if (!state || validateNull(formData)) {
useMessage().warning("请输入表单信息");
return
}
let formJson = saveInitData(formData);
await runApplication.putObj(formJson)
orderVue.currElTabIsSave(props.currJob, props.currElTab.id, true, emits)
useMessage().success(t(formJson.id ? 'common.editSuccessText' : 'common.addSuccessText'));
} catch (err: any) {
useMessage().warning("请输入表单信息");
} finally {
loading.value = false;
}
}
function saveInitData(form) {
closePrint(true)
data.currFlowForm.formData = validateNull(form) ? null : form
let formJson = deepClone(data.currFlowForm)
if (!validateNull(form)) {
// 合并不同页面不同字段
formJson.formData = Object.assign({}, data.initFormData, formJson.formData);
}
formJson.formData = JSON.stringify(formJson.formData)
return formJson;
}
// 监听双向绑定
watch(
() => props.currJob.id,
async () => {
await initJobData();
}
);
onMounted(async () => {
await initJobData()
});
</script>
<style lang="scss" scoped>
.el-dialog__footer {
text-align: center;
margin-top: 10px;
.dialog-footer {
text-align: center;
}
}
</style>

View File

@@ -0,0 +1,52 @@
export default {
runApplication: {
index: '#',
importrunApplicationTip: 'import RunApplication',
id: 'id',
code: 'code',
flowKey: 'flowKey',
icon: 'icon',
formName: 'formName',
groupName: 'groupName',
finishTime: 'finishTime',
status: 'status',
remark: 'remark',
version: 'version',
createUser: 'createUser',
createTime: 'createTime',
tableName: 'tableName',
formInfo: 'formInfo',
sort: 'sort',
defFlowId: 'defFlowId',
flowInstId: 'flowInstId',
formData: 'formData',
formId: 'formId',
updateUser: 'updateUser',
updateTime: 'updateTime',
delFlag: 'delFlag',
inputIdTip: 'input id',
inputCodeTip: 'input code',
inputFlowKeyTip: 'input flowKey',
inputIconTip: 'input icon',
inputFormNameTip: 'input formName',
inputGroupNameTip: 'input groupName',
inputFinishTimeTip: 'input finishTime',
inputStatusTip: 'input status',
inputRemarkTip: 'input remark',
inputVersionTip: 'input version',
inputCreateUserTip: 'input createUser',
inputCreateTimeTip: 'input createTime',
inputTableNameTip: 'input tableName',
inputFormInfoTip: 'input formInfo',
inputSortTip: 'input sort',
inputDefFlowIdTip: 'input defFlowId',
inputFlowInstIdTip: 'input flowInstId',
inputFormDataTip: 'input formData',
inputFormIdTip: 'input formId',
inputUpdateUserTip: 'input updateUser',
inputUpdateTimeTip: 'input updateTime',
inputDelFlagTip: 'input delFlag',
}
}

View File

@@ -0,0 +1,52 @@
export default {
runApplication: {
index: '#',
importrunApplicationTip: '导入我的申请',
id: '主键id',
code: '工单编号',
flowKey: '流程名称',
icon: '表单图标',
formName: '表单名称',
groupName: '分组名称',
finishTime: '完成时间',
status: '状态',
remark: '表单备注',
version: '版本',
createUser: '创建人',
createTime: '创建时间',
tableName: '关联表名称',
formInfo: '表单信息',
sort: '排序值',
defFlowId: '流程定义ID',
flowInstId: '流程实例ID',
formData: '表单数据',
formId: '表单ID',
updateUser: '修改人',
updateTime: '修改时间',
delFlag: '删除标',
inputIdTip: '请输入主键id',
inputCodeTip: '请输入编号',
inputFlowKeyTip: '请输入流程KEY',
inputIconTip: '请输入表单图标',
inputFormNameTip: '请输入表单名称',
inputGroupNameTip: '请输入分组名称',
inputFinishTimeTip: '请输入完成时间',
inputStatusTip: '请输入状态',
inputRemarkTip: '请输入表单备注',
inputVersionTip: '请输入版本',
inputCreateUserTip: '请输入创建人',
inputCreateTimeTip: '请输入创建时间',
inputTableNameTip: '请输入关联表名称',
inputFormInfoTip: '请输入表单信息',
inputSortTip: '请输入排序值',
inputDefFlowIdTip: '请输入流程定义ID',
inputFlowInstIdTip: '请输入流程实例ID',
inputFormDataTip: '请输入表单数据',
inputFormIdTip: '请输入表单ID',
inputUpdateUserTip: '请输入修改人',
inputUpdateTimeTip: '请输入修改时间',
inputDelFlagTip: '请输入删除标',
}
}

View File

@@ -0,0 +1,362 @@
<template>
<div class="layout-padding">
<div class="layout-padding-auto layout-padding-view">
<el-row v-show="showSearch">
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
<el-form-item :label="$t('runApplication.code')" prop="code" >
<el-input :placeholder="t('runApplication.inputCodeTip')" v-model="state.queryForm.code" clearable
style="max-width: 180px" />
</el-form-item>
<el-form-item :label="$t('runApplication.flowKey')" prop="flowKey" >
<el-input :placeholder="t('runApplication.inputFlowKeyTip')" v-model="state.queryForm.flowKey" clearable
style="max-width: 180px" />
</el-form-item>
<el-form-item :label="$t('runApplication.formName')" prop="formName" >
<el-input :placeholder="t('runApplication.inputFormNameTip')" v-model="state.queryForm.formName" clearable
style="max-width: 180px" />
</el-form-item>
<el-form-item :label="$t('runApplication.status')" prop="status" >
<el-select v-model="state.queryForm.status" :placeholder="t('runApplication.inputStatusTip')" clearable style="max-width: 180px">
<el-option v-for="(item, index) in DIC_PROP.ORDER_STATUS" :key="index" :label="item.label" :value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button icon="search" type="primary" @click="getDataList">
{{ $t('common.queryBtn') }}
</el-button>
<el-button icon="Refresh" @click="resetQuery">{{ $t('common.resetBtn') }}</el-button>
</el-form-item>
</el-form>
</el-row>
<el-row>
<div class="mb8" style="width: 100%">
<el-tooltip placement="top">
<template #content>
{{ $t('common.delBtn') }}
</template>
<el-button plain :disabled="multiple" icon="Delete" type="primary" class="ml10"
v-auth="'order_runapplication_del'" @click="handleDelete(selectObjs)">
</el-button>
</el-tooltip>
<right-toolbar v-model:showSearch="showSearch" :export="'order_runapplication_export'"
@exportExcel="exportExcel" class="ml10" style="float: right;margin-right: 20px"
@queryTable="getDataList"></right-toolbar>
</div>
</el-row>
<el-table :data="state.dataList" v-loading="state.loading" style="width: 100%"
@selection-change="handleSelectionChange" @sort-change="sortChangeHandle">
<el-table-column type="selection" width="40" align="center"/>
<el-table-column type="index" :label="t('runApplication.index')" width="40"/>
<el-table-column prop="code" :label="t('runApplication.code')" show-overflow-tooltip/>
<el-table-column prop="flowKey" :label="t('runApplication.flowKey')" show-overflow-tooltip>
<template #default="scope">
<convert-name :options="dicData.flowKey" :value="scope.row.flowKey"
:valueKey="'flowKey'" :showKey="'flowName'"></convert-name>
</template>
</el-table-column>
<el-table-column prop="icon" :label="t('runApplication.icon')" show-overflow-tooltip>
<template #default="scope">
<SvgIcon :name="scope.row.icon" :size="20" color="#409EFF"/>
</template>
</el-table-column>
<el-table-column prop="formName" :label="t('runApplication.formName')" show-overflow-tooltip/>
<el-table-column prop="groupName" :label="t('runApplication.groupName')" show-overflow-tooltip/>
<el-table-column prop="finishTime" :label="t('runApplication.finishTime')" show-overflow-tooltip/>
<el-table-column prop="status" :label="t('runApplication.status')" show-overflow-tooltip>
<template #default="scope">
<dict-tag :options="DIC_PROP.ORDER_STATUS" :value="scope.row.status"></dict-tag>
</template>
</el-table-column>
<el-table-column prop="remark" :label="t('runApplication.remark')" width="200" show-overflow-tooltip/>
<el-table-column prop="version" :label="t('runApplication.version')" show-overflow-tooltip/>
<!-- <el-table-column prop="createUser" :label="t('runApplication.createUser')" show-overflow-tooltip>
<template #default="scope">
<convert-name :options="state.dicData.createUser" :value="scope.row.createUser"
:valueKey="'userId'" :showKey="'name'"></convert-name>
</template>
</el-table-column>
<el-table-column prop="createTime" :label="t('runApplication.createTime')" show-overflow-tooltip/>-->
<el-table-column :label="$t('common.action')" width="170">
<template #default="scope">
<el-tooltip placement="top">
<template #content>
{{ $t('common.viewBtn') }}
</template>
<el-button text type="primary" icon="view" @click="handleViewOrder(scope.row)">
</el-button>
</el-tooltip>
<el-tooltip placement="top">
<template #content>
打印表单
</template>
<el-button icon="Document" text type="primary" @click="handleViewOrder(scope.row)">
</el-button>
</el-tooltip>
<el-tooltip placement="top">
<template #content>
{{ $t('common.copyBtn') }}
</template>
<el-button icon="DocumentCopy" text type="primary" @click="handleInitiateOrder(scope.row,'copy')">
</el-button>
</el-tooltip>
<el-tooltip placement="top" v-if="scope.row.status===DIC_PROP.ORDER_STATUS[2].value">
<template #content>
{{ $t('jfI18n.recallBtn') }}
</template>
<el-button icon="RefreshLeft" text type="primary" @click="handleRecallReset(scope.row)">
</el-button>
</el-tooltip>
<el-tooltip placement="top" v-if="scope.row.status===DIC_PROP.ORDER_STATUS[0].value">
<template #content>
{{ $t('jfI18n.resetBtn') }}
</template>
<el-button icon="RefreshRight" text type="primary" @click="handleRecallReset(scope.row)">
</el-button>
</el-tooltip>
<el-tooltip placement="top">
<template #content>
{{ $t('jfI18n.viewFlow') }}
</template>
<el-button icon="Share" text type="primary" @click="openPreview(scope.row)">
</el-button>
</el-tooltip>
<el-tooltip placement="top" v-if="scope.row.status===DIC_PROP.ORDER_STATUS[1].value || scope.row.status===DIC_PROP.ORDER_STATUS[0].value">
<template #content>
{{ $t('common.editBtn') }}
</template>
<el-button icon="edit-pen" text type="primary" @click="handleInitiateOrder(scope.row,'edit')">
</el-button>
</el-tooltip>
<el-tooltip placement="top" v-if="scope.row.status===DIC_PROP.ORDER_STATUS[1].value">
<template #content>
{{ $t('common.delBtn') }}
</template>
<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])">
</el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
</div>
<json-flow-predict ref="predict" :proxy="proxy" @handleInitiateOrder="handleInitiateOrder">
<template v-slot="slotProps" v-if="data.showInitiateOrder">
<run-initiate ref="form" v-show="slotProps.currActive === 'form'" :curr-flow-form="data.currFlowForm"
@handleInitiateOrder="handleInitiateOrder"></run-initiate>
</template>
<template v-slot="slotProps" v-if="data.showHandleForm">
<custom-form ref="form" v-show="slotProps.currActive === 'form'" :curr-job="data.currFlowForm"
@onHandleForm="handleInitiateOrder"></custom-form>
</template>
</json-flow-predict>
<!-- 查看工单 -->
<el-dialog
v-model="data.showHandleFormView"
top="20px"
width="90%"
title="查看工单"
append-to-body>
<custom-form v-if="data.showHandleFormView" :curr-job="data.currFlowForm"></custom-form>
</el-dialog>
<!-- 查看工单 -->
<el-dialog
v-model="data.showViewOrder"
top="20px"
width="90%"
title="查看工单"
append-to-body>
<run-view v-if="data.showViewOrder" :curr-flow-form="data.currFlowForm"></run-view>
</el-dialog>
<!-- 查看流程图 -->
<el-drawer
class="flow-overflow-drawer" direction="rtl"
append-to-body size="90%"
v-model="data.showFlowPic"
>
<flow-photo v-if="data.showFlowPic" :curr-job="data.currFlowForm"></flow-photo>
</el-drawer>
</div>
</template>
<script setup lang="ts" name="systemRunApplication">
import { BasicTableProps, useTable } from "/@/hooks/table";
import * as runApplication from '/@/api/order/run-application'
import { useMessage, useMessageBox } from "/@/hooks/message";
import {useI18n} from "vue-i18n";
import {onLoadDicUrl, onLoaded} from "/@/flow/components/convert-name/convert";
import * as common from '/@/flow/support/common'
import other, {deepClone} from "/@/utils/other";
import {recallReset} from "/@/api/jsonflow/run-flow";
import {DIC_PROP} from "/@/flow/support/dict-prop";
import {openFlowPreview} from "/@/flow/support/extend";
import {handleCustomForm, vueKey} from "/@/api/order/order-key-vue";
// 引入组件
const FlowPhoto = defineAsyncComponent(() => import('/@/views/jsonflow/flow-design/view.vue'));
const RunInitiate = defineAsyncComponent(() => import('./initiate.vue'));
const RunView = defineAsyncComponent(() => import('./view.vue'));
const CustomForm = defineAsyncComponent(() => import('/@/flow/components/custom-form/handle.vue'));
const JsonFlowPredict = defineAsyncComponent(() => import('/@/views/jsonflow/flow-design/predict.vue'));
const { t } = useI18n()
const {proxy} = getCurrentInstance();
// 搜索变量
const queryRef = ref()
const showSearch = ref(true)
// 多选变量
const selectObjs = ref([]) as any
const multiple = ref(true)
const state: BasicTableProps = reactive<BasicTableProps>({
queryForm: {},
pageList: runApplication.fetchList,
onLoaded: onLoaded({key: "createUser"}),
descs: ["create_time"]
})
// 定义字典
const dicData = reactive({});
const onLoad = onLoadDicUrl({key: "flowKey"});
onMounted(() => {
onLoad(dicData);
});
// table hook
const {
getDataList,
currentChangeHandle,
sizeChangeHandle,
sortChangeHandle,
downBlobFile
} = useTable(state)
// 清空搜索条件
const resetQuery = () => {
// 清空搜索条件
queryRef.value?.resetFields()
// 清空多选
selectObjs.value = []
getDataList()
}
// 导出excel
const exportExcel = () => {
downBlobFile('/order/run-application/export', state.queryForm, 'run-application.xlsx')
}
// 多选事件
const handleSelectionChange = (objs: any) => {
selectObjs.value = objs.map(({ id }) => id);
multiple.value = !objs.length;
};
// 删除操作
const handleDelete = async (ids: string[]) => {
try {
await useMessageBox().confirm(t('common.delConfirmText'));
} catch {
return;
}
try {
await runApplication.delObjs(ids);
getDataList();
useMessage().success(t('common.delSuccessText'));
} catch (err: any) {
useMessage().error(err.msg);
}
};
const data = reactive({
showViewOrder: false,
showInitiateOrder: false,
showFlowPic: false,
currFlowForm: {},
showHandleFormView: false,
showHandleForm: false,
})
function handleViewOrder(row) {
data.currFlowForm = row
// 判断是否自定义首页
if (row.path !== vueKey.RunApplicationForm) {
handleCustomForm(data, row)
data.currFlowForm.operType = 'view'
data.showHandleFormView = true
} else {
data.showViewOrder = true
}
}
function handleInitiateOrder(row, operType) {
if (row === false) {
getDataList();
openPredict({}, false)
data.showInitiateOrder = false
data.showHandleForm = false
return
}
data.currFlowForm = deepClone(row)
data.currFlowForm.operType = operType
let clone = {operType: data.currFlowForm.operType};
common.handleClone(clone, data.currFlowForm)
// 判断是否自定义首页
if (row.path !== vueKey.RunApplicationForm) {
handleCustomForm(data, row)
data.showHandleForm = true
} else {
data.showInitiateOrder = true
}
openPredict(row, true)
}
function openPredict(row, bool) {
proxy.$refs.predict.open(row, bool)
}
const $router = useRouter();
function openPreview(row) {
if (row.status === DIC_PROP.ORDER_STATUS[1].value) {
data.currFlowForm = {defFlowId: row.defFlowId}
data.showFlowPic = true
} else {
openFlowPreview($router, {flowInstId: row.flowInstId}, '1')
}
}
function handleRecallReset(row) {
let params = {id: row.flowInstId, flowKey: row.flowKey, status: row.status}
if (row.status === DIC_PROP.ORDER_STATUS[0].value) {
recallReset(params).then(() => {
useMessage().success('重发成功');
getDataList();
})
return
}
useMessageBox().confirm('是否确认要撤回该工单?')
.then(() => {
return recallReset(params)
}).then(() => {
useMessage().success('撤回成功')
getDataList();
})
}
</script>
<style lang="scss">
@import "../../../flow/components/style/flow-drawer.scss";
</style>

View File

@@ -0,0 +1,125 @@
<template>
<div class="layout-padding">
<div class="layout-padding-auto layout-padding-view">
<form-render ref="formCreateRef" :currFlowForm="props.currFlowForm" :initFormPermPrint="initFormPermPrint">
</form-render>
</div>
<footer class="el-dialog__footer" v-if="data.submitBtn">
<span class="dialog-footer">
<template v-if="props.currFlowForm.status !== DIC_PROP.ORDER_STATUS[0].value">
<el-button type="primary" @click="submitForm" :disabled="loading">{{
t('jfI18n.submit')
}}
</el-button>
<el-button type="primary" @click="handleTempStore" :disabled="loading">{{
t('jfI18n.temp')
}}
</el-button>
</template>
<template v-else>
<el-button type="primary" @click="submitForm" :disabled="loading">{{
$t('common.editBtn')
}}</el-button>
</template>
</span>
</footer>
</div>
</template>
<script setup lang="ts" name="RunApplicationInitiate">
import * as runApplication from '/@/api/order/run-application'
import {useI18n} from "vue-i18n";
import {validateNull} from "/@/utils/validate";
import {deepClone} from "/@/utils/other";
import * as common from "/@/flow/support/common";
import {doInitData, doInitiateForm, doTempStore, initFormMethods, initJobDataByApp} from "../index";
import {handleFormStartPerm} from "/@/flow/utils/form-perm";
import {currFormIsView} from "/@/api/order/order-key-vue";
const FormRender = defineAsyncComponent(() => import('/@/flow/components/form-create/render.vue'));
const formCreateRef = ref(null)
const {t} = useI18n();
const $emit = defineEmits(['handleInitiateOrder']);
const loading = ref(false);
const props = defineProps({
currFlowForm: {
type: Object,
default: {},
}
});
const data = reactive({
submitBtn: true
});
const $route = useRoute();
function initJobData() {
initJobDataByApp($route, handleGetObj, null)
}
function handleGetObj(id) {
runApplication.getObj(id).then(resp => {
let form = resp.data ? resp.data : {}
Object.assign(props.currFlowForm, form);
})
}
async function submitForm() {
await doInitiateForm(loading, props, data, $route, formCreateRef, $emit, saveInitData, t)
}
function handleTempStore() {
doTempStore(loading, data, $route, formCreateRef, $emit, saveInitData)
}
const methods = initFormMethods(formCreateRef, data)
async function initFormPermPrint(formInfo) {
// 处理表单权限
let res = await handleFormStartPerm(null, null, formInfo, props.currFlowForm.defFlowId, null, props.currFlowForm.type)
await currFormIsView(methods, res.elTab, true, res.callback, res.widgetList)
return res.elTab
}
function saveInitData(form) {
props.currFlowForm.formData = validateNull(form) ? undefined : form
let formJson = deepClone(props.currFlowForm)
let clone = {operType: props.currFlowForm.operType, form: formJson};
common.handleCloneSubmit(clone)
formJson.formData = JSON.stringify(formJson.formData)
return formJson;
}
async function getFormData() {
return await doInitData(formCreateRef, saveInitData)
}
// 暴露变量
defineExpose({
getFormData,
})
// 监听双向绑定
watch(
() => props.currFlowForm.id,
() => {
initJobData();
}
);
onMounted(() => {
initJobData()
});
</script>
<style lang="scss" scoped>
.el-dialog__footer {
text-align: center;
margin-top: 10px;
.dialog-footer {
text-align: center;
}
}
</style>

View File

@@ -0,0 +1,115 @@
<template>
<div class="layout-padding">
<div class="layout-padding-auto layout-padding-view">
<form-render ref="formCreateRef" :currFlowForm="form.currFlowForm" v-if="!validateNull(form.currFlowForm)" :renderType="'-1'"
:initFormPermPrint="initFormPermPrint">
</form-render>
</div>
<footer class="el-dialog__footer">
<span class="dialog-footer">
<el-button type="primary" @click="printForm" v-if="form.currFlowForm.printInfo">{{
t('jfI18n.print')
}}
</el-button>
</span>
</footer>
<!-- 打印表单 -->
<el-dialog v-model="form.showTinymceView" top="20px" width="700px"
:title="form.tinymceTitle" append-to-body
@close="closePrint">
<tinymce-view v-if="form.showTinymceView" :currFlowForm="form.currFlowForm"></tinymce-view>
</el-dialog>
</div>
</template>
<script setup lang="ts" name="RunApplicationView">
import * as runApplication from "/@/api/order/run-application";
import {useI18n} from "vue-i18n";
import {initJobDataByApp} from "../index";
import {deepClone} from "/@/utils/other";
import {handleFormPrint} from "/@/flow/utils/form-perm";
const {t} = useI18n();
const FormRender = defineAsyncComponent(() => import('/@/flow/components/form-create/render.vue'));
const formCreateRef = ref(null)
// 引入组件
const TinymceView = defineAsyncComponent(() => import('/@/flow/components/tinymce/TinymceView.vue'));
const props = defineProps({
currFlowForm: {
type: Object,
default: {},
}
});
const form = reactive({
// 兼容app端监听printInfo
currFlowForm: {
type: Object,
default: {},
},
showTinymceView: false,
tinymceTitle: null,
});
const $route = useRoute();
function initJobData() {
initJobDataByApp($route, handleGetObj, () => {
form.currFlowForm = props.currFlowForm
})
}
function handleGetObj(id) {
runApplication.getObj(id).then(resp => {
let formData = resp.data ? resp.data : {}
Object.assign(form.currFlowForm, formData);
})
}
async function initFormPermPrint() {
await handleFormPrint(form.currFlowForm, form.currFlowForm.type, form.currFlowForm.formId, '1')
}
function printForm() {
form.currFlowForm.formData = formCreateRef.value.design.formData
form.currFlowForm.modelRefList = []
let children = formCreateRef.value.design.fApi.children;
if (children && children.length > 0) {
// 防止!validateNull(form.currFlowForm)引用循环
children.forEach(each => form.currFlowForm.modelRefList.push({model: each.model}))
}
form.currFlowForm.rule = formCreateRef.value.design.rule
form.tinymceTitle = form.currFlowForm.formName
form.showTinymceView = true
}
function closePrint(){
delete form.currFlowForm.modelRefList
delete form.currFlowForm.rule
}
// 监听双向绑定
watch(
() => props.currFlowForm.id,
() => {
initJobData();
}
);
onMounted(() => {
initJobData()
});
</script>
<style lang="scss" scoped>
.el-dialog__footer {
text-align: center;
margin-top: 10px;
.dialog-footer {
text-align: center;
}
}
</style>