del: 删除无用固定的路由
This commit is contained in:
@@ -40,104 +40,6 @@ const constantRoutes: RouteRecordRaw[] = [
|
||||
meta: { title: '首页', icon: 'icon-pcduan' },
|
||||
component: () => import('@/views/index.vue'),
|
||||
},
|
||||
{
|
||||
path: '/dome1',
|
||||
name: 'Dome1',
|
||||
meta: { title: '示例一', icon: 'icon-ios', hideInMenu: true },
|
||||
component: () => import('@/views/dome/dome1.vue'),
|
||||
},
|
||||
{
|
||||
path: '/dome2',
|
||||
name: 'Dome2',
|
||||
meta: { title: '示例二', icon: 'icon-anzhuo', hideInMenu: true },
|
||||
component: () => import('@/views/dome/dome2.vue'),
|
||||
},
|
||||
{
|
||||
path: '/dome3',
|
||||
name: 'Dome3',
|
||||
meta: { title: '示例三', icon: 'icon-qunzhu', hideInMenu: true },
|
||||
component: () => import('@/views/dome/dome3.vue'),
|
||||
},
|
||||
{
|
||||
path: '/domes',
|
||||
name: 'Domes',
|
||||
meta: {
|
||||
title: '示例目录',
|
||||
icon: 'icon-zhizuoliucheng',
|
||||
hideInMenu: true,
|
||||
},
|
||||
component: BlankLayout,
|
||||
redirect: () => ({ name: 'PageInfo' }),
|
||||
children: [
|
||||
{
|
||||
path: 'page-info',
|
||||
name: 'PageInfo',
|
||||
meta: { title: '页面信息', icon: 'icon-huifu' },
|
||||
component: () => import('../views/domes/page-info.vue'),
|
||||
},
|
||||
{
|
||||
path: 'page-typography',
|
||||
name: 'PageTypography',
|
||||
meta: { title: '文本信息', icon: 'icon-huizhiguize' },
|
||||
component: () => import('../views/domes/page-typography.vue'),
|
||||
},
|
||||
{
|
||||
path: 'dynamic-match/:id(\\d+)',
|
||||
name: 'DynamicMatch',
|
||||
// 路由 path 默认参数再 meta.params 里
|
||||
meta: { title: '动态参数页面', params: { id: 1 }, cache: true },
|
||||
component: () => import('../views/domes/dynamic-match.vue'),
|
||||
},
|
||||
{
|
||||
path: 'disabled',
|
||||
name: 'Disabled',
|
||||
meta: { title: '禁止点击', disabled: true },
|
||||
component: () => {},
|
||||
},
|
||||
{
|
||||
path: 'https://github.com/TsMask',
|
||||
name: 'BlankGithubTsMask',
|
||||
meta: {
|
||||
title: 'TsMask-打开新窗',
|
||||
icon: 'icon-github',
|
||||
target: '_blank',
|
||||
},
|
||||
component: () => {},
|
||||
},
|
||||
{
|
||||
path: encode('https://www.antdv.com/components/comment-cn'),
|
||||
name: 'HttpsAntDesignVue',
|
||||
meta: {
|
||||
title: 'Antdv-内嵌窗口',
|
||||
icon: 'icon-morentouxiang',
|
||||
target: null,
|
||||
},
|
||||
component: LinkLayout,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: 'https://github.com/',
|
||||
name: 'BlankGithub',
|
||||
meta: {
|
||||
title: 'Github-打开新窗',
|
||||
icon: 'icon-github',
|
||||
target: '_blank',
|
||||
hideInMenu: true,
|
||||
},
|
||||
component: () => {},
|
||||
},
|
||||
{
|
||||
path: 'https://3x.antdv.com/components/comment-cn?sdf=12321&id=12&sdnf',
|
||||
name: 'SelfAnt Design Vue',
|
||||
meta: {
|
||||
title: 'Antdv-当前窗口',
|
||||
icon: 'icon-morentouxiang',
|
||||
target: '_self',
|
||||
hideInMenu: true,
|
||||
},
|
||||
component: LinkLayout,
|
||||
},
|
||||
{
|
||||
path: '/account',
|
||||
name: 'Account',
|
||||
|
||||
@@ -1,27 +0,0 @@
|
||||
<template>
|
||||
<PageContainer>
|
||||
<a-result
|
||||
status="404"
|
||||
:style="{
|
||||
height: '100%',
|
||||
background: '#fff',
|
||||
}"
|
||||
title="Hello World"
|
||||
sub-title="Sorry, you are not authorized to access this page."
|
||||
>
|
||||
<template #extra>
|
||||
<a-button type="primary" @click="handleClick">Back Home</a-button>
|
||||
</template>
|
||||
</a-result>
|
||||
</PageContainer>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { PageContainer } from '@ant-design-vue/pro-layout';
|
||||
import { message } from 'ant-design-vue/lib';
|
||||
|
||||
const handleClick = () => {
|
||||
console.log('info');
|
||||
message.info('BackHome button clicked!');
|
||||
};
|
||||
</script>
|
||||
@@ -1,61 +0,0 @@
|
||||
<template>
|
||||
<a-layout class="layout">
|
||||
<a-layout-header>
|
||||
<div class="logo" />
|
||||
<a-menu
|
||||
v-model:selectedKeys="selectedKeys"
|
||||
theme="dark"
|
||||
mode="horizontal"
|
||||
:style="{ lineHeight: '64px' }"
|
||||
>
|
||||
<a-menu-item key="1">nav 1</a-menu-item>
|
||||
<a-menu-item key="2">nav 2</a-menu-item>
|
||||
<a-menu-item key="3">nav 3</a-menu-item>
|
||||
</a-menu>
|
||||
</a-layout-header>
|
||||
<a-layout-content style="padding: 0 50px">
|
||||
<a-breadcrumb style="margin: 16px 0">
|
||||
<a-breadcrumb-item>Home</a-breadcrumb-item>
|
||||
<a-breadcrumb-item>List</a-breadcrumb-item>
|
||||
<a-breadcrumb-item>App</a-breadcrumb-item>
|
||||
</a-breadcrumb>
|
||||
<div :style="{ background: '#fff', padding: '24px', minHeight: '280px' }">
|
||||
Content {{ selectedKeys }}
|
||||
</div>
|
||||
</a-layout-content>
|
||||
<a-layout-footer style="text-align: center">
|
||||
Ant Design ©2018 Created by Ant UED
|
||||
</a-layout-footer>
|
||||
</a-layout>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
|
||||
const selectedKeys = ref<string[]>(['2']);
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.site-layout-content {
|
||||
min-height: 280px;
|
||||
padding: 24px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
#components-layout-demo-top .logo {
|
||||
float: left;
|
||||
width: 120px;
|
||||
height: 31px;
|
||||
margin: 16px 24px 16px 0;
|
||||
background: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.ant-row-rtl #components-layout-demo-top .logo {
|
||||
float: right;
|
||||
margin: 16px 0 16px 24px;
|
||||
}
|
||||
|
||||
[data-theme='dark'] .site-layout-content {
|
||||
background: #141414;
|
||||
}
|
||||
</style>
|
||||
@@ -1,30 +0,0 @@
|
||||
<template>
|
||||
<PageContainer title="Version" sub-title="show current project dependencies">
|
||||
<template #content>
|
||||
<strong>Content Area</strong>
|
||||
</template>
|
||||
<template #extra>
|
||||
<strong>Extra Area</strong>
|
||||
</template>
|
||||
<template #extraContent>
|
||||
<strong>ExtraContent Area</strong>
|
||||
</template>
|
||||
<template #tags>
|
||||
<a-tag>Tag1</a-tag>
|
||||
<a-tag color="pink">Tag2</a-tag>
|
||||
</template>
|
||||
<a-card title="Info">
|
||||
<p v-for="i in list" :key="i">
|
||||
text block...
|
||||
<a-tag>{{ i }}</a-tag>
|
||||
</p>
|
||||
</a-card>
|
||||
</PageContainer>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import { PageContainer } from '@ant-design-vue/pro-layout';
|
||||
|
||||
const list = ref<number>(50);
|
||||
</script>
|
||||
@@ -1,87 +0,0 @@
|
||||
<template>
|
||||
<PageContainer :title="`${route.meta.title} ${route.params.id}`">
|
||||
<template #content>
|
||||
<a-descriptions size="small" :column="2">
|
||||
<a-descriptions-item label="创建人">张三</a-descriptions-item>
|
||||
<a-descriptions-item label="联系方式">
|
||||
<a>421421</a>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="创建时间">2017-01-10</a-descriptions-item>
|
||||
<a-descriptions-item label="更新时间">2017-10-10</a-descriptions-item>
|
||||
<a-descriptions-item label="备注">
|
||||
中国浙江省杭州市西湖区古翠路
|
||||
</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</template>
|
||||
<template #extra>
|
||||
<a-button key="3">操作</a-button>
|
||||
<a-button key="2">操作</a-button>
|
||||
<a-button key="1" type="primary">主操作</a-button>
|
||||
</template>
|
||||
<template #extraContent>
|
||||
<a-space>
|
||||
<a-statistic title="Feedback" :value="1128">
|
||||
<template #prefix>
|
||||
<LikeOutlined />
|
||||
</template>
|
||||
</a-statistic>
|
||||
<a-statistic title="Unmerged" :value="93" suffix="/ 100" />
|
||||
</a-space>
|
||||
</template>
|
||||
<!-- 主内容区 -->
|
||||
<div style="height: 300px">
|
||||
<p>路由参数联动 分页器 组件</p>
|
||||
<a-space>
|
||||
<a-button type="dashed" @click="prev">跳转上一页</a-button>
|
||||
<a-button type="dashed" @click="next">跳转下一页</a-button>
|
||||
</a-space>
|
||||
<a-divider />
|
||||
<a-pagination
|
||||
:current="currentId"
|
||||
:total="total"
|
||||
show-less-items
|
||||
@change="handlePageChange"
|
||||
/>
|
||||
</div>
|
||||
</PageContainer>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { PageContainer } from '@ant-design-vue/pro-layout';
|
||||
import { computed } from 'vue';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
|
||||
const currentId = computed(() => {
|
||||
let id = route.params && (route.params.id as string);
|
||||
return Number.parseInt(id as string, 10) || 1;
|
||||
});
|
||||
const total = computed(() => {
|
||||
const v = currentId.value * 20;
|
||||
if (v >= Number.MAX_SAFE_INTEGER) {
|
||||
return Number.MAX_SAFE_INTEGER;
|
||||
}
|
||||
return v;
|
||||
});
|
||||
|
||||
const next = () => {
|
||||
router.push({
|
||||
name: 'DynamicMatch',
|
||||
params: { id: currentId.value + 1 },
|
||||
});
|
||||
};
|
||||
const prev = () => {
|
||||
router.push({
|
||||
name: 'DynamicMatch',
|
||||
params: { id: currentId.value > 1 ? currentId.value - 1 : 1 },
|
||||
});
|
||||
};
|
||||
const handlePageChange = (currentPage: number) => {
|
||||
router.push({
|
||||
name: 'DynamicMatch',
|
||||
params: { id: currentPage },
|
||||
});
|
||||
};
|
||||
</script>
|
||||
@@ -1,58 +0,0 @@
|
||||
<template>
|
||||
<PageContainer :title="title">
|
||||
<template #content>
|
||||
<a-descriptions size="small" :column="2">
|
||||
<a-descriptions-item label="创建人">张三</a-descriptions-item>
|
||||
<a-descriptions-item label="联系方式">
|
||||
<a>421421</a>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="创建时间">2017-01-10</a-descriptions-item>
|
||||
<a-descriptions-item label="更新时间">2017-10-10</a-descriptions-item>
|
||||
<a-descriptions-item label="备注">
|
||||
中国浙江省杭州市西湖区古翠路
|
||||
</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</template>
|
||||
<template #extra>
|
||||
<a-button key="3">操作</a-button>
|
||||
<a-button key="2">操作</a-button>
|
||||
<a-button key="1" type="primary">主操作</a-button>
|
||||
</template>
|
||||
<template #extraContent>
|
||||
<a-space>
|
||||
<a-statistic title="Feedback" :value="1128">
|
||||
<template #prefix>
|
||||
<LikeOutlined />
|
||||
</template>
|
||||
</a-statistic>
|
||||
<a-statistic title="Unmerged" :value="93" suffix="/ 100" />
|
||||
</a-space>
|
||||
</template>
|
||||
<!-- 主内容区 -->
|
||||
<div style="height: 120vh">
|
||||
<a-result
|
||||
status="404"
|
||||
:style="{
|
||||
height: '100%',
|
||||
background: '#fff',
|
||||
}"
|
||||
title="Hello World"
|
||||
sub-title="Sorry, you are not authorized to access this page."
|
||||
>
|
||||
<template #extra>
|
||||
<a-button type="primary">Back Home</a-button>
|
||||
</template>
|
||||
</a-result>
|
||||
</div>
|
||||
</PageContainer>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { PageContainer } from '@ant-design-vue/pro-layout';
|
||||
import { ref } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
const route = useRoute();
|
||||
|
||||
/**路由标题 */
|
||||
let title = ref<string>(route.meta.title ?? '标题');
|
||||
</script>
|
||||
@@ -1,102 +0,0 @@
|
||||
<template>
|
||||
<a-card>
|
||||
<a-typography>
|
||||
<a-typography-title>Introduction</a-typography-title>
|
||||
<a-typography-paragraph>
|
||||
In the process of internal desktop applications development, many
|
||||
different design specs and implementations would be involved, which
|
||||
might cause designers and developers difficulties and duplication and
|
||||
reduce the efficiency of development.
|
||||
</a-typography-paragraph>
|
||||
<a-typography-paragraph>
|
||||
After massive project practice and summaries, Ant Design, a design
|
||||
language for background applications, is refined by Ant UED Team, which
|
||||
aims to
|
||||
<a-typography-text strong>
|
||||
uniform the user interface specs for internal background projects,
|
||||
lower the unnecessary cost of design differences and implementation
|
||||
and liberate the resources of design and front-end development.
|
||||
</a-typography-text>
|
||||
</a-typography-paragraph>
|
||||
<a-typography-title :level="2"
|
||||
>Guidelines and Resources</a-typography-title
|
||||
>
|
||||
<a-typography-paragraph>
|
||||
We supply a series of design principles, practical patterns and high
|
||||
quality design resources (
|
||||
<a-typography-text code>Sketch</a-typography-text>
|
||||
and
|
||||
<a-typography-text code>Axure</a-typography-text>
|
||||
), to help people create their product prototypes beautifully and
|
||||
efficiently.
|
||||
</a-typography-paragraph>
|
||||
|
||||
<a-typography-paragraph>
|
||||
<ul>
|
||||
<li>
|
||||
<a-typography-link href="/docs/resources"
|
||||
>Resource Download</a-typography-link
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
</a-typography-paragraph>
|
||||
|
||||
<a-typography-paragraph>
|
||||
Press
|
||||
<a-typography-text keyboard>Esc</a-typography-text>
|
||||
to exit...
|
||||
</a-typography-paragraph>
|
||||
|
||||
<a-divider />
|
||||
|
||||
<a-typography-title>介绍</a-typography-title>
|
||||
<a-typography-paragraph>
|
||||
蚂蚁的企业级产品是一个庞大且复杂的体系。这类产品不仅量级巨大且功能复杂,而且变动和并发频繁,常常需要设计与开发能够快速的做出响应。同时这类产品中有存在很多类似的页面以及组件,可以通过抽象得到一些稳定且高复用性的内容。
|
||||
</a-typography-paragraph>
|
||||
<a-typography-paragraph>
|
||||
随着商业化的趋势,越来越多的企业级产品对更好的用户体验有了进一步的要求。带着这样的一个终极目标,我们(蚂蚁金服体验技术部)经过大量的项目实践和总结,逐步打磨出一个服务于企业级产品的设计体系
|
||||
Ant Design。基于
|
||||
<a-typography-text mark>『确定』和『自然』</a-typography-text>
|
||||
的设计价值观,通过模块化的解决方案,降低冗余的生产成本,让设计者专注于
|
||||
<a-typography-text strong>更好的用户体验</a-typography-text>
|
||||
。
|
||||
</a-typography-paragraph>
|
||||
<a-typography-title :level="2">设计资源</a-typography-title>
|
||||
<a-typography-paragraph>
|
||||
我们提供完善的设计原则、最佳实践和设计资源文件(
|
||||
<a-typography-text code>Sketch</a-typography-text>
|
||||
和
|
||||
<a-typography-text code>Axure</a-typography-text>
|
||||
),来帮助业务快速设计出高质量的产品原型。
|
||||
</a-typography-paragraph>
|
||||
|
||||
<a-typography-paragraph>
|
||||
<ul>
|
||||
<li>
|
||||
<a-typography-link href="/docs/resources-cn"
|
||||
>设计资源</a-typography-link
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
</a-typography-paragraph>
|
||||
|
||||
<a-typography-paragraph>
|
||||
<blockquote>{{ blockContent }}</blockquote>
|
||||
<pre>{{ blockContent }}</pre>
|
||||
</a-typography-paragraph>
|
||||
|
||||
<a-typography-paragraph>
|
||||
按
|
||||
<a-typography-text keyboard>Esc</a-typography-text>
|
||||
键退出阅读……
|
||||
</a-typography-paragraph>
|
||||
</a-typography>
|
||||
</a-card>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
|
||||
const blockContent = ref<string>(`AntV 是蚂蚁金服全新一代数据可视化解决方案,致力于提供一套简单方便、专业可靠、不限可能的数据可视化最佳实践。得益于丰富的业务场景和用户需求挑战,AntV 经历多年积累与不断打磨,已支撑整个阿里集团内外 20000+ 业务系统,通过了日均千万级 UV 产品的严苛考验。
|
||||
我们正在基础图表,图分析,图编辑,地理空间可视化,智能可视化等各个可视化的领域耕耘,欢迎同路人一起前行。` );
|
||||
|
||||
</script>
|
||||
Reference in New Issue
Block a user