Skip to content

Commit 8404c12

Browse files
authored
refactor: refactor AuthLayout to configure the login page more freely (#4294)
1 parent a7d3220 commit 8404c12

31 files changed

Lines changed: 316 additions & 117 deletions

File tree

apps/web-antd/src/layouts/auth.vue

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
<script lang="ts" setup>
2+
import { computed } from 'vue';
3+
4+
import { AuthPageLayout } from '@vben/layouts';
5+
import { preferences } from '@vben/preferences';
6+
7+
import { $t } from '#/locales';
8+
9+
const appName = computed(() => preferences.app.name);
10+
const logo = computed(() => preferences.logo.source);
11+
</script>
12+
13+
<template>
14+
<AuthPageLayout
15+
:app-name="appName"
16+
:logo="logo"
17+
:page-description="$t('authentication.pageDesc')"
18+
:page-title="$t('authentication.pageTitle')"
19+
>
20+
<!-- 自定义工具栏 -->
21+
<!-- <template #toolbar></template> -->
22+
</AuthPageLayout>
23+
</template>

apps/web-antd/src/layouts/index.ts

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
const BasicLayout = () => import('./basic.vue');
2+
const AuthPageLayout = () => import('./auth.vue');
23

34
const IFrameView = () => import('@vben/layouts').then((m) => m.IFrameView);
45

5-
const AuthPageLayout = () =>
6-
import('@vben/layouts').then((m) => m.AuthPageLayout);
7-
86
export { AuthPageLayout, BasicLayout, IFrameView };

apps/web-antd/src/views/dashboard/analytics/analytics-trends.vue

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,12 +55,27 @@ onMounted(() => {
5555
},
5656
trigger: 'axis',
5757
},
58+
// xAxis: {
59+
// axisTick: {
60+
// show: false,
61+
// },
62+
// boundaryGap: false,
63+
// data: Array.from({ length: 18 }).map((_item, index) => `${index + 6}:00`),
64+
// type: 'category',
65+
// },
5866
xAxis: {
5967
axisTick: {
6068
show: false,
6169
},
6270
boundaryGap: false,
6371
data: Array.from({ length: 18 }).map((_item, index) => `${index + 6}:00`),
72+
splitLine: {
73+
lineStyle: {
74+
type: 'solid',
75+
width: 1,
76+
},
77+
show: true,
78+
},
6479
type: 'category',
6580
},
6681
yAxis: [
@@ -69,7 +84,10 @@ onMounted(() => {
6984
show: false,
7085
},
7186
max: 80_000,
72-
87+
splitArea: {
88+
show: true,
89+
},
90+
splitNumber: 4,
7391
type: 'value',
7492
},
7593
],

apps/web-ele/src/layouts/auth.vue

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
<script lang="ts" setup>
2+
import { computed } from 'vue';
3+
4+
import { AuthPageLayout } from '@vben/layouts';
5+
import { preferences } from '@vben/preferences';
6+
7+
import { $t } from '#/locales';
8+
9+
const appName = computed(() => preferences.app.name);
10+
const logo = computed(() => preferences.logo.source);
11+
</script>
12+
13+
<template>
14+
<AuthPageLayout
15+
:app-name="appName"
16+
:logo="logo"
17+
:page-description="$t('authentication.pageDesc')"
18+
:page-title="$t('authentication.pageTitle')"
19+
>
20+
<!-- 自定义工具栏 -->
21+
<!-- <template #toolbar></template> -->
22+
</AuthPageLayout>
23+
</template>

apps/web-ele/src/layouts/index.ts

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
const BasicLayout = () => import('./basic.vue');
2+
const AuthPageLayout = () => import('./auth.vue');
23

34
const IFrameView = () => import('@vben/layouts').then((m) => m.IFrameView);
45

5-
const AuthPageLayout = () =>
6-
import('@vben/layouts').then((m) => m.AuthPageLayout);
7-
86
export { AuthPageLayout, BasicLayout, IFrameView };

apps/web-ele/src/views/dashboard/analytics/analytics-trends.vue

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,12 +55,27 @@ onMounted(() => {
5555
},
5656
trigger: 'axis',
5757
},
58+
// xAxis: {
59+
// axisTick: {
60+
// show: false,
61+
// },
62+
// boundaryGap: false,
63+
// data: Array.from({ length: 18 }).map((_item, index) => `${index + 6}:00`),
64+
// type: 'category',
65+
// },
5866
xAxis: {
5967
axisTick: {
6068
show: false,
6169
},
6270
boundaryGap: false,
6371
data: Array.from({ length: 18 }).map((_item, index) => `${index + 6}:00`),
72+
splitLine: {
73+
lineStyle: {
74+
type: 'solid',
75+
width: 1,
76+
},
77+
show: true,
78+
},
6479
type: 'category',
6580
},
6681
yAxis: [
@@ -69,7 +84,10 @@ onMounted(() => {
6984
show: false,
7085
},
7186
max: 80_000,
72-
87+
splitArea: {
88+
show: true,
89+
},
90+
splitNumber: 4,
7391
type: 'value',
7492
},
7593
],
Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
<script lang="ts" setup>
2+
import { computed } from 'vue';
3+
4+
import { AuthPageLayout } from '@vben/layouts';
5+
import { preferences } from '@vben/preferences';
6+
7+
import { $t } from '#/locales';
8+
9+
const appName = computed(() => preferences.app.name);
10+
const logo = computed(() => preferences.logo.source);
11+
</script>
12+
13+
<template>
14+
<AuthPageLayout
15+
:app-name="appName"
16+
:logo="logo"
17+
:page-description="$t('authentication.pageDesc')"
18+
:page-title="$t('authentication.pageTitle')"
19+
>
20+
<!-- 自定义工具栏 -->
21+
<!-- <template #toolbar></template> -->
22+
</AuthPageLayout>
23+
</template>
Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
const BasicLayout = () => import('./basic.vue');
2+
const AuthPageLayout = () => import('./auth.vue');
23

34
const IFrameView = () => import('@vben/layouts').then((m) => m.IFrameView);
45

5-
const AuthPageLayout = () =>
6-
import('@vben/layouts').then((m) => m.AuthPageLayout);
7-
86
export { AuthPageLayout, BasicLayout, IFrameView };

apps/web-naive/src/views/dashboard/analytics/analytics-trends.vue

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,12 +55,27 @@ onMounted(() => {
5555
},
5656
trigger: 'axis',
5757
},
58+
// xAxis: {
59+
// axisTick: {
60+
// show: false,
61+
// },
62+
// boundaryGap: false,
63+
// data: Array.from({ length: 18 }).map((_item, index) => `${index + 6}:00`),
64+
// type: 'category',
65+
// },
5866
xAxis: {
5967
axisTick: {
6068
show: false,
6169
},
6270
boundaryGap: false,
6371
data: Array.from({ length: 18 }).map((_item, index) => `${index + 6}:00`),
72+
splitLine: {
73+
lineStyle: {
74+
type: 'solid',
75+
width: 1,
76+
},
77+
show: true,
78+
},
6479
type: 'category',
6580
},
6681
yAxis: [
@@ -69,7 +84,10 @@ onMounted(() => {
6984
show: false,
7085
},
7186
max: 80_000,
72-
87+
splitArea: {
88+
show: true,
89+
},
90+
splitNumber: 4,
7391
type: 'value',
7492
},
7593
],

docs/src/en/guide/essentials/settings.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -240,7 +240,7 @@ const defaultPreferences: Preferences = {
240240
theme: {
241241
builtinType: 'default',
242242
colorDestructive: 'hsl(348 100% 61%)',
243-
colorPrimary: 'hsl(231 98% 65%)',
243+
colorPrimary: 'hsl(212 100% 45%)',
244244
colorSuccess: 'hsl(144 57% 58%)',
245245
colorWarning: 'hsl(42 84% 61%)',
246246
mode: 'dark',

0 commit comments

Comments
 (0)