chore: 一些调整和兼容性更新
This commit is contained in:
parent
2264eaae18
commit
33b7a605c0
@ -1,8 +1,8 @@
|
|||||||
# 应用标题
|
# 应用标题
|
||||||
VITE_APP_TITLE=Vben Admin Antd
|
VITE_APP_TITLE=Vben Admin Tdesign
|
||||||
|
|
||||||
# 应用命名空间,用于缓存、store等功能的前缀,确保隔离
|
# 应用命名空间,用于缓存、store等功能的前缀,确保隔离
|
||||||
VITE_APP_NAMESPACE=vben-web-antd
|
VITE_APP_NAMESPACE=vben-web-tdesign
|
||||||
|
|
||||||
# 对store进行加密的密钥,在将store持久化到localStorage时会使用该密钥进行加密
|
# 对store进行加密的密钥,在将store持久化到localStorage时会使用该密钥进行加密
|
||||||
VITE_APP_STORE_SECURE_KEY=please-replace-me-with-your-own-key
|
VITE_APP_STORE_SECURE_KEY=please-replace-me-with-your-own-key
|
||||||
|
|||||||
@ -9,6 +9,7 @@ import { ApiComponent, globalShareState, IconPicker } from '@vben/common-ui';
|
|||||||
import { $t } from '@vben/locales';
|
import { $t } from '@vben/locales';
|
||||||
|
|
||||||
import { notification } from 'ant-design-vue';
|
import { notification } from 'ant-design-vue';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 通用组件共同的使用的基础组件,原先放在 adapter/form 内部,限制了使用范围,这里提取出来,方便其他地方使用
|
* 通用组件共同的使用的基础组件,原先放在 adapter/form 内部,限制了使用范围,这里提取出来,方便其他地方使用
|
||||||
* 可用于 vben-form、vben-modal、vben-drawer 等组件使用,
|
* 可用于 vben-form、vben-modal、vben-drawer 等组件使用,
|
||||||
@ -178,11 +179,27 @@ async function initComponentAdapter() {
|
|||||||
// Mentions: withDefaultPlaceholder(Mentions, 'input'),
|
// Mentions: withDefaultPlaceholder(Mentions, 'input'),
|
||||||
// 自定义主要按钮
|
// 自定义主要按钮
|
||||||
PrimaryButton: (props, { attrs, slots }) => {
|
PrimaryButton: (props, { attrs, slots }) => {
|
||||||
return h(Button, { ...props, attrs, theme: 'primary' }, slots);
|
let ghost = false;
|
||||||
|
let variant = props.variant;
|
||||||
|
if (props.variant === 'ghost') {
|
||||||
|
ghost = true;
|
||||||
|
variant = 'base';
|
||||||
|
}
|
||||||
|
return h(
|
||||||
|
Button,
|
||||||
|
{ ...props, ghost, variant, attrs, theme: 'default' },
|
||||||
|
slots,
|
||||||
|
);
|
||||||
},
|
},
|
||||||
Radio,
|
Radio,
|
||||||
RadioGroup,
|
RadioGroup,
|
||||||
|
RangePicker: (props, { attrs, slots }) => {
|
||||||
|
return h(
|
||||||
RangePicker,
|
RangePicker,
|
||||||
|
{ ...props, modelValue: props.modelValue ?? [], attrs },
|
||||||
|
slots,
|
||||||
|
);
|
||||||
|
},
|
||||||
Rate,
|
Rate,
|
||||||
Select: withDefaultPlaceholder(Select, 'select'),
|
Select: withDefaultPlaceholder(Select, 'select'),
|
||||||
Space,
|
Space,
|
||||||
|
|||||||
@ -1,17 +1,13 @@
|
|||||||
import type {
|
import type { VbenFormProps, VbenFormSchema as FormSchema } from "@vben/common-ui";
|
||||||
VbenFormSchema as FormSchema,
|
import { setupVbenForm, useVbenForm as useForm, z } from "@vben/common-ui";
|
||||||
VbenFormProps,
|
|
||||||
} from '@vben/common-ui';
|
|
||||||
|
|
||||||
import type { ComponentType } from './component';
|
import type { ComponentType } from "./component";
|
||||||
|
import { $t } from "@vben/locales";
|
||||||
import { setupVbenForm, useVbenForm as useForm, z } from '@vben/common-ui';
|
|
||||||
import { $t } from '@vben/locales';
|
|
||||||
|
|
||||||
async function initSetupVbenForm() {
|
async function initSetupVbenForm() {
|
||||||
setupVbenForm<ComponentType>({
|
setupVbenForm<ComponentType>({
|
||||||
config: {
|
config: {
|
||||||
// ant design vue组件库默认都是 v-model:value
|
// tdesign组件库默认都是 v-model:value
|
||||||
baseModelPropName: 'value',
|
baseModelPropName: 'value',
|
||||||
|
|
||||||
// 一些组件是 v-model:checked 或者 v-model:fileList
|
// 一些组件是 v-model:checked 或者 v-model:fileList
|
||||||
|
|||||||
@ -1,39 +1,32 @@
|
|||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { computed } from 'vue';
|
import { onMounted } from "vue";
|
||||||
|
|
||||||
import { useAntdDesignTokens } from '@vben/hooks';
|
import { usePreferences } from "@vben/preferences";
|
||||||
import { preferences, usePreferences } from '@vben/preferences';
|
import { merge } from "@vben/utils";
|
||||||
|
|
||||||
import { App, ConfigProvider, theme } from 'ant-design-vue';
|
import { ConfigProvider } from "tdesign-vue-next";
|
||||||
|
import zhConfig from "tdesign-vue-next/es/locale/zh_CN";
|
||||||
import { antdLocale } from '#/locales';
|
|
||||||
|
|
||||||
defineOptions({ name: 'App' });
|
defineOptions({ name: 'App' });
|
||||||
|
|
||||||
const { isDark } = usePreferences();
|
const { isDark } = usePreferences();
|
||||||
const { tokens } = useAntdDesignTokens();
|
|
||||||
|
|
||||||
const tokenTheme = computed(() => {
|
onMounted(() => {
|
||||||
const algorithm = isDark.value
|
document.documentElement.setAttribute(
|
||||||
? [theme.darkAlgorithm]
|
'theme-mode',
|
||||||
: [theme.defaultAlgorithm];
|
isDark.value ? 'dark' : '',
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
// antd 紧凑模式算法
|
const globalConfig = merge(zhConfig, {
|
||||||
if (preferences.app.compact) {
|
// 可以在此处定义更多自定义配置,具体可配置内容参看 API 文档
|
||||||
algorithm.push(theme.compactAlgorithm);
|
calendar: {},
|
||||||
}
|
table: {},
|
||||||
|
pagination: {},
|
||||||
return {
|
|
||||||
algorithm,
|
|
||||||
token: tokens,
|
|
||||||
};
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<ConfigProvider :locale="antdLocale" :theme="tokenTheme">
|
<ConfigProvider :global-config="globalConfig">
|
||||||
<App>
|
|
||||||
<RouterView />
|
<RouterView />
|
||||||
</App>
|
|
||||||
</ConfigProvider>
|
</ConfigProvider>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user