|
@@ -29,30 +29,40 @@
|
|
|
<body>
|
|
|
|
|
|
|
|
|
- <div id="app" >
|
|
|
+ <div id="app">
|
|
|
+
|
|
|
<div class="erMenu">
|
|
|
<div>
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
+
|
|
|
<!--====== HEADER START ======-->
|
|
|
<header class="header-absolute sticky-header">
|
|
|
<div class="custom-container-one">
|
|
|
- <div class="header-top-area">
|
|
|
- <div class="container align-items-center">
|
|
|
- <!-- <div class="col-md-6 col-sm-7">
|
|
|
- <ul class="contact-content">
|
|
|
- <li>
|
|
|
- <a href="javascipt:void();">www.chinausky.com</a>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <a href="javascipt:void();">400 633 8668</a>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- </div> -->
|
|
|
+ <div class="mainmenu-area container">
|
|
|
+ <div class="d-flex align-items-center justify-content-between">
|
|
|
+ <nav class="main-menu">
|
|
|
+ <div class="logo">
|
|
|
+ <a href="/index.html"><img src="../assets/img/logo-white.png" alt="uskylogo"></a>
|
|
|
+ </div>
|
|
|
+ <div class="menu-items">
|
|
|
+ <ul v-if="columnList" >
|
|
|
+ <li v-for="item in columnList" :key="item.id" :class="
|
|
|
+ bbb==item.sname? 'active':''" >
|
|
|
+ <a :href="item.sname">{{item.categoryName}}</a>
|
|
|
+ <ul class="submenu" >
|
|
|
+ <li v-if="item.children" v-for="aa in item.children" :key="aa.id"><a :href="`${item.sname}?id=${aa.id}`"> <span style="font-weight:bold;margin-right:10px">·</span> {{aa.sname}}</a></li>
|
|
|
+
|
|
|
+
|
|
|
+ </ul>
|
|
|
+ </li>
|
|
|
+
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </nav>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div id="headerNav"></div>
|
|
|
<div>
|
|
|
<div class="mobile-menu"></div>
|
|
|
</div>
|
|
@@ -72,8 +82,9 @@
|
|
|
<!--====== SOLUTION TYPE START ======-->
|
|
|
<section style="background:#F4F8FD" class="solutionType">
|
|
|
<div class="container" style="text-align:center">
|
|
|
- <div class=" solutionTypeOne" v-for="(item,i) in solutionTypes" :class="item.id == colin ? 'active' : ''" @click="facilityClick(i, item)">
|
|
|
- <div style="width:40px;height:40px;;overflow:hidden;margin:0 auto" >
|
|
|
+ <div class=" solutionTypeOne" v-for="(item,i) in solutionTypes" :class="item.id == id ? 'active' : ''"
|
|
|
+ @click="facilityClick(i, item)">
|
|
|
+ <div style="width:40px;height:40px;;overflow:hidden;margin:0 auto">
|
|
|
<img :src="item.imagePath" alt="">
|
|
|
</div>
|
|
|
<P>{{item.categoryName}}</P>
|
|
@@ -82,7 +93,7 @@
|
|
|
</section>
|
|
|
<!--====== SOLUTION TYPE END ======-->
|
|
|
|
|
|
-
|
|
|
+ <!--====== SOLUTION SECTION START ======-->
|
|
|
<section class="solution-section pt-40">
|
|
|
<div class="container pt-40 pt-40" v-for="arr in solutionArray">
|
|
|
<div class="section-title both-border mb-20">
|
|
@@ -91,28 +102,28 @@
|
|
|
|
|
|
<!-- type1 背景 开始 -->
|
|
|
<div class="row align-items-center justify-content-center" v-if="arr.lmtitle === '1'">
|
|
|
- <div class="col-md-12 mb-20" v-html="arr.content">
|
|
|
+ <div class="col-md-12 mb-20" v-html="arr.content">
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 1 背景 结束 -->
|
|
|
|
|
|
<!-- 2 痛点与挑战 开始 -->
|
|
|
<div class="row align-items-center justify-content-center" v-if="arr.lmtitle === '2'">
|
|
|
- <div class="col-md-12 mb-20" v-html="arr.content">
|
|
|
+ <div class="col-md-12 mb-20" v-html="arr.content">
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 2 痛点与挑战 结束 -->
|
|
|
|
|
|
<!-- 3 方案概述 开始 -->
|
|
|
<div class="row align-items-center justify-content-center" v-if="arr.lmtitle === '3'">
|
|
|
- <div class="col-md-12 mb-20" v-html="arr.content">
|
|
|
+ <div class="col-md-12 mb-20" v-html="arr.content">
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 3 方案概述 结束 -->
|
|
|
|
|
|
<!-- 4 系统架构 开始 -->
|
|
|
<div class="row align-items-center justify-content-center" v-if="arr.lmtitle === '4'">
|
|
|
- <div class="pt-40 mb-40 col-md-12 solution-img" >
|
|
|
+ <div class="pt-40 mb-40 col-md-12 solution-img">
|
|
|
<img :src="arr.image" alt="">
|
|
|
</div>
|
|
|
</div>
|
|
@@ -120,27 +131,28 @@
|
|
|
|
|
|
<!-- 5 功能模块 开始 -->
|
|
|
<div class="row align-items-center justify-content-center" v-if="arr.lmtitle === '5'">
|
|
|
- <div class="col-md-12 mb-20" v-html="arr.content">
|
|
|
+ <div class="col-md-12 mb-20" v-html="arr.content">
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 5 功能模块 结束 -->
|
|
|
|
|
|
|
|
|
-
|
|
|
+
|
|
|
</div>
|
|
|
<br>
|
|
|
<br>
|
|
|
|
|
|
|
|
|
- <div class="container pt-40" v-for="arr in array" style="display:none">
|
|
|
+ <div class="container pt-40" v-for="arr in array">
|
|
|
<div class="section-title both-border mb-20">
|
|
|
<span class="title-tag2">{{arr.title}}</span>
|
|
|
</div>
|
|
|
|
|
|
-
|
|
|
+
|
|
|
|
|
|
<!-- ordinary普通样式 开始 -->
|
|
|
- <div class="row align-items-center justify-content-center" v-if="arr.cssType === 'ordinary'" v-for="cont in arr.content">
|
|
|
+ <div class="row align-items-center justify-content-center" v-if="arr.cssType === 'ordinary'"
|
|
|
+ v-for="cont in arr.content">
|
|
|
<div class="col-md-12 mb-20" v-if="cont.text_content != ''">
|
|
|
{{cont.text_content}}
|
|
|
</div>
|
|
@@ -170,7 +182,8 @@
|
|
|
<!-- list列表样式 开始 -->
|
|
|
|
|
|
<!-- titleList带标题列表样式 开始 -->
|
|
|
- <div class="row align-items-center justify-content-center" v-if="arr.cssType === 'titleList'" v-for="cont in arr.content">
|
|
|
+ <div class="row align-items-center justify-content-center" v-if="arr.cssType === 'titleList'"
|
|
|
+ v-for="cont in arr.content">
|
|
|
<div class="col-md-12" v-if="typeof cont.text_content == 'string' && cont.text_content != ''">
|
|
|
<ul>
|
|
|
<li>
|
|
@@ -192,22 +205,32 @@
|
|
|
<div class="row mb-60 align-items-center justify-content-center" v-if="arr.cssType === 'doubleTabs'">
|
|
|
<div class="col-md-12 BoxShadow">
|
|
|
<ul id="nav-tabs-ul" class="nav nav-tabs col-md-12" role="tabcontent">
|
|
|
- <li class="col-md-2 col-sm col" role="parrentation" v-for="(cont,i) in arr.content" :style="'max-width: calc(100% / '+arr.content.length+'); flex: 0 0 calc(100% /'+arr.content.length+');'">
|
|
|
- <a :class="i==0?'active':''" :href="'#'+cont.text_href" :aria-controls="cont.text_href" role="tab" data-toggle="tab">{{cont.text_title}}</a>
|
|
|
+ <li class="col-md-2 col-sm col" role="parrentation" v-for="(cont,i) in arr.content"
|
|
|
+ :style="'max-width: calc(100% / '+arr.content.length+'); flex: 0 0 calc(100% /'+arr.content.length+');'">
|
|
|
+ <a :class="i==0?'active':''" :href="'#'+cont.text_href" :aria-controls="cont.text_href"
|
|
|
+ role="tab" data-toggle="tab">{{cont.text_title}}</a>
|
|
|
</li>
|
|
|
</ul>
|
|
|
|
|
|
<!-- Tab panes -->
|
|
|
<div class="tab-content tab-content-one">
|
|
|
- <div v-for="(cont,i) in arr.content" role="tabpanel" :class="i==0 ? 'active tab-pane tab-pane-one' : 'tab-pane tab-pane-one'" :id="cont.text_href">
|
|
|
+ <div v-for="(cont,i) in arr.content" role="tabpanel"
|
|
|
+ :class="i==0 ? 'active tab-pane tab-pane-one' : 'tab-pane tab-pane-one'"
|
|
|
+ :id="cont.text_href">
|
|
|
<ul class="nav nav-tabs col-md-12 nav-tabs-li" role="tabcontent">
|
|
|
- <li class="col-md-4 col-sm-4 col-4" role="parrentation" v-for="(textcont,j) in cont.text_content" :style="'max-width: calc(100% / '+cont.text_content.length+'); flex: 0 0 calc(100% /'+cont.text_content.length+');'">
|
|
|
- <a :class="j==0? 'active':''" :href="'#'+textcont.href" :aria-controls="textcont.href" role="tab" data-toggle="tab">{{textcont.title}}</a>
|
|
|
+ <li class="col-md-4 col-sm-4 col-4" role="parrentation"
|
|
|
+ v-for="(textcont,j) in cont.text_content"
|
|
|
+ :style="'max-width: calc(100% / '+cont.text_content.length+'); flex: 0 0 calc(100% /'+cont.text_content.length+');'">
|
|
|
+ <a :class="j==0? 'active':''" :href="'#'+textcont.href"
|
|
|
+ :aria-controls="textcont.href" role="tab"
|
|
|
+ data-toggle="tab">{{textcont.title}}</a>
|
|
|
</li>
|
|
|
</ul>
|
|
|
|
|
|
<div class="tab-content tab-content-two">
|
|
|
- <div v-for="(textcont,j) in cont.text_content" role="tabpanel" :class="j==0?'tab-pane tab-pane-tow active':'tab-pane tab-pane-tow'" :id="textcont.href">
|
|
|
+ <div v-for="(textcont,j) in cont.text_content" role="tabpanel"
|
|
|
+ :class="j==0?'tab-pane tab-pane-tow active':'tab-pane tab-pane-tow'"
|
|
|
+ :id="textcont.href">
|
|
|
<div class="paneContent">
|
|
|
<img :src="textcont.picture" alt="">
|
|
|
<div>
|
|
@@ -230,20 +253,49 @@
|
|
|
</div>
|
|
|
<!-- doubleTabs双重tabs切换样式 结束 -->
|
|
|
</div>
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
</section>
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
<!--====== SOLUTION SECTION END ======-->
|
|
|
|
|
|
+
|
|
|
<!--====== FOOTER PART START ======-->
|
|
|
- <div id="footer"></div>
|
|
|
+ <footer>
|
|
|
+ <!-- widgets -->
|
|
|
+ <div class="footer-widget-area">
|
|
|
+ <div class="container">
|
|
|
+ <div class="row footerOne">
|
|
|
+ <div class="col-lg-2 col-md-6 col-sm-6 footerWidth">
|
|
|
+ <div class="copyrigt-or-code d-flex flex-column align-items-center ">
|
|
|
+ <img width="130 " height="130 " src="https://aiot.usky.cn/uskyq/assets/img/qr_code.png">
|
|
|
+ <span style="text-align: left;color:#fff;margin-top:10px ">微信公众号</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="footerNone" style="width:12% !important;" v-for="item in columnList" :key="item.id">
|
|
|
+ <div class="widget nav-widget d-flex justify-content-center ">
|
|
|
+ <div >
|
|
|
+ <h5 class="widget-title"><a href="/solution/index.html">{{item.categoryName}}</a></h5>
|
|
|
+ <ul>
|
|
|
+ <li v-if="item.children" v-for="r in item.children" :key="r.id">
|
|
|
+ <a :href="`${item.sname}?id=${r.id}`"> {{r.sname}}</a>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- copyright -->
|
|
|
+ <div class="copy-right-area ">
|
|
|
+ <div class="container ">
|
|
|
+ <div class="row copyrigt-text ">
|
|
|
+ <div class="col-lg-12 ">
|
|
|
+ <p>Copyright © 2001- 2022 Usky. All Rights Reserved. 永天股份 版权所有</p>
|
|
|
+ <p>增值电信业务经营许可证(IDC、ISP)编号B2-20080010</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </footer>
|
|
|
<!--====== FOOTER PART END ======-->
|
|
|
|
|
|
</div>
|
|
@@ -265,37 +317,6 @@
|
|
|
<!--====== Vue js======-->
|
|
|
<script src="../assets/js/commonVue.js "></script>
|
|
|
<script>
|
|
|
- $(function() {
|
|
|
- $('#footer').load("../footer.html");
|
|
|
- $('#headerNav').load("../headerNav.html");
|
|
|
- $(".menu-items ul li").hover(function() {
|
|
|
- $(".erMenu>div").html("")
|
|
|
- $(this).addClass("menuactive").siblings().removeClass("menuactive");
|
|
|
- if ($(this).children("a").text() == "解决方案") {
|
|
|
- $(this).addClass("menuactive").siblings()
|
|
|
- var data = `
|
|
|
- <ul class="erMenuList">
|
|
|
- <li><a href="../solution/index.html?solution_type=1">智慧安防</a></li>
|
|
|
- <li><a href="../solution/index.html?solution_type=2">智慧消防</a></li>
|
|
|
- <li><a href="../solution/index.html?solution_type=3">智慧建筑能源管理</a></li>
|
|
|
- <li><a href="../solution/index.html?solution_type=4">智慧电力综合管理</a></li>
|
|
|
- <li><a href="../solution/index.html?solution_type=5">智慧园区无人机综合管理</a></li>
|
|
|
- <li><a href="../solution/index.html?solution_type=6">智慧楼宇综合运营</a></li>
|
|
|
- </ul>`
|
|
|
- $(".erMenu>div").append(data)
|
|
|
- $(".erMenu").fadeIn()
|
|
|
- } else {
|
|
|
- $(".erMenu").fadeOut()
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- });
|
|
|
- $(".erMenu").hover(function() {}, function() {
|
|
|
- $(".erMenu").fadeOut()
|
|
|
- })
|
|
|
-
|
|
|
- })
|
|
|
-
|
|
|
|
|
|
</script>
|
|
|
</body>
|