refactor: playground use antdv-next
parent
1ec058cbe3
commit
350d5ee60e
|
|
@ -136,8 +136,8 @@ const PreviewGroup = defineAsyncComponent(() =>
|
|||
import('antdv-next/dist/image/index').then((res) => res.ImagePreviewGroup),
|
||||
);
|
||||
|
||||
const withDefaultPlaceholder = <T extends Component>(
|
||||
component: T,
|
||||
const withDefaultPlaceholder = (
|
||||
component: Component,
|
||||
type: 'input' | 'select',
|
||||
componentProps: Recordable<any> = {},
|
||||
) => {
|
||||
|
|
|
|||
|
|
@ -48,7 +48,7 @@
|
|||
"@vben/types": "workspace:*",
|
||||
"@vben/utils": "workspace:*",
|
||||
"@vueuse/core": "catalog:",
|
||||
"ant-design-vue": "catalog:",
|
||||
"antdv-next": "catalog:",
|
||||
"dayjs": "catalog:",
|
||||
"json-bigint": "catalog:",
|
||||
"pinia": "catalog:",
|
||||
|
|
|
|||
|
|
@ -18,6 +18,7 @@ import type {
|
|||
MentionsProps,
|
||||
RadioGroupProps,
|
||||
RadioProps,
|
||||
RangePickerProps,
|
||||
RateProps,
|
||||
SelectProps,
|
||||
SpaceProps,
|
||||
|
|
@ -28,8 +29,7 @@ import type {
|
|||
UploadChangeParam,
|
||||
UploadFile,
|
||||
UploadProps,
|
||||
} from 'ant-design-vue';
|
||||
import type { RangePickerProps } from 'ant-design-vue/es/date-picker';
|
||||
} from 'antdv-next';
|
||||
|
||||
import type { Component, Ref } from 'vue';
|
||||
|
||||
|
|
@ -72,7 +72,7 @@ import { isEmpty } from '@vben/utils';
|
|||
|
||||
import { VbenCollapsibleParams } from '@vben-core/shadcn-ui';
|
||||
|
||||
import { message, Modal, notification } from 'ant-design-vue';
|
||||
import { message, Modal, notification } from 'antdv-next';
|
||||
|
||||
import { upload_file } from '#/api/examples/upload';
|
||||
type AdapterUploadProps = UploadProps & {
|
||||
|
|
@ -86,60 +86,72 @@ type AdapterUploadProps = UploadProps & {
|
|||
};
|
||||
|
||||
const AutoComplete = defineAsyncComponent(
|
||||
() => import('ant-design-vue/es/auto-complete'),
|
||||
() => import('antdv-next/dist/auto-complete/index'),
|
||||
);
|
||||
const Button = defineAsyncComponent(
|
||||
() => import('antdv-next/dist/button/index'),
|
||||
);
|
||||
const Button = defineAsyncComponent(() => import('ant-design-vue/es/button'));
|
||||
const Checkbox = defineAsyncComponent(
|
||||
() => import('ant-design-vue/es/checkbox'),
|
||||
() => import('antdv-next/dist/checkbox/index'),
|
||||
);
|
||||
const CheckboxGroup = defineAsyncComponent(() =>
|
||||
import('ant-design-vue/es/checkbox').then((res) => res.CheckboxGroup),
|
||||
import('antdv-next/dist/checkbox/index').then((res) => res.CheckboxGroup),
|
||||
);
|
||||
const DatePicker = defineAsyncComponent(
|
||||
() => import('ant-design-vue/es/date-picker'),
|
||||
() => import('antdv-next/dist/date-picker/index'),
|
||||
);
|
||||
const Divider = defineAsyncComponent(() => import('ant-design-vue/es/divider'));
|
||||
const Input = defineAsyncComponent(() => import('ant-design-vue/es/input'));
|
||||
const Divider = defineAsyncComponent(
|
||||
() => import('antdv-next/dist/divider/index'),
|
||||
);
|
||||
const Input = defineAsyncComponent(() => import('antdv-next/dist/input/index'));
|
||||
const InputNumber = defineAsyncComponent(
|
||||
() => import('ant-design-vue/es/input-number'),
|
||||
() => import('antdv-next/dist/input-number/index'),
|
||||
);
|
||||
const InputPassword = defineAsyncComponent(() =>
|
||||
import('ant-design-vue/es/input').then((res) => res.InputPassword),
|
||||
import('antdv-next/dist/input/index').then((res) => res.InputPassword),
|
||||
);
|
||||
const Mentions = defineAsyncComponent(
|
||||
() => import('ant-design-vue/es/mentions'),
|
||||
() => import('antdv-next/dist/mentions/index'),
|
||||
);
|
||||
const Radio = defineAsyncComponent(() => import('ant-design-vue/es/radio'));
|
||||
const Radio = defineAsyncComponent(() => import('antdv-next/dist/radio/index'));
|
||||
const RadioGroup = defineAsyncComponent(() =>
|
||||
import('ant-design-vue/es/radio').then((res) => res.RadioGroup),
|
||||
import('antdv-next/dist/radio/index').then((res) => res.RadioGroup),
|
||||
);
|
||||
const RangePicker = defineAsyncComponent(() =>
|
||||
import('ant-design-vue/es/date-picker').then((res) => res.RangePicker),
|
||||
import('antdv-next/dist/date-picker/index').then(
|
||||
(res) => res.DateRangePicker,
|
||||
),
|
||||
);
|
||||
const Rate = defineAsyncComponent(() => import('ant-design-vue/es/rate'));
|
||||
const Select = defineAsyncComponent(() => import('ant-design-vue/es/select'));
|
||||
const Space = defineAsyncComponent(() => import('ant-design-vue/es/space'));
|
||||
const Switch = defineAsyncComponent(() => import('ant-design-vue/es/switch'));
|
||||
const Textarea = defineAsyncComponent(() =>
|
||||
import('ant-design-vue/es/input').then((res) => res.Textarea),
|
||||
const Rate = defineAsyncComponent(() => import('antdv-next/dist/rate/index'));
|
||||
const Select = defineAsyncComponent(
|
||||
() => import('antdv-next/dist/select/index'),
|
||||
);
|
||||
const Space = defineAsyncComponent(() => import('antdv-next/dist/space/index'));
|
||||
const Switch = defineAsyncComponent(
|
||||
() => import('antdv-next/dist/switch/index'),
|
||||
);
|
||||
const Textarea = defineAsyncComponent(
|
||||
() => import('antdv-next/dist/input/TextArea'),
|
||||
);
|
||||
const TimePicker = defineAsyncComponent(
|
||||
() => import('ant-design-vue/es/time-picker'),
|
||||
() => import('antdv-next/dist/time-picker/index'),
|
||||
);
|
||||
const TreeSelect = defineAsyncComponent(
|
||||
() => import('ant-design-vue/es/tree-select'),
|
||||
() => import('antdv-next/dist/tree-select/index'),
|
||||
);
|
||||
const Cascader = defineAsyncComponent(
|
||||
() => import('ant-design-vue/es/cascader'),
|
||||
() => import('antdv-next/dist/cascader/index'),
|
||||
);
|
||||
const Upload = defineAsyncComponent(() => import('ant-design-vue/es/upload'));
|
||||
const Image = defineAsyncComponent(() => import('ant-design-vue/es/image'));
|
||||
const Upload = defineAsyncComponent(
|
||||
() => import('antdv-next/dist/upload/index'),
|
||||
);
|
||||
const Image = defineAsyncComponent(() => import('antdv-next/dist/image/index'));
|
||||
const PreviewGroup = defineAsyncComponent(() =>
|
||||
import('ant-design-vue/es/image').then((res) => res.ImagePreviewGroup),
|
||||
import('antdv-next/dist/image/index').then((res) => res.ImagePreviewGroup),
|
||||
);
|
||||
|
||||
const withDefaultPlaceholder = <T extends Component>(
|
||||
component: T,
|
||||
const withDefaultPlaceholder = (
|
||||
component: Component,
|
||||
type: 'input' | 'select',
|
||||
componentProps: Recordable<any> = {},
|
||||
) => {
|
||||
|
|
@ -242,7 +254,7 @@ function getBase64(file: File): Promise<string> {
|
|||
*/
|
||||
async function previewImage(
|
||||
file: UploadFile,
|
||||
visible: Ref<boolean>,
|
||||
open: Ref<boolean>,
|
||||
fileList: Ref<UploadProps['fileList']>,
|
||||
) {
|
||||
// 非图片文件直接打开链接
|
||||
|
|
@ -250,6 +262,8 @@ async function previewImage(
|
|||
const url = file.url || file.preview;
|
||||
if (url) {
|
||||
window.open(url, '_blank');
|
||||
} else if (file.preview) {
|
||||
window.open(file.preview, '_blank');
|
||||
} else {
|
||||
message.error($t('ui.formRules.previewWarning'));
|
||||
}
|
||||
|
|
@ -285,10 +299,10 @@ async function previewImage(
|
|||
{
|
||||
class: 'hidden',
|
||||
preview: {
|
||||
visible: visible.value,
|
||||
open: open.value,
|
||||
current: currentIndex,
|
||||
onVisibleChange: (value: boolean) => {
|
||||
visible.value = value;
|
||||
onOpenChange: (value: boolean) => {
|
||||
open.value = value;
|
||||
if (!value) {
|
||||
setTimeout(() => {
|
||||
if (!isUnmounted && container) {
|
||||
|
|
@ -330,7 +344,7 @@ function cropImage(file: File, aspectRatio: string | undefined) {
|
|||
const open = ref<boolean>(true);
|
||||
const cropperRef = ref<InstanceType<typeof VCropper> | null>(null);
|
||||
|
||||
const closeModal = () => {
|
||||
function closeModal() {
|
||||
open.value = false;
|
||||
setTimeout(() => {
|
||||
if (!isUnmounted && container) {
|
||||
|
|
@ -342,7 +356,7 @@ function cropImage(file: File, aspectRatio: string | undefined) {
|
|||
container.remove();
|
||||
}
|
||||
}, 300);
|
||||
};
|
||||
}
|
||||
|
||||
const CropperWrapper = {
|
||||
setup() {
|
||||
|
|
@ -416,7 +430,7 @@ function cropImage(file: File, aspectRatio: string | undefined) {
|
|||
/**
|
||||
* 带预览功能的上传组件
|
||||
*/
|
||||
const withPreviewUpload = () => {
|
||||
function withPreviewUpload() {
|
||||
return defineComponent({
|
||||
name: Upload.name,
|
||||
emits: ['update:modelValue'],
|
||||
|
|
@ -436,10 +450,10 @@ const withPreviewUpload = () => {
|
|||
() => attrs?.aspectRatio ?? attrs?.['aspect-ratio'],
|
||||
);
|
||||
|
||||
const handleBeforeUpload = async (
|
||||
async function handleBeforeUpload(
|
||||
file: UploadFile,
|
||||
originFileList: Array<File>,
|
||||
) => {
|
||||
) {
|
||||
// 文件大小限制
|
||||
if (maxSize.value && (file.size || 0) / 1024 / 1024 > maxSize.value) {
|
||||
message.error($t('ui.formRules.sizeLimit', [maxSize.value]));
|
||||
|
|
@ -463,9 +477,9 @@ const withPreviewUpload = () => {
|
|||
}
|
||||
|
||||
return attrs.beforeUpload?.(file) ?? true;
|
||||
};
|
||||
}
|
||||
|
||||
const handleChange = (event: UploadChangeParam) => {
|
||||
function handleChange(event: UploadChangeParam) {
|
||||
try {
|
||||
attrs.handleChange?.(event);
|
||||
attrs.onHandleChange?.(event);
|
||||
|
|
@ -479,19 +493,19 @@ const withPreviewUpload = () => {
|
|||
'update:modelValue',
|
||||
event.fileList?.length ? fileList.value : undefined,
|
||||
);
|
||||
};
|
||||
}
|
||||
|
||||
const handlePreview = async (file: UploadFile) => {
|
||||
function handlePreview(file: UploadFile) {
|
||||
previewVisible.value = true;
|
||||
await previewImage(file, previewVisible, fileList);
|
||||
};
|
||||
return previewImage(file, previewVisible, fileList);
|
||||
}
|
||||
|
||||
const renderUploadButton = () => {
|
||||
function renderUploadButton() {
|
||||
if (attrs.disabled) return null;
|
||||
return isEmpty(slots)
|
||||
? createDefaultUploadSlots(listType, placeholder)
|
||||
: slots;
|
||||
};
|
||||
}
|
||||
|
||||
// 拖拽排序
|
||||
const draggable = computed(
|
||||
|
|
@ -600,7 +614,7 @@ const withPreviewUpload = () => {
|
|||
);
|
||||
},
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
// 这里需要自行根据业务组件库进行适配,需要用到的组件都需要在这里类型说明
|
||||
export type ComponentType =
|
||||
|
|
@ -681,13 +695,13 @@ async function initComponentAdapter() {
|
|||
fieldNames: { label: 'label', value: 'value', children: 'children' },
|
||||
loadingSlot: 'suffixIcon',
|
||||
modelPropName: 'value',
|
||||
visibleEvent: 'onVisibleChange',
|
||||
visibleEvent: 'onOpenChange',
|
||||
}),
|
||||
ApiSelect: withDefaultPlaceholder(ApiComponent, 'select', {
|
||||
component: Select,
|
||||
loadingSlot: 'suffixIcon',
|
||||
modelPropName: 'value',
|
||||
visibleEvent: 'onVisibleChange',
|
||||
visibleEvent: 'onOpenChange',
|
||||
}),
|
||||
ApiTreeSelect: withDefaultPlaceholder(ApiComponent, 'select', {
|
||||
component: TreeSelect,
|
||||
|
|
@ -695,7 +709,7 @@ async function initComponentAdapter() {
|
|||
loadingSlot: 'suffixIcon',
|
||||
modelPropName: 'value',
|
||||
optionsPropName: 'treeData',
|
||||
visibleEvent: 'onVisibleChange',
|
||||
visibleEvent: 'onOpenChange',
|
||||
}),
|
||||
AutoComplete,
|
||||
Cascader,
|
||||
|
|
@ -764,7 +778,7 @@ async function initComponentAdapter() {
|
|||
copyPreferencesSuccess: (title, content) => {
|
||||
notification.success({
|
||||
description: content,
|
||||
message: title,
|
||||
title,
|
||||
placement: 'bottomRight',
|
||||
});
|
||||
},
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ import {
|
|||
import { get, isFunction, isString } from '@vben/utils';
|
||||
|
||||
import { objectOmit } from '@vueuse/core';
|
||||
import { Button, Image, Popconfirm, Switch, Tag } from 'ant-design-vue';
|
||||
import { Button, Image, Popconfirm, Switch, Tag } from 'antdv-next';
|
||||
|
||||
import { $t } from '#/locales';
|
||||
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ import {
|
|||
import { useAccessStore } from '@vben/stores';
|
||||
import { cloneDeep } from '@vben/utils';
|
||||
|
||||
import { message } from 'ant-design-vue';
|
||||
import { message } from 'antdv-next';
|
||||
import JSONBigInt from 'json-bigint';
|
||||
|
||||
import { useAuthStore } from '#/store';
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
<script lang="ts" setup>
|
||||
import { computed } from 'vue';
|
||||
import { computed, watch } from 'vue';
|
||||
|
||||
import { useAntdDesignTokens } from '@vben/hooks';
|
||||
import { preferences, usePreferences } from '@vben/preferences';
|
||||
|
||||
import { App, ConfigProvider, theme } from 'ant-design-vue';
|
||||
import { App, ConfigProvider, theme } from 'antdv-next';
|
||||
|
||||
import { antdLocale } from '#/locales';
|
||||
|
||||
|
|
@ -28,6 +28,14 @@ const tokenTheme = computed(() => {
|
|||
token: tokens,
|
||||
};
|
||||
});
|
||||
|
||||
watch(
|
||||
tokenTheme,
|
||||
(themeConfig) => {
|
||||
ConfigProvider.config({ theme: themeConfig });
|
||||
},
|
||||
{ immediate: true },
|
||||
);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import type { Locale } from 'ant-design-vue/es/locale';
|
||||
import type { Locale } from 'antdv-next/dist/locale/index';
|
||||
|
||||
import type { App } from 'vue';
|
||||
|
||||
|
|
@ -13,8 +13,8 @@ import {
|
|||
} from '@vben/locales';
|
||||
import { preferences } from '@vben/preferences';
|
||||
|
||||
import antdEnLocale from 'ant-design-vue/es/locale/en_US';
|
||||
import antdDefaultLocale from 'ant-design-vue/es/locale/zh_CN';
|
||||
import antdEnLocale from 'antdv-next/dist/locale/en_US';
|
||||
import antdDefaultLocale from 'antdv-next/dist/locale/zh_CN';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
const antdLocale = ref<Locale>(antdDefaultLocale);
|
||||
|
|
|
|||
|
|
@ -29,4 +29,4 @@ async function initApplication() {
|
|||
unmountGlobalLoading();
|
||||
}
|
||||
|
||||
initApplication();
|
||||
void initApplication();
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import type {
|
|||
import { generateAccessible } from '@vben/access';
|
||||
import { preferences } from '@vben/preferences';
|
||||
|
||||
import { message } from 'ant-design-vue';
|
||||
import { message } from 'antdv-next';
|
||||
|
||||
import { getAllMenusApi } from '#/api';
|
||||
import { BasicLayout, IFrameView } from '#/layouts';
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ import { LOGIN_PATH } from '@vben/constants';
|
|||
import { preferences } from '@vben/preferences';
|
||||
import { resetAllStores, useAccessStore, useUserStore } from '@vben/stores';
|
||||
|
||||
import { notification } from 'ant-design-vue';
|
||||
import { notification } from 'antdv-next';
|
||||
import { defineStore } from 'pinia';
|
||||
|
||||
import { getAccessCodesApi, getUserInfoApi, loginApi, logoutApi } from '#/api';
|
||||
|
|
@ -65,7 +65,7 @@ export const useAuthStore = defineStore('auth', () => {
|
|||
notification.success({
|
||||
description: `${$t('authentication.loginSuccessDesc')}:${userInfo?.realName}`,
|
||||
duration: 3,
|
||||
message: $t('authentication.loginSuccess'),
|
||||
title: $t('authentication.loginSuccess'),
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ import { computed, ref, useTemplateRef } from 'vue';
|
|||
import { AuthenticationCodeLogin, z } from '@vben/common-ui';
|
||||
import { $t } from '@vben/locales';
|
||||
|
||||
import { message } from 'ant-design-vue';
|
||||
import { message } from 'antdv-next';
|
||||
|
||||
defineOptions({ name: 'CodeLogin' });
|
||||
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import { computed } from 'vue';
|
|||
|
||||
import { ProfilePasswordSetting, z } from '@vben/common-ui';
|
||||
|
||||
import { message } from 'ant-design-vue';
|
||||
import { message } from 'antdv-next';
|
||||
|
||||
const formSchema = computed((): VbenFormSchema[] => {
|
||||
return [
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ import { AccessControl, useAccess } from '@vben/access';
|
|||
import { Page } from '@vben/common-ui';
|
||||
import { resetAllStores, useUserStore } from '@vben/stores';
|
||||
|
||||
import { Button, Card } from 'ant-design-vue';
|
||||
import { Button, Card } from 'antdv-next';
|
||||
|
||||
import { useAuthStore } from '#/store';
|
||||
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ import { useAccess } from '@vben/access';
|
|||
import { Page } from '@vben/common-ui';
|
||||
import { resetAllStores, useUserStore } from '@vben/stores';
|
||||
|
||||
import { Button, Card } from 'ant-design-vue';
|
||||
import { Button, Card } from 'antdv-next';
|
||||
|
||||
import { useAuthStore } from '#/store';
|
||||
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ import { useAccessStore } from '@vben/stores';
|
|||
|
||||
import { MenuBadge } from '@vben-core/menu-ui';
|
||||
|
||||
import { Button, Card, Radio, RadioGroup } from 'ant-design-vue';
|
||||
import { Button, Card, Radio, RadioGroup } from 'antdv-next';
|
||||
|
||||
import { useVbenForm } from '#/adapter/form';
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { useRouter } from 'vue-router';
|
|||
|
||||
import { Fallback } from '@vben/common-ui';
|
||||
|
||||
import { Button } from 'ant-design-vue';
|
||||
import { Button } from 'antdv-next';
|
||||
|
||||
const router = useRouter();
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { useRouter } from 'vue-router';
|
|||
|
||||
import { Fallback } from '@vben/common-ui';
|
||||
|
||||
import { Button } from 'ant-design-vue';
|
||||
import { Button } from 'antdv-next';
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import { ref } from 'vue';
|
|||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { useClipboard } from '@vueuse/core';
|
||||
import { Button, Card, Input } from 'ant-design-vue';
|
||||
import { Button, Card, Input } from 'antdv-next';
|
||||
|
||||
const source = ref('Hello');
|
||||
const { copy, text } = useClipboard({ legacy: true, source });
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ import {
|
|||
downloadFileFromUrl,
|
||||
} from '@vben/utils';
|
||||
|
||||
import { Button, Card } from 'ant-design-vue';
|
||||
import { Button, Card } from 'antdv-next';
|
||||
|
||||
import { downloadFile1, downloadFile2 } from '#/api/examples/download';
|
||||
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import { ref } from 'vue';
|
|||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { useFullscreen } from '@vueuse/core';
|
||||
import { Button, Card } from 'ant-design-vue';
|
||||
import { Button, Card } from 'antdv-next';
|
||||
|
||||
const domRef = ref<HTMLElement>();
|
||||
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@ import {
|
|||
SvgWeChatIcon,
|
||||
} from '@vben/icons';
|
||||
|
||||
import { Card, Input } from 'ant-design-vue';
|
||||
import { Card, Input } from 'antdv-next';
|
||||
|
||||
const iconValue1 = ref('ant-design:trademark-outlined');
|
||||
const iconValue2 = ref('svg:avatar-1');
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { ref } from 'vue';
|
|||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { Alert, Button, Card } from 'ant-design-vue';
|
||||
import { Alert, Button, Card } from 'antdv-next';
|
||||
|
||||
import { getBigIntData } from '#/api/examples/json-bigint';
|
||||
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import type { LoginExpiredModeType } from '@vben/types';
|
|||
import { Page } from '@vben/common-ui';
|
||||
import { preferences, updatePreferences } from '@vben/preferences';
|
||||
|
||||
import { Button, Card } from 'ant-design-vue';
|
||||
import { Button, Card } from 'antdv-next';
|
||||
|
||||
import { getMockStatusApi } from '#/api';
|
||||
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ import {
|
|||
updateCustomPreferences,
|
||||
} from '@vben/preferences';
|
||||
|
||||
import { Alert, Button, Card, Space, Tag } from 'ant-design-vue';
|
||||
import { Alert, Button, Card, Space, Tag } from 'antdv-next';
|
||||
|
||||
import { $t } from '#/locales';
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { computed, ref, watchEffect } from 'vue';
|
|||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { Card, Radio, RadioGroup } from 'ant-design-vue';
|
||||
import { Card, Radio, RadioGroup } from 'antdv-next';
|
||||
|
||||
import { getParamsData } from '#/api/examples/params';
|
||||
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import { useRouter } from 'vue-router';
|
|||
import { Page } from '@vben/common-ui';
|
||||
import { useTabs } from '@vben/hooks';
|
||||
|
||||
import { Button, Card, Input } from 'ant-design-vue';
|
||||
import { Button, Card, Input } from 'antdv-next';
|
||||
|
||||
const router = useRouter();
|
||||
const newTabTitle = ref('');
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { refAutoReset } from '@vueuse/core';
|
||||
import { Button, Card, Empty } from 'ant-design-vue';
|
||||
import { Button, Card, Empty } from 'antdv-next';
|
||||
|
||||
import ConcurrencyCaching from './concurrency-caching.vue';
|
||||
import InfiniteQueries from './infinite-queries.vue';
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
import type { IProducts } from './typing';
|
||||
|
||||
import { useInfiniteQuery } from '@tanstack/vue-query';
|
||||
import { Button } from 'ant-design-vue';
|
||||
import { Button } from 'antdv-next';
|
||||
|
||||
const LIMIT = 10;
|
||||
const fetchProducts = async ({ pageParam = 0 }): Promise<IProducts> => {
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import type { IProducts } from './typing';
|
|||
import { ref } from 'vue';
|
||||
|
||||
import { keepPreviousData, useQuery } from '@tanstack/vue-query';
|
||||
import { Button } from 'ant-design-vue';
|
||||
import { Button } from 'antdv-next';
|
||||
|
||||
const LIMIT = 10;
|
||||
const fetcher = async (page: Ref<number>): Promise<IProducts> => {
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
import { ref } from 'vue';
|
||||
|
||||
import { useQuery } from '@tanstack/vue-query';
|
||||
import { Button } from 'ant-design-vue';
|
||||
import { Button } from 'antdv-next';
|
||||
|
||||
const count = ref(-1);
|
||||
async function fetchApi() {
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
import { Page } from '@vben/common-ui';
|
||||
import { useWatermark } from '@vben/hooks';
|
||||
|
||||
import { Button, Card } from 'ant-design-vue';
|
||||
import { Button, Card } from 'antdv-next';
|
||||
|
||||
const { destroyWatermark, updateWatermark, watermark } = useWatermark();
|
||||
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@ import {
|
|||
} from '@vben/common-ui';
|
||||
import { LoaderCircle, Square, SquareCheckBig } from '@vben/icons';
|
||||
|
||||
import { Button, Card, message } from 'ant-design-vue';
|
||||
import { Button, Card, message } from 'antdv-next';
|
||||
|
||||
import { useVbenForm } from '#/adapter/form';
|
||||
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import { reactive, ref } from 'vue';
|
|||
|
||||
import { Page, PointSelectionCaptcha } from '@vben/common-ui';
|
||||
|
||||
import { Card, Input, InputNumber, message, Switch } from 'ant-design-vue';
|
||||
import { Card, Input, InputNumber, message, Switch } from 'antdv-next';
|
||||
|
||||
import { $t } from '#/locales';
|
||||
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ import { ref } from 'vue';
|
|||
import { Page, SliderCaptcha } from '@vben/common-ui';
|
||||
import { Bell, Sun } from '@vben/icons';
|
||||
|
||||
import { Button, Card, message } from 'ant-design-vue';
|
||||
import { Button, Card, message } from 'antdv-next';
|
||||
|
||||
function handleSuccess(data: CaptchaVerifyPassingData) {
|
||||
const { time } = data;
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import { Page, SliderRotateCaptcha } from '@vben/common-ui';
|
|||
import { preferences } from '@vben/preferences';
|
||||
import { useUserStore } from '@vben/stores';
|
||||
|
||||
import { Card, message } from 'ant-design-vue';
|
||||
import { Card, message } from 'antdv-next';
|
||||
|
||||
const userStore = useUserStore();
|
||||
function handleSuccess() {
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<script setup lang="ts">
|
||||
import { Page, SliderTranslateCaptcha } from '@vben/common-ui';
|
||||
|
||||
import { Card, message } from 'ant-design-vue';
|
||||
import { Card, message } from 'antdv-next';
|
||||
|
||||
function handleSuccess() {
|
||||
message.success('success!');
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { Page } from '@vben/common-ui';
|
|||
|
||||
import { VbenContextMenu } from '@vben-core/shadcn-ui';
|
||||
|
||||
import { Button, Card, message } from 'ant-design-vue';
|
||||
import { Button, Card, message } from 'antdv-next';
|
||||
|
||||
const needHidden = (role: string) => {
|
||||
return role === 'user';
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@ import {
|
|||
Row,
|
||||
Select,
|
||||
Switch,
|
||||
} from 'ant-design-vue';
|
||||
} from 'antdv-next';
|
||||
|
||||
const props = reactive<CountToProps & { transition: TransitionPresets }>({
|
||||
decimal: '.',
|
||||
|
|
@ -150,15 +150,10 @@ function onFinished() {
|
|||
</Col>
|
||||
<Col :span="8">
|
||||
<FormItem label="动画" name="transition">
|
||||
<Select v-model:value="props.transition">
|
||||
<Select.Option
|
||||
v-for="preset in TransitionPresetsKeys"
|
||||
:key="preset"
|
||||
:value="preset"
|
||||
>
|
||||
{{ preset }}
|
||||
</Select.Option>
|
||||
</Select>
|
||||
<Select
|
||||
v-model:value="props.transition"
|
||||
:options="TransitionPresetsKeys.map((p) => ({ label: p, value: p }))"
|
||||
/>
|
||||
</FormItem>
|
||||
</Col>
|
||||
<Col :span="8">
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
<script lang="ts" setup>
|
||||
import type { UploadChangeParam } from 'ant-design-vue';
|
||||
import type { UploadChangeParam } from 'antdv-next';
|
||||
|
||||
import { ref } from 'vue';
|
||||
|
||||
import { Page, VCropper } from '@vben/common-ui';
|
||||
|
||||
import { Button, Card, Select, Upload } from 'ant-design-vue';
|
||||
import { Button, Card, Select, Upload } from 'antdv-next';
|
||||
|
||||
const options = [
|
||||
{ label: '1:1', value: '1:1' },
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
import { VBEN_DOC_URL } from '@vben/constants';
|
||||
import { openWindow } from '@vben/utils';
|
||||
|
||||
import { Button } from 'ant-design-vue';
|
||||
import { Button } from 'antdv-next';
|
||||
|
||||
const props = defineProps<{ path: string }>();
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { ref } from 'vue';
|
|||
|
||||
import { useVbenDrawer } from '@vben/common-ui';
|
||||
|
||||
import { Button, message } from 'ant-design-vue';
|
||||
import { Button, message } from 'antdv-next';
|
||||
|
||||
const list = ref<number[]>([]);
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<script lang="ts" setup>
|
||||
import { useVbenDrawer } from '@vben/common-ui';
|
||||
|
||||
import { Button, message } from 'ant-design-vue';
|
||||
import { Button, message } from 'antdv-next';
|
||||
|
||||
const [Drawer, drawerApi] = useVbenDrawer({
|
||||
onCancel() {
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<script lang="ts" setup>
|
||||
import { useVbenDrawer } from '@vben/common-ui';
|
||||
|
||||
import { Button, message } from 'ant-design-vue';
|
||||
import { Button, message } from 'antdv-next';
|
||||
|
||||
const [Drawer, drawerApi] = useVbenDrawer({
|
||||
onCancel() {
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { ref } from 'vue';
|
|||
|
||||
import { useVbenDrawer } from '@vben/common-ui';
|
||||
|
||||
import { Input, message } from 'ant-design-vue';
|
||||
import { Input, message } from 'antdv-next';
|
||||
|
||||
import { useVbenForm } from '#/adapter/form';
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import type { DrawerPlacement, DrawerState } from '@vben/common-ui';
|
|||
|
||||
import { Page, useVbenDrawer } from '@vben/common-ui';
|
||||
|
||||
import { Button, Card } from 'ant-design-vue';
|
||||
import { Button, Card } from 'antdv-next';
|
||||
|
||||
import DocButton from '../doc-button.vue';
|
||||
import AutoHeightDemo from './auto-height-demo.vue';
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { ref } from 'vue';
|
|||
|
||||
import { useVbenDrawer } from '@vben/common-ui';
|
||||
|
||||
import { message } from 'ant-design-vue';
|
||||
import { message } from 'antdv-next';
|
||||
|
||||
const data = ref();
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { ref } from 'vue';
|
|||
|
||||
import { EllipsisText, Page } from '@vben/common-ui';
|
||||
|
||||
import { Card } from 'ant-design-vue';
|
||||
import { Card } from 'antdv-next';
|
||||
|
||||
import DocButton from '../doc-button.vue';
|
||||
|
||||
|
|
|
|||
|
|
@ -1,11 +1,9 @@
|
|||
<script lang="ts" setup>
|
||||
import type { RefSelectProps } from 'ant-design-vue/es/select';
|
||||
|
||||
import { ref } from 'vue';
|
||||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { Button, Card, message, Space } from 'ant-design-vue';
|
||||
import { Button, Card, message, Space } from 'antdv-next';
|
||||
|
||||
import { useVbenForm } from '#/adapter/form';
|
||||
|
||||
|
|
@ -134,7 +132,9 @@ function handleClick(
|
|||
}
|
||||
case 'componentRef': {
|
||||
// 获取下拉组件的实例,并调用它的focus方法
|
||||
formApi.getFieldComponentRef<RefSelectProps>('fieldOptions')?.focus?.();
|
||||
formApi
|
||||
.getFieldComponentRef<{ focus?: () => void }>('fieldOptions')
|
||||
?.focus?.();
|
||||
break;
|
||||
}
|
||||
case 'disabled': {
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
<script lang="ts" setup>
|
||||
import type { UploadFile } from 'ant-design-vue';
|
||||
import type { UploadFile } from 'antdv-next';
|
||||
|
||||
import { h, ref, toRaw } from 'vue';
|
||||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { useDebounceFn } from '@vueuse/core';
|
||||
import { Button, Card, message, Spin, Tag } from 'ant-design-vue';
|
||||
import { Button, Card, message, Spin, Tag } from 'antdv-next';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
import { useVbenForm, z } from '#/adapter/form';
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<script lang="ts" setup>
|
||||
import type { RadioGroupProps } from 'ant-design-vue';
|
||||
import type { RadioGroupProps } from 'antdv-next';
|
||||
|
||||
import type { FormLayout } from '@vben/common-ui';
|
||||
|
||||
|
|
@ -11,7 +11,7 @@ import { Page } from '@vben/common-ui';
|
|||
|
||||
import { VbenCollapsibleParams } from '@vben-core/shadcn-ui';
|
||||
|
||||
import { Button, Card, message, RadioGroup } from 'ant-design-vue';
|
||||
import { Button, Card, message, RadioGroup } from 'antdv-next';
|
||||
|
||||
import { useVbenForm, z } from '#/adapter/form';
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { h } from 'vue';
|
|||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { Card } from 'ant-design-vue';
|
||||
import { Card } from 'antdv-next';
|
||||
|
||||
import { useVbenForm } from '#/adapter/form';
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { h, markRaw } from 'vue';
|
|||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { Card, Input, message } from 'ant-design-vue';
|
||||
import { Card, Input, message } from 'antdv-next';
|
||||
|
||||
import { useVbenForm, z } from '#/adapter/form';
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<script lang="ts" setup>
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { Button, Card, message } from 'ant-design-vue';
|
||||
import { Button, Card, message } from 'antdv-next';
|
||||
|
||||
import { useVbenForm } from '#/adapter/form';
|
||||
|
||||
|
|
|
|||
|
|
@ -1,9 +1,11 @@
|
|||
<script lang="ts" setup>
|
||||
import type { StepItem } from 'antdv-next';
|
||||
|
||||
import { ref } from 'vue';
|
||||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { Button, Card, message, Step, Steps, Switch } from 'ant-design-vue';
|
||||
import { Button, Card, message, Steps, Switch } from 'antdv-next';
|
||||
|
||||
import { useVbenForm } from '#/adapter/form';
|
||||
|
||||
|
|
@ -75,6 +77,7 @@ const [SecondForm, secondFormApi] = useVbenForm({
|
|||
],
|
||||
wrapperClass: 'grid-cols-1 md:grid-cols-1 lg:grid-cols-1',
|
||||
});
|
||||
const stepsItems: StepItem[] = [{ title: '表单1' }, { title: '表单2' }];
|
||||
const needMerge = ref(true);
|
||||
async function handleMergeSubmit() {
|
||||
const values = await firstFormApi
|
||||
|
|
@ -102,10 +105,7 @@ async function handleMergeSubmit() {
|
|||
<Button type="primary" @click="handleMergeSubmit">合并提交</Button>
|
||||
</template>
|
||||
<div class="mx-auto max-w-lg">
|
||||
<Steps :current="currentTab" class="steps">
|
||||
<Step title="表单1" />
|
||||
<Step title="表单2" />
|
||||
</Steps>
|
||||
<Steps :current="currentTab" :items="stepsItems" class="steps" />
|
||||
<div class="p-20">
|
||||
<FirstForm v-show="currentTab === 0" />
|
||||
<SecondForm v-show="currentTab === 1" />
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<script lang="ts" setup>
|
||||
import { Input, Select } from 'ant-design-vue';
|
||||
import { Input, Select } from 'antdv-next';
|
||||
|
||||
const emit = defineEmits(['blur', 'change']);
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<script lang="ts" setup>
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { Card, message } from 'ant-design-vue';
|
||||
import { Card, message } from 'antdv-next';
|
||||
|
||||
import { useVbenForm } from '#/adapter/form';
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<script lang="ts" setup>
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { Button, Card, message } from 'ant-design-vue';
|
||||
import { Button, Card, message } from 'antdv-next';
|
||||
|
||||
import { useVbenForm, z } from '#/adapter/form';
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { ref } from 'vue';
|
|||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { Button, Card, Switch } from 'ant-design-vue';
|
||||
import { Button, Card, Switch } from 'antdv-next';
|
||||
|
||||
import { useVbenForm } from '#/adapter/form';
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { computed, nextTick, onMounted, ref, watch } from 'vue';
|
|||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { Button, Card, message, Space, Tag } from 'ant-design-vue';
|
||||
import { Button, Card, message, Space, Tag } from 'antdv-next';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
import { useVbenForm } from '#/adapter/form';
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import type { JsonViewerAction, JsonViewerValue } from '@vben/common-ui';
|
|||
|
||||
import { JsonViewer, Page } from '@vben/common-ui';
|
||||
|
||||
import { Card, message } from 'ant-design-vue';
|
||||
import { Card, message } from 'antdv-next';
|
||||
|
||||
import { json1, json2 } from './data';
|
||||
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@ import {
|
|||
Slider,
|
||||
Tag,
|
||||
Tooltip,
|
||||
} from 'ant-design-vue';
|
||||
} from 'antdv-next';
|
||||
|
||||
const props = reactive({
|
||||
leftCollapsedWidth: 5,
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { Loading, Page, Spinner } from '@vben/common-ui';
|
|||
import { IconifyIcon } from '@vben/icons';
|
||||
|
||||
import { refAutoReset } from '@vueuse/core';
|
||||
import { Button, Card, Spin } from 'ant-design-vue';
|
||||
import { Button, Card, Spin } from 'antdv-next';
|
||||
|
||||
const spinning = refAutoReset(false, 3000);
|
||||
const loading = refAutoReset(false, 3000);
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { ref } from 'vue';
|
|||
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
|
||||
import { Button, message } from 'ant-design-vue';
|
||||
import { Button, message } from 'antdv-next';
|
||||
|
||||
const list = ref<number[]>([]);
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<script lang="ts" setup>
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
|
||||
import { Button, message } from 'ant-design-vue';
|
||||
import { Button, message } from 'antdv-next';
|
||||
|
||||
const [Modal, modalApi] = useVbenModal({
|
||||
onCancel() {
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { ref, watch } from 'vue';
|
|||
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
|
||||
import { Slider } from 'ant-design-vue';
|
||||
import { Slider } from 'antdv-next';
|
||||
|
||||
const blur = ref(5);
|
||||
const [Modal, modalApi] = useVbenModal({
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<script lang="ts" setup>
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
|
||||
import { message } from 'ant-design-vue';
|
||||
import { message } from 'antdv-next';
|
||||
|
||||
const [Modal, modalApi] = useVbenModal({
|
||||
draggable: true,
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<script lang="ts" setup>
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
|
||||
import { Button, message } from 'ant-design-vue';
|
||||
import { Button, message } from 'antdv-next';
|
||||
|
||||
const [Modal, modalApi] = useVbenModal({
|
||||
draggable: true,
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<script lang="ts" setup>
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
|
||||
import { message } from 'ant-design-vue';
|
||||
import { message } from 'antdv-next';
|
||||
|
||||
import { useVbenForm } from '#/adapter/form';
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { ref } from 'vue';
|
|||
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
|
||||
import { Input, message } from 'ant-design-vue';
|
||||
import { Input, message } from 'antdv-next';
|
||||
|
||||
const [Modal, modalApi] = useVbenModal({
|
||||
destroyOnClose: false,
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ import {
|
|||
useVbenModal,
|
||||
} from '@vben/common-ui';
|
||||
|
||||
import { Button, Card, Flex, message } from 'ant-design-vue';
|
||||
import { Button, Card, Flex, message } from 'antdv-next';
|
||||
|
||||
import DocButton from '../doc-button.vue';
|
||||
import AutoHeightDemo from './auto-height-demo.vue';
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<script lang="ts" setup>
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
|
||||
import { Button } from 'ant-design-vue';
|
||||
import { Button } from 'antdv-next';
|
||||
|
||||
import DragDemo from './drag-demo.vue';
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { ref } from 'vue';
|
|||
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
|
||||
import { message } from 'ant-design-vue';
|
||||
import { message } from 'antdv-next';
|
||||
|
||||
const data = ref();
|
||||
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ import {
|
|||
InputNumber,
|
||||
Row,
|
||||
Select,
|
||||
} from 'ant-design-vue';
|
||||
} from 'antdv-next';
|
||||
// 本例子用不到visible类型的动画。带有VisibleOnce和Visible的类型会在组件进入视口被显示时执行动画,
|
||||
const presets = MotionPresets.filter((v) => !v.includes('Visible'));
|
||||
const showCard1 = refAutoReset(true, 100);
|
||||
|
|
@ -114,15 +114,10 @@ function openDocPage() {
|
|||
<Row>
|
||||
<Col :span="8">
|
||||
<FormItem prop="preset" label="动画效果">
|
||||
<Select v-model:value="motionProps.preset">
|
||||
<Select.Option
|
||||
:value="preset"
|
||||
v-for="preset in presets"
|
||||
:key="preset"
|
||||
>
|
||||
{{ preset }}
|
||||
</Select.Option>
|
||||
</Select>
|
||||
<Select
|
||||
v-model:value="motionProps.preset"
|
||||
:options="presets.map((p) => ({ label: p, value: p }))"
|
||||
/>
|
||||
</FormItem>
|
||||
</Col>
|
||||
<Col :span="8">
|
||||
|
|
@ -168,15 +163,10 @@ function openDocPage() {
|
|||
<Row>
|
||||
<Col :span="8">
|
||||
<FormItem prop="preset" label="动画效果">
|
||||
<Select v-model:value="motionGroupProps.preset">
|
||||
<Select.Option
|
||||
:value="preset"
|
||||
v-for="preset in presets"
|
||||
:key="preset"
|
||||
>
|
||||
{{ preset }}
|
||||
</Select.Option>
|
||||
</Select>
|
||||
<Select
|
||||
v-model:value="motionGroupProps.preset"
|
||||
:options="presets.map((p) => ({ label: p, value: p }))"
|
||||
/>
|
||||
</FormItem>
|
||||
</Col>
|
||||
<Col :span="8">
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import { reactive } from 'vue';
|
|||
|
||||
import { Page, Tippy } from '@vben/common-ui';
|
||||
|
||||
import { Button, Card, Flex } from 'ant-design-vue';
|
||||
import { Button, Card, Flex } from 'antdv-next';
|
||||
|
||||
import { useVbenForm } from '#/adapter/form';
|
||||
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import { computed, ref } from 'vue';
|
|||
import { Page } from '@vben/common-ui';
|
||||
import { VbenTiptap, VbenTiptapPreview } from '@vben/plugins/tiptap';
|
||||
|
||||
import { Card, Switch } from 'ant-design-vue';
|
||||
import { Card, Switch } from 'antdv-next';
|
||||
const content = ref(`
|
||||
<h1>Vben Tiptap</h1>
|
||||
<p>这个编辑器已经被封装在 <code>packages/effects/plugins/src/tiptap</code> 中。</p>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import type { VxeGridListeners, VxeGridProps } from '#/adapter/vxe-table';
|
|||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { Button, message } from 'ant-design-vue';
|
||||
import { Button, message } from 'antdv-next';
|
||||
|
||||
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
|
|||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { Button, Image, Switch, Tag } from 'ant-design-vue';
|
||||
import { Button, Image, Switch, Tag } from 'antdv-next';
|
||||
|
||||
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||
import { getExampleTableApi } from '#/api';
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
|
|||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { Button, message } from 'ant-design-vue';
|
||||
import { Button, message } from 'antdv-next';
|
||||
|
||||
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||
import { getExampleTableApi } from '#/api';
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
|
|||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { Button } from 'ant-design-vue';
|
||||
import { Button } from 'antdv-next';
|
||||
|
||||
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||
import { getExampleTableApi } from '#/api';
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import type { VxeTableGridOptions } from '#/adapter/vxe-table';
|
|||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { message } from 'ant-design-vue';
|
||||
import { message } from 'antdv-next';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
|
|||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { Button } from 'ant-design-vue';
|
||||
import { Button } from 'antdv-next';
|
||||
|
||||
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||
import { getExampleTableApi } from '#/api';
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
|
|||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { Button } from 'ant-design-vue';
|
||||
import { Button } from 'antdv-next';
|
||||
|
||||
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@ import type { SystemDeptApi } from '#/api/system/dept';
|
|||
import { Page, useVbenModal } from '@vben/common-ui';
|
||||
import { Plus } from '@vben/icons';
|
||||
|
||||
import { Button, message } from 'ant-design-vue';
|
||||
import { Button, message } from 'antdv-next';
|
||||
|
||||
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||
import { deleteDept, getDeptList } from '#/api/system/dept';
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import { computed, ref } from 'vue';
|
|||
|
||||
import { useVbenModal } from '@vben/common-ui';
|
||||
|
||||
import { Button } from 'ant-design-vue';
|
||||
import { Button } from 'antdv-next';
|
||||
|
||||
import { useVbenForm } from '#/adapter/form';
|
||||
import { createDept, updateDept } from '#/api/system/dept';
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ import { $t } from '@vben/locales';
|
|||
|
||||
import { MenuBadge } from '@vben-core/menu-ui';
|
||||
|
||||
import { Button, message } from 'ant-design-vue';
|
||||
import { Button, message } from 'antdv-next';
|
||||
|
||||
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||
import { deleteMenu, getMenuList, SystemMenuApi } from '#/api/system/menu';
|
||||
|
|
|
|||
|
|
@ -1,6 +1,4 @@
|
|||
<script lang="ts" setup>
|
||||
import type { ChangeEvent } from 'ant-design-vue/es/_util/EventInterface';
|
||||
|
||||
import type { Recordable } from '@vben/types';
|
||||
|
||||
import type { VbenFormSchema } from '#/adapter/form';
|
||||
|
|
@ -108,7 +106,7 @@ const schema: VbenFormSchema[] = [
|
|||
// 不需要处理多语言时就无需这么做
|
||||
return {
|
||||
...(titleSuffix.value && { addonAfter: titleSuffix.value }),
|
||||
onChange({ target: { value } }: ChangeEvent) {
|
||||
onChange({ target: { value } }: { target: { value: string } }) {
|
||||
titleSuffix.value = value && $te(value) ? $t(value) : undefined;
|
||||
},
|
||||
};
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ import type { SystemRoleApi } from '#/api';
|
|||
import { Page, useVbenDrawer } from '@vben/common-ui';
|
||||
import { Plus } from '@vben/icons';
|
||||
|
||||
import { Button, message, Modal } from 'ant-design-vue';
|
||||
import { Button, message, Modal } from 'antdv-next';
|
||||
|
||||
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||
import { deleteRole, getRoleList, updateRole } from '#/api';
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<script lang="ts" setup>
|
||||
import type { DataNode } from 'ant-design-vue/es/tree';
|
||||
import type { DataNode } from 'antdv-next/dist/tree';
|
||||
|
||||
import type { Recordable } from '@vben/types';
|
||||
|
||||
|
|
@ -10,7 +10,7 @@ import { computed, nextTick, ref } from 'vue';
|
|||
import { Tree, useVbenDrawer } from '@vben/common-ui';
|
||||
import { IconifyIcon } from '@vben/icons';
|
||||
|
||||
import { Spin } from 'ant-design-vue';
|
||||
import { Spin } from 'antdv-next';
|
||||
|
||||
import { useVbenForm } from '#/adapter/form';
|
||||
import { getMenuList } from '#/api/system/menu';
|
||||
|
|
|
|||
|
|
@ -2060,9 +2060,9 @@ importers:
|
|||
'@vueuse/core':
|
||||
specifier: 'catalog:'
|
||||
version: 14.3.0(vue@3.5.34(typescript@6.0.3))
|
||||
ant-design-vue:
|
||||
antdv-next:
|
||||
specifier: 'catalog:'
|
||||
version: 4.2.6(vue@3.5.34(typescript@6.0.3))
|
||||
version: 1.3.0(date-fns@4.1.0)(vue@3.5.34(typescript@6.0.3))
|
||||
dayjs:
|
||||
specifier: 'catalog:'
|
||||
version: 1.11.20
|
||||
|
|
|
|||
Loading…
Reference in New Issue