From 5ed53133de4763dbf360d192324d35674a4e5c52 Mon Sep 17 00:00:00 2001 From: kanghuiyi <1193185379@qq.com> Date: Wed, 31 Mar 2021 10:10:44 +0800 Subject: [PATCH] fix(site): return to the previous step and display the left active menu in the visual box --- packages/varlet-cli/site/mobile/App.vue | 2 +- packages/varlet-cli/site/mobile/main.ts | 9 +++--- packages/varlet-cli/site/pc/App.vue | 39 ++++++++++++++----------- packages/varlet-cli/site/pc/main.ts | 1 + packages/varlet-ui/types/index.d.ts | 2 ++ 5 files changed, 30 insertions(+), 23 deletions(-) diff --git a/packages/varlet-cli/site/mobile/App.vue b/packages/varlet-cli/site/mobile/App.vue index fef83d40880..29dc19ae2a9 100644 --- a/packages/varlet-cli/site/mobile/App.vue +++ b/packages/varlet-cli/site/mobile/App.vue @@ -94,7 +94,7 @@ header { } .router-view__block { - padding: 50px 12px 0; + padding: 50px 12px 10px; } * { diff --git a/packages/varlet-cli/site/mobile/main.ts b/packages/varlet-cli/site/mobile/main.ts index 9d4bc2e716d..65173cd3c75 100644 --- a/packages/varlet-cli/site/mobile/main.ts +++ b/packages/varlet-cli/site/mobile/main.ts @@ -21,8 +21,11 @@ const router = createRouter({ routes, }) -router.beforeEach((to, from) => { +router.beforeEach((to) => { const isPhone = /Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent) + if (!isPhone && window.self === window.top) { + window.location.href = `/#/${to.query.language}/${to.query.path}` + } if (!isPhone) { const pcPath = @@ -33,10 +36,6 @@ router.beforeEach((to, from) => { window.top['enableWatchURL'] = false window.top['router'].replace(pcPath) } - - // if (!isPhone && window.self === window.top) { - // window.location.href = `/#/${to.query.language}/${to.query.path}` - // } }) const app = createApp(App as any) diff --git a/packages/varlet-cli/site/pc/App.vue b/packages/varlet-cli/site/pc/App.vue index 5532f513fc3..b8db96a45a2 100644 --- a/packages/varlet-cli/site/pc/App.vue +++ b/packages/varlet-cli/site/pc/App.vue @@ -106,7 +106,6 @@ export default defineComponent({ const componentName: Ref = ref(null) const title: Ref = ref('') const currentMenuName: Ref = ref('') - const versionList: Ref = ref(['2.10.14', '1.x', '3.x']) const isHideVersion: Ref = ref(true) let refs: HTMLElement = ref(null) const route = useRoute() @@ -115,27 +114,30 @@ export default defineComponent({ const languageList: Ref = ref({}) const isOpenMenu: Ref = ref(false) const path: Ref = ref(null) - + const isBack: Ref = ref(false) const isPhone: Ref = ref(false) - isPhone.value = /Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent) + isPhone.value = /Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent) languageList.value = config.pc.header.language const nav = (element: HTMLElement) => { refs = element } - const judgmentType = () => { - let componentValue = '' - let languageValue = '' - componentValue = window.location.hash.split('/')[2] - languageValue = window.location.hash.split('/')[1] - if (isPhone.value) { - window.location.href = `/mobile.html#/${componentValue}?language=${languageValue}&platform=pc&path=${componentValue}` + const judgmentType = (type) => { + let [, languageValue, componentValue] = window.location.hash.split('/') + + if (type) { + path.value = componentValue + + if (isPhone.value) { + window.location.href = `/mobile.html#/${componentValue}?language=${languageValue}&platform=pc&path=${componentValue}` + } } + let childrenElement = refs.getElementsByClassName('var-cell') let index = menu.value.findIndex((item) => item.doc === componentValue) - path.value = componentValue + if (index !== -1) { childrenElement[index].scrollIntoView({ block: 'center', @@ -143,6 +145,7 @@ export default defineComponent({ }) } } + menu.value = configMenu header.value = configHeader title.value = configTitle @@ -151,26 +154,28 @@ export default defineComponent({ if (item.isTitle) { return false } + isBack.value = false componentName.value = item.nonComponent ? 'home' : item.doc path.value = item.nonComponent ? item.doc : null } const changeLanguage = (key) => { language.value = key - const pathArr = route.fullPath.split('/') - componentName.value = pathArr[pathArr.length - 1] + componentName.value = route.fullPath.split('/')[0] isOpenMenu.value = false } onMounted(() => { - judgmentType() + judgmentType('mounted') }) watch( () => route.path, (to: string) => { - currentMenuName.value = to.slice(to.lastIndexOf('/') + 1) - language.value = to.slice(to.indexOf('#/') + 2, to.lastIndexOf('/')) + let [, languageValue = '', name = ''] = to.split('/') + currentMenuName.value = name + + isBack.value ? judgmentType('') : (isBack.value = true) if (!window['enableWatchURL']) { window['enableWatchURL'] = true @@ -178,6 +183,7 @@ export default defineComponent({ } const currentNonComponent = menu.value.find((c) => c.doc === currentMenuName.value)?.nonComponent ?? false + language.value = languageValue componentName.value = currentNonComponent ? 'home' : currentMenuName.value }, { immediate: true } @@ -190,7 +196,6 @@ export default defineComponent({ componentName, currentMenuName, title, - versionList, isHideVersion, languageList, isOpenMenu, diff --git a/packages/varlet-cli/site/pc/main.ts b/packages/varlet-cli/site/pc/main.ts index e12dea6762e..fbbae4434ad 100644 --- a/packages/varlet-cli/site/pc/main.ts +++ b/packages/varlet-cli/site/pc/main.ts @@ -19,6 +19,7 @@ const router = createRouter({ history: createWebHashHistory(), routes, }) + window['enableWatchURL'] = true window.top['router'] = router diff --git a/packages/varlet-ui/types/index.d.ts b/packages/varlet-ui/types/index.d.ts index 246d534369b..b1f834b6d82 100644 --- a/packages/varlet-ui/types/index.d.ts +++ b/packages/varlet-ui/types/index.d.ts @@ -13,6 +13,7 @@ import { Icon } from './Icon' import { Image } from './Image' import { IndexAnchor } from './IndexAnchor' import { IndexBar } from './IndexBar' +import { Input } from './Input' import { Lazy } from './Lazy' import { Loading } from './Loading' import { Menu } from './Menu' @@ -54,6 +55,7 @@ export { Image, IndexAnchor, IndexBar, + Input, Lazy, Loading, Menu,