1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
| <template>
| <PageWrapper title="关于">
| <template #headerContent>
| <div class="flex justify-between items-center">
| <span class="flex-1">
| <a :href="GITHUB_URL" target="_blank">{{ name }}</a>
| 是一个基于Vue3.0、Vite、 Ant-Design-Vue 、TypeScript
| 的后台解决方案，目标是为中大型项目开发,提供现成的开箱解决方案及丰富的示例,原则上不会限制任何代码用于商用。
| </span>
| </div>
| </template>
| <Description @register="infoRegister" class="enter-y" />
| <Description @register="register" class="my-4 enter-y" />
| <Description @register="registerDev" class="enter-y" />
| </PageWrapper>
| </template>
| <script lang="ts" setup>
| import { h } from 'vue';
| import { Tag } from 'ant-design-vue';
| import { PageWrapper } from '@/components/Page';
| import { Description, DescItem, useDescription } from '@/components/Description';
| import { GITHUB_URL, SITE_URL, DOC_URL } from '@/settings/siteSetting';
|
| const { pkg, lastBuildTime } = __APP_INFO__;
|
| const { dependencies, devDependencies, name, version } = pkg;
|
| const schema: DescItem[] = [];
| const devSchema: DescItem[] = [];
|
| const commonTagRender = (color: string) => (curVal) => h(Tag, { color }, () => curVal);
| const commonLinkRender = (text: string) => (href) => h('a', { href, target: '_blank' }, text);
|
| const infoSchema: DescItem[] = [
| {
| label: '版本',
| field: 'version',
| render: commonTagRender('blue'),
| },
| {
| label: '最后编译时间',
| field: 'lastBuildTime',
| render: commonTagRender('blue'),
| },
| {
| label: '文档地址',
| field: 'doc',
| render: commonLinkRender('文档地址'),
| },
| {
| label: '预览地址',
| field: 'preview',
| render: commonLinkRender('预览地址'),
| },
| {
| label: 'Github',
| field: 'github',
| render: commonLinkRender('Github'),
| },
| ];
|
| const infoData = {
| version,
| lastBuildTime,
| doc: DOC_URL,
| preview: SITE_URL,
| github: GITHUB_URL,
| };
|
| Object.keys(dependencies).forEach((key) => {
| schema.push({ field: key, label: key });
| });
|
| Object.keys(devDependencies).forEach((key) => {
| devSchema.push({ field: key, label: key });
| });
|
| const [register] = useDescription({
| title: '生产环境依赖',
| data: dependencies,
| schema: schema,
| column: 3,
| });
|
| const [registerDev] = useDescription({
| title: '开发环境依赖',
| data: devDependencies,
| schema: devSchema,
| column: 3,
| });
|
| const [infoRegister] = useDescription({
| title: '项目信息',
| data: infoData,
| schema: infoSchema,
| column: 2,
| });
| </script>
|
|
