suixy
/
portal_website
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改首页和行业方案

Browse Source
master
suixy 2 weeks ago
parent 05b8fbeb60
commit a7941626a5
4 changed files with 68 additions and 61 deletions
Show Stats Download Patch File Download Diff File

13
src/views/index/carousel.vue
Unescape Escape View File

@ -26,19 +26,8 @@ export default {
}
},
mounted() {
this.getData()
},
methods:{
getData(){
getPortalList({
portalConfigType:1,
pageNum:1,
pageSize:100
}).then(e=>{
console.log(e.rows)
// this.bannerList = e.rows
})
}
methods: {
},
}
</script>

40
src/views/index/index.vue
Unescape Escape View File

@ -1,6 +1,6 @@
<template>
<div>
<Carousel class="carousel" :bannerList="components.swiper || bannerList"/>
<Carousel class="carousel" :bannerList="components.swiper "/>
<ClassicCase class="classicCase" :data="components.classicCaseData ||[]"/>
<ProductCenter class="productCenter" :data="components.productCenterData ||[]"/>
<NewsCenter class="newsCenter"/>
@ -31,27 +31,28 @@ export default {
mounted() {
getHwWeb(-1).then(res => {
this.components = JSON.parse(res?.data?.webJsonString || '{}')
console.log(this.components)
})
},
data() {
return {
bannerList: [
{
portalConfigPic: 'http://www.highwayiot.com/home/2/6/3rrzpl/resource/2018/10/23/5bcedfaf21a51.jpg',
// portalConfigTitle: '工业物联网定制化解决方案提供商',
// portalConfigDesc: 'INDUSTRIAL IOT CUSTOMIZATION SOLUTION PROVIDER'
},
{
portalConfigPic: 'http://www.highwayiot.com/home/2/6/3rrzpl/resource/2018/10/26/5bd2d7716deb5.jpg',
// portalConfigTitle: '工业物联网定制化解决方案提供商',
// portalConfigDesc: 'INDUSTRIAL IOT CUSTOMIZATION SOLUTION PROVIDER'
},
{
portalConfigPic: 'http://www.highwayiot.com/home/2/6/3rrzpl/resource/2018/10/23/5bcedfa35afa1.jpg',
// portalConfigTitle: '工业物联网定制化解决方案提供商',
// portalConfigDesc: 'INDUSTRIAL IOT CUSTOMIZATION SOLUTION PROVIDER'
},
],
// bannerList: [
// {
// portalConfigPic: 'http://www.highwayiot.com/home/2/6/3rrzpl/resource/2018/10/23/5bcedfaf21a51.jpg',
// portalConfigTitle: '工业物联网定制化解决方案提供商',
// portalConfigDesc: 'INDUSTRIAL IOT CUSTOMIZATION SOLUTION PROVIDER'
// },
// {
// portalConfigPic: 'http://www.highwayiot.com/home/2/6/3rrzpl/resource/2018/10/26/5bd2d7716deb5.jpg',
// portalConfigTitle: '工业物联网定制化解决方案提供商',
// portalConfigDesc: 'INDUSTRIAL IOT CUSTOMIZATION SOLUTION PROVIDER'
// },
// {
// portalConfigPic: 'http://www.highwayiot.com/home/2/6/3rrzpl/resource/2018/10/23/5bcedfa35afa1.jpg',
// portalConfigTitle: '工业物联网定制化解决方案提供商',
// portalConfigDesc: 'INDUSTRIAL IOT CUSTOMIZATION SOLUTION PROVIDER'
// },
// ],
components: {},
}
}
@ -83,7 +84,8 @@ export default {
width: 100%;
background-color: #2e445c;
}
.copyright{
.copyright {
width: 100%;
background-color: #1d3348;
}

1
src/views/industrySolutions/index.vue
Unescape Escape View File

@ -308,6 +308,7 @@ export default {
}
}
}
.swiper {
width: 58vw;
margin: 0 auto;

75
src/views/productCenter/index.vue
Unescape Escape View File

@ -3,17 +3,16 @@
<div class="banner">
<el-image
style="width: 100%; height: 100%;position:absolute;top: 0;left: 0;"
:src="pageData.banner"
:src="pageData.productList.find(e => e.id === tabsActive).banner || pageData.banner"
fit="contain"></el-image>
<div class="bannerInfo">{{ pageData.bannerTitle }}</div>
<div class="tabs">
<div class="content">
<div @click="checkTabs(i,k)"
style="white-space: nowrap;overflow: auto"
:style="`fontSize:clamp(0.7vw,calc(${(60/tabsData.length)}vw / ${ i.webMenuName.length}),1.4vw);width:${tabsActive === i.webMenuId ? (100/tabsData.length+'%'):`calc(${100/tabsData.length}% - 2px)`}`"
:class="`tab ${tabsActive === i.webMenuId ? 'active':''}`" v-for="(i,k) in tabsData">
{{ i.webMenuName }}
</div>
</div>
<div class="tabs">
<div class="content">
<div @click="checkTabs(i,k)"
style="white-space: nowrap;overflow: auto"
:class="`tab ${tabsActive == i.webMenuId ? 'active':''}`" v-for="(i,k) in tabsData">
{{ i.webMenuName }}
</div>
</div>
</div>
@ -133,37 +132,53 @@ export default {
letter-spacing: 2px;
}
.tabs {
position: absolute;
bottom: 0;
}
.tabs {
cursor: pointer;
bottom: 0;
width: 100%;
white-space: nowrap;
background: linear-gradient(to bottom, fade(@standard-color, 10), fade(#fff, 10));
backdrop-filter: saturate(50%) blur(4px);
.content {
width: 100%;
background: linear-gradient(to bottom, fade(@standard-color, 10), fade(#fff, 10));
backdrop-filter: saturate(50%) blur(4px);
position: relative;
left: 50%;
bottom: 0;
transform: translateX(-50%);
.content {
width: 62%;
.tab {
display: inline-block;
line-height: 6.2vw;
letter-spacing: 3px;
font-size: 1vw;
position: relative;
left: 50%;
bottom: 0;
transform: translateX(-50%);
padding: 0 2vw;
.tab {
display: inline-block;
line-height: 6.2vw;
font-size: 1.6vw;
letter-spacing: 3px;
&:last-child::after {
display: none;
}
.tab.active {
color: @standard-color;
width: calc(50% - 3px);
border: 1px solid #fff;
box-shadow: 0 0 3px #0002;
&::after {
content: '';
position: absolute;
right: 0;
width: 1px;
height: 1vw;
background-color: #409eff;
top: calc(50% - 0.5vw);
}
}
.tab.active {
color: @standard-color;
//border: 1px solid #fff6;
//box-shadow: 0 0 3px #0002;
}
}
}
.contactUs {
width: 100%;
background-color: #2e445c;

Write Preview
Loading…
Cancel
Save