Skip to content

Commit

Permalink
feat(projects): add page: about
Browse files Browse the repository at this point in the history
  • Loading branch information
honghuangdc committed Jan 20, 2024
1 parent c655a24 commit a2b6b4e
Show file tree
Hide file tree
Showing 9 changed files with 139 additions and 0 deletions.
14 changes: 14 additions & 0 deletions src/locales/lang/en-us.ts
Original file line number Diff line number Diff line change
Expand Up @@ -110,6 +110,7 @@ const local: App.I18n.Schema = {
500: 'Server Error',
home: 'Home',
'user-center': 'User Center',
about: 'About',
manage: 'System Manage',
manage_user: 'User Manage',
'manage_user-detail': 'User Detail',
Expand Down Expand Up @@ -166,6 +167,19 @@ const local: App.I18n.Schema = {
bindWeChat: {
title: 'Bind WeChat'
}
},
about: {
title: 'About',
introduction: `Soybean Admin is an elegant and powerful admin template, based on the latest front-end technology stack, including Vue3, Vite5, TypeScript, Pinia and UnoCSS. It has built-in rich theme configuration and components, strict code specifications, and an automated file routing system. In addition, it also uses the online mock data solution based on ApiFox. Soybean Admin provides you with a one-stop admin solution, no additional configuration, and out of the box. It is also a best practice for learning cutting-edge technologies quickly.`,
projectInfo: {
title: 'Project Info',
version: 'Version',
latestBuildTime: 'Latest Build Time',
githubLink: 'Github Link',
previewLink: 'Preview Link'
},
prdDep: 'Production Dependency',
devDep: 'Development Dependency'
}
},
form: {
Expand Down
14 changes: 14 additions & 0 deletions src/locales/lang/zh-cn.ts
Original file line number Diff line number Diff line change
Expand Up @@ -110,6 +110,7 @@ const local: App.I18n.Schema = {
500: '服务器错误',
home: '首页',
'user-center': '个人中心',
about: '关于',
manage: '系统管理',
manage_user: '用户管理',
'manage_user-detail': '用户详情',
Expand Down Expand Up @@ -166,6 +167,19 @@ const local: App.I18n.Schema = {
bindWeChat: {
title: '绑定微信'
}
},
about: {
title: '关于',
introduction: `Soybean Admin 是一个优雅且功能强大的后台管理模板,基于最新的前端技术栈,包括 Vue3, Vite5, TypeScript, Pinia 和 UnoCSS。它内置了丰富的主题配置和组件,代码规范严谨,实现了自动化的文件路由系统。此外,它还采用了基于 ApiFox 的在线Mock数据方案。Soybean Admin 为您提供了一站式的后台管理解决方案,无需额外配置,开箱即用。同样是一个快速学习前沿技术的最佳实践。`,
projectInfo: {
title: '项目信息',
version: '版本',
latestBuildTime: '最新构建时间',
githubLink: 'Github 地址',
previewLink: '预览地址'
},
prdDep: '生产依赖',
devDep: '开发依赖'
}
},
form: {
Expand Down
1 change: 1 addition & 0 deletions src/router/elegant/imports.ts
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ export const views: Record<LastLevelRouteKey, RouteComponent | (() => Promise<Ro
404: () => import("@/views/_builtin/404/index.vue"),
500: () => import("@/views/_builtin/500/index.vue"),
login: () => import("@/views/_builtin/login/index.vue"),
about: () => import("@/views/about/index.vue"),
home: () => import("@/views/home/index.vue"),
manage_role: () => import("@/views/manage/role/index.vue"),
manage_route: () => import("@/views/manage/route/index.vue"),
Expand Down
11 changes: 11 additions & 0 deletions src/router/elegant/routes.ts
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,17 @@ export const generatedRoutes: GeneratedRoute[] = [
constant: true
}
},
{
name: 'about',
path: '/about',
component: 'layout.base$view.about',
meta: {
title: 'about',
i18nKey: 'route.about',
icon: 'fluent:book-information-24-regular',
order: 10
}
},
{
name: 'home',
path: '/home',
Expand Down
1 change: 1 addition & 0 deletions src/router/elegant/transform.ts
Original file line number Diff line number Diff line change
Expand Up @@ -146,6 +146,7 @@ const routeMap: RouteMap = {
"403": "/403",
"404": "/404",
"500": "/500",
"about": "/about",
"home": "/home",
"login": "/login/:module(pwd-login|code-login|register|reset-pwd|bind-wechat)?",
"manage": "/manage",
Expand Down
13 changes: 13 additions & 0 deletions src/typings/app.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -354,6 +354,19 @@ declare namespace App {
title: string;
};
};
about: {
title: string;
introduction: string;
projectInfo: {
title: string;
version: string;
latestBuildTime: string;
githubLink: string;
previewLink: string;
};
prdDep: string;
devDep: string;
};
};
form: {
userName: FormMsg;
Expand Down
3 changes: 3 additions & 0 deletions src/typings/components.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,8 @@ declare module 'vue' {
ACalendar: typeof import('ant-design-vue/es')['Calendar']
ACard: typeof import('ant-design-vue/es')['Card']
ACheckbox: typeof import('ant-design-vue/es')['Checkbox']
ADescriptions: typeof import('ant-design-vue/es')['Descriptions']
ADescriptionsItem: typeof import('ant-design-vue/es')['DescriptionsItem']
ADivider: typeof import('ant-design-vue/es')['Divider']
ADrawer: typeof import('ant-design-vue/es')['Drawer']
ADropdown: typeof import('ant-design-vue/es')['Dropdown']
Expand All @@ -31,6 +33,7 @@ declare module 'vue' {
ASelectOption: typeof import('ant-design-vue/es')['SelectOption']
ASpace: typeof import('ant-design-vue/es')['Space']
ASwitch: typeof import('ant-design-vue/es')['Switch']
ATag: typeof import('ant-design-vue/es')['Tag']
ATooltip: typeof import('ant-design-vue/es')['Tooltip']
BetterScroll: typeof import('./../components/custom/better-scroll.vue')['default']
ButtonIcon: typeof import('./../components/custom/button-icon.vue')['default']
Expand Down
3 changes: 3 additions & 0 deletions src/typings/elegant-router.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ declare module "@elegant-router/types" {
"403": "/403";
"404": "/404";
"500": "/500";
"about": "/about";
"home": "/home";
"login": "/login/:module(pwd-login|code-login|register|reset-pwd|bind-wechat)?";
"manage": "/manage";
Expand Down Expand Up @@ -68,6 +69,7 @@ declare module "@elegant-router/types" {
| "403"
| "404"
| "500"
| "about"
| "home"
| "login"
| "manage"
Expand All @@ -93,6 +95,7 @@ declare module "@elegant-router/types" {
| "404"
| "500"
| "login"
| "about"
| "home"
| "manage_role"
| "manage_route"
Expand Down
79 changes: 79 additions & 0 deletions src/views/about/index.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,79 @@
<script setup lang="ts">
import { $t } from '@/locales';
import pkg from '~/package.json';
interface PkgJson {
name: string;
version: string;
dependencies: PkgVersionInfo[];
devDependencies: PkgVersionInfo[];
}
interface PkgVersionInfo {
name: string;
version: string;
}
const { name, version, dependencies, devDependencies } = pkg;
function transformVersionData(tuple: [string, string]): PkgVersionInfo {
const [$name, $version] = tuple;
return {
name: $name,
version: $version
};
}
const pkgJson: PkgJson = {
name,
version,
dependencies: Object.entries(dependencies).map(item => transformVersionData(item)),
devDependencies: Object.entries(devDependencies).map(item => transformVersionData(item))
};
const latestBuildTime = BUILD_TIME;
</script>

<template>
<ASpace direction="vertical" :size="16">
<ACard :title="$t('page.about.title')" :bordered="false" class="card-wrapper">
<p>{{ $t('page.about.introduction') }}</p>
</ACard>
<ACard :title="$t('page.about.projectInfo.title')" :bordered="false" class="card-wrapper">
<ADescriptions label-placement="left" bordered size="small" :column="{ xs: 1, sm: 2 }">
<ADescriptionsItem :label="$t('page.about.projectInfo.version')">
<ATag type="primary">{{ pkgJson.version }}</ATag>
</ADescriptionsItem>
<ADescriptionsItem :label="$t('page.about.projectInfo.latestBuildTime')">
<ATag type="primary">{{ latestBuildTime }}</ATag>
</ADescriptionsItem>
<ADescriptionsItem :label="$t('page.about.projectInfo.githubLink')">
<a class="text-primary" :href="pkg.homepage" target="_blank" rel="noopener noreferrer">
{{ $t('page.about.projectInfo.githubLink') }}
</a>
</ADescriptionsItem>
<ADescriptionsItem :label="$t('page.about.projectInfo.previewLink')">
<a class="text-primary" :href="pkg.website" target="_blank" rel="noopener noreferrer">
{{ $t('page.about.projectInfo.previewLink') }}
</a>
</ADescriptionsItem>
</ADescriptions>
</ACard>
<ACard :title="$t('page.about.prdDep')" :bordered="false" class="card-wrapper">
<ADescriptions label-placement="left" bordered size="small" :column="{ xs: 1, sm: 2 }">
<ADescriptionsItem v-for="item in pkgJson.dependencies" :key="item.name" :label="item.name">
{{ item.version }}
</ADescriptionsItem>
</ADescriptions>
</ACard>
<ACard :title="$t('page.about.devDep')" :bordered="false" class="card-wrapper">
<ADescriptions label-placement="left" bordered size="small" :column="{ xs: 1, sm: 2 }">
<ADescriptionsItem v-for="item in pkgJson.devDependencies" :key="item.name" :label="item.name">
{{ item.version }}
</ADescriptionsItem>
</ADescriptions>
</ACard>
</ASpace>
</template>

<style scoped></style>

0 comments on commit a2b6b4e

Please sign in to comment.