|
@@ -8,20 +8,20 @@ import {useRoute} from 'vue-router'
|
|
|
const route = useRoute()
|
|
|
|
|
|
const documentData=ref([])
|
|
|
-// const anchorData=ref([])
|
|
|
const currentNodeKey=ref('')
|
|
|
const defaultActiveId=ref(0)
|
|
|
const isRightFold=ref(false)
|
|
|
const helpDocument=ref({})
|
|
|
const Content=ref('')
|
|
|
let isFirstLoad=true
|
|
|
+const hasAnchorData=ref(false)
|
|
|
|
|
|
let videoList=[]
|
|
|
|
|
|
const businessCode = route.query.bus_code || ''
|
|
|
|
|
|
const treeProp={
|
|
|
- label:'text',
|
|
|
+ label:'AnchorName',
|
|
|
children: 'Child'
|
|
|
}
|
|
|
|
|
@@ -36,11 +36,16 @@ const getDocumentData=()=>{
|
|
|
}
|
|
|
// 获取第一个分类
|
|
|
const getFirstId=(item)=>{
|
|
|
- if(item.Children && item.Children.length>0){
|
|
|
- getFirstId(item.Children[0])
|
|
|
- }else{
|
|
|
- defaultActiveId.value = item.ClassifyId
|
|
|
- }
|
|
|
+ if(!item){
|
|
|
+ hasAnchorData.value=false
|
|
|
+ isRightFold.value=true
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if(item.Children && item.Children.length>0){
|
|
|
+ getFirstId(item.Children[0])
|
|
|
+ }else{
|
|
|
+ defaultActiveId.value = item.ClassifyId
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
const menuChange=(data,node)=>{
|
|
@@ -51,9 +56,16 @@ const getDocument=(id)=>{
|
|
|
if(res.code == 200){
|
|
|
helpDocument.value=res.data || {}
|
|
|
Content.value = helpDocument.value.Content + createBottomHref(helpDocument.value.Recommend)
|
|
|
- if(!(helpDocument.value.Anchor && helpDocument.value.Anchor.length>0)) isRightFold.value=true
|
|
|
- isRightFold.value=false
|
|
|
- nextTick(()=>{
|
|
|
+ if(helpDocument.value?.Anchor?.length>0){
|
|
|
+ isRightFold.value=false
|
|
|
+ hasAnchorData.value=true
|
|
|
+ }else{
|
|
|
+ isRightFold.value=true
|
|
|
+ hasAnchorData.value=false
|
|
|
+ }
|
|
|
+
|
|
|
+ setTimeout(()=>{
|
|
|
+ scrollTopList.value=[]
|
|
|
getScrollTopList(helpDocument.value.Anchor || [])
|
|
|
videoList=document.getElementsByTagName('video') || []
|
|
|
if(videoList && videoList.length>0){
|
|
@@ -62,15 +74,16 @@ const getDocument=(id)=>{
|
|
|
element.addEventListener('play',setVideosStatus(i))
|
|
|
}
|
|
|
}
|
|
|
- })
|
|
|
- window.scrollTo(0, document.getElementById('operation-document-body').offsetTop)
|
|
|
+ },300)
|
|
|
+ if(isFirstLoad){
|
|
|
+ isFirstLoad=false
|
|
|
+ }else{
|
|
|
+ window.scrollTo(0, document.getElementById('operation-document-body').offsetTop)
|
|
|
+ }
|
|
|
}else if(res.code == 4001){
|
|
|
helpDocument.value={}
|
|
|
isRightFold.value=true
|
|
|
- }
|
|
|
- if(isFirstLoad){
|
|
|
- isFirstLoad=false
|
|
|
- return
|
|
|
+ hasAnchorData.value=false
|
|
|
}
|
|
|
|
|
|
})
|
|
@@ -126,10 +139,12 @@ onUnmounted(() => {
|
|
|
})
|
|
|
|
|
|
const getScrollTopList=(list)=>{
|
|
|
- list.map(item =>{
|
|
|
+ list.map(item =>{
|
|
|
+ if(item.AnchorName){
|
|
|
scrollTopList.value.push({key:item.AnchorId,clientRectTop:document.getElementById(item.Anchor).offsetTop+headerHeight.value})
|
|
|
- if(item.Child && item.Child.length>0) getScrollTopList(item.Child || [])
|
|
|
- })
|
|
|
+ }
|
|
|
+ if(item.Child && item.Child.length>0) getScrollTopList(item.Child || [])
|
|
|
+ })
|
|
|
}
|
|
|
const navigate = (e,id)=>{
|
|
|
// 阻止滚动监听,防止右侧节点的定位 被滚动监听干扰
|
|
@@ -197,7 +212,7 @@ const scrollChange=()=>{
|
|
|
</div>
|
|
|
<div class="operation-document-body" id="operation-document-body">
|
|
|
<div class="document-body-left">
|
|
|
- <el-scrollbar style="height: 100%;">
|
|
|
+ <el-scrollbar style="height: calc(100vh - 48px)">
|
|
|
<el-menu class="docuemnt-menu" text-color="#333333" :default-active="defaultActiveId+''">
|
|
|
<template v-for="menuItem in documentData" :key="menuItem.ClassifyId">
|
|
|
<subMenuBox @getDocument="getDocument" v-if="menuItem.Children && menuItem.Children.length>0"
|
|
@@ -236,9 +251,9 @@ const scrollChange=()=>{
|
|
|
</el-tree>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="fold-right-icon" @click="isRightFold=!isRightFold">
|
|
|
- <img src="@/assets/img/icon/fold.png" v-if="!isRightFold" />
|
|
|
- <img src="@/assets/img/icon/unfold.png" v-else />
|
|
|
+ <div class="fold-right-icon" @click="isRightFold=!isRightFold" v-if="hasAnchorData">
|
|
|
+ <img src="@/assets/img/icon/fold.png" v-show="!isRightFold" />
|
|
|
+ <img src="@/assets/img/icon/unfold.png" v-show="isRightFold" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|