wuhongjian
/
hi-ucs
1
0
Fork 0
Code Issues Pull Requests Projects Releases 10 Wiki Activity

bug+bug+bug

This commit is contained in:
gaoyuanwei 2022-07-18 13:56:27 +08:00
parent aa84a66a0b
commit a168e10105
7 changed files with 926 additions and 756 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
front/src/views/assignCase/components/AssignCaseDetailPage.vue
View File

@ -13,7 +13,7 @@
<div class="assign-case-detail-page-header-son"> <div class="assign-case-detail-page-header-son">
<div <div
class="assign-case-detail-page-header-son-left" class="assign-case-detail-page-header-son-left"
:style="`background:url(${dataFrom.note1})`" :style="`background-image:url(${dataFrom.note1})`"
></div> ></div>
<div class="assign-case-detail-page-header-son-right"> <div class="assign-case-detail-page-header-son-right">
<div class="assign-case-detail-page-header-son-right-title"> <div class="assign-case-detail-page-header-son-right-title">

20
front/src/views/demandCenter/index.vue
View File

@ -17,7 +17,14 @@
</a-layout-sider> </a-layout-sider>
</div> </div>
<div class="right"> <div class="right">
<div class="title">数据需求</div> <div
class="title"
v-if="
!(whoShow1 && whoShow1.itShowXiHaiAn && detailsType === '应用资源')
"
>
数据需求
</div>
<a-list <a-list
class="demo-loadmore-list" class="demo-loadmore-list"
:loading="initLoading" :loading="initLoading"
@ -87,6 +94,7 @@
const pageSize = ref(8) const pageSize = ref(8)
const total = ref() const total = ref()
const showKey = ref(0) const showKey = ref(0)
const whoShow1 = ref(whoShow)
const menuList = [ const menuList = [
{ {
key: '1', key: '1',
@ -179,7 +187,7 @@
}) })
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.main-cont { .main-cont {
margin-top: 64px; margin-top: 64px;
width: 100%; width: 100%;
height: calc(100%-90px); height: calc(100%-90px);
@ -284,11 +292,11 @@
} }
} }
} }
} }
</style> </style>
<style> <style>
body, body,
html { html {
height: unset; height: unset;
} }
</style> </style>

154
front/src/views/detailsAll/AlgorithmDetails.vue
View File

@ -10,77 +10,112 @@
<!-- 头部基本信息 --> <!-- 头部基本信息 -->
<algorithm-top-details :dataList="dataList.data"></algorithm-top-details> <algorithm-top-details :dataList="dataList.data"></algorithm-top-details>
<!-- 导航 --> <!-- 导航 -->
<algorithm-navigation :dataList="dataList.data" :class="{ fixed: scrollTop >= 600 }" :selectNow="selectNow"> <algorithm-navigation
</algorithm-navigation> :dataList="dataList.data"
:class="{ fixed: scrollTop >= 600 }"
:selectNow="selectNow"
></algorithm-navigation>
<!-- 关联能力 --> <!-- 关联能力 -->
<algorithm-associated-ability v-if="!loading" :associatedComponents="associatedComponents" <algorithm-associated-ability
id="algorithm-associated-ability" class="scrollBox"></algorithm-associated-ability> v-if="!loading"
:associatedComponents="associatedComponents"
id="algorithm-associated-ability"
class="scrollBox"
></algorithm-associated-ability>
<!-- 算法展示 视频 --> <!-- 算法展示 视频 -->
<algorithm-display :dataList="dataList.data" id="algorithm-display" class="scrollBox"></algorithm-display> <algorithm-display
:dataList="dataList.data"
id="algorithm-display"
class="scrollBox"
></algorithm-display>
<!-- 算法优势 --> <!-- 算法优势 -->
<algorithm-advantage :dataList="dataList.data" id="algorithm-advantage" class="scrollBox"></algorithm-advantage> <algorithm-advantage
:dataList="dataList.data"
id="algorithm-advantage"
class="scrollBox"
></algorithm-advantage>
<!-- 应用场景和应用案例 --> <!-- 应用场景和应用案例 -->
<!-- <application-scenarios-and-case <!-- <application-scenarios-and-case
id="application-scenarios-and-case" id="application-scenarios-and-case"
class="scrollBox" class="scrollBox"
></application-scenarios-and-case> --> ></application-scenarios-and-case> -->
<algorithm-application-scenarios :dataList="dataList.data" id="application-scenarios" class="scrollBox"> <algorithm-application-scenarios
</algorithm-application-scenarios> :dataList="dataList.data"
<algorithm-application-case :dataList="dataList.data" id="application-case" class="scrollBox"> id="application-scenarios"
</algorithm-application-case> class="scrollBox"
></algorithm-application-scenarios>
<algorithm-application-case
:dataList="dataList.data"
id="application-case"
class="scrollBox"
></algorithm-application-case>
<!-- 算法试用 --> <!-- 算法试用 -->
<algorithm-on-trial :dataList="dataList.data" id="algorithm-on-trial" class="scrollBox"></algorithm-on-trial> <algorithm-on-trial
:dataList="dataList.data"
id="algorithm-on-trial"
class="scrollBox"
></algorithm-on-trial>
<!-- 计费标准 --> <!-- 计费标准 -->
<algorithm-charging-standard :dataList="dataList.data" id="charging-standard" class="scrollBox"> <algorithm-charging-standard
</algorithm-charging-standard> :dataList="dataList.data"
id="charging-standard"
class="scrollBox"
></algorithm-charging-standard>
<!-- 使用方式 --> <!-- 使用方式 -->
<algorithm-usage-mode :dataList="dataList.data" id="usage-mode" class="scrollBox"></algorithm-usage-mode> <algorithm-usage-mode
:dataList="dataList.data"
id="usage-mode"
class="scrollBox"
></algorithm-usage-mode>
<!-- 常见问题--> <!-- 常见问题-->
<algorithm-common-problem :dataList="dataList.data" id="common-problem" class="scrollBox"> <algorithm-common-problem
</algorithm-common-problem> :dataList="dataList.data"
id="common-problem"
class="scrollBox"
></algorithm-common-problem>
</div> </div>
</template> </template>
<script setup> <script setup>
import AlgorithmTopDetails from '@/views/detailsAll/components/Algorithm/AlgorithmTopDetails.vue' import AlgorithmTopDetails from '@/views/detailsAll/components/Algorithm/AlgorithmTopDetails.vue'
import AlgorithmAssociatedAbility from '@/views/detailsAll/components/Algorithm/AlgorithmAssociatedAbility.vue' import AlgorithmAssociatedAbility from '@/views/detailsAll/components/Algorithm/AlgorithmAssociatedAbility.vue'
import AlgorithmNavigation from '@/views/detailsAll/components/Algorithm/AlgorithmNavigation.vue' import AlgorithmNavigation from '@/views/detailsAll/components/Algorithm/AlgorithmNavigation.vue'
import AlgorithmDisplay from '@/views/detailsAll/components/Algorithm/AlgorithmDisplay.vue' import AlgorithmDisplay from '@/views/detailsAll/components/Algorithm/AlgorithmDisplay.vue'
import AlgorithmAdvantage from '@/views/detailsAll/components/Algorithm/AlgorithmAdvantage.vue' import AlgorithmAdvantage from '@/views/detailsAll/components/Algorithm/AlgorithmAdvantage.vue'
import AlgorithmOnTrial from '@/views/detailsAll/components/Algorithm/AlgorithmOnTrial.vue' import AlgorithmOnTrial from '@/views/detailsAll/components/Algorithm/AlgorithmOnTrial.vue'
import AlgorithmApplicationScenarios from '@/views/detailsAll/components/Algorithm/AlgorithmApplicationScenarios' import AlgorithmApplicationScenarios from '@/views/detailsAll/components/Algorithm/AlgorithmApplicationScenarios'
import AlgorithmApplicationCase from '@/views/detailsAll/components/Algorithm/AlgorithmApplicationCase' import AlgorithmApplicationCase from '@/views/detailsAll/components/Algorithm/AlgorithmApplicationCase'
import AlgorithmUsageMode from '@/views/detailsAll/components/Algorithm/AlgorithmUsageMode' //使用方式 import AlgorithmUsageMode from '@/views/detailsAll/components/Algorithm/AlgorithmUsageMode' //使用方式
import AlgorithmChargingStandard from '@/views/detailsAll/components/Algorithm/AlgorithmChargingStandard' //计费标准 import AlgorithmChargingStandard from '@/views/detailsAll/components/Algorithm/AlgorithmChargingStandard' //计费标准
import AlgorithmCommonProblem from '@/views/detailsAll/components/Algorithm/AlgorithmCommonProblem' //常见问题 import AlgorithmCommonProblem from '@/views/detailsAll/components/Algorithm/AlgorithmCommonProblem' //常见问题
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue' import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { import {
updateVisits, updateVisits,
selectOne, selectOne,
queryPartAppByKeyId2, queryPartAppByKeyId2,
browsingInsert, browsingInsert,
} from '@/api/home' } from '@/api/home'
import mybus from '@/myplugins/mybus' import mybus from '@/myplugins/mybus'
const router = useRouter() const router = useRouter()
const scrollTop = ref(0) const scrollTop = ref(0)
const domArr = ref([]) const domArr = ref([])
const loading = ref(true) const loading = ref(true)
const selectNow = ref('') const selectNow = ref('')
const dataList = reactive({ data: {} }) const dataList = reactive({ data: {} })
const id = router.currentRoute.value.query.id const id = router.currentRoute.value.query.id
const obj = JSON.parse(window.sessionStorage.getItem('preview')) const obj = JSON.parse(window.sessionStorage.getItem('preview'))
const associatedComponents = ref([{ type: '应用资源', dataList: [] }]) const associatedComponents = ref([{ type: '应用资源', dataList: [] }])
document.documentElement.style.transition = 'all 0.3s ease' document.documentElement.style.transition = 'all 0.3s ease'
document.documentElement.scrollTop = 0 document.documentElement.scrollTop = 0
document.body.style.transition = 'all 0.3s ease' document.body.style.transition = 'all 0.3s ease'
document.body.scrollTop = 0 document.body.scrollTop = 0
mybus.on('flyToView', (id) => { mybus.on('flyToView', (id) => {
let top = document.querySelector('#' + id).offsetTop - 50 let top = document.querySelector('#' + id).offsetTop - 50
// console.log(top, document.querySelector('#' + id).offsetTop) // console.log(top, document.querySelector('#' + id).offsetTop)
document.documentElement.scrollTop = top document.documentElement.scrollTop = top
document.body.scrollTop = top document.body.scrollTop = top
}) })
onMounted(() => { onMounted(() => {
// console.clear() // console.clear()
window.addEventListener('scroll', () => { window.addEventListener('scroll', () => {
domArr.value = document.querySelectorAll('.scrollBox') domArr.value = document.querySelectorAll('.scrollBox')
@ -105,9 +140,9 @@ onMounted(() => {
} }
} }
}) })
}) })
const init = (id) => { const init = (id) => {
console.log(id, '-------------------------------------------------') console.log(id, '-------------------------------------------------')
if (id) { if (id) {
selectOne(id).then((res) => { selectOne(id).then((res) => {
@ -148,21 +183,22 @@ const init = (id) => {
dataList.data = obj dataList.data = obj
console.log('预览==============', obj) console.log('预览==============', obj)
} }
} }
init(id) init(id)
onBeforeUnmount(() => { onBeforeUnmount(() => {
mybus.off('flyToView') mybus.off('flyToView')
}) })
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.fixed { .fixed {
position: fixed; position: fixed;
z-index: 2000; z-index: 2000;
top: 0; top: 0;
left: 0; left: 50%;
} margin-left: -9.56rem;
}
.fixed2>div:nth-of-type(3) { .fixed2 > div:nth-of-type(3) {
margin-top: 0.84rem; margin-top: 0.84rem;
} }
</style> </style>

159
front/src/views/detailsAll/ApplicationDetails.vue
View File

@ -8,77 +8,109 @@
<template> <template>
<div class="application-details" :class="{ fixed2: scrollTop >= 600 }"> <div class="application-details" :class="{ fixed2: scrollTop >= 600 }">
<!-- 头部基本信息 --> <!-- 头部基本信息 -->
<application-top-details :dataList="dataList.data"></application-top-details> <application-top-details
:dataList="dataList.data"
></application-top-details>
<!-- 导航 --> <!-- 导航 -->
<application-navigation :dataList="dataList.data" :associatedComponents="associatedComponents" <application-navigation
:class="{ fixed: scrollTop >= 600 }" :selectNow="selectNow"></application-navigation> :dataList="dataList.data"
:associatedComponents="associatedComponents"
:class="{ fixed: scrollTop >= 600 }"
:selectNow="selectNow"
></application-navigation>
<!-- 关联能力 --> <!-- 关联能力 -->
<application-associated-ability v-if="!loading" :associatedComponents="associatedComponents" <application-associated-ability
id="application-associated-ability" class="scrollBox"></application-associated-ability> v-if="!loading"
:associatedComponents="associatedComponents"
id="application-associated-ability"
class="scrollBox"
></application-associated-ability>
<!-- 应用展示 视频 --> <!-- 应用展示 视频 -->
<application-presentation :dataList="dataList.data" id="application-presentation" class="scrollBox"> <application-presentation
</application-presentation> :dataList="dataList.data"
id="application-presentation"
class="scrollBox"
></application-presentation>
<!-- 关联组件 --> <!-- 关联组件 -->
<application-associated-components :dataList="dataList.data" id="application-associated-components" <application-associated-components
class="scrollBox" v-if="false"></application-associated-components> :dataList="dataList.data"
id="application-associated-components"
class="scrollBox"
v-if="false"
></application-associated-components>
<!-- 功能介绍--> <!-- 功能介绍-->
<application-function-intorduction :dataList="dataList.data" id="function-introduction" class="scrollBox"> <application-function-intorduction
</application-function-intorduction> :dataList="dataList.data"
id="function-introduction"
class="scrollBox"
></application-function-intorduction>
<!-- 使用能力 --> <!-- 使用能力 -->
<application-ability-toise :dataList="dataList.data" id="ability-to-use" class="scrollBox"> <application-ability-toise
</application-ability-toise> :dataList="dataList.data"
id="ability-to-use"
class="scrollBox"
></application-ability-toise>
<!-- 部署与安全--> <!-- 部署与安全-->
<application-deployment-and-security :dataList="dataList.data" id="deployment-and-security" class="scrollBox"> <application-deployment-and-security
</application-deployment-and-security> :dataList="dataList.data"
id="deployment-and-security"
class="scrollBox"
></application-deployment-and-security>
<!-- 归属部门与服务商--> <!-- 归属部门与服务商-->
<application-owning-department-and-service-provider :dataList="dataList.data" id="department-and-service-provider" <application-owning-department-and-service-provider
class="scrollBox"></application-owning-department-and-service-provider> :dataList="dataList.data"
id="department-and-service-provider"
class="scrollBox"
></application-owning-department-and-service-provider>
<!-- 常见问题--> <!-- 常见问题-->
<application-common-problem :dataList="dataList.data" id="common-problem" class="scrollBox"> <application-common-problem
</application-common-problem> :dataList="dataList.data"
id="common-problem"
class="scrollBox"
></application-common-problem>
</div> </div>
</template> </template>
<script setup> <script setup>
import ApplicationAbilityToise from '@/views/detailsAll/components/Application/ApplicationAbilityToise.vue' import ApplicationAbilityToise from '@/views/detailsAll/components/Application/ApplicationAbilityToise.vue'
import ApplicationAssociatedComponents from '@/views/detailsAll/components/Application/ApplicationAssociatedComponents.vue' import ApplicationAssociatedComponents from '@/views/detailsAll/components/Application/ApplicationAssociatedComponents.vue'
import ApplicationAssociatedAbility from '@/views/detailsAll/components/Application/ApplicationAssociatedAbility.vue' import ApplicationAssociatedAbility from '@/views/detailsAll/components/Application/ApplicationAssociatedAbility.vue'
import ApplicationOwningDepartmentAndServiceProvider from '@/views/detailsAll/components/Application/ApplicationOwningDepartmentAndServiceProvider.vue' import ApplicationOwningDepartmentAndServiceProvider from '@/views/detailsAll/components/Application/ApplicationOwningDepartmentAndServiceProvider.vue'
import ApplicationFunctionIntorduction from '@/views/detailsAll/components/Application/ApplicationFunctionIntorduction.vue' import ApplicationFunctionIntorduction from '@/views/detailsAll/components/Application/ApplicationFunctionIntorduction.vue'
import ApplicationDeploymentAndSecurity from '@/views/detailsAll/components/Application/ApplicationDeploymentAndSecurity.vue' import ApplicationDeploymentAndSecurity from '@/views/detailsAll/components/Application/ApplicationDeploymentAndSecurity.vue'
import ApplicationTopDetails from '@/views/detailsAll/components/Application/ApplicationTopDetails.vue' import ApplicationTopDetails from '@/views/detailsAll/components/Application/ApplicationTopDetails.vue'
import ApplicationNavigation from '@/views/detailsAll/components/Application/ApplicationNavigation.vue' import ApplicationNavigation from '@/views/detailsAll/components/Application/ApplicationNavigation.vue'
import ApplicationPresentation from '@/views/detailsAll/components/Application/ApplicationPresentation.vue' import ApplicationPresentation from '@/views/detailsAll/components/Application/ApplicationPresentation.vue'
import ApplicationCommonProblem from '@/views/detailsAll/components/Application/ApplicationCommonProblem' //常见问题 import ApplicationCommonProblem from '@/views/detailsAll/components/Application/ApplicationCommonProblem' //常见问题
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue' import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { import {
updateVisits, updateVisits,
selectOne, selectOne,
queryPartAppByKeyId, queryPartAppByKeyId,
browsingInsert, browsingInsert,
} from '@/api/home' } from '@/api/home'
import mybus from '@/myplugins/mybus' import mybus from '@/myplugins/mybus'
const associatedComponents = ref([{ type: '组件服务', dataList: [] }]) const associatedComponents = ref([{ type: '组件服务', dataList: [] }])
let loading = ref(true) let loading = ref(true)
const router = useRouter() const router = useRouter()
const scrollTop = ref(0) const scrollTop = ref(0)
const domArr = ref([]) const domArr = ref([])
const selectNow = ref('') const selectNow = ref('')
const dataList = reactive({ data: {} }) const dataList = reactive({ data: {} })
const id = router.currentRoute.value.query.id const id = router.currentRoute.value.query.id
const obj = JSON.parse(window.sessionStorage.getItem('preview')) const obj = JSON.parse(window.sessionStorage.getItem('preview'))
document.documentElement.style.transition = 'all 0.3s ease' document.documentElement.style.transition = 'all 0.3s ease'
document.documentElement.scrollTop = 0 document.documentElement.scrollTop = 0
document.body.style.transition = 'all 0.3s ease' document.body.style.transition = 'all 0.3s ease'
document.body.scrollTop = 0 document.body.scrollTop = 0
mybus.on('flyToView', (id) => { mybus.on('flyToView', (id) => {
let top = document.querySelector('#' + id).offsetTop - 50 let top = document.querySelector('#' + id).offsetTop - 50
// console.log(top, document.querySelector('#' + id).offsetTop-50) // console.log(top, document.querySelector('#' + id).offsetTop-50)
document.documentElement.scrollTop = top document.documentElement.scrollTop = top
document.body.scrollTop = top document.body.scrollTop = top
}) })
onMounted(() => { onMounted(() => {
// console.clear() // console.clear()
window.addEventListener('scroll', () => { window.addEventListener('scroll', () => {
domArr.value = document.querySelectorAll('.scrollBox') domArr.value = document.querySelectorAll('.scrollBox')
@ -103,9 +135,9 @@ onMounted(() => {
} }
} }
}) })
}) })
const init = (id) => { const init = (id) => {
if (id) { if (id) {
selectOne(id).then((res) => { selectOne(id).then((res) => {
// console.clear() // console.clear()
@ -150,8 +182,8 @@ const init = (id) => {
dataList.data = obj dataList.data = obj
console.log('预览==============', obj) console.log('预览==============', obj)
} }
} }
const associatedComponentsFunction = () => { const associatedComponentsFunction = () => {
if ( if (
associatedComponents.value[0].dataList.length > 0 || associatedComponents.value[0].dataList.length > 0 ||
associatedComponents.value[1].dataList.length > 0 || associatedComponents.value[1].dataList.length > 0 ||
@ -159,21 +191,22 @@ const associatedComponentsFunction = () => {
) { ) {
return associatedComponents.value return associatedComponents.value
} }
} }
init(id) init(id)
onBeforeUnmount(() => { onBeforeUnmount(() => {
mybus.off('flyToView') mybus.off('flyToView')
}) })
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.fixed { .fixed {
position: fixed; position: fixed;
z-index: 2000; z-index: 2000;
top: 0; top: 0;
left: 0; left: 50%;
} margin-left: -9.56rem;
}
.fixed2>div:nth-of-type(3) { .fixed2 > div:nth-of-type(3) {
margin-top: 0.84rem; margin-top: 0.84rem;
} }
</style> </style>

139
front/src/views/detailsAll/BusinessDetails.vue
View File

@ -10,68 +10,96 @@
<!-- 头部基本信息 --> <!-- 头部基本信息 -->
<business-top-details :dataList="dataList.data"></business-top-details> <business-top-details :dataList="dataList.data"></business-top-details>
<!-- 导航 --> <!-- 导航 -->
<business-navigation :dataList="dataList.data" :associatedComponents="associatedComponents" <business-navigation
:class="{ fixed: scrollTop >= 600 }" :selectNow="selectNow"></business-navigation> :dataList="dataList.data"
:associatedComponents="associatedComponents"
:class="{ fixed: scrollTop >= 600 }"
:selectNow="selectNow"
></business-navigation>
<!-- 关联能力 --> <!-- 关联能力 -->
<business-associated-ability v-if="!loading" :associatedComponents="associatedComponents" <business-associated-ability
id="business-associated-ability" class="scrollBox"></business-associated-ability> v-if="!loading"
:associatedComponents="associatedComponents"
id="business-associated-ability"
class="scrollBox"
></business-associated-ability>
<!-- 组件展示 --> <!-- 组件展示 -->
<business-presentation :dataList="dataList.data" id="business-presentation" class="scrollBox"> <business-presentation
</business-presentation> :dataList="dataList.data"
id="business-presentation"
class="scrollBox"
></business-presentation>
<!-- 功能介绍--> <!-- 功能介绍-->
<business-function-intorduction :dataList="dataList.data" id="function-introduction" class="scrollBox"> <business-function-intorduction
</business-function-intorduction> :dataList="dataList.data"
id="function-introduction"
class="scrollBox"
></business-function-intorduction>
<!-- 应用场景 --> <!-- 应用场景 -->
<business-application-scenarios :dataList="dataList.data" id="application-scenarios" class="scrollBox"> <business-application-scenarios
</business-application-scenarios> :dataList="dataList.data"
id="application-scenarios"
class="scrollBox"
></business-application-scenarios>
<!-- 应用案例 --> <!-- 应用案例 -->
<business-application-case :dataList="dataList.data" id="application-case" class="scrollBox"> <business-application-case
</business-application-case> :dataList="dataList.data"
id="application-case"
class="scrollBox"
></business-application-case>
<!-- 使用方式 --> <!-- 使用方式 -->
<business-usage-mode :dataList="dataList.data" id="business-usage-mode" class="scrollBox"></business-usage-mode> <business-usage-mode
:dataList="dataList.data"
id="business-usage-mode"
class="scrollBox"
></business-usage-mode>
<!-- 常见问题--> <!-- 常见问题-->
<business-common-problem :dataList="dataList.data" id="common-problem" class="scrollBox"></business-common-problem> <business-common-problem
:dataList="dataList.data"
id="common-problem"
class="scrollBox"
></business-common-problem>
</div> </div>
</template> </template>
<script setup> <script setup>
import BusinessApplicationCase from '@/views/detailsAll/components/Business/BusinessApplicationCase.vue' // 应用案例 import BusinessApplicationCase from '@/views/detailsAll/components/Business/BusinessApplicationCase.vue' // 应用案例
import BusinessAssociatedAbility from '@/views/detailsAll/components/Business/BusinessAssociatedAbility.vue' import BusinessAssociatedAbility from '@/views/detailsAll/components/Business/BusinessAssociatedAbility.vue'
import BusinessApplicationScenarios from '@/views/detailsAll/components/Business/BusinessApplicationScenarios.vue' // 应用场景 import BusinessApplicationScenarios from '@/views/detailsAll/components/Business/BusinessApplicationScenarios.vue' // 应用场景
import BusinessFunctionIntorduction from '@/views/detailsAll/components/Business/BusinessFunctionIntorduction.vue' // 功能介绍 import BusinessFunctionIntorduction from '@/views/detailsAll/components/Business/BusinessFunctionIntorduction.vue' // 功能介绍
import BusinessTopDetails from '@/views/detailsAll/components/Business/BusinessTopDetails.vue' // 头部基本信息 import BusinessTopDetails from '@/views/detailsAll/components/Business/BusinessTopDetails.vue' // 头部基本信息
import BusinessNavigation from '@/views/detailsAll/components/Business/BusinessNavigation.vue' //导航条 import BusinessNavigation from '@/views/detailsAll/components/Business/BusinessNavigation.vue' //导航条
import BusinessPresentation from '@/views/detailsAll/components/Business/BusinessPresentation.vue' //组件展示 import BusinessPresentation from '@/views/detailsAll/components/Business/BusinessPresentation.vue' //组件展示
import BusinessUsageMode from '@/views/detailsAll/components/Business/BusinessUsageMode.vue' //使用方式 import BusinessUsageMode from '@/views/detailsAll/components/Business/BusinessUsageMode.vue' //使用方式
import BusinessCommonProblem from '@/views/detailsAll/components/Business/BusinessCommonProblem' //常见问题 import BusinessCommonProblem from '@/views/detailsAll/components/Business/BusinessCommonProblem' //常见问题
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue' import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { import {
updateVisits, updateVisits,
selectOne, selectOne,
queryPartAppByKeyId2, queryPartAppByKeyId2,
browsingInsert, browsingInsert,
} from '@/api/home' } from '@/api/home'
import mybus from '@/myplugins/mybus' import mybus from '@/myplugins/mybus'
const router = useRouter() const router = useRouter()
const scrollTop = ref(0) const scrollTop = ref(0)
const domArr = ref([]) const domArr = ref([])
const selectNow = ref('') const selectNow = ref('')
const dataList = reactive({ data: {} }) const dataList = reactive({ data: {} })
const id = router.currentRoute.value.query.id const id = router.currentRoute.value.query.id
const obj = JSON.parse(window.sessionStorage.getItem('preview')) const obj = JSON.parse(window.sessionStorage.getItem('preview'))
const associatedComponents = ref([{ type: '应用资源', dataList: [] }]) const associatedComponents = ref([{ type: '应用资源', dataList: [] }])
let loading = ref(true) let loading = ref(true)
document.documentElement.style.transition = 'all 0.3s ease' document.documentElement.style.transition = 'all 0.3s ease'
document.documentElement.scrollTop = 0 document.documentElement.scrollTop = 0
document.body.style.transition = 'all 0.3s ease' document.body.style.transition = 'all 0.3s ease'
document.body.scrollTop = 0 document.body.scrollTop = 0
mybus.on('flyToView', (id) => { mybus.on('flyToView', (id) => {
let top = document.querySelector('#' + id).offsetTop - 50 let top = document.querySelector('#' + id).offsetTop - 50
// console.log(top, document.querySelector('#' + id).offsetTop) // console.log(top, document.querySelector('#' + id).offsetTop)
document.documentElement.scrollTop = top document.documentElement.scrollTop = top
document.body.scrollTop = top document.body.scrollTop = top
}) })
onMounted(() => { onMounted(() => {
// console.clear() // console.clear()
window.addEventListener('scroll', () => { window.addEventListener('scroll', () => {
domArr.value = document.querySelectorAll('.scrollBox') domArr.value = document.querySelectorAll('.scrollBox')
@ -96,9 +124,9 @@ onMounted(() => {
} }
} }
}) })
}) })
const init = (id) => { const init = (id) => {
if (id) { if (id) {
selectOne(id).then((res) => { selectOne(id).then((res) => {
// console.clear() // console.clear()
@ -138,21 +166,22 @@ const init = (id) => {
dataList.data = obj dataList.data = obj
console.log('预览==============', obj) console.log('预览==============', obj)
} }
} }
init(id) init(id)
onBeforeUnmount(() => { onBeforeUnmount(() => {
mybus.off('flyToView') mybus.off('flyToView')
}) })
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.fixed { .fixed {
position: fixed; position: fixed;
z-index: 2000; z-index: 2000;
top: 0; top: 0;
left: 0; left: 50%;
} margin-left: -9.56rem;
}
.fixed2>div:nth-of-type(3) { .fixed2 > div:nth-of-type(3) {
margin-top: 0.84rem; margin-top: 0.84rem;
} }
</style> </style>

155
front/src/views/detailsAll/DeveloperComponents.vue
View File

@ -10,73 +10,103 @@
<!-- 头部基本信息 --> <!-- 头部基本信息 -->
<developer-top-details :dataList="dataList.data"></developer-top-details> <developer-top-details :dataList="dataList.data"></developer-top-details>
<!-- 导航 --> <!-- 导航 -->
<developer-navigation :dataList="dataList.data" :associatedComponents="associatedComponentsFunction()" <developer-navigation
:class="{ fixed: scrollTop >= 600 }" :selectNow="selectNow"></developer-navigation> :dataList="dataList.data"
:associatedComponents="associatedComponentsFunction()"
:class="{ fixed: scrollTop >= 600 }"
:selectNow="selectNow"
></developer-navigation>
<!-- 关联能力 --> <!-- 关联能力 -->
<developer-associated-ability v-if="!loading" :associatedComponents="associatedComponents" <developer-associated-ability
id="developer-associated-ability" class="scrollBox"></developer-associated-ability> v-if="!loading"
:associatedComponents="associatedComponents"
id="developer-associated-ability"
class="scrollBox"
></developer-associated-ability>
<!-- 组件展示 视频 --> <!-- 组件展示 视频 -->
<Developer-presentation :dataList="dataList.data" id="eveloper-presentation" class="scrollBox"> <Developer-presentation
</Developer-presentation> :dataList="dataList.data"
id="eveloper-presentation"
class="scrollBox"
></Developer-presentation>
<!-- 功能介绍--> <!-- 功能介绍-->
<developer-function-intorduction :dataList="dataList.data" id="function-introduction" class="scrollBox"> <developer-function-intorduction
</developer-function-intorduction> :dataList="dataList.data"
id="function-introduction"
class="scrollBox"
></developer-function-intorduction>
<!-- 应用场景 --> <!-- 应用场景 -->
<developer-application-scenarios :dataList="dataList.data" id="application-scenarios" class="scrollBox"> <developer-application-scenarios
</developer-application-scenarios> :dataList="dataList.data"
id="application-scenarios"
class="scrollBox"
></developer-application-scenarios>
<!-- 应用案例 --> <!-- 应用案例 -->
<developer-application-case :dataList="dataList.data" id="application-case" class="scrollBox"> <developer-application-case
</developer-application-case> :dataList="dataList.data"
id="application-case"
class="scrollBox"
></developer-application-case>
<!-- 组件试用 --> <!-- 组件试用 -->
<developer-trial :dataList="dataList.data" id="developer-trial" class="scrollBox"></developer-trial> <developer-trial
:dataList="dataList.data"
id="developer-trial"
class="scrollBox"
></developer-trial>
<!-- 归属部门与服务商--> <!-- 归属部门与服务商-->
<developer-owning-department-and-service-provider :dataList="dataList.data" id="department-and-service-provider" <developer-owning-department-and-service-provider
class="scrollBox"></developer-owning-department-and-service-provider> :dataList="dataList.data"
id="department-and-service-provider"
class="scrollBox"
></developer-owning-department-and-service-provider>
<!-- 常见问题--> <!-- 常见问题-->
<developer-common-problem :dataList="dataList.data" id="common-problem" class="scrollBox"> <developer-common-problem
</developer-common-problem> :dataList="dataList.data"
id="common-problem"
class="scrollBox"
></developer-common-problem>
</div> </div>
</template> </template>
<script setup> <script setup>
import DeveloperApplicationScenarios from '@/views/detailsAll/components/Developer/DeveloperApplicationScenarios.vue' //应用场景 import DeveloperApplicationScenarios from '@/views/detailsAll/components/Developer/DeveloperApplicationScenarios.vue' //应用场景
import DeveloperAssociatedAbility from '@/views/detailsAll/components/Developer/DeveloperAssociatedAbility.vue' import DeveloperAssociatedAbility from '@/views/detailsAll/components/Developer/DeveloperAssociatedAbility.vue'
import DeveloperOwningDepartmentAndServiceProvider from '@/views/detailsAll/components/Developer/DeveloperOwningDepartmentAndServiceProvider.vue' //使用方式 import DeveloperOwningDepartmentAndServiceProvider from '@/views/detailsAll/components/Developer/DeveloperOwningDepartmentAndServiceProvider.vue' //使用方式
import DeveloperFunctionIntorduction from '@/views/detailsAll/components/Developer/DeveloperFunctionIntorduction.vue' //功能介绍 import DeveloperFunctionIntorduction from '@/views/detailsAll/components/Developer/DeveloperFunctionIntorduction.vue' //功能介绍
import DeveloperApplicationCase from '@/views/detailsAll/components/Developer/DeveloperApplicationCase' //应用案例 import DeveloperApplicationCase from '@/views/detailsAll/components/Developer/DeveloperApplicationCase' //应用案例
import DeveloperTopDetails from '@/views/detailsAll/components/Developer/DeveloperTopDetails.vue' //头部基本信息 import DeveloperTopDetails from '@/views/detailsAll/components/Developer/DeveloperTopDetails.vue' //头部基本信息
import DeveloperNavigation from '@/views/detailsAll/components/Developer/DeveloperNavigation.vue' import DeveloperNavigation from '@/views/detailsAll/components/Developer/DeveloperNavigation.vue'
import DeveloperPresentation from '@/views/detailsAll/components/Developer/DeveloperPresentation.vue' //组件展示 import DeveloperPresentation from '@/views/detailsAll/components/Developer/DeveloperPresentation.vue' //组件展示
import DeveloperCommonProblem from '@/views/detailsAll/components/Developer/DeveloperCommonProblem' //常见问题 import DeveloperCommonProblem from '@/views/detailsAll/components/Developer/DeveloperCommonProblem' //常见问题
import DeveloperTrial from '@/views/detailsAll/components/Developer/DeveloperTrial' //组件试用 import DeveloperTrial from '@/views/detailsAll/components/Developer/DeveloperTrial' //组件试用
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue' import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { import {
updateVisits, updateVisits,
selectOne, selectOne,
queryPartAppByKeyId2, queryPartAppByKeyId2,
browsingInsert, browsingInsert,
} from '@/api/home' } from '@/api/home'
import mybus from '@/myplugins/mybus' import mybus from '@/myplugins/mybus'
const router = useRouter() const router = useRouter()
const scrollTop = ref(0) const scrollTop = ref(0)
const domArr = ref([]) const domArr = ref([])
const selectNow = ref('') const selectNow = ref('')
const dataList = reactive({ data: {} }) const dataList = reactive({ data: {} })
const id = router.currentRoute.value.query.id const id = router.currentRoute.value.query.id
const obj = JSON.parse(window.sessionStorage.getItem('preview')) const obj = JSON.parse(window.sessionStorage.getItem('preview'))
const associatedComponents = ref([{ type: '应用资源', dataList: [] }]) const associatedComponents = ref([{ type: '应用资源', dataList: [] }])
let loading = ref(true) let loading = ref(true)
document.documentElement.style.transition = 'all 0.3s ease' document.documentElement.style.transition = 'all 0.3s ease'
document.documentElement.scrollTop = 0 document.documentElement.scrollTop = 0
document.body.style.transition = 'all 0.3s ease' document.body.style.transition = 'all 0.3s ease'
document.body.scrollTop = 0 document.body.scrollTop = 0
mybus.on('flyToView', (id) => { mybus.on('flyToView', (id) => {
let top = document.querySelector('#' + id).offsetTop - 50 let top = document.querySelector('#' + id).offsetTop - 50
// console.log(top, document.querySelector('#' + id).offsetTop) // console.log(top, document.querySelector('#' + id).offsetTop)
document.documentElement.scrollTop = top document.documentElement.scrollTop = top
document.body.scrollTop = top document.body.scrollTop = top
}) })
onMounted(() => { onMounted(() => {
// console.clear() // console.clear()
window.addEventListener('scroll', () => { window.addEventListener('scroll', () => {
domArr.value = document.querySelectorAll('.scrollBox') domArr.value = document.querySelectorAll('.scrollBox')
@ -101,8 +131,8 @@ onMounted(() => {
} }
} }
}) })
}) })
const init = (id) => { const init = (id) => {
if (id) { if (id) {
let queryPartAppByKeyIdParams = { let queryPartAppByKeyIdParams = {
keyId: id, keyId: id,
@ -136,31 +166,32 @@ const init = (id) => {
console.log('浏览记录+1') console.log('浏览记录+1')
}) })
}) })
associatedComponents.value.map((item, index) => { }) associatedComponents.value.map((item, index) => {})
} else if (obj) { } else if (obj) {
dataList.data = obj dataList.data = obj
console.log('预览==============', obj) console.log('预览==============', obj)
} }
} }
init(id) init(id)
const associatedComponentsFunction = () => { const associatedComponentsFunction = () => {
if (associatedComponents.value[0].dataList.length > 0) { if (associatedComponents.value[0].dataList.length > 0) {
return associatedComponents.value return associatedComponents.value
} }
} }
onBeforeUnmount(() => { onBeforeUnmount(() => {
mybus.off('flyToView') mybus.off('flyToView')
}) })
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.fixed { .fixed {
position: fixed; position: fixed;
z-index: 2000; z-index: 2000;
top: 0; top: 0;
left: 0; left: 50%;
} margin-left: -9.56rem;
}
.fixed2>div:nth-of-type(3) { .fixed2 > div:nth-of-type(3) {
margin-top: 0.84rem; margin-top: 0.84rem;
} }
</style> </style>

153
front/src/views/detailsAll/LayerService.vue
View File

@ -8,75 +8,107 @@
<template> <template>
<div class="application-details" :class="{ fixed2: scrollTop >= 600 }"> <div class="application-details" :class="{ fixed2: scrollTop >= 600 }">
<!-- 头部基本信息 --> <!-- 头部基本信息 -->
<layer-service-top-details :dataList="dataList.data"></layer-service-top-details> <layer-service-top-details
:dataList="dataList.data"
></layer-service-top-details>
<!-- 导航 --> <!-- 导航 -->
<layer-service-navigation :dataList="dataList.data" :associatedComponents="associatedComponents" <layer-service-navigation
:class="{ fixed: scrollTop >= 600 }" :selectNow="selectNow"></layer-service-navigation> :dataList="dataList.data"
:associatedComponents="associatedComponents"
:class="{ fixed: scrollTop >= 600 }"
:selectNow="selectNow"
></layer-service-navigation>
<!-- 关联能力 --> <!-- 关联能力 -->
<layer-service-associated-ability :associatedComponents="associatedComponents" id="layer-service-associated-ability" <layer-service-associated-ability
class="scrollBox" v-if="!loading"></layer-service-associated-ability> :associatedComponents="associatedComponents"
id="layer-service-associated-ability"
class="scrollBox"
v-if="!loading"
></layer-service-associated-ability>
<!-- 图层展示 视频 --> <!-- 图层展示 视频 -->
<layer-service-presentation :dataList="dataList.data" id="service-presentation" class="scrollBox"> <layer-service-presentation
</layer-service-presentation> :dataList="dataList.data"
id="service-presentation"
class="scrollBox"
></layer-service-presentation>
<!-- 图层信息--> <!-- 图层信息-->
<layer-service-information :dataList="dataList.data" id="service-information" class="scrollBox"> <layer-service-information
</layer-service-information> :dataList="dataList.data"
id="service-information"
class="scrollBox"
></layer-service-information>
<!-- 应用场景 --> <!-- 应用场景 -->
<layer-service-application-scenarios :dataList="dataList.data" id="service-application-scenarios" class="scrollBox"> <layer-service-application-scenarios
</layer-service-application-scenarios> :dataList="dataList.data"
id="service-application-scenarios"
class="scrollBox"
></layer-service-application-scenarios>
<!-- 应用案例 --> <!-- 应用案例 -->
<layer-service-application-case :dataList="dataList.data" id="service-application-case" class="scrollBox"> <layer-service-application-case
</layer-service-application-case> :dataList="dataList.data"
id="service-application-case"
class="scrollBox"
></layer-service-application-case>
<!-- 图层预览 --> <!-- 图层预览 -->
<layer-service-preview :dataList="dataList.data" id="service-preview" class="scrollBox"></layer-service-preview> <layer-service-preview
:dataList="dataList.data"
id="service-preview"
class="scrollBox"
></layer-service-preview>
<!-- 使用方式--> <!-- 使用方式-->
<layer-service-usage-mode :dataList="dataList.data" id="service-usage-mode" class="scrollBox"> <layer-service-usage-mode
</layer-service-usage-mode> :dataList="dataList.data"
id="service-usage-mode"
class="scrollBox"
></layer-service-usage-mode>
<!-- 常见问题--> <!-- 常见问题-->
<layer-service-common-problem :dataList="dataList.data" id="service-common-problem" class="scrollBox"> <layer-service-common-problem
</layer-service-common-problem> :dataList="dataList.data"
id="service-common-problem"
class="scrollBox"
></layer-service-common-problem>
</div> </div>
</template> </template>
<script setup> <script setup>
import LayerServiceApplicationCase from '@/views/detailsAll/components/LayerService/LayerServiceApplicationCase' //应用案例 import LayerServiceApplicationCase from '@/views/detailsAll/components/LayerService/LayerServiceApplicationCase' //应用案例
import LayerServiceAssociatedAbility from '@/views/detailsAll/components/LayerService/LayerServiceAssociatedAbility.vue' import LayerServiceAssociatedAbility from '@/views/detailsAll/components/LayerService/LayerServiceAssociatedAbility.vue'
import LayerServiceApplicationScenarios from '@/views/detailsAll/components/LayerService/LayerServiceApplicationScenarios.vue' //应用场景 import LayerServiceApplicationScenarios from '@/views/detailsAll/components/LayerService/LayerServiceApplicationScenarios.vue' //应用场景
import LayerServiceCommonProblem from '@/views/detailsAll/components/LayerService/LayerServiceCommonProblem' //常见问题 import LayerServiceCommonProblem from '@/views/detailsAll/components/LayerService/LayerServiceCommonProblem' //常见问题
import LayerServiceInformation from '@/views/detailsAll/components/LayerService/LayerServiceInformation.vue' //图层信息 import LayerServiceInformation from '@/views/detailsAll/components/LayerService/LayerServiceInformation.vue' //图层信息
import LayerServiceNavigation from '@/views/detailsAll/components/LayerService/LayerServiceNavigation.vue' //导航 import LayerServiceNavigation from '@/views/detailsAll/components/LayerService/LayerServiceNavigation.vue' //导航
import LayerServicePresentation from '@/views/detailsAll/components/LayerService/LayerServicePresentation.vue' //图层展示 import LayerServicePresentation from '@/views/detailsAll/components/LayerService/LayerServicePresentation.vue' //图层展示
import LayerServicePreview from '@/views/detailsAll/components/LayerService/LayerServicePreview.vue' //图层预览 import LayerServicePreview from '@/views/detailsAll/components/LayerService/LayerServicePreview.vue' //图层预览
import LayerServiceTopDetails from '@/views/detailsAll/components/LayerService/LayerServiceTopDetails.vue' //头部基本信息 import LayerServiceTopDetails from '@/views/detailsAll/components/LayerService/LayerServiceTopDetails.vue' //头部基本信息
import LayerServiceUsageMode from '@/views/detailsAll/components/LayerService/LayerServiceUsageMode.vue' //使用方式 import LayerServiceUsageMode from '@/views/detailsAll/components/LayerService/LayerServiceUsageMode.vue' //使用方式
import { ref, onMounted, onBeforeUnmount, reactive } from 'vue' import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { import {
updateVisits, updateVisits,
selectOne, selectOne,
queryPartAppByKeyId2, queryPartAppByKeyId2,
browsingInsert, browsingInsert,
} from '@/api/home' } from '@/api/home'
import mybus from '@/myplugins/mybus' import mybus from '@/myplugins/mybus'
const router = useRouter() const router = useRouter()
const scrollTop = ref(0) const scrollTop = ref(0)
const domArr = ref([]) const domArr = ref([])
const selectNow = ref('') const selectNow = ref('')
const dataList = reactive({ data: {} }) const dataList = reactive({ data: {} })
const id = router.currentRoute.value.query.id const id = router.currentRoute.value.query.id
const obj = JSON.parse(window.sessionStorage.getItem('preview')) const obj = JSON.parse(window.sessionStorage.getItem('preview'))
const associatedComponents = ref([{ type: '应用资源', dataList: [] }]) const associatedComponents = ref([{ type: '应用资源', dataList: [] }])
let loading = ref(true) let loading = ref(true)
document.documentElement.style.transition = 'all 0.3s ease' document.documentElement.style.transition = 'all 0.3s ease'
document.documentElement.scrollTop = 0 document.documentElement.scrollTop = 0
document.body.style.transition = 'all 0.3s ease' document.body.style.transition = 'all 0.3s ease'
document.body.scrollTop = 0 document.body.scrollTop = 0
mybus.on('flyToView', (id) => { mybus.on('flyToView', (id) => {
let top = document.querySelector('#' + id).offsetTop - 50 let top = document.querySelector('#' + id).offsetTop - 50
// console.log(top, document.querySelector('#' + id).offsetTop) // console.log(top, document.querySelector('#' + id).offsetTop)
document.documentElement.scrollTop = top document.documentElement.scrollTop = top
document.body.scrollTop = top document.body.scrollTop = top
}) })
onMounted(() => { onMounted(() => {
// console.clear() // console.clear()
window.addEventListener('scroll', () => { window.addEventListener('scroll', () => {
domArr.value = document.querySelectorAll('.scrollBox') domArr.value = document.querySelectorAll('.scrollBox')
@ -101,9 +133,9 @@ onMounted(() => {
} }
} }
}) })
}) })
const init = (id) => { const init = (id) => {
if (id) { if (id) {
selectOne(id).then((res) => { selectOne(id).then((res) => {
// console.clear() // console.clear()
@ -143,21 +175,22 @@ const init = (id) => {
dataList.data = obj dataList.data = obj
console.log('预览==============', obj) console.log('预览==============', obj)
} }
} }
init(id) init(id)
onBeforeUnmount(() => { onBeforeUnmount(() => {
mybus.off('flyToView') mybus.off('flyToView')
}) })
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.fixed { .fixed {
position: fixed; position: fixed;
z-index: 2000; z-index: 2000;
top: 0; top: 0;
left: 0; left: 50%;
} margin-left: -9.56rem;
}
.fixed2>div:nth-of-type(3) { .fixed2 > div:nth-of-type(3) {
margin-top: 0.84rem; margin-top: 0.84rem;
} }
</style> </style>