Начало Каталог Помощ
Вход
yuanMM
/
uskyq
1
0
Разклонения 0
Файлове Задачи 0 Заявки за сливане 0 Уики
Преглед на файлове

百叶窗 ； 走马灯特效；更换图片 修改样式等

ming преди 4 години
родител
f647c3a30b
ревизия
17c8b45cb2
променени са 43 файла, в които са добавени 2175 реда и са изтрити 869 реда
Разделен изглед Покажи статистика за разликите
  1. 105 10
      about/index.html
  2. 116 68
      assets/css/style.css
  3. BIN
      assets/img/about-banner.png
  4. BIN
      assets/img/about/bg11.png
  5. BIN
      assets/img/about/honor1.png
  6. BIN
      assets/img/about/honor2.png
  7. BIN
      assets/img/about/honor3.png
  8. BIN
      assets/img/about/honor4.png
  9. BIN
      assets/img/banner/011.png
  10. BIN
      assets/img/banner/0111.png
  11. BIN
      assets/img/banner/022.png
  12. BIN
      assets/img/banner/03.png
  13. BIN
      assets/img/banner/033.png
  14. BIN
      assets/img/banner/0333.png
  15. BIN
      assets/img/banner/044.png
  16. BIN
      assets/img/banner/055.png
  17. BIN
      assets/img/banner/0555.png
  18. BIN
      assets/img/join-banner.png
  19. BIN
      assets/img/news-banner.png
  20. BIN
      assets/img/solution-banner.png
  21. 3 0
      assets/summernote/plugin/jquery-blinds-player/.vscode/settings.json
  22. 104 0
      assets/summernote/plugin/jquery-blinds-player/css/shutter.css
  23. BIN
      assets/summernote/plugin/jquery-blinds-player/images/shutter_1.jpg
  24. BIN
      assets/summernote/plugin/jquery-blinds-player/images/shutter_2.jpg
  25. BIN
      assets/summernote/plugin/jquery-blinds-player/images/shutter_3.jpg
  26. BIN
      assets/summernote/plugin/jquery-blinds-player/images/shutter_4.jpg
  27. BIN
      assets/summernote/plugin/jquery-blinds-player/images/shutter_nextBtn.png
  28. BIN
      assets/summernote/plugin/jquery-blinds-player/images/shutter_prevBtn.png
  29. BIN
      assets/summernote/plugin/jquery-blinds-player/images/shutter_shadow.png
  30. 48 0
      assets/summernote/plugin/jquery-blinds-player/index.html
  31. 3 0
      assets/summernote/plugin/jquery-blinds-player/js/jquery.min.js
  32. 614 0
      assets/summernote/plugin/jquery-blinds-player/js/shutter.js
  33. 2 0
      assets/summernote/plugin/jquery-blinds-player/js/velocity.js
  34. 1 1
      example/index.html
  35. 89 34
      index.html
  36. 33 7
      join/index.html
  37. 33 7
      news/index.html
  38. 33 7
      news/read.html
  39. 33 7
      news/trade/index.html
  40. 678 676
      product/index.html
  41. 144 23
      solution/detail.html
  42. 32 6
      solution/detail2.html
  43. 104 23
      solution/index.html

+ 105 - 10
about/index.html
Целия файл 

@@ -17,6 +17,12 @@
 
     <link rel="stylesheet" href="../assets/css/default.css" />

     <!--====== Style css ======-->

     <link rel="stylesheet" href="../assets/css/style.css" />

+

+    <!-- 走马灯 -->

+    <link rel="stylesheet" type="text/css" href="https://www.jq22.com/demo/jqswipepmd202005102134/css/swiper.css" />

+    <script src="https://cdn.bootcdn.net/ajax/libs/Swiper/5.3.8/js/swiper.min.js" type="text/javascript" charset="utf-8"></script>

+

+

 </head>

 

 <body>

@@ -58,14 +64,40 @@
 
                                         <li>

                                             <a>城市治理</a>

                                             <ul class="submenu">

-                                                <li><a href="../solution">智能招商</a></li>

-                                                <li><a href="../solution">智慧安防</a></li>

-                                                <li><a href="../solution">智慧消防</a></li>

+                                                <li><a href="../solution">智慧招商</a></li>

+                                                <li><a>智慧安防</a></li>

+                                                <li><a>智慧消防</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>民生服务</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧停车</a></li>

+                                                <li><a>智慧教育</a></li>

+                                                <li><a>智慧路灯</a></li>

+                                                <li><a>环境监测</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>园区服务</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧社区</a></li>

+                                                <li><a>智慧商圈</a></li>

+                                                <li><a>智慧办公</a></li>

+                                                <li><a>智慧家居</a></li>

+                                                <li><a>通信配套</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>其他拓展</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧国土</a></li>

+                                                <li><a>智慧民防</a></li>

+                                                <li><a>智慧交通</a></li>

+                                                <li><a>智慧用电</a></li>

+                                                <li><a>通信水务</a></li>

                                             </ul>

                                         </li>

-                                        <li><a href="../solution">民生服务</a></li>

-                                        <li><a href="../solution">园区服务</a></li>

-                                        <li><a href="../solution">其他拓展</a></li>

                                     </ul>

                                 </li>

                                 <li>

@@ -95,7 +127,7 @@
 
     </header>

 

     <!--====== COMMON BREADCRUMB START ======-->

-    <section class="common-bradcrumb-section inner-banner" style="background-image: url('../assets/img/about/bg.jpg');">

+    <section class="common-bradcrumb-section inner-banner" style="background-image: url('../assets/img/about-banner.png');">

     </section>

     <!--====== COMMON BREADCRUMB END ======-->

 

@@ -150,7 +182,7 @@
 
                 <div class="section-title text-center both-border pb-50">

                     <span class="title-tag">发展历程</span>

                 </div>

-                <p class="history-des">我们公司总部位于上海,经过12年的发展，我们的分公司分布于美国加州、香港、深圳、北京、江西南昌、江西上饶、江苏常州、山东济南等。</p>

+                <p class="history-des">我们公司总部位于上海,经过16年的发展，我们的分公司分布于美国加州、香港、深圳、北京、江西南昌、江西上饶、江苏常州、山东济南等。</p>

                 <div class="row">

 

 

@@ -173,7 +205,42 @@
 
                 <p class="credential-tit2">更快,更安全！

                 </p>

             </div>

-            <img src="../assets/img/about/honor.png" onclick="javascript: window.open('../assets/img/about/honor.png')" />

+            <div class="row">

+

+                <div class="swiper-container" id="case4">

+                    <div class="swiper-wrapper">

+                        <div class="col-md-3 col-3 swiper-slide">

+                            <img src="../assets/img/about/honor1.png" alt="">

+                        </div>

+                        <div class="col-md-3 col-3 swiper-slide">

+                            <img src="../assets/img/about/honor2.png" alt="">

+                        </div>

+                        <div class="col-md-3 col-3 swiper-slide">

+                            <img src="../assets/img/about/honor3.png" alt="">

+                        </div>

+                        <div class="col-md-3 col-3 swiper-slide">

+                            <img src="../assets/img/about/honor4.png" alt="">

+                        </div>

+                    </div>

+

+                </div>

+

+

+                <!-- <div class="col-md-3 col-3">

+                    <img src="../assets/img/about/honor1.png" alt="">

+                </div>

+                <div class="col-md-3 col-3">

+                    <img src="../assets/img/about/honor2.png" alt="">

+                </div>

+                <div class="col-md-3 col-3">

+                    <img src="../assets/img/about/honor3.png" alt="">

+                </div>

+                <div class="col-md-3 col-3">

+                    <img src="../assets/img/about/honor4.png" alt="">

+                </div> -->

+            </div>

+

+            <!-- <img src="../assets/img/about/honor.png" onclick="javascript: window.open('../assets/img/about/honor.png')" /> -->

         </div>

     </section>

     <!--====== CREDENTIAL END======-->

@@ -322,6 +389,7 @@
 
     </footer>

     <!--====== FOOTER PART END ======-->

 

+

     <script src="../assets/js/vendor/modernizr-3.6.0.min.js"></script>

     <script src="../assets/js/vendor/jquery-1.12.4.min.js"></script>

     <!--====== Bootstrap js ======-->

@@ -329,9 +397,36 @@
 
     <script src="../assets/js/popper.min.js"></script>

     <!--====== Mean Menu ======-->

     <script src="../assets/js/jquery.meanmenu.min.js"></script>

-    <script src="../assets/css/font_mun4q5ltrbp/iconfont.js"></script>

     <!--====== Main js ======-->

     <script src="../assets/js/main.js"></script>

+    <!--====== Example Info js======-->

+    <script src="../assets/js/exampleinfo.js"></script>

+    <!--====== Vue Developer js ======-->

+    <!-- <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> -->

+    <!--====== Vue js======-->

+    <script src="../assets/js/vue.min.js"></script>

+    <script>

+        $(function() {

+            var swiper = new Swiper('#case4', {

+                loop: true, //允许从第一张到最后一张，或者从最后一张到第一张  循环属性

+                slidesPerView: 4, // 设置显示三张

+                //centeredSlides : true,     //使当前图片居中显示

+                slidesPerGroup: 1, //定义1张图片为一组

+                autoplay: true, //可选选项，自动滑动

+                speed: 2000, //设置过度时间

+                grabCursor: true, //鼠标样式根据浏览器不同而定 

+                autoplay: {

+                    delay: 1,

+                    disableOnInteraction: false,

+                },

+                /*  设置每隔3000毫秒切换 */

+

+            });

+        })

+    </script>

+

+

+

 </body>

 

 </html>

+ 116 - 68
assets/css/style.css
Целия файл 

@@ -164,8 +164,8 @@
 
     }

     

     a {

-        -webkit-transition: all 0.3s ease-out 0s;

-        transition: all 0.3s ease-out 0s;

+        /* -webkit-transition: all 0.3s ease-out 0s;

+        transition: all 0.3s ease-out 0s; */

     }

     

     a,

@@ -930,9 +930,9 @@
 
     

     header .mobile-menu.mean-container .mean-bar a.meanmenu-reveal {

         margin-right: 15px;

-        margin-top: -75px;

+        margin-top: -66px;

         border: 2px solid rgba(255, 255, 255, 0.8);

-        padding: 17px 15px;

+        padding: 10px 10px;

         width: 26px;

         z-index: 222;

     }

@@ -4491,12 +4491,12 @@
 
     }

     

     .join-section .content p {

-        font-size: 18px;

+        font-size: 16px;

         margin-bottom: 8px;

     }

     

     .join-section .content .email {

-        font-size: 18px;

+        font-size: 16px;

     }

     

     @media(max-width:992px) {

@@ -5222,41 +5222,28 @@
 
     p.subtit {

         font-size: 20px

     }

-    

-    @media (max-width: 992px) {

-        .title-tag2 {

-            font-size: 20px;

-        }

-        .img-left .solution-list-tit {

-            margin-top: 60px

-        }

-        .img-right .main-btn {

-            margin-bottom: 20px

-        }

-        .solution-section {

-            padding-top: 0

-        }

-    }

     /* why */

     

     .whyUs-section .whyUs-text p {

-        text-indent: 25px;

-        line-height: 1.8;

+        /* text-indent: 25px; */

     }

     

     @media (min-width: 991px) {

         .pos-top {

             margin-top: 50px

         }

+        .whyUs-text {

+            padding-left: 80px

+        }

     }

     

     .whyUs-item p {

-        font-size: 22px;

+        font-size: 20px;

         color: #153A78

     }

     

     .whyUs-item {

-        padding: 30px 0 60px;

+        padding: 24px 0 34px;

         opacity: 1;

         background: #ffffff;

         border-radius: 10px;

@@ -5270,7 +5257,8 @@
 
         background: #639BFF

     }

     

-    .whyUs-item.active i {

+    .whyUs-item.active i,

+    .whyUs-item.active p {

         color: #fff;

     }

     

@@ -5286,7 +5274,7 @@
 
     }

     

     .whyUs-item i {

-        font-size: 70px;

+        font-size: 60px;

         color: #639BFF;

         margin-bottom: 20px

     }

@@ -5375,15 +5363,7 @@
 
     

     .solution-section p {

         font-size: 18px;

-        margin-bottom: 20px

-    }

-    

-    .solution-img img {

-        width: 70%;

-    }

-    

-    .solution-list .solution-img img {

-        width: 90%

+        margin-bottom: 40px

     }

     

     .solution-img {

@@ -5392,22 +5372,12 @@
 
     

     .solution-list-tit {

         font-size: 20px;

-        margin-bottom: 40px

+        margin-bottom: 20px

     }

     

     .solution-list .learn-more {

         margin-top: 0

     }

-    

-    @media (min-width: 992px) {

-        .solution-section p {

-            width: 96%

-        }

-        .solution-section.img-left p,

-        .solution-section.img-left .solution-list-tit {

-            margin-left: 4%

-        }

-    }

     /* solution-detail */

     

     .solution-detail .section-content>p {

@@ -5418,6 +5388,36 @@
 
     .solution-detail .section-content img {

         margin-top: 30px

     }

+    

+    @media (max-width: 992px) {

+        .title-tag2 {

+            font-size: 20px;

+        }

+        .solution-section p,

+        .solution-detail .section-content>p {

+            font-size: 16px;

+        }

+        .img-left .solution-list-tit {

+            margin-top: 60px

+        }

+        .img-right .main-btn {

+            margin-bottom: 20px

+        }

+        .solution-section {

+            padding-top: 40px;

+            padding-bottom: 40px

+        }

+    }

+    

+    @media (min-width: 992px) {

+        .solution-section p {

+            width: 96%

+        }

+        .solution-section.img-left p,

+        .solution-section.img-left .solution-list-tit {

+            margin-left: 4%

+        }

+    }

     /* solution-detail2 */

     

     .list-content {

@@ -5661,6 +5661,33 @@
 
         -webkit-box-shadow: 0px 10px 20px 10px rgb(179 202 216 / 20%);

         box-shadow: 0px 10px 20px 10px rgb(179 202 216 / 20%)

     }

+    /* .solution-list-section .solution-img {

+        float: left

+    }

+    

+    .solution-list-section .solution-dest {

+        float: right

+    } */

+    

+    .solution-list-section:nth-child(even) .solution-img {

+        float: right

+    }

+    

+    .solution-list-section:nth-child(even) .solution-dest {

+        float: left

+    }

+    

+    .solution-list-section:nth-child(odd) .solution-img {

+        float: left

+    }

+    

+    .solution-list-section:nth-child(odd) .solution-dest {

+        float: right

+    }

+    

+    .solution-list {

+        overflow: hidden

+    }

     

     @media(min-width:992px) {

         .about-introduce-section .img-box {

@@ -5684,29 +5711,50 @@
 
         }

     }

     

-    @-webkit-keyframes Slick-FastSwipeIn {

-        0% {

-            -webkit-transform: rotate3d(0, 1, 0, 150deg) scale(0) perspective(400px);

-            transform: rotate3d(0, 1, 0, 150deg) scale(0) perspective(400px);

+    @media (max-width: 500px) {

+        .section-title span.title-tag {

+            font-size: 30px

         }

-        100% {

-            -webkit-transform: rotate3d(0, 1, 0, 0deg) scale(1) perspective(400px);

-            transform: rotate3d(0, 1, 0, 0deg) scale(1) perspective(400px);

+        h2.subtitle {

+            font-size: 24px

         }

-    }

-    

-    @keyframes Slick-FastSwipeIn {

-        0% {

-            -webkit-transform: rotate3d(0, 1, 0, 150deg) scale(0) perspective(400px);

-            transform: rotate3d(0, 1, 0, 150deg) scale(0) perspective(400px);

+        .whyUs-item i {

+            font-size: 50px

         }

-        100% {

-            -webkit-transform: rotate3d(0, 1, 0, 0deg) scale(1) perspective(400px);

-            transform: rotate3d(0, 1, 0, 0deg) scale(1) perspective(400px);

+        .main-btn {

+            padding: 6px 20px

+        }

+        .pro-tit {

+            font-size: 16px;

+        }

+        .solution-detail p.subtit {

+            font-size: 18px;

+        }

+        .page-des {

+            display: none;

+        }

+        .news-content-section .content li {

+            padding: 25px 0

+        }

+        .about-intro-top p {

+            font-size: 16px

+        }

+        .about-introduce-section .img-box img {

+            margin-top: 20px

+        }

+        .credential-tit1 {

+            font-size: 18px

+        }

+        .credential-tit2 {

+            font-size: 26px

+        }

+        .about-sub-company-section p {

+            font-size: 16px

         }

     }

-    /*     

-    .slick-active {

-        -webkit-animation: Slick-FastSwipeIn 1s both;

-        animation: Slick-FastSwipeIn 1s both;

-    } */
 
+    

+    @media (max-width: 768px) {

+        .news-section .col-md-6:nth-child(3):before {

+            height: 2px

+        }

+    }

BIN
assets/img/about-banner.png
Целия файл


BIN
assets/img/about/bg11.png
Целия файл


BIN
assets/img/about/honor1.png
Целия файл


BIN
assets/img/about/honor2.png
Целия файл


BIN
assets/img/about/honor3.png
Целия файл


BIN
assets/img/about/honor4.png
Целия файл


BIN
assets/img/banner/011.png
Целия файл


BIN
assets/img/banner/0111.png
Целия файл


BIN
assets/img/banner/022.png
Целия файл


BIN
assets/img/banner/03.png
Целия файл


BIN
assets/img/banner/033.png
Целия файл


BIN
assets/img/banner/0333.png
Целия файл


BIN
assets/img/banner/044.png
Целия файл


BIN
assets/img/banner/055.png
Целия файл


BIN
assets/img/banner/0555.png
Целия файл


BIN
assets/img/join-banner.png
Целия файл


BIN
assets/img/news-banner.png
Целия файл


BIN
assets/img/solution-banner.png
Целия файл


+ 3 - 0
assets/summernote/plugin/jquery-blinds-player/.vscode/settings.json
Целия файл 

@@ -0,0 +1,3 @@
 
+{
 
+    "liveServer.settings.port": 5502
 
+}

+ 104 - 0
assets/summernote/plugin/jquery-blinds-player/css/shutter.css
Целия файл 

@@ -0,0 +1,104 @@
 
+/* * {

+    margin: 0;

+    padding: 0;

+} */

+

+

+/* body {

+    background-color: #333333;

+} */

+

+

+/* img {

+    border: 0;

+    vertical-align: top;

+} */

+

+

+/* ul,

+li {

+    list-style: none;

+} */

+

+.shutter {

+    overflow: hidden;

+    width: 100%;

+    height: 90vh;

+    max-height: 860px;

+    position: relative;

+    /* margin: 50px auto; */

+    /* border-radius: 10px; */

+}

+

+.shutter-img {

+    z-index: 1;

+}

+

+.shutter-img,

+.shutter-img a {

+    position: absolute;

+    left: 0;

+    top: 0;

+    width: 100%;

+    height: 100%;

+}

+

+.shutter-img a {

+    cursor: default;

+}

+

+.shutter-img a>img,

+.shutter-img a>div {

+    width: 100%;

+    height: 100%;

+}

+

+.animate-img {

+    background-size: cover;

+    background-position: center center

+}

+

+.shutter-img .created {

+    overflow: hidden;

+    position: absolute;

+    z-index: 20;

+}

+

+.shutter-btn {}

+

+.shutter-btn li {

+    position: absolute;

+    z-index: 2;

+    top: 50%;

+    width: 49px;

+    height: 49px;

+    margin-top: -25px;

+    cursor: pointer;

+}

+

+.shutter-btn li.prev {

+    left: 20px;

+    background: url(../images/shutter_prevBtn.png) no-repeat 0 -49px;

+}

+

+.shutter-btn li.next {

+    right: 20px;

+    background: url(../images/shutter_nextBtn.png) no-repeat 0 -49px;

+}

+

+.shutter-desc {

+    position: absolute;

+    z-index: 2;

+    left: 0;

+    bottom: 0;

+    width: 100%;

+    height: 36px;

+    background: url(../images/shutter_shadow.png) repeat;

+}

+

+.shutter-desc p {

+    padding-left: 20px;

+    line-height: 36px;

+    color: #fff;

+    font-size: 14px;

+}

BIN
assets/summernote/plugin/jquery-blinds-player/images/shutter_1.jpg
Целия файл


BIN
assets/summernote/plugin/jquery-blinds-player/images/shutter_2.jpg
Целия файл


BIN
assets/summernote/plugin/jquery-blinds-player/images/shutter_3.jpg
Целия файл


BIN
assets/summernote/plugin/jquery-blinds-player/images/shutter_4.jpg
Целия файл


BIN
assets/summernote/plugin/jquery-blinds-player/images/shutter_nextBtn.png
Целия файл


BIN
assets/summernote/plugin/jquery-blinds-player/images/shutter_prevBtn.png
Целия файл


BIN
assets/summernote/plugin/jquery-blinds-player/images/shutter_shadow.png
Целия файл


+ 48 - 0
assets/summernote/plugin/jquery-blinds-player/index.html
Целия файл 

@@ -0,0 +1,48 @@
 
+<!DOCTYPE html>

+<html lang="en">

+

+<head>

+    <meta charset="UTF-8">

+    <title>jQuery多种百叶窗风格切换焦点图插件DEMO演示</title>

+

+    <link rel="stylesheet" href="css/shutter.css">

+

+</head>

+

+<body>

+

+    <div class="shutter">

+        <div class="shutter-img">

+            <a href="#" data-shutter-title="Iron Man"><img src="images/shutter_1.jpg" alt="#"></a>

+            <a href="#" data-shutter-title="Super Man"><img src="images/shutter_2.jpg" alt="#"></a>

+            <a href="#" data-shutter-title="The Hulk"><img src="images/shutter_3.jpg" alt="#"></a>

+            <a href="#" data-shutter-title="The your"><img src="images/shutter_4.jpg" alt="#"></a>

+        </div>

+        <ul class="shutter-btn">

+            <li class="prev"></li>

+            <li class="next"></li>

+        </ul>

+    </div>

+

+    <script src="js/jquery.min.js"></script>

+    <script src="js/velocity.js"></script>

+    <script src="js/shutter.js"></script>

+    <script>

+        $(function() {

+            $('.shutter').shutter({

+                shutterW: 1000, // 容器宽度

+                shutterH: 358, // 容器高度

+                isAutoPlay: true, // 是否自动播放

+                playInterval: 3000, // 自动播放时间

+                curDisplay: 3, // 当前显示页

+                fullPage: false // 是否全屏展示

+            });

+        });

+    </script>

+

+    <div style="text-align:center;clear:both">

+

+    </div>

+</body>

+

+</html>

Файловите разлики са ограничени, защото са твърде много
+ 3 - 0
assets/summernote/plugin/jquery-blinds-player/js/jquery.min.js


+ 614 - 0
assets/summernote/plugin/jquery-blinds-player/js/shutter.js
Целия файл 

@@ -0,0 +1,614 @@
 
+/**

+ * Coder: EzrealY

+ * Time: 2017.07.31

+ * Mail: 1005526074@qq.com

+ * 效果原作者: https://oss.so/article/71

+ */

+

+;

+(function($, window, document, undefined) {

+

+    var Shutter = function(elem, options) {

+        this.defaults = {

+            // shutterW: 1200,

+            // shutterH: 500,

+            isAutoPlay: false,

+            playInterval: 3000,

+            curDisplay: 0,

+            fullPage: false

+        };

+        this.opts = $.extend({}, this.defaults, options);

+

+        this.inital(elem);

+    };

+

+    Shutter.prototype = {

+        play: function() {

+            var self = this;

+

+            if (this.opts.isAutoPlay) {

+                clearInterval(this.playTime);

+

+                this.playTime = setInterval(function() {

+                    self.$nextBtn.click();

+                }, this.opts.playInterval);

+            }

+        },

+

+        moveSwitch: function(randomNum, command, index) {

+            switch (randomNum) {

+                // case 0:

+                //     this.gridWhole(index, 0);

+                //     break;

+                // case 1:

+                //     this.gridWhole(index, 1);

+                //     break;

+                // case 2:

+                //     this.gridWhole(index, 2);

+                //     break;

+                // case 3:

+                //     this.gridWhole(index, 3);

+                //     break;

+                // case 4:

+                //     this.gridTop(index, 0);

+                //     break;

+                case 5:

+                    this.gridTop(index, 1);

+                    break;

+                case 6:

+                    this.gridTop(index, 2);

+                    break;

+                case 7:

+                    this.gridLeft(index, 0);

+                    break;

+                case 8:

+                    this.gridLeft(index, 1);

+                    break;

+                case 9:

+                    this.gridLeft(index, 2);

+                    break;

+                case 10:

+                    this.gridOpacity(index);

+                    break;

+                case 11:

+                    this.gridAccordion(index);

+                    break;

+                case 12:

+                    this.gridLittle(index);

+                    break;

+                case 13:

+                    this.gridSwitch(index);

+                    break;

+                default:

+                    this.gridTop(index, 0);

+                    break;

+            }

+        },

+

+        toggleMove: function(command, index) {

+            if (!command) {

+                if (this.curDisplay === index) {

+                    return;

+                } else if (this.curDisplay === 0 && index === this.shutterItem_len - 1 ||

+                    index < this.curDisplay) {

+                    command = 'prev';

+                } else {

+                    command = 'next';

+                }

+            }

+

+            if (!index) {

+                if (command === 'prev') {

+                    index = this.curDisplay - 1;

+

+                    if (this.curDisplay === 0) {

+                        index = this.shutterItem_len - 1;

+                    }

+                } else {

+                    index = this.curDisplay + 1;

+

+                    if (this.curDisplay === this.shutterItem_len - 1) {

+                        index = 0;

+                    }

+                }

+            }

+

+            this.$shutterDesc.animate({ bottom: -36 });

+

+            var random = function(min, max) {

+                return Math.floor(Math.random() * (max + 1) - min);

+            };

+

+            this.moveSwitch(random(0, 13), command, index);

+

+            this.shutterTitle = this.$shutterItem.eq(index).attr('data-shutter-title');

+        },

+

+        initalShutter: function() {

+            var $curElem = this.$shutterItem.eq(this.curDisplay);

+            var $nearlyElem = this.$shutterItem.not($curElem);

+

+            $curElem.css('zIndex', 20);

+            $nearlyElem.each(function(i) {

+                $(this).css('zIndex', ++i);

+            });

+

+            this.$shutter.css({ width: this.opts.shutterW, height: this.opts.shutterH });

+

+            if (this.opts.fullPage) {

+                this.$shutter.css({

+                    width: $(window).width(),

+                    height: $(window).height(),

+                    margin: 0,

+                    borderRadius: 0,

+                    border: 'none'

+                });

+            }

+        },

+

+        inital: function(elem) {

+            var self = this;

+            this.$shutter = elem;

+            this.$shutterItem = this.$shutter.find('.shutter-img a');

+            this.$prevBtn = this.$shutter.find('.shutter-btn .prev');

+            this.$nextBtn = this.$shutter.find('.shutter-btn .next');

+            this.$shutterNav = this.$shutter.find('.shutter-nav li');

+            this.$shutterDesc = this.$shutter.find('.shutter-desc');

+

+            this.shutterItem_len = this.$shutterItem.length;

+            this.curDisplay = this.opts.curDisplay > this.shutterItem_len - 1 ? this.opts.curDisplay = this.shutterItem_len - 1 : this.opts.curDisplay;

+            this.b_stop = true;

+            this.shutterTitle = '';

+            this.playTime = null;

+

+            this.initalShutter();

+

+            this.shutterW = this.$shutter.width();

+            this.shutterH = this.$shutter.height();

+

+            this.$prevBtn.bind('click', function() {

+                if (self.b_stop) {

+                    self.b_stop = false;

+

+                    self.toggleMove('prev');

+                }

+            });

+            this.$nextBtn.bind('click', function() {

+                if (self.b_stop) {

+                    self.b_stop = false;

+

+                    self.toggleMove('next');

+                    self.$shutterDesc.animate({ bottom: -36 });

+                }

+            });

+

+            if (this.opts.fullPage) {

+                $(window).resize(function() {

+                    setTimeout(function() {

+                        self.$shutter.css({ width: $(this).width(), height: $(this).height() });

+

+                        self.shutterW = self.$shutter.width();

+                        self.shutterH = self.$shutter.height();

+                    }, 30);

+                });

+            }

+

+

+            this.play();

+            this.$shutter.hover(function() {

+                clearInterval(self.playTime);

+            }, function() {

+                self.play();

+            });

+        },

+

+

+        // 图片切换方法

+        recovery: function(target, cur, index, backup, interval) {

+            var self = this;

+

+            setTimeout(function() {

+                target.css('zIndex', 20);

+                cur.css('zIndex', self.curDisplay).html(backup);

+                self.curDisplay = index;

+                self.$shutterDesc.animate({ bottom: 0 }).find('p').text(self.shutterTitle);

+

+                self.b_stop = true;

+            }, interval);

+        },

+

+        gridWhole: function(index, showNum) {

+            var self = this;

+            var $curElem = this.$shutterItem.eq(this.curDisplay);

+            var $targetElem = this.$shutterItem.eq(index);

+            var backup = $curElem.html();

+            var $createElem = $('<div class="created"></div>');

+            var movingVal = 0;

+

+            $targetElem.css('zIndex', 19);

+            $curElem.find('.animate-img').fadeOut();

+

+            $createElem.html(backup).css({

+                position: 'absolute',

+                zIndex: 20,

+                left: 0,

+                top: 0,

+                overflow: 'hidden',

+                width: this.shutterW,

+                height: this.shutterH

+            });

+

+            $curElem.append($createElem);

+

+            if (showNum === 0) {

+                movingVal = this.shutterW;

+

+                $createElem.velocity({ left: movingVal }, { duration: 1000 });

+            } else if (showNum === 1) {

+                movingVal = -this.shutterW;

+

+                $createElem.velocity({ left: movingVal }, { duration: 1000 });

+            } else if (showNum === 2) {

+                movingVal = this.shutterH;

+

+                $createElem.velocity({ top: movingVal }, { duration: 1000 });

+            } else if (showNum === 3) {

+                movingVal = -this.shutterH;

+

+                $createElem.velocity({ top: movingVal }, { duration: 1000 });

+            }

+

+            $createElem.find('.animate-img').css({

+                display: 'block',

+                width: this.shutterW,

+                height: this.shutterH

+            });

+

+            this.recovery($targetElem, $curElem, index, backup, 1200);

+        },

+

+        gridTop: function(index, showNum) {

+            var self = this;

+            var $curElem = this.$shutterItem.eq(this.curDisplay);

+            var $targetElem = this.$shutterItem.eq(index);

+            var backup = $curElem.html();

+            var speed = 0;

+

+            $targetElem.css('zIndex', 19);

+            $curElem.find('.animate-img').fadeOut();

+

+            for (var i = 0; i < 12; i++) {

+                var $createElem = $('<div class="created"></div>');

+

+                $createElem.html(backup).css({

+                    position: 'absolute',

+                    zIndex: 20,

+                    left: this.shutterW / 12 * i,

+                    top: 0,

+                    overflow: 'hidden',

+                    width: this.shutterW / 12,

+                    height: this.shutterH

+                });

+

+                $curElem.append($createElem);

+

+                $createElem.find('.animate-img').css({

+                    display: 'block',

+                    width: this.shutterW,

+                    height: this.shutterH,

+                    marginLeft: this.shutterW / -12 * i

+                });

+            }

+

+            if (showNum === 0) {

+                var movingVal = 0;

+

+                $curElem.find('.created').each(function(i) {

+                    if (i % 2 === 0) {

+                        movingVal = self.shutterH;

+                    } else {

+                        movingVal = -self.shutterH;

+                    }

+

+                    $(this).velocity({ top: movingVal }, { duration: 1000 });

+                });

+            } else if (showNum === 1) {

+                $curElem.find('.created').each(function(i) {

+                    speed = 80 * i;

+

+                    $(this).velocity({ top: $(this).height() }, { duration: 120 + speed });

+                });

+            } else if (showNum === 2) {

+                $curElem.find('.created').each(function(i) {

+                    speed = 80 * i;

+

+                    $(this).velocity({ top: -$(this).height() }, { duration: 120 + speed });

+                });

+            }

+

+            this.recovery($targetElem, $curElem, index, backup, 1000);

+        },

+

+        gridLeft: function(index, showNum) {

+            var self = this;

+            var $curElem = this.$shutterItem.eq(this.curDisplay);

+            var $targetElem = this.$shutterItem.eq(index);

+            var backup = $curElem.html();

+            var speed = 0;

+

+            $targetElem.css('zIndex', 19);

+            $curElem.find('.animate-img').fadeOut();

+

+            for (var i = 0; i < 12; i++) {

+                var $createElem = $('<div class="created"></div>');

+

+                $createElem.html(backup).css({

+                    position: 'absolute',

+                    zIndex: 20,

+                    left: 0,

+                    top: this.shutterH / 12 * i,

+                    overflow: 'hidden',

+                    width: this.shutterW,

+                    height: this.shutterH / 12

+                });

+

+                $curElem.append($createElem);

+

+                $createElem.find('.animate-img').css({

+                    display: 'block',

+                    width: this.shutterW,

+                    height: this.shutterH,

+                    marginTop: this.shutterH / -12 * i

+                });

+            }

+

+            if (showNum === 0) {

+                var movingVal = 0;

+

+                $curElem.find('.created').each(function(i) {

+                    if (i % 2 === 0) {

+                        movingVal = self.shutterW;

+                    } else {

+                        movingVal = -self.shutterW;

+                    }

+

+                    $(this).velocity({ left: movingVal }, { duration: 1000 });

+                });

+            } else if (showNum === 1) {

+                $curElem.find('.created').each(function(i) {

+                    speed = 80 * i;

+

+                    $(this).velocity({ left: $(this).width() }, { duration: 120 + speed });

+                });

+            } else if (showNum === 2) {

+                $curElem.find('.created').each(function(i) {

+                    speed = 80 * i;

+

+                    $(this).velocity({ left: -$(this).width() }, { duration: 120 + speed });

+                });

+            }

+

+            this.recovery($targetElem, $curElem, index, backup, 1000);

+        },

+

+        gridOpacity: function(index) {

+            var self = this;

+            var $curElem = this.$shutterItem.eq(this.curDisplay);

+            var $targetElem = this.$shutterItem.eq(index);

+            var backup = $curElem.html();

+            var $createElem = $('<div class="created"></div>');

+

+            $targetElem.css('zIndex', 19);

+            $curElem.find('.animate-img').fadeOut();

+

+            $createElem.html(backup).css({

+                position: 'absolute',

+                zIndex: 20,

+                left: 0,

+                top: 0,

+                overflow: 'hidden',

+                width: this.shutterW,

+                height: this.shutterH,

+                opacity: 1

+            });

+

+            $createElem.find('.animate-img').css({

+                display: 'block',

+                width: this.shutterW,

+                height: this.shutterH

+            });

+

+            $curElem.append($createElem);

+

+            $createElem.velocity({ opacity: 0 }, { duration: 1000 });

+

+            this.recovery($targetElem, $curElem, index, backup, 1000);

+        },

+

+        gridAccordion: function(index) {

+            var self = this;

+            var $curElem = this.$shutterItem.eq(this.curDisplay);

+            var $targetElem = this.$shutterItem.eq(index);

+            var backup = $curElem.html();

+            var iNow = 0;

+            var speed = 0;

+

+            $targetElem.css('zIndex', 19);

+            $curElem.find('.animate-img').fadeOut();

+

+            for (var i = 0; i < 12; i++) {

+                var $createElem = $('<div class="created"></div>');

+

+                $createElem.html(backup).css({

+                    position: 'absolute',

+                    zIndex: 20,

+                    left: this.shutterW / 12 * i,

+                    top: 0,

+                    overflow: 'hidden',

+                    width: this.shutterW / 12,

+                    height: this.shutterH,

+                    opacity: 1

+                });

+

+                $curElem.append($createElem);

+

+                $createElem.find('.animate-img').css({

+                    display: 'block',

+                    width: this.shutterW,

+                    height: this.shutterH,

+                    marginLeft: this.shutterW / -12 * i

+                });

+            }

+

+            $curElem.find('.created').each(function(i) {

+                speed = i * 80;

+

+                $(this).velocity({ opacity: 0 }, { duration: 320 + speed });

+            });

+

+            this.recovery($targetElem, $curElem, index, backup, 1200);

+        },

+

+        gridLittle: function(index) {

+            var self = this;

+            var $curElem = this.$shutterItem.eq(this.curDisplay);

+            var $targetElem = this.$shutterItem.eq(index);

+            var backup = $curElem.html();

+            var coordinate = null;

+

+            $targetElem.css('zIndex', 19);

+            $curElem.find('.animate-img').fadeOut();

+

+            for (var i = 0; i < 24; i++) {

+                var $createElem = $('<div class="created"></div>');

+

+                $createElem.html(backup).css({

+                    width: this.shutterW / 6,

+                    height: this.shutterH / 4,

+                    left: (this.shutterW / 6) * (i % 6),

+                    top: (this.shutterH / 4) * Math.floor(i / 6)

+                });

+

+                $curElem.append($createElem);

+

+                $createElem.find('.animate-img').css({

+                    display: 'block',

+                    width: this.shutterW,

+                    height: this.shutterH,

+                    marginLeft: -(this.shutterW / 6) * (i % 6),

+                    marginTop: -(this.shutterH / 4) * Math.floor(i / 6)

+                });

+            }

+

+            coordinate = getXY($curElem.find('.created'), 4, 6);

+

+            tab(coordinate, 0, 0, function() {

+                var left = parseInt(this.style.left);

+                var top = parseInt(this.style.top);

+

+                $(this).velocity({

+                    left: left + 100,

+                    top: top + 100,

+                    opacity: 0

+                });

+            }, 100, +1, +1);

+

+            this.recovery($targetElem, $curElem, index, backup, 1200);

+        },

+

+        gridSwitch: function(index) {

+            var self = this;

+            var $curElem = this.$shutterItem.eq(this.curDisplay);

+            var $targetElem = this.$shutterItem.eq(index);

+            var backup = $curElem.html();

+

+            $targetElem.css('zIndex', 19);

+            $curElem.find('.animate-img').fadeOut();

+

+            for (var i = 0; i < 20; i++) {

+                var $createElem = $('<div class="created"></div>');

+

+                $createElem.html(backup).css({

+                    width: this.shutterW / 5,

+                    height: this.shutterH / 4,

+                    left: (this.shutterW / 5) * (i % 5),

+                    top: (this.shutterH / 4) * Math.floor(i / 5)

+                });

+

+                $curElem.append($createElem);

+

+                $createElem.find('.animate-img').css({

+                    display: 'block',

+                    width: this.shutterW,

+                    height: this.shutterH,

+                    marginLeft: -(this.shutterW / 5) * (i % 5),

+                    marginTop: -(this.shutterH / 4) * Math.floor(i / 5)

+                });

+            }

+

+            $curElem.find('.created').each(function(i) {

+                if (i % 2 === 0) {

+                    $(this).find('.animate-img').velocity({

+                        marginLeft: $(this).width()

+                    }, { duration: 500 });

+                }

+            });

+

+            setTimeout(function() {

+                $curElem.find('.created').each(function(i) {

+                    if (i % 1 === 0) {

+                        $(this).find('.animate-img').velocity({

+                            marginLeft: $(this).width()

+                        }, { duration: 500 });

+                    }

+                });

+            }, 600);

+

+            this.recovery($targetElem, $curElem, index, backup, 1200);

+        },

+

+        constructor: Shutter

+    };

+

+    $.fn.shutter = function(options) {

+        this.each(function() {

+            var shutter = new Shutter($(this), options);

+        });

+    };

+

+})(jQuery, window, document);

+

+function tab(arr, x, y, fn, delay, speedX, speedY) {

+    if (!arr[y] || !arr[y][x]) {

+        return;

+    }

+

+    if (fn) {

+        fn.call(arr[y][x]);

+

+        clearTimeout(arr[y][x].timer);

+        arr[y][x].timer = setTimeout(function() {

+            tab(arr, x, y + speedY, fn, delay, speedX, speedY);

+            tab(arr, x + speedX, y, fn, delay, speedX, speedY);

+        }, delay);

+    }

+};

+

+function getXY(objs, rows, cols) {

+    var arr1 = [];

+

+    for (var i = 0; i < rows; i++) {

+        var arr2 = [];

+

+        for (var j = 0; j < cols; j++) {

+            objs[i * cols + j].xIndex = j;

+            objs[i * cols + j].yIndex = i;

+

+            arr2.push(objs[i * cols + j]);

+        }

+

+        arr1.push(arr2);

+    }

+

+    return arr1;

+};

Файловите разлики са ограничени, защото са твърде много
+ 2 - 0
assets/summernote/plugin/jquery-blinds-player/js/velocity.js


+ 1 - 1
example/index.html
Целия файл 

@@ -58,7 +58,7 @@
 
                                         <li>

                                             <a>城市治理</a>

                                             <ul class="submenu">

-                                                <li><a href="../solution">智能招商</a></li>

+                                                <li><a href="../solution">智慧招商</a></li>

                                                 <li><a href="../solution">智慧安防</a></li>

                                                 <li><a href="../solution">智慧消防</a></li>

                                             </ul>

+ 89 - 34
index.html
Целия файл 

@@ -11,6 +11,7 @@
 
     <link rel="stylesheet" href="assets/css/bootstrap.min.css" />

     <!--====== Owl Carousel css ======-->

     <link rel="stylesheet" href="assets/css/slick.css" />

+    <link rel="stylesheet" href="assets/summernote/plugin/jquery-blinds-player/css/shutter.css">

     <!--====== Mean Menu ======-->

     <link rel="stylesheet" href="assets/css/meanmenu.min.css" />

     <!--====== Default css ======-->

@@ -56,26 +57,50 @@
 
                                 <li>

                                     <a>解决方案</a>

                                     <ul class="submenu">

-                                        <!-- <li><a href="./example">经典案例</a></li> -->

                                         <li>

                                             <a>城市治理</a>

                                             <ul class="submenu">

-                                                <!-- <li><a href="./example">经典案例</a></li> -->

-                                                <li><a href="solution">智能招商</a></li>

-                                                <li><a href="">智慧安防</a></li>

-                                                <li><a href="">智慧消防</a></li>

+                                                <li><a href="solution/index.html?solution_type=1">智慧招商</a></li>

+                                                <li><a>智慧安防</a></li>

+                                                <li><a>智慧消防</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>民生服务</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧停车</a></li>

+                                                <li><a>智慧教育</a></li>

+                                                <li><a>智慧路灯</a></li>

+                                                <li><a>环境监测</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>园区服务</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧社区</a></li>

+                                                <li><a>智慧商圈</a></li>

+                                                <li><a>智慧办公</a></li>

+                                                <li><a>智慧家居</a></li>

+                                                <li><a>通信配套</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>其他拓展</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧国土</a></li>

+                                                <li><a>智慧民防</a></li>

+                                                <li><a>智慧交通</a></li>

+                                                <li><a>智慧用电</a></li>

+                                                <li><a>通信水务</a></li>

                                             </ul>

                                         </li>

-                                        <li><a href="">民生服务</a></li>

-                                        <li><a href="">园区服务</a></li>

-                                        <li><a href="">其他拓展</a></li>

                                     </ul>

                                 </li>

                                 <li>

                                     <a>新闻动态</a>

                                     <ul class="submenu">

                                         <li><a href="./news">公司新闻</a></li>

-                                        <li><a href="./news">行业动态</a></li>

+                                        <li><a href="./news/trade/index.html">行业动态</a></li>

                                     </ul>

                                 </li>

                                 <li>

@@ -97,50 +122,68 @@
 
         </div>

     </header>

 

+

+

+

     <!--====== BANNER SECTION START ======-->

     <section class="banner-section">

-        <div id="bannerSlider" class="slider-active">

+        <div class="shutter">

+            <div class="shutter-img">

+

+                <a href="#" data-shutter-title="Super Man">

+                    <div class="animate-img" style="background-image:url(assets/img/banner/022.png)"></div>

+                </a>

+                <a href="#" data-shutter-title="Super Man">

+                    <div class="animate-img" style="background-image:url(assets/img/banner/0333.png)"></div>

+                </a>

+                <a href="#" data-shutter-title="Super Man">

+                    <div class="animate-img" style="background-image:url(assets/img/banner/044.png)"></div>

+                </a>

+                <a href="#" data-shutter-title="Iron Man">

+                    <div class="animate-img" style="background-image:url(assets/img/banner/0111.png)"></div>

+                </a>

+                <a href="#" data-shutter-title="Super Man">

+                    <div class="animate-img" style="background-image:url(assets/img/banner/0555.png)"></div>

+                </a>

+            </div>

+            <ul class="shutter-btn">

+                <li class="prev"></li>

+                <li class="next"></li>

+            </ul>

+        </div>

+        <!-- <div id="bannerSlider" class="slider-active">

             <div class="bg-img d-flex justify-content-center" style="background-image: url(assets/img/banner/banner1.png);">

                 <div class="bannerContent0">

                     <div class="d-flex flex-column justify-content-center align-items-center">

-                        <!-- <img src="assets/img/banner/a.png" />

-                        <img src="assets/img/banner/b.png" /> -->

                     </div>

                 </div>

             </div>

             <div class="bg-img d-flex justify-content-center" style="background-image: url(assets/img/banner/02.png);">

                 <div class="bannerContent0">

                     <div class="d-flex flex-column justify-content-center align-items-center">

-                        <!-- <img src="assets/img/banner/a.png" />

-                        <img src="assets/img/banner/b.png" /> -->

                     </div>

                 </div>

             </div>

             <div class="bg-img d-flex justify-content-center" style="background-image: url(assets/img/banner/03.png);">

                 <div class="bannerContent0">

                     <div class="d-flex flex-column justify-content-center align-items-center">

-                        <!-- <img src="assets/img/banner/a.png" />

-                        <img src="assets/img/banner/b.png" /> -->

                     </div>

                 </div>

             </div>

             <div class="bg-img d-flex justify-content-center" style="background-image: url(assets/img/banner/04.png);">

                 <div class="bannerContent0">

                     <div class="d-flex flex-column justify-content-center align-items-center">

-                        <!-- <img src="assets/img/banner/a.png" />

-                        <img src="assets/img/banner/b.png" /> -->

                     </div>

                 </div>

             </div>

             <div class="bg-img d-flex justify-content-center" style="background-image: url(assets/img/banner/05.png);">

                 <div class="bannerContent0">

                     <div class="d-flex flex-column justify-content-center align-items-center">

-                        <!-- <img src="assets/img/banner/a.png" />

-                        <img src="assets/img/banner/b.png" /> -->

                     </div>

                 </div>

             </div>

-        </div>

+        </div> -->

+

     </section>

     <!--====== BANNER SECTION END ======-->

 

@@ -151,7 +194,7 @@
 
                 <span class="title-tag">为什么选择永天云</span>

             </div>

             <div class="row align-items-center justify-content-center">

-                <div class="col-lg-7 col-md-10">

+                <div class=" col-md-6 col-sm-12">

                     <div class=" row">

                         <div class="col-md-6">

                             <div class="whyUs-item text-center" @click="msg=0" :class="{'active':msg===0}">

@@ -173,14 +216,10 @@
 
                                 <p>一站式技术服务解决</p>

                             </div>

                         </div>

-

-                        <!-- <img src="assets/img/tile-gallery/01.png " alt="Image " class="image-one ">

-                        <img src="assets/img/tile-gallery/02.png " alt="Image " class="image-two ">

-                        <img src="assets/img/tile-gallery/03.png " alt="Image " class="image-three "> -->

                     </div>

                 </div>

-                <div class="col-lg-5 col-md-10 ">

-                    <div class="whyUs-text pl-25 " v-show="msg==0 ">

+                <div class="col-md-6 col-sm-12">

+                    <div class="whyUs-text " v-show="msg==0 ">

                         <h2 class="mb-40 subtitle ">专业的项目执行团队</h2>

 

                         <p> 通过十多年的系统经验积累和人才培养，公司已拥有多领域、多系统的技术储备，而且多地分公司、办事机构的管理体系也使得永天科技具备各种异地实施、管理能力。

@@ -190,7 +229,7 @@
 
 

                     </div>

 

-                    <div class="whyUs-text pl-25 " v-show="msg===1 ">

+                    <div class="whyUs-text " v-show="msg===1 ">

                         <h2 class="mb-40 subtitle ">成熟的运维服务体系</h2>

                         <p>

                             自2004年起，公司长期从事智能楼宇、通信配套、物联网监测和数字政务等领域的项目建设和信息服务，常年提供全国范围内数千个项目的后期维护服务。多年的服务工作，积累了大量的技术经验和用户资源，并形成了一整套运维管理体系。</p>

@@ -199,7 +238,7 @@
 
 

 

                     </div>

-                    <div class="whyUs-text pl-25 " v-show="msg===2 ">

+                    <div class="whyUs-text " v-show="msg===2 ">

                         <h2 class="mb-40 subtitle ">十六年的服务经验</h2>

                         <p>

                             缺文案缺文案缺文缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案缺文案案缺文案缺文案缺文案缺文案</p>

@@ -210,7 +249,7 @@
 
                     </div>

 

 

-                    <div class="whyUs-text pl-25 " v-show="msg===3 ">

+                    <div class="whyUs-text " v-show="msg===3 ">

                         <h2 class="mb-40 subtitle ">一站式技术服务解决</h2>

 

                         <p> 公司拥有设计、项目、物联网、运维等多个面向业务的职能部门，并在各个相关的支撑部门及总经办的服务协调整合下，公司具备相关项目的“一站式”服务能力，包含：勘察、设计、施工、系统集成、应用平台及软件开发。

@@ -249,7 +288,7 @@
 
                         <p> 公司拥有数十项软著与专利，永天科技总部在上海，经过15年发展，我们在美国加州、香港、深圳、北京、南昌、上饶、宜春、常州、济南、成都、乌鲁木齐等地均设立分公司和办事处。2013年8月，永天科技在新三板上市。

                         </p>

 

-                        <div class="learn-more "><a class="main-btn ">了解更多</a></div>

+                        <div class="learn-more "><a href="about/index.html" class="main-btn ">了解更多</a></div>

                     </div>

                 </div>

                 <div class="col-md-6 ">

@@ -452,11 +491,27 @@
 
     <script src="assets/js/main.js "></script>

 

     <!--====== Setting Info js ======-->

-    <script src="../assets/js/settinginfo.js"></script>

+    <script src="assets/js/settinginfo.js"></script>

 

     <script src="assets/js/vue.min.js "></script>

 

+    <script src="assets/summernote/plugin/jquery-blinds-player/js/velocity.js"></script>

+    <script src="assets/summernote/plugin/jquery-blinds-player/js/shutter.js"></script>

+

     <script>

+        $(function() {

+            $('.shutter').shutter({

+                // shutterW: 1000, // 容器宽度

+                // shutterH: 358, // 容器高度

+                isAutoPlay: true, // 是否自动播放

+                playInterval: 3000, // 自动播放时间

+                curDisplay: 3, // 当前显示页

+                fullPage: false // 是否全屏展示

+

+            });

+        });

+

+

         var app = new Vue({

             el: '#app',

             data: {

@@ -490,8 +545,8 @@
 
                     if (!res.msg) {

                         return;

                     }

-

                     res.data.forEach(function(item) {

+                        console.log(item)

                         news_list.push(item);

                         if (self.news.length < one_page_num) {

                             self.news.push(item);

+ 33 - 7
join/index.html
Целия файл 

@@ -58,14 +58,40 @@
 
                                         <li>

                                             <a>城市治理</a>

                                             <ul class="submenu">

-                                                <li><a href="../solution">智能招商</a></li>

-                                                <li><a href="../solution">智慧安防</a></li>

-                                                <li><a href="../solution">智慧消防</a></li>

+                                                <li><a href="../solution">智慧招商</a></li>

+                                                <li><a>智慧安防</a></li>

+                                                <li><a>智慧消防</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>民生服务</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧停车</a></li>

+                                                <li><a>智慧教育</a></li>

+                                                <li><a>智慧路灯</a></li>

+                                                <li><a>环境监测</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>园区服务</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧社区</a></li>

+                                                <li><a>智慧商圈</a></li>

+                                                <li><a>智慧办公</a></li>

+                                                <li><a>智慧家居</a></li>

+                                                <li><a>通信配套</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>其他拓展</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧国土</a></li>

+                                                <li><a>智慧民防</a></li>

+                                                <li><a>智慧交通</a></li>

+                                                <li><a>智慧用电</a></li>

+                                                <li><a>通信水务</a></li>

                                             </ul>

                                         </li>

-                                        <li><a href="../solution">民生服务</a></li>

-                                        <li><a href="../solution">园区服务</a></li>

-                                        <li><a href="../solution">其他拓展</a></li>

                                     </ul>

                                 </li>

                                 <li>

@@ -96,7 +122,7 @@
 
     <!--====== HEADER END ======-->

 

     <!--====== COMMON BREADCRUMB START ======-->

-    <section class="common-bradcrumb-section inner-banner" style="background-image: url('../assets/img/join/bg.png');">

+    <section class="common-bradcrumb-section inner-banner" style="background-image: url('../assets/img/join-banner.png');">

     </section>

     <!--====== COMMON BREADCRUMB END ======-->

+ 33 - 7
news/index.html
Целия файл 

@@ -58,14 +58,40 @@
 
                                         <li>

                                             <a>城市治理</a>

                                             <ul class="submenu">

-                                                <li><a href="../solution">智能招商</a></li>

-                                                <li><a href="../solution">智慧安防</a></li>

-                                                <li><a href="../solution">智慧消防</a></li>

+                                                <li><a href="../solution">智慧招商</a></li>

+                                                <li><a>智慧安防</a></li>

+                                                <li><a>智慧消防</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>民生服务</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧停车</a></li>

+                                                <li><a>智慧教育</a></li>

+                                                <li><a>智慧路灯</a></li>

+                                                <li><a>环境监测</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>园区服务</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧社区</a></li>

+                                                <li><a>智慧商圈</a></li>

+                                                <li><a>智慧办公</a></li>

+                                                <li><a>智慧家居</a></li>

+                                                <li><a>通信配套</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>其他拓展</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧国土</a></li>

+                                                <li><a>智慧民防</a></li>

+                                                <li><a>智慧交通</a></li>

+                                                <li><a>智慧用电</a></li>

+                                                <li><a>通信水务</a></li>

                                             </ul>

                                         </li>

-                                        <li><a href="../solution">民生服务</a></li>

-                                        <li><a href="../solution">园区服务</a></li>

-                                        <li><a href="../solution">其他拓展</a></li>

                                     </ul>

                                 </li>

                                 <li class="active">

@@ -96,7 +122,7 @@
 
     <!--====== HEADER END ======-->

 

     <!--====== NEWS BREADCRUMB START ======-->

-    <section class="news-breadcrumb-section d-flex justify-content-center inner-banner">

+    <section class="news-breadcrumb-section d-flex justify-content-center inner-banner" style="background-image: url('../assets/img/news-banner.png');">

         <!-- <img src="../assets/img/news/bg_title.png" /> -->

     </section>

     <!--====== NEWS BREADCRUMB END ======-->

+ 33 - 7
news/read.html
Целия файл 

@@ -58,14 +58,40 @@
 
                                         <li>

                                             <a>城市治理</a>

                                             <ul class="submenu">

-                                                <li><a href="../solution">智能招商</a></li>

-                                                <li><a href="../solution">智慧安防</a></li>

-                                                <li><a href="../solution">智慧消防</a></li>

+                                                <li><a href="../solution">智慧招商</a></li>

+                                                <li><a>智慧安防</a></li>

+                                                <li><a>智慧消防</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>民生服务</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧停车</a></li>

+                                                <li><a>智慧教育</a></li>

+                                                <li><a>智慧路灯</a></li>

+                                                <li><a>环境监测</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>园区服务</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧社区</a></li>

+                                                <li><a>智慧商圈</a></li>

+                                                <li><a>智慧办公</a></li>

+                                                <li><a>智慧家居</a></li>

+                                                <li><a>通信配套</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>其他拓展</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧国土</a></li>

+                                                <li><a>智慧民防</a></li>

+                                                <li><a>智慧交通</a></li>

+                                                <li><a>智慧用电</a></li>

+                                                <li><a>通信水务</a></li>

                                             </ul>

                                         </li>

-                                        <li><a href="../solution">民生服务</a></li>

-                                        <li><a href="../solution">园区服务</a></li>

-                                        <li><a href="../solution">其他拓展</a></li>

                                     </ul>

                                 </li>

                                 <li class="active">

@@ -96,7 +122,7 @@
 
     <!--====== HEADER END ======-->

 

     <!--====== NEWS BREADCRUMB START ======-->

-    <section class="news-breadcrumb-section d-flex justify-content-center inner-banner">

+    <section class="news-breadcrumb-section d-flex justify-content-center inner-banner" style="background-image: url('../assets/img/news-banner.png');">

         <!-- <img src="../assets/img/news/bg_title.png"> -->

     </section>

     <!--====== NEWS BREADCRUMB END ======-->

+ 33 - 7
news/trade/index.html
Целия файл 

@@ -58,14 +58,40 @@
 
                                         <li>

                                             <a>城市治理</a>

                                             <ul class="submenu">

-                                                <li><a href="../../solution">智能招商</a></li>

-                                                <li><a href="../../solution">智慧安防</a></li>

-                                                <li><a href="../../solution">智慧消防</a></li>

+                                                <li><a href="../../solution">智慧招商</a></li>

+                                                <li><a>智慧安防</a></li>

+                                                <li><a>智慧消防</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>民生服务</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧停车</a></li>

+                                                <li><a>智慧教育</a></li>

+                                                <li><a>智慧路灯</a></li>

+                                                <li><a>环境监测</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>园区服务</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧社区</a></li>

+                                                <li><a>智慧商圈</a></li>

+                                                <li><a>智慧办公</a></li>

+                                                <li><a>智慧家居</a></li>

+                                                <li><a>通信配套</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>其他拓展</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧国土</a></li>

+                                                <li><a>智慧民防</a></li>

+                                                <li><a>智慧交通</a></li>

+                                                <li><a>智慧用电</a></li>

+                                                <li><a>通信水务</a></li>

                                             </ul>

                                         </li>

-                                        <li><a href="../../solution">民生服务</a></li>

-                                        <li><a href="../../solution">园区服务</a></li>

-                                        <li><a href="../../solution">其他拓展</a></li>

                                     </ul>

                                 </li>

                                 <li class="active">

@@ -95,7 +121,7 @@
 
     </header>

 

     <!--====== NEWS BREADCRUMB START ======-->

-    <section class="news-breadcrumb-section d-flex justify-content-center inner-banner">

+    <section class="news-breadcrumb-section d-flex justify-content-center inner-banner" style="background-image: url('../../assets/img/news-banner.png');">

         <!-- <img src="../assets/img/news/bg_title.png" /> -->

     </section>

     <!--====== NEWS BREADCRUMB END ======-->

+ 678 - 676
product/index.html
Целия файл 

@@ -1,691 +1,693 @@
 
 <!DOCTYPE html>

 <html lang="en">

+

 <head>

-  <meta charset="utf-8" />

-  <meta http-equiv="x-ua-compatible" content="ie=edge" />

-  <meta name="description" content="" />

-  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />

-  <title>永天科技核心产品</title>

-  

-  <link rel="stylesheet" href="../assets/css/bootstrap.min.css" />

-  <!--====== Mean Menu ======-->

-  <link rel="stylesheet" href="../assets/css/meanmenu.min.css" />

-  <!--====== Default css ======-->

-  <link rel="stylesheet" href="../assets/css/default.css" />

-  <!--====== Style css ======-->

-  <link rel="stylesheet" href="../assets/css/style.css" />

-  <!--====== Animation css =======-->

-  <link rel="stylesheet" href="../assets/css/animation.css" />

+    <meta charset="utf-8" />

+    <meta http-equiv="x-ua-compatible" content="ie=edge" />

+    <meta name="description" content="" />

+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />

+    <title>永天科技核心产品</title>

+

+    <link rel="stylesheet" href="../assets/css/bootstrap.min.css" />

+    <!--====== Mean Menu ======-->

+    <link rel="stylesheet" href="../assets/css/meanmenu.min.css" />

+    <!--====== Default css ======-->

+    <link rel="stylesheet" href="../assets/css/default.css" />

+    <!--====== Style css ======-->

+    <link rel="stylesheet" href="../assets/css/style.css" />

+    <!--====== Animation css =======-->

+    <link rel="stylesheet" href="../assets/css/animation.css" />

 </head>

 

 <body>

-  <!--[if lte IE 9]>

+    <!--[if lte IE 9]>

 	  <p class="browserupgrade">请使用chrome，IE11等现代浏览器，浏览本网站.</p>

   <![endif]-->

 

-  <!--====== HEADER START ======-->

-  <header class="header-absolute sticky-header">

-    <div class="container-fluid custom-container-one">

-      <div class="header-top-area">

-        <div class="row align-items-center">

-          <div class="col-md-6 col-sm-7">

-            <ul class="contact-list">

-              <li>

-                <a href="javascipt:void();">www.chinausky.com</a>

-              </li>

-              <li>

-                <a href="javascipt:void();">400 633 8668</a>

-              </li>

-            </ul>

-          </div>

-        </div>

-      </div>      

-      <div class="mainmenu-area">

-        <div class="d-flex align-items-center justify-content-between">

-          <nav class="main-menu">

-            <div class="logo">

-              <a href="../"><img src="../assets/img/logo.png" alt="uskylogo"></a>

-            </div>

-            <div class="menu-items">

-              <ul>

-                <li>

-                  <a href="../">首页</a>

-                </li>

-                <li class="active">

-                  <a href="../product/">核心产品</a>

-                  <ul class="submenu">

-                    <li><a href="../technology/">核心技术</a></li>

-                  </ul>

-                </li>

-                <li>

-									<a href="../service/">企业服务</a>

-                </li>

-                <li>

-                  <a href="../solution/">解决方案</a>

-                  <ul class="submenu">

-                    <li><a href="../example/">经典案例</a></li>

-                  </ul>

-                </li>

-                <li>

-									<a href="../news/">新闻动态</a>

-                </li>

-                <li>

-									<a href="../about/">关于我们</a>

-                </li>

-                <li>

-									<a href="../join/">加盟我们</a>

-                </li>

-              </ul>

-            </div>

-          </nav>

-        </div>

-      </div>

-      <div class="row">

-				<div class="col-12">

-					<div class="mobile-menu"></div>

-				</div>

-			</div>

-    </div>

-  </header>

-  <!--====== HEADER END ======-->

+    <!--====== HEADER START ======-->

+    <header class="header-absolute sticky-header">

+        <div class="container-fluid custom-container-one">

+            <div class="header-top-area">

+                <div class="row align-items-center">

+                    <div class="col-md-6 col-sm-7">

+                        <ul class="contact-list">

+                            <li>

+                                <a href="javascipt:void();">www.chinausky.com</a>

+                            </li>

+                            <li>

+                                <a href="javascipt:void();">400 633 8668</a>

+                            </li>

+                        </ul>

+                    </div>

+                </div>

+            </div>

+            <div class="mainmenu-area">

+                <div class="d-flex align-items-center justify-content-between">

+                    <nav class="main-menu">

+                        <div class="logo">

+                            <a href="../"><img src="../assets/img/logo.png" alt="uskylogo"></a>

+                        </div>

+                        <div class="menu-items">

+                            <ul>

+                                <li>

+                                    <a href="../">首页</a>

+                                </li>

+                                <li class="active">

+                                    <a href="../product/">核心产品</a>

+                                    <ul class="submenu">

+                                        <li><a href="../technology/">核心技术</a></li>

+                                    </ul>

+                                </li>

+                                <li>

+                                    <a href="../service/">企业服务</a>

+                                </li>

+                                <li>

+                                    <a href="../solution/">解决方案</a>

+                                    <ul class="submenu">

+                                        <li><a href="../example/">经典案例</a></li>

+                                    </ul>

+                                </li>

+                                <li>

+                                    <a href="../news/">新闻动态</a>

+                                </li>

+                                <li>

+                                    <a href="../about/">关于我们</a>

+                                </li>

+                                <li>

+                                    <a href="../join/">加盟我们</a>

+                                </li>

+                            </ul>

+                        </div>

+                    </nav>

+                </div>

+            </div>

+            <div class="row">

+                <div class="col-12">

+                    <div class="mobile-menu"></div>

+                </div>

+            </div>

+        </div>

+    </header>

+    <!--====== HEADER END ======-->

 

-  <!--====== COMMON BREADCRUMB START ======-->

-  <section class="common-bradcrumb-section" style="background-image: url('../assets/img/product/bg.png');">

-  </section>

-  <!--====== COMMON BREADCRUMB END ======-->

+    <!--====== COMMON BREADCRUMB START ======-->

+    <section class="common-bradcrumb-section" style="background-image: url('../assets/img/product/bg.png');">

+    </section>

+    <!--====== COMMON BREADCRUMB END ======-->

 

-  <!--====== PRODUCT GRID START======-->

-  <section class="product-grid-section pt-20 pb-60">

-    <div class="container">

-      <div class="row">

-        <div class="col-lg-12">

-          <div class="grid-filter">

-            <ul class="row cannot_selected">

-              <li data-filter="*" class="active">

-                <div ><span>全部</span></div>

-              </li>

-              <li data-filter=".software">

-                <div><span>软件</span></div>

-              </li>

-              <li data-filter=".hardware">

-                <div><span>硬件</span></div>

-              </li>

-              <li data-filter=".water-system">

-                <div><span>消防水监测</span></div>

-              </li>

-              <li data-filter=".securiy-system">

-                <div><span>安防系列</span></div>

-              </li>

-              <li data-filter=".electricity-system">

-                <div><span>智慧用电类</span></div>

-              </li>

-              <li data-filter=".fire-system">

-                <div><span>消防告警类</span></div>

-              </li>

-              <li data-filter=".others-system">

-                <div><span>其它</span></div>

-              </li>

-            </ul>

-          </div>

-        </div>

-      </div>

-      <div class="row grid-isotope pt-20">

-        <!-- 1 -->

-        <div class="col-lg-4 col-sm-6 software">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/QRcode.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>智慧消防综合管理软件</span>

-            </div>

-            <a href="#" class="product-link">

-              <p>智慧消防综合管理软件</p>

-              <p>v 1.0</p>

-            </a>

-          </div>

-        </div>

-        <!-- 2 -->

-        <div class="col-lg-4 col-sm-6 software">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/QRcode.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>智慧安防综合管理系统软件</span>

-            </div>

-            <a href="#" class="product-link">

-              <p>智慧安防综合管理系统软件</p>

-              <p>v 1.0</p>

-            </a>

-          </div>

-        </div>

-        <!-- 3 -->

-        <div class="col-lg-4 col-sm-6 software">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/QRcode.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>智慧园区综合管理系统软件</span>

-            </div>

-            <a href="#" class="product-link">

-              <p>智慧园区综合管理系统软件</p>

-              <p>v 1.0</p>

-            </a>

-          </div>

-        </div>

-        <!-- 4 -->

-        <div class="col-lg-4 col-sm-6 software">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/QRcode.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>永天智慧宝APP</span>

-            </div>

-            <a href="#" class="product-link">

-              <p>永天智慧宝APP</p>

-              <p>v 1.0</p>

-            </a>

-          </div>

-        </div>

-        <!-- 5 -->

-        <div class="col-lg-4 col-sm-6 software">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/QRcode.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>智慧用电综合处理单元</span>

-            </div>

-            <a href="#" class="product-link">

-              <p>智慧用电综合处理单元</p>

-              <p>v 1.0</p>

-            </a>

-          </div>

-        </div>

-        <!-- 6 -->

-        <div class="col-lg-4 col-sm-6 software">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/QRcode.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>用水数据采集单元</span>

-            </div>

-            <a href="#" class="product-link">

-              <p>用水数据采集单元</p>

-            </a>

-          </div>

-        </div>

-        <!-- 7 -->

-        <div class="col-lg-4 col-sm-6 hardware water-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p01.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>用水数据采集装置</span>

-            </div>

-            <a href="./detail/1.html" class="product-link">

-              <p>用水数据采集装置</p>

-              <p>UUWC07-0800</p>

-            </a>

-          </div>

-        </div>

-        <!-- 8 -->

-        <div class="col-lg-4 col-sm-6 hardware securiy-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p02.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>紧急（求助）按钮</span>

-            </div>

-            <a href="./detail/2.html" class="product-link">

-              <p>紧急（求助）按钮</p>

-              <p>UUEH07-0800</p>

-            </a>

-          </div>

-        </div>

-        <!-- 9 -->

-        <div class="col-lg-4 col-sm-6 hardware electricity-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p03.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>电气火灾探测器</span>

-            </div>

-            <a href="./detail/3.html" class="product-link">

-              <p>电气火灾探测器</p>

-              <p>UUEF08-0500</p>

-            </a>

-          </div>

-        </div>

-        <!-- 10 -->

-        <div class="col-lg-4 col-sm-6 hardware electricity-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p04.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>智慧用电探测器</span>

-            </div>

-            <a href="./detail/4.html" class="product-link">

-              <p>智慧用电探测器</p>

-              <p>UUiE08-0500</p>

-            </a>

-          </div>

-        </div>

-        <!-- 11 -->

-        <div class="col-lg-4 col-sm-6 hardware fire-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p05.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>可燃气体探测器</span>

-            </div>

-            <a href="./detail/5.html" class="product-link">

-              <p>可燃气体探测器</p>

-              <p>UUGD07-0800</p>

-            </a>

-          </div>

-        </div>

-        <!-- 12 -->

-        <div class="col-lg-4 col-sm-6 hardware fire-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p06.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>火灾探测器</span>

-            </div>

-            <a href="./detail/6.html" class="product-link">

-              <p>火灾探测器</p>

-              <p>UUFD07-0800</p>

-            </a>

-          </div>

-        </div>

-        <!-- 13 -->

-        <div class="col-lg-4 col-sm-6 hardware securiy-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p07.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>门体开启状态探测装置</span>

-            </div>

-            <a href="./detail/7.html" class="product-link">

-              <p>门体开启状态探测装置</p>

-              <p>UUGS07-0800</p>

-            </a>

-          </div>

-        </div>

-        <!-- 14 -->

-        <div class="col-lg-4 col-sm-6 hardware water-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p08.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>二次供水探测装置</span>

-            </div>

-            <a href="./detail/8.html" class="product-link">

-              <p>二次供水探测装置</p>

-              <p>UUWT07-0800</p>

-            </a>

-          </div>

-        </div>

-        <!-- 15 -->

-        <div class="col-lg-4 col-sm-6 hardware water-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p09.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>二次供水探测装置（含水位告警）</span>

-            </div>

-            <a href="./detail/9.html" class="product-link">

-              <p>二次供水探测装置（含水位告警）</p>

-              <p>UUWTL07-0800</p>

-            </a>

-          </div>

-        </div>

-        <!-- 16 -->

-        <div class="col-lg-4 col-sm-6 hardware water-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p10.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>窨井盖探测装置</span>

-            </div>

-            <a href="./detail/10.html" class="product-link">

-              <p>窨井盖探测装置</p>

-              <p>UUIW07-0800</p>

-            </a>

-          </div>

-        </div>

-        <!-- 17 -->

-        <div class="col-lg-4 col-sm-6 hardware water-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p11.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>窨井盖探测装置（含溢水告警）</span>

-            </div>

-            <a href="./detail/11.html" class="product-link">

-              <p>窨井盖探测装置（含溢水告警）</p>

-              <p>UUIWL07-0800</p>

-            </a>

-          </div>

-        </div>

-        <!-- 18 -->

-        <div class="col-lg-4 col-sm-6 hardware others-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p12.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>消防占道探测装置</span>

-            </div>

-            <a href="./detail/12.html" class="product-link">

-              <p>消防占道探测装置</p>

-              <p>UUFP07-0800</p>

-            </a>

-          </div>

-        </div>

-        <!-- 19 -->

-        <div class="col-lg-4 col-sm-6 hardware securiy-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p13.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>电梯运行采集探测装置</span>

-            </div>

-            <a href="./detail/13.html" class="product-link">

-              <p>电梯运行采集探测装置</p>

-              <p>UULC08-0400</p>

-            </a>

-          </div>

-        </div>

-        <!-- 20 -->

-        <div class="col-lg-4 col-sm-6 hardware water-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p14.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>水质监测采集探测装置</span>

-            </div>

-            <a href="./detail/14.html" class="product-link">

-              <p>水质监测采集探测装置</p>

-              <p>UULW07-0800</p>

-            </a>

-          </div>

-        </div>

-        <!-- 21 -->

-        <div class="col-lg-4 col-sm-6 hardware water-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p15.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>消防给水系统采集探测装置（室内消火栓）</span>

-            </div>

-            <a href="./detail/15.html" class="product-link">

-              <p>消防给水系统采集探测装置（室内消火栓）</p>

-              <p>UUIH07-0800</p>

-            </a>

-          </div>

-        </div>

-        <!-- 22 -->

-        <div class="col-lg-4 col-sm-6 hardware water-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p16.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>消防给水系统采集探测装置（室外消火栓）</span>

-            </div>

-            <a href="./detail/16.html"class="product-link">

-              <p>消防给水系统采集探测装置（室外消火栓）</p>

-              <p>UUOH07-0800</p>

-            </a>

-          </div>

-        </div>

-        <!-- 23 -->

-        <div class="col-lg-4 col-sm-6 hardware water-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p17.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>消防给水系统采集探测装置（喷淋水压探测器）</span>

-            </div>

-            <a href="./detail/17.html" class="product-link">

-              <p>消防给水系统采集探测装置（喷淋水压探测器）</p>

-              <p>UUPH07-0800</p>

-            </a>

-          </div>

-        </div>

-        <!-- 24 -->

-        <div class="col-lg-4 col-sm-6 hardware water-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p18.jpg"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>消防给水系统采集探测装置（水泵探测装置）</span>

-            </div>

-            <a href="./detail/18.html" class="product-link">

-              <p>消防给水系统采集探测装置（水泵探测装置）</p>

-              <p>UUFW07-0500</p>

-            </a>

-          </div>

-        </div>

-        <!-- 25 -->

-        <div class="col-lg-4 col-sm-6 hardware water-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p19.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>水质监测采集探测装置</span>

-            </div>

-            <a href="./detail/19.html" class="product-link">

-              <p>水质监测采集探测装置</p>

-              <p>UULW07-0800</p>

-            </a>

-          </div>

-        </div>

-        <!-- 26 -->

-        <div class="col-lg-4 col-sm-6 hardware water-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p20.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>水质监测采集探测装置</span>

-            </div>

-            <a href="./detail/20.html" class="product-link">

-              <p>水质监测采集探测装置</p>

-              <p>UULW07-0800</p>

-            </a>

-          </div>

-        </div>

-        <!-- 27 -->

-        <div class="col-lg-4 col-sm-6 hardware water-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p21.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>水质浊度传感器</span>

-            </div>

-            <a href="./detail/21.html" class="product-link">

-              <p>水质监测采集探测装置 UULW07-0800</p>

-              <p>水质浊度传感器</p>

-            </a>

-          </div>

-        </div>

-        <!-- 28 -->

-        <div class="col-lg-4 col-sm-6 hardware water-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p22.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>水质电导率测量</span>

-            </div>

-            <a href="./detail/22.html" class="product-link">

-              <p>水质监测采集探测装置 UULW07-0800</p>

-              <p>水质电导率测量</p>

-            </a>

-          </div>

-        </div>

-        <!-- 29 -->

-        <div class="col-lg-4 col-sm-6 hardware water-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p23.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>水质PH传感器</span>

-            </div>

-            <a href="./detail/23.html" class="product-link">

-              <p>水质监测采集探测装置 UULW07-0800</p>

-              <p>水质PH传感器</p>

-            </a>

-          </div>

-        </div>

-        <!-- 30 -->

-        <div class="col-lg-4 col-sm-6 hardware water-system">

-          <div class="product-grid-box">

-            <div class="product-img">

-              <img src="../assets/img/product/p24.png"/>

-            </div>

-            <div class="title d-flex justify-content-center align-items-center">

-              <span>水质余氯传感器</span>

-            </div>

-            <a href="./detail/24.html" class="product-link">

-              <p>水质监测采集探测装置 UULW07-0800</p>

-              <p>水质余氯传感器</p>

-            </a>

-          </div>

-        </div>

-      </div>

-    </div>

-  </section>

-  <!--====== PRODUCT GRID START======-->

+    <!--====== PRODUCT GRID START======-->

+    <section class="product-grid-section pt-20 pb-60">

+        <div class="container">

+            <div class="row">

+                <div class="col-lg-12">

+                    <div class="grid-filter">

+                        <ul class="row cannot_selected">

+                            <li data-filter="*" class="active">

+                                <div><span>全部</span></div>

+                            </li>

+                            <li data-filter=".software">

+                                <div><span>软件</span></div>

+                            </li>

+                            <li data-filter=".hardware">

+                                <div><span>硬件</span></div>

+                            </li>

+                            <li data-filter=".water-system">

+                                <div><span>消防水监测</span></div>

+                            </li>

+                            <li data-filter=".securiy-system">

+                                <div><span>安防系列</span></div>

+                            </li>

+                            <li data-filter=".electricity-system">

+                                <div><span>智慧用电类</span></div>

+                            </li>

+                            <li data-filter=".fire-system">

+                                <div><span>消防告警类</span></div>

+                            </li>

+                            <li data-filter=".others-system">

+                                <div><span>其它</span></div>

+                            </li>

+                        </ul>

+                    </div>

+                </div>

+            </div>

+            <div class="row grid-isotope pt-20">

+                <!-- 1 -->

+                <div class="col-lg-4 col-sm-6 software">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/QRcode.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>智慧消防综合管理软件</span>

+                        </div>

+                        <a href="#" class="product-link">

+                            <p>智慧消防综合管理软件</p>

+                            <p>v 1.0</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 2 -->

+                <div class="col-lg-4 col-sm-6 software">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/QRcode.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>智慧安防综合管理系统软件</span>

+                        </div>

+                        <a href="#" class="product-link">

+                            <p>智慧安防综合管理系统软件</p>

+                            <p>v 1.0</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 3 -->

+                <div class="col-lg-4 col-sm-6 software">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/QRcode.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>智慧园区综合管理系统软件</span>

+                        </div>

+                        <a href="#" class="product-link">

+                            <p>智慧园区综合管理系统软件</p>

+                            <p>v 1.0</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 4 -->

+                <div class="col-lg-4 col-sm-6 software">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/QRcode.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>永天智慧宝APP</span>

+                        </div>

+                        <a href="#" class="product-link">

+                            <p>永天智慧宝APP</p>

+                            <p>v 1.0</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 5 -->

+                <div class="col-lg-4 col-sm-6 software">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/QRcode.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>智慧用电综合处理单元</span>

+                        </div>

+                        <a href="#" class="product-link">

+                            <p>智慧用电综合处理单元</p>

+                            <p>v 1.0</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 6 -->

+                <div class="col-lg-4 col-sm-6 software">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/QRcode.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>用水数据采集单元</span>

+                        </div>

+                        <a href="#" class="product-link">

+                            <p>用水数据采集单元</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 7 -->

+                <div class="col-lg-4 col-sm-6 hardware water-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p01.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>用水数据采集装置</span>

+                        </div>

+                        <a href="./detail/1.html" class="product-link">

+                            <p>用水数据采集装置</p>

+                            <p>UUWC07-0800</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 8 -->

+                <div class="col-lg-4 col-sm-6 hardware securiy-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p02.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>紧急（求助）按钮</span>

+                        </div>

+                        <a href="./detail/2.html" class="product-link">

+                            <p>紧急（求助）按钮</p>

+                            <p>UUEH07-0800</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 9 -->

+                <div class="col-lg-4 col-sm-6 hardware electricity-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p03.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>电气火灾探测器</span>

+                        </div>

+                        <a href="./detail/3.html" class="product-link">

+                            <p>电气火灾探测器</p>

+                            <p>UUEF08-0500</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 10 -->

+                <div class="col-lg-4 col-sm-6 hardware electricity-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p04.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>智慧用电探测器</span>

+                        </div>

+                        <a href="./detail/4.html" class="product-link">

+                            <p>智慧用电探测器</p>

+                            <p>UUiE08-0500</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 11 -->

+                <div class="col-lg-4 col-sm-6 hardware fire-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p05.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>可燃气体探测器</span>

+                        </div>

+                        <a href="./detail/5.html" class="product-link">

+                            <p>可燃气体探测器</p>

+                            <p>UUGD07-0800</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 12 -->

+                <div class="col-lg-4 col-sm-6 hardware fire-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p06.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>火灾探测器</span>

+                        </div>

+                        <a href="./detail/6.html" class="product-link">

+                            <p>火灾探测器</p>

+                            <p>UUFD07-0800</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 13 -->

+                <div class="col-lg-4 col-sm-6 hardware securiy-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p07.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>门体开启状态探测装置</span>

+                        </div>

+                        <a href="./detail/7.html" class="product-link">

+                            <p>门体开启状态探测装置</p>

+                            <p>UUGS07-0800</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 14 -->

+                <div class="col-lg-4 col-sm-6 hardware water-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p08.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>二次供水探测装置</span>

+                        </div>

+                        <a href="./detail/8.html" class="product-link">

+                            <p>二次供水探测装置</p>

+                            <p>UUWT07-0800</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 15 -->

+                <div class="col-lg-4 col-sm-6 hardware water-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p09.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>二次供水探测装置（含水位告警）</span>

+                        </div>

+                        <a href="./detail/9.html" class="product-link">

+                            <p>二次供水探测装置（含水位告警）</p>

+                            <p>UUWTL07-0800</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 16 -->

+                <div class="col-lg-4 col-sm-6 hardware water-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p10.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>窨井盖探测装置</span>

+                        </div>

+                        <a href="./detail/10.html" class="product-link">

+                            <p>窨井盖探测装置</p>

+                            <p>UUIW07-0800</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 17 -->

+                <div class="col-lg-4 col-sm-6 hardware water-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p11.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>窨井盖探测装置（含溢水告警）</span>

+                        </div>

+                        <a href="./detail/11.html" class="product-link">

+                            <p>窨井盖探测装置（含溢水告警）</p>

+                            <p>UUIWL07-0800</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 18 -->

+                <div class="col-lg-4 col-sm-6 hardware others-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p12.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>消防占道探测装置</span>

+                        </div>

+                        <a href="./detail/12.html" class="product-link">

+                            <p>消防占道探测装置</p>

+                            <p>UUFP07-0800</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 19 -->

+                <div class="col-lg-4 col-sm-6 hardware securiy-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p13.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>电梯运行采集探测装置</span>

+                        </div>

+                        <a href="./detail/13.html" class="product-link">

+                            <p>电梯运行采集探测装置</p>

+                            <p>UULC08-0400</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 20 -->

+                <div class="col-lg-4 col-sm-6 hardware water-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p14.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>水质监测采集探测装置</span>

+                        </div>

+                        <a href="./detail/14.html" class="product-link">

+                            <p>水质监测采集探测装置</p>

+                            <p>UULW07-0800</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 21 -->

+                <div class="col-lg-4 col-sm-6 hardware water-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p15.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>消防给水系统采集探测装置（室内消火栓）</span>

+                        </div>

+                        <a href="./detail/15.html" class="product-link">

+                            <p>消防给水系统采集探测装置（室内消火栓）</p>

+                            <p>UUIH07-0800</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 22 -->

+                <div class="col-lg-4 col-sm-6 hardware water-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p16.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>消防给水系统采集探测装置（室外消火栓）</span>

+                        </div>

+                        <a href="./detail/16.html" class="product-link">

+                            <p>消防给水系统采集探测装置（室外消火栓）</p>

+                            <p>UUOH07-0800</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 23 -->

+                <div class="col-lg-4 col-sm-6 hardware water-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p17.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>消防给水系统采集探测装置（喷淋水压探测器）</span>

+                        </div>

+                        <a href="./detail/17.html" class="product-link">

+                            <p>消防给水系统采集探测装置（喷淋水压探测器）</p>

+                            <p>UUPH07-0800</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 24 -->

+                <div class="col-lg-4 col-sm-6 hardware water-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p18.jpg" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>消防给水系统采集探测装置（水泵探测装置）</span>

+                        </div>

+                        <a href="./detail/18.html" class="product-link">

+                            <p>消防给水系统采集探测装置（水泵探测装置）</p>

+                            <p>UUFW07-0500</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 25 -->

+                <div class="col-lg-4 col-sm-6 hardware water-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p19.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>水质监测采集探测装置</span>

+                        </div>

+                        <a href="./detail/19.html" class="product-link">

+                            <p>水质监测采集探测装置</p>

+                            <p>UULW07-0800</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 26 -->

+                <div class="col-lg-4 col-sm-6 hardware water-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p20.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>水质监测采集探测装置</span>

+                        </div>

+                        <a href="./detail/20.html" class="product-link">

+                            <p>水质监测采集探测装置</p>

+                            <p>UULW07-0800</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 27 -->

+                <div class="col-lg-4 col-sm-6 hardware water-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p21.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>水质浊度传感器</span>

+                        </div>

+                        <a href="./detail/21.html" class="product-link">

+                            <p>水质监测采集探测装置 UULW07-0800</p>

+                            <p>水质浊度传感器</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 28 -->

+                <div class="col-lg-4 col-sm-6 hardware water-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p22.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>水质电导率测量</span>

+                        </div>

+                        <a href="./detail/22.html" class="product-link">

+                            <p>水质监测采集探测装置 UULW07-0800</p>

+                            <p>水质电导率测量</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 29 -->

+                <div class="col-lg-4 col-sm-6 hardware water-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p23.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>水质PH传感器</span>

+                        </div>

+                        <a href="./detail/23.html" class="product-link">

+                            <p>水质监测采集探测装置 UULW07-0800</p>

+                            <p>水质PH传感器</p>

+                        </a>

+                    </div>

+                </div>

+                <!-- 30 -->

+                <div class="col-lg-4 col-sm-6 hardware water-system">

+                    <div class="product-grid-box">

+                        <div class="product-img">

+                            <img src="../assets/img/product/p24.png" />

+                        </div>

+                        <div class="title d-flex justify-content-center align-items-center">

+                            <span>水质余氯传感器</span>

+                        </div>

+                        <a href="./detail/24.html" class="product-link">

+                            <p>水质监测采集探测装置 UULW07-0800</p>

+                            <p>水质余氯传感器</p>

+                        </a>

+                    </div>

+                </div>

+            </div>

+        </div>

+    </section>

+    <!--====== PRODUCT GRID START======-->

 

-  <!--====== FOOTER PART START ======-->

-  <footer>

-    <!-- widgets -->

-    <div class="footer-widget-area">

-      <div class="container">

-        <div class="row">

-          <div class="col-lg-1 col-md-0 col-sm-0 col-0"></div>

-          <div class="col-lg-2 col-md-6 col-sm-6 col-6">

-            <div class="widget nav-widget d-flex justify-content-start">

-							<div>

-								<h5 class="widget-title">核心业务</h5>

-								<ul>

-									<li><a href="#">智慧城市</a></li>

-									<li><a href="#">智慧消防</a></li>

-									<li><a href="#">永天云</a></li>

-								</ul>

-							</div>

-						</div>

-          </div>

-          <div class="col-lg-2 col-md-6 col-sm-6 col-6">

-            <div class="widget nav-widget d-flex justify-content-start">

-							<div>

-								<h5 class="widget-title">企业服务</h5>

-								<ul>

-									<li><a href="#">运维服务</a></li>

-									<li><a href="#">设计管理</a></li>

-									<li><a href="#">项目实施</a></li>

-								</ul>

-							</div>

-						</div>

-          </div>

-          <div class="col-lg-2 col-md-6 col-sm-6 col-6">

-            <div class="widget nav-widget d-flex justify-content-start">

-							<div>

-								<h5 class="widget-title">永天客户</h5>

-								<ul>

-									<li><a href="#">海康威视</a></li>

-									<li><a href="#">普天集团</a></li>

-                  <li><a href="#">大华集团</a></li>

-                  <li><a href="#">派米雷集团</a></li>

-									<li><a href="#">上海机场集团</a></li>

-									<li><a href="#">佳理监事</a></li>

-								</ul>

-							</div>

-						</div>

-          </div>

-          <div class="col-lg-2 col-md-6 col-sm-6 col-6">

-            <div class="widget nav-widget d-flex justify-content-start">

-							<div>

-								<h5 class="widget-title">新闻动态</h5>

-								<ul>

-									<li><a href="#">公司新闻</a></li>

-									<li><a href="#">行业动态</a></li>

-								</ul>

-							</div>

-						</div>

-          </div>

-          <div class="col-lg-2 col-md-6 col-sm-6 col-6">

-            <div class="widget nav-widget d-flex justify-content-start">

-							<div>

-								<h5 class="widget-title">关于永天</h5>

-								<ul>

-									<li><a href="#">永天介绍</a></li>

-                  <li><a href="#">专家团队</a></li>

-                  <li><a href="#">联系我们</a></li>

-                  <li><a href="#">加入我们</a></li>

-								</ul>

-							</div>

-						</div>

-          </div>

-          <div class="col-lg-1 col-md-0 col-sm-0 col-0"></div>

-        </div>

-      </div>

-    </div>

-    <!-- copyright -->

-		<div class="copy-right-area">

-			<div class="container">

-        <div class="row copyrigt-text">

-          <div class="col-lg-9">

-            <p>Copyright © 2001- 2014 Usky. All Rights Reserved. 永天股份 版权所有</p>

-            <p>增值电信业务经营许可证（IDC、ISP）编号B2-20080010</p>

-          </div>

-          <div class="copyrigt-or-code col-lg-3 d-flex flex-column align-items-center">

-            <img width="167" height="167" src="../assets/img/qr_code.png">

-            <span style="text-align: left;">扫一扫，关注我们吧</span>

-          </div>

-        </div>

-			</div>

-    </div>

-  </footer>

-  <!--====== FOOTER PART END ======-->

+    <!--====== FOOTER PART START ======-->

+    <footer>

+        <!-- widgets -->

+        <div class="footer-widget-area">

+            <div class="container">

+                <div class="row">

+                    <div class="col-lg-1 col-md-0 col-sm-0 col-0"></div>

+                    <div class="col-lg-2 col-md-6 col-sm-6 col-6">

+                        <div class="widget nav-widget d-flex justify-content-start">

+                            <div>

+                                <h5 class="widget-title">核心业务</h5>

+                                <ul>

+                                    <li><a href="#">智慧城市</a></li>

+                                    <li><a href="#">智慧消防</a></li>

+                                    <li><a href="#">永天云</a></li>

+                                </ul>

+                            </div>

+                        </div>

+                    </div>

+                    <div class="col-lg-2 col-md-6 col-sm-6 col-6">

+                        <div class="widget nav-widget d-flex justify-content-start">

+                            <div>

+                                <h5 class="widget-title">企业服务</h5>

+                                <ul>

+                                    <li><a href="#">运维服务</a></li>

+                                    <li><a href="#">设计管理</a></li>

+                                    <li><a href="#">项目实施</a></li>

+                                </ul>

+                            </div>

+                        </div>

+                    </div>

+                    <div class="col-lg-2 col-md-6 col-sm-6 col-6">

+                        <div class="widget nav-widget d-flex justify-content-start">

+                            <div>

+                                <h5 class="widget-title">永天客户</h5>

+                                <ul>

+                                    <li><a href="#">海康威视</a></li>

+                                    <li><a href="#">普天集团</a></li>

+                                    <li><a href="#">大华集团</a></li>

+                                    <li><a href="#">派米雷集团</a></li>

+                                    <li><a href="#">上海机场集团</a></li>

+                                    <li><a href="#">佳理监事</a></li>

+                                </ul>

+                            </div>

+                        </div>

+                    </div>

+                    <div class="col-lg-2 col-md-6 col-sm-6 col-6">

+                        <div class="widget nav-widget d-flex justify-content-start">

+                            <div>

+                                <h5 class="widget-title">新闻动态</h5>

+                                <ul>

+                                    <li><a href="#">公司新闻</a></li>

+                                    <li><a href="#">行业动态</a></li>

+                                </ul>

+                            </div>

+                        </div>

+                    </div>

+                    <div class="col-lg-2 col-md-6 col-sm-6 col-6">

+                        <div class="widget nav-widget d-flex justify-content-start">

+                            <div>

+                                <h5 class="widget-title">关于永天</h5>

+                                <ul>

+                                    <li><a href="#">永天介绍</a></li>

+                                    <li><a href="#">专家团队</a></li>

+                                    <li><a href="#">联系我们</a></li>

+                                    <li><a href="#">加入我们</a></li>

+                                </ul>

+                            </div>

+                        </div>

+                    </div>

+                    <div class="col-lg-1 col-md-0 col-sm-0 col-0"></div>

+                </div>

+            </div>

+        </div>

+        <!-- copyright -->

+        <div class="copy-right-area">

+            <div class="container">

+                <div class="row copyrigt-text">

+                    <div class="col-lg-9">

+                        <p>Copyright © 2001- 2014 Usky. All Rights Reserved. 永天股份 版权所有</p>

+                        <p>增值电信业务经营许可证（IDC、ISP）编号B2-20080010</p>

+                    </div>

+                    <div class="copyrigt-or-code col-lg-3 d-flex flex-column align-items-center">

+                        <img width="167" height="167" src="../assets/img/qr_code.png">

+                        <span style="text-align: left;">扫一扫，关注我们吧</span>

+                    </div>

+                </div>

+            </div>

+        </div>

+    </footer>

+    <!--====== FOOTER PART END ======-->

 

-  <script src="../assets/js/vendor/modernizr-3.6.0.min.js"></script>

-  <script src="../assets/js/vendor/jquery-1.12.4.min.js"></script>

-  <!--====== Bootstrap js ======-->

-  <script src="../assets/js/bootstrap.min.js"></script>

-  <script src="../assets/js/popper.min.js"></script>

-  <!--====== Isotope js ======-->

-  <script src="../assets/js/isotope.pkgd.min.js"></script>

-  <!--====== Mean Menu ======-->

-  <script src="../assets/js/jquery.meanmenu.min.js"></script>

-  <!--====== Main js ======-->

-  <script src="../assets/js/main.js"></script>

+    <script src="../assets/js/vendor/modernizr-3.6.0.min.js"></script>

+    <script src="../assets/js/vendor/jquery-1.12.4.min.js"></script>

+    <!--====== Bootstrap js ======-->

+    <script src="../assets/js/bootstrap.min.js"></script>

+    <script src="../assets/js/popper.min.js"></script>

+    <!--====== Isotope js ======-->

+    <script src="../assets/js/isotope.pkgd.min.js"></script>

+    <!--====== Mean Menu ======-->

+    <script src="../assets/js/jquery.meanmenu.min.js"></script>

+    <!--====== Main js ======-->

+    <script src="../assets/js/main.js"></script>

 </body>

+

 </html>

+ 144 - 23
solution/detail.html
Целия файл 

@@ -58,14 +58,40 @@
 
                                         <li>
 
                                             <a>城市治理</a>
 
                                             <ul class="submenu">
 
-                                                <li><a href="../solution">智能招商</a></li>
 
-                                                <li><a href="../solution">智慧安防</a></li>
 
-                                                <li><a href="../solution">智慧消防</a></li>
 
+                                                <li><a href="../solution">智慧招商</a></li>
 
+                                                <li><a>智慧安防</a></li>
 
+                                                <li><a>智慧消防</a></li>
 
+                                            </ul>
 
+                                        </li>
 
+                                        <li>
 
+                                            <a>民生服务</a>
 
+                                            <ul class="submenu">
 
+                                                <li><a>智慧停车</a></li>
 
+                                                <li><a>智慧教育</a></li>
 
+                                                <li><a>智慧路灯</a></li>
 
+                                                <li><a>环境监测</a></li>
 
+                                            </ul>
 
+                                        </li>
 
+                                        <li>
 
+                                            <a>园区服务</a>
 
+                                            <ul class="submenu">
 
+                                                <li><a>智慧社区</a></li>
 
+                                                <li><a>智慧商圈</a></li>
 
+                                                <li><a>智慧办公</a></li>
 
+                                                <li><a>智慧家居</a></li>
 
+                                                <li><a>通信配套</a></li>
 
+                                            </ul>
 
+                                        </li>
 
+                                        <li>
 
+                                            <a>其他拓展</a>
 
+                                            <ul class="submenu">
 
+                                                <li><a>智慧国土</a></li>
 
+                                                <li><a>智慧民防</a></li>
 
+                                                <li><a>智慧交通</a></li>
 
+                                                <li><a>智慧用电</a></li>
 
+                                                <li><a>通信水务</a></li>
 
                                             </ul>
 
                                         </li>
 
-                                        <li><a href="../solution">民生服务</a></li>
 
-                                        <li><a href="../solution">园区服务</a></li>
 
-                                        <li><a href="../solution">其他拓展</a></li>
 
                                     </ul>
 
                                 </li>
 
                                 <li>
 
@@ -114,11 +140,26 @@
 
     </section>
 
 
     <!--====== SOLUTION DETAIL START ======-->
 
+    <!-- <div id="app">
 
+        <section class="solution-detail pt-40 pb-50">
 
+            <div class="container">
 
+                <div class="  section-title text-center both-border mb-40">
 
+                    <span class="title-tag2">{{articleInfo.title}}</span>
 
+                    <p class="subtit mt-40">区域：{{articleInfo.region}} 规模：{{articleInfo.scale}}</p>
 
+                </div>
 
+                <div class="section-content" v-html="articleInfo.details">
 
+
 
+                </div>
 
+            </div>
 
+        </section>
 
+    </div> -->
 
+
 
+
 
+
 
     <section class="solution-detail pt-40 pb-50">
 
         <div class="container">
 
-            <div class="  section-title text-center both-border mb-40">
 
-                <span class="title-tag2">宜春招商平台系统软件功能介绍</span>
 
-                <p class="subtit mt-40">区域：江西省，宜春市 规模：永丰街道，7.4万人</p>
 
+            <div class="section-title text-center both-border mb-40 ">
 
+                <span class="title-tag2">智慧招商综合管理平台软件</span>
 
             </div>
 
             <div class="section-content">
 
                 <p>永丰街道位于上饶市广丰区，现为广丰区人民政府驻地，是全区政治、经济、文化中心。面积为25平方公里，人口7.4万，其中非农人口6.6万，辖：东街、麦园、湖沿、鸟林街、横路、东关、裕丰、北门、南山、大塘、西门、商城、西山、白鹤、平安十五个社区居委会。</p>
 
@@ -144,6 +185,7 @@
 
 
     </section>
 
 
+
 
     <section class="solution-detail pt-40 pb-50  bg-gray">
 
         <div class="container">
 
             <div class="section-title text-center both-border mb-40 ">
 
@@ -172,6 +214,8 @@
 
         </div>
 
 
     </section>
 
+    </div>
 
+
 
     <!--====== SOLUTION DETAIL END ======-->
 
 
 
@@ -282,30 +326,107 @@
 
     <script src="../assets/js/exampleinfo.js"></script>
 
     <!--====== Vue Developer js ======-->
 
     <!-- <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> -->
 
+
 
+    <script src="../assets/js/settinginfo.js"></script>
 
+
 
     <!--====== Vue js======-->
 
     <script src="../assets/js/vue.min.js"></script>
 
     <script>
 
+        function getQueryVariable(variable) {
 
+            var query = window.location.search.substring(1);
 
+            var vars = query.split("&");
 
+            for (var i = 0; i < vars.length; i++) {
 
+                var pair = vars[i].split("=");
 
+                if (pair[0] == variable) {
 
+                    return pair[1];
 
+                }
 
+            }
 
+            return (false);
 
+        }
 
+        var solutionDetail_id = getQueryVariable('id');
 
+
 
+
 
         var app = new Vue({
 
             el: '#app',
 
             data: {
 
-                examples: [],
 
-                selectedId: 0,
 
+                loading: true,
 
+                relatedNews: [],
 
+                articleInfo: {},
 
+                previousInfo: {},
 
+                nextInfo: {},
 
             },
 
             computed: {
 
-                isInitData: function() {
 
-                    return this.examples.length > 0;
 
-                },
 
-                currentExamples: function() {
 
-                    return this.examples[this.selectedId];
 
-                }
 
-            },
 
-            methods: {
 
-                changeExampleType: function(tid) {
 
-                    this.selectedId = tid;
 
-                }
 
+                // hasRelated: function() {
 
+                //     return this.relatedNews.length > 0;
 
+                // },
 
+                // isNews: function() {
 
+                //     return (this.articleInfo.type == 1);
 
+                // },
 
+                // hasPrevious: function() {
 
+                //     return Object.keys(this.previousInfo).length > 0;
 
+                // },
 
+                // hasNext: function() {
 
+                //     return Object.keys(this.nextInfo).length > 0;
 
+                // }
 
             },
 
             mounted: function() {
 
-                this.examples = window.exampleinfo;
 
+                var self = this;
 
+                jQuery.ajax({
 
+                    type: 'POST',
 
+                    dataType: 'json',
 
+                    url: window.FQDN + '/solution_details',
 
+                    data: {
 
+                        id: solutionDetail_id
 
+                    }
 
+                }).done(function(res) {
 
+                    if (!res.mag) {
 
+                        return;
 
+                    }
 
+                    self.loading = false;
 
+                    self.relatedNews = res.related;
 
+
 
+                    var tmp_article = {};
 
+                    // tmp_article.id = res.id;
 
+                    tmp_article.title = res.data[0].title;
 
+
 
+                    tmp_article.region = res.data[0].region;
 
+                    tmp_article.scale = res.data[0].scale;
 
+                    tmp_article.content = res.data[0].content;
 
+                    tmp_article.details = res.data[0].details;
 
+
 
+                    // console.log(tmp_article.title);
 
+                    self.articleInfo = tmp_article;
 
+                    console.log(self.articleInfo.title);
 
+
 
+                    // var tmp_previous = {};
 
+                    // if (res.previous != null) {
 
+                    //     tmp_previous.id = res.previous.id;
 
+                    //     tmp_previous.title = ':' + res.previous.title;
 
+                    // }
 
+                    // self.previousInfo = tmp_previous;
 
+
 
+                    // var tmp_next = {};
 
+                    // if (res.next != null) {
 
+                    //     tmp_next.id = res.next.id;
 
+                    //     tmp_next.title = ':' + res.next.title;
 
+                    // }
 
+                    // self.nextInfo = tmp_next;
 
+
 
+                }).fail(function(err) {});
 
+            },
 
+            methods: {
 
+                // toTrade: function() {
 
+                //     // if (!this.isNews) {
 
+                //     //     return;
 
+                //     // }
 
+                //     window.location.href = "./trade/index.html";
 
+                // },
 
+                // toNews: function() {
 
+                //     // if (this.isNews) {
 
+                //     //     return;
 
+                //     // }
 
+                //     window.location.href = "./index.html";
 
+                // }
 
             }
 
         })
 
     </script>

+ 32 - 6
solution/detail2.html
Целия файл 

@@ -58,14 +58,40 @@
 
                                         <li>
 
                                             <a>城市治理</a>
 
                                             <ul class="submenu">
 
-                                                <li><a href="../solution">智能招商</a></li>
 
-                                                <li><a href="../solution">智慧安防</a></li>
 
-                                                <li><a href="../solution">智慧消防</a></li>
 
+                                                <li><a href="../solution">智慧招商</a></li>
 
+                                                <li><a>智慧安防</a></li>
 
+                                                <li><a>智慧消防</a></li>
 
+                                            </ul>
 
+                                        </li>
 
+                                        <li>
 
+                                            <a>民生服务</a>
 
+                                            <ul class="submenu">
 
+                                                <li><a>智慧停车</a></li>
 
+                                                <li><a>智慧教育</a></li>
 
+                                                <li><a>智慧路灯</a></li>
 
+                                                <li><a>环境监测</a></li>
 
+                                            </ul>
 
+                                        </li>
 
+                                        <li>
 
+                                            <a>园区服务</a>
 
+                                            <ul class="submenu">
 
+                                                <li><a>智慧社区</a></li>
 
+                                                <li><a>智慧商圈</a></li>
 
+                                                <li><a>智慧办公</a></li>
 
+                                                <li><a>智慧家居</a></li>
 
+                                                <li><a>通信配套</a></li>
 
+                                            </ul>
 
+                                        </li>
 
+                                        <li>
 
+                                            <a>其他拓展</a>
 
+                                            <ul class="submenu">
 
+                                                <li><a>智慧国土</a></li>
 
+                                                <li><a>智慧民防</a></li>
 
+                                                <li><a>智慧交通</a></li>
 
+                                                <li><a>智慧用电</a></li>
 
+                                                <li><a>通信水务</a></li>
 
                                             </ul>
 
                                         </li>
 
-                                        <li><a href="../solution">民生服务</a></li>
 
-                                        <li><a href="../solution">园区服务</a></li>
 
-                                        <li><a href="../solution">其他拓展</a></li>
 
                                     </ul>
 
                                 </li>
 
                                 <li>

+ 104 - 23
solution/index.html
Целия файл 

@@ -58,14 +58,40 @@
 
                                         <li>

                                             <a>城市治理</a>

                                             <ul class="submenu">

-                                                <li><a href="../solution">智能招商</a></li>

-                                                <li><a href="../solution">智慧安防</a></li>

-                                                <li><a href="../solution">智慧消防</a></li>

+                                                <li><a href="../solution">智慧招商</a></li>

+                                                <li><a>智慧安防</a></li>

+                                                <li><a>智慧消防</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>民生服务</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧停车</a></li>

+                                                <li><a>智慧教育</a></li>

+                                                <li><a>智慧路灯</a></li>

+                                                <li><a>环境监测</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>园区服务</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧社区</a></li>

+                                                <li><a>智慧商圈</a></li>

+                                                <li><a>智慧办公</a></li>

+                                                <li><a>智慧家居</a></li>

+                                                <li><a>通信配套</a></li>

+                                            </ul>

+                                        </li>

+                                        <li>

+                                            <a>其他拓展</a>

+                                            <ul class="submenu">

+                                                <li><a>智慧国土</a></li>

+                                                <li><a>智慧民防</a></li>

+                                                <li><a>智慧交通</a></li>

+                                                <li><a>智慧用电</a></li>

+                                                <li><a>通信水务</a></li>

                                             </ul>

                                         </li>

-                                        <li><a href="../solution">民生服务</a></li>

-                                        <li><a href="../solution">园区服务</a></li>

-                                        <li><a href="../solution">其他拓展</a></li>

                                     </ul>

                                 </li>

                                 <li>

@@ -96,7 +122,7 @@
 
     <!--====== HEADER END ======-->

 

     <!--====== COMMON BREADCRUMB START ======-->

-    <section class="common-bradcrumb-section" style="background-image: url('../assets/img/solution/solution-banner.jpg'); height:325px">

+    <section class="common-bradcrumb-section" style="background-image: url('../assets/img/solution-banner.png'); height:325px">

         <!-- <img src="../assets/img/solution/solution-banner.png" alt=""> -->

     </section>

     <!--====== COMMON BREADCRUMB END ======-->

@@ -140,6 +166,28 @@
 
     <!--====== SOLUTION SECTION END ======-->

 

     <!--====== SOLUTION LIST START ======-->

+    <!-- <div id="app">

+        <section class="solution-section solution-list-section pt-80 pb-80 img-left" v-for="item in solution" :key="item.id">

+            <div class="container">

+                <div class="section-title text-center both-border pb-60">

+                    <span class="title-tag2">{{item.title}}</span>

+                </div>

+                <div class="align-items-center justify-content-center solution-list">

+                    <div class="col-md-5 solution-img ">

+                        <img :src=`https://iot.usky.cn/${item.picture_title}` alt="">

+                    </div>

+                    <div class="col-md-7 solution-dest">

+                        <h4 class="solution-list-tit">区域：{{item.region}} 规模：{{item.scale}}</h4>

+                        <p>

+                            {{item.synopsis}}

+                        </p>

+                        <div class="learn-more"><a class="main-btn" :href="'./detail.html?id='+item.id">了解更多</a></div>

+                    </div>

+

+                </div>

+            </div>

+        </section>

+    </div> -->

     <section class="solution-section pt-80 pb-80 img-left">

         <div class="container">

             <div class="section-title text-center both-border pb-60">

@@ -190,6 +238,8 @@
 
             </div>

         </div>

     </section>

+

+

     <!--====== SOLUTION LIST END ======-->

 

 

@@ -300,31 +350,62 @@
 
     <!--====== Vue Developer js ======-->

     <!-- <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> -->

     <!--====== Vue js======-->

-    <script src="../assets/js/vue.min.js"></script>

+    <script src="../assets/js/settinginfo.js"></script>

+

+    <script src="../assets/js/vue.min.js "></script>

     <script>

+        var solution_list = [];

+        var one_page_num = 1;

         var app = new Vue({

             el: '#app',

             data: {

-                examples: [],

-                selectedId: 0,

+                solution: [],

             },

             computed: {

-                isInitData: function() {

-                    return this.examples.length > 0;

-                },

-                currentExamples: function() {

-                    return this.examples[this.selectedId];

-                }

-            },

-            methods: {

-                changeExampleType: function(tid) {

-                    this.selectedId = tid;

-                }

+

+

             },

             mounted: function() {

-                this.examples = window.exampleinfo;

+                var self = this;

+

+                jQuery.ajax({

+                    type: 'POST',

+                    dataType: 'json',

+                    url: window.FQDN + '/solution_list',

+                    data: {

+                        type: '1'

+                    },

+

+

+                }).done(function(res) {

+

+                    // console.log('goodmand');

+                    // console.log(res.data)

+

+                    if (!res.flag) {

+                        return;

+                    }

+

+

+                    let data = res.data;

+                    data.forEach(function(item) {

+                        // console.log('111')

+                        console.log(item)

+                        solution_list.push(item);

+                        self.solution.push(item);

+                        if (self.solution.length < one_page_num) {

+                            self.solution.push(item);

+                        }

+                    });

+

+

+                }).fail(function(err) {});

+            },

+            methods: {

+

+

             }

-        })

+        });

     </script>

 </body>

Някои файлове не бяха показани, защото твърде много файлове са промени