提交 49827866 编写于 作者: V vben

fix(form): fix updateSchema error #100

上级 81baf1d5
export { default as BasicForm } from './src/BasicForm.vue'; import BasicFormLib from './src/BasicForm.vue';
import { withInstall } from '../util';
export * from './src/types/form'; export * from './src/types/form';
export * from './src/types/formItem'; export * from './src/types/formItem';
export { useComponentRegister } from './src/hooks/useComponentRegister'; export { useComponentRegister } from './src/hooks/useComponentRegister';
export { useForm } from './src/hooks/useForm'; export { useForm } from './src/hooks/useForm';
export const BasicForm = withInstall(BasicFormLib);
...@@ -16,6 +16,7 @@ ...@@ -16,6 +16,7 @@
</template> </template>
</FormItem> </FormItem>
</template> </template>
<FormAction <FormAction
v-bind="{ ...getActionPropsRef, ...advanceState }" v-bind="{ ...getActionPropsRef, ...advanceState }"
@toggle-advanced="handleToggleAdvanced" @toggle-advanced="handleToggleAdvanced"
...@@ -30,7 +31,17 @@ ...@@ -30,7 +31,17 @@
import type { Ref, WatchStopHandle } from 'vue'; import type { Ref, WatchStopHandle } from 'vue';
import type { ValidateFields } from 'ant-design-vue/lib/form/interface'; import type { ValidateFields } from 'ant-design-vue/lib/form/interface';
import { defineComponent, reactive, ref, computed, unref, toRef, onMounted, watch } from 'vue'; import {
defineComponent,
reactive,
ref,
computed,
unref,
toRef,
onMounted,
watch,
toRefs,
} from 'vue';
import { Form, Row } from 'ant-design-vue'; import { Form, Row } from 'ant-design-vue';
import FormItem from './FormItem'; import FormItem from './FormItem';
import { basicProps } from './props'; import { basicProps } from './props';
...@@ -103,6 +114,7 @@ ...@@ -103,6 +114,7 @@
const schemas: FormSchema[] = unref(schemaRef) || (unref(getProps).schemas as any); const schemas: FormSchema[] = unref(schemaRef) || (unref(getProps).schemas as any);
for (const schema of schemas) { for (const schema of schemas) {
const { defaultValue, component } = schema; const { defaultValue, component } = schema;
// handle date type
if (defaultValue && dateItemType.includes(component)) { if (defaultValue && dateItemType.includes(component)) {
if (!Array.isArray(defaultValue)) { if (!Array.isArray(defaultValue)) {
schema.defaultValue = moment(defaultValue); schema.defaultValue = moment(defaultValue);
...@@ -127,10 +139,10 @@ ...@@ -127,10 +139,10 @@
formModel, formModel,
defaultValueRef, defaultValueRef,
}); });
const { transformDateFunc, fieldMapToTime } = toRefs(props);
const { handleFormValues, initDefault } = useFormValues({ const { handleFormValues, initDefault } = useFormValues({
transformDateFuncRef: toRef(props, 'transformDateFunc') as Ref<Fn<any>>, transformDateFuncRef: transformDateFunc as Ref<Fn<any>>,
fieldMapToTimeRef: toRef(props, 'fieldMapToTime'), fieldMapToTimeRef: fieldMapToTime,
defaultValueRef, defaultValueRef,
getSchema, getSchema,
formModel, formModel,
......
...@@ -7,28 +7,17 @@ import { BasicArrow } from '/@/components/Basic/index'; ...@@ -7,28 +7,17 @@ import { BasicArrow } from '/@/components/Basic/index';
import { getSlot } from '/@/utils/helper/tsxHelper'; import { getSlot } from '/@/utils/helper/tsxHelper';
import { useI18n } from '/@/hooks/web/useI18n'; import { useI18n } from '/@/hooks/web/useI18n';
import { propTypes } from '/@/utils/propTypes';
const { t } = useI18n('component.form'); const { t } = useI18n('component.form');
export default defineComponent({ export default defineComponent({
name: 'BasicFormAction', name: 'BasicFormAction',
props: { props: {
show: { show: propTypes.bool.def(true),
type: Boolean, showResetButton: propTypes.bool.def(true),
default: true, showSubmitButton: propTypes.bool.def(true),
}, showAdvancedButton: propTypes.bool.def(true),
showResetButton: {
type: Boolean,
default: true,
},
showSubmitButton: {
type: Boolean,
default: true,
},
showAdvancedButton: {
type: Boolean,
default: true,
},
resetButtonOptions: { resetButtonOptions: {
type: Object as PropType<any>, type: Object as PropType<any>,
default: {}, default: {},
...@@ -41,18 +30,9 @@ export default defineComponent({ ...@@ -41,18 +30,9 @@ export default defineComponent({
type: Object as PropType<any>, type: Object as PropType<any>,
default: {}, default: {},
}, },
actionSpan: { actionSpan: propTypes.number.def(6),
type: Number, isAdvanced: propTypes.bool,
default: 6, hideAdvanceBtn: propTypes.bool,
},
isAdvanced: {
type: Boolean,
default: false,
},
hideAdvanceBtn: {
type: Boolean,
default: false,
},
}, },
emits: ['toggle-advanced'], emits: ['toggle-advanced'],
setup(props, { slots, emit }) { setup(props, { slots, emit }) {
...@@ -87,27 +67,13 @@ export default defineComponent({ ...@@ -87,27 +67,13 @@ export default defineComponent({
emit('toggle-advanced'); emit('toggle-advanced');
} }
return () => { function renderAdvanceButton() {
if (!props.show) { const { showAdvancedButton, hideAdvanceBtn, isAdvanced } = props;
return;
}
const {
showAdvancedButton,
hideAdvanceBtn,
isAdvanced,
showResetButton,
showSubmitButton,
} = props;
if (!showAdvancedButton || !!hideAdvanceBtn) {
return null;
}
return ( return (
<Col {...unref(actionColOpt)} style={{ textAlign: 'right' }}>
{() => (
<Form.Item>
{() => (
<>
{getSlot(slots, 'advanceBefore')}
{showAdvancedButton && !hideAdvanceBtn && (
<Button type="default" class="mr-2" onClick={toggleAdvanced}> <Button type="default" class="mr-2" onClick={toggleAdvanced}>
{() => ( {() => (
<> <>
...@@ -116,21 +82,52 @@ export default defineComponent({ ...@@ -116,21 +82,52 @@ export default defineComponent({
</> </>
)} )}
</Button> </Button>
)} );
}
{getSlot(slots, 'resetBefore')} function renderResetButton() {
{showResetButton && ( const { showResetButton } = props;
if (!showResetButton) {
return null;
}
return (
<Button type="default" class="mr-2" {...unref(getResetBtnOptionsRef)}> <Button type="default" class="mr-2" {...unref(getResetBtnOptionsRef)}>
{() => unref(getResetBtnOptionsRef).text} {() => unref(getResetBtnOptionsRef).text}
</Button> </Button>
)} );
}
{getSlot(slots, 'submitBefore')} function renderSubmitButton() {
{showSubmitButton && ( const { showSubmitButton } = props;
if (!showSubmitButton) {
return null;
}
return (
<Button type="primary" {...unref(getSubmitBtnOptionsRef)}> <Button type="primary" {...unref(getSubmitBtnOptionsRef)}>
{() => unref(getSubmitBtnOptionsRef).text} {() => unref(getSubmitBtnOptionsRef).text}
</Button> </Button>
)} );
}
return () => {
if (!props.show) {
return null;
}
return (
<Col {...unref(actionColOpt)} style={{ textAlign: 'right' }}>
{() => (
<Form.Item>
{() => (
<>
{getSlot(slots, 'advanceBefore')}
{renderAdvanceButton()}
{getSlot(slots, 'resetBefore')}
{renderResetButton()}
{getSlot(slots, 'submitBefore')}
{renderSubmitButton()}
{getSlot(slots, 'submitAfter')} {getSlot(slots, 'submitAfter')}
</> </>
......
...@@ -5,7 +5,7 @@ import { TableActionType } from '/@/components/Table'; ...@@ -5,7 +5,7 @@ import { TableActionType } from '/@/components/Table';
export const basicProps = { export const basicProps = {
model: { model: {
type: Object as PropType<any>, type: Object as PropType<Record<string, any>>,
default: {}, default: {},
}, },
// 标签宽度 固定宽度 // 标签宽度 固定宽度
......
...@@ -13,7 +13,9 @@ import modules from 'globby!/@/router/menus/modules/**/*.@(ts)'; ...@@ -13,7 +13,9 @@ import modules from 'globby!/@/router/menus/modules/**/*.@(ts)';
const menuModules: MenuModule[] = []; const menuModules: MenuModule[] = [];
Object.keys(modules).forEach((key) => { Object.keys(modules).forEach((key) => {
menuModules.push(modules[key]); const moduleItem = modules[key];
const menuModule = Array.isArray(moduleItem) ? [...moduleItem] : [moduleItem];
menuModules.push(...menuModule);
}); });
// =========================== // ===========================
...@@ -25,6 +27,7 @@ const staticMenus: Menu[] = []; ...@@ -25,6 +27,7 @@ const staticMenus: Menu[] = [];
menuModules.sort((a, b) => { menuModules.sort((a, b) => {
return (a.orderNo || 0) - (b.orderNo || 0); return (a.orderNo || 0) - (b.orderNo || 0);
}); });
for (const menu of menuModules) { for (const menu of menuModules) {
staticMenus.push(transformMenuModule(menu)); staticMenus.push(transformMenuModule(menu));
} }
......
import type { MenuModule } from '/@/router/types.d'; import type { MenuModule } from '/@/router/types.d';
const menu: MenuModule = { const menu: MenuModule[] = [
{
orderNo: 0,
menu: {
path: '/dashboard/welcome',
name: 'routes.dashboard.welcome',
},
},
{
orderNo: 10, orderNo: 10,
menu: { menu: {
name: 'routes.dashboard.dashboard', name: 'routes.dashboard.dashboard',
...@@ -14,11 +22,12 @@ const menu: MenuModule = { ...@@ -14,11 +22,12 @@ const menu: MenuModule = {
path: '/analysis', path: '/analysis',
name: 'routes.dashboard.analysis', name: 'routes.dashboard.analysis',
}, },
{ // {
path: '/welcome', // path: '/welcome',
name: 'routes.dashboard.welcome', // name: 'routes.dashboard.welcome',
}, // },
], ],
}, },
}; },
];
export default menu; export default menu;
...@@ -7,7 +7,7 @@ const dashboard: AppRouteModule = { ...@@ -7,7 +7,7 @@ const dashboard: AppRouteModule = {
path: '/dashboard', path: '/dashboard',
name: 'Dashboard', name: 'Dashboard',
component: PAGE_LAYOUT_COMPONENT, component: PAGE_LAYOUT_COMPONENT,
redirect: '/dashboard/workbench', redirect: '/dashboard/welcome',
meta: { meta: {
icon: 'ant-design:home-outlined', icon: 'ant-design:home-outlined',
title: 'routes.dashboard.dashboard', title: 'routes.dashboard.dashboard',
...@@ -21,6 +21,8 @@ const dashboard: AppRouteModule = { ...@@ -21,6 +21,8 @@ const dashboard: AppRouteModule = {
component: () => import('/@/views/dashboard/welcome/index.vue'), component: () => import('/@/views/dashboard/welcome/index.vue'),
meta: { meta: {
title: 'routes.dashboard.welcome', title: 'routes.dashboard.welcome',
affix: true,
icon: 'ant-design:home-outlined',
}, },
}, },
{ {
...@@ -29,7 +31,6 @@ const dashboard: AppRouteModule = { ...@@ -29,7 +31,6 @@ const dashboard: AppRouteModule = {
component: () => import('/@/views/dashboard/workbench/index.vue'), component: () => import('/@/views/dashboard/workbench/index.vue'),
meta: { meta: {
title: 'routes.dashboard.workbench', title: 'routes.dashboard.workbench',
affix: true,
}, },
}, },
{ {
......
export const timestamp = () => +Date.now(); export const timestamp = () => +Date.now();
import { isObject } from '/@/utils/is';
export const clamp = (n: number, min: number, max: number) => Math.min(max, Math.max(min, n)); export const clamp = (n: number, min: number, max: number) => Math.min(max, Math.max(min, n));
export const noop = () => {}; export const noop = () => {};
export const now = () => Date.now(); export const now = () => Date.now();
...@@ -40,10 +41,7 @@ export function setObjToUrlParams(baseUrl: string, obj: any): string { ...@@ -40,10 +41,7 @@ export function setObjToUrlParams(baseUrl: string, obj: any): string {
export function deepMerge<T = any>(src: any, target: any): T { export function deepMerge<T = any>(src: any, target: any): T {
let key: string; let key: string;
for (key in target) { for (key in target) {
src[key] = src[key] = isObject(src[key]) ? deepMerge(src[key], target[key]) : (src[key] = target[key]);
src[key] && src[key].toString() === '[object Object]'
? deepMerge(src[key], target[key])
: (src[key] = target[key]);
} }
return src; return src;
} }
......
...@@ -89,7 +89,7 @@ const viteConfig: UserConfig = { ...@@ -89,7 +89,7 @@ const viteConfig: UserConfig = {
* Transpile target for esbuild. * Transpile target for esbuild.
* @default 'es2020' * @default 'es2020'
*/ */
esbuildTarget: 'es2020', esbuildTarget: 'es2019',
/** /**
* Whether to log asset info to console * Whether to log asset info to console
* @default false * @default false
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册