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

融合服务修改

This commit is contained in:
gongjiale 2023-01-05 16:20:48 +08:00
parent 4617c2d892
commit c0bb1422b1
7 changed files with 313 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
front/src/assets/home/arrow.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 552 B

BIN
front/src/assets/home/step.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 475 B

30
front/src/views/home/components/ApplicationTopDetails.vue
View File

@ -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">
@ -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;

1
front/src/views/home/components/CanAssignCase.vue
View File

@ -58,6 +58,7 @@ function toView(item) {
path: '/integrationServicesDetails',
query: {
id: item.id,
districtType:item.district,
type:'典型赋能场景'
},
})

12
front/src/views/home/detailBack.vue
View File

@ -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)

12
front/src/views/home/integrationServices.vue
View File

@ -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: [] })
@ -352,9 +353,15 @@ export default defineComponent({
onMounted(() => {
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,

262
front/src/views/home/integrationServicesDetails.vue
View File

@ -5,13 +5,15 @@
<detail-back
v-show="!hiddenBackFlag"
:returnType="returnType"
:districtType="districtType"
></detail-back>
<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,13 +407,42 @@
}
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: '',
}
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(
@ -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;
}
/deep/ .el-step__title {
font-size: 18px;
.borderLeft {
width: 1px;
height: 100%;
background-color: #e8f0fc;
position: absolute;
top: 11.225px;
bottom: 0;
left: -1px;
}
/deep/ .el-step__description {
font-size: 14px;
.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;
}
.advice {
font-size: 10px;
color: #0058e1;
opacity: 0.1;
padding-bottom: 40px;
}
.li1:last-child .borderLeft {
display: none;
}
}
}
}