修改菜单
夜笙歌
1 week ago
parent
36442e6237
commit
614a9228a3
@ -0,0 +1,138 @@
|
||||
<template>
|
||||
<div>
|
||||
<TitleGroup>
|
||||
<template slot="title">{{ data.productInfoEtitle }}</template>
|
||||
<template slot="subTitle">{{ data.productInfoCtitle }}</template>
|
||||
</TitleGroup>
|
||||
<div class="list">
|
||||
<div v-for="ii in groupByCount(data.hwProductInfoDetailList)">
|
||||
<div class="item" v-for="(i,k) in ii">
|
||||
<div class="icon">
|
||||
<el-image
|
||||
style="width: 100%;height: 100%"
|
||||
:src="i.productInfoDetailPic"
|
||||
fit="contain"></el-image>
|
||||
</div>
|
||||
<div class="itemTitle">{{ i.productInfoDetailTitle }}</div>
|
||||
<div class="itemInfo">{{ i.productInfoDetailDesc }}</div>
|
||||
</div>
|
||||
<br>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TitleGroup from "@/components/TitleGroup";
|
||||
import wlw from "@/assets/icon/wlw.png";
|
||||
import znzz from "@/assets/icon/znzz.png";
|
||||
import kdwl from "@/assets/icon/kdwl.png";
|
||||
import znlt from "@/assets/icon/znlt.png";
|
||||
|
||||
let map = null
|
||||
export default {
|
||||
name: 'PlatformAdvantages',
|
||||
components: {
|
||||
TitleGroup
|
||||
},
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
|
||||
list: [
|
||||
{
|
||||
name: '实时数据管理',
|
||||
icon: wlw,
|
||||
info: '通过获取实时数据，生产过程中，生产环境等结合产品质量进行相应关键指标参数分析，形成标准产品控制计划。'
|
||||
},
|
||||
{
|
||||
name: '数据存档',
|
||||
icon: znzz,
|
||||
info: '通过获取实时数据，生产过程中，生产环境等结合产品质量进行相应关键指标参数分析，形成标准产品控制计划。'
|
||||
},
|
||||
{
|
||||
name: '数据采集',
|
||||
icon: kdwl,
|
||||
info: '通过获取实时数据，生产过程中，生产环境等结合产品质量进行相应关键指标参数分析，形成标准产品控制计划。'
|
||||
},
|
||||
{
|
||||
name: '数据分析',
|
||||
icon: znlt,
|
||||
info: '通过获取实时数据，生产过程中，生产环境等结合产品质量进行相应关键指标参数分析，形成标准产品控制计划。'
|
||||
},
|
||||
],
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
groupByCount(array) {
|
||||
let result = [];
|
||||
for (let i = 0; i < array.length; i += 4) {
|
||||
result.push(array.slice(i, i + 4));
|
||||
}
|
||||
return result;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import "~@/style.less";
|
||||
|
||||
.list {
|
||||
margin-top: 3.9vw;
|
||||
padding-bottom: 5.3vw;
|
||||
|
||||
.item {
|
||||
display: inline-block;
|
||||
width: 14.5vw;
|
||||
height: 16.7vw;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 0 3px #0002;
|
||||
margin: 0 0.75vw;
|
||||
transition: all 0.2s;
|
||||
vertical-align: top;
|
||||
margin-bottom: 1vw;
|
||||
|
||||
&:hover {
|
||||
background-color: @standard-color;
|
||||
|
||||
.itemTitle {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.itemInfo {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.icon {
|
||||
width: 4vw;
|
||||
height: 4vw;
|
||||
margin-top: 2vw;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.itemTitle {
|
||||
transition: all 0.2s;
|
||||
font-size: 1vw;
|
||||
color: #000;
|
||||
margin-top: 1vw;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.itemInfo {
|
||||
transition: all 0.2s;
|
||||
display: inline-block;
|
||||
width: 82%;
|
||||
font-size: 0.8vw;
|
||||
color: #666;
|
||||
margin-top: 0.9vw;
|
||||
letter-spacing: 2px;
|
||||
line-height: 1.45vw;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,72 @@
|
||||
<template>
|
||||
<div>
|
||||
<TitleGroup>
|
||||
<template slot="title">{{ data.productInfoEtitle }}</template>
|
||||
<template slot="subTitle">{{ data.productInfoCtitle }}</template>
|
||||
</TitleGroup>
|
||||
<div v-for="ii in groupByCount(data.hwProductInfoDetailList)">
|
||||
<div class="list">
|
||||
<div class="item" v-for="(i,k) in ii">
|
||||
<el-image
|
||||
style="width: 100%;height: 100%"
|
||||
:src="i.productInfoDetailPic"
|
||||
fit="contain"></el-image>
|
||||
</div>
|
||||
<br>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TitleGroup from "@/components/TitleGroup";
|
||||
import wlw from "@/assets/icon/wlw.png";
|
||||
import znzz from "@/assets/icon/znzz.png";
|
||||
import kdwl from "@/assets/icon/kdwl.png";
|
||||
import znlt from "@/assets/icon/znlt.png";
|
||||
|
||||
let map = null
|
||||
export default {
|
||||
name: 'modal11',
|
||||
props: ['data'],
|
||||
components: {
|
||||
TitleGroup
|
||||
},
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
groupByCount(array) {
|
||||
let result = [];
|
||||
for (let i = 0; i < array.length; i += 3) {
|
||||
result.push(array.slice(i, i + 3));
|
||||
}
|
||||
return result;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import "~@/style.less";
|
||||
|
||||
.list {
|
||||
margin: 3.9vw auto 0;
|
||||
padding-bottom: 5.3vw;
|
||||
width: 60vw;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
|
||||
.item {
|
||||
display: inline-block;
|
||||
width: 30%;
|
||||
//height: 16.7vw;
|
||||
margin: 0 0.5vw;
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,72 @@
|
||||
<template>
|
||||
<div>
|
||||
<TitleGroup>
|
||||
<template slot="title">{{ data.productInfoEtitle }}</template>
|
||||
<template slot="subTitle">{{ data.productInfoCtitle }}</template>
|
||||
</TitleGroup>
|
||||
<div v-for="ii in groupByCount(data.hwProductInfoDetailList)">
|
||||
<div class="list">
|
||||
<div class="item" v-for="(i,k) in ii">
|
||||
<el-image
|
||||
style="width: 100%;height: 100%"
|
||||
:src="i.productInfoDetailPic"
|
||||
fit="contain"></el-image>
|
||||
</div>
|
||||
<br>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TitleGroup from "@/components/TitleGroup";
|
||||
import wlw from "@/assets/icon/wlw.png";
|
||||
import znzz from "@/assets/icon/znzz.png";
|
||||
import kdwl from "@/assets/icon/kdwl.png";
|
||||
import znlt from "@/assets/icon/znlt.png";
|
||||
|
||||
let map = null
|
||||
export default {
|
||||
name: 'modal12',
|
||||
props: ['data'],
|
||||
components: {
|
||||
TitleGroup
|
||||
},
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
groupByCount(array) {
|
||||
let result = [];
|
||||
for (let i = 0; i < array.length; i += 2) {
|
||||
result.push(array.slice(i, i + 2));
|
||||
}
|
||||
return result;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import "~@/style.less";
|
||||
|
||||
.list {
|
||||
margin: 3.9vw auto 0;
|
||||
padding-bottom: 5.3vw;
|
||||
width: 60vw;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
|
||||
.item {
|
||||
display: inline-block;
|
||||
width: 49%;
|
||||
//height: 16.7vw;
|
||||
margin: 0 0.5vw;
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,106 @@
|
||||
<template>
|
||||
<div>
|
||||
<TitleGroup>
|
||||
<template slot="title">{{ data.productInfoEtitle }}</template>
|
||||
<template slot="subTitle">{{ data.productInfoCtitle }}</template>
|
||||
</TitleGroup>
|
||||
<div class="content">
|
||||
<div class="left">
|
||||
<div class="contentTitle">{{ data.hwProductInfoDetailList[0].productInfoDetailTitle }}</div>
|
||||
<div class="contentSubTitle">DEVELOPMENT PLATFORM</div>
|
||||
<div class="contentInfo">
|
||||
{{ data.hwProductInfoDetailList[0].productInfoDetailDesc }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<el-image
|
||||
style="width: 100%;height: 100%"
|
||||
:src="data.hwProductInfoDetailList[0].productInfoDetailPic"
|
||||
fit="contain"></el-image>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import banner from '@/assets/image/banner.png'
|
||||
import TitleGroup from "@/components/TitleGroup";
|
||||
import wlw from "@/assets/icon/wlw.png";
|
||||
|
||||
let map = null
|
||||
export default {
|
||||
name: 'PlatformIntroduction',
|
||||
props: ['data'],
|
||||
components: {
|
||||
TitleGroup
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
banner
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import "~@/style.less";
|
||||
|
||||
.content {
|
||||
display: inline-block;
|
||||
width: 62vw;
|
||||
height: 20.1vw;
|
||||
border: 1px solid #ccc3;
|
||||
margin-top: 3.7vw;
|
||||
margin-bottom: 5.2vw;
|
||||
vertical-align: top;
|
||||
|
||||
.left {
|
||||
vertical-align: top;
|
||||
display: inline-block;
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
background-color: #ffffff;
|
||||
|
||||
.contentTitle {
|
||||
position: absolute;
|
||||
top: 18.6%;
|
||||
left: 12.7%;
|
||||
letter-spacing: 1px;
|
||||
font-size: 1.4vw;
|
||||
color: @standard-color;
|
||||
}
|
||||
|
||||
.contentSubTitle {
|
||||
position: absolute;
|
||||
top: 14.6%;
|
||||
left: 12.7%;
|
||||
letter-spacing: 3.2px;
|
||||
font-size: 1.6vw;
|
||||
color: #6666;
|
||||
}
|
||||
|
||||
.contentInfo {
|
||||
text-align: left;
|
||||
position: absolute;
|
||||
top: 35.6%;
|
||||
width: 73%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
letter-spacing: 2.5px;
|
||||
font-size: 0.8vw;
|
||||
line-height: 1.6vw;
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
display: inline-block;
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,98 @@
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<TitleGroup>
|
||||
<template slot="title">{{ data.productInfoEtitle }}</template>
|
||||
<template slot="subTitle">{{ data.productInfoCtitle }}</template>
|
||||
</TitleGroup>
|
||||
<div class="list">
|
||||
<div class="item" v-for="i in data.hwProductInfoDetailList">
|
||||
<div class="icon">
|
||||
<el-image
|
||||
style="width: 100%;height: 100%"
|
||||
:src="i.productInfoDetailPic"
|
||||
fit="contain"></el-image>
|
||||
</div>
|
||||
<div class="itemTitle">{{ i.productInfoDetailTitle }}</div>
|
||||
<div class="itemInfo">{{ i.productInfoDetailDesc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TitleGroup from "@/components/TitleGroup";
|
||||
import wlw from "@/assets/icon/wlw.png";
|
||||
|
||||
let map = null
|
||||
export default {
|
||||
name: 'PlatformAdvantages2',
|
||||
components: {
|
||||
TitleGroup
|
||||
},
|
||||
props:['data'],
|
||||
data() {
|
||||
return {
|
||||
wlw
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
console.log('data',this.data)
|
||||
},
|
||||
methods: {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import "~@/style.less";
|
||||
|
||||
.list {
|
||||
width: 65vw;
|
||||
display: inline-block;
|
||||
margin-top: 3.5vw;
|
||||
margin-bottom: 3.9vw;
|
||||
|
||||
.item {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
width: 47%;
|
||||
height: 10vw;
|
||||
box-shadow: 0 0 3px #0002;
|
||||
margin: 0 1.5% 1.1vw 1.5%;
|
||||
|
||||
.icon {
|
||||
width: 4vw;
|
||||
height: 4vw;
|
||||
position: absolute;
|
||||
top: 54%;
|
||||
left: 18.2%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.itemTitle {
|
||||
top: 37%;
|
||||
left: 33.9%;
|
||||
position: absolute;
|
||||
transform: translatey(-50%);
|
||||
font-size: 1.2vw;
|
||||
letter-spacing: 3px;
|
||||
}
|
||||
|
||||
.itemInfo {
|
||||
top: 62.2%;
|
||||
left: 33.9%;
|
||||
position: absolute;
|
||||
transform: translatey(-50%);
|
||||
font-size: 0.9vw;
|
||||
color: #666;
|
||||
letter-spacing: 2px;
|
||||
text-align: left;
|
||||
white-space: nowrap;
|
||||
width: 63%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,136 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="content">
|
||||
<div class="left">
|
||||
<template slot="title">{{ data.productInfoEtitle }}</template>
|
||||
<template slot="subTitle">{{ data.productInfoCtitle }}</template>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="list">
|
||||
<div class="item" v-for="i in 4">
|
||||
<div class="itemTitle">质量问题早发现</div>
|
||||
<div class="itemInfo">
|
||||
针对变配电场景下高压场/GIS组合电器、变压器、电容电抗蛋、避雷器、高压开关柜、隔离开关等电气设备采用不同的手段进行监测。
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TitleGroup from "@/components/TitleGroup";
|
||||
import wlw from "@/assets/icon/wlw.png";
|
||||
|
||||
let map = null
|
||||
export default {
|
||||
name: 'PlatformAdvantages3',
|
||||
components: {
|
||||
TitleGroup
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
wlw
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import "~@/style.less";
|
||||
|
||||
.content {
|
||||
display: inline-block;
|
||||
padding-top: 5.1vw;
|
||||
width: 65vw;
|
||||
height: 31vw;
|
||||
margin: 0 auto;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
margin-bottom: 5.3vw;
|
||||
|
||||
.left {
|
||||
width: 26%;
|
||||
height: 100%;
|
||||
margin: 0% 2%;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
background-color: #0378f9;
|
||||
|
||||
.leftTitle {
|
||||
color: #fff;
|
||||
font-size: 1.9vw;
|
||||
letter-spacing: 2px;
|
||||
margin-top: 21.7%;
|
||||
margin-left: 11.8%;
|
||||
}
|
||||
|
||||
.leftSubTitle {
|
||||
color: #fff;
|
||||
width: 75%;
|
||||
line-height: 1.8vw;
|
||||
font-size: 1.1vw;
|
||||
letter-spacing: 2px;
|
||||
margin-top: 5.1%;
|
||||
margin-left: 11.8%;
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
width: 68.5%;
|
||||
height: 100%;
|
||||
display: inline-block;
|
||||
|
||||
.list {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.item {
|
||||
display: inline-block;
|
||||
width: 48%;
|
||||
height: 48%;
|
||||
box-shadow: 0 0 3px #0002;
|
||||
background-color: #f2f3f5;
|
||||
|
||||
&:nth-child(1) {
|
||||
margin: 0 4% 3% 0;
|
||||
}
|
||||
|
||||
&:nth-child(2) {
|
||||
margin: 0 0 3% 0;
|
||||
}
|
||||
|
||||
&:nth-child(3) {
|
||||
margin: 0 4% 0 0;
|
||||
}
|
||||
|
||||
.itemTitle {
|
||||
margin-top: 8.2%;
|
||||
margin-left: 7.6%;
|
||||
font-size: 1.2vw;
|
||||
line-height: 1.4vw;
|
||||
color: #000;
|
||||
letter-spacing: 2.7px;
|
||||
border-left: 4px solid #3372ff;
|
||||
padding-left: 0.7vw;
|
||||
}
|
||||
|
||||
.itemInfo {
|
||||
margin-top: 6%;
|
||||
width: 88%;
|
||||
margin-left: 7.3%;
|
||||
font-size: 1.1vw;
|
||||
line-height: 1.8vw;
|
||||
color: #333;
|
||||
letter-spacing: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,46 @@
|
||||
<template>
|
||||
<div>
|
||||
<TitleGroup>
|
||||
<template slot="title">{{ data.productInfoEtitle }}</template>
|
||||
<template slot="subTitle">{{ data.productInfoCtitle }}</template>
|
||||
</TitleGroup>
|
||||
<div class="image">
|
||||
<el-image
|
||||
style="width: 100%;height: 100%"
|
||||
:src="data.hwProductInfoDetailList[0].productInfoDetailPic"
|
||||
fit="contain"></el-image>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TitleGroup from "@/components/TitleGroup";
|
||||
import banner from '@/assets/image/banner.png'
|
||||
|
||||
let map = null
|
||||
export default {
|
||||
name: 'PlatformArchitecture',
|
||||
props: ['data'],
|
||||
components: {
|
||||
TitleGroup
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
banner,
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import "~@/style.less";
|
||||
.image{
|
||||
width: 65vw;
|
||||
height: 33.3vw;
|
||||
display: inline-block;
|
||||
margin: 4vw 0 6vw 0;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,57 @@
|
||||
<template>
|
||||
<div>
|
||||
<TitleGroup>
|
||||
<template slot="title">{{ data.productInfoEtitle }}</template>
|
||||
<template slot="subTitle">{{ data.productInfoCtitle }}</template>
|
||||
</TitleGroup>
|
||||
<div class="pageInfo">{{ data.hwProductInfoDetailList[0].productInfoDetailDesc}}</div>
|
||||
<div class="image">
|
||||
<el-image
|
||||
style="width: 100%;height: 100%"
|
||||
:src="data.hwProductInfoDetailList[0].productInfoDetailPic"
|
||||
></el-image>
|
||||
<!-- fit="contain"></el-image>-->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TitleGroup from "@/components/TitleGroup";
|
||||
import banner from '@/assets/image/banner.png'
|
||||
|
||||
let map = null
|
||||
export default {
|
||||
name: 'PlatformArchitecture',
|
||||
components: {
|
||||
TitleGroup
|
||||
},
|
||||
props:['data'],
|
||||
data() {
|
||||
return {
|
||||
banner,
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import "~@/style.less";
|
||||
.image{
|
||||
width: 65vw;
|
||||
height: 33.3vw;
|
||||
display: inline-block;
|
||||
margin: 4vw 0 6vw 0;
|
||||
}
|
||||
.pageInfo{
|
||||
width: 63vw;
|
||||
margin-top: 0.9vw;
|
||||
display: inline-block;
|
||||
color: #6666;
|
||||
font-size: 1.2vw;
|
||||
line-height: 2.2vw;
|
||||
letter-spacing: 2.8px;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,117 @@
|
||||
<template>
|
||||
<div>
|
||||
<TitleGroup>
|
||||
<template slot="title">{{ data.productInfoEtitle }}</template>
|
||||
<template slot="subTitle">{{ data.productInfoCtitle }}</template>
|
||||
</TitleGroup>
|
||||
<div class="list">
|
||||
<div class="item" v-for="i in sortedList">
|
||||
<div class="icon">
|
||||
<el-image
|
||||
style="width: 100%;height: 100%"
|
||||
:src="i.productInfoDetailPic"
|
||||
fit="contain"></el-image>
|
||||
</div>
|
||||
<div class="itemTitle">{{ i.productInfoDetailTitle }}</div>
|
||||
<div class="itemInfo">{{ i.productInfoDetailDesc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TitleGroup from "@/components/TitleGroup";
|
||||
import wlw from "@/assets/icon/wlw.png";
|
||||
|
||||
let map = null
|
||||
export default {
|
||||
name: 'PlatformFeatures',
|
||||
props: ['data'],
|
||||
components: {
|
||||
TitleGroup
|
||||
},
|
||||
computed: {
|
||||
sortedList() {
|
||||
return this.data.hwProductInfoDetailList.slice().sort((a, b) => a.productInfoDetailOrder - b.productInfoDetailOrder);
|
||||
}
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
wlw
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import "~@/style.less";
|
||||
|
||||
.list {
|
||||
width: 65vw;
|
||||
display: inline-block;
|
||||
margin-top: 3.8vw;
|
||||
margin-bottom: 2.8vw;
|
||||
box-shadow: 0 0 3px #0002;
|
||||
|
||||
.item {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
width: calc(100% / 3 - 2px);
|
||||
height: 13.3vw;
|
||||
border: 1px solid #3332;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
transition: all 0.2s;
|
||||
|
||||
&:hover {
|
||||
background-color: @standard-color;
|
||||
|
||||
.itemTitle {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.itemInfo {
|
||||
color: #eee;
|
||||
}
|
||||
}
|
||||
|
||||
.icon {
|
||||
width: 2.3vw;
|
||||
height: 2.3vw;
|
||||
position: absolute;
|
||||
top: 22%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.itemTitle {
|
||||
top: 42%;
|
||||
left: 50%;
|
||||
position: absolute;
|
||||
transform: translate(-50%, -50%);
|
||||
font-size: 1.1vw;
|
||||
letter-spacing: 1px;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.itemInfo {
|
||||
top: 52.2%;
|
||||
left: 9.6%;
|
||||
position: absolute;
|
||||
font-size: 0.8vw;
|
||||
line-height: 1.5vw;
|
||||
color: #666;
|
||||
letter-spacing: 2.5px;
|
||||
text-align: left;
|
||||
width: 80%;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,199 @@
|
||||
<template>
|
||||
<div>
|
||||
<TitleGroup>
|
||||
<template slot="title">{{ data.productInfoEtitle }}</template>
|
||||
<template slot="subTitle">{{ data.productInfoCtitle }}</template>
|
||||
</TitleGroup>
|
||||
<div class="tabs">
|
||||
<el-tabs v-model="activeName" @tab-click="handleClick">
|
||||
<el-tab-pane :name="`${i.productInfoDetailId}`" :label="i.productInfoDetailTitle" v-for="(i,k) in data.hwProductInfoDetailList.filter(e=>e.parentId ===0)">
|
||||
<transition name="fade">
|
||||
<div v-if="activeName === `${i.productInfoDetailId}`" style="position:relative;">
|
||||
<div class="content">
|
||||
<div class="left">
|
||||
<div class="itemTitle">{{ (info[0]||{}).productInfoDetailTitle }}</div>
|
||||
<div class="itemCode">{{ (info[0]||{}).productInfoDetailDesc }}</div>
|
||||
<div class="image">
|
||||
<el-image
|
||||
style="width: 100%; height: 100%"
|
||||
:src="(info[0]||{}).productInfoDetailPic"
|
||||
fit="contain"></el-image>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="infos" v-for="i in info.filter(e=>!e.productInfoDetailPic)">
|
||||
<div class="infoTitle">{{ i.productInfoDetailTitle }}</div>
|
||||
<div class="infoNum">{{ i.productInfoDetailDesc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</transition>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TitleGroup from "@/components/TitleGroup";
|
||||
import banner from '@/assets/image/banner.png'
|
||||
import {getProductCenterProductDetailInfo} from "@/api/productCenter";
|
||||
|
||||
export default {
|
||||
name: 'HighFrequencyRFID',
|
||||
props:['data'],
|
||||
components: {
|
||||
TitleGroup
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
banner,
|
||||
activeName: '0',
|
||||
info:[]
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.activeName = `${this.data.hwProductInfoDetailList.filter(e=>e.parentId ===0)[0].productInfoDetailId}`
|
||||
getProductCenterProductDetailInfo({parentId:this.data.hwProductInfoDetailList.filter(e=>e.parentId ===0)[0].productInfoDetailId}).then(v=>{
|
||||
this.info = v.data
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
handleClick(e){
|
||||
getProductCenterProductDetailInfo({parentId:e.name}).then(v=>{
|
||||
this.info = v.data
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import "~@/style.less";
|
||||
|
||||
.tabs {
|
||||
text-align: left;
|
||||
margin-top: 2.3vw;
|
||||
|
||||
/deep/ .el-tabs__header {
|
||||
margin: 0 20vw 15px;
|
||||
}
|
||||
|
||||
/deep/ .el-tabs__content {
|
||||
padding: 0 20vw;
|
||||
background-color: fade(@standard-color, 10);
|
||||
}
|
||||
|
||||
/deep/ .el-tabs__nav-wrap::after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/deep/ .el-tabs__item {
|
||||
letter-spacing: 3px;
|
||||
padding: 0 2vw;
|
||||
height: 2.9vw;
|
||||
font-size: 1.6vw;
|
||||
}
|
||||
/deep/.el-tabs__item {
|
||||
line-height: 2.9vw;
|
||||
}
|
||||
|
||||
/deep/ .el-tabs__item.is-active {
|
||||
font-weight: 600;
|
||||
color: @standard-color;
|
||||
}
|
||||
|
||||
/deep/ .el-tabs__active-bar {
|
||||
height: 4px;
|
||||
background-color: @standard-color;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 2.2vw 0;
|
||||
|
||||
.left {
|
||||
width: 34%;
|
||||
height: 21.7vw;
|
||||
display: inline-block;
|
||||
box-shadow: 0 0 3px #0002;
|
||||
background-color: #fff;
|
||||
text-align: center;
|
||||
vertical-align: top;
|
||||
|
||||
.itemTitle {
|
||||
padding-top: 1.2vw;
|
||||
font-size: 1vw;
|
||||
}
|
||||
|
||||
.itemCode {
|
||||
margin-top: 0.2vw;
|
||||
font-size: 1.1vw;
|
||||
}
|
||||
|
||||
.image {
|
||||
width: 80%;
|
||||
margin-top: 1vw;
|
||||
margin-left: 10%;
|
||||
height: 15vw;
|
||||
background-color: cadetblue;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
margin-left: 1%;
|
||||
width: 65%;
|
||||
height: 21.2vw;
|
||||
display: inline-block;
|
||||
box-shadow: 0 0 5px #0002;
|
||||
background-color: #fff;
|
||||
padding-top: 0.5vw;
|
||||
|
||||
.infos {
|
||||
width: 93%;
|
||||
margin: 0 auto;
|
||||
border-bottom: 1px dashed #0003;
|
||||
position: relative;
|
||||
height: 2.9vw;
|
||||
}
|
||||
|
||||
.infoTitle {
|
||||
position: absolute;
|
||||
width: 96%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 4%;
|
||||
text-align: left;
|
||||
font-size: 1vw;
|
||||
letter-spacing: 1px;
|
||||
color: #0009;
|
||||
line-height: 2.9vw;
|
||||
}
|
||||
|
||||
.infoNum {
|
||||
position: absolute;
|
||||
width: 95%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
right: 5%;
|
||||
text-align: right;
|
||||
font-size: 1vw;
|
||||
letter-spacing: 1.4px;
|
||||
color: #000;
|
||||
line-height: 2.9vw;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.fade-enter-active {
|
||||
animation: fadeInRight;
|
||||
animation-duration: 0.5s;
|
||||
}
|
||||
|
||||
.fade-leave-active {
|
||||
animation: fadeOutLeft;
|
||||
animation-duration: 0.5s;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,86 @@
|
||||
<template>
|
||||
<div>
|
||||
<TitleGroup>
|
||||
<template slot="title">{{ data.productInfoEtitle }}</template>
|
||||
<template slot="subTitle">{{ data.productInfoCtitle }}</template>
|
||||
</TitleGroup>
|
||||
<div class="list">
|
||||
<div class="item" v-for=" i in data.hwProductInfoDetailList">
|
||||
<div class="image">
|
||||
<el-image
|
||||
style="width: 100%; height: 100%;"
|
||||
:src="i.productInfoDetailPic"
|
||||
fit="contain"></el-image>
|
||||
</div>
|
||||
<div class="info">
|
||||
<span>
|
||||
{{ i.productInfoDetailDesc }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TitleGroup from "@/components/TitleGroup";
|
||||
import banner from '@/assets/image/banner.png'
|
||||
|
||||
export default {
|
||||
name: 'HighFrequencyRFID',
|
||||
props:['data'],
|
||||
components: {
|
||||
TitleGroup
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
banner,
|
||||
activeName: '1'
|
||||
}
|
||||
},
|
||||
methods: {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import "~@/style.less";
|
||||
.list {
|
||||
width: 65%;
|
||||
margin: 3vw auto 0;
|
||||
|
||||
.item {
|
||||
margin-right: 2.6%;
|
||||
width: 23%;
|
||||
height: 16vw;
|
||||
display: inline-block;
|
||||
box-shadow: 0 0 3px #0002;
|
||||
margin-bottom: 1.4vw;
|
||||
vertical-align: top;
|
||||
|
||||
.image {
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
}
|
||||
|
||||
.info {
|
||||
width: calc(100% - 2.2vw);
|
||||
height: calc(50% - 2.1vw);
|
||||
padding: 1.1vw;
|
||||
font-size: 0.85vw;
|
||||
line-height: 1.2vw;
|
||||
letter-spacing: 0.6px;
|
||||
color: #0006;
|
||||
span{
|
||||
display: inline-block;
|
||||
width: calc(100% );
|
||||
height: calc(100% );
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
&:nth-child(4n) {
|
||||
margin-right: 0%;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,240 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="banner">
|
||||
<el-image
|
||||
style="width: 100%; height: 100%;position:absolute;top: 0;left: 0;"
|
||||
:src="banner"
|
||||
fit="contain"></el-image>
|
||||
<div class="bannerInfo">{{ bannerTitle }}</div>
|
||||
<!-- <el-button type="primary" class="bannerBtn">免费体验</el-button>-->
|
||||
<div class="tabs">
|
||||
<div class="content">
|
||||
<div v-if="tabsList.length<1" v-for="(i,k) in tabsList" @click="checkTabs(i,k)"
|
||||
:class="`tab ${tabsActive === k ? 'active':''}`"
|
||||
:style="`width:${tabsActive === k ? `calc(${100/tabsList.length}% - 3px)`:`${100/tabsList.length}%`}`">
|
||||
{{ i.configTypeName }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div v-for="i in contentList">
|
||||
<EL1 class="platformAdvantages" :configTypeId="configTypeId" v-if="i.configModal === '1'" :data="i"/>
|
||||
<EL2 class="platformIntroduction" :configTypeId="configTypeId" v-if="i.configModal === '2'" :data="i"/>
|
||||
<EL3 class="platformAdvantages2" :configTypeId="configTypeId" v-if="i.configModal === '3'" :data="i"/>
|
||||
<EL4 class="platformAdvantages3" :configTypeId="configTypeId" v-if="i.configModal === '4'" :data="i"/>
|
||||
<EL5 class="platformArchitecture" :configTypeId="configTypeId" v-if="i.configModal === '5'" :data="i"/>
|
||||
<EL6 class="technicalArchitecture" :configTypeId="configTypeId" v-if="i.configModal === '6'" :data="i"/>
|
||||
<EL7 class="platformFeatures" :configTypeId="configTypeId" v-if="i.configModal === '7'" :data="i"/>
|
||||
<EL8 class="highFrequencyRFID" v-if="i.configModal === '8' " :data="i"/>
|
||||
<!-- <UltraHighFrequencyRFID class="ultraHighFrequencyRFID" v-if="i.configModal === '9' " :data="i"/>-->
|
||||
<EL9 class="dataAcquisitionSensing" v-if="i.configModal === '9'" :data="i"/>
|
||||
<EL11 class="dataAcquisitionSensing" v-if="i.configModal === '11'" :data="i"/>
|
||||
<EL12 class="dataAcquisitionSensing" v-if="i.configModal === '12'" :data="i"/>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div v-if="tabsActive === 1">-->
|
||||
<!-- <div v-for="(i, k) in contentList">-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<ContactUs class="contactUs"/>
|
||||
<Copyright class="copyright"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import EL1 from '@/components/element/el1.vue'
|
||||
import EL2 from '@/components/element/el2.vue'
|
||||
import EL3 from '@/components/element/el3.vue'
|
||||
import EL4 from '@/components/element/el4.vue'
|
||||
import EL5 from '@/components/element/el5.vue'
|
||||
import EL6 from '@/components/element/el6.vue'
|
||||
import EL7 from '@/components/element/el7.vue'
|
||||
import EL8 from '@/components/element/el8.vue'
|
||||
import EL9 from '@/components/element/el9.vue'
|
||||
// import EL10 from '@/components/element/el10.vue'
|
||||
import EL11 from '@/components/element/el11.vue'
|
||||
import EL12 from '@/components/element/el12.vue'
|
||||
import ContactUs from '@/components/contactUs'
|
||||
import Copyright from '@/components/copyright'
|
||||
import {getPortalConfigList, getPortalConfigTypeList, getProductCenterProductInfos} from "@/api/productCenter";
|
||||
|
||||
export default {
|
||||
name: 'ProductCenter',
|
||||
components: {
|
||||
EL1,
|
||||
EL2,
|
||||
EL3,
|
||||
EL4,
|
||||
EL5,
|
||||
EL6,
|
||||
EL7,
|
||||
EL8,
|
||||
EL9,
|
||||
// EL10,
|
||||
EL11,
|
||||
EL12,
|
||||
ContactUs,
|
||||
Copyright,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
banner: '',
|
||||
bannerTitle: '',
|
||||
tabsActive: 0,
|
||||
tabsList: [],
|
||||
configTypeId: 0,
|
||||
contentList: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getData()
|
||||
},
|
||||
watch: {
|
||||
'$route'() {
|
||||
this.getData()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getContentList(id) {
|
||||
console.log('id', id)
|
||||
getProductCenterProductInfos({
|
||||
configTypeId: id,
|
||||
// parentId: 0
|
||||
}).then(e => {
|
||||
this.contentList = e.data.sort((a, b) => a.productInfoOrder - b.productInfoOrder)
|
||||
})
|
||||
},
|
||||
checkTabs(i, k) {
|
||||
this.tabsActive = k
|
||||
this.configTypeId = i.configTypeId
|
||||
this.getContentList(i.configTypeId)
|
||||
},
|
||||
getData() {
|
||||
getPortalConfigList({
|
||||
portalConfigType: 2,
|
||||
portalConfigTypeId: this.$route.query.id,
|
||||
pageNum: 1,
|
||||
pageSize: 5
|
||||
}).then(e => {
|
||||
this.banner = e.rows?.[0]?.portalConfigPic
|
||||
this.bannerTitle = e.rows?.[0]?.portalConfigDesc
|
||||
})
|
||||
getPortalConfigTypeList({
|
||||
parentId: this.$route.query.id,
|
||||
pageNum: 1,
|
||||
pageSize: 50
|
||||
}).then(e => {
|
||||
this.tabsList = e.rows
|
||||
this.configTypeId = e.rows?.[0]?.configTypeId
|
||||
if (e.rows?.[0]?.configTypeId) {
|
||||
this.getContentList(e.rows?.[0]?.configTypeId)
|
||||
} else {
|
||||
this.contentList = []
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import "~@/style.less";
|
||||
|
||||
.banner {
|
||||
width: 100%;
|
||||
height: 35.5vw;
|
||||
position: relative;
|
||||
|
||||
.bannerInfo {
|
||||
position: absolute;
|
||||
top: 35%;
|
||||
left: 19%;
|
||||
width: 45%;
|
||||
text-align: left;
|
||||
font-size: 1.4vw;
|
||||
color: @standard-color;
|
||||
line-height: 2.5vw;
|
||||
letter-spacing: 4px;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.bannerBtn {
|
||||
position: absolute;
|
||||
top: 58%;
|
||||
left: 19%;
|
||||
width: 11.5vw;
|
||||
font-size: 1.2vw;
|
||||
line-height: 2vw;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
background: linear-gradient(to bottom, fade(@standard-color, 10), fade(#fff, 10));
|
||||
backdrop-filter: saturate(50%) blur(4px);
|
||||
|
||||
.content {
|
||||
width: 62%;
|
||||
position: relative;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
transform: translateX(-50%);
|
||||
|
||||
.tab {
|
||||
display: inline-block;
|
||||
width: 50%;
|
||||
line-height: 6.2vw;
|
||||
font-size: 1.6vw;
|
||||
letter-spacing: 3px;
|
||||
}
|
||||
|
||||
.tab.active {
|
||||
color: @standard-color;
|
||||
width: calc(50% - 3px);
|
||||
border: 1px solid #fff;
|
||||
box-shadow: 0 0 3px #0002;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.platformAdvantages {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.platformIntroduction {
|
||||
width: 100%;
|
||||
background-color: #f4f9ff;
|
||||
}
|
||||
|
||||
.platformAdvantages2 {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.platformAdvantages3 {
|
||||
width: 100%;
|
||||
background-color: #f6f7fb;
|
||||
}
|
||||
|
||||
.platformArchitecture {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.technicalArchitecture {
|
||||
width: 100%;
|
||||
background-color: #f4f9ff;
|
||||
}
|
||||
|
||||
.contactUs {
|
||||
width: 100%;
|
||||
background-color: #2e445c;
|
||||
}
|
||||
|
||||
.copyright {
|
||||
width: 100%;
|
||||
background-color: #1d3348;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,239 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="banner">
|
||||
<el-image
|
||||
style="width: 100%; height: 100%;position:absolute;top: 0;left: 0;"
|
||||
:src="banner"
|
||||
fit="contain"></el-image>
|
||||
<div class="bannerInfo">{{ bannerTitle }}</div>
|
||||
<!-- <el-button type="primary" class="bannerBtn">免费体验</el-button>-->
|
||||
<div class="tabs">
|
||||
<div class="content">
|
||||
<div v-if="tabsList.length<1" v-for="(i,k) in tabsList" @click="checkTabs(i,k)"
|
||||
:class="`tab ${tabsActive === k ? 'active':''}`"
|
||||
:style="`width:${tabsActive === k ? `calc(${100/tabsList.length}% - 3px)`:`${100/tabsList.length}%`}`">
|
||||
{{ i.configTypeName }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div v-for="i in contentList">
|
||||
<EL1 class="platformAdvantages" :configTypeId="configTypeId" v-if="i.configModal === '1'" :data="i"/>
|
||||
<EL2 class="platformIntroduction" :configTypeId="configTypeId" v-if="i.configModal === '2'" :data="i"/>
|
||||
<EL3 class="platformAdvantages2" :configTypeId="configTypeId" v-if="i.configModal === '3'" :data="i"/>
|
||||
<EL4 class="platformAdvantages3" :configTypeId="configTypeId" v-if="i.configModal === '4'" :data="i"/>
|
||||
<EL5 class="platformArchitecture" :configTypeId="configTypeId" v-if="i.configModal === '5'" :data="i"/>
|
||||
<EL6 class="technicalArchitecture" :configTypeId="configTypeId" v-if="i.configModal === '6'" :data="i"/>
|
||||
<EL7 class="platformFeatures" :configTypeId="configTypeId" v-if="i.configModal === '7'" :data="i"/>
|
||||
<EL8 class="highFrequencyRFID" v-if="i.configModal === '8' " :data="i"/>
|
||||
<!-- <UltraHighFrequencyRFID class="ultraHighFrequencyRFID" v-if="i.configModal === '9' " :data="i"/>-->
|
||||
<EL9 class="dataAcquisitionSensing" v-if="i.configModal === '9'" :data="i"/>
|
||||
<EL11 class="dataAcquisitionSensing" v-if="i.configModal === '11'" :data="i"/>
|
||||
<EL12 class="dataAcquisitionSensing" v-if="i.configModal === '12'" :data="i"/>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div v-if="tabsActive === 1">-->
|
||||
<!-- <div v-for="(i, k) in contentList">-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<ContactUs class="contactUs"/>
|
||||
<Copyright class="copyright"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import EL1 from '@/components/element/el1.vue'
|
||||
import EL2 from '@/components/element/el2.vue'
|
||||
import EL3 from '@/components/element/el3.vue'
|
||||
import EL4 from '@/components/element/el4.vue'
|
||||
import EL5 from '@/components/element/el5.vue'
|
||||
import EL6 from '@/components/element/el6.vue'
|
||||
import EL7 from '@/components/element/el7.vue'
|
||||
import EL8 from '@/components/element/el8.vue'
|
||||
import EL9 from '@/components/element/el9.vue'
|
||||
// import EL10 from '@/components/element/el10.vue'
|
||||
import EL11 from '@/components/element/el11.vue'
|
||||
import EL12 from '@/components/element/el12.vue'
|
||||
import ContactUs from '@/components/contactUs'
|
||||
import Copyright from '@/components/copyright'
|
||||
import {getPortalConfigList, getPortalConfigTypeList, getProductCenterProductInfos} from "@/api/productCenter";
|
||||
|
||||
export default {
|
||||
name: 'ProductCenter',
|
||||
components: {
|
||||
EL1,
|
||||
EL2,
|
||||
EL3,
|
||||
EL4,
|
||||
EL5,
|
||||
EL6,
|
||||
EL7,
|
||||
EL8,
|
||||
EL9,
|
||||
// EL10,
|
||||
EL11,
|
||||
EL12,
|
||||
ContactUs,
|
||||
Copyright,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
banner: '',
|
||||
bannerTitle: '',
|
||||
tabsActive: 0,
|
||||
tabsList: [],
|
||||
configTypeId: 0,
|
||||
contentList: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getData()
|
||||
},
|
||||
watch: {
|
||||
'$route'() {
|
||||
this.getData()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getContentList(id) {
|
||||
getProductCenterProductInfos({
|
||||
configTypeId: id,
|
||||
// parentId: 0
|
||||
}).then(e => {
|
||||
this.contentList = e.data.sort((a, b) => a.productInfoOrder - b.productInfoOrder)
|
||||
})
|
||||
},
|
||||
checkTabs(i, k) {
|
||||
this.tabsActive = k
|
||||
this.configTypeId = i.configTypeId
|
||||
this.getContentList(i.configTypeId)
|
||||
},
|
||||
getData() {
|
||||
getPortalConfigList({
|
||||
portalConfigType: 2,
|
||||
portalConfigTypeId: this.$route.query.id,
|
||||
pageNum: 1,
|
||||
pageSize: 5
|
||||
}).then(e => {
|
||||
this.banner = e.rows?.[0]?.portalConfigPic
|
||||
this.bannerTitle = e.rows?.[0]?.portalConfigDesc
|
||||
})
|
||||
getPortalConfigTypeList({
|
||||
parentId: this.$route.query.id,
|
||||
pageNum: 1,
|
||||
pageSize: 50
|
||||
}).then(e => {
|
||||
this.tabsList = e.rows
|
||||
this.configTypeId = e.rows?.[0]?.configTypeId
|
||||
if (e.rows?.[0]?.configTypeId) {
|
||||
this.getContentList(e.rows?.[0]?.configTypeId)
|
||||
} else {
|
||||
this.contentList = []
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import "~@/style.less";
|
||||
|
||||
.banner {
|
||||
width: 100%;
|
||||
height: 35.5vw;
|
||||
position: relative;
|
||||
|
||||
.bannerInfo {
|
||||
position: absolute;
|
||||
top: 35%;
|
||||
left: 19%;
|
||||
width: 45%;
|
||||
text-align: left;
|
||||
font-size: 1.4vw;
|
||||
color: @standard-color;
|
||||
line-height: 2.5vw;
|
||||
letter-spacing: 4px;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.bannerBtn {
|
||||
position: absolute;
|
||||
top: 58%;
|
||||
left: 19%;
|
||||
width: 11.5vw;
|
||||
font-size: 1.2vw;
|
||||
line-height: 2vw;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
background: linear-gradient(to bottom, fade(@standard-color, 10), fade(#fff, 10));
|
||||
backdrop-filter: saturate(50%) blur(4px);
|
||||
|
||||
.content {
|
||||
width: 62%;
|
||||
position: relative;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
transform: translateX(-50%);
|
||||
|
||||
.tab {
|
||||
display: inline-block;
|
||||
width: 50%;
|
||||
line-height: 6.2vw;
|
||||
font-size: 1.6vw;
|
||||
letter-spacing: 3px;
|
||||
}
|
||||
|
||||
.tab.active {
|
||||
color: @standard-color;
|
||||
width: calc(50% - 3px);
|
||||
border: 1px solid #fff;
|
||||
box-shadow: 0 0 3px #0002;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.platformAdvantages {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.platformIntroduction {
|
||||
width: 100%;
|
||||
background-color: #f4f9ff;
|
||||
}
|
||||
|
||||
.platformAdvantages2 {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.platformAdvantages3 {
|
||||
width: 100%;
|
||||
background-color: #f6f7fb;
|
||||
}
|
||||
|
||||
.platformArchitecture {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.technicalArchitecture {
|
||||
width: 100%;
|
||||
background-color: #f4f9ff;
|
||||
}
|
||||
|
||||
.contactUs {
|
||||
width: 100%;
|
||||
background-color: #2e445c;
|
||||
}
|
||||
|
||||
.copyright {
|
||||
width: 100%;
|
||||
background-color: #1d3348;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,239 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="banner">
|
||||
<el-image
|
||||
style="width: 100%; height: 100%;position:absolute;top: 0;left: 0;"
|
||||
:src="banner"
|
||||
fit="contain"></el-image>
|
||||
<div class="bannerInfo">{{ bannerTitle }}</div>
|
||||
<!-- <el-button type="primary" class="bannerBtn">免费体验</el-button>-->
|
||||
<div class="tabs">
|
||||
<div class="content">
|
||||
<div v-if="tabsList.length<1" v-for="(i,k) in tabsList" @click="checkTabs(i,k)"
|
||||
:class="`tab ${tabsActive === k ? 'active':''}`"
|
||||
:style="`width:${tabsActive === k ? `calc(${100/tabsList.length}% - 3px)`:`${100/tabsList.length}%`}`">
|
||||
{{ i.configTypeName }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div v-for="i in contentList">
|
||||
<EL1 class="platformAdvantages" :configTypeId="configTypeId" v-if="i.configModal === '1'" :data="i"/>
|
||||
<EL2 class="platformIntroduction" :configTypeId="configTypeId" v-if="i.configModal === '2'" :data="i"/>
|
||||
<EL3 class="platformAdvantages2" :configTypeId="configTypeId" v-if="i.configModal === '3'" :data="i"/>
|
||||
<EL4 class="platformAdvantages3" :configTypeId="configTypeId" v-if="i.configModal === '4'" :data="i"/>
|
||||
<EL5 class="platformArchitecture" :configTypeId="configTypeId" v-if="i.configModal === '5'" :data="i"/>
|
||||
<EL6 class="technicalArchitecture" :configTypeId="configTypeId" v-if="i.configModal === '6'" :data="i"/>
|
||||
<EL7 class="platformFeatures" :configTypeId="configTypeId" v-if="i.configModal === '7'" :data="i"/>
|
||||
<EL8 class="highFrequencyRFID" v-if="i.configModal === '8' " :data="i"/>
|
||||
<!-- <UltraHighFrequencyRFID class="ultraHighFrequencyRFID" v-if="i.configModal === '9' " :data="i"/>-->
|
||||
<EL9 class="dataAcquisitionSensing" v-if="i.configModal === '9'" :data="i"/>
|
||||
<EL11 class="dataAcquisitionSensing" v-if="i.configModal === '11'" :data="i"/>
|
||||
<EL12 class="dataAcquisitionSensing" v-if="i.configModal === '12'" :data="i"/>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div v-if="tabsActive === 1">-->
|
||||
<!-- <div v-for="(i, k) in contentList">-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<ContactUs class="contactUs"/>
|
||||
<Copyright class="copyright"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import EL1 from '@/components/element/el1.vue'
|
||||
import EL2 from '@/components/element/el2.vue'
|
||||
import EL3 from '@/components/element/el3.vue'
|
||||
import EL4 from '@/components/element/el4.vue'
|
||||
import EL5 from '@/components/element/el5.vue'
|
||||
import EL6 from '@/components/element/el6.vue'
|
||||
import EL7 from '@/components/element/el7.vue'
|
||||
import EL8 from '@/components/element/el8.vue'
|
||||
import EL9 from '@/components/element/el9.vue'
|
||||
// import EL10 from '@/components/element/el10.vue'
|
||||
import EL11 from '@/components/element/el11.vue'
|
||||
import EL12 from '@/components/element/el12.vue'
|
||||
import ContactUs from '@/components/contactUs'
|
||||
import Copyright from '@/components/copyright'
|
||||
import {getPortalConfigList, getPortalConfigTypeList, getProductCenterProductInfos} from "@/api/productCenter";
|
||||
|
||||
export default {
|
||||
name: 'ProductCenter',
|
||||
components: {
|
||||
EL1,
|
||||
EL2,
|
||||
EL3,
|
||||
EL4,
|
||||
EL5,
|
||||
EL6,
|
||||
EL7,
|
||||
EL8,
|
||||
EL9,
|
||||
// EL10,
|
||||
EL11,
|
||||
EL12,
|
||||
ContactUs,
|
||||
Copyright,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
banner: '',
|
||||
bannerTitle: '',
|
||||
tabsActive: 0,
|
||||
tabsList: [],
|
||||
configTypeId: 0,
|
||||
contentList: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getData()
|
||||
},
|
||||
watch: {
|
||||
'$route'() {
|
||||
this.getData()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getContentList(id) {
|
||||
getProductCenterProductInfos({
|
||||
configTypeId: id,
|
||||
// parentId: 0
|
||||
}).then(e => {
|
||||
this.contentList = e.data.sort((a, b) => a.productInfoOrder - b.productInfoOrder)
|
||||
})
|
||||
},
|
||||
checkTabs(i, k) {
|
||||
this.tabsActive = k
|
||||
this.configTypeId = i.configTypeId
|
||||
this.getContentList(i.configTypeId)
|
||||
},
|
||||
getData() {
|
||||
getPortalConfigList({
|
||||
portalConfigType: 2,
|
||||
portalConfigTypeId: this.$route.query.id,
|
||||
pageNum: 1,
|
||||
pageSize: 5
|
||||
}).then(e => {
|
||||
this.banner = e.rows?.[0]?.portalConfigPic
|
||||
this.bannerTitle = e.rows?.[0]?.portalConfigDesc
|
||||
})
|
||||
getPortalConfigTypeList({
|
||||
parentId: this.$route.query.id,
|
||||
pageNum: 1,
|
||||
pageSize: 50
|
||||
}).then(e => {
|
||||
this.tabsList = e.rows
|
||||
this.configTypeId = e.rows?.[0]?.configTypeId
|
||||
if (e.rows?.[0]?.configTypeId) {
|
||||
this.getContentList(e.rows?.[0]?.configTypeId)
|
||||
} else {
|
||||
this.contentList = []
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import "~@/style.less";
|
||||
|
||||
.banner {
|
||||
width: 100%;
|
||||
height: 35.5vw;
|
||||
position: relative;
|
||||
|
||||
.bannerInfo {
|
||||
position: absolute;
|
||||
top: 35%;
|
||||
left: 19%;
|
||||
width: 45%;
|
||||
text-align: left;
|
||||
font-size: 1.4vw;
|
||||
color: @standard-color;
|
||||
line-height: 2.5vw;
|
||||
letter-spacing: 4px;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.bannerBtn {
|
||||
position: absolute;
|
||||
top: 58%;
|
||||
left: 19%;
|
||||
width: 11.5vw;
|
||||
font-size: 1.2vw;
|
||||
line-height: 2vw;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
background: linear-gradient(to bottom, fade(@standard-color, 10), fade(#fff, 10));
|
||||
backdrop-filter: saturate(50%) blur(4px);
|
||||
|
||||
.content {
|
||||
width: 62%;
|
||||
position: relative;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
transform: translateX(-50%);
|
||||
|
||||
.tab {
|
||||
display: inline-block;
|
||||
width: 50%;
|
||||
line-height: 6.2vw;
|
||||
font-size: 1.6vw;
|
||||
letter-spacing: 3px;
|
||||
}
|
||||
|
||||
.tab.active {
|
||||
color: @standard-color;
|
||||
width: calc(50% - 3px);
|
||||
border: 1px solid #fff;
|
||||
box-shadow: 0 0 3px #0002;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.platformAdvantages {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.platformIntroduction {
|
||||
width: 100%;
|
||||
background-color: #f4f9ff;
|
||||
}
|
||||
|
||||
.platformAdvantages2 {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.platformAdvantages3 {
|
||||
width: 100%;
|
||||
background-color: #f6f7fb;
|
||||
}
|
||||
|
||||
.platformArchitecture {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.technicalArchitecture {
|
||||
width: 100%;
|
||||
background-color: #f4f9ff;
|
||||
}
|
||||
|
||||
.contactUs {
|
||||
width: 100%;
|
||||
background-color: #2e445c;
|
||||
}
|
||||
|
||||
.copyright {
|
||||
width: 100%;
|
||||
background-color: #1d3348;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,239 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="banner">
|
||||
<el-image
|
||||
style="width: 100%; height: 100%;position:absolute;top: 0;left: 0;"
|
||||
:src="banner"
|
||||
fit="contain"></el-image>
|
||||
<div class="bannerInfo">{{ bannerTitle }}</div>
|
||||
<!-- <el-button type="primary" class="bannerBtn">免费体验</el-button>-->
|
||||
<div class="tabs">
|
||||
<div class="content">
|
||||
<div v-if="tabsList.length<1" v-for="(i,k) in tabsList" @click="checkTabs(i,k)"
|
||||
:class="`tab ${tabsActive === k ? 'active':''}`"
|
||||
:style="`width:${tabsActive === k ? `calc(${100/tabsList.length}% - 3px)`:`${100/tabsList.length}%`}`">
|
||||
{{ i.configTypeName }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div v-for="i in contentList">
|
||||
<EL1 class="platformAdvantages" :configTypeId="configTypeId" v-if="i.configModal === '1'" :data="i"/>
|
||||
<EL2 class="platformIntroduction" :configTypeId="configTypeId" v-if="i.configModal === '2'" :data="i"/>
|
||||
<EL3 class="platformAdvantages2" :configTypeId="configTypeId" v-if="i.configModal === '3'" :data="i"/>
|
||||
<EL4 class="platformAdvantages3" :configTypeId="configTypeId" v-if="i.configModal === '4'" :data="i"/>
|
||||
<EL5 class="platformArchitecture" :configTypeId="configTypeId" v-if="i.configModal === '5'" :data="i"/>
|
||||
<EL6 class="technicalArchitecture" :configTypeId="configTypeId" v-if="i.configModal === '6'" :data="i"/>
|
||||
<EL7 class="platformFeatures" :configTypeId="configTypeId" v-if="i.configModal === '7'" :data="i"/>
|
||||
<EL8 class="highFrequencyRFID" v-if="i.configModal === '8' " :data="i"/>
|
||||
<!-- <UltraHighFrequencyRFID class="ultraHighFrequencyRFID" v-if="i.configModal === '9' " :data="i"/>-->
|
||||
<EL9 class="dataAcquisitionSensing" v-if="i.configModal === '9'" :data="i"/>
|
||||
<EL11 class="dataAcquisitionSensing" v-if="i.configModal === '11'" :data="i"/>
|
||||
<EL12 class="dataAcquisitionSensing" v-if="i.configModal === '12'" :data="i"/>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div v-if="tabsActive === 1">-->
|
||||
<!-- <div v-for="(i, k) in contentList">-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<ContactUs class="contactUs"/>
|
||||
<Copyright class="copyright"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import EL1 from '@/components/element/el1.vue'
|
||||
import EL2 from '@/components/element/el2.vue'
|
||||
import EL3 from '@/components/element/el3.vue'
|
||||
import EL4 from '@/components/element/el4.vue'
|
||||
import EL5 from '@/components/element/el5.vue'
|
||||
import EL6 from '@/components/element/el6.vue'
|
||||
import EL7 from '@/components/element/el7.vue'
|
||||
import EL8 from '@/components/element/el8.vue'
|
||||
import EL9 from '@/components/element/el9.vue'
|
||||
// import EL10 from '@/components/element/el10.vue'
|
||||
import EL11 from '@/components/element/el11.vue'
|
||||
import EL12 from '@/components/element/el12.vue'
|
||||
import ContactUs from '@/components/contactUs'
|
||||
import Copyright from '@/components/copyright'
|
||||
import {getPortalConfigList, getPortalConfigTypeList, getProductCenterProductInfos} from "@/api/productCenter";
|
||||
|
||||
export default {
|
||||
name: 'ProductCenter',
|
||||
components: {
|
||||
EL1,
|
||||
EL2,
|
||||
EL3,
|
||||
EL4,
|
||||
EL5,
|
||||
EL6,
|
||||
EL7,
|
||||
EL8,
|
||||
EL9,
|
||||
// EL10,
|
||||
EL11,
|
||||
EL12,
|
||||
ContactUs,
|
||||
Copyright,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
banner: '',
|
||||
bannerTitle: '',
|
||||
tabsActive: 0,
|
||||
tabsList: [],
|
||||
configTypeId: 0,
|
||||
contentList: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getData()
|
||||
},
|
||||
watch: {
|
||||
'$route'() {
|
||||
this.getData()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getContentList(id) {
|
||||
getProductCenterProductInfos({
|
||||
configTypeId: id,
|
||||
// parentId: 0
|
||||
}).then(e => {
|
||||
this.contentList = e.data.sort((a, b) => a.productInfoOrder - b.productInfoOrder)
|
||||
})
|
||||
},
|
||||
checkTabs(i, k) {
|
||||
this.tabsActive = k
|
||||
this.configTypeId = i.configTypeId
|
||||
this.getContentList(i.configTypeId)
|
||||
},
|
||||
getData() {
|
||||
getPortalConfigList({
|
||||
portalConfigType: 2,
|
||||
portalConfigTypeId: this.$route.query.id,
|
||||
pageNum: 1,
|
||||
pageSize: 5
|
||||
}).then(e => {
|
||||
this.banner = e.rows?.[0]?.portalConfigPic
|
||||
this.bannerTitle = e.rows?.[0]?.portalConfigDesc
|
||||
})
|
||||
getPortalConfigTypeList({
|
||||
parentId: this.$route.query.id,
|
||||
pageNum: 1,
|
||||
pageSize: 50
|
||||
}).then(e => {
|
||||
this.tabsList = e.rows
|
||||
this.configTypeId = e.rows?.[0]?.configTypeId
|
||||
if (e.rows?.[0]?.configTypeId) {
|
||||
this.getContentList(e.rows?.[0]?.configTypeId)
|
||||
} else {
|
||||
this.contentList = []
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import "~@/style.less";
|
||||
|
||||
.banner {
|
||||
width: 100%;
|
||||
height: 35.5vw;
|
||||
position: relative;
|
||||
|
||||
.bannerInfo {
|
||||
position: absolute;
|
||||
top: 35%;
|
||||
left: 19%;
|
||||
width: 45%;
|
||||
text-align: left;
|
||||
font-size: 1.4vw;
|
||||
color: @standard-color;
|
||||
line-height: 2.5vw;
|
||||
letter-spacing: 4px;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.bannerBtn {
|
||||
position: absolute;
|
||||
top: 58%;
|
||||
left: 19%;
|
||||
width: 11.5vw;
|
||||
font-size: 1.2vw;
|
||||
line-height: 2vw;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
background: linear-gradient(to bottom, fade(@standard-color, 10), fade(#fff, 10));
|
||||
backdrop-filter: saturate(50%) blur(4px);
|
||||
|
||||
.content {
|
||||
width: 62%;
|
||||
position: relative;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
transform: translateX(-50%);
|
||||
|
||||
.tab {
|
||||
display: inline-block;
|
||||
width: 50%;
|
||||
line-height: 6.2vw;
|
||||
font-size: 1.6vw;
|
||||
letter-spacing: 3px;
|
||||
}
|
||||
|
||||
.tab.active {
|
||||
color: @standard-color;
|
||||
width: calc(50% - 3px);
|
||||
border: 1px solid #fff;
|
||||
box-shadow: 0 0 3px #0002;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.platformAdvantages {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.platformIntroduction {
|
||||
width: 100%;
|
||||
background-color: #f4f9ff;
|
||||
}
|
||||
|
||||
.platformAdvantages2 {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.platformAdvantages3 {
|
||||
width: 100%;
|
||||
background-color: #f6f7fb;
|
||||
}
|
||||
|
||||
.platformArchitecture {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.technicalArchitecture {
|
||||
width: 100%;
|
||||
background-color: #f4f9ff;
|
||||
}
|
||||
|
||||
.contactUs {
|
||||
width: 100%;
|
||||
background-color: #2e445c;
|
||||
}
|
||||
|
||||
.copyright {
|
||||
width: 100%;
|
||||
background-color: #1d3348;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue