Skip to content

Commit 099ffe6

Browse files
qmhcqmhc
committed
chore: init
0 parents  commit 099ffe6

27 files changed

+5954
-0
lines changed

‎.gitignore

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
dist
12+
dist-ssr
13+
*.local
14+
15+
# Editor directories and files
16+
.vscode/*
17+
!.vscode/extensions.json
18+
.idea
19+
.DS_Store
20+
*.suo
21+
*.ntvs*
22+
*.njsproj
23+
*.sln
24+
*.sw?

‎README.md

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
# Demos for Vexip UI

‎layout-with-router/.gitignore

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
dist
12+
dist-ssr
13+
*.local
14+
15+
# Editor directories and files
16+
.vscode/*
17+
!.vscode/extensions.json
18+
.idea
19+
.DS_Store
20+
*.suo
21+
*.ntvs*
22+
*.njsproj
23+
*.sln
24+
*.sw?

‎layout-with-router/.vscode/extensions.json

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"recommendations": ["Vue.volar"]
3+
}

‎layout-with-router/README.md

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
# Layout With Router

‎layout-with-router/auto-imports.d.ts

+4,030
Large diffs are not rendered by default.

‎layout-with-router/components.d.ts

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
// generated by unplugin-vue-components
2+
// We suggest you to commit this file into source control
3+
// Read more: https://github.com/vuejs/core/pull/3399
4+
import '@vue/runtime-core'
5+
6+
export {}
7+
8+
declare module '@vue/runtime-core' {
9+
export interface GlobalComponents {
10+
Layout: typeof import('vexip-ui')['Layout']
11+
RouterLink: typeof import('vue-router')['RouterLink']
12+
RouterView: typeof import('vue-router')['RouterView']
13+
}
14+
}

‎layout-with-router/index.html

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<link rel="icon" type="image/svg+xml" href="/vexip-ui.svg" />
8+
<title>Vexip UI App</title>
9+
</head>
10+
<body>
11+
<div id="app"></div>
12+
<script type="module" src="/src/main.ts"></script>
13+
</body>
14+
</html>

‎layout-with-router/package.json

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
{
2+
"name": "layout-with-router",
3+
"private": true,
4+
"version": "0.0.0",
5+
"type": "module",
6+
"scripts": {
7+
"dev": "vite",
8+
"build": "vue-tsc && vite build",
9+
"preview": "vite preview"
10+
},
11+
"dependencies": {
12+
"@vexip-ui/icons": "^1.0.3",
13+
"vexip-ui": "^2.0.10",
14+
"vue": "^3.2.41",
15+
"vue-router": "^4.1.6"
16+
},
17+
"devDependencies": {
18+
"@vexip-ui/plugins": "^1.2.0",
19+
"@vitejs/plugin-vue": "^3.2.0",
20+
"@vitejs/plugin-vue-jsx": "^2.1.0",
21+
"@vue/runtime-core": "^3.2.41",
22+
"sass": "^1.55.0",
23+
"typescript": "^4.8.4",
24+
"unplugin-auto-import": "^0.11.4",
25+
"unplugin-vue-components": "^0.22.9",
26+
"vite": "^3.2.0",
27+
"vue-tsc": "^1.0.9"
28+
}
29+
}

‎layout-with-router/public/vexip-ui.svg

+36
Loading

‎layout-with-router/src/App.vue

+35
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
<script setup lang="ts">
2+
import { ref, watch } from 'vue'
3+
import { useRouter, useRoute } from 'vue-router'
4+
5+
import type { LayoutExposed } from 'vexip-ui'
6+
7+
const router = useRouter()
8+
const route = useRoute()
9+
10+
const layout = ref<LayoutExposed>()
11+
const active = ref('')
12+
13+
watch(
14+
() => route.fullPath,
15+
() => {
16+
active.value = route.meta.label || 'home'
17+
layout.value?.expandMenuByLabel(active.value)
18+
},
19+
{ immediate: true }
20+
)
21+
</script>
22+
23+
<template>
24+
<Layout
25+
ref="layout"
26+
logo="/vexip-ui.svg"
27+
sign-name="Vexip UI"
28+
:menu-props="{ active, router }"
29+
@menu-select="active = $event"
30+
>
31+
<template #main>
32+
<router-view></router-view>
33+
</template>
34+
</Layout>
35+
</template>

‎layout-with-router/src/global.d.ts

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
/// <reference types="vite/client" />
2+
3+
declare module '*.vue' {
4+
import type { DefineComponent } from 'vue'
5+
const component: DefineComponent<Record<string, unknown>, Record<string, unknown>, any>
6+
export default component
7+
}

‎layout-with-router/src/main.ts

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import './style/index.scss'
2+
3+
import { createApp } from 'vue'
4+
import App from './App.vue'
5+
import { router } from './router'
6+
7+
createApp(App).use(router).mount('#app')

‎layout-with-router/src/router.d.ts

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import type { MenuOptions } from 'vexip-ui'
2+
3+
declare module 'vue-router' {
4+
interface RouteMeta extends Partial<MenuOptions> {
5+
menu?: boolean
6+
}
7+
}
8+
9+
export {}

‎layout-with-router/src/router/index.ts

+67
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
import { createRouter, createWebHistory } from 'vue-router'
2+
3+
import type { RouteRecordRaw } from 'vue-router'
4+
5+
const routes: RouteRecordRaw[] = [
6+
{
7+
path: '/',
8+
redirect: '/home',
9+
meta: {
10+
menu: false
11+
}
12+
},
13+
{
14+
path: '/home',
15+
name: 'Home',
16+
component: () => import('../views/Home.vue'),
17+
meta: {
18+
label: 'home',
19+
name: 'Home',
20+
icon: IHouse
21+
}
22+
},
23+
{
24+
path: '/about',
25+
name: 'About',
26+
component: () => import('../views/About.vue'),
27+
meta: {
28+
label: 'about',
29+
name: 'About',
30+
icon: IUsers
31+
}
32+
},
33+
{
34+
path: '/page',
35+
redirect: './one',
36+
meta: {
37+
label: 'page',
38+
name: 'Page',
39+
icon: IPaperPlane
40+
},
41+
children: [
42+
{
43+
path: 'one',
44+
name: 'PageOne',
45+
component: () => import('../views/PageOne.vue'),
46+
meta: {
47+
label: 'page-one',
48+
name: 'PageOne'
49+
}
50+
},
51+
{
52+
path: 'two',
53+
name: 'PageTwo',
54+
component: () => import('../views/PageTwo.vue'),
55+
meta: {
56+
label: 'page-two',
57+
name: 'PageTwo'
58+
}
59+
}
60+
]
61+
}
62+
]
63+
64+
export const router = createRouter({
65+
history: createWebHistory(import.meta.env.BASE_URL),
66+
routes
67+
})

‎layout-with-router/src/style/common.scss

+31
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
*,
2+
*::before,
3+
*::after {
4+
box-sizing: border-box;
5+
}
6+
7+
:root {
8+
height: 100%;
9+
font-family: var(--vxp-font-family-base);
10+
font-size: var(--vxp-font-size-base);
11+
line-height: var(--vxp-line-height-base);
12+
color: var(--vxp-content-color-base);
13+
font-synthesis: none;
14+
text-rendering: optimizelegibility;
15+
-webkit-font-smoothing: antialiased;
16+
-moz-osx-font-smoothing: grayscale;
17+
}
18+
19+
body {
20+
display: flex;
21+
align-items: center;
22+
justify-content: center;
23+
height: 100%;
24+
padding: 0;
25+
margin: 0;
26+
}
27+
28+
#app {
29+
width: 100%;
30+
height: 100%;
31+
}

‎layout-with-router/src/style/index.scss

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
@use './common.scss';

‎layout-with-router/src/views/About.vue

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<script setup lang="ts">
2+
</script>
3+
4+
<template>
5+
<div class="about">
6+
About
7+
</div>
8+
</template>
9+
10+
<style lang="scss">
11+
</style>

‎layout-with-router/src/views/Home.vue

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<script setup lang="ts">
2+
</script>
3+
4+
<template>
5+
<div class="home">
6+
Home
7+
</div>
8+
</template>
9+
10+
<style lang="scss">
11+
</style>

‎layout-with-router/src/views/PageOne.vue

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<script setup lang="ts">
2+
</script>
3+
4+
<template>
5+
<div class="page-one">
6+
Page One
7+
</div>
8+
</template>
9+
10+
<style lang="scss">
11+
</style>

‎layout-with-router/src/views/PageTwo.vue

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<script setup lang="ts">
2+
</script>
3+
4+
<template>
5+
<div class="page-two">
6+
Page Two
7+
</div>
8+
</template>
9+
10+
<style lang="scss">
11+
</style>

0 commit comments

Comments
 (0)