11<script >
22import AllDemo from ' ../demo'
33import Header from ' ./header'
4+ import Footer from ' ./footer'
45import zhCN from ' antd/locale-provider/zh_CN'
56import enUS from ' antd/locale-provider/default'
67import sortBy from ' lodash/sortBy'
78import { isZhCN } from ' ../util'
89import { Provider , create } from ' ../../components/_util/store'
910import NProgress from ' nprogress'
10- import debounce from ' lodash/debounce'
11- import addDOMEventListener from ' add-dom-event-listener'
1211
1312const docsList = [
1413 { key: ' introduce' : ' Ant Design of Vue' : ' Ant Design of Vue'
@@ -18,27 +17,6 @@ const docsList = [
1817 { key: ' changelog' : ' Change Log' : ' 更新日志'
1918 { key: ' i18n' : ' Internationalization' : ' 国际化'
2019]
21- function getOffsetTop (element , container = window ) {
22- if (! element) {
23- return 0
24- }
25-
26- if (! element .getClientRects ().length ) {
27- return 0
28- }
29-
30- const rect = element .getBoundingClientRect ()
31-
32- if (rect .width || rect .height ) {
33- if (container === window ) {
34- container = element .ownerDocument .documentElement
35- return rect .top - container .clientTop
36- }
37- return rect .top - container .getBoundingClientRect ().top
38- }
39-
40- return rect .top
41- }
4220
4321export default {
4422 props: {
@@ -83,12 +61,6 @@ export default {
8361 nprogressHiddenStyle .parentNode .removeChild (nprogressHiddenStyle)
8462 }, 0 )
8563 }
86-
87- this .updateHeight ()
88- this .debouncedResize = debounce (() => {
89- this .updateHeight ()
90- }, 200 )
91- this .resizeEvent = addDOMEventListener (window , ' resize' this .debouncedResize )
9264 })
9365 },
9466 watch: {
@@ -98,12 +70,6 @@ export default {
9870 },
9971 },
10072 methods: {
101- updateHeight () {
102- const el = this .$refs .sidebar .$el
103- const offsetTop = getOffsetTop (el)
104- const docHeight = document .documentElement .offsetHeight
105- this .sidebarHeight = docHeight - offsetTop
106- },
10773 addSubMenu () {
10874 if (this .$route .path .indexOf (' /docs/vue/' !== - 1 ) {
10975 this .$nextTick (() => {
@@ -141,10 +107,14 @@ export default {
141107 < / a- anchor>
142108 )
143109 },
144- getDocsMenu (isCN ) {
110+ getDocsMenu (isCN , pagesKey ) {
145111 const docsMenu = []
146- docsList .forEach (({ key, enTitle, title }) => {
112+ docsList .forEach (({ key, enTitle, title }, index ) => {
147113 const k = isCN ? ` ${ key} ` : key
114+ pagesKey .push ({ name: k,
115+ url: ` /ant-design-vue/docs/vue/${ k} `
116+ title: isCN ? title : enTitle,
117+ })
148118 docsMenu .push (< a- menu- item key= {k}>
149119 < router- link to= {` /ant-design-vue/docs/vue/${ k} ` > {isCN ? title : enTitle }< / router- link>
150120 < / a- menu- item> )
@@ -176,7 +146,6 @@ export default {
176146 render () {
177147 const name = this .name
178148 const isCN = isZhCN (name)
179- // name = name.replace(/-cn\/?$/, '')
180149 const titleMap = {}
181150 const menuConfig = {
182151 General: [],
@@ -187,6 +156,9 @@ export default {
187156 Feedback: [],
188157 Other: [],
189158 }
159+ const pagesKey = []
160+ let prevPage = null
161+ let nextPage = null
190162 const searchData = []
191163 for (const [title , d ] of Object .entries (AllDemo)) {
192164 const type = d .type || ' Other'
@@ -196,14 +168,8 @@ export default {
196168 menuConfig[type] = menuConfig[type] || []
197169 menuConfig[type].push (d)
198170 }
171+ const docsMenu = this .getDocsMenu (isCN, pagesKey)
199172 const reName = name .replace (/ -cn\/ ? $ / ' '
200- // const Demo = new Vue({
201- // template: '<demo-component/>',
202- // components: {
203- // 'demo-component': () => import(`../../components/${AllDemo[titleMap[reName]].key}/demo/index.vue`),
204- // },
205- // })
206- // AllDemo[titleMap[reName]]
207173 const MenuGroup = []
208174 for (const [type , menus ] of Object .entries (menuConfig)) {
209175 const MenuItems = []
@@ -215,6 +181,11 @@ export default {
215181 if (isCN) {
216182 key = ` ${ key} `
217183 }
184+ pagesKey .push ({
185+ name: key,
186+ url: ` /ant-design-vue/components/${ key} `
187+ title: isCN ? ` ${ title} ${ subtitle} ` : title,
188+ })
218189 searchData .push ({
219190 title,
220191 subtitle,
@@ -226,29 +197,34 @@ export default {
226197 })
227198 MenuGroup .push (< a- menu- item- group title= {type}> {MenuItems}< / a- menu- item- group> )
228199 }
200+ pagesKey .forEach ((item , index ) => {
201+ if (item .name === name) {
202+ prevPage = pagesKey[index - 1 ]
203+ nextPage = pagesKey[index + 1 ]
204+ }
205+ })
229206 let locale = zhCN
230207 if (! isCN) {
231208 locale = enUS
232209 }
233210 const config = AllDemo[titleMap[reName]]
234211 this .resetDocumentTitle (config, reName, isCN)
235- const { showSideBars , sidebarHeight } = this
212+ const { showSideBars } = this
236213 return (
237214 < div class = ' page-wrapper' >
238215 < Header searchData= {searchData} name= {name}/ >
239216 < a- locale- provider locale= {locale}>
240217 < div class = ' main-wrapper' >
241218 < a- row>
242- < a- col v- show= {showSideBars} style = {{ height : ` ${ sidebarHeight } px ` }} ref= ' sidebar' class = ' site-sidebar' = {4 } xl= {5 } lg= {5 } md= {6 } sm= {8 } xs= {12 }>
219+ < a- col v- show= {showSideBars} ref= ' sidebar' class = ' site-sidebar' = {4 } xl= {5 } lg= {5 } md= {6 } sm= {8 } xs= {12 }>
243220 < div class = ' drawer-mask' = {() => { this .showSideBars = false }}>< / div>
244221 < a- menu
245-
246222 class = ' aside-container menu-site'
247223 selectedKeys= {[name]}
248224 defaultOpenKeys= {[' Components'
249225 inlineIndent= {40 }
250226 mode= ' inline' >
251- {this . getDocsMenu (isCN) }
227+ {docsMenu }
252228 < a- sub- menu title= {` Components(${ searchData .length } ` = ' Components' >
253229 {MenuGroup}
254230 < / a- sub- menu>
@@ -287,12 +263,15 @@ export default {
287263 >< / router- view>
288264 < / div> : ' '
289265 < / div>
266+ < section class = ' prev-next-nav' >
267+ {prevPage ? < router- link class = ' prev-page' = {` ${ prevPage .url } ` > {prevPage .title }< / router- link> : ' '
268+ {nextPage ? < router- link class = ' next-page' = {` ${ nextPage .url } ` > {nextPage .title }< / router- link> : ' '
269+ < / section>
290270 < / a- col>
291271 < / a- row>
292-
293272 < / div>
294273 < / a- locale- provider>
295-
274+ < Footer ref = ' footer ' isCN = {isCN} / >
296275 { name .indexOf (' back-top' === - 1 ? < a- back- top / > : null }
297276 < / div>
298277 )
0 commit comments