Merge branches 'dev' and 'dev_dyd' of https://fcd.gdyditc.com/itc-framework/ma/2024/front into dev_dyd

This commit is contained in:
dyd
2025-06-23 15:27:22 +08:00
31 changed files with 2081 additions and 401 deletions

View File

@ -41,6 +41,9 @@ VITE_GLOB_API_URL_PREFIX =
#租户开关
# VITE_GLOB_TENANT_ENABLED = true
#登录时是否需要输入租户码
# VITE_GLOB_TENANT_INPUT_REQUIRED = true
# 屏蔽通知消息的轮询
VITE_GLOB_DISABLE_NEWS=false
# 禁用关闭页面提示

View File

@ -36,3 +36,9 @@ VITE_GLOB_API_URL_PREFIX =
# 屏蔽通知消息的轮询
VITE_GLOB_DISABLE_NEWS = true
#租户开关
# VITE_GLOB_TENANT_ENABLED = true
#登录时是否需要输入租户码
# VITE_GLOB_TENANT_INPUT_REQUIRED = true

View File

@ -38,6 +38,9 @@ VITE_GLOB_API_URL_PREFIX =
VITE_USE_PWA = false
#租户开关
VITE_GLOB_TENANT_ENABLED = true
#登录时是否需要输入租户码
# VITE_GLOB_TENANT_INPUT_REQUIRED = true
# 屏蔽通知消息的轮询
VITE_GLOB_DISABLE_NEWS=false
# 禁用关闭页面提示

View File

@ -36,3 +36,9 @@ VITE_GLOB_API_URL_PREFIX =
# 打包是否开启pwa功能
VITE_USE_PWA = false
#租户开关
# VITE_GLOB_TENANT_ENABLED = true
#登录时是否需要输入租户码
# VITE_GLOB_TENANT_INPUT_REQUIRED = true

View File

@ -112,6 +112,21 @@ export async function getFormTemplate(id: string, mode: ErrorMessageMode = 'moda
);
}
/**
* @description: 获取模板详情信息-优先从缓存获取
*/
export async function getFormTemplateUsingCache(id: string, mode: ErrorMessageMode = 'modal') {
return defHttp.get<FormTemplateModel>(
{
url: Api.Info,
params: {id,useCache:1},
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 更新模板状态
*/

View File

@ -0,0 +1,79 @@
import { defHttp } from '/@/utils/http/axios';
import { ErrorMessageMode } from '/#/axios';
enum Api {
ExportDatas= '/system/dataMigration/exportDatas',
DownloadDatas='/system/dataMigration/downloadDatas',
LogList='/system/dataMigration/logList',
LogDetails='/system/dataMigration/logDetails',
}
/**
* @description: 系统配置迁移-导出资源
*/
export async function exportDatas(params, mode: ErrorMessageMode = 'modal') {
return defHttp.post(
{
url: Api.ExportDatas,
data:params,
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 根据uuid(目录名称)下载数据
*/
export async function downloadDatas(params?: object, mode: ErrorMessageMode = 'modal') {
return defHttp.download(
{
url: Api.DownloadDatas+"/"+params.uuid,
method: 'GET',
responseType: 'blob',
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 获取日志列表
*/
export async function getLogList(mode: ErrorMessageMode = 'modal') {
return defHttp.get<[]>(
{
url: Api.LogList
},
{
errorMessageMode: mode,
},
);
}
/**
* @description: 获取日志详情
*/
export async function getLogDetails(fileName:String,mode: ErrorMessageMode = 'modal') {
return defHttp.get<[]>(
{
url: Api.LogDetails,
params:{
fileName
}
},
{
errorMessageMode: mode,
},
);
}

View File

@ -11,6 +11,7 @@ enum Api {
SimpleTree = '/system/menu/simple-tree',
TenantSimpleTree = '/system/menu/tenant-auth-tree',
Menu = '/system/menu',
MenuInfoByComponentPath = '/system/menu/info-by-component-path',
Button = '/system/menu/button',
Column = '/system/menu-colum/list',
Form = '/system/menu-form/list',
@ -197,3 +198,21 @@ export async function getMenuFormById(params, mode: ErrorMessageMode = 'modal')
},
);
}
/**
* @description: 根据组件路径查询菜单
*/
export async function getMenuByIdComponentPath(componentPath:String, mode: ErrorMessageMode = 'modal') {
return defHttp.get<MenuModel[]>(
{
url: Api.MenuInfoByComponentPath,
params:{componentPath}
},
{
errorMessageMode: mode,
},
);
}

View File

@ -27,31 +27,20 @@
import { storeToRefs } from 'pinia';
import { Tooltip } from 'ant-design-vue';
import { useUserStore } from '/@/store/modules/user';
import { changeTenant } from '/@/api/system/tenant';
import { useI18n } from '/@/hooks/web/useI18n';
import {useMessage} from "/@/hooks/web/useMessage";
import {useTabs} from "/@/hooks/web/useTabs";
import {router} from "/@/router";
import {setupRouterGuard} from "/@/router/guard";
import {usePermissionStore} from "/@/store/modules/permission";
import {useMenuSetting} from "/@/hooks/setting/useMenuSetting";
import {useAppInject} from "/@/hooks/web/useAppInject";
import {useAppStore} from "/@/store/modules/app";
import {useTenantManager} from "/@/utils/tenantManager";
const userStore = useUserStore();
const { t } = useI18n();
const { userInfo } = storeToRefs(userStore);
const { closeAll } = useTabs(router);
const permissionStore = usePermissionStore();
const { getShowTopMenu } = useMenuSetting();
const { getIsMobile } = useAppInject();
const appStore = useAppStore();
const formInfo: any = ref({
tenants: [],
tenantId: '',
tenantCode: '',
tenantName: '',
});
const {toggleLocal}=useTenantManager();
getDropMenuList();
watch(
() => userInfo.value,
@ -73,20 +62,9 @@
});
}
}
async function toggleLocale(lang: string) {
appStore.setPageLoadingAction(true);
let res = await changeTenant(lang);
await userStore.afterLoginAction(true);
closeAll();
await setupRouterGuard(router);
await permissionStore.changeSubsystem(getShowTopMenu.value, getIsMobile.value);
if(permissionStore.getSubSysList.length>0){
permissionStore.setSubSystem(permissionStore.getSubSysList[0].id);
}else{
permissionStore.setSubSystem("");
}
//appStore.setPageLoadingAction(false);
//location.reload();
async function switchTenant(tenantCode: string) {
await toggleLocal({tenantCode:tenantCode, goHome:true,tabCloseAction:"closeAll"});
}
function handleMenuEvent(menu: DropMenu) {
@ -99,7 +77,7 @@
title: () => h('span', t('温馨提醒')),
content: () => h('span', t('是否确认切换租户?未保存的数据可能会丢失!')),
onOk: async () => {
toggleLocale(menu.event as string);
switchTenant(menu.event as string);
},
okText: () => t('确认'),
cancelText: () => t('取消'),

View File

@ -1,5 +1,6 @@
export { default as MenuConfigStep } from './src/MenuConfigStep.vue';
export { default as StructureConfigStep } from './src/StructureConfigStep.vue';
export { default as EntireConfigStep } from './src/EntireConfigStep.vue';
export { default as ViewDesignStep } from './src/ViewDesignStep.vue';

View File

@ -0,0 +1,150 @@
<template>
<div class="entireConfigStep">
<a-tabs v-model:activeKey="activeKey" size="large" class="tab-list">
<a-tab-pane key="1" tab="列表配置">
<CodeEditor v-model:value="listConfigObject" @change="handleListConfigChange" language="json" />
</a-tab-pane>
<a-tab-pane key="2" tab="表单配置">
<CodeEditor v-model:value="formConfigObject" @change="handleFormConfigChange" language="json" />
</a-tab-pane>
<a-tab-pane key="3" tab="渲染覆盖配置">
<CodeEditor v-model:value="renderConfigObject" @change="handleRenderConfigChange" :mode="MODE.JS" />
</a-tab-pane>
</a-tabs>
</div>
</template>
<script lang="ts" setup>
import { onMounted, inject,watch,computed, ref,unref} from 'vue';
import { useI18n } from '/@/hooks/web/useI18n';
import { useMessage } from '/@/hooks/web/useMessage';
import { debounce} from 'lodash-es';
import {CustomFormConfig, GeneratorConfig} from '/@/model/generator/generatorConfig';
import { CodeEditor,MODE } from '/@/components/CodeEditor';
import {ListConfig} from "/@/model/generator/listConfig";
const { t } = useI18n();
const { notification } = useMessage();
const generatorConfig = inject<GeneratorConfig>('generatorConfig');
const customFormConfig = inject<CustomFormConfig>('customFormConfig');
const listConfigObject=ref();
const formConfigObject=ref();
const renderConfigObject=ref();
const activeKey = ref('1');
onMounted(() => {
});
const handleListConfigChange=debounce((v)=>{
try{
let jsonObject = JSON.parse(v);
generatorConfig.listConfig.queryConfigs= jsonObject.queryConfigs;
generatorConfig.listConfig.columnConfigs= jsonObject.columnConfigs;
generatorConfig.listConfig.buttonConfigs= jsonObject.buttonConfigs;
}catch(e){
console.log(e);
notification.error({
message: t('提示'),
description: t('列表配置json格式有误'),
});
}
},1000);
const handleFormConfigChange=debounce((v)=>{
try{
generatorConfig.formJson= JSON.parse(v);
}catch(e){
console.error(e);
notification.error({
message: t('提示'),
description: t('表单配置json格式有误'),
});
}
},1000);
const handleRenderConfigChange=debounce((v)=>{
customFormConfig.renderConfig=v;
},1000);
const initStep =()=> {
listConfigObject.value=JSON.stringify({
queryConfigs:generatorConfig.listConfig.queryConfigs||[],
columnConfigs:generatorConfig.listConfig.columnConfigs||[],
buttonConfigs:generatorConfig.listConfig.buttonConfigs||[]
}, null, 2);
formConfigObject.value=JSON.stringify(generatorConfig.formJson, null, 2);
renderConfigObject.value= customFormConfig.renderConfig||'';
}
const validateStep = async (): Promise<boolean> => {
try{
let jsonObject = JSON.parse(listConfigObject.value);
generatorConfig.listConfig.queryConfigs= jsonObject.queryConfigs;
generatorConfig.listConfig.columnConfigs= jsonObject.columnConfigs;
generatorConfig.listConfig.buttonConfigs= jsonObject.buttonConfigs;
}catch(e){
console.error(e);
notification.error({
message: t('提示'),
description: t('列表配置json格式有误'),
});
return false;
}
try{
generatorConfig.formJson= JSON.parse(formConfigObject.value);
}catch(e){
console.error(e);
notification.error({
message: t('提示'),
description: t('表单配置json格式有误'),
});
return false;
}
customFormConfig.renderConfig=renderConfigObject.value;
return true;
}
defineExpose({initStep,validateStep});
</script>
<style lang="less" scoped>
.entireConfigStep{
height:100%;
}
:deep(.ant-tabs-nav-wrap) {
width: 100% !important;
display: block !important;
border-top: 8px solid #f0f2f5;
border-bottom: 3px solid #f0f2f5;
}
:deep(.ant-tabs-tab) {
width: 33.33% !important;
display: block !important;
text-align: center !important;
}
:deep(.ant-tabs-tabpane) {
padding: 0 8px;
}
:deep(.ant-tabs-content) {
height: 100% !important;
overflow-y: auto;
}
:deep(.ant-tabs-nav) {
margin-bottom: 0;
}
.tab-list {
height: 100%;
}
</style>

View File

@ -185,6 +185,7 @@ export enum TaskTypeUrl {
// 工作流分类id
export enum FlowCategory {
ID = '1419276800524425555',
CODE = 'WF10000',
}
// 审批类型 0 同意 1 拒绝 2 驳回 3 结束 4 其他(用户自定义按钮)

View File

@ -0,0 +1,149 @@
import { FormSchema } from '/@/components/Form';
import { BasicColumn } from "/@/components/Table";
import { getFormTemplateUsingCache } from '/@/api/form/design';
import { getMenuByIdComponentPath } from '/@/api/system/menu';
import { deepMerge } from '/@/utils';
import { useI18n } from '/@/hooks/web/useI18n';
import { useMessage } from '/@/hooks/web/useMessage';
const { t } = useI18n();
const { notification } = useMessage();
export function useFormConfig() {
async function mergeFormSchemas(obj:{formSchema: FormSchema[],formId:String,formPath:String}){
try{
let formProps;
if(obj.formId){
formProps=await queryConfig(obj.formId,'formProps');
}else{
formProps=await queryConfigByFormPath(obj.formPath,'formProps');
}
let fschemas=formProps?.schemas;
if(fschemas&&fschemas.length>0){
return deepMerge(obj.formSchema,fschemas);
}else{
return formSchema;
}
}catch(e){
return [];
}
}
async function mergeFormEventConfigs(obj:{formEventConfigs,formId:String,formPath:String}){
try{
let fEConfigs;
if(obj.formId){
fEConfigs=await queryConfig(obj.formId,'formEventConfigs');
}else{
fEConfigs=await queryConfigByFormPath(obj.formPath,'formEventConfigs');
}
return deepMerge(obj.formEventConfigs,fEConfigs);
}catch(e){
return {};
}
}
async function mergeColumns(columns: BasicColumn[],formId:String){
try{
const cols=await queryConfig(formId,'columns');
if(cols&&cols.length>0){
const filteredCol = cols.filter(colItem =>
columns.some(column => column.dataIndex === colItem.dataIndex)
);
return filteredCol;
}else{
return columns;
}
}catch(e){
return [];
}
}
async function mergeSearchFormSchema(searchFormSchema: FormSchema[],formId:String){
try{
const sFormSchema=await queryConfig(formId,'searchFormSchema');
if(sFormSchema&&sFormSchema.length>0){
const filteredsFormSchema = sFormSchema.filter(sItem =>
searchFormSchema.some( searchItem => searchItem.field === sItem.field)
);
return filteredsFormSchema;
}else{
return searchFormSchema;
}
}catch(e){
return [];
}
}
async function mergeButtons(buttons,formId:String){
try{
const btns=await queryConfig(formId,'buttons');
if(btns&&btns.length>0){
return btns;
}else{
return buttons;
}
}catch(e){
return[];
}
}
async function queryConfigByFormPath(componentPath:String,configName:String){
if(componentPath==null){
notification.error({
message: t('提示'),
description: `发生异常,组件路径不能为空!`,
});
throw new Error('发生异常,组件路径不能为空!');
}
const menu=await getMenuByIdComponentPath("/"+componentPath+"/index");
if(menu==null){
notification.error({
message: t('提示'),
description: `发生异常,根据组件路径找不到菜单!`,
});
throw new Error('发生异常,根据组件路径找不到菜单!');
}
const formId=menu.formId;
return await queryConfig(formId,configName);
}
async function queryConfig(formId:String,configName:String){
const formTemplate = await getFormTemplateUsingCache(formId);
const renderConfig=formTemplate.renderConfig;
const exportMatches = renderConfig.matchAll(/export\s+const\s+(\w+)\s*(?::\s*\w+(?:\[\])?)?\s*=\s*([\s\S]*?)(?=\n\s*export\s+const|\n\s*const|\n\s*export\s+function|\n\s*function|$)/g);
for (const match of exportMatches) {
const varName = match[1];
const valueCode = match[2].trim();
const cleanCode = valueCode.endsWith(';') ? valueCode.slice(0, -1) : valueCode;
if(varName==configName) {
try {
const value = new Function(`return ${cleanCode}`)();
return value;
} catch (e) {
console.error(`Failed to parse ${varName}:`, e);
notification.error({
message: t('提示'),
description: `解析表单渲染覆盖配置出错[解析${configName}发生异常]`,
});
throw new Error('解析表单渲染覆盖配置出错,请联系管理员处理');
}
}
}
return null;
}
return {
mergeFormSchemas,
mergeColumns,
mergeSearchFormSchema,
mergeButtons,
mergeFormEventConfigs
};
}

View File

@ -22,7 +22,7 @@ export function getAppEnvConfig() {
(import.meta.env as unknown as GlobEnvConfig)
: window[ENV_NAME as any]) as unknown as GlobEnvConfig;
const { VITE_GLOB_APP_TITLE, VITE_GLOB_API_URL, VITE_GLOB_APP_SHORT_NAME, VITE_GLOB_API_URL_PREFIX, VITE_GLOB_REQUEST_TIMEOUT, VITE_GLOB_UPLOAD_URL, VITE_GLOB_UPLOAD_PREVIEW, VITE_GLOB_OUT_LINK_URL, VITE_GLOB_REPORT_URL, VITE_GLOB_PRINT_BASE_URL, VITE_GLOB_TENANT_ENABLED } = ENV;
const { VITE_GLOB_APP_TITLE, VITE_GLOB_API_URL, VITE_GLOB_APP_SHORT_NAME, VITE_GLOB_API_URL_PREFIX, VITE_GLOB_REQUEST_TIMEOUT, VITE_GLOB_UPLOAD_URL, VITE_GLOB_UPLOAD_PREVIEW, VITE_GLOB_OUT_LINK_URL, VITE_GLOB_REPORT_URL, VITE_GLOB_PRINT_BASE_URL, VITE_GLOB_TENANT_ENABLED,VITE_GLOB_TENANT_INPUT_REQUIRED } = ENV;
if (!/^[a-zA-Z\_]*$/.test(VITE_GLOB_APP_SHORT_NAME)) {
warn(`VITE_GLOB_APP_SHORT_NAME Variables can only be characters/underscores, please modify in the environment variables and re-running.`);
@ -39,7 +39,8 @@ export function getAppEnvConfig() {
VITE_GLOB_OUT_LINK_URL,
VITE_GLOB_REPORT_URL,
VITE_GLOB_PRINT_BASE_URL,
VITE_GLOB_TENANT_ENABLED
VITE_GLOB_TENANT_ENABLED,
VITE_GLOB_TENANT_INPUT_REQUIRED
};
}

View File

@ -643,6 +643,7 @@ ${hasTemplatePrint ? ' reactive ' : ''}
import { useMessage } from '/@/hooks/web/useMessage';
import { useI18n } from '/@/hooks/web/useI18n';
import { usePermission } from '/@/hooks/web/usePermission';
import { useFormConfig } from '/@/hooks/web/useFormConfig';
import { useRouter } from 'vue-router';
import { get${pascalMainTableName} } from '/@/api/${
model.outputConfig.outputValue
@ -710,7 +711,7 @@ ${hasTemplatePrint ? ' reactive ' : ''}
: ''
}
${componentArray.includes('money-chinese') ? `import nzhcn from 'nzh/cn';` : ''}
import { searchFormSchema, columns } from './components/config';
import {formConfig, searchFormSchema, columns } from './components/config';
${
model.listConfig.buttonConfigs.filter((x) => x.isUse).length > 0 ||
model.listConfig.leftMenuConfig?.childIcon ||
@ -746,6 +747,7 @@ ${hasTemplatePrint ? ' reactive ' : ''}
}
import useEventBus from '/@/hooks/event/useEventBus';
import { cloneDeep } from 'lodash-es';
const { bus, CREATE_FLOW, FLOW_PROCESSED, FORM_LIST_MODIFIED } = useEventBus();
@ -753,8 +755,12 @@ ${hasTemplatePrint ? ' reactive ' : ''}
const { t } = useI18n();
defineEmits(['register']);
const { filterColumnAuth, filterButtonAuth } = usePermission();
const { mergeColumns,mergeSearchFormSchema,mergeButtons } = useFormConfig();
const filterColumns = cloneDeep(filterColumnAuth(columns));
const customConfigColums =ref(filterColumns);
const customSearchFormSchema =ref(searchFormSchema);
const filterColumns = filterColumnAuth(columns);
const tableRef = ref();
${
hasFilterButton
@ -766,11 +772,13 @@ ${hasTemplatePrint ? ' reactive ' : ''}
}`
: ''
}
//所有按钮
const buttons = ref(${JSON.stringify(model.listConfig.buttonConfigs.filter((x) => x.isUse))});
//展示在列表内的按钮
const actionButtons = ref<string[]>(['view', 'edit', 'copyData', 'delete', 'startwork','flowRecord']);
const buttonConfigs = computed(()=>{
const list = ${JSON.stringify(model.listConfig.buttonConfigs.filter((x) => x.isUse))}
return filterButtonAuth(list);
return filterButtonAuth(buttons.value);
})
const tableButtonConfig = computed(() => {
@ -868,12 +876,12 @@ ${hasTemplatePrint ? ' reactive ' : ''}
title: '${model.listConfig?.listTitle||''}' || (formName + '列表'),
api: get${pascalMainTableName}Page,
rowKey: '${camelCaseString(mainTable.pkField)}',
columns: filterColumns,
columns: customConfigColums,
formConfig: {
rowProps: {
gutter: 16,
},
schemas: searchFormSchema,
schemas: customSearchFormSchema,
fieldMapToTime: [${
model.listConfig.queryConfigs
.filter((item) => {
@ -961,7 +969,8 @@ ${hasTemplatePrint ? ' reactive ' : ''}
path: '/flow/' + schemaId + '/' + (processId || '') + '/approveFlow',
query: {
taskId: taskIds[0],
formName: formName
formName: formName,
formId:currentRoute.value.meta.formId
}
});
} else if (schemaId && !taskIds && processId) {
@ -970,7 +979,8 @@ ${hasTemplatePrint ? ' reactive ' : ''}
query: {
readonly: 1,
taskId: '',
formName: formName
formName: formName,
formId:currentRoute.value.meta.formId
}
});
} else {
@ -978,7 +988,8 @@ ${hasTemplatePrint ? ' reactive ' : ''}
path: '/form/${lowerClassName}/' + record.id + '/viewForm',
query: {
formPath: '${model.outputConfig.outputValue}/${lowerClassName}',
formName: formName
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
@ -1007,7 +1018,8 @@ ${hasTemplatePrint ? ' reactive ' : ''}
path: '/form/${lowerClassName}/0/createForm',
query: {
formPath: '${model.outputConfig.outputValue}/${lowerClassName}',
formName: formName
formName: formName,
formId:currentRoute.value.meta.formId
}
});
}
@ -1025,7 +1037,8 @@ ${hasTemplatePrint ? ' reactive ' : ''}
path: '/form/${lowerClassName}/' + record.id + '/updateForm',
query: {
formPath: '${model.outputConfig.outputValue}/${lowerClassName}',
formName: formName
formName: formName,
formId:currentRoute.value.meta.formId
}
});`
: `
@ -1440,6 +1453,9 @@ ${hasTemplatePrint ? ' reactive ' : ''}
} else {
bus.on(FORM_LIST_MODIFIED, handleRefresh);
}
// 合并渲染覆盖配置中的列表配置,包括展示字段配置、搜索字段配置、按钮配置
mergeCustomListRenderConfig();
});
onUnmounted(() => {
if (schemaIdComputedRef.value) {
@ -1587,6 +1603,21 @@ ${hasTemplatePrint ? ' reactive ' : ''}
`
: ''
}
async function mergeCustomListRenderConfig(){
if (formConfig.useCustomConfig) {
let formId=currentRoute.value.meta.formId;
//1.合并展示字段配置
let cols= await mergeColumns(customConfigColums.value,formId);
customConfigColums.value=cols;
//2.合并搜索字段配置
let sFormSchema= await mergeSearchFormSchema(customSearchFormSchema.value,formId);
customSearchFormSchema.value=sFormSchema;
//3.合并按钮配置
let btns= await mergeButtons(buttons.value,formId);
buttons.value=btns;
}
};
</script>
<style lang="less" scoped>
:deep(.ant-table-selection-col) {
@ -1599,7 +1630,7 @@ ${hasTemplatePrint ? ' reactive ' : ''}
display: none !important;
}
</style>`;
return code;
return code.replace(/(\n\s*\n\s*\n)+/g, '\n');
}
/**
* 构建SimpleForm页面
@ -1640,8 +1671,8 @@ export function buildSimpleFormCode(model: GeneratorConfig, _tableInfo: TableInf
/>
</template>
<script lang="ts" setup>
import { reactive, ref, onMounted } from 'vue';
import { formProps, formEventConfigs } from './config';
import { reactive, ref,onBeforeMount,onMounted } from 'vue';
import { formProps, formEventConfigs ,formConfig} from './config';
import SimpleForm from '/@/components/SimpleForm/src/SimpleForm.vue';
import { add${pascalMainTableName}, get${pascalMainTableName}, update${pascalMainTableName} } from '/@/api/${
model.outputConfig.outputValue
@ -1649,11 +1680,16 @@ export function buildSimpleFormCode(model: GeneratorConfig, _tableInfo: TableInf
import { cloneDeep } from 'lodash-es';
import { FormDataProps } from '/@/components/Designer/src/types';
import { usePermission } from '/@/hooks/web/usePermission';
import { useFormConfig } from '/@/hooks/web/useFormConfig';
import { FromPageType } from '/@/enums/workflowEnum';
import { createFormEvent, getFormDataEvent, loadFormEvent, submitFormEvent,} from '/@/hooks/web/useFormEvent';
import { changeWorkFlowForm, changeSchemaDisabled } from '/@/hooks/web/useWorkFlowForm';
import { WorkFlowFormParams } from '/@/model/workflow/bpmnConfig';
import { useRouter } from 'vue-router';
const { filterFormSchemaAuth } = usePermission();
const { mergeFormSchemas,mergeFormEventConfigs } = useFormConfig();
const { currentRoute } = useRouter();
const RowKey = '${mainTable.pkField ? camelCase(mainTable.pkField) : 'id'}';
const emits = defineEmits(['changeUploadComponentIds','loadingCompleted', 'form-mounted']);
@ -1665,20 +1701,25 @@ export function buildSimpleFormCode(model: GeneratorConfig, _tableInfo: TableInf
});
const systemFormRef = ref();
const data: { formDataProps: FormDataProps } = reactive({
formDataProps: cloneDeep(formProps),
formDataProps: {schemas:[]} as FormDataProps,
});
const state = reactive({
formModel: {},
});
let customFormEventConfigs=[];
onMounted(async () => {
try {
// 合并渲染覆盖配置中的字段配置、表单事件配置
await mergeCustomFormRenderConfig();
if (props.fromPage == FromPageType.MENU) {
setMenuPermission();
await createFormEvent(formEventConfigs, state.formModel,
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(formEventConfigs, state.formModel,
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
} else if (props.fromPage == FromPageType.FLOW) {
@ -1689,10 +1730,10 @@ export function buildSimpleFormCode(model: GeneratorConfig, _tableInfo: TableInf
} else if (props.fromPage == FromPageType.DESKTOP) {
// 桌面设计 表单事件需要执行
emits('loadingCompleted'); //告诉系统表单已经加载完毕
await createFormEvent(formEventConfigs, state.formModel,
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(formEventConfigs, state.formModel,
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
}
@ -1701,9 +1742,27 @@ export function buildSimpleFormCode(model: GeneratorConfig, _tableInfo: TableInf
}
});
async function mergeCustomFormRenderConfig() {
let cloneProps=cloneDeep(formProps);
let fEventConfigs=cloneDeep(formEventConfigs);
if (formConfig.useCustomConfig) {
if(props.fromPage !== FromPageType.FLOW){
let formPath=currentRoute.value.query.formPath;
//1.合并字段配置
cloneProps.schemas=await mergeFormSchemas({formSchema:cloneProps.schemas!,formPath:formPath});
//2.合并表单事件配置
fEventConfigs=await mergeFormEventConfigs({formEventConfigs:fEventConfigs,formPath:formPath});
}
}
data.formDataProps=cloneProps;
customFormEventConfigs=fEventConfigs;
}
// 根据菜单页面权限,设置表单属性(必填,禁用,显示)
function setMenuPermission() {
data.formDataProps.schemas = filterFormSchemaAuth(formProps.schemas!);
data.formDataProps.schemas = filterFormSchemaAuth(data.formDataProps.schemas!);
}
// 校验form 通过返回表单数据
@ -1730,7 +1789,7 @@ export function buildSimpleFormCode(model: GeneratorConfig, _tableInfo: TableInf
}
setFieldsValue(record);
state.formModel = record;
await getFormDataEvent(formEventConfigs, state.formModel, systemFormRef.value, formProps.schemas); //表单事件:获取表单数据
await getFormDataEvent(customFormEventConfigs, state.formModel, systemFormRef.value, formProps.schemas); //表单事件:获取表单数据
return record;
} catch (error) {
@ -1758,7 +1817,7 @@ export function buildSimpleFormCode(model: GeneratorConfig, _tableInfo: TableInf
values[RowKey] = rowId;
state.formModel = values;
let saveVal = await update${pascalMainTableName}(values);
await submitFormEvent(formEventConfigs, state.formModel,
await submitFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:提交表单
return saveVal;
@ -1769,7 +1828,7 @@ export function buildSimpleFormCode(model: GeneratorConfig, _tableInfo: TableInf
try {
state.formModel = values;
let saveVal = await add${pascalMainTableName}(values);
await submitFormEvent(formEventConfigs, state.formModel,
await submitFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:提交表单
return saveVal;
@ -1778,7 +1837,16 @@ export function buildSimpleFormCode(model: GeneratorConfig, _tableInfo: TableInf
// 根据工作流页面权限,设置表单属性(必填,禁用,显示)
async function setWorkFlowForm(obj: WorkFlowFormParams) {
try {
let flowData = changeWorkFlowForm(cloneDeep(formProps), obj);
const cloneProps=cloneDeep(formProps);
customFormEventConfigs=cloneDeep(formEventConfigs);
if (formConfig.useCustomConfig) {
const parts = obj.formConfigKey.split('_');
const formId=parts[1];
cloneProps.schemas=await mergeFormSchemas({formSchema:cloneProps.schemas!,formId:formId});
customFormEventConfigs=await mergeFormEventConfigs({formEventConfigs:customFormEventConfigs,formId:formId});
}
let flowData = changeWorkFlowForm(cloneProps, obj);
let { buildOptionJson, uploadComponentIds, formModels, isViewProcess } = flowData;
data.formDataProps = buildOptionJson;
emits('changeUploadComponentIds', uploadComponentIds); //工作流中必须保存上传组件id【附件汇总需要】
@ -1792,10 +1860,10 @@ export function buildSimpleFormCode(model: GeneratorConfig, _tableInfo: TableInf
setFieldsValue(formModels)
}
} catch (error) {}
await createFormEvent(formEventConfigs, state.formModel,
await createFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:初始化表单
await loadFormEvent(formEventConfigs, state.formModel,
await loadFormEvent(customFormEventConfigs, state.formModel,
systemFormRef.value,
formProps.schemas); //表单事件:加载表单
}
@ -2051,6 +2119,10 @@ export function buildConfigJsonCode(model: GeneratorConfig, formProps: FormProps
import { BasicColumn } from '/@/components/Table';
${findUpload(formProps.schemas) ? `import { uploadApi } from '/@/api/sys/upload';` : ''}
export const formConfig ={
useCustomConfig:false,
};
export const searchFormSchema: FormSchema[] = [
${model.listConfig.queryConfigs
.map((item) => {

View File

@ -0,0 +1,50 @@
import { useUserStore } from '/@/store/modules/user';
import {useAppStore} from "/@/store/modules/app";
import {usePermissionStore} from "/@/store/modules/permission";
import {setupRouterGuard} from "/@/router/guard";
import { changeTenant } from '/@/api/system/tenant';
import {useMenuSetting} from "/@/hooks/setting/useMenuSetting";
import {useAppInject} from "/@/hooks/web/useAppInject";
import {useTabs} from "/@/hooks/web/useTabs";
import { useRouter } from 'vue-router';
export interface SwitchTenantPatams {
tenantCode: string;
goHome: boolean;
tabCloseAction:String;
}
export function useTenantManager() {
const { getShowTopMenu } = useMenuSetting();
const router = useRouter();
const {closeAll, closeOther} = useTabs(router);
const userStore = useUserStore();
const appStore = useAppStore();
const permissionStore = usePermissionStore();
const { getIsMobile } = useAppInject();
const toggleLocal= async (param:SwitchTenantPatams)=>{
appStore.setPageLoadingAction(true);
await changeTenant(param.tenantCode);
permissionStore.setDynamicAddedRoute(false);
await userStore.afterLoginAction(param.goHome);
let tabCloseAction = param.tabCloseAction;
if (tabCloseAction == 'closeAll') {
closeAll();
} else if (tabCloseAction == 'closeOther') {
closeOther();
}
await setupRouterGuard(router);
await permissionStore.changeSubsystem(getShowTopMenu.value, getIsMobile.value);
if (permissionStore.getSubSysList.length > 0) {
permissionStore.setSubSystem(permissionStore.getSubSysList[0].id);
} else {
permissionStore.setSubSystem("");
}
}
return {toggleLocal }
}

View File

@ -342,6 +342,7 @@
const designType = inject<string>('designType');
const isFieldUpper = inject<Ref<boolean>>('isFieldUpper', ref(false));
let mainTableName = inject<Ref<string>>('mainTableName', ref(''));
const formType = inject<Ref<number>>('formType');
watch(
() => generatorConfig?.databaseId,
@ -383,11 +384,27 @@
},
);
const filterFormSchema=(formSchema:FormSchema[])=>{
customFormConfig.formType=formType.value;
const rtSchema=[];
for(let i=0;i<formSchema.length;i++){
let item=formSchema[i];
if(item.field=='category'){
if(formType.value==1){
rtSchema.push(item);
}
}else{
rtSchema.push(item);
}
}
return rtSchema;
};
const [registerModal, { openModal }] = useModal();
const [register, { validate, getFieldsValue, setFieldsValue, updateSchema }] = useForm({
labelWidth: 100,
schemas: designType === 'data' ? formSchemaData : formSchema,
schemas: designType === 'data' ? filterFormSchema(formSchemaData) : filterFormSchema(formSchema),
showActionButtonGroup: false,
});

View File

@ -11,14 +11,15 @@
<a-step :title="t('基础信息')" />
<a-step :title="t('表单设计')" />
<a-step :title="t('表单事件')" />
<a-step :title="t('完整配置')" />
<a-step :title="t('结构配置')" />
</a-steps>
<div class="btn-box">
<a-button @click="handleStepPrev" v-show="current !== 0">{{ t('上一步') }}</a-button>
<a-button type="primary" @click="handleStepNext" v-show="current < 3">
<a-button type="primary" @click="handleStepNext" v-show="current < 4">
{{ t('下一步') }}
</a-button>
<a-button type="primary" @click="handleSave" v-show="current === 3">
<a-button type="primary" @click="handleSave" v-show="current === 4">
{{ t('保存') }}
</a-button>
<a-button type="primary" danger @click="handleClose">{{ t('关闭') }}</a-button>
@ -29,19 +30,21 @@
<BasicConfigStep ref="basicConfigStepRef" v-show="current === 0" />
<FormDesignStep ref="formDesignStepRef" v-show="current === 1" />
<FormEventStep ref="formEventStepRef" v-show="current === 2" />
<EntireConfigStep ref="entireConfigStepRef" v-show="current === 3"/>
<StructureConfigStep
ref="structureConfigStepRef"
v-show="current === 3"
v-show="current === 4"
:isUpdate="isUpdate"
:beforeTableNames="beforeTableNames"
@validate-table="handleSave"
/>
</div>
</BasicModal>
</template>
<script lang="ts" setup>
import { ref, reactive, provide, Ref, toRaw, watch } from 'vue';
import { FormDesignStep, FormEventStep, StructureConfigStep } from '/@/components/CreateCodeStep';
import { ref, reactive, provide, inject, Ref, toRaw, watch } from 'vue';
import { FormDesignStep, FormEventStep, StructureConfigStep,EntireConfigStep} from '/@/components/CreateCodeStep';
import BasicConfigStep from '../BasicConfigStep.vue';
import { BasicModal, useModalInner } from '/@/components/Modal';
import {
@ -64,6 +67,7 @@
import { FormJson } from '/@/model/generator/codeGenerator';
import { FormEventColumnConfig } from '/@/model/generator/formEventConfig';
import { changeCompsApiConfig, changeEventApiConfig, getMainTable } from '/@/utils/event/design';
import {ListConfig} from "/@/model/generator/listConfig";
const { t } = useI18n();
const current = ref(0);
@ -71,6 +75,7 @@
const basicConfigStepRef = ref();
const formDesignStepRef = ref();
const formEventStepRef = ref();
const entireConfigStepRef = ref();
const structureConfigStepRef = ref();
const widgetForm = ref(JSON.parse(JSON.stringify(antd.widgetForm))); //FormDesignStep -> designer和StructureConfigStep页面使用
const isUpdate = ref<boolean>(false);
@ -92,7 +97,7 @@
name: '',
category: '',
formDesignType: 1,
formType: FormTypeEnum.CUSTOM_FORM,
formType:'',
formJson: generatorConfig,
remark: '',
isChange: false,
@ -145,15 +150,19 @@
customFormConfig.category = data.category;
customFormConfig.formDesignType = data.formDesignType;
customFormConfig.formJson = JSON.parse(data.formJson);
customFormConfig.listConfig = JSON.parse(data.listConfig)||{} as ListConfig;
customFormConfig.renderConfig =data.renderConfig;
customFormConfig.remark = data.remark;
const { formJson } = customFormConfig;
const { formJson,listConfig,renderConfig } = customFormConfig;
generatorConfig.databaseId = formJson.databaseId;
generatorConfig.isDataAuth = formJson.isDataAuth;
generatorConfig.dataAuthList = formJson.dataAuthList;
generatorConfig.tableStructureConfigs = formJson.tableStructureConfigs;
generatorConfig.formJson = formJson.formJson;
generatorConfig.listConfig = listConfig;
generatorConfig.renderConfig = renderConfig;
generatorConfig.formEventConfig = formJson.formEventConfig!;
generatorConfig.formJson.list = generatorConfig.formJson.list.filter(
(x) => x.type !== 'hiddenComponent',
@ -203,15 +212,20 @@
}
//上一步
function handleStepPrev() {
async function handleStepPrev() {
current.value--;
if(current.value==1){
widgetForm.value = generatorConfig.formJson;
}
}
//下一步
async function handleStepNext() {
if (current.value === 2) {
entireConfigStepRef.value.initStep();
current.value++;
return;
}
const isOk = await stepValidate[current.value]();
if (!isOk) {
return;
@ -220,7 +234,7 @@
}
async function handleSave() {
const isOk = await stepValidate[3]();
const isOk = await stepValidate[4]();
if (!isOk) {
return;
}
@ -257,7 +271,9 @@
0: () => basicConfigStepRef.value.validateStep(),
1: () => formDesignStepRef.value.validateStep(),
2: () => formEventStepRef.value.validateStep(),
3: () => structureConfigStepRef.value.validateStep(),
3: () => entireConfigStepRef.value.validateStep(),
4: () => structureConfigStepRef.value.validateStep(),
};
</script>
<style lang="less" scoped>

View File

@ -11,16 +11,17 @@
<a-step :title="t('基础信息')" />
<a-step :title="t('表单设计')" />
<a-step :title="t('表单事件')" />
<a-step :title="t('完整配置')" />
</a-steps>
<div class="btn-box">
<ajax-error-icon />
<a-button type="primary" @click="handleStepPrev" v-show="current !== 0">{{
t('上一步')
}}</a-button>
<a-button type="primary" @click="handleStepNext" v-show="current < 2">{{
<a-button type="primary" @click="handleStepNext" v-show="current < 3">{{
t('下一步')
}}</a-button>
<a-button type="primary" @click="handleSave" v-show="current === 2">{{
<a-button type="primary" @click="handleSave" v-show="current === 3">{{
t('保存')
}}</a-button>
<a-button type="primary" danger @click="handleClose">{{ t('关闭') }}</a-button>
@ -31,13 +32,14 @@
<BasicConfigStep ref="basicConfigStepRef" v-show="current === 0" />
<FormDesignStep ref="formDesignStepRef" v-show="current === 1" />
<FormEventStep ref="formEventStepRef" v-show="current === 2" />
<EntireConfigStep ref="entireConfigStepRef" v-show="current === 3"/>
</div>
</BasicModal>
</template>
<script lang="ts" setup>
import { ref, reactive, provide, watch, Ref, toRaw, onUnmounted } from 'vue';
import BasicConfigStep from '../BasicConfigStep.vue';
import { FormDesignStep, FormEventStep } from '/@/components/CreateCodeStep';
import { FormDesignStep, FormEventStep,EntireConfigStep } from '/@/components/CreateCodeStep';
import { BasicModal, useModalInner } from '/@/components/Modal';
import { CustomFormConfig, GeneratorConfig } from '/@/model/generator/generatorConfig';
import { TableInfo } from '/@/components/Designer';
@ -52,6 +54,7 @@
import { useI18n } from '/@/hooks/web/useI18n';
import DesignLogo from '/@/components/ModalPanel/src/DesignLogo.vue';
import useGlobalFlag from '/@/hooks/core/useGlobalFlag';
import {ListConfig} from "/@/model/generator/listConfig";
const { t } = useI18n();
const current = ref(0);
@ -59,6 +62,7 @@
const basicConfigStepRef = ref();
const formDesignStepRef = ref();
const formEventStepRef = ref();
const entireConfigStepRef = ref();
const tableInfo = ref<TableInfo[]>([]);
const widgetForm = ref(JSON.parse(JSON.stringify(antd.widgetForm)));
@ -88,7 +92,7 @@
name: '',
category: '',
formDesignType: 0,
formType: FormTypeEnum.CUSTOM_FORM,
formType: '',
formJson: generatorConfig,
remark: '',
});
@ -134,15 +138,19 @@
customFormConfig.category = data.category;
customFormConfig.formDesignType = data.formDesignType;
customFormConfig.formJson = JSON.parse(data.formJson);
customFormConfig.listConfig = JSON.parse(data.listConfig)||{} as ListConfig;
customFormConfig.renderConfig =data.renderConfig;
customFormConfig.remark = data.remark;
const { formJson } = customFormConfig;
const { formJson,listConfig,renderConfig } = customFormConfig;
generatorConfig.databaseId = formJson.databaseId;
generatorConfig.isDataAuth = formJson.isDataAuth;
generatorConfig.dataAuthList = formJson.dataAuthList;
generatorConfig.tableConfigs = formJson.tableConfigs;
generatorConfig.formJson = formJson.formJson;
generatorConfig.listConfig = listConfig;
generatorConfig.renderConfig = renderConfig;
generatorConfig.formEventConfig = formJson.formEventConfig!;
generatorConfig.formJson.list = generatorConfig.formJson.list.filter(
(x) => x.type !== 'hiddenComponent',
@ -166,6 +174,9 @@
//上一步
function handleStepPrev() {
current.value--;
if(current.value==1){
widgetForm.value = generatorConfig.formJson;
}
}
//下一步
async function handleStepNext() {
@ -174,10 +185,15 @@
return;
}
current.value++;
if(current.value === 3){
entireConfigStepRef.value.initStep();
}
}
async function handleSave() {
const isOk = await stepValidate[2]();
const isOk = await stepValidate[3]();
if (!isOk) {
return;
}
@ -203,6 +219,7 @@
0: () => basicConfigStepRef.value.validateStep(),
1: () => formDesignStepRef.value.validateStep(),
2: () => formEventStepRef.value.validateStep(),
3: () => entireConfigStepRef.value.validateStep(),
};
</script>
<style lang="less" scoped>

View File

@ -11,13 +11,14 @@
<a-step :title="t('基础信息')" />
<a-step :title="t('表单设计')" />
<a-step :title="t('表单事件')" />
<a-step :title="t('完整配置')" />
</a-steps>
<div class="btn-box">
<a-button @click="handleStepPrev" v-show="current !== 0">{{ t('上一步') }}</a-button>
<a-button type="primary" @click="handleStepNext" v-show="current < 2">
<a-button type="primary" @click="handleStepNext" v-show="current < 3">
{{ t('下一步') }}
</a-button>
<a-button type="primary" @click="handleSave" v-show="current === 2">
<a-button type="primary" @click="handleSave" v-show="current === 3">
{{ t('保存') }}
</a-button>
<a-button type="primary" danger @click="handleClose">{{ t('关闭') }}</a-button>
@ -28,13 +29,14 @@
<BasicConfigStep ref="basicConfigStepRef" v-show="current === 0" />
<FormDesignStep ref="formDesignStepRef" v-show="current === 1" />
<FormEventStep ref="formEventStepRef" v-show="current === 2" />
<EntireConfigStep ref="entireConfigStepRef" v-show="current === 3"/>
</div>
</BasicModal>
<TableNameModal @register="registerTableName" @success="handleEditSuccess" />
</template>
<script lang="ts" setup>
import { ref, reactive, provide, Ref, toRaw, watch, onMounted } from 'vue';
import { FormDesignStep, FormEventStep, TableNameModal } from '/@/components/CreateCodeStep';
import { FormDesignStep, FormEventStep,EntireConfigStep,TableNameModal } from '/@/components/CreateCodeStep';
import BasicConfigStep from '../BasicConfigStep.vue';
import { BasicModal, useModalInner } from '/@/components/Modal';
import { GeneratorConfig, CustomFormConfig } from '/@/model/generator/generatorConfig';
@ -52,6 +54,7 @@
import { useI18n } from '/@/hooks/web/useI18n';
import { useModal } from '/@/components/Modal';
import DesignLogo from '/@/components/ModalPanel/src/DesignLogo.vue';
import {ListConfig} from "/@/model/generator/listConfig";
const { t } = useI18n();
const current = ref(0);
@ -59,6 +62,7 @@
const basicConfigStepRef = ref();
const formDesignStepRef = ref();
const formEventStepRef = ref();
const entireConfigStepRef = ref();
const widgetForm = ref(JSON.parse(JSON.stringify(antd.widgetForm))); //FormDesignStep -> designer和StructureConfigStep页面使用
const mainTableName = ref('table_' + random(10000, 99999));
@ -82,7 +86,7 @@
name: '',
category: '',
formDesignType: 2,
formType: FormTypeEnum.CUSTOM_FORM,
formType:'',
formJson: generatorConfig,
remark: '',
isChange: false,
@ -145,15 +149,19 @@
customFormConfig.category = data.category;
customFormConfig.formDesignType = data.formDesignType;
customFormConfig.formJson = JSON.parse(data.formJson);
customFormConfig.listConfig = JSON.parse(data.listConfig)||{} as ListConfig;
customFormConfig.renderConfig =data.renderConfig;
customFormConfig.remark = data.remark;
const { formJson } = customFormConfig;
const { formJson,listConfig,renderConfig } = customFormConfig;
generatorConfig.databaseId = formJson.databaseId;
generatorConfig.isDataAuth = formJson.isDataAuth;
generatorConfig.dataAuthList = formJson.dataAuthList;
generatorConfig.tableStructureConfigs = formJson.tableStructureConfigs;
generatorConfig.formJson = formJson.formJson;
generatorConfig.listConfig = listConfig;
generatorConfig.renderConfig = renderConfig;
generatorConfig.formEventConfig = formJson.formEventConfig!;
generatorConfig.formJson.list = generatorConfig.formJson.list.filter(
(x) => x.type !== 'hiddenComponent',
@ -204,6 +212,9 @@
//上一步
function handleStepPrev() {
current.value--;
if(current.value==1){
widgetForm.value = generatorConfig.formJson;
}
}
//下一步
async function handleStepNext() {
@ -212,9 +223,13 @@
return;
}
current.value++;
if(current.value === 3){
entireConfigStepRef.value.initStep();
}
}
async function handleSave() {
const isOk = await stepValidate[2]();
const isOk = await stepValidate[3]();
if (!isOk) {
return;
@ -298,6 +313,7 @@
0: () => basicConfigStepRef.value.validateStep(),
1: () => formDesignStepRef.value.validateStep(),
2: () => formEventStepRef.value.validateStep(),
3: () => entireConfigStepRef.value.validateStep(),
};
</script>
<style lang="less" scoped>

View File

@ -1,57 +1,13 @@
<template>
<PageWrapper dense contentFullHeight fixed-height contentClass="flex">
<div
class="w-1/3 xl:w-1/4 overflow-hidden bg-white h-full"
:style="{ 'border-right': '1px solid #e5e7eb' }"
>
<BasicTree
:title="t('表单分类')"
:clickRowToExpand="true"
:treeData="treeData"
:fieldNames="{ key: 'id', title: 'name' }"
@select="handleSelect"
/>
</div>
<BasicTable @register="registerTable" class="w-2/3 xl:w-3/4">
<template #toolbar>
<div class="toolbar-defined">
<a-button type="primary" @click="handleCreate" v-auth="'form-design:add'">
<template #icon><PlusOutlined /></template>
{{ t('新增') }}
</a-button>
<a-button @click="handleDelete" v-auth="'form-design:batchDelete'">{{
t('批量删除')
}}</a-button>
<a-button @click="previewForm" v-auth="'form-design:previewForm'">{{
t('预览表单')
}}</a-button>
<a-button @click="queryHistory">{{ t('历史记录') }}</a-button>
<a-button @click="handleCategory" v-auth="'form-design:classifyMGT'">{{
t('分类管理')
}}</a-button>
<a-button @click="handleCodeGenerator" v-auth="'form-design:generatedCode'">{{
t('生成代码')
}}</a-button>
</div>
</template>
<template #action="{ record }">
<TableAction
:actions="[
{
icon: 'clarity:note-edit-line',
auth: 'form-design:edit',
onClick: handleEdit.bind(null, record),
},
{
icon: 'ant-design:delete-outlined',
auth: 'form-design:delete',
color: 'error',
onClick: handleDelete.bind(null, record),
},
]"
/>
</template>
</BasicTable>
<a-tabs v-model:activeKey="activeKey" class="custom-tab white">
<a-tab-pane key="1" tab="零代码表单">
<ZeroCodeTypeTabPane ref="zeroCodeTypeTabPaneRef" :dicId="dicId"/>
</a-tab-pane>
<a-tab-pane key="2" tab="生成器表单">
<GeneratorTypeTabPane ref="generatorTypeTabPaneRef"/>
</a-tab-pane>
</a-tabs>
<DesignModal @register="registerDesignModal" @success="reload" />
<HistoryModal @register="registerHistoryModal" />
@ -83,13 +39,7 @@
</PageWrapper>
</template>
<script lang="ts" setup>
import { BasicTable, useTable, TableAction, FormSchema, BasicColumn } from '/@/components/Table';
import {
getFormTemplatePage,
deleteFormTemplate,
updateFormTemplateStatus,
getFormTemplate,
} from '/@/api/form/design';
import { h, onMounted, ref, createVNode, reactive, computed,provide } from 'vue';
import { PageWrapper } from '/@/components/Page';
import { useMessage } from '/@/hooks/web/useMessage';
import { useModal } from '/@/components/Modal';
@ -101,99 +51,26 @@
import CodeFirstModal from './components/components/CodeFirstModal.vue';
import SimpleTemplateModal from './components/components/SimpleTemplateModal.vue';
import CodeGeneratorModal from './components/CodeGeneratorModal.vue';
import { h, onMounted, ref, createVNode, reactive, computed } from 'vue';
import { BasicTree, TreeItem } from '/@/components/Tree';
import { getDicDetailList } from '/@/api/system/dic';
import { FormTypeEnum } from '/@/enums/formtypeEnum';
import { Switch, Modal } from 'ant-design-vue';
import { PlusOutlined, ExclamationCircleOutlined } from '@ant-design/icons-vue';
import { useI18n } from '/@/hooks/web/useI18n';
const { t } = useI18n();
const treeData = ref<TreeItem[]>([]);
const selectId = ref('');
const selectedKeys = ref<string[]>([]);
const dicId = '1419276800524424444';
import ZeroCodeTypeTabPane from './tabpanes/ZeroCodeTypeTabPane.vue';
import GeneratorTypeTabPane from './tabpanes/GeneratorTypeTabPane.vue';
const { t } = useI18n();
const dicId = '1419276800524424444';
const activeKey = ref('1');
const zeroCodeTypeTabPaneRef=ref();
const generatorTypeTabPaneRef=ref();
const state = reactive({
isShowDataFirst: true,
isShowCodeFirst: true,
isShowSimpleTemplate: true,
isShowCodeGenerator: true,
});
const searchFormSchema: FormSchema[] = [
{
field: 'keyword',
label: t('关键字'),
component: 'Input',
componentProps: {
placeholder: t('请输入关键字'),
},
},
];
const columns: BasicColumn[] = [
{
dataIndex: 'name',
title: t('名称'),
align: 'left',
},
{
dataIndex: 'categoryName',
title: t('分类'),
align: 'left',
},
{
dataIndex: 'enabledMark',
title: t('状态'),
width: 120,
align: 'left',
customRender: ({ record }) => {
if (!Reflect.has(record, 'pendingStatus')) {
record.pendingStatus = false;
}
return h(Switch, {
checked: record.enabledMark === 1,
checkedChildren: t('已启用'),
unCheckedChildren: t('已禁用'),
loading: record.pendingStatus,
onChange(checked: boolean) {
record.pendingStatus = true;
const newStatus = checked ? 1 : 0;
const { createMessage } = useMessage();
updateFormTemplateStatus(record.id, newStatus)
.then(() => {
record.enabledMark = newStatus;
createMessage.success(t('已成功修改状态'));
})
.catch(() => {
createMessage.error(t('修改状态失败'));
})
.finally(() => {
record.pendingStatus = false;
});
},
});
},
},
{
dataIndex: 'createUserName',
title: t('创建人'),
align: 'left',
},
{
dataIndex: 'createDate',
title: t('创建时间'),
align: 'left',
},
{
dataIndex: 'remark',
align: 'left',
title: t('备注'),
},
];
const { notification } = useMessage();
const formType=ref();
const [registerDesignModal, { openModal: openDesignModal }] = useModal();
const [registerHistoryModal, { openModal: openHistoryModal }] = useModal();
@ -203,134 +80,26 @@
const [registerCodeFirst, { openModal: openCodeFirstModal }] = useModal();
const [registerSimpleTemplate, { openModal: openSimpleTemplateModal }] = useModal();
const [registerCodeGenerator, { openModal: openCodeGeneratorModal }] = useModal();
const formConfig = {
rowProps: {
gutter: 16,
},
schemas: searchFormSchema,
fieldMapToTime: [],
showResetButton: false,
};
const [registerTable, { reload, setSelectedRowKeys }] = useTable({
api: getFormTemplatePage,
rowKey: 'id',
title: '表单列表',
columns,
formConfig,
beforeFetch: (params) => {
//发送请求默认新增 左边树结构所选id
return { ...params, category: selectId.value, type: FormTypeEnum.CUSTOM_FORM };
},
useSearchForm: true,
showTableSetting: true,
striped: false,
actionColumn: {
width: 80,
title: t('操作'),
dataIndex: 'action',
slots: { customRender: 'action' },
},
rowSelection: {
onChange: onSelectChange,
},
customRow,
tableSetting: {
size: false,
setting: false,
},
});
const formId = computed(() => {
return selectedKeys.value && selectedKeys.value.length
? selectedKeys.value[selectedKeys.value.length - 1]
: '';
});
provide('openDesignModal', openDesignModal);
provide('openHistoryModal', openHistoryModal);
provide('openCategoryModal', openCategoryModal);
provide('openPreviewModal', openPreviewModal);
provide('openDataFirstModal', openDataFirstModal);
provide('openCodeFirstModal', openCodeFirstModal);
provide('openSimpleTemplateModal', openSimpleTemplateModal);
provide('openCodeGeneratorModal', openCodeGeneratorModal);
function onSelectChange(rowKeys: string[]) {
selectedKeys.value = rowKeys;
setSelectedRowKeys(selectedKeys.value);
}
function customRow(record: Recordable) {
return {
onClick: () => {
let selectedRowKeys = [...selectedKeys.value];
if (selectedRowKeys.indexOf(record.id) >= 0) {
let index = selectedRowKeys.indexOf(record.id);
selectedRowKeys.splice(index, 1);
} else {
selectedRowKeys.push(record.id);
}
selectedKeys.value = selectedRowKeys;
setSelectedRowKeys(selectedRowKeys);
},
};
}
function handleCreate() {
openDesignModal(true, {
title: t('添加表单'),
});
}
function handleEdit(record: Recordable) {
switch (record.formDesignType) {
case 0:
openDataFirstModal(true, {
id: record.id,
isUpdate: true,
});
break;
case 1:
openCodeFirstModal(true, {
id: record.id,
isUpdate: true,
});
break;
case 2:
openSimpleTemplateModal(true, {
id: record.id,
isUpdate: true,
});
break;
}
}
function handleDelete(record: Recordable = {}) {
const ids = record.id ? [record.id] : selectedKeys.value;
if (!ids.length) {
noticeInfo('删除');
return;
}
Modal.confirm({
title: t('提示'),
icon: createVNode(ExclamationCircleOutlined),
content: t('确定要删除所选项吗?'),
onOk() {
deleteFormTemplate(ids).then(() => {
reload();
notification.success({
message: t('提示'),
description: t('删除成功'),
});
});
},
onCancel() {},
okText: t('确认'),
cancelText: t('取消'),
});
}
function handleCodeGenerator() {
if (!formId.value) {
noticeInfo('生成');
return;
}
openCodeGeneratorModal(true, { formId: formId.value });
}
provide<number>('formType', formType);
provide('noticeInfo', noticeInfo);
function handleSuccess() {
reload();
if(activeKey.value=='1'){
zeroCodeTypeTabPaneRef.value.reload();
}else if(activeKey.value=='2'){
generatorTypeTabPaneRef.value.reload();
}
}
function handleClose(modal) {
@ -340,51 +109,13 @@
}, 100);
}
function handleSelect(selectIds) {
selectId.value = selectIds[0];
reload({ searchInfo: { category: selectIds[0] } });
}
function handleCategory() {
openCategoryModal(true, { title: t('表单分类管理') });
}
async function fetch() {
treeData.value = (await getDicDetailList({
itemId: dicId,
})) as unknown as TreeItem[];
}
async function previewForm() {
if (!formId.value) {
noticeInfo('预览');
return;
}
const templateJson = await getFormTemplate(formId.value);
openPreviewModal(true, { title: t('预览'), formJson: templateJson.formJson });
}
async function queryHistory() {
if (!formId.value) {
notification.warning({
message: t('提示'),
description: t(`请先选中一行后再查看当前表单历史记录!`),
});
return;
}
openHistoryModal(true, { title: t('历史记录'), formId: formId.value });
}
function noticeInfo(info: string) {
notification.warning({
message: t('提示'),
description: t(`请先选择要{notice}的数据项`, { notice: info }),
}); //提示消息
notification.warning({
message: t('提示'),
description: t(`请先选择要{notice}的数据项`, { notice: info }),
}); //提示消息
}
onMounted(() => {
fetch();
});
</script>
<style lang="less" scoped>
.toolbar-defined {
@ -393,6 +124,13 @@
}
}
:deep(.custom-tab.white){
background-color:white!important;
}
:deep(.ant-tabs-nav){
padding:0px 10px!important;
}
// :deep(.ant-col-15) {
// flex: 0 0 calc(100% - 185px);
// max-width: initial;

View File

@ -0,0 +1,255 @@
<template>
<div style="display:flex;background-color:white">
<div
class="w-1/3 xl:w-1/4 overflow-hidden bg-white h-full"
:style="{ 'border-right': '1px solid #e5e7eb' }"
>
<BasicTree
:title="t('生成器类型')"
:clickRowToExpand="true"
:treeData="treeData"
:fieldNames="{ key: 'id', title: 'name' }"
@select="handleSelect"
/>
</div>
<BasicTable @register="registerTable" class="w-2/3 xl:w-3/4">
<template #toolbar>
<div class="toolbar-defined">
<a-button @click="previewForm" v-auth="'form-design:previewForm'">{{
t('预览表单')
}}</a-button>
<a-button @click="queryHistory">{{ t('历史记录') }}</a-button>
</div>
</template>
<template #action="{ record }">
<TableAction
:actions="[
{
icon: 'clarity:note-edit-line',
auth: 'form-design:edit',
onClick: handleEdit.bind(null, record,0),
}
]"
/>
</template>
</BasicTable>
</div>
</template>
<script lang="ts" setup>
import { h, onMounted, ref, createVNode, reactive, computed,provide,inject } from 'vue';
import { BasicTable, useTable, TableAction, FormSchema, BasicColumn } from '/@/components/Table';
import {
getFormTemplatePage,
deleteFormTemplate,
updateFormTemplateStatus,
getFormTemplate,
} from '/@/api/form/design';
import { FormTypeEnum } from '/@/enums/formtypeEnum';
import { BasicTree, TreeItem } from '/@/components/Tree';
import { useMessage } from '/@/hooks/web/useMessage';
import { useI18n } from '/@/hooks/web/useI18n';
const { notification } = useMessage();
const { t } = useI18n();
const treeData = ref<TreeItem[]>([
{ "id":'0',name:'数据优先模板'},
{ "id":'1',name:'界面优先模板'},
{ "id":'2',name:'简易模板'}
]);
const selectId = ref('');
const selectedKeys = ref<string[]>([]);
const searchFormSchema: FormSchema[] = [
{
field: 'keyword',
label: t('关键字'),
component: 'Input',
componentProps: {
placeholder: t('请输入关键字'),
},
},
];
const columns: BasicColumn[] = [
{
dataIndex: 'name',
title: t('名称'),
align: 'left',
},
{
dataIndex: 'formDesignType',
title: t('模板类型'),
width: 120,
align: 'left',
customRender: ({ record }) => {
if(record.formDesignType==0){
return "数据优先模板";
}else if(record.formDesignType==1){
return "界面优先模板";
}else if(record.formDesignType==2){
return "简易模板";
}else{
return '';
}
},
},
{
dataIndex: 'createUserName',
title: t('创建人'),
align: 'left',
},
{
dataIndex: 'createDate',
title: t('创建时间'),
align: 'left',
},
{
dataIndex: 'remark',
align: 'left',
title: t('备注'),
},
];
const formConfig = {
rowProps: {
gutter: 16,
},
schemas: searchFormSchema,
fieldMapToTime: [],
showResetButton: false,
};
const [registerTable, { reload:reload, setSelectedRowKeys:setSelectedRowKeys}] = useTable({
api: getFormTemplatePage,
rowKey: 'id',
title: '表单列表',
columns:columns,
formConfig,
beforeFetch: (params) => {
//发送请求默认新增 左边树结构所选id
return { ...params, category: selectId.value, type: FormTypeEnum.SYSTEM_FORM };
},
useSearchForm: true,
showTableSetting: true,
striped: false,
actionColumn: {
width: 80,
title: t('操作'),
dataIndex: 'action',
slots: { customRender: 'action' },
},
rowSelection: {
onChange: onSelectChange,
},
customRow,
tableSetting: {
size: false,
setting: false,
},
});
const formId = computed(() => {
return selectedKeys.value && selectedKeys.value.length
? selectedKeys.value[selectedKeys.value.length - 1]
: '';
});
const openDesignModal = inject('openDesignModal');
const openHistoryModal = inject('openHistoryModal');
const openCategoryModal = inject('openCategoryModal');
const openPreviewModal = inject('openPreviewModal');
const openDataFirstModal = inject('openDataFirstModal');
const openCodeFirstModal = inject('openCodeFirstModal');
const openSimpleTemplateModal = inject('openSimpleTemplateModal');
const openCodeGeneratorModal = inject('openCodeGeneratorModal');
const formType = inject('formType');
const noticeInfo = inject('noticeInfo');
function onSelectChange(rowKeys: string[]) {
selectedKeys.value = rowKeys;
setSelectedRowKeys(selectedKeys.value);
}
function customRow(record: Recordable) {
return {
onClick: () => {
let selectedRowKeys = [...selectedKeys.value];
if (selectedRowKeys.indexOf(record.id) >= 0) {
let index = selectedRowKeys.indexOf(record.id);
selectedRowKeys.splice(index, 1);
} else {
selectedRowKeys.push(record.id);
}
selectedKeys.value = selectedRowKeys;
setSelectedRowKeys(selectedRowKeys);
},
};
}
function handleEdit(record: Recordable,fType:number) {
formType.value=fType;
switch (record.formDesignType) {
case 0:
openDataFirstModal(true, {
id: record.id,
isUpdate: true,
});
break;
case 1:
openCodeFirstModal(true, {
id: record.id,
isUpdate: true,
});
break;
case 2:
openSimpleTemplateModal(true, {
id: record.id,
isUpdate: true,
});
break;
default:
notification.error({
message: t('提示'),
description: '该表单缺少模板类型',
});
}
}
function handleSelect(selectIds) {
selectId.value = selectIds[0];
reload({ searchInfo: { category: selectIds[0] } });
}
async function previewForm() {
if (!formId.value) {
noticeInfo('预览');
return;
}
const templateJson = await getFormTemplate(formId.value);
openPreviewModal(true, { title: t('预览'), formJson: templateJson.formJson });
}
async function queryHistory() {
if (!formId.value) {
notification.warning({
message: t('提示'),
description: t(`请先选中一行后再查看当前表单历史记录!`),
});
return;
}
openHistoryModal(true, { title: t('历史记录'), formId: formId.value });
}
defineExpose({
reload
});
</script>
<style lang="less" scoped>
</style>

View File

@ -0,0 +1,356 @@
<template>
<div style="display:flex;background-color:white">
<div
class="w-1/3 xl:w-1/4 overflow-hidden bg-white h-full"
:style="{ 'border-right': '1px solid #e5e7eb' }"
>
<BasicTree
:title="t('表单分类')"
:clickRowToExpand="true"
:treeData="treeData"
:fieldNames="{ key: 'id', title: 'name' }"
@select="handleSelect"
/>
</div>
<BasicTable @register="registerTable" class="w-2/3 xl:w-3/4">
<template #toolbar>
<div class="toolbar-defined">
<a-button type="primary" @click="handleCreate" v-auth="'form-design:add'">
<template #icon><PlusOutlined /></template>
{{ t('新增') }}
</a-button>
<a-button @click="handleDelete" v-auth="'form-design:batchDelete'">{{
t('批量删除')
}}</a-button>
<a-button @click="previewForm" v-auth="'form-design:previewForm'">{{
t('预览表单')
}}</a-button>
<a-button @click="queryHistory">{{ t('历史记录') }}</a-button>
<a-button @click="handleCategory" v-auth="'form-design:classifyMGT'">{{
t('分类管理')
}}</a-button>
<a-button @click="handleCodeGenerator" v-auth="'form-design:generatedCode'">{{
t('生成代码')
}}</a-button>
</div>
</template>
<template #action="{ record }">
<TableAction
:actions="[
{
icon: 'clarity:note-edit-line',
auth: 'form-design:edit',
onClick: handleEdit.bind(null, record,1),
},
{
icon: 'ant-design:delete-outlined',
auth: 'form-design:delete',
color: 'error',
onClick: handleDelete.bind(null, record),
},
]"
/>
</template>
</BasicTable>
</div>
</template>
<script lang="ts" setup>
import { h, onMounted, ref, createVNode, reactive, computed,provide,inject } from 'vue';
import { BasicTable, useTable, TableAction, FormSchema, BasicColumn } from '/@/components/Table';
import {
getFormTemplatePage,
deleteFormTemplate,
updateFormTemplateStatus,
getFormTemplate,
} from '/@/api/form/design';
import { BasicTree, TreeItem } from '/@/components/Tree';
import { FormTypeEnum } from '/@/enums/formtypeEnum';
import { useMessage } from '/@/hooks/web/useMessage';
import { getDicDetailList } from '/@/api/system/dic';
import { Switch, Modal } from 'ant-design-vue';
import { useI18n } from '/@/hooks/web/useI18n';
const props = defineProps({
dicId:String
})
const { notification } = useMessage();
const { t } = useI18n();
const treeData = ref<TreeItem[]>([]);
const selectId = ref('');
const selectedKeys = ref<string[]>([]);
const searchFormSchema: FormSchema[] = [
{
field: 'keyword',
label: t('关键字'),
component: 'Input',
componentProps: {
placeholder: t('请输入关键字'),
},
},
];
const columns: BasicColumn[] = [
{
dataIndex: 'name',
title: t('名称'),
align: 'left',
},
{
dataIndex: 'categoryName',
title: t('分类'),
align: 'left',
},
{
dataIndex: 'enabledMark',
title: t('状态'),
width: 120,
align: 'left',
customRender: ({ record }) => {
if (!Reflect.has(record, 'pendingStatus')) {
record.pendingStatus = false;
}
return h(Switch, {
checked: record.enabledMark === 1,
checkedChildren: t('已启用'),
unCheckedChildren: t('已禁用'),
loading: record.pendingStatus,
onChange(checked: boolean) {
record.pendingStatus = true;
const newStatus = checked ? 1 : 0;
const { createMessage } = useMessage();
updateFormTemplateStatus(record.id, newStatus)
.then(() => {
record.enabledMark = newStatus;
createMessage.success(t('已成功修改状态'));
})
.catch(() => {
createMessage.error(t('修改状态失败'));
})
.finally(() => {
record.pendingStatus = false;
});
},
});
},
},
{
dataIndex: 'createUserName',
title: t('创建人'),
align: 'left',
},
{
dataIndex: 'createDate',
title: t('创建时间'),
align: 'left',
},
{
dataIndex: 'remark',
align: 'left',
title: t('备注'),
},
];
const formConfig = {
rowProps: {
gutter: 16,
},
schemas: searchFormSchema,
fieldMapToTime: [],
showResetButton: false,
};
const [registerTable, { reload, setSelectedRowKeys }] = useTable({
api: getFormTemplatePage,
rowKey: 'id',
title: '表单列表',
columns,
formConfig,
beforeFetch: (params) => {
//发送请求默认新增 左边树结构所选id
return { ...params, category: selectId.value, type: FormTypeEnum.CUSTOM_FORM };
},
useSearchForm: true,
showTableSetting: true,
striped: false,
actionColumn: {
width: 80,
title: t('操作'),
dataIndex: 'action',
slots: { customRender: 'action' },
},
rowSelection: {
onChange: onSelectChange,
},
customRow,
tableSetting: {
size: false,
setting: false,
},
});
const formId = computed(() => {
return selectedKeys.value && selectedKeys.value.length
? selectedKeys.value[selectedKeys.value.length - 1]
: '';
});
const openDesignModal = inject('openDesignModal');
const openHistoryModal = inject('openHistoryModal');
const openCategoryModal = inject('openCategoryModal');
const openPreviewModal = inject('openPreviewModal');
const openDataFirstModal = inject('openDataFirstModal');
const openCodeFirstModal = inject('openCodeFirstModal');
const openSimpleTemplateModal = inject('openSimpleTemplateModal');
const openCodeGeneratorModal = inject('openCodeGeneratorModal');
const formType = inject('formType');
const noticeInfo = inject('noticeInfo');
function onSelectChange(rowKeys: string[]) {
selectedKeys.value = rowKeys;
setSelectedRowKeys(selectedKeys.value);
}
function customRow(record: Recordable) {
return {
onClick: () => {
let selectedRowKeys = [...selectedKeys.value];
if (selectedRowKeys.indexOf(record.id) >= 0) {
let index = selectedRowKeys.indexOf(record.id);
selectedRowKeys.splice(index, 1);
} else {
selectedRowKeys.push(record.id);
}
selectedKeys.value = selectedRowKeys;
setSelectedRowKeys(selectedRowKeys);
},
};
}
function handleCreate() {
openDesignModal(true, {
title: t('添加表单'),
});
}
function handleEdit(record: Recordable,fType:number) {
formType.value=fType;
switch (record.formDesignType) {
case 0:
openDataFirstModal(true, {
id: record.id,
isUpdate: true,
});
break;
case 1:
openCodeFirstModal(true, {
id: record.id,
isUpdate: true,
});
break;
case 2:
openSimpleTemplateModal(true, {
id: record.id,
isUpdate: true,
});
break;
default:
notification.error({
message: t('提示'),
description: '该表单缺少模板类型',
});
}
}
function handleDelete(record: Recordable = {}) {
const ids = record.id ? [record.id] : selectedKeys.value;
if (!ids.length) {
noticeInfo('删除');
return;
}
Modal.confirm({
title: t('提示'),
icon: createVNode(ExclamationCircleOutlined),
content: t('确定要删除所选项吗?'),
onOk() {
deleteFormTemplate(ids).then(() => {
reload();
notification.success({
message: t('提示'),
description: t('删除成功'),
});
});
},
onCancel() {},
okText: t('确认'),
cancelText: t('取消'),
});
}
function handleSelect(selectIds) {
selectId.value = selectIds[0];
reload({ searchInfo: { category: selectIds[0] } });
}
function handleCodeGenerator() {
if (!formId.value) {
noticeInfo('生成');
return;
}
openCodeGeneratorModal(true, { formId: formId.value });
}
async function previewForm() {
if (!formId.value) {
noticeInfo('预览');
return;
}
const templateJson = await getFormTemplate(formId.value);
openPreviewModal(true, { title: t('预览'), formJson: templateJson.formJson });
}
async function queryHistory() {
if (!formId.value) {
notification.warning({
message: t('提示'),
description: t(`请先选中一行后再查看当前表单历史记录!`),
});
return;
}
openHistoryModal(true, { title: t('历史记录'), formId: formId.value });
}
async function fetch() {
treeData.value = (await getDicDetailList({
itemId: props.dicId,
})) as unknown as TreeItem[];
}
function handleCategory() {
openCategoryModal(true, { title: t('表单分类管理') });
}
onMounted(() => {
fetch();
});
defineExpose({
reload
});
</script>
<style lang="less" scoped>
</style>

View File

@ -34,7 +34,7 @@
</Input>
</FormItem>
<FormItem v-if="getAppEnvConfig().VITE_GLOB_TENANT_ENABLED && loginType =='pw'" name="tenantCode" class="enter-x">
<FormItem v-if="getAppEnvConfig().VITE_GLOB_TENANT_ENABLED && getAppEnvConfig().VITE_GLOB_TENANT_INPUT_REQUIRED!=='false' && loginType =='pw'" name="tenantCode" class="enter-x">
<label class="form-title"> {{ t('租户码') }}</label>
<Input
size="large"

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

View File

@ -0,0 +1,230 @@
<template>
<div class="export">
<div class="l-export" ><span @click.stop="openConfirmDialog">导出所选项目{{configType}}</span></div>
<div class="list-wrapper">
<a-list size="small" bordered :data-source="state.options">
<template #renderItem="{ item }">
<a-list-item><a-checkbox style="margin-right:30px" v-model:checked="item.checked"/>{{ item.name }}</a-list-item>
</template>
<template #header>
<a-checkbox
style="margin-right:30px"
v-model:checked="state.checkAll"
:indeterminate="state.indeterminate"
@change="onCheckAllChange">
</a-checkbox>
选择全部
</template>
</a-list>
</div>
</div>
</template>
<script lang="ts" setup>
import { ref,watch,reactive,h} from 'vue';
import {useMessage} from "/@/hooks/web/useMessage";
import { useI18n } from '/@/hooks/web/useI18n';
import { exportDatas,downloadDatas} from '/@/api/system/dataMigration';
import { downloadByData } from '/@/utils/file/download';
import { dateUtil } from '/@/utils/dateUtil';
const { t } = useI18n();
const state = reactive({
indeterminate: false,
checkAll: false,
options:[
{
checked:false,
code:"租户",
name:'租户'
},
{
checked:false,
code:'角色',
name:'角色'
},
{
checked:false,
code:'岗位',
name:'岗位'
},
{
checked:false,
code:'用户组',
name:'用户组'
},
{
checked:false,
code:'菜单',
name:'菜单'
},
{
checked:false,
code:'表单',
name:'表单'
},
{
checked:false,
code:'流程定义',
name:'流程定义'
},
{
checked:false,
code:'系统变量',
name:'系统变量'
},
{
checked:false,
code:'数据字典',
name:'数据字典'
},
{
checked:false,
code:'桌面配置',
name:'桌面配置'
},
{
checked:false,
code:'角色-菜单授权',
name:'权限:角色-菜单授权(菜单、按钮、列表、表单)'
},
{
checked:false,
code:'角色-自定义接口授权',
name:'权限:角色-自定义接口授权'
},
{
checked:false,
code:'租户-菜单授权',
name:'权限:租户-菜单授权'
}
]
});
function onCheckAllChange(e: any){
if(e.target.checked){
state.options.forEach((item)=>{
item.checked=true;
});
}else{
state.options.forEach((item)=>{
item.checked=false;
});
}
state.indeterminate=false;
}
watch(
() => state.options,
val => {
const checkedList=val.filter((item)=>item.checked);
if(checkedList.length>0){
if(checkedList.length< val.length){
state.indeterminate=true;
}else{
state.checkAll=true;
state.indeterminate=false;
}
}else{
state.indeterminate=false;
}
},
{ deep: true },
);
function openConfirmDialog(){
const { notification,createConfirm} = useMessage();
const checkedList=state.options.filter((item)=>item.checked);
if(checkedList.length==0){
notification.warning({
message: '提示',
description: '未选择任何项目'
});
return;
}
createConfirm({
iconType: 'warning',
title: () => h('span', t('温馨提示')),
content: () => t('确定导出所选项目吗?'),
width:'500px',
onOk: async () => {
handleExport();
},
okText: () => t('确认'),
cancelText: () => t('取消'),
});
}
async function handleExport(){
try {
const checkedCodeList=state.options.filter((item)=>item.checked).map(item => item.code);
let currentTime=dateUtil(new Date()).format('YYYY-MM-DD_HH_mm_ss');
let result= await exportDatas({
items:checkedCodeList
});
if(result){
const fileName=dateUtil(new Date()).format('YYYY-MM-DD_HH_mm_ss');
const res = await downloadDatas({uuid:result});
downloadByData(
res.data,
fileName+".zip"
);
}
} catch (error) {
console.error(error);
}
}
</script>
<style lang="less" scoped>
.export{
display:flex;
flex-direction:column;
height:100%;
width:100%;
padding:30px 30px 30px 100px;
border:1px solid #d6d6d6;
border-radius:8px;
overflow:hidden;
}
.l-export{
display:block;
margin-left:20px;
margin-bottom:20px;
span{
color: rgba(0,0,255,0.8);
text-decoration:underline rgba(#0000ff,0.8);
font-weight: 500;
font-size: 16px;
cursor: pointer;
&:hover{
color: rgba(0,0,255,1);
text-decoration:underline #0000ff;
}
}
}
.list-wrapper{
height:calc(100% - 50px);
.ant-list{
width:100%;
height:calc(100% - 30px);
overflow:hidden;
border:0px;
}
}
</style>

View File

@ -0,0 +1,184 @@
<template>
<span @click.stop="open">
<slot></slot>
<a-modal
v-model:visible="data.visible"
:title="t(`导入数据[${importType=='overrideMode'?'覆盖模式':'租户模式'}]`)"
:maskClosable="false"
@ok="doUpload"
@cancel="close"
@click.stop=""
>
<div class="tenant-box" v-if="importType=='tenantMode'">
<Form ref="formRef" :model="formModel">
<FormItem
label="租户编码"
name="tenantCode"
:rules="[{ required: true, message: '请输入租户编码' }]"
>
<a-input v-model:value="formModel.tenantCode" style="width:300px;" placeholder="请输入租户编码" />
</FormItem>
</Form>
</div>
<div class="upload-box">
<a-upload
v-model:file-list="fileList"
class="upload-box"
name="file"
accept=".json,.zip"
:max-count="1"
:before-upload="beforeUpload"
@remove="handleRemove"
>
<img :src="BgImg" />
<div class="a-upload__text">{{ t('将文件拖到此处,或') }}<em>{{ t('点击上传') }}</em></div>
</a-upload>
</div>
</a-modal>
</span>
</template>
<script setup lang="ts">
import { reactive,ref} from 'vue';
import { Form, FormInstance} from 'ant-design-vue';
import BgImg from '../../assets/sysconfig_import.png';
import { useI18n } from '/@/hooks/web/useI18n';
import { defHttp } from '/@/utils/http/axios';
import { useGlobSetting } from '/@/hooks/setting';
import { useMessage } from '/@/hooks/web/useMessage';
const props = defineProps({
importType: {
type:String,
},
});
const formRef = ref<FormInstance>();
const formModel=ref({
tenantCode:''
});
const FormItem = Form.Item;
const { t } = useI18n();
const globSetting = useGlobSetting();
const { notification } = useMessage();
const data: {
visible: boolean;
} = reactive({
visible: false
});
const fileList=ref<File[]>([]);
async function open() {
data.visible = true;
}
function close() {
data.visible = false;
fileList.value=[];
formModel.value.tenantCode='';
}
function handleRemove(file:File){
const index = fileList.value.indexOf(file);
const newFileList = fileList.value.slice();
newFileList.splice(index, 1);
fileList.value = newFileList;
};
function beforeUpload(file:File){
fileList.value = [...(fileList.value || []), file];
return false;
};
async function doUpload(){
if(props.importType=='tenantMode'){
try{
await formRef.value!.validate();
}catch(error){
return;
}
}
if(fileList==undefined||fileList.value.length==0){
notification.error({
message: '提示',
description: t('请选择文件'),
});
return;
}
const files=[];
fileList.value.forEach(file => {
files.push(file.originFileObj);
});
const url="/system/dataMigration/importDatas";
defHttp.uploadFile(
{
baseURL: globSetting.apiUrl,
url:url,
method: 'POST',
},
{
name: 'file',
file: files,
data:{
importType:props.importType,
tenantCode:formModel.value.tenantCode
}
}
).then((data) => {
notification.success({
message: '提示',
description: t('导入中...请稍后确认导入结果!'),
});
close();
}).catch((err) => {
console.error(err);
}).finally(()=>{
// close();
});
};
</script>
<style lang="less" scoped>
.tenant-box{
height:100px;
display: flex;
justify-content: center;
align-items: center;
}
.upload-box {
display: inline-block;
}
.upload-demo {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.a-upload-dragger {
width: 615px;
height: 370px;
border: none;
}
.a-upload__text {
position: absolute;
bottom: 100px;
right: 100px;
font-weight: bold;
color: #1d2027;
}
em {
font-style: normal;
color: #4f83fd;
}
</style>

View File

@ -0,0 +1,169 @@
<template>
<div class="import">
<div class="import-log"><span @click.stop="showLogsDialog">查看导入日志</span></div>
<div class="import-type-wrapper">
<ImportSystemConfig importType="tenantMode" v-if="getAppEnvConfig().VITE_GLOB_TENANT_ENABLED">
<span class="item-action">租户模式导入</span>
</ImportSystemConfig>
<ImportSystemConfig importType="overrideMode">
<span class="item-action">覆盖模式导入</span>
</ImportSystemConfig>
</div>
</div>
<a-modal
v-model:visible="logsDialog.visible"
:title="t('导入日志')"
:maskClosable="false"
:width="800"
:footer="null"
>
<div class="logs-content">
<template v-for="item in logs" :key="item.index">
<div class="log">
<span class="col-item">日志时间<span class="content">{{item.time}}</span></span>
<span class="col-item">导入模式<span class="content">{{item.importType=='overrideMode'?'覆盖模式':'租户模式'}}</span></span>
<span class="col-item">执行结果
<span :class="{'success':item.result=='success','fail':item.result!=='success'}">{{item.result=='success'?'成功':'失败'}}</span>
</span>
<span class="col-item" v-if="item.importType=='tenantMode'">租户编码:<span class="content">{{item.tenantCode}}</span></span>
<span class="col-item">
<span class="content view-log-detail" v-if="item.result!=='success'" @click.stop="viewLogDetails(item.fileName)" >查看日志详情 </span>
</span>
</div>
</template>
</div>
</a-modal>
<a-modal
v-model:visible="logDetailsDialog.visible"
:title="t('日志详情')"
:maskClosable="false"
:width="700"
:footer="null"
>
<div class="log-details">
<a-textarea v-model:value="logDetails" :style="{whiteSpace:'pre',overflowX: 'auto',color:'red'}" :rows="20" />
</div>
</a-modal>
</template>
<script lang="ts" setup>
import { reactive,ref} from 'vue';
import { useI18n } from '/@/hooks/web/useI18n';
import ImportSystemConfig from './ImportSystemConfig.vue';
import { getLogList,getLogDetails} from '/@/api/system/dataMigration';
import {getAppEnvConfig} from "/@/utils/env";
const { t } = useI18n();
const logsDialog: {
visible: boolean;
} = reactive({
visible: false
});
const logDetailsDialog: {
visible: boolean;
} = reactive({
visible: false
});
const logs=ref([]);
const logDetails=ref([]);
async function showLogsDialog(){
logs.value=[];
logsDialog.visible=true;
let resList=await getLogList();
logs.value=resList;
}
async function viewLogDetails(fileName:String){
let logContent=await getLogDetails(fileName);
logDetailsDialog.visible=true;
logDetails.value=logContent;
}
</script>
<style lang="less" scoped>
.import{
height:100%;
width:100%;
border:1px solid #d6d6d6;
border-radius:8px;
padding:10px 10px;
}
.import-log{
height:100px;
width:100%;
span{
color: rgba(0,0,255,0.8);
text-decoration:underline rgba(#0000ff,0.8);
font-weight: 500;
font-size: 16px;
cursor: pointer;
&:hover{
color: rgba(0,0,255,1);
text-decoration:underline #0000ff;
}
}
}
.import-type-wrapper{
display:flex;
flex-direction:row;
align-items:center;
justify-content:center;
height:calc(100% - 100px);
width:100%;
gap:100px;
}
.item-action {
border:1px solid rgba(206, 206, 206, 1);
padding:6px 8px;
border-radius:8px;
color:rgba(0, 0, 0, 0.8);
}
.item-action:hover {
cursor: pointer;
background:rgba(22, 119, 224, 1);
color:white;
}
.logs-content{
width:100%;
height:500px;
overflow-y:scroll;
padding:30px 30px;
.log{
padding:5px 0px;
.col-item{
margin-right:10px;
.content{
color:rgba(22, 119, 224, 1);
}
.view-log-detail{
&:hover{
text-decoration:underline;
cursor:pointer;
}
}
}
.success{
color:green;
}
.fail{
color:red;
}
}
}
.log-details{
height:500px;
}
</style>

View File

@ -0,0 +1,91 @@
<template>
<div class="system-data-migration">
<a-tabs v-model:activeKey="tabActiveKey" class="main-tabs">
<a-tab-pane key="import" tab="导出工作区">
<Export/>
</a-tab-pane>
<a-tab-pane key="outport" tab="导入工作区" force-render>
<Import/>
</a-tab-pane>
</a-tabs>
</div>
</template>
<script lang="ts" setup>
import { ref, computed, onMounted, onUnmounted, createVNode} from 'vue';
import { PageWrapper } from '/@/components/Page';
import Export from './components/export/index.vue';
import Import from './components/import/index.vue';
const tabActiveKey = ref('import');
</script>
<style lang="less" scoped>
.system-data-migration{
position:absolute;
height:100%;
width:100%;
background-color:white;
padding-top:10px;
}
.main-tabs {
height: 100%;
}
:deep(.ant-tabs-nav){
border-bottom:0px;
}
:deep(.ant-tabs-nav-wrap) {
width: 100% !important;
display: block !important;
}
:deep(.ant-tabs-tab) {
min-width: 200px !important;
width:calc(50% - 2px);
display: block !important;
text-align: center !important;
font-size:16px;
padding:8px 0px;
&.ant-tabs-tab-active{
// box-shadow: 10px 10px 100px rgba(#1677ff, 1) inset;
.ant-tabs-tab-btn{
// color:#fff;
}
}
}
:deep(.ant-tabs-tab:first-child) {
border-radius: 10px 0px 0px 10px;
}
:deep(.ant-tabs-tab + .ant-tabs-tab){
margin:0px 0px 0px 0px;
border-radius: 0px 10px 10px 0px;
}
:deep(.ant-tabs-content-holder) {
height:100%;
}
:deep(.ant-tabs-content) {
height: 100% !important;
overflow-y: auto;
padding:10px 10px;
}
:deep(.ant-tabs-tabpane) {
padding: 0 8px;
height:100%;
}
:deep(.ant-tabs-nav) {
margin-bottom: 0;
}
</style>

View File

@ -70,7 +70,7 @@
getCategoryList();
async function getCategoryList() {
categoryOptions.value = (await getDicDetailList({
itemId: FlowCategory.ID,
itemCode: FlowCategory.CODE,
})) as unknown as TreeItem[];
}
</script>

View File

@ -296,7 +296,7 @@
async function getCategoryTree() {
let res = (await getDicDetailList({
itemId: FlowCategory.ID,
itemCode: FlowCategory.CODE,
})) as unknown as TreeItem[];
data.treeData = res.map((ele) => {
ele.icon = 'ant-design:tags-outlined';

View File

@ -30,11 +30,22 @@
import { getSchemaTask } from '/@/api/workflow/process';
import { TaskTypeUrl } from '/@/enums/workflowEnum';
import { useI18n } from '/@/hooks/web/useI18n';
import { unref, watch, onMounted, onUnmounted } from 'vue';
import { unref, watch, onMounted, onUnmounted ,h} from 'vue';
import { useRouter } from 'vue-router';
import useEventBus from '/@/hooks/event/useEventBus';
import { getAppEnvConfig } from '/@/utils/env';
import { storeToRefs } from 'pinia';
import { useUserStore } from '/@/store/modules/user';
import {useMessage} from "/@/hooks/web/useMessage";
import {useTenantManager} from "/@/utils/tenantManager";
const router = useRouter();
const { currentRoute } = router;
const { t } = useI18n();
const userStore = useUserStore();
const { userInfo } = storeToRefs(userStore);
const configColumns: BasicColumn[] = [
{
title: t('流水号'),
@ -112,9 +123,8 @@
setting: false
}
});
const router = useRouter();
const { currentRoute } = router;
const {toggleLocal}=useTenantManager();
onMounted(() => {
bus.on(FLOW_PROCESSED, onFlowProcessed);
@ -131,18 +141,66 @@
{ deep: true }
);
const onRowDblClick = (record, index) => {
const { processId, taskId, schemaId } = record;
const {tenantId,tenantCode,tenantName} = record;
let tenantEnabled=getAppEnvConfig().VITE_GLOB_TENANT_ENABLED;
if(tenantEnabled =='true'&&tenantId){
let currentTenantId=userInfo.value.tenantId;
if(tenantId!=currentTenantId){
const { createConfirm} = useMessage();
createConfirm({
iconType: 'warning',
title: () => h('span', t('温馨提醒')),
content: () => h('div', [
h('span', t(`当前流程的发起租户是"${tenantName}",需要切换到该租户才能对该流程进行审批`)),
h('br'),
h('span', t('是否确认切换租户?未保存的数据可能会丢失!'))
]),
width:'600px',
onOk: async () => {
switchTenant(tenantCode).then(()=>{
openDetailPage(record,true);
})
},
okText: () => t('确认'),
cancelText: () => t('取消'),
});
}else{
openDetailPage(record);
};
}else{
openDetailPage(record);
}
};
function openDetailPage(record,isTenantSwitch){
const { processId, taskId, schemaId} = record;
router.push({
path: `/flow/${schemaId}/${processId}/approveFlow`,
query: {
taskId
}
}).then(()=> {
if (isTenantSwitch) {
const {notification} = useMessage();
const {tenantName} = record;
notification.success({
message: 'Tip',
description: t('已切换到租户“' + tenantName + '"'),
});
}
});
};
}
function onFlowProcessed() {
reload();
}
async function switchTenant(tenantCode: string) {
await toggleLocal({tenantCode:tenantCode, goHome:false,tabCloseAction:"closeOther"});
}
</script>
<style scoped></style>