refactor(auth): 移除登录成功后的测试通知代码
feat(analytics): 添加antdv-next变更说明文档和演示功能
This commit is contained in:
parent
bc8ee604fb
commit
35e8549dcc
@ -71,16 +71,6 @@ export const useAuthStore = defineStore('auth', () => {
|
|||||||
duration: 3,
|
duration: 3,
|
||||||
title: $t('authentication.loginSuccess'),
|
title: $t('authentication.loginSuccess'),
|
||||||
});
|
});
|
||||||
|
|
||||||
await new Promise((resolve) => setTimeout(resolve, 1000));
|
|
||||||
Array.from({ length: 5 }).forEach((_, index) => {
|
|
||||||
setTimeout(() => {
|
|
||||||
notification.success({
|
|
||||||
title: '新的notification样式',
|
|
||||||
description: '这是一条新的通知消息',
|
|
||||||
});
|
|
||||||
}, index * 900);
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
} finally {
|
} finally {
|
||||||
loginLoading.value = false;
|
loginLoading.value = false;
|
||||||
|
|||||||
11
apps/web-antd/src/views/dashboard/analytics/change.md
Normal file
11
apps/web-antd/src/views/dashboard/analytics/change.md
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
## 变化(跟ant-design-vue对比)
|
||||||
|
|
||||||
|
从ant design (react) v6移植过来 详细也可以看[antd的文档](https://ant.design/changelog-cn#600)
|
||||||
|
|
||||||
|
- 支持css变量 不用再写**deep**或者加权重来覆盖样式
|
||||||
|
- 支持`组件语义化结构` [组件语义化结构](https://ant.design/docs/blog/semantic-beauty-cn)
|
||||||
|
- notification的新样式 (这个从antd5都已经有了 vue一直没有)
|
||||||
|
- RadioGroup支持水波纹效果
|
||||||
|
- modal/drawer支持blur效果
|
||||||
|
- 支持颜色与变体 需要绿色按钮?不用再写css了[Button 组件](https://ant.design/components/button-cn#button-demo-color-variant)
|
||||||
|
- 支持颜色选择器[ColorPicker 组件](https://ant.design/components/color-picker-cn) 这个也是从antd5就开始有了 vue一直没有
|
||||||
@ -6,6 +6,7 @@ import {
|
|||||||
AnalysisChartCard,
|
AnalysisChartCard,
|
||||||
AnalysisChartsTabs,
|
AnalysisChartsTabs,
|
||||||
AnalysisOverview,
|
AnalysisOverview,
|
||||||
|
MarkdownPreviewer,
|
||||||
} from '@vben/common-ui';
|
} from '@vben/common-ui';
|
||||||
import {
|
import {
|
||||||
SvgBellIcon,
|
SvgBellIcon,
|
||||||
@ -14,13 +15,14 @@ import {
|
|||||||
SvgDownloadIcon,
|
SvgDownloadIcon,
|
||||||
} from '@vben/icons';
|
} from '@vben/icons';
|
||||||
|
|
||||||
import { Alert } from 'antdv-next';
|
import { Alert, notification } from 'antdv-next';
|
||||||
|
|
||||||
import AnalyticsTrends from './analytics-trends.vue';
|
import AnalyticsTrends from './analytics-trends.vue';
|
||||||
import AnalyticsVisitsData from './analytics-visits-data.vue';
|
import AnalyticsVisitsData from './analytics-visits-data.vue';
|
||||||
import AnalyticsVisitsSales from './analytics-visits-sales.vue';
|
import AnalyticsVisitsSales from './analytics-visits-sales.vue';
|
||||||
import AnalyticsVisitsSource from './analytics-visits-source.vue';
|
import AnalyticsVisitsSource from './analytics-visits-source.vue';
|
||||||
import AnalyticsVisits from './analytics-visits.vue';
|
import AnalyticsVisits from './analytics-visits.vue';
|
||||||
|
import md from './change.md?raw';
|
||||||
|
|
||||||
const overviewItems: AnalysisOverviewItem[] = [
|
const overviewItems: AnalysisOverviewItem[] = [
|
||||||
{
|
{
|
||||||
@ -63,16 +65,27 @@ const chartTabs: TabOption[] = [
|
|||||||
value: 'visits',
|
value: 'visits',
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
|
function handleClick() {
|
||||||
|
notification.success({
|
||||||
|
title: '新的 notification 样式',
|
||||||
|
description: 'ant design',
|
||||||
|
});
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="p-5">
|
<div class="p-5">
|
||||||
<Alert
|
<Alert class="mb-5" :show-icon="true" type="success">
|
||||||
class="mb-5"
|
<template #message>
|
||||||
:show-icon="true"
|
该分支使用antdv-next替代不维护的ant-design-vue
|
||||||
type="success"
|
<a-button class="ml-2" size="small" type="primary" @click="handleClick">
|
||||||
title="该分支使用antdv-next替代不维护的ant-design-vue"
|
疯狂点击
|
||||||
/>
|
</a-button>
|
||||||
|
</template>
|
||||||
|
</Alert>
|
||||||
|
|
||||||
|
<MarkdownPreviewer v-model:value="md" />
|
||||||
|
|
||||||
<AnalysisOverview :items="overviewItems" />
|
<AnalysisOverview :items="overviewItems" />
|
||||||
<AnalysisChartsTabs :tabs="chartTabs" class="mt-5">
|
<AnalysisChartsTabs :tabs="chartTabs" class="mt-5">
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user