|
|
|
@ -5,28 +5,39 @@
|
|
|
|
|
style="width: 100%; height: 100%;position:absolute;top: 0;left: 0;"
|
|
|
|
|
:src="banner"
|
|
|
|
|
fit="contain"></el-image>
|
|
|
|
|
<div class="bannerInfo">青岛海威物联科技有限公司,致力于工业物联网软硬件系统研发、生产和销售,提供感知互联的工业化联网整体解决方案。</div>
|
|
|
|
|
<div class="bannerInfo">{{ bannerTitle }}</div>
|
|
|
|
|
<el-button type="primary" class="bannerBtn">免费体验</el-button>
|
|
|
|
|
<div class="tabs">
|
|
|
|
|
<div class="content">
|
|
|
|
|
<div @click="checkTabs(1)" :class="`tab ${tabsActive === 1 ? 'active':''}`">物联网平台</div>
|
|
|
|
|
<div @click="checkTabs(2)" :class="`tab ${tabsActive === 2 ? 'active':''}`">物联网硬件产品系列</div>
|
|
|
|
|
<div v-for="(i,k) in tabsList" @click="checkTabs(i,k)" :class="`tab ${tabsActive === k ? 'active':''}`">
|
|
|
|
|
{{ i.configTypeName }}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div v-if="tabsActive === 1">
|
|
|
|
|
<platformAdvantages class="platformAdvantages"/>
|
|
|
|
|
<PlatformIntroduction class="platformIntroduction"/>
|
|
|
|
|
<PlatformAdvantages2 class="platformAdvantages2"/>
|
|
|
|
|
<PlatformAdvantages3 class="platformAdvantages3"/>
|
|
|
|
|
<PlatformArchitecture class="platformArchitecture"/>
|
|
|
|
|
<TechnicalArchitecture class="technicalArchitecture"/>
|
|
|
|
|
<platformFeatures class="platformFeatures"/>
|
|
|
|
|
<div v-if="tabsActive === 0">
|
|
|
|
|
<div v-for="i in contentList">
|
|
|
|
|
<platformAdvantages class="platformAdvantages" :configTypeId="configTypeId" v-if="i.configModal === '1'"
|
|
|
|
|
:data="i"/>
|
|
|
|
|
<PlatformIntroduction class="platformIntroduction" :configTypeId="configTypeId" v-if="i.configModal === '2'"
|
|
|
|
|
:data="i"/>
|
|
|
|
|
<PlatformAdvantages2 class="platformAdvantages2" :configTypeId="configTypeId" v-if="i.configModal === '3'"
|
|
|
|
|
:data="i"/>
|
|
|
|
|
<PlatformAdvantages3 class="platformAdvantages3" :configTypeId="configTypeId" v-if="i.configModal === '4'"
|
|
|
|
|
:data="i"/>
|
|
|
|
|
<PlatformArchitecture class="platformArchitecture" :configTypeId="configTypeId" v-if="i.configModal === '5'"
|
|
|
|
|
:data="i"/>
|
|
|
|
|
<TechnicalArchitecture class="technicalArchitecture" :configTypeId="configTypeId" v-if="i.configModal === '6'"
|
|
|
|
|
:data="i"/>
|
|
|
|
|
<platformFeatures class="platformFeatures" :configTypeId="configTypeId" v-if="i.configModal === '7'" :data="i"/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div v-if="tabsActive === 2">
|
|
|
|
|
<HighFrequencyRFID class="highFrequencyRFID"/>
|
|
|
|
|
<UltraHighFrequencyRFID class="ultraHighFrequencyRFID"/>
|
|
|
|
|
<DataAcquisitionSensing class="dataAcquisitionSensing"/>
|
|
|
|
|
<div v-if="tabsActive === 1">
|
|
|
|
|
<div v-for="i in contentList">
|
|
|
|
|
<HighFrequencyRFID class="highFrequencyRFID" v-if="i.configModal === '8'" :data="i"/>
|
|
|
|
|
<UltraHighFrequencyRFID class="ultraHighFrequencyRFID" v-if="i.configModal === '9'" :data="i"/>
|
|
|
|
|
<DataAcquisitionSensing class="dataAcquisitionSensing" v-if="i.configModal === '10'" :data="i"/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<ContactUs class="contactUs"/>
|
|
|
|
|
<Copyright class="copyright"/>
|
|
|
|
@ -34,7 +45,6 @@
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import banner from '@/assets/image/banner.png'
|
|
|
|
|
import PlatformAdvantages from './platformAdvantages'
|
|
|
|
|
import PlatformIntroduction from './platformIntroduction'
|
|
|
|
|
import PlatformAdvantages2 from './platformAdvantages2'
|
|
|
|
@ -47,6 +57,7 @@ import UltraHighFrequencyRFID from './product/ultraHighFrequencyRFID'
|
|
|
|
|
import DataAcquisitionSensing from './product/dataAcquisitionSensing'
|
|
|
|
|
import ContactUs from '@/components/contactUs'
|
|
|
|
|
import Copyright from '@/components/copyright'
|
|
|
|
|
import {getPortalConfigList, getPortalConfigTypeList, getProductCenterProductInfos} from "@/api/productCenter";
|
|
|
|
|
|
|
|
|
|
export default {
|
|
|
|
|
name: 'ProductCenter',
|
|
|
|
@ -66,13 +77,50 @@ export default {
|
|
|
|
|
},
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
banner,
|
|
|
|
|
tabsActive: 1,
|
|
|
|
|
banner: '',
|
|
|
|
|
bannerTitle: '',
|
|
|
|
|
tabsActive: 0,
|
|
|
|
|
tabsList: [],
|
|
|
|
|
configTypeId: 0,
|
|
|
|
|
contentList: []
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
mounted() {
|
|
|
|
|
this.getData()
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
checkTabs(e) {
|
|
|
|
|
this.tabsActive = e
|
|
|
|
|
getContentList(id) {
|
|
|
|
|
getProductCenterProductInfos({
|
|
|
|
|
configTypeId: id
|
|
|
|
|
}).then(e => {
|
|
|
|
|
this.contentList = e.data.sort((a, b) => a.productInfoOrder - b.productInfoOrder)
|
|
|
|
|
console.log(this.contentList)
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
checkTabs(i, k) {
|
|
|
|
|
this.tabsActive = k
|
|
|
|
|
this.configTypeId = i.configTypeId
|
|
|
|
|
this.getContentList(i.configTypeId)
|
|
|
|
|
},
|
|
|
|
|
getData() {
|
|
|
|
|
getPortalConfigList({
|
|
|
|
|
portalConfigType: 2,
|
|
|
|
|
portalConfigTypeId: 4,
|
|
|
|
|
pageNum: 1,
|
|
|
|
|
pageSize: 5
|
|
|
|
|
}).then(e => {
|
|
|
|
|
this.banner = e.rows?.[0]?.portalConfigPic
|
|
|
|
|
this.bannerTitle = e.rows?.[0]?.portalConfigDesc
|
|
|
|
|
})
|
|
|
|
|
getPortalConfigTypeList({
|
|
|
|
|
parentId: 4,
|
|
|
|
|
pageNum: 1,
|
|
|
|
|
pageSize: 50
|
|
|
|
|
}).then(e => {
|
|
|
|
|
this.tabsList = e.rows
|
|
|
|
|
this.configTypeId = e.rows?.[0]?.configTypeId
|
|
|
|
|
this.getContentList(e.rows?.[0]?.configTypeId)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
@ -133,7 +181,7 @@ export default {
|
|
|
|
|
|
|
|
|
|
.tab.active {
|
|
|
|
|
color: @standard-color;
|
|
|
|
|
width: calc(50% - 2px);
|
|
|
|
|
width: calc(50% - 3px);
|
|
|
|
|
border: 1px solid #fff;
|
|
|
|
|
box-shadow: 0 0 3px #0002;
|
|
|
|
|
}
|
|
|
|
|