融合服务修改
This commit is contained in:
parent
4617c2d892
commit
c0bb1422b1
Binary file not shown.
After Width: | Height: | Size: 552 B |
Binary file not shown.
After Width: | Height: | Size: 475 B |
|
@ -9,7 +9,7 @@
|
|||
<div class="algorithm-top-details">
|
||||
<div class="left">
|
||||
<div class="top">
|
||||
<a-tooltip placement="top" v-if="(props.dataList.name.length>20)">
|
||||
<a-tooltip placement="top" v-if="(props.dataList.name.length > 20)">
|
||||
<template #title>{{ props.dataList.name }}</template>
|
||||
<span class="name">
|
||||
{{ props.dataList.name }}
|
||||
|
@ -47,24 +47,21 @@
|
|||
</div>
|
||||
<div class="bottomdesc" v-else-if="dowmOrUp === '展开>>'">
|
||||
场景描述: {{ props.dataList.description.slice(0, 183) }}...
|
||||
<span
|
||||
style="cursor: pointer; color: rgb(241 211 112)"
|
||||
@click="showDetail(dowmOrUp)"
|
||||
>
|
||||
<span style="cursor: pointer; color: rgb(241 211 112)" @click="showDetail(dowmOrUp)">
|
||||
{{ dowmOrUp }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="bottomdesc1" v-else>
|
||||
场景描述: {{ props.dataList.description }}
|
||||
<span
|
||||
style="cursor: pointer; color: rgb(241 211 112)"
|
||||
@click="showDetail(dowmOrUp)"
|
||||
>
|
||||
<span style="cursor: pointer; color: rgb(241 211 112)" @click="showDetail(dowmOrUp)">
|
||||
{{ dowmOrUp }}
|
||||
</span>
|
||||
</div>
|
||||
<div style="padding-top: 20px">
|
||||
<span>场景入口:</span>
|
||||
<a-button class="rukou" @click="openScene(props.dataList.sceneUrl)">
|
||||
进入场景
|
||||
</a-button>
|
||||
<!-- <span>场景入口:</span>
|
||||
<span
|
||||
style="
|
||||
margin-left: 10px;
|
||||
|
@ -74,7 +71,7 @@
|
|||
@click="openScene(props.dataList.sceneUrl)"
|
||||
>
|
||||
{{ props.dataList.sceneUrl }}
|
||||
</span>
|
||||
</span> -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom" v-if="props.dataList.id">
|
||||
|
@ -200,24 +197,24 @@ function toView() {
|
|||
// 融合服务--一键申请
|
||||
const handleAKeyApplication = () => {
|
||||
let _applyList = []
|
||||
;(props.dataList.fuseResourceList || []).map((v) => {
|
||||
let resource = v.resource || {}
|
||||
let obj = {
|
||||
arr: [
|
||||
{
|
||||
delFlag: resource.delFlag,
|
||||
description: resource.description,
|
||||
resourceId: resource.id,
|
||||
resourceName: resource.name,
|
||||
time: resource.createDate,
|
||||
type: resource.type,
|
||||
},
|
||||
],
|
||||
deptId: resource.deptId,
|
||||
deptName: resource.deptName,
|
||||
}
|
||||
_applyList.push(obj)
|
||||
})
|
||||
; (props.dataList.fuseResourceList || []).map((v) => {
|
||||
let resource = v.resource || {}
|
||||
let obj = {
|
||||
arr: [
|
||||
{
|
||||
delFlag: resource.delFlag,
|
||||
description: resource.description,
|
||||
resourceId: resource.id,
|
||||
resourceName: resource.name,
|
||||
time: resource.createDate,
|
||||
type: resource.type,
|
||||
},
|
||||
],
|
||||
deptId: resource.deptId,
|
||||
deptName: resource.deptName,
|
||||
}
|
||||
_applyList.push(obj)
|
||||
})
|
||||
|
||||
localStorage.setItem('applyList', JSON.stringify(_applyList))
|
||||
router.push({
|
||||
|
@ -339,6 +336,17 @@ watch(
|
|||
}
|
||||
|
||||
.main {
|
||||
|
||||
.rukou {
|
||||
margin-top:24px;
|
||||
background: #0058e1;
|
||||
color: #ffffff;
|
||||
width: 90px;
|
||||
height: 32px;
|
||||
border-radius: 2px;
|
||||
border: 1px #0058e1 solid;
|
||||
|
||||
}
|
||||
.bottomdesc {
|
||||
display: -webkit-box;
|
||||
/*设置为弹性盒子*/
|
||||
|
@ -353,12 +361,14 @@ watch(
|
|||
width: 800px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.bottomdesc1 {
|
||||
overflow: auto;
|
||||
width: 800px;
|
||||
font-size: 16px;
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
margin-top: 0.2rem;
|
||||
font-size: 0.18rem;
|
||||
line-height: 0.34rem;
|
||||
|
|
|
@ -58,6 +58,7 @@ function toView(item) {
|
|||
path: '/integrationServicesDetails',
|
||||
query: {
|
||||
id: item.id,
|
||||
districtType:item.district,
|
||||
type:'典型赋能场景'
|
||||
},
|
||||
})
|
||||
|
|
|
@ -26,16 +26,26 @@ const oldValue1 = ref('')
|
|||
const props = defineProps({
|
||||
textColor: { type: String, default: '' },
|
||||
returnType: { type: String, default: '' },
|
||||
districtType:{ type: Number, default: 0 },
|
||||
})
|
||||
const returnType = props.returnType
|
||||
const districtType = props.districtType
|
||||
const previousPage = () => {
|
||||
if (returnType =='典型赋能场景'|| returnType =='打包模式') {
|
||||
if (returnType =='打包模式') {
|
||||
router.push({
|
||||
path: '/integrationServices',
|
||||
query: {
|
||||
returnType: returnType,
|
||||
},
|
||||
})
|
||||
}else if(returnType =='典型赋能场景'){
|
||||
router.push({
|
||||
path: '/integrationServices',
|
||||
query: {
|
||||
returnType: returnType,
|
||||
districtType:districtType,
|
||||
},
|
||||
})
|
||||
} else {
|
||||
if (window.history.state.back) {
|
||||
window.history.go(-1)
|
||||
|
|
|
@ -124,6 +124,7 @@ export default defineComponent({
|
|||
const router = useRouter()
|
||||
const select = router.currentRoute.value.query.select
|
||||
const returnType = router.currentRoute.value.query.returnType
|
||||
const districtType = router.currentRoute.value.query.districtType
|
||||
const searchValue = ref('')
|
||||
const Cardsname = ref(select)
|
||||
const resourceList = reactive({ data: [] })
|
||||
|
@ -350,11 +351,17 @@ export default defineComponent({
|
|||
}
|
||||
|
||||
onMounted(() => {
|
||||
searchAreas()
|
||||
searchAreas()
|
||||
if (returnType == '典型赋能场景') {
|
||||
changeCards(0)
|
||||
|
||||
} else if (returnType == '打包模式') {
|
||||
if(districtType==0){
|
||||
cityOrArea.value=0
|
||||
}else{
|
||||
cityOrArea.value=1
|
||||
}
|
||||
changeCards(0)
|
||||
}
|
||||
else if (returnType == '打包模式') {
|
||||
changeCards(1)
|
||||
} else {
|
||||
if (storageSearchInfo) {
|
||||
|
@ -390,6 +397,7 @@ export default defineComponent({
|
|||
titleName,
|
||||
changeCards,
|
||||
returnType,
|
||||
districtType,
|
||||
number,
|
||||
loadingData,
|
||||
cityOrArea,
|
||||
|
|
|
@ -5,13 +5,15 @@
|
|||
<detail-back
|
||||
v-show="!hiddenBackFlag"
|
||||
:returnType="returnType"
|
||||
:districtType="districtType"
|
||||
></detail-back>
|
||||
<!-- 头部基本信息 -->
|
||||
<application-top-details
|
||||
|
||||
<template v-if="districtType==0 ||returnType=='打包模式' ">
|
||||
<!-- 头部基本信息 -->
|
||||
<application-top-details
|
||||
:dataList="detailInfoObj"
|
||||
:navList="navList"
|
||||
></application-top-details>
|
||||
|
||||
<!-- 导航 -->
|
||||
<div :class="{ fixed: scrollTop >= 600 }" style="z-index: 10012">
|
||||
<div class="application-navigation">
|
||||
|
@ -116,7 +118,37 @@
|
|||
</div>
|
||||
<div class="bottom" style="display: flex; align-items: flex-start">
|
||||
<div class="title" :class="'title' + i"></div>
|
||||
<div class="table-box">
|
||||
<div class="table-box" v-if="returnType=='典型赋能场景'">
|
||||
<el-table
|
||||
class="table"
|
||||
:data="item.list"
|
||||
stripe
|
||||
:header-cell-style="{ 'text-align': 'center' }"
|
||||
>
|
||||
<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>
|
||||
</div>
|
||||
<div class="table-box" v-else>
|
||||
<el-table
|
||||
class="table"
|
||||
:data="item.list"
|
||||
|
@ -155,17 +187,70 @@
|
|||
<div class="title-1">
|
||||
<DetalsTitle title="构建步骤" type="STEP"></DetalsTitle>
|
||||
</div>
|
||||
<div class="flex-row-center step-content">
|
||||
<el-steps direction="vertical" :space="150" :active="step.length">
|
||||
<div class="step-content" >
|
||||
<!-- <el-steps direction="vertical" :space="150" :active="step.length">
|
||||
<el-step
|
||||
v-for="(item, i) in step"
|
||||
:key="i"
|
||||
:title="item.question"
|
||||
:description="item.answer"
|
||||
></el-step>
|
||||
</el-steps>
|
||||
</el-steps> -->
|
||||
<!-- <div v-for="(item,i) in step" :key="i">
|
||||
<div><div class="step-span" >{{i+1}}</div>
|
||||
<div class="step-question">第{{i+1}}步:{{item.question}}</div>
|
||||
<div v-for="itemson in item.answer" :key="itemson">
|
||||
{{itemson.answer}}
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="left-process">
|
||||
<div class="li1" v-for="(item,i) in step" :key="i">
|
||||
<div >
|
||||
<div class="node">
|
||||
|
||||
<div class="step-span" >{{i+1}}</div>
|
||||
<div >
|
||||
<div class="step-question">第{{i+1}}步:{{item.question}}</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 class="borderLeft"></div>
|
||||
</div>
|
||||
<div class="advice"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="area" >
|
||||
<a-image
|
||||
style="width:615px;height:345px"
|
||||
:preview="false"
|
||||
:src="bgImg || imgSrcYyzy"
|
||||
|
||||
/>
|
||||
<div class="label-name">{{detailInfoObj.name}} <span class="label">
|
||||
{{ detailInfoObj.type }}
|
||||
</span>
|
||||
<span class="label1">
|
||||
{{ detailInfoObj.area }}
|
||||
</span></div>
|
||||
<a-button class="rukou" @click="openScene(detailInfoObj.sceneUrl)">
|
||||
进入场景
|
||||
</a-button>
|
||||
</div>
|
||||
<div class="area-desc">
|
||||
{{ detailInfoObj.description || '--' }}
|
||||
</div>
|
||||
</template>
|
||||
<home-footer></home-footer>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -194,7 +279,9 @@
|
|||
const componentCount = ref(0)
|
||||
const id = router.currentRoute.value.query.id
|
||||
const returnType = router.currentRoute.value.query.type
|
||||
const districtType= router.currentRoute.value.query.districtType
|
||||
const hiddenBackFlag = router.currentRoute.value.query.hiddenBackFlag
|
||||
const imgSrcYyzy = ref(require('@/assets/newHome/empty.png'))
|
||||
document.documentElement.style.transition = 'all 0.3s ease'
|
||||
document.documentElement.scrollTop = 0
|
||||
document.body.style.transition = 'all 0.3s ease'
|
||||
|
@ -311,8 +398,7 @@
|
|||
componentCount.value = res.data.data.componentCount || 0
|
||||
// 资源属性
|
||||
let fuseAttrList = res.data.data.fuseAttrList || []
|
||||
// 融合关系
|
||||
let fuseResourceList = res.data.data.fuseResourceList || []
|
||||
|
||||
let questionValue =
|
||||
fuseAttrList.find((v) => v.attrType === '常见问题') || {}
|
||||
let questionObj = {
|
||||
|
@ -321,14 +407,43 @@
|
|||
}
|
||||
painPoint.value = getAttrValue(fuseAttrList, '场景痛点')
|
||||
solution.value = getAttrValue(fuseAttrList, '解决方案')
|
||||
step.value = getAttrValue(fuseAttrList, '使用步骤')
|
||||
|
||||
step.value = getAttrValue(fuseAttrList, '构建步骤')
|
||||
|
||||
bgImg.value =
|
||||
fuseAttrList.find((v) => v.attrType === '服务图片').attrValue || ''
|
||||
let areaObj = {
|
||||
attrType: '应用领域',
|
||||
attrValue: '',
|
||||
}
|
||||
combineList.value.forEach((item) => {
|
||||
if(returnType==='典型赋能场景'){
|
||||
let fuseResourceList = res.data.data.fuseAttrList || []
|
||||
|
||||
combineList.value.forEach((item) => {
|
||||
|
||||
let arr = []
|
||||
let resource = fuseResourceList.filter(
|
||||
(v) => v.attrType == item.title
|
||||
)
|
||||
|
||||
// let a=resource[0].attrValue
|
||||
let resourceArrList=JSON.parse(resource[0].attrValue)
|
||||
if (resourceArrList.length > 0) {
|
||||
|
||||
arr = resourceArrList.map((res) => ({
|
||||
name: res.name,
|
||||
dept: res.dept,
|
||||
type: res.type,
|
||||
|
||||
}))
|
||||
item.list = arr
|
||||
}
|
||||
|
||||
})
|
||||
}else{
|
||||
// 融合关系
|
||||
let fuseResourceList = res.data.data.fuseResourceList || []
|
||||
combineList.value.forEach((item) => {
|
||||
let arr = []
|
||||
let resource = fuseResourceList.filter(
|
||||
(v) => v.resource && v.type == item.title
|
||||
|
@ -367,6 +482,9 @@
|
|||
|
||||
item.list = arr
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
detailInfoObj.value.infoList = []
|
||||
detailInfoObj.value.infoList.push(questionObj)
|
||||
detailInfoObj.value.infoList.push(areaObj)
|
||||
|
@ -400,6 +518,53 @@
|
|||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.area{
|
||||
padding-top: 93px;
|
||||
text-align: center;
|
||||
margin-bottom: 32px;
|
||||
.label-name{
|
||||
font-size:26px;
|
||||
color:#212121;
|
||||
font-weight:bold;
|
||||
margin-top:32px;
|
||||
}
|
||||
|
||||
|
||||
.label {
|
||||
padding: 0.01rem 0.1rem;
|
||||
margin-right: 0.1rem;
|
||||
border-radius: 0.13rem;
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
background: #7294c8;
|
||||
}
|
||||
.label1 {
|
||||
padding: 0.01rem 0.1rem;
|
||||
margin-right: 0.1rem;
|
||||
border-radius: 0.13rem;
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
background: #c66132;
|
||||
}
|
||||
.rukou {
|
||||
margin-top:24px;
|
||||
background: #0058e1;
|
||||
color: #ffffff;
|
||||
width: 90px;
|
||||
height: 32px;
|
||||
border-radius: 2px;
|
||||
border: 1px #0058e1 solid;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
.area-desc{
|
||||
background: #f6f7f9;
|
||||
padding: 24px;
|
||||
width: 1300px;
|
||||
margin-left: 343px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
.flex-row-between {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
@ -607,20 +772,85 @@
|
|||
margin: 0.3rem 4.5rem;
|
||||
padding: 0.3rem;
|
||||
background: #fff;
|
||||
.left-process {
|
||||
|
||||
:deep(.el-step__description.is-finish) {
|
||||
color: #333;
|
||||
line-height: 0.24rem;
|
||||
margin-top: 0.05rem;
|
||||
padding-left: 18px;
|
||||
padding-top: 24px;
|
||||
|
||||
.li1 {
|
||||
list-style: none;
|
||||
box-sizing: border-box;
|
||||
padding-left: 20px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.borderLeft {
|
||||
width: 1px;
|
||||
height: 100%;
|
||||
background-color: #e8f0fc;
|
||||
position: absolute;
|
||||
top: 11.225px;
|
||||
bottom: 0;
|
||||
left: -1px;
|
||||
}
|
||||
|
||||
|
||||
.step-question{
|
||||
color: #0058e1;
|
||||
font-weight: bold;
|
||||
font-size: 20px;
|
||||
padding-top: 8px;
|
||||
margin-left: 12px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.question-son{
|
||||
background: #f6f7f9;
|
||||
font-size: 16px;
|
||||
color: #414040;
|
||||
margin-left: 12px;
|
||||
line-height: 24px;
|
||||
padding: 12px 0px 12px 16px;
|
||||
}
|
||||
.node {
|
||||
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
line-height: 22.5px;
|
||||
font-weight: 500;
|
||||
color: #212121;
|
||||
}
|
||||
|
||||
.step-span{
|
||||
z-index: 1;
|
||||
color: #0058e1;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
position: relative;
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
margin-left: -42px;
|
||||
padding-left: 14px;
|
||||
padding-top: 6px;
|
||||
float: left;
|
||||
background: url('~@/assets/home/step.png') no-repeat;
|
||||
}
|
||||
|
||||
/deep/ .el-step__title {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
/deep/ .el-step__description {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.advice {
|
||||
font-size: 10px;
|
||||
color: #0058e1;
|
||||
opacity: 0.1;
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
|
||||
.li1:last-child .borderLeft {
|
||||
display: none;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue