1
1
<!-- modified from https://github.com/IMB11/vitepress-versioning-plugin , original license is MIT-->
2
2
3
3
<script setup lang="ts">
4
- import {onMounted , ref , watch } from ' vue '
5
- import VPMenuLink from ' vitepress/dist/client/theme-default/components/VPMenuLink .vue'
6
- import VPFlyout from ' vitepress/dist/client/theme-default/components/VPFlyout .vue'
7
- import {parse } from " yaml " ;
8
- import {useRoute } from " vitepress " ;
9
- import {changingVersion , currentVersion , isLatest , latestVersion } from " ./version" ;
4
+ import { useRoute } from " vitepress " ;
5
+ import VPFlyout from " vitepress/dist/client/theme-default/components/VPFlyout .vue" ;
6
+ import VPMenuLink from " vitepress/dist/client/theme-default/components/VPMenuLink .vue" ;
7
+ import { computed , onMounted , ref , watch } from " vue " ;
8
+ import { parse } from " yaml " ;
9
+ import { changingVersion , currentVersion , isLatest , isOld , latestVersion } from " ./version" ;
10
10
11
11
// noinspection JSUnusedGlobalSymbols
12
12
const props = defineProps <{
@@ -15,55 +15,65 @@ const props = defineProps<{
15
15
const route = useRoute ();
16
16
17
17
let versionList: string [] = [];
18
+ let oldVersionList: string [] = [];
18
19
const versions = ref <string []>([]);
20
+ const docsPath = computed (() => {
21
+ if (isLatest .value ) {
22
+ return window .location .pathname ;
23
+ } else {
24
+ return window .location .pathname .split (` /${ currentVersion .value }/ ` )[1 ];
25
+ }
26
+ });
19
27
20
28
function refresh() {
21
29
let version = latestVersion .value ;
22
30
let refreshPage = false ;
23
31
isLatest .value = true ;
24
32
25
33
for (const v of versionList ) {
26
- if (window .location .pathname .startsWith (` /${v }/ ` )) {
34
+ if (window .location .pathname .startsWith (` /${ v }/ ` )) {
27
35
version = v ;
28
36
isLatest .value = false ;
29
37
break ;
30
38
}
31
39
}
32
40
33
- if (currentVersion .value !== ' ' && currentVersion .value !== version ) {
41
+ if (currentVersion .value !== " " && currentVersion .value !== version ) {
34
42
refreshPage = true ;
35
43
changingVersion .value = true ;
36
44
}
37
45
38
46
currentVersion .value = version ;
39
47
versions .value = versionList ;
48
+ isOld .value = oldVersionList .includes (version );
40
49
41
50
if (refreshPage ) {
42
- window .location .pathname = isLatest .value ? ' / ' : ` /${version }/ ` ;
51
+ window .location .pathname = isLatest .value ? " / " : ` /${ version }/ ` ;
43
52
window .location .reload ();
44
53
}
45
54
}
46
55
47
56
async function init() {
48
57
changingVersion .value = false ;
49
- const versionDataFileUrl = ` ${window .location .origin }/versions.yml ` ;
58
+ const versionDataFileUrl = ` ${ window .location .origin }/versions.yml ` ;
50
59
const versionDataFileContent = await (await fetch (versionDataFileUrl )).text ();
51
60
const versionData = parse (versionDataFileContent );
52
61
versionList = versionData .versions ;
62
+ oldVersionList = versionData [" old-versions" ];
53
63
latestVersion .value = versionList [0 ];
54
64
versionList .shift ();
55
- refresh ()
65
+ refresh ();
56
66
}
57
67
58
68
const isOpen = ref (false );
59
69
const toggle = () => {
60
70
isOpen .value = ! isOpen .value ;
61
71
};
62
72
63
- onMounted (async () => init ())
73
+ onMounted (async () => init ());
64
74
watch (
65
75
() => route .path ,
66
- () => refresh ()
76
+ () => refresh (),
67
77
);
68
78
</script >
69
79
@@ -73,32 +83,32 @@ watch(
73
83
<div class =" items" >
74
84
<VPMenuLink v-if =" !isLatest" :item =" {
75
85
text: latestVersion,
76
- link: `/../`,
77
- }" />
86
+ link: `/../${docsPath}?from=${currentVersion} `,
87
+ }" />
78
88
<template v-for =" version in versions " :key =" version " >
79
89
<VPMenuLink v-if =" currentVersion != version" :item =" {
80
90
text: version,
81
- link: `${isLatest? '' : '/..'}/${version}/`,
82
- }" />
91
+ link: `${isLatest? '' : '/..'}/${version}/${docsPath}?from=${currentVersion} `,
92
+ }" />
83
93
</template >
84
94
</div >
85
95
</VPFlyout >
86
96
<div v-else class =" VPScreenVersionSwitcher" :class =" { open: isOpen }" >
87
97
<button class =" button" aria-controls =" navbar-group-version" :aria-expanded =" isOpen" @click =" toggle" >
88
- <span class =" button-text" ><span class =" vpi-versioning icon" />Switch Version</span >
89
- <span class =" vpi-plus button-icon" />
98
+ <span class =" button-text" ><span class =" vpi-versioning icon" />Switch Version</span >
99
+ <span class =" vpi-plus button-icon" />
90
100
</button >
91
101
92
102
<div id =" navbar-group-version" class =" items" >
93
103
<VPMenuLink :item =" {
94
104
text: latestVersion,
95
105
link: `${isLatest? '' : '/..'}/`,
96
- }" />
106
+ }" />
97
107
<template v-for =" version in versions " :key =" version " >
98
108
<VPMenuLink :item =" {
99
109
text: version,
100
110
link: `${isLatest? '' : '/..'}/${version}/`,
101
- }" />
111
+ }" />
102
112
</template >
103
113
</div >
104
114
</div >
@@ -116,11 +126,11 @@ watch(
116
126
117
127
<style scoped>
118
128
.VPMenuLink {
119
- font-family : ' Helvetica Neue' , sans-serif ;
129
+ font-family : " Helvetica Neue" , sans-serif ;
120
130
}
121
131
122
132
.VPVersionSwitcher {
123
- font-family : ' Helvetica Neue' , sans-serif ;
133
+ font-family : " Helvetica Neue" , sans-serif ;
124
134
display : flex ;
125
135
align-items : center ;
126
136
}
0 commit comments