mirror of
https://gitee.com/myxzgzs/boyue_jnpf.git
synced 2025-08-09 15:52:42 +08:00
362 lines
14 KiB
Plaintext
362 lines
14 KiB
Plaintext
![]() |
#parse("PublicMacro/DetailMarco.vm")
|
||
|
#parse("PublicMacro/ConstantMarco.vm")
|
||
|
##参数
|
||
|
#ConstantParams()
|
||
|
<template>
|
||
|
## 全屏弹窗
|
||
|
#if(${context.popupType}=="fullScreen")
|
||
|
<BasicPopup v-bind="$attrs" @register="registerPopup" :title="title" destroyOnClose>
|
||
|
<template #insertToolbar>
|
||
|
#if(${context.HasPrintBtn})
|
||
|
<a-button type="primary" @click="handlePrint">#if(${context.printButtonTextI18nCode}){{t('${context.printButtonTextI18nCode}','${context.printButtonText}')}}#else${context.printButtonText}#end</a-button>
|
||
|
#end
|
||
|
</template>
|
||
|
<a-row class="p-10px dynamic-form ${context.formStyle}" :style="{ margin: '0 auto', width: '${context.fullScreenWidth}' }">
|
||
|
<!-- 表单 -->
|
||
|
<a-form :colon="false" size="${context.size}" layout=#if(${context.labelPosition}=="top") "vertical" #else "horizontal" #end
|
||
|
labelAlign=#if(${context.labelPosition}=="right") "right" #else "left" #end
|
||
|
#if(${context.labelPosition}!="top") :labelCol="{ style: { width: '${context.labelWidth}px' } }" #end
|
||
|
:model="dataForm" ref="formRef" >
|
||
|
<a-row :gutter="#if(${context.formStyle}=='word-form')0#else${context.gutter}#end">
|
||
|
<!-- 具体表单 -->
|
||
|
#DetailFormRendering()
|
||
|
<!-- 表单结束 -->
|
||
|
</a-row>
|
||
|
</a-form>
|
||
|
</a-row>
|
||
|
</BasicPopup>
|
||
|
#end
|
||
|
## 普通弹窗
|
||
|
#if(${context.popupType}=="general")
|
||
|
<BasicModal v-bind="$attrs" @register="registerModal" :title="title" width="${context.generalWidth}"
|
||
|
:minHeight="100" :showOkBtn="false">
|
||
|
<template #insertFooter>
|
||
|
#if(${context.HasPrintBtn})
|
||
|
<a-button type="primary" @click="handlePrint">#if(${context.printButtonTextI18nCode}){{t('${context.printButtonTextI18nCode}','${context.printButtonText}')}}#else${context.printButtonText}#end</a-button>
|
||
|
#end
|
||
|
</template>
|
||
|
<!-- 表单 -->
|
||
|
<a-row class="dynamic-form ${context.formStyle}">
|
||
|
<a-form :colon="false" size="${context.size}" layout=#if(${context.labelPosition}=="top") "vertical" #else "horizontal" #end
|
||
|
labelAlign=#if(${context.labelPosition}=="right") "right" #else "left" #end
|
||
|
#if(${context.labelPosition}!="top") :labelCol="{ style: { width: '${context.labelWidth}px' } }" #end
|
||
|
:model="dataForm" ref="formRef">
|
||
|
<a-row :gutter="#if(${context.formStyle}=='word-form')0#else${context.gutter}#end">
|
||
|
<!-- 具体表单 -->
|
||
|
#DetailFormRendering()
|
||
|
<!-- 表单结束 -->
|
||
|
</a-row>
|
||
|
</a-form>
|
||
|
</a-row>
|
||
|
</BasicModal>
|
||
|
#end
|
||
|
## 右侧弹窗
|
||
|
#if(${context.popupType}=="drawer")
|
||
|
<BasicDrawer v-bind="$attrs" @register="registerDrawer" :title="title" width="${context.drawerWidth}" showFooter
|
||
|
:showOkBtn="false">
|
||
|
<template #insertFooter>
|
||
|
#if(${context.HasPrintBtn})
|
||
|
<a-button type="primary" @click="handlePrint">#if(${context.printButtonTextI18nCode}){{t('${context.printButtonTextI18nCode}','${context.printButtonText}')}}#else${context.printButtonText}#end</a-button>
|
||
|
#end
|
||
|
</template>
|
||
|
<a-row class="p-10px dynamic-form ${context.formStyle}">
|
||
|
<!-- 表单 -->
|
||
|
<a-form :colon="false" size="${context.size}" layout=#if(${context.labelPosition}=="top") "vertical" #else "horizontal" #end
|
||
|
labelAlign=#if(${context.labelPosition}=="right") "right" #else "left" #end
|
||
|
#if(${context.labelPosition}!="top") :labelCol="{ style: { width: '${context.labelWidth}px' } }" #end
|
||
|
:model="dataForm" ref="formRef" >
|
||
|
<a-row :gutter="#if(${context.formStyle}=='word-form')0#else${context.gutter}#end">
|
||
|
<!-- 具体表单 -->
|
||
|
#DetailFormRendering()
|
||
|
<!-- 表单结束 -->
|
||
|
</a-row>
|
||
|
</a-form>
|
||
|
</a-row>
|
||
|
</BasicDrawer>
|
||
|
#end
|
||
|
<!-- 有关联表单详情:开始 -->
|
||
|
<RelationDetail ref="relationDetailRef" />
|
||
|
<!-- 有关联表单详情:结束 -->
|
||
|
#if(${context.HasPrintBtn})
|
||
|
<PrintSelect @register="registerPrintSelect" @change="handleShowBrowse" />
|
||
|
<PrintBrowse @register="registerPrintBrowse" />
|
||
|
#end
|
||
|
</template>
|
||
|
<script lang="ts" setup>
|
||
|
import { getDetailInfo } from './helper/api';
|
||
|
import { getConfigData } from '@/api/onlineDev/visualDev';
|
||
|
import { reactive, toRefs, nextTick, ref, computed, unref ,toRaw} from 'vue';
|
||
|
#if(${context.popupType}=="fullScreen")
|
||
|
import { BasicPopup, usePopup } from '@/components/Popup';
|
||
|
#end
|
||
|
import { BasicModal, useModal } from '@/components/Modal';
|
||
|
#if(${context.popupType}=="drawer")
|
||
|
import { BasicDrawer, useDrawer } from '@/components/Drawer';
|
||
|
#end
|
||
|
#if($childSummary == true)
|
||
|
import { thousandsFormat } from '@/utils/jnpf';
|
||
|
#end
|
||
|
// 有关联表单详情
|
||
|
import RelationDetail from '@/views/common/dynamicModel/list/detail/index.vue';
|
||
|
// 表单权限
|
||
|
import { usePermission } from '@/hooks/web/usePermission';
|
||
|
#if(${context.HasPrintBtn})
|
||
|
// 打印模板多条生成PrintSelect
|
||
|
import PrintSelect from '@/components/PrintDesign/printSelect/index.vue';
|
||
|
import PrintBrowse from '@/components/PrintDesign/printBrowse/index.vue';
|
||
|
#end
|
||
|
import { useMessage } from '@/hooks/web/useMessage';
|
||
|
import { CaretRightOutlined } from '@ant-design/icons-vue';
|
||
|
import { buildUUID } from '@/utils/uuid';
|
||
|
import { useI18n } from '@/hooks/web/useI18n';
|
||
|
import { getDataChange } from '@/api/onlineDev/visualDev';
|
||
|
import { getDataInterfaceDataInfoByIds } from '@/api/systemData/dataInterface';
|
||
|
import ExtraRelationInfo from '@/components/Jnpf/RelationForm/src/ExtraRelationInfo.vue';
|
||
|
|
||
|
interface State {
|
||
|
dataForm: any;
|
||
|
title: string;
|
||
|
maskConfig: any;
|
||
|
interfaceRes: any;
|
||
|
locationScope: any;
|
||
|
extraOptions: any;
|
||
|
extraData: any;
|
||
|
|
||
|
## 活动面板参数
|
||
|
#foreach($fieLdsModel in ${context.form})
|
||
|
#set($jnpfKey = "${fieLdsModel.jnpfKey}")
|
||
|
#set($formModel = ${fieLdsModel.formModel})
|
||
|
#set($outermost = ${formModel.outermost})
|
||
|
#set($isEnd = "${fieLdsModel.isEnd}")
|
||
|
#if(${isEnd}=='0')
|
||
|
#if($jnpfKey=='collapse')
|
||
|
#if(${outermost}=='0')
|
||
|
${formModel.model}:any;
|
||
|
#end
|
||
|
#end
|
||
|
#if($jnpfKey=='tab')
|
||
|
#if(${outermost}=='0')
|
||
|
${formModel.model}:any;
|
||
|
#end
|
||
|
#end
|
||
|
#if($jnpfKey=='steps')
|
||
|
#if(${outermost}=='0')
|
||
|
${formModel.model}:any;
|
||
|
#end
|
||
|
#end
|
||
|
#end
|
||
|
#end
|
||
|
## 子表平铺活动面板变量
|
||
|
#foreach($children in ${context.children})
|
||
|
#set($aliasname = "${children.aliasLowName}")
|
||
|
#if($!{children.layoutType} == 'list')
|
||
|
${aliasname}outerActiveKey: any;
|
||
|
${aliasname}innerActiveKey: any;
|
||
|
#end
|
||
|
#end
|
||
|
}
|
||
|
|
||
|
defineOptions({ name: 'Detail' });
|
||
|
const { createMessage, createConfirm } = useMessage();
|
||
|
#if(${context.popupType}=="fullScreen")
|
||
|
const [registerPopup, { openPopup, setPopupProps, closePopup }] = usePopup();
|
||
|
#end
|
||
|
#if(${context.popupType}=="general")
|
||
|
const [registerModal, { openModal, setModalProps, closeModal }] = useModal();
|
||
|
#end
|
||
|
#if(${context.popupType}=="drawer")
|
||
|
const [registerDrawer, { openDrawer, setDrawerProps, closeDrawer }] = useDrawer();
|
||
|
#end
|
||
|
#if(${context.HasPrintBtn})
|
||
|
const [registerPrintSelect, { openModal: openPrintSelect }] = useModal();
|
||
|
const [registerPrintBrowse, { openModal: openPrintBrowse }] = useModal();
|
||
|
#end
|
||
|
##子表列表字段-及合计方法
|
||
|
#DetailChildTableColumns()
|
||
|
|
||
|
const { t } = useI18n();
|
||
|
const relationDetailRef = ref<any>(null);
|
||
|
const state = reactive<State>({
|
||
|
dataForm:{},
|
||
|
title: t('common.detailText','详情'),
|
||
|
maskConfig:#CreateMaskConfig(),
|
||
|
interfaceRes: ${context.templateJsonAll},
|
||
|
locationScope:#CreateLocationScope(),
|
||
|
extraOptions: #CreateExtraOptions(),
|
||
|
extraData: #CreateExtraData(),
|
||
|
## 活动面板参数
|
||
|
#foreach($fieLdsModel in ${context.form})
|
||
|
#set($jnpfKey = "${fieLdsModel.jnpfKey}")
|
||
|
#set($formModel = ${fieLdsModel.formModel})
|
||
|
#set($outermost = ${formModel.outermost})
|
||
|
#set($isEnd = "${fieLdsModel.isEnd}")
|
||
|
#if(${isEnd}=='0')
|
||
|
#if($jnpfKey=='collapse')
|
||
|
#if(${outermost}=='0')
|
||
|
${formModel.model}:${formModel.active},
|
||
|
#end
|
||
|
#end
|
||
|
#if($jnpfKey=='tab')
|
||
|
#if(${outermost}=='0')
|
||
|
${formModel.model}:'${formModel.active}',
|
||
|
#end
|
||
|
#end
|
||
|
#if($jnpfKey=='steps')
|
||
|
#if(${outermost}=='0')
|
||
|
${formModel.model}:${formModel.active},
|
||
|
#end
|
||
|
#end
|
||
|
#end
|
||
|
#end
|
||
|
## 子表平铺活动面板变量
|
||
|
#foreach($children in ${context.children})
|
||
|
#set($aliasname = "${children.aliasLowName}")
|
||
|
#if($!{children.layoutType} == 'list')
|
||
|
${aliasname}outerActiveKey: [0],
|
||
|
${aliasname}innerActiveKey: [],
|
||
|
#end
|
||
|
#end
|
||
|
});
|
||
|
const { title, dataForm, maskConfig } = toRefs(state);
|
||
|
// 表单权限
|
||
|
const { hasFormP } = usePermission();
|
||
|
|
||
|
defineExpose({ init });
|
||
|
|
||
|
function init(data) {
|
||
|
state.dataForm.id = data.id;
|
||
|
#if(${context.popupType}=="fullScreen")
|
||
|
openPopup();
|
||
|
#end
|
||
|
#if(${context.popupType}=="general")
|
||
|
openModal();
|
||
|
#end
|
||
|
#if(${context.popupType}=="drawer")
|
||
|
openDrawer();
|
||
|
#end
|
||
|
nextTick(() => {
|
||
|
setTimeout(initData, 0);
|
||
|
});
|
||
|
}
|
||
|
function initData() {
|
||
|
changeLoading(true);
|
||
|
#InitActiveValue()
|
||
|
if (state.dataForm.id) {
|
||
|
getData(state.dataForm.id);
|
||
|
} else {
|
||
|
#if(${context.popupType}=="fullScreen")
|
||
|
closePopup();
|
||
|
#end
|
||
|
#if(${context.popupType}=="general")
|
||
|
closeModal();
|
||
|
#end
|
||
|
#if(${context.popupType}=="drawer")
|
||
|
closeDrawer();
|
||
|
#end
|
||
|
}
|
||
|
}
|
||
|
function getData(id) {
|
||
|
getDetailInfo(id).then((res) => {
|
||
|
state.dataForm = res.data || {};
|
||
|
nextTick(() => {
|
||
|
## 子表平铺,默认展开
|
||
|
#foreach($itemModel in ${context.children})
|
||
|
#set($aliasname =$itemModel.aliasLowName)
|
||
|
#if($!{itemModel.layoutType} == 'list')
|
||
|
if (state.dataForm.${aliasname}List) {
|
||
|
for (let i = 0; i < state.dataForm.${aliasname}List.length; i++) {
|
||
|
state.dataForm.${aliasname}List[i].jnpfId = buildUUID();
|
||
|
}
|
||
|
}
|
||
|
set${aliasname}ActiveKey();
|
||
|
#end
|
||
|
#end
|
||
|
#runAllExtraFun()
|
||
|
changeLoading(false);
|
||
|
});
|
||
|
});
|
||
|
}
|
||
|
|
||
|
## 平铺布局时设置默认展开
|
||
|
#foreach($itemModel in ${context.children})
|
||
|
#if(${itemModel.layoutType} == 'list')
|
||
|
#set($aliasname =$itemModel.aliasLowName)
|
||
|
// 平铺布局时设置默认展开
|
||
|
function set${aliasname}ActiveKey() {
|
||
|
state.${aliasname}outerActiveKey = [0];
|
||
|
state.${aliasname}innerActiveKey = [];
|
||
|
#if(${itemModel.defaultExpandAll})
|
||
|
state.${aliasname}innerActiveKey = ['summary'];
|
||
|
if (!state.dataForm.${aliasname}List.length) return;
|
||
|
for (let i = 0; i < state.dataForm.${aliasname}List.length; i++) {
|
||
|
state.${aliasname}innerActiveKey.push(state.dataForm.${aliasname}List[i].jnpfId);
|
||
|
}
|
||
|
#end
|
||
|
}
|
||
|
#end
|
||
|
#end
|
||
|
function toDetail(modelId, id, propsValue) {
|
||
|
if (!id) return;
|
||
|
getConfigData(modelId).then((res) => {
|
||
|
if (!res.data || !res.data.formData) return;
|
||
|
const formConf = JSON.parse(res.data.formData);
|
||
|
formConf.popupType = 'general';
|
||
|
formConf.hasPrintBtn = false;
|
||
|
formConf.customBtns = [];
|
||
|
const data = { id, formConf, modelId, propsValue};
|
||
|
relationDetailRef.value?.init(data);
|
||
|
});
|
||
|
}
|
||
|
#if($context.HasPrintBtn)
|
||
|
function handlePrint() {
|
||
|
let printId=#if(${context.PrintId})${context.PrintId}#else [] #end
|
||
|
if (!printId?.length) return createMessage.error('未配置打印模板');
|
||
|
if (printId?.length === 1) return handleShowBrowse(printId[0]);
|
||
|
openPrintSelect(true, printId);
|
||
|
}
|
||
|
function handleShowBrowse(id) {
|
||
|
openPrintBrowse(true, { id, formInfo: [{ formId: state.dataForm.id }] });
|
||
|
}
|
||
|
#end
|
||
|
function setFormProps(data) {
|
||
|
#if(${context.popupType}=="fullScreen")
|
||
|
setPopupProps(data);
|
||
|
#end
|
||
|
#if(${context.popupType}=="general")
|
||
|
setModalProps(data);
|
||
|
#end
|
||
|
#if(${context.popupType}=="drawer")
|
||
|
setDrawerProps(data);
|
||
|
#end
|
||
|
}
|
||
|
function changeLoading(loading) {
|
||
|
setFormProps({ loading });
|
||
|
}
|
||
|
##合计方法
|
||
|
#if($childSummary==true)
|
||
|
//子表合计方法
|
||
|
function getCmpValOfRow(row, key, summaryField) {
|
||
|
if (!summaryField.length) return '';
|
||
|
const isSummary = key => summaryField.includes(key);
|
||
|
const target = row[key];
|
||
|
if (!target) return '';
|
||
|
let data = isNaN(target) ? 0 : Number(target);
|
||
|
if (isSummary(key)) return data || 0;
|
||
|
return '';
|
||
|
}
|
||
|
#end
|
||
|
|
||
|
function getParamList(key) {
|
||
|
let templateJson: any[] = state.interfaceRes[key];
|
||
|
if (!templateJson || !templateJson.length || !state.dataForm) return templateJson;
|
||
|
for (let i = 0; i < templateJson.length; i++) {
|
||
|
if (templateJson[i].relationField && templateJson[i].sourceType == 1) {
|
||
|
templateJson[i].defaultValue = state.dataForm[templateJson[i].relationField + '_id'] || '';
|
||
|
}
|
||
|
}
|
||
|
return templateJson;
|
||
|
}
|
||
|
## 生成关联表单弹窗初始化数据方法
|
||
|
#ExtraInfoFun()
|
||
|
</script>
|