<!--
|
* @Description: 低代码生成页面
|
* @Author: Ben Lin
|
* @version:
|
* @Date: 2024-05-30 22:00:44
|
* @LastEditors: your name
|
* @LastEditTime: 2024-06-13 14:21:16
|
-->
|
<!-- eslint-disable prettier/prettier -->
|
<template>
|
<PageWrapper
|
class="high-form"
|
title="低代码页面管理"
|
content="这是低代码页面管理，在这能够根据实体类配置增删改功能页面。"
|
@back="goBack"
|
>
|
<a-card title="查询条件配置" :bordered="false">
|
<BasicForm @register="register">
|
<template #add="{ field }">
|
<a-button
|
v-if="field"
|
class="mt-1 ml-1"
|
size="small"
|
@click="handleSelecNew"
|
preIcon="search|svg"
|
/>
|
<EntityModal @register="registerNewAdd" @success="handleNewSuccess" />
|
</template>
|
<template #condAdd="{ field }">
|
<a-button
|
v-if="field"
|
class="mt-1 ml-1"
|
size="small"
|
@click="condAdd"
|
preIcon="add_blue|svg"
|
/>
|
</template>
|
<template #subtract="{ field }">
|
<a-button
|
v-if="field"
|
class="mt-1 ml-1"
|
size="small"
|
@click="del(field)"
|
preIcon="subtract|svg"
|
/>
|
</template>
|
<template #[item]="{ model, field }" v-for="(item, index) in searchSlots" :key="item">
|
<a-input-group compact>
|
<ApiSelect
|
style="width: 25%"
|
:api="getEntityPropertieList"
|
:params="{ StartWith: getFieldsValue().ASSEMBLY_NAME, Namespace: 'Tiger.Model' }"
|
v-model:value="model[field]"
|
resultField="items"
|
label-field="DisplayName"
|
valueField="Name"
|
@change="(value, option) => change(value, option, field)"
|
/>
|
<a-input v-model:value="objInputs[field]" style="width: 55%" />
|
<Select
|
ref="select"
|
v-model:value="searchSelectVals[field]"
|
style="width: 20%"
|
:options="options"
|
:readonly="true"
|
@change="(value, option) => searchOnChange(value, option, field)"
|
/>
|
</a-input-group>
|
</template>
|
<template #[item]="{ model, field }" v-for="item in swSlots" :key="item">
|
<a-switch v-model:checked="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in searchApiSlots" :key="item">
|
<a-input v-model:value="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in searchParamsSlots" :key="item">
|
<a-input v-model:value="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in searchResultFieldSlots" :key="item">
|
<a-input v-model:value="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in searchLabelFieldSlots" :key="item">
|
<a-input v-model:value="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in searchValueFieldSlots" :key="item">
|
<a-input v-model:value="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in searchOptionsSlots" :key="item">
|
<a-input v-model:value="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in searchOnChangeSlots" :key="item">
|
<a-input v-model:value="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in searchPOptionsSlots" :key="item">
|
<a-input v-model:value="model[field]" />
|
</template>
|
</BasicForm>
|
</a-card>
|
<a-card title="主表格配置" :bordered="false" class="!mt-5">
|
<div>
|
<BasicForm @register="registerMain">
|
<template #add="{ field }">
|
<a-button
|
v-if="field"
|
class="mt-1 ml-1"
|
size="small"
|
@click="mainSelectAssy"
|
preIcon="search|svg"
|
/>
|
<EntityModal @register="registerMainAdd" @success="mainAssySuccess" />
|
</template>
|
<template #mainCondAdd="{ field }">
|
<a-button
|
v-if="field"
|
class="mt-1 ml-1"
|
size="small"
|
@click="mainCondAdd"
|
preIcon="add_blue|svg"
|
/>
|
</template>
|
<template #mainSubtract="{ field }">
|
<a-button
|
v-if="field"
|
class="mt-1 ml-1"
|
size="small"
|
@click="mainDel(field)"
|
preIcon="subtract|svg"
|
/>
|
</template>
|
<template #[item]="{ model, field }" v-for="(item, index) in mainSlots" :key="item">
|
<a-input-group compact>
|
<ApiSelect
|
style="width: 30%"
|
:api="getEntityPropertieList"
|
:params="{
|
StartWith: getFieldsValueMain().MainAssemblyName,
|
Namespace: 'Tiger.Model',
|
}"
|
v-model:value="model[field]"
|
resultField="items"
|
label-field="DisplayName"
|
valueField="Name"
|
@change="(value, option) => mainChange(value, option, field)"
|
/>
|
<a-input v-model:value="mainInputs[field]" style="width: 70%" />
|
</a-input-group>
|
</template>
|
<template #[item]="{ model, field }" v-for="item in mainSwSlots" :key="item">
|
<a-switch v-model:checked="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in mainsSwSlots" :key="item">
|
<a-switch v-model:checked="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in mainwSwSlots" :key="item">
|
<a-switch v-model:checked="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in mainIaSlots" :key="item">
|
<a-input v-model:value="model[field]" />
|
</template>
|
</BasicForm>
|
</div>
|
</a-card>
|
<a-card title="增删改配置" :bordered="false" class="!mt-5">
|
<BasicForm @register="registerCrud">
|
<template #add="{ field }">
|
<a-button
|
v-if="field"
|
class="mt-1 ml-1"
|
size="small"
|
@click="handleSelectCrud"
|
preIcon="search|svg"
|
/>
|
<EntityModal @register="registerCrudAdd" @success="handleCrudSuccess" />
|
</template>
|
<template #crudCondAdd="{ field }">
|
<a-button
|
v-if="field"
|
class="mt-1 ml-1"
|
size="small"
|
@click="crudCondAdd"
|
preIcon="add_blue|svg"
|
/>
|
</template>
|
<template #crudSubtract="{ field }">
|
<a-button
|
v-if="field"
|
class="mt-1 ml-1"
|
size="small"
|
@click="crudDel(field)"
|
preIcon="subtract|svg"
|
/>
|
</template>
|
<template #[item]="{ model, field }" v-for="(item, index) in crudSlots" :key="item">
|
<a-input-group compact>
|
<ApiSelect
|
style="width: 25%"
|
:api="getEntityPropertieList"
|
:params="{
|
StartWith: getFieldsValueCrud().crudAssemblyName,
|
Namespace: 'Tiger.Model',
|
}"
|
v-model:value="model[field]"
|
resultField="items"
|
label-field="DisplayName"
|
valueField="Name"
|
@change="(value, option) => crudChange(value, option, field)"
|
/>
|
<a-input v-model:value="crudInputs[field]" style="width: 55%" />
|
<Select
|
ref="select"
|
v-model:value="crudSelectVals[field]"
|
style="width: 20%"
|
:options="options"
|
:readonly="true"
|
@change="(value, option) => componentChange(value, option, field)"
|
/>
|
</a-input-group>
|
</template>
|
<template #[item]="{ model, field }" v-for="item in crudSwSlots" :key="item">
|
<a-switch v-model:checked="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in crudrSwSlots" :key="item">
|
<a-switch v-model:checked="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in crudApiSlots" :key="item">
|
<a-input v-model:value="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in crudParamsSlots" :key="item">
|
<a-input v-model:value="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in crudResultFieldSlots" :key="item">
|
<a-input v-model:value="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in crudLabelFieldSlots" :key="item">
|
<a-input v-model:value="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in crudValueFieldSlots" :key="item">
|
<a-input v-model:value="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in crudOptionsSlots" :key="item">
|
<a-input v-model:value="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in crudOnChangeSlots" :key="item">
|
<a-input v-model:value="model[field]" />
|
</template>
|
<template #[item]="{ model, field }" v-for="item in crudPOptionsSlots" :key="item">
|
<a-input v-model:value="model[field]" />
|
</template>
|
</BasicForm>
|
</a-card>
|
|
<template #rightFooter>
|
<a-button class="mr-4" type="info" @click="cancel"> 取消 </a-button>
|
<a-button type="primary" @click="submitAll"> 生成 </a-button>
|
</template>
|
</PageWrapper>
|
</template>
|
<script lang="ts" setup>
|
import { BasicForm, FormSchema, useForm } from '/@/components/Form';
|
import { nextTick, onMounted, ref, unref } from 'vue';
|
import { Card, InputGroup, Select, Input, Switch } from 'ant-design-vue';
|
import { ApiSelect } from '/@/components/Form/index';
|
import { useRoute, useRouter } from 'vue-router';
|
import { PageWrapper } from '/@/components/Page';
|
import { useGo } from '/@/hooks/web/usePage';
|
import { newFormSchema, crudSchemas, mainSchemas } from './setting.data';
|
import { useTabs } from '/@/hooks/web/useTabs';
|
import EntityModal from '/@/views/components/EntityModal.vue';
|
import { buildUUID } from '/@/utils/uuid';
|
import { SelectTypes } from 'ant-design-vue/es/select';
|
import { useMultipleTabStore } from '/@/store/modules/multipleTab';
|
import { useModal } from '/@/components/Modal';
|
import { SaveEntity, getEntity, getEntityPropertieList } from '/@/api/tigerapi/system';
|
import { EntityPropertie, SYS_LOW_CODE } from '/@/api/tigerapi/model/systemModel';
|
import { isNullOrEmpty } from '/@/utils/is';
|
import { useUserStore } from '/@/store/modules/user';
|
|
const ACard = Card;
|
const AInputGroup = InputGroup;
|
const AInput = Input;
|
const ASwitch = Switch;
|
const route = useRoute();
|
const go = useGo();
|
const objParams = ref(JSON.parse(decodeURI(route.params?.id as string)));
|
const { setTitle } = useTabs();
|
const tabStore = useMultipleTabStore();
|
const router = useRouter();
|
|
const { currentRoute } = router;
|
function getCurrentTab() {
|
const route = unref(currentRoute);
|
return tabStore.getTabList.find((item) => item.fullPath === route.fullPath)!;
|
}
|
const currentTab = getCurrentTab();
|
var _title =
|
objParams.value.Update == '0'
|
? '低代码页面详情新增'
|
: `低代码页面详情编辑：${objParams.value.Name}`;
|
setTitle(_title);
|
const [registerCrudAdd, { openModal: openCrudModal }] = useModal();
|
const [registerNewAdd, { openModal: openNewModal }] = useModal();
|
const [registerMainAdd, { openModal: openMainModal }] = useModal();
|
const [
|
register,
|
{
|
resetFields,
|
setFieldsValue,
|
getFieldsValue,
|
appendSchemaByField,
|
removeSchemaByField,
|
validate,
|
},
|
] = useForm({
|
labelWidth: 130,
|
baseColProps: {
|
span: 24,
|
},
|
schemas: newFormSchema,
|
showActionButtonGroup: false,
|
});
|
const [
|
registerCrud,
|
{
|
setFieldsValue: setFieldsValueCrud,
|
getFieldsValue: getFieldsValueCrud,
|
appendSchemaByField: appendSchemaByFieldCrud,
|
removeSchemaByField: removeSchemaByFieldCrud,
|
validate: crudvalidate,
|
},
|
] = useForm({
|
labelWidth: 130,
|
baseColProps: {
|
span: 24,
|
},
|
schemas: crudSchemas,
|
showActionButtonGroup: false,
|
});
|
const [
|
registerMain,
|
{
|
setFieldsValue: setFieldsValueMain,
|
getFieldsValue: getFieldsValueMain,
|
appendSchemaByField: appendSchemaByFieldMain,
|
removeSchemaByField: removeSchemaByFieldMain,
|
validate: validateMainForm,
|
},
|
] = useForm({
|
labelWidth: 130,
|
baseColProps: {
|
span: 24,
|
},
|
schemas: mainSchemas,
|
showActionButtonGroup: false,
|
});
|
/* 查询 */
|
const SearchEntName = ref('');
|
const objInputs = ref({} as { [key: string]: any });
|
const searchProperties = ref([] as EntityPropertie[]);
|
const searchSlots = ref([] as string[]);
|
const searchSelectVals = ref({} as { [key: string]: any });
|
const swSlots = ref([] as string[]);
|
const searchApiSlots = ref([] as string[]);
|
const searchParamsSlots = ref([] as string[]);
|
const searchResultFieldSlots = ref([] as string[]);
|
const searchLabelFieldSlots = ref([] as string[]);
|
const searchValueFieldSlots = ref([] as string[]);
|
const searchOptionsSlots = ref([] as string[]);
|
const searchOnChangeSlots = ref([] as string[]);
|
const searchPOptionsSlots = ref([] as string[]);
|
/* 主表 */
|
const MainEntName = ref('');
|
const mainSelectVals = ref({} as { [key: string]: any });
|
const mainProperties = ref([] as EntityPropertie[]);
|
const mainInputs = ref({} as { [key: string]: any });
|
const mainSlots = ref([] as string[]);
|
const mainSwSlots = ref([] as string[]);
|
const mainsSwSlots = ref([] as string[]);
|
const mainwSwSlots = ref([] as string[]);
|
const mainIaSlots = ref([] as string[]);
|
/* 增删改 */
|
const CrudEntName = ref('');
|
const crudInputs = ref({} as { [key: string]: any });
|
const crudProperties = ref([] as EntityPropertie[]);
|
const crudSelectVals = ref({} as { [key: string]: any });
|
const crudSlots = ref([] as string[]);
|
const crudSwSlots = ref([] as string[]);
|
const crudrSwSlots = ref([] as string[]);
|
const crudApiSlots = ref([] as string[]);
|
const crudParamsSlots = ref([] as string[]);
|
const crudResultFieldSlots = ref([] as string[]);
|
const crudLabelFieldSlots = ref([] as string[]);
|
const crudValueFieldSlots = ref([] as string[]);
|
const crudOptionsSlots = ref([] as string[]);
|
const crudOnChangeSlots = ref([] as string[]);
|
const crudPOptionsSlots = ref([] as string[]);
|
|
const options = ref<SelectTypes['options']>([
|
{
|
value: 'Input',
|
label: '输入框',
|
},
|
{
|
value: 'InputPassword',
|
label: '输入密码框',
|
},
|
{
|
value: 'InputNumber',
|
label: '输入数字框',
|
},
|
{
|
value: 'Select',
|
label: '下拉框',
|
},
|
{
|
value: 'ApiSelect',
|
label: 'Api下拉框',
|
},
|
{
|
value: 'Checkbox',
|
label: 'Checkbox',
|
},
|
{
|
value: 'Upload',
|
label: '文件上传',
|
},
|
{
|
value: 'RangePicker',
|
label: '时间选择器',
|
},
|
{
|
value: 'Switch',
|
label: '开关',
|
},
|
{
|
value: 'PoPSelect',
|
label: '弹出选择框',
|
},
|
]);
|
|
/**
|
* @description: 实例组件挂载时
|
* @return {*}
|
*/
|
onMounted(() => {
|
if (unref(objParams.value.Update) == '1') {
|
getEntity({
|
sqlcmd: "ID ='" + objParams.value.ID + "'",
|
entityName: 'SYS_LOW_CODE',
|
}).then((data) => {
|
/* 查询加载 */
|
var searchForms = JSON.parse(data.Data.Items[0].SEARCH_FORM_JSON);
|
SearchEntName.value = data.Data.Items[0].SEARCH_ASSY_NAME;
|
setFieldsValue({ ASSEMBLY_NAME: data.Data.Items[0].SEARCH_ASSY_NAME });
|
searchForms = searchForms.filter((item) => !item['field'].toString().startsWith(SearchEntName.value) && !item['field'].toString().endsWith('PSelect_0'));
|
for (const i in searchForms) {
|
condAdd();
|
if (searchForms[i]['component'] == 'ApiSelect') {
|
addApiSelectOption(`${SearchEntName.value}${Number(i) + 1}a`, 'search');
|
setFieldsValue({
|
[`ApiSelect${SearchEntName.value}${Number(i) + 1}a`]:
|
searchForms[i]['componentProps']['api'],
|
[`Params${SearchEntName.value}${Number(i) + 1}a`]: JSON.stringify(
|
searchForms[i]['componentProps']['params'],
|
),
|
[`Result${SearchEntName.value}${Number(i) + 1}a`]:
|
searchForms[i]['componentProps']['resultField'],
|
[`Label${SearchEntName.value}${Number(i) + 1}a`]:
|
searchForms[i]['componentProps']['labelField'],
|
[`Value${SearchEntName.value}${Number(i) + 1}a`]:
|
searchForms[i]['componentProps']['valueField'],
|
});
|
}
|
if (searchForms[i]['component'] == 'Select') {
|
addSelectOption(`${SearchEntName.value}${Number(i) + 1}a`, 'search');
|
setFieldsValue({
|
[`XSelect${SearchEntName.value}${Number(i) + 1}a`]: JSON.stringify(
|
searchForms[i]['componentProps']['options'],
|
),
|
[`XOnChange${SearchEntName.value}${Number(i) + 1}a`]:
|
searchForms[i]['componentProps']['onChange'],
|
});
|
}
|
setFieldsValue({
|
[`${SearchEntName.value}${Number(i) + 1}a`]: searchForms[i]['field'],
|
[`InputNumber${Number(i) + 1}`]: searchForms[i]['colProps'].span,
|
[`Switch${Number(i) + 1}`]: searchForms[i]['ifShow'],
|
});
|
objInputs.value[`${SearchEntName.value}${Number(i) + 1}a`] = searchForms[i]['label'];
|
searchSelectVals.value[`${SearchEntName.value}${Number(i) + 1}a`] = searchForms[i]['comp']? searchForms[i]['comp']: searchForms[i]['component'];
|
if(searchForms[i]['comp']){
|
addPopSelectOption(`${SearchEntName.value}${Number(i) + 1}a`, 'search');
|
setFieldsValue({
|
[`PSelect${SearchEntName.value}${Number(i) + 1}a`]: searchForms[i]['entityName'],
|
});
|
}
|
}
|
/* 增删改加载 */
|
var crudForms = JSON.parse(data.Data.Items[0].FORM_JSON);
|
CrudEntName.value = data.Data.Items[0].CRUD_ASSY_NAME;
|
setFieldsValueCrud({ crudAssemblyName: data.Data.Items[0].CRUD_ASSY_NAME });
|
crudForms = crudForms.filter((item) => !item['field'].toString().startsWith(CrudEntName.value) && !item['field'].toString().endsWith('PSelect_0'));
|
for (const i in crudForms) {
|
crudCondAdd();
|
if (crudForms[i]['component'] == 'ApiSelect') {
|
addApiSelectOption(`${CrudEntName.value}${Number(i) + 1}a`, 'crud');
|
setFieldsValueCrud({
|
[`ApiSelect${CrudEntName.value}${Number(i) + 1}a`]:
|
crudForms[i]['componentProps']['api'],
|
[`Params${CrudEntName.value}${Number(i) + 1}a`]: JSON.stringify(
|
crudForms[i]['componentProps']['params'],
|
),
|
[`Result${CrudEntName.value}${Number(i) + 1}a`]:
|
crudForms[i]['componentProps']['resultField'],
|
[`Label${CrudEntName.value}${Number(i) + 1}a`]:
|
crudForms[i]['componentProps']['labelField'],
|
[`Value${CrudEntName.value}${Number(i) + 1}a`]:
|
crudForms[i]['componentProps']['valueField'],
|
});
|
}
|
if (crudForms[i]['component'] == 'Select') {
|
addSelectOption(`${CrudEntName.value}${Number(i) + 1}a`, 'crud');
|
setFieldsValueCrud({
|
[`XSelect${CrudEntName.value}${Number(i) + 1}a`]: JSON.stringify(
|
crudForms[i]['componentProps']['options'],
|
),
|
[`XOnChange${CrudEntName.value}${Number(i) + 1}a`]:
|
crudForms[i]['componentProps']['onChange'],
|
});
|
}
|
setFieldsValueCrud({
|
[`${CrudEntName.value}${Number(i) + 1}a`]: crudForms[i]['field'],
|
[`InputNumber${Number(i) + 1}`]: crudForms[i]['colProps'].span,
|
[`Switch${Number(i) + 1}`]: crudForms[i]['show'],
|
[`rSwitch${Number(i) + 1}`]: crudForms[i]['required'],
|
});
|
crudInputs.value[`${CrudEntName.value}${Number(i) + 1}a`] = crudForms[i]['label'];
|
crudSelectVals.value[`${CrudEntName.value}${Number(i) + 1}a`] = crudForms[i]['comp']? crudForms[i]['comp']: crudForms[i]['component'];
|
if(crudForms[i]['comp']){
|
addPopSelectOption(`${CrudEntName.value}${Number(i) + 1}a`, 'crud');
|
setFieldsValueCrud({
|
[`PSelect${CrudEntName.value}${Number(i) + 1}a`]: crudForms[i]['entityName'],
|
});
|
}
|
}
|
/* 主表加载 */
|
var objs = JSON.parse(data.Data.Items[0].BASE_FORM_JSON);
|
MainEntName.value = data.Data.Items[0].ASSEMBLY_NAME;
|
setFieldsValueMain({ MainAssemblyName: MainEntName.value });
|
for (const i in objs) {
|
mainCondAdd();
|
setFieldsValueMain({
|
[`${MainEntName.value}${Number(i) + 1}a`]: objs[i]['dataIndex'],
|
[`Switch${Number(i) + 1}`]: objs[i]['ifShow'],
|
[`sSwitch${Number(i) + 1}`]: objs[i]['sorter'],
|
[`wSwitch${Number(i) + 1}`]: objs[i]['resizable'],
|
[`InputTextArea${Number(i) + 1}`]: objs[i]['customRender'],
|
});
|
mainInputs.value[`${MainEntName.value}${Number(i) + 1}a`] = objs[i]['title'];
|
}
|
});
|
}
|
});
|
|
/**
|
* @description: 全部提交
|
* @return {*}
|
*/
|
async function submitAll() {
|
try {
|
const [values, crudvalues, mainvalues] = await Promise.all([
|
validate(),
|
crudvalidate(),
|
validateMainForm(),
|
]);
|
|
/* 查询条件Json */
|
const Keys = Object.getOwnPropertyNames(values);
|
var searchjsons = [];
|
var _json = {};
|
var _n = 0;
|
let firstField = '';
|
for (const k in Keys) {
|
console.log(`${k}:${Keys[k]}`);
|
if (Keys[k].toString().startsWith(getFieldsValue().ASSEMBLY_NAME)) {
|
firstField = Keys[k];
|
_json['field'] = isNullOrEmpty(values[Keys[k]]) ? '' : values[Keys[k]];
|
_json['label'] = objInputs.value[Keys[k]];
|
_json['defaultValue'] = '';
|
_json['component'] = searchSelectVals.value[Keys[k]];
|
if (searchSelectVals.value[Keys[k]] == 'ApiSelect') {
|
_json['componentProps'] = {
|
api: values[`ApiSelect${Keys[k]}`],
|
params: JSON.parse(values[`Params${Keys[k]}`]),
|
resultField: values[`Result${Keys[k]}`],
|
labelField: values[`Label${Keys[k]}`],
|
valueField: values[`Value${Keys[k]}`],
|
};
|
}
|
if (searchSelectVals.value[Keys[k]] == 'Select') {
|
_json['componentProps'] = {
|
options: JSON.parse(values[`XSelect${Keys[k]}`]),
|
onChange: values[`XOnChange${Keys[k]}`],
|
};
|
}
|
_n = _n + 4;
|
}
|
if (Keys[k].toString().startsWith('InputNumber')) {
|
_json['colProps'] = { span: values[Keys[k]] };
|
_n++;
|
}
|
if (Keys[k].toString().startsWith('Switch')) {
|
_json['ifShow'] = isNullOrEmpty(values[Keys[k]]) ? false : (values[Keys[k]] as boolean);
|
_n++;
|
}
|
if (!isNullOrEmpty(_json) && _n == 6) {
|
//如果是弹出选择框
|
if (_json['component'] == 'PoPSelect') {
|
_json['component'] = 'Input';
|
_json['comp'] = 'PoPSelect';
|
_json['entityName'] = values[`PSelect${firstField}`];
|
searchjsons.push(_json);
|
_json = {};
|
_json['field'] = `${firstField}PSelect_0`;
|
_json['label'] = '1';
|
_json['defaultValue'] = values[`PSelect${firstField}`];
|
_json['component'] = 'Input';
|
_json['colProps'] = { span: 4 };
|
_json['ifShow'] = true;
|
_json['colSlot'] = `${firstField}add`;
|
}
|
searchjsons.push(_json);
|
_json = {};
|
_n = 0;
|
}
|
}
|
console.log(JSON.stringify(searchjsons));
|
/* 主表格Json */
|
const mKeys = Object.getOwnPropertyNames(mainvalues);
|
var mjsons = [];
|
var mjson = {};
|
var i = 0;
|
for (const k in mKeys) {
|
console.log(`${k}:${mKeys[k]}`);
|
if (mKeys[k].toString().startsWith(getFieldsValueMain().MainAssemblyName)) {
|
mjson['dataIndex'] = isNullOrEmpty(mainvalues[mKeys[k]]) ? '' : mainvalues[mKeys[k]];
|
mjson['title'] = isNullOrEmpty(mainvalues[mKeys[k]]) ? '' : mainInputs.value[mKeys[k]];
|
i = i + 2;
|
}
|
if (mKeys[k].toString().startsWith('Switch')) {
|
mjson['ifShow'] = isNullOrEmpty(mainvalues[mKeys[k]])
|
? false
|
: (mainvalues[mKeys[k]] as boolean);
|
i++;
|
}
|
if (mKeys[k].toString().startsWith('sSwitch')) {
|
mjson['sorter'] = isNullOrEmpty(mainvalues[mKeys[k]])
|
? false
|
: (mainvalues[mKeys[k]] as boolean);
|
i++;
|
}
|
if (mKeys[k].toString().startsWith('wSwitch')) {
|
mjson['resizable'] = isNullOrEmpty(mainvalues[mKeys[k]])
|
? false
|
: (mainvalues[mKeys[k]] as boolean);
|
i++;
|
}
|
if (mKeys[k].toString().startsWith('InputTextArea')) {
|
mjson['customRender'] = isNullOrEmpty(mainvalues[mKeys[k]]) ? '' : mainvalues[mKeys[k]];
|
i++;
|
}
|
if (!isNullOrEmpty(mjson) && i == 6) {
|
mjsons.push(mjson);
|
i = 0;
|
mjson = {};
|
}
|
}
|
console.log(JSON.stringify(mjsons));
|
/* 增删改Json */
|
const cKeys = Object.getOwnPropertyNames(crudvalues);
|
var cjsons = [];
|
var cjson = {};
|
var c = 0;
|
let cfirstField = '';
|
for (const k in cKeys) {
|
console.log(`${k}:${cKeys[k]}`);
|
if (cKeys[k].toString().startsWith(getFieldsValueCrud().crudAssemblyName)) {
|
cfirstField = cKeys[k];
|
cjson['field'] = isNullOrEmpty(crudvalues[cKeys[k]]) ? '' : crudvalues[cKeys[k]];
|
cjson['label'] = isNullOrEmpty(crudInputs.value[cKeys[k]])
|
? ''
|
: crudInputs.value[cKeys[k]];
|
cjson['component'] = crudSelectVals.value[cKeys[k]];
|
if (crudSelectVals.value[cKeys[k]] == 'ApiSelect') {
|
cjson['componentProps'] = {
|
api: crudvalues[`ApiSelect${cKeys[k]}`],
|
params: JSON.parse(crudvalues[`Params${cKeys[k]}`]),
|
resultField: crudvalues[`Result${cKeys[k]}`],
|
labelField: crudvalues[`Label${cKeys[k]}`],
|
valueField: crudvalues[`Value${cKeys[k]}`],
|
};
|
}
|
if (crudSelectVals.value[cKeys[k]] == 'Select') {
|
cjson['componentProps'] = {
|
options: JSON.parse(crudvalues[`XSelect${cKeys[k]}`]),
|
onChange: crudvalues[`XOnChange${cKeys[k]}`],
|
};
|
}
|
c = c + 3;
|
}
|
if (cKeys[k].toString().startsWith('Switch')) {
|
cjson['show'] = isNullOrEmpty(crudvalues[cKeys[k]])
|
? false
|
: (crudvalues[cKeys[k]] as boolean);
|
c++;
|
}
|
if (cKeys[k].toString().startsWith('rSwitch')) {
|
cjson['required'] = isNullOrEmpty(crudvalues[cKeys[k]])
|
? false
|
: (crudvalues[cKeys[k]] as boolean);
|
c++;
|
}
|
if (cKeys[k].toString().startsWith('InputNumber')) {
|
cjson['colProps'] = { span: crudvalues[cKeys[k]] };
|
c++;
|
}
|
if (!isNullOrEmpty(cjson) && c == 6) {
|
//如果是弹出选择框
|
if (cjson['component'] == 'PoPSelect') {
|
cjson['component'] = 'Input';
|
cjson['comp'] = 'PoPSelect';
|
cjson['entityName'] = crudvalues[`PSelect${cfirstField}`];
|
cjsons.push(cjson);
|
cjson = {};
|
cjson['field'] = `${cfirstField}PSelect_0`;
|
cjson['label'] = '1';
|
cjson['defaultValue'] = crudvalues[`PSelect${cfirstField}`];
|
cjson['component'] = 'Input';
|
cjson['colProps'] = { span: 4 };
|
cjson['ifShow'] = true;
|
cjson['colSlot'] = `${cfirstField}add`;
|
}
|
cjsons.push(cjson);
|
c = 0;
|
cjson = {};
|
}
|
}
|
console.log(JSON.stringify(cjsons));
|
var entity: SYS_LOW_CODE = {
|
ID: objParams.value.ID,
|
CREATE_USER: useUserStore().getUserInfo.userId as string,
|
UPDATE_USER: useUserStore().getUserInfo.userId as string,
|
SEARCH_FORM_JSON: JSON.stringify(searchjsons),
|
BASE_FORM_JSON: JSON.stringify(mjsons),
|
FORM_JSON: JSON.stringify(cjsons),
|
ASSEMBLY_NAME: getFieldsValueMain().MainAssemblyName,
|
CRUD_ASSY_NAME: getFieldsValueCrud().crudAssemblyName,
|
SEARCH_ASSY_NAME: getFieldsValue().ASSEMBLY_NAME,
|
};
|
SaveEntity(entity, unref(objParams.value.Update) == '1', 'SYS_LOW_CODE').then((action) => {
|
if (action.IsSuccessed) {
|
cancel();
|
}
|
});
|
} catch (error) {
|
console.log(error);
|
}
|
}
|
|
async function cancel() {
|
try {
|
tabStore.closeTab(currentTab, router);
|
} catch (error) {}
|
}
|
async function handleCreate() {
|
await validate();
|
}
|
|
function handleEdit(record: Recordable) {}
|
/**
|
* @description: 查询配置类名选择按钮方法
|
* @return {*}
|
*/
|
function handleSelecNew() {
|
openNewModal(true, {
|
data: 'content',
|
info: 'Info',
|
});
|
}
|
|
/**
|
* @description: 主表配置类名选择按钮方法
|
* @return {*}
|
*/
|
function mainSelectAssy() {
|
openMainModal(true, {
|
data: 'content',
|
info: 'Info',
|
});
|
}
|
|
/**
|
* @description: 增删改配置类名选择按钮方法
|
* @return {*}
|
*/
|
function handleSelectCrud() {
|
openCrudModal(true, {
|
data: 'content',
|
info: 'Info',
|
});
|
}
|
|
/**
|
* @description: 选择类名弹出框返回成功方法
|
* @param {*} d
|
* @param {*} u
|
* @return {*}
|
*/
|
async function mainAssySuccess(d, u) {
|
setFieldsValueMain({
|
MainAssemblyName: d.values['val'],
|
});
|
var data = await getEntityPropertieList({
|
StartWith: d.values['val'],
|
Namespace: 'Tiger.Model',
|
});
|
mainProperties.value = data.items;
|
MainEntName.value = d.values['val'];
|
}
|
|
async function handleNewSuccess(d, u) {
|
setFieldsValue({
|
ASSEMBLY_NAME: d.values['val'],
|
});
|
var data = await getEntityPropertieList({
|
StartWith: d.values['val'],
|
Namespace: 'Tiger.Model',
|
});
|
searchProperties.value = data.items;
|
SearchEntName.value = d.values['val'];
|
}
|
|
async function handleCrudSuccess(d, u) {
|
setFieldsValueCrud({
|
crudAssemblyName: d.values['val'],
|
});
|
var data = await getEntityPropertieList({
|
StartWith: d.values['val'],
|
Namespace: 'Tiger.Model',
|
});
|
crudProperties.value = data.items;
|
CrudEntName.value = d.values['val'];
|
}
|
/* 选择类名弹出框返回成功方法 End */
|
|
/**
|
* @description: 配置字段选择改变后事件方法
|
* @param {*} value
|
* @param {*} option
|
* @param {*} field
|
* @return {*}
|
*/
|
function change(value, option, field) {
|
console.log(value, option, field);
|
objInputs.value[field] = option.label;
|
}
|
function mainChange(value, option, field) {
|
console.log(value, option, field);
|
mainInputs.value[field] = option.label;
|
}
|
function crudChange(value, option, field) {
|
console.log(value, option, field);
|
crudInputs.value[field] = option.label;
|
}
|
/* 配置字段选择改变后事件方法 End */
|
|
/**
|
* @description: 查询组件选择事件
|
* @param {*} value
|
* @param {*} option
|
* @param {*} field
|
* @return {*}
|
*/
|
function searchOnChange(value, option, field) {
|
console.log(value, option, field);
|
if (value == 'ApiSelect') {
|
addApiSelectOption(field, 'search');
|
delSelectOption(field, 'search');
|
delPSelectOption(field, 'search');
|
} else {
|
delApiSelectOption(field, 'search');
|
}
|
if (value == 'Select') {
|
addSelectOption(field, 'search');
|
delApiSelectOption(field, 'search');
|
delPSelectOption(field, 'search');
|
} else {
|
delSelectOption(field, 'search');
|
}
|
if (value == 'PoPSelect') {
|
addPopSelectOption(field, 'search');
|
delApiSelectOption(field, 'search');
|
delSelectOption(field, 'search');
|
} else {
|
delPSelectOption(field, 'search');
|
}
|
}
|
|
/**
|
* @description: 增删改组件选择事件
|
* @param {*} value
|
* @param {*} option
|
* @param {*} field
|
* @return {*}
|
*/
|
function componentChange(value, option, field) {
|
console.log(value, option, field);
|
if (value == 'ApiSelect') {
|
addApiSelectOption(field, 'crud');
|
delSelectOption(field, 'crud');
|
delPSelectOption(field, 'crud');
|
} else {
|
delApiSelectOption(field, 'crud');
|
}
|
if (value == 'Select') {
|
addSelectOption(field, 'crud');
|
delApiSelectOption(field, 'crud');
|
delPSelectOption(field, 'crud');
|
} else {
|
delSelectOption(field, 'crud');
|
}
|
if (value == 'PoPSelect') {
|
addPopSelectOption(field, 'crud');
|
delApiSelectOption(field, 'crud');
|
delSelectOption(field, 'crud');
|
} else {
|
delPSelectOption(field, 'crud');
|
}
|
}
|
|
/**
|
* @description: 选择了ApiSelect组件选项后，增加相应的输入项
|
* @param {*} field
|
* @param {*} type
|
* @return {*}
|
*/
|
function addApiSelectOption(field: string, type: string) {
|
const appendData: FormSchema[] = [
|
{
|
field: `ApiSelect${field}`,
|
component: 'Input',
|
label: `api`,
|
slot: `Api${field}`,
|
colProps: { span: 5 },
|
},
|
{
|
field: `Params${field}`,
|
component: 'Input',
|
label: 'params',
|
slot: `Params_${field}`,
|
colProps: { span: 6 },
|
},
|
{
|
field: `Result${field}`,
|
component: 'Input',
|
label: 'resultField',
|
slot: `ResultField${field}`,
|
colProps: { span: 5 },
|
},
|
{
|
field: `Label${field}`,
|
component: 'Input',
|
label: 'labelField',
|
slot: `LabelField${field}`,
|
colProps: { span: 4 },
|
},
|
{
|
field: `Value${field}`,
|
component: 'Input',
|
label: 'valueField',
|
slot: `ValueField${field}`,
|
colProps: { span: 4 },
|
},
|
];
|
switch (type) {
|
case 'search':
|
appendSchemaByField(appendData, '');
|
searchSlotsPush(field);
|
break;
|
case 'crud':
|
appendSchemaByFieldCrud(appendData, '');
|
crudSlotsPush(field);
|
break;
|
}
|
}
|
|
/**
|
* @description: 增删改ApiSelect插槽数据添加
|
* @param {*} field
|
* @return {*}
|
*/
|
function crudSlotsPush(field: string) {
|
crudApiSlots.value.push(`Api${field}`);
|
crudParamsSlots.value.push(`Params_${field}`);
|
crudResultFieldSlots.value.push(`ResultField${field}`);
|
crudLabelFieldSlots.value.push(`LabelField${field}`);
|
crudValueFieldSlots.value.push(`ValueField${field}`);
|
}
|
|
/**
|
* @description: 查询ApiSelect插槽数据添加
|
* @param {*} field
|
* @return {*}
|
*/
|
function searchSlotsPush(field: string) {
|
searchApiSlots.value.push(`Api${field}`);
|
searchParamsSlots.value.push(`Params_${field}`);
|
searchResultFieldSlots.value.push(`ResultField${field}`);
|
searchLabelFieldSlots.value.push(`LabelField${field}`);
|
searchValueFieldSlots.value.push(`ValueField${field}`);
|
}
|
|
/**
|
* @description: 取消ApiSelect组件后删除添加的输入项
|
* @param {*} field
|
* @param {*} type
|
* @return {*}
|
*/
|
function delApiSelectOption(field: string, type: string) {
|
const removeData: string[] = [
|
`ApiSelect${field}`,
|
`Params${field}`,
|
`Result${field}`,
|
`Label${field}`,
|
`Value${field}`,
|
];
|
switch (type) {
|
case 'search':
|
//if (!isNullOrEmpty(getFieldsValue()[`ApiSelect${field}`])) {
|
removeSchemaByField(removeData);
|
searchSlotsSplice(field);
|
//}
|
break;
|
case 'crud':
|
//if (!isNullOrEmpty(getFieldsValueCrud()[`ApiSelect${field}`])) {
|
removeSchemaByFieldCrud(removeData);
|
crudSlotsSplice(field);
|
//}
|
break;
|
}
|
}
|
|
/**
|
* @description: 增删改插槽删除项
|
* @param {*} field
|
* @return {*}
|
*/
|
function crudSlotsSplice(field: string) {
|
crudApiSlots.value = crudApiSlots.value.filter((item) => item !== `Api${field}`);
|
crudParamsSlots.value = crudParamsSlots.value.filter((item) => item !== `Params_${field}`);
|
crudResultFieldSlots.value = crudResultFieldSlots.value.filter(
|
(item) => item !== `ResultField${field}`,
|
);
|
crudLabelFieldSlots.value = crudLabelFieldSlots.value.filter(
|
(item) => item !== `LabelField${field}`,
|
);
|
crudValueFieldSlots.value = crudValueFieldSlots.value.filter(
|
(item) => item !== `ValueField${field}`,
|
);
|
}
|
|
/**
|
* @description: 增删改插槽删除项
|
* @param {*} field
|
* @return {*}
|
*/
|
function searchSlotsSplice(field: string) {
|
searchApiSlots.value = searchApiSlots.value.filter((item) => item !== `Api${field}`);
|
searchParamsSlots.value = searchParamsSlots.value.filter((item) => item !== `Params_${field}`);
|
searchResultFieldSlots.value = searchResultFieldSlots.value.filter(
|
(item) => item !== `ResultField${field}`,
|
);
|
searchLabelFieldSlots.value = searchLabelFieldSlots.value.filter(
|
(item) => item !== `LabelField${field}`,
|
);
|
searchValueFieldSlots.value = searchValueFieldSlots.value.filter(
|
(item) => item !== `ValueField${field}`,
|
);
|
}
|
|
/**
|
* @description: 下拉框Select添加选项
|
* @return {*}
|
*/
|
function addSelectOption(field: string, type: string) {
|
const appendData: FormSchema[] = [
|
{
|
field: `XSelect${field}`,
|
component: 'Input',
|
label: `options`,
|
slot: `Select_${field}`,
|
colProps: { span: 12 },
|
},
|
{
|
field: `XOnChange${field}`,
|
component: 'Input',
|
label: 'onChange',
|
slot: `OnChange_${field}`,
|
colProps: { span: 12 },
|
},
|
];
|
switch (type) {
|
case 'search':
|
appendSchemaByField(appendData, '');
|
searchSelSlotsPush(field);
|
break;
|
case 'crud':
|
appendSchemaByFieldCrud(appendData, '');
|
crudSelSlotsPush(field);
|
break;
|
}
|
}
|
|
/**
|
* @description: 取消Select组件后删除添加的输入项
|
* @param {*} field
|
* @param {*} type
|
* @return {*}
|
*/
|
function delSelectOption(field: string, type: string) {
|
const removeData: string[] = [`XSelect${field}`, `XOnChange${field}`];
|
switch (type) {
|
case 'search':
|
//if (!isNullOrEmpty(getFieldsValue()[`XSelect${field}`])) {
|
removeSchemaByField(removeData);
|
searchSelSlotsSplice(field);
|
//}
|
break;
|
case 'crud':
|
//if (!isNullOrEmpty(getFieldsValueCrud()[`XSelect${field}`])) {
|
removeSchemaByFieldCrud(removeData);
|
crudSelSlotsSplice(field);
|
//}
|
break;
|
}
|
}
|
|
/**
|
* @description: 查询Select插槽数据添加
|
* @param {*} field
|
* @return {*}
|
*/
|
function searchSelSlotsPush(field: string) {
|
searchOptionsSlots.value.push(`Select_${field}`);
|
searchOptionsSlots.value.push(`OnChange_${field}`);
|
}
|
|
/**
|
* @description: 查询插槽删除项
|
* @param {*} field
|
* @return {*}
|
*/
|
function searchSelSlotsSplice(field: string) {
|
searchOptionsSlots.value = searchOptionsSlots.value.filter(
|
(item) => item !== `Select_${field}`,
|
);
|
searchOptionsSlots.value = searchOptionsSlots.value.filter(
|
(item) => item !== `OnChange_${field}`,
|
);
|
}
|
|
/**
|
* @description: 增删改Select插槽数据添加
|
* @param {*} field
|
* @return {*}
|
*/
|
function crudSelSlotsPush(field: string) {
|
crudOptionsSlots.value.push(`Select_${field}`);
|
crudOnChangeSlots.value.push(`OnChange_${field}`);
|
}
|
|
/**
|
* @description: 增删改插槽删除项
|
* @return {*}
|
*/
|
function crudSelSlotsSplice(field: string) {
|
crudOptionsSlots.value = crudOptionsSlots.value.filter((item) => item !== `Select_${field}`);
|
crudOnChangeSlots.value = crudOnChangeSlots.value.filter(
|
(item) => item !== `OnChange_${field}`,
|
);
|
}
|
|
/**
|
* @description: 弹出选择框PopSelect添加选项
|
* @param {*} field
|
* @param {*} type
|
* @return {*}
|
*/
|
function addPopSelectOption(field: string, type: string) {
|
const appendData: FormSchema[] = [
|
{
|
field: `PSelect${field}`,
|
component: 'Input',
|
label: `defaultValue`,
|
slot: `PSelect_${field}`,
|
colProps: { span: 24 },
|
},
|
];
|
switch (type) {
|
case 'search':
|
appendSchemaByField(appendData, '');
|
searchPSelSlotsPush(field);
|
break;
|
case 'crud':
|
appendSchemaByFieldCrud(appendData, '');
|
crudPSelSlotsPush(field);
|
break;
|
}
|
}
|
|
/**
|
* @description: 查询PopSelect插槽数据添加
|
* @param {*} field
|
* @return {*}
|
*/
|
function searchPSelSlotsPush(field: string) {
|
searchPOptionsSlots.value.push(`PSelect_${field}`);
|
}
|
|
/**
|
* @description: 增删改PopSelect插槽数据添加
|
* @param {*} field
|
* @return {*}
|
*/
|
function crudPSelSlotsPush(field: string) {
|
crudPOptionsSlots.value.push(`PSelect_${field}`);
|
}
|
|
function delPSelectOption(field: string, type: string) {
|
const removeData: string[] = [`PSelect${field}`];
|
switch (type) {
|
case 'search':
|
removeSchemaByField(removeData);
|
searchPSelSlotsSplice(field);
|
break;
|
case 'crud':
|
removeSchemaByFieldCrud(removeData);
|
crudPSelSlotsSplice(field);
|
break;
|
}
|
}
|
|
/**
|
* @description: 查询插槽删除项
|
* @param {*} field
|
* @return {*}
|
*/
|
function searchPSelSlotsSplice(field: string) {
|
searchPOptionsSlots.value = searchPOptionsSlots.value.filter(
|
(item) => item !== `PSelect_${field}`,
|
);
|
}
|
|
/**
|
* @description: 增删改插槽删除项
|
* @param {*} field
|
* @return {*}
|
*/
|
function crudPSelSlotsSplice(field: string) {
|
crudPOptionsSlots.value = crudPOptionsSlots.value.filter((item) => item !== `PSelect_${field}`);
|
}
|
|
const n = ref(1);
|
const m = ref(1);
|
const j = ref(1);
|
/**
|
* @description: 批量添加 查询配置
|
*/
|
function condAdd() {
|
appendSchemaByField(
|
[
|
{
|
field: `${SearchEntName.value}${n.value}a`,
|
component: 'InputGroup',
|
label: '字段' + n.value,
|
//required: true,
|
slot: 'fac' + n.value,
|
colProps: { span: 14 },
|
},
|
{
|
field: `Switch${n.value}`,
|
component: 'Switch',
|
label: '是否显示',
|
slot: `sw${n.value}`,
|
colProps: { span: 3 },
|
},
|
{
|
field: `InputNumber${n.value}`,
|
component: 'InputNumber',
|
label: '列宽',
|
colProps: { span: 3 },
|
},
|
{
|
field: `${n.value}`,
|
component: 'Input',
|
label: ' ',
|
slot: 'subtract',
|
colProps: { span: 4 },
|
},
|
],
|
'',
|
);
|
searchSlots.value.push('fac' + n.value);
|
swSlots.value.push(`sw${n.value}`);
|
objInputs.value[`${SearchEntName.value}${n.value}a`] = '';
|
searchSelectVals.value[`${SearchEntName.value}${n.value}a`] = '';
|
console.log(searchSlots.value);
|
n.value++;
|
}
|
|
function del(field) {
|
removeSchemaByField([
|
`${SearchEntName.value}${field}a`,
|
`Switch${field}`,
|
`InputNumber${field}`,
|
`${field}`,
|
]);
|
swSlots.value = swSlots.value.filter((item) => item !== `sw${field}`);
|
searchSlots.value = searchSlots.value.filter((item) => item !== `fac${field}`);
|
if (searchSlots.value.length == 0) {
|
n.value = 1;
|
}
|
delApiSelectOption(`${CrudEntName.value}${field}a`, 'search');
|
delSelectOption(`${CrudEntName.value}${field}a`, 'search');
|
delPSelectOption(`${CrudEntName.value}${field}a`, 'search');
|
}
|
|
/**
|
* @description: 主表配置
|
* @return {*}
|
*/
|
function mainCondAdd() {
|
appendSchemaByFieldMain(
|
[
|
{
|
field: `${MainEntName.value}${m.value}a`,
|
component: 'InputGroup',
|
label: '字段' + m.value,
|
// required: true,
|
slot: 'mainfac' + m.value,
|
colProps: { span: 12 },
|
},
|
{
|
field: `Switch${m.value}`,
|
component: 'Switch',
|
label: '是否显示',
|
slot: `mainSw${m.value}`,
|
colProps: { span: 4 },
|
},
|
{
|
field: `sSwitch${m.value}`,
|
component: 'Switch',
|
label: '是否排序',
|
slot: `mainsSw${m.value}`,
|
colProps: { span: 4 },
|
},
|
{
|
field: `wSwitch${m.value}`,
|
component: 'Switch',
|
label: '是否可调宽',
|
slot: `mainwSw${m.value}`,
|
colProps: { span: 4 },
|
},
|
{
|
field: `InputTextArea${m.value}`,
|
component: 'InputTextArea',
|
label: '自定义渲染',
|
slot: `mainwIa${m.value}`,
|
colProps: { span: 21 },
|
componentProps: {
|
placeholder: '请编辑渲染代码',
|
rows: 4,
|
},
|
},
|
{
|
field: `${m.value}`,
|
component: 'Input',
|
label: ' ',
|
slot: 'mainSubtract',
|
colProps: { span: 3 },
|
},
|
],
|
'',
|
);
|
mainSlots.value.push('mainfac' + m.value);
|
mainSwSlots.value.push(`mainSw${m.value}`);
|
mainsSwSlots.value.push(`mainsSw${m.value}`);
|
mainwSwSlots.value.push(`mainwSw${m.value}`);
|
mainIaSlots.value.push(`mainwIa${m.value}`);
|
mainInputs.value[`${MainEntName.value}${m.value}a`] = '';
|
mainSelectVals.value[`${MainEntName.value}${m.value}a`] = '';
|
console.log(mainSlots.value);
|
m.value++;
|
}
|
|
function mainDel(field) {
|
removeSchemaByFieldMain([
|
`${MainEntName.value}${field}a`,
|
`Switch${field}`,
|
`sSwitch${field}`,
|
`wSwitch${field}`,
|
`InputTextArea${field}`,
|
`${field}`,
|
]);
|
mainSwSlots.value = mainSwSlots.value.filter((item) => item !== `mainSw${field}`);
|
mainsSwSlots.value = mainsSwSlots.value.filter((item) => item !== `mainsSw${field}`);
|
mainwSwSlots.value = mainwSwSlots.value.filter((item) => item !== `mainwSw${field}`);
|
mainIaSlots.value = mainIaSlots.value.filter((item) => item !== `mainwIa${field}`);
|
mainSlots.value = mainSlots.value.filter((item) => item !== `mainfac${field}`);
|
if (mainSlots.value.length == 0) {
|
m.value = 1;
|
}
|
}
|
|
/**
|
* @description: 增删改配置
|
* @return {*}
|
*/
|
function crudCondAdd() {
|
appendSchemaByFieldCrud(
|
[
|
{
|
field: `${CrudEntName.value}${j.value}a`,
|
component: 'InputGroup',
|
label: '字段' + j.value,
|
// required: true,
|
slot: 'crudfac' + j.value,
|
colProps: { span: 12 },
|
},
|
{
|
field: `Switch${j.value}`,
|
component: 'Switch',
|
label: '是否显示',
|
slot: `crudSw${j.value}`,
|
colProps: { span: 3 },
|
},
|
{
|
field: `rSwitch${j.value}`,
|
component: 'Switch',
|
label: '是否必填',
|
slot: `crudrSw${j.value}`,
|
colProps: { span: 3 },
|
},
|
{
|
field: `InputNumber${j.value}`,
|
component: 'InputNumber',
|
label: '列宽',
|
colProps: { span: 3 },
|
},
|
{
|
field: `${j.value}`,
|
component: 'Input',
|
label: ' ',
|
slot: 'crudSubtract',
|
colProps: { span: 3 },
|
},
|
],
|
'',
|
);
|
crudSlots.value.push('crudfac' + j.value);
|
crudSwSlots.value.push(`crudSw${j.value}`);
|
crudrSwSlots.value.push(`crudrSw${j.value}`);
|
crudInputs.value[`${CrudEntName.value}${j.value}a`] = '';
|
crudSelectVals.value[`${CrudEntName.value}${j.value}a`] = '';
|
console.log(crudSlots.value);
|
j.value++;
|
}
|
|
function crudDel(field) {
|
removeSchemaByFieldCrud([
|
`${CrudEntName.value}${field}a`,
|
`Switch${field}`,
|
`rSwitch${field}`,
|
`InputNumber${field}`,
|
`${field}`,
|
]);
|
crudSwSlots.value = crudSwSlots.value.filter((item) => item !== `crudSw${field}`);
|
crudrSwSlots.value = crudrSwSlots.value.filter((item) => item !== `crudrSw${field}`);
|
crudSlots.value = crudSlots.value.filter((item) => item !== `crudfac${field}`);
|
if (crudSlots.value.length == 0) {
|
j.value = 1;
|
}
|
delApiSelectOption(`${CrudEntName.value}${field}a`, 'crud');
|
delSelectOption(`${CrudEntName.value}${field}a`, 'crud');
|
delPSelectOption(`${CrudEntName.value}${field}a`, 'crud');
|
}
|
|
function goBack() {
|
// 本例的效果时点击返回始终跳转到账号列表页，实际应用时可返回上一页
|
go('/LowCodePage');
|
}
|
</script>
|
<style lang="less" scoped>
|
.high-form {
|
padding-bottom: 48px;
|
}
|
</style>
|
: { values: any[]; }: any: { values: any[]; }: any: { values: any[]; }: any: any: any: any: any:
|
any: any
|
