逻辑修改
This commit is contained in:
parent
f7b79f6ae8
commit
3cfaf14b37
|
@ -2,16 +2,27 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="IntegrationServicesDetails" :class="{ fixed2: scrollTop >= 600 }">
|
<div class="IntegrationServicesDetails" :class="{ fixed2: scrollTop >= 600 }">
|
||||||
<home-header></home-header>
|
<home-header></home-header>
|
||||||
<detail-back v-show="!hiddenBackFlag" :returnType="returnType" :districtType="districtType"></detail-back>
|
<detail-back
|
||||||
|
v-show="!hiddenBackFlag"
|
||||||
|
:returnType="returnType"
|
||||||
|
:districtType="districtType"
|
||||||
|
></detail-back>
|
||||||
|
|
||||||
<template v-if="districtType == 0 || returnType == '打包模式'">
|
<template v-if="districtType == 0 || returnType == '打包模式'">
|
||||||
<!-- 头部基本信息 -->
|
<!-- 头部基本信息 -->
|
||||||
<application-top-details :dataList="detailInfoObj" :navList="navList"></application-top-details>
|
<application-top-details
|
||||||
|
:dataList="detailInfoObj"
|
||||||
|
:navList="navList"
|
||||||
|
></application-top-details>
|
||||||
<!-- 导航 -->
|
<!-- 导航 -->
|
||||||
<div :class="{ fixed: scrollTop >= 600 }" style="z-index: 10012">
|
<div :class="{ fixed: scrollTop >= 600 }" style="z-index: 10012">
|
||||||
<div class="application-navigation">
|
<div class="application-navigation">
|
||||||
<template v-for="nav in navList" :key="nav.key">
|
<template v-for="nav in navList" :key="nav.key">
|
||||||
<div class="nav" :class="{ selectNow: nav.key == selectNow }" @click="selectNav(nav.key)">
|
<div
|
||||||
|
class="nav"
|
||||||
|
:class="{ selectNow: nav.key == selectNow }"
|
||||||
|
@click="selectNav(nav.key)"
|
||||||
|
>
|
||||||
{{ nav.name }}
|
{{ nav.name }}
|
||||||
<span class="line"></span>
|
<span class="line"></span>
|
||||||
</div>
|
</div>
|
||||||
|
@ -30,11 +41,16 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="content" style="margin-left: 0.5rem">
|
<div class="content" style="margin-left: 0.5rem">
|
||||||
<div class="content-item" v-for="(item, i) in painPoint" :key="i" style="
|
<div
|
||||||
|
class="content-item"
|
||||||
|
v-for="(item, i) in painPoint"
|
||||||
|
:key="i"
|
||||||
|
style="
|
||||||
margin-bottom: 0.2rem;
|
margin-bottom: 0.2rem;
|
||||||
font-size: 0.18rem;
|
font-size: 0.18rem;
|
||||||
line-height: 0.3rem;
|
line-height: 0.3rem;
|
||||||
">
|
"
|
||||||
|
>
|
||||||
{{ i + 1 + '、' + item.description }}
|
{{ i + 1 + '、' + item.description }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -42,17 +58,26 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 解决方案 -->
|
<!-- 解决方案 -->
|
||||||
<div id="integration-solution" class="solution scrollBox" style="background: #eee">
|
<div
|
||||||
|
id="integration-solution"
|
||||||
|
class="solution scrollBox"
|
||||||
|
style="background: #eee"
|
||||||
|
>
|
||||||
<div class="title-1">
|
<div class="title-1">
|
||||||
<DetalsTitle title="解决方案" type="SOLUTION"></DetalsTitle>
|
<DetalsTitle title="解决方案" type="SOLUTION"></DetalsTitle>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex-row-center">
|
<div class="flex-row-center">
|
||||||
<div class="content" style="background: #fff; margin-top: 0.2rem">
|
<div class="content" style="background: #fff; margin-top: 0.2rem">
|
||||||
<div class="content-item" v-for="(item, i) in solution" :key="i" style="
|
<div
|
||||||
|
class="content-item"
|
||||||
|
v-for="(item, i) in solution"
|
||||||
|
:key="i"
|
||||||
|
style="
|
||||||
margin-bottom: 0.2rem;
|
margin-bottom: 0.2rem;
|
||||||
font-size: 0.18rem;
|
font-size: 0.18rem;
|
||||||
line-height: 0.3rem;
|
line-height: 0.3rem;
|
||||||
">
|
"
|
||||||
|
>
|
||||||
{{ i + 1 + '、' + item.description }}
|
{{ i + 1 + '、' + item.description }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -64,11 +89,26 @@
|
||||||
<div class="title-1">
|
<div class="title-1">
|
||||||
<DetalsTitle title="使用能力" type="ABILITY"></DetalsTitle>
|
<DetalsTitle title="使用能力" type="ABILITY"></DetalsTitle>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex-row-center combine-content" v-for="(item, i) in combineList" :key="i" style="display: block">
|
<div
|
||||||
<div class="top" style="font-size: 0.24rem; text-align: center; margin-bottom: 0.3rem">
|
class="flex-row-center combine-content"
|
||||||
|
v-for="(item, i) in combineList"
|
||||||
|
:key="i"
|
||||||
|
style="display: block"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="top"
|
||||||
|
style="
|
||||||
|
font-size: 0.24rem;
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 0.3rem;
|
||||||
|
"
|
||||||
|
>
|
||||||
{{ i == 0 ? '基础设施' : i == 1 ? '组件服务' : '数据资源' }}
|
{{ i == 0 ? '基础设施' : i == 1 ? '组件服务' : '数据资源' }}
|
||||||
</div>
|
</div>
|
||||||
<div class="data-count" style="font-size: 0.14rem; text-align: right; margin-bottom: 0.2rem">
|
<div
|
||||||
|
class="data-count"
|
||||||
|
style="font-size: 0.14rem; text-align: right; margin-bottom: 0.2rem"
|
||||||
|
>
|
||||||
<span style="color: #909399">
|
<span style="color: #909399">
|
||||||
共
|
共
|
||||||
{{
|
{{
|
||||||
|
@ -83,23 +123,63 @@
|
||||||
<div class="bottom" style="display: flex; align-items: flex-start">
|
<div class="bottom" style="display: flex; align-items: flex-start">
|
||||||
<div class="title" :class="'title' + i"></div>
|
<div class="title" :class="'title' + i"></div>
|
||||||
<div class="table-box" v-if="returnType == '典型赋能场景'">
|
<div class="table-box" v-if="returnType == '典型赋能场景'">
|
||||||
<el-table class="table" :data="item.list" stripe :header-cell-style="{ 'text-align': 'center' }">
|
<el-table
|
||||||
<el-table-column prop="name" label="资源名称" align="center" width="200"
|
class="table"
|
||||||
show-overflow-tooltip="true"></el-table-column>
|
:data="item.list"
|
||||||
<el-table-column prop="type" label="资源类型" align="center" width="100"
|
stripe
|
||||||
show-overflow-tooltip="true"></el-table-column>
|
:header-cell-style="{ 'text-align': 'center' }"
|
||||||
<el-table-column prop="dept" label="来源部门" align="center" width="300"
|
>
|
||||||
show-overflow-tooltip="true"></el-table-column>
|
<el-table-column
|
||||||
|
prop="name"
|
||||||
|
label="资源名称"
|
||||||
|
align="center"
|
||||||
|
width="200"
|
||||||
|
show-overflow-tooltip="true"
|
||||||
|
></el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="type"
|
||||||
|
label="资源类型"
|
||||||
|
align="center"
|
||||||
|
width="100"
|
||||||
|
show-overflow-tooltip="true"
|
||||||
|
></el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="dept"
|
||||||
|
label="来源部门"
|
||||||
|
align="center"
|
||||||
|
width="300"
|
||||||
|
show-overflow-tooltip="true"
|
||||||
|
></el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-box" v-else>
|
<div class="table-box" v-else>
|
||||||
<el-table class="table" :data="item.list" stripe :header-cell-style="{ 'text-align': 'center' }">
|
<el-table
|
||||||
<el-table-column prop="name" label="资源名称" align="center" width="200"
|
class="table"
|
||||||
show-overflow-tooltip="true"></el-table-column>
|
:data="item.list"
|
||||||
<el-table-column prop="platform" label="资源类型" align="center" width="100"
|
stripe
|
||||||
show-overflow-tooltip="true"></el-table-column>
|
:header-cell-style="{ 'text-align': 'center' }"
|
||||||
<el-table-column prop="dept" label="能力来源" align="center" width="300"
|
>
|
||||||
show-overflow-tooltip="true"></el-table-column>
|
<el-table-column
|
||||||
|
prop="name"
|
||||||
|
label="资源名称"
|
||||||
|
align="center"
|
||||||
|
width="200"
|
||||||
|
show-overflow-tooltip="true"
|
||||||
|
></el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="platform"
|
||||||
|
label="资源类型"
|
||||||
|
align="center"
|
||||||
|
width="100"
|
||||||
|
show-overflow-tooltip="true"
|
||||||
|
></el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="dept"
|
||||||
|
label="能力来源"
|
||||||
|
align="center"
|
||||||
|
width="300"
|
||||||
|
show-overflow-tooltip="true"
|
||||||
|
></el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -107,7 +187,11 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 构建步骤 -->
|
<!-- 构建步骤 -->
|
||||||
<div id="integration-step" class="step scrollBox" style="background: #eee">
|
<div
|
||||||
|
id="integration-step"
|
||||||
|
class="step scrollBox"
|
||||||
|
style="background: #eee"
|
||||||
|
>
|
||||||
<div class="title-1">
|
<div class="title-1">
|
||||||
<DetalsTitle title="构建步骤" type="STEP"></DetalsTitle>
|
<DetalsTitle title="构建步骤" type="STEP"></DetalsTitle>
|
||||||
</div>
|
</div>
|
||||||
|
@ -132,31 +216,43 @@
|
||||||
<div class="li1" v-for="(item, i) in step" :key="i">
|
<div class="li1" v-for="(item, i) in step" :key="i">
|
||||||
<div>
|
<div>
|
||||||
<div class="node">
|
<div class="node">
|
||||||
|
<div class="step-span">{{ i + 1 }}</div>
|
||||||
<div class="step-span">{{ i+ 1}}</div>
|
|
||||||
<div>
|
<div>
|
||||||
<div class="step-question">第{{ i+ 1}}步:{{ item.question }}</div>
|
<div class="step-question">
|
||||||
<div class="question-son" v-for="(itemson, i) in item.answer" :key="i">
|
第{{ i + 1 }}步:{{ item.question }}
|
||||||
<img src="~@/assets/home/arrow.png" style="margin-right:8px" />{{ i+ 1}}>{{ itemson.answer }}
|
</div>
|
||||||
|
<div
|
||||||
|
class="question-son"
|
||||||
|
v-for="(itemson, i) in item.answer"
|
||||||
|
:key="i"
|
||||||
|
>
|
||||||
|
<img
|
||||||
|
src="~@/assets/home/arrow.png"
|
||||||
|
style="margin-right: 8px"
|
||||||
|
/>
|
||||||
|
{{ i + 1 }}>{{ itemson.answer }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="borderLeft"></div>
|
<div class="borderLeft"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="advice"></div>
|
<div class="advice"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template v-else>
|
<template v-else>
|
||||||
<div class="area">
|
<div class="area">
|
||||||
<a-image style="width:615px;height:345px" :preview="false" :src="bgImg || imgSrcYyzy" />
|
<a-image
|
||||||
<div class="label-name">{{ detailInfoObj.name }} <span class="label">
|
style="width: 615px; height: 345px"
|
||||||
|
:preview="false"
|
||||||
|
:src="bgImg || imgSrcYyzy"
|
||||||
|
/>
|
||||||
|
<div class="label-name">
|
||||||
|
{{ detailInfoObj.name }}
|
||||||
|
<span class="label">
|
||||||
{{ detailInfoObj.type }}
|
{{ detailInfoObj.type }}
|
||||||
</span>
|
</span>
|
||||||
<span class="label1">
|
<span class="label1">
|
||||||
|
@ -176,45 +272,45 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import ApplicationTopDetails from './components/ApplicationTopDetails.vue'
|
import ApplicationTopDetails from './components/ApplicationTopDetails.vue'
|
||||||
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
|
import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
|
||||||
import ApplicationCommonProblem from '@/views/detailsAll/components/Application/ApplicationCommonProblem' //常见问题
|
import ApplicationCommonProblem from '@/views/detailsAll/components/Application/ApplicationCommonProblem' //常见问题
|
||||||
import HomeFooter from '@/views/newHome/components/Footer'
|
import HomeFooter from '@/views/newHome/components/Footer'
|
||||||
import HomeHeader from '@/views/home/components/header'
|
import HomeHeader from '@/views/home/components/header'
|
||||||
import detailBack from '@/views/home/detailBack.vue'
|
import detailBack from '@/views/home/detailBack.vue'
|
||||||
import { ref, onMounted, onBeforeUnmount } from 'vue'
|
import { ref, onMounted, onBeforeUnmount } from 'vue'
|
||||||
import { useRouter } from 'vue-router'
|
import { useRouter } from 'vue-router'
|
||||||
import { getIntegrationDetail } from '@/api/home'
|
import { getIntegrationDetail } from '@/api/home'
|
||||||
import mybus from '@/myplugins/mybus'
|
import mybus from '@/myplugins/mybus'
|
||||||
import { message } from 'ant-design-vue'
|
import { message } from 'ant-design-vue'
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const scrollTop = ref(0)
|
const scrollTop = ref(0)
|
||||||
const domArr = ref([])
|
const domArr = ref([])
|
||||||
const painPoint = ref([])
|
const painPoint = ref([])
|
||||||
const solution = ref([])
|
const solution = ref([])
|
||||||
const step = ref([])
|
const step = ref([])
|
||||||
const bgImg = ref('')
|
const bgImg = ref('')
|
||||||
const dataSourceCount = ref(0)
|
const dataSourceCount = ref(0)
|
||||||
const infrastructureCount = ref(0)
|
const infrastructureCount = ref(0)
|
||||||
const componentCount = ref(0)
|
const componentCount = ref(0)
|
||||||
const id = router.currentRoute.value.query.id
|
const id = router.currentRoute.value.query.id
|
||||||
const returnType = router.currentRoute.value.query.type
|
const returnType = router.currentRoute.value.query.type
|
||||||
const districtType = router.currentRoute.value.query.districtType
|
const districtType = router.currentRoute.value.query.districtType
|
||||||
const hiddenBackFlag = router.currentRoute.value.query.hiddenBackFlag
|
const hiddenBackFlag = router.currentRoute.value.query.hiddenBackFlag
|
||||||
const imgSrcYyzy = ref(require('@/assets/newHome/empty.png'))
|
const imgSrcYyzy = ref(require('@/assets/newHome/empty.png'))
|
||||||
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 =
|
let top =
|
||||||
document.querySelector('#' + id) &&
|
document.querySelector('#' + id) &&
|
||||||
document.querySelector('#' + id).offsetTop - 50
|
document.querySelector('#' + id).offsetTop - 50
|
||||||
document.documentElement.scrollTop = top
|
document.documentElement.scrollTop = top
|
||||||
document.body.scrollTop = top
|
document.body.scrollTop = top
|
||||||
})
|
})
|
||||||
|
|
||||||
const navList = ref([
|
const navList = ref([
|
||||||
{
|
{
|
||||||
name: '场景痛点',
|
name: '场景痛点',
|
||||||
key: 'integration-pain-point',
|
key: 'integration-pain-point',
|
||||||
|
@ -231,11 +327,11 @@ const navList = ref([
|
||||||
name: '构建步骤',
|
name: '构建步骤',
|
||||||
key: 'integration-step',
|
key: 'integration-step',
|
||||||
},
|
},
|
||||||
])
|
])
|
||||||
|
|
||||||
const selectNow = ref('integration-pain-point')
|
const selectNow = ref('integration-pain-point')
|
||||||
|
|
||||||
const useWayShowList = ref([
|
const useWayShowList = ref([
|
||||||
{
|
{
|
||||||
title: '归属部门',
|
title: '归属部门',
|
||||||
info: {
|
info: {
|
||||||
|
@ -250,9 +346,9 @@ const useWayShowList = ref([
|
||||||
providerMobile: '联系人电话',
|
providerMobile: '联系人电话',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
])
|
])
|
||||||
|
|
||||||
const combineList = ref([
|
const combineList = ref([
|
||||||
{
|
{
|
||||||
title: '基础设施',
|
title: '基础设施',
|
||||||
list: [],
|
list: [],
|
||||||
|
@ -265,10 +361,10 @@ const combineList = ref([
|
||||||
title: '数据资源',
|
title: '数据资源',
|
||||||
list: [],
|
list: [],
|
||||||
},
|
},
|
||||||
])
|
])
|
||||||
const detailInfoObj = ref({})
|
const detailInfoObj = ref({})
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
window.addEventListener('scroll', () => {
|
window.addEventListener('scroll', () => {
|
||||||
domArr.value = document.querySelectorAll('.scrollBox')
|
domArr.value = document.querySelectorAll('.scrollBox')
|
||||||
scrollTop.value =
|
scrollTop.value =
|
||||||
|
@ -292,21 +388,25 @@ onMounted(() => {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
const selectNav = (key) => {
|
//进入场景入口
|
||||||
|
const openScene = (val) => {
|
||||||
|
window.open(val, '_blank')
|
||||||
|
}
|
||||||
|
const selectNav = (key) => {
|
||||||
selectNow.value = key
|
selectNow.value = key
|
||||||
mybus.emit('flyToView', selectNow.value)
|
mybus.emit('flyToView', selectNow.value)
|
||||||
}
|
}
|
||||||
|
|
||||||
const getAttrValue = (fuseAttrList, text) => {
|
const getAttrValue = (fuseAttrList, text) => {
|
||||||
let _obj = fuseAttrList.find((v) => v.attrType === text) || {}
|
let _obj = fuseAttrList.find((v) => v.attrType === text) || {}
|
||||||
let data = JSON.parse(_obj.attrValue || '[]') || []
|
let data = JSON.parse(_obj.attrValue || '[]') || []
|
||||||
return data
|
return data
|
||||||
}
|
}
|
||||||
|
|
||||||
// 融合服务--详情
|
// 融合服务--详情
|
||||||
const getIntegrationServicesDeatil = (id) => {
|
const getIntegrationServicesDeatil = (id) => {
|
||||||
getIntegrationDetail(id).then(
|
getIntegrationDetail(id).then(
|
||||||
(res) => {
|
(res) => {
|
||||||
if (res.data.code !== 0) {
|
if (res.data.code !== 0) {
|
||||||
|
@ -340,7 +440,6 @@ const getIntegrationServicesDeatil = (id) => {
|
||||||
let fuseResourceList = res.data.data.fuseAttrList || []
|
let fuseResourceList = res.data.data.fuseAttrList || []
|
||||||
|
|
||||||
combineList.value.forEach((item) => {
|
combineList.value.forEach((item) => {
|
||||||
|
|
||||||
let arr = []
|
let arr = []
|
||||||
let resource = fuseResourceList.filter(
|
let resource = fuseResourceList.filter(
|
||||||
(v) => v.attrType == item.title
|
(v) => v.attrType == item.title
|
||||||
|
@ -349,16 +448,13 @@ const getIntegrationServicesDeatil = (id) => {
|
||||||
// let a=resource[0].attrValue
|
// let a=resource[0].attrValue
|
||||||
let resourceArrList = JSON.parse(resource[0].attrValue)
|
let resourceArrList = JSON.parse(resource[0].attrValue)
|
||||||
if (resourceArrList.length > 0) {
|
if (resourceArrList.length > 0) {
|
||||||
|
|
||||||
arr = resourceArrList.map((res) => ({
|
arr = resourceArrList.map((res) => ({
|
||||||
name: res.name,
|
name: res.name,
|
||||||
dept: res.dept,
|
dept: res.dept,
|
||||||
type: res.type,
|
type: res.type,
|
||||||
|
|
||||||
}))
|
}))
|
||||||
item.list = arr
|
item.list = arr
|
||||||
}
|
}
|
||||||
|
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
// 融合关系
|
// 融合关系
|
||||||
|
@ -404,7 +500,6 @@ const getIntegrationServicesDeatil = (id) => {
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
detailInfoObj.value.infoList = []
|
detailInfoObj.value.infoList = []
|
||||||
detailInfoObj.value.infoList.push(questionObj)
|
detailInfoObj.value.infoList.push(questionObj)
|
||||||
detailInfoObj.value.infoList.push(areaObj)
|
detailInfoObj.value.infoList.push(areaObj)
|
||||||
|
@ -413,10 +508,10 @@ const getIntegrationServicesDeatil = (id) => {
|
||||||
message.error(err)
|
message.error(err)
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
getIntegrationServicesDeatil(id)
|
getIntegrationServicesDeatil(id)
|
||||||
|
|
||||||
function handleOpenUrl(type) {
|
function handleOpenUrl(type) {
|
||||||
let obj =
|
let obj =
|
||||||
(detailInfoObj.value.fuseAttrList || []).find(
|
(detailInfoObj.value.fuseAttrList || []).find(
|
||||||
(v) => v.attrType == type
|
(v) => v.attrType == type
|
||||||
|
@ -430,15 +525,15 @@ function handleOpenUrl(type) {
|
||||||
'hisense_office/onlinePreview?url=' +
|
'hisense_office/onlinePreview?url=' +
|
||||||
btoa(encodeURI(url))
|
btoa(encodeURI(url))
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
onBeforeUnmount(() => {
|
onBeforeUnmount(() => {
|
||||||
mybus.off('flyToView')
|
mybus.off('flyToView')
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
.area {
|
.area {
|
||||||
padding-top: 93px;
|
padding-top: 93px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
margin-bottom: 32px;
|
margin-bottom: 32px;
|
||||||
|
@ -450,7 +545,6 @@ onBeforeUnmount(() => {
|
||||||
margin-top: 32px;
|
margin-top: 32px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.label {
|
.label {
|
||||||
padding: 0.01rem 0.1rem;
|
padding: 0.01rem 0.1rem;
|
||||||
margin-right: 0.1rem;
|
margin-right: 0.1rem;
|
||||||
|
@ -477,41 +571,39 @@ onBeforeUnmount(() => {
|
||||||
height: 32px;
|
height: 32px;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
border: 1px #0058e1 solid;
|
border: 1px #0058e1 solid;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
.area-desc {
|
||||||
|
|
||||||
.area-desc {
|
|
||||||
background: #f6f7f9;
|
background: #f6f7f9;
|
||||||
padding: 24px;
|
padding: 24px;
|
||||||
width: 1300px;
|
width: 1300px;
|
||||||
margin-left: 343px;
|
margin-left: 343px;
|
||||||
margin-bottom: 24px;
|
margin-bottom: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.flex-row-between {
|
.flex-row-between {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
}
|
}
|
||||||
|
|
||||||
.flex-row-start {
|
.flex-row-start {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
}
|
}
|
||||||
|
|
||||||
.flex-row-center {
|
.flex-row-center {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.IntegrationServicesDetails {
|
.IntegrationServicesDetails {
|
||||||
.fixed {
|
.fixed {
|
||||||
position: fixed !important;
|
position: fixed !important;
|
||||||
z-index: 2000;
|
z-index: 2000;
|
||||||
|
@ -519,7 +611,7 @@ onBeforeUnmount(() => {
|
||||||
left: 0;
|
left: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.fixed2>div:nth-of-type(3) {
|
.fixed2 > div:nth-of-type(3) {
|
||||||
margin-top: 0.84rem;
|
margin-top: 0.84rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -557,9 +649,9 @@ onBeforeUnmount(() => {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.use-way {
|
.use-way {
|
||||||
padding: 0.8rem 0;
|
padding: 0.8rem 0;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
@ -602,9 +694,11 @@ onBeforeUnmount(() => {
|
||||||
height: 1.5rem;
|
height: 1.5rem;
|
||||||
width: 6.2rem;
|
width: 6.2rem;
|
||||||
border-radius: 0.2rem;
|
border-radius: 0.2rem;
|
||||||
background: linear-gradient(to right,
|
background: linear-gradient(
|
||||||
|
to right,
|
||||||
rgba(113, 132, 252, 0.4),
|
rgba(113, 132, 252, 0.4),
|
||||||
rgba(148, 163, 252, 0.4));
|
rgba(148, 163, 252, 0.4)
|
||||||
|
);
|
||||||
padding: 0 0.3rem;
|
padding: 0 0.3rem;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
@ -635,9 +729,9 @@ onBeforeUnmount(() => {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.pain-point {
|
.pain-point {
|
||||||
padding: 0.8rem 0;
|
padding: 0.8rem 0;
|
||||||
background: rgb(247, 248, 250);
|
background: rgb(247, 248, 250);
|
||||||
|
|
||||||
|
@ -672,9 +766,9 @@ onBeforeUnmount(() => {
|
||||||
margin: 0rem 0rem 0.1rem 0.1rem;
|
margin: 0rem 0rem 0.1rem 0.1rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.solution {
|
.solution {
|
||||||
padding: 0.8rem 0;
|
padding: 0.8rem 0;
|
||||||
background: rgb(247, 248, 250);
|
background: rgb(247, 248, 250);
|
||||||
|
|
||||||
|
@ -686,9 +780,9 @@ onBeforeUnmount(() => {
|
||||||
margin: 0.3rem;
|
margin: 0.3rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.step {
|
.step {
|
||||||
padding: 0.8rem 0;
|
padding: 0.8rem 0;
|
||||||
background: rgb(247, 248, 250);
|
background: rgb(247, 248, 250);
|
||||||
|
|
||||||
|
@ -698,7 +792,6 @@ onBeforeUnmount(() => {
|
||||||
background: #fff;
|
background: #fff;
|
||||||
|
|
||||||
.left-process {
|
.left-process {
|
||||||
|
|
||||||
padding-left: 18px;
|
padding-left: 18px;
|
||||||
padding-top: 24px;
|
padding-top: 24px;
|
||||||
|
|
||||||
|
@ -719,7 +812,6 @@ onBeforeUnmount(() => {
|
||||||
left: -1px;
|
left: -1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.step-question {
|
.step-question {
|
||||||
color: #0058e1;
|
color: #0058e1;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
@ -739,7 +831,6 @@ onBeforeUnmount(() => {
|
||||||
}
|
}
|
||||||
|
|
||||||
.node {
|
.node {
|
||||||
|
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
line-height: 22.5px;
|
line-height: 22.5px;
|
||||||
|
@ -763,8 +854,6 @@ onBeforeUnmount(() => {
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.advice {
|
.advice {
|
||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
color: #0058e1;
|
color: #0058e1;
|
||||||
|
@ -775,14 +864,11 @@ onBeforeUnmount(() => {
|
||||||
.li1:last-child .borderLeft {
|
.li1:last-child .borderLeft {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.ability {
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.ability {
|
|
||||||
padding: 0.8rem 0;
|
padding: 0.8rem 0;
|
||||||
background: rgb(247, 248, 250);
|
background: rgb(247, 248, 250);
|
||||||
|
|
||||||
|
@ -837,7 +923,8 @@ onBeforeUnmount(() => {
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.data-count {}
|
.data-count {
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.name-box {
|
.name-box {
|
||||||
|
@ -868,5 +955,5 @@ onBeforeUnmount(() => {
|
||||||
width: 50%;
|
width: 50%;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
Loading…
Reference in New Issue