geg-gas/geg-gas-web
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

多租户环境下表单配置的个性化

Browse Source
This commit is contained in:
suguangxu
2025-05-06 10:20:11 +08:00
parent 0dccbc7340
commit 3ca8f39a18
7 changed files with 380 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/views/form/design/components/BasicConfigStep.vue
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,
@ -382,12 +383,29 @@
deep: true,
},
);
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);
}
}
// alert("xx"+customFormConfig.formType);
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,
});

31
src/views/form/design/components/components/CodeFirstModal.vue
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 {
@ -71,6 +74,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);
@ -78,7 +82,7 @@
const formId = ref<string>('');
const beforeTableNames = ref<string[]>([]);
const mainTableName = ref('table_' + random(10000, 99999));
let generatorConfig = reactive<CustomFormJson>({
databaseId: '', //数据库id
formJson: {} as FormJson,
@ -92,7 +96,7 @@
name: '',
category: '',
formDesignType: 1,
formType: FormTypeEnum.CUSTOM_FORM,
formType:'',
formJson: generatorConfig,
remark: '',
isChange: false,
@ -203,15 +207,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 +229,7 @@
}
async function handleSave() {
const isOk = await stepValidate[3]();
const isOk = await stepValidate[4]();
if (!isOk) {
return;
}
@ -257,7 +266,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>

24
src/views/form/design/components/components/DataFirstModal.vue
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';
@ -59,6 +61,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)));
@ -67,7 +70,7 @@
const emits = defineEmits(['success', 'register', 'close']);
const globalFlag = useGlobalFlag();
const { isEditorOpen } = globalFlag;
watch(current, () => {
isEditorOpen.value = current.value === 1;
});
@ -88,7 +91,7 @@
name: '',
category: '',
formDesignType: 0,
formType: FormTypeEnum.CUSTOM_FORM,
formType: '',
formJson: generatorConfig,
remark: '',
});
@ -166,6 +169,9 @@
//上一步
function handleStepPrev() {
current.value--;
if(current.value==1){
widgetForm.value = generatorConfig.formJson;
}
}
//下一步
async function handleStepNext() {
@ -174,10 +180,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 +214,7 @@
0: () => basicConfigStepRef.value.validateStep(),
1: () => formDesignStepRef.value.validateStep(),
2: () => formEventStepRef.value.validateStep(),
3: () => entireConfigStepRef.value.validateStep(),
};
</script>
<style lang="less" scoped>

23
src/views/form/design/components/components/SimpleTemplateModal.vue
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';
@ -59,6 +61,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));
@ -68,7 +71,7 @@
const formId = ref<string>('');
const beforeTableNames = ref<string[]>([]);
const isFieldUpper = ref<boolean>(false);
let generatorConfig = reactive<GeneratorConfig>({
databaseId: 'master',
formJson: {},
@ -82,7 +85,7 @@
name: '',
category: '',
formDesignType: 2,
formType: FormTypeEnum.CUSTOM_FORM,
formType:'',
formJson: generatorConfig,
remark: '',
isChange: false,
@ -204,6 +207,9 @@
//上一步
function handleStepPrev() {
current.value--;
if(current.value==1){
widgetForm.value = generatorConfig.formJson;
}
}
//下一步
async function handleStepNext() {
@ -212,9 +218,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 +308,7 @@
0: () => basicConfigStepRef.value.validateStep(),
1: () => formDesignStepRef.value.validateStep(),
2: () => formEventStepRef.value.validateStep(),
3: () => entireConfigStepRef.value.validateStep(),
};
</script>
<style lang="less" scoped>