Bläddra i källkod

Merge branch 'master' of http://47.100.37.243:10080/ZHOU/yunsu

# Conflicts:
#	website/src/main/resources/templates/index.html
5 år sedan
förälder
incheckning
84c8d1cc67
1 ändrade filer med 252 tillägg och 231 borttagningar
  1. 252 231
      website/src/main/resources/templates/index.html

+ 252 - 231
website/src/main/resources/templates/index.html

@@ -55,11 +55,11 @@
                 <div id="navigation" class="navbar-collapse collapse">
                 <div id="navigation" class="navbar-collapse collapse">
                     <ul class="nav navbar-nav ml-auto">
                     <ul class="nav navbar-nav ml-auto">
                         <li class="nav-item dropdown active"><a href="index.html">首页 <b class="caret"></b></a></li>
                         <li class="nav-item dropdown active"><a href="index.html">首页 <b class="caret"></b></a></li>
-                        <li class="nav-item dropdown menu-large"><a href="product.html">产品优势 <b
+                        <li class="nav-item dropdown menu-large"><a href="template-accordions.html">产品优势 <b
                                 class="caret"></b></a></li>
                                 class="caret"></b></a></li>
-                        <li class="nav-item dropdown menu-large"><a href="partner.html">合作伙伴 <b class="caret"></b></a>
+                        <li class="nav-item dropdown menu-large"><a href="services.html">合作伙伴 <b class="caret"></b></a>
                         </li>
                         </li>
-                        <li class="nav-item dropdown menu-large"><a href="case.html">成功案例 <b
+                        <li class="nav-item dropdown menu-large"><a href="portfolio-3.html">成功案例 <b
                                 class="caret"></b></a></li>
                                 class="caret"></b></a></li>
                         <li class="nav-item dropdown"><a href="about.html">关于我们 <b class="caret"></b></a></li>
                         <li class="nav-item dropdown"><a href="about.html">关于我们 <b class="caret"></b></a></li>
                     </ul>
                     </ul>
@@ -98,308 +98,329 @@
                         <h3 class="h4">原料入场</h3>
                         <h3 class="h4">原料入场</h3>
                         <p>扫码录入仓位和物料信息,出入库记录随时查询。</p>
                         <p>扫码录入仓位和物料信息,出入库记录随时查询。</p>
                     </div>
                     </div>
-                    </div>
-                    <div class="col-lg-4 col-md-6">
+                </div>
+                <div class="col-lg-4 col-md-6">
                     <div class="box-simple">
                     <div class="box-simple">
                         <div class="icon-outlined"><i class="fa fa-print"></i></div>
                         <div class="icon-outlined"><i class="fa fa-print"></i></div>
                         <h3 class="h4">生产执行</h3>
                         <h3 class="h4">生产执行</h3>
                         <p>线上即可接单、报工、扫码进行投产、生产效率数据线上直接看。</p>
                         <p>线上即可接单、报工、扫码进行投产、生产效率数据线上直接看。</p>
                     </div>
                     </div>
-                    </div>
-                    <div class="col-lg-4 col-md-6">
+                </div>
+                <div class="col-lg-4 col-md-6">
                     <div class="box-simple">
                     <div class="box-simple">
                         <div class="icon-outlined"><i class="fa fa-globe"></i></div>
                         <div class="icon-outlined"><i class="fa fa-globe"></i></div>
                         <h3 class="h4">仓库管理</h3>
                         <h3 class="h4">仓库管理</h3>
                         <p>二维码轻松完成物料入库管理,库存清晰可查。</p>
                         <p>二维码轻松完成物料入库管理,库存清晰可查。</p>
                     </div>
                     </div>
-                    </div>
                 </div>
                 </div>
-                <div class="row">
-                    <div class="col-lg-4 col-md-6">
+            </div>
+            <div class="row">
+                <div class="col-lg-4 col-md-6">
                     <div class="box-simple">
                     <div class="box-simple">
                         <div class="icon-outlined"><i class="fa fa-lightbulb-o"></i></div>
                         <div class="icon-outlined"><i class="fa fa-lightbulb-o"></i></div>
                         <h3 class="h4">计划排程</h3>
                         <h3 class="h4">计划排程</h3>
                         <p>智能分配生产设备时间、批量发生产任务到工位。</p>
                         <p>智能分配生产设备时间、批量发生产任务到工位。</p>
                     </div>
                     </div>
-                    </div>
-                    <div class="col-lg-4 col-md-6">
+                </div>
+                <div class="col-lg-4 col-md-6">
                     <div class="box-simple">
                     <div class="box-simple">
                         <div class="icon-outlined"><i class="fa fa-envelope-o"></i></div>
                         <div class="icon-outlined"><i class="fa fa-envelope-o"></i></div>
                         <h3 class="h4">图形分析报表</h3>
                         <h3 class="h4">图形分析报表</h3>
                         <p>物料、生产、设备等多维度数据图形化呈现、实时查看监管监控。</p>
                         <p>物料、生产、设备等多维度数据图形化呈现、实时查看监管监控。</p>
                     </div>
                     </div>
-                    </div>
-                    <div class="col-lg-4 col-md-6">
+                </div>
+                <div class="col-lg-4 col-md-6">
                     <div class="box-simple">
                     <div class="box-simple">
                         <div class="icon-outlined"><i class="fa fa-user"></i></div>
                         <div class="icon-outlined"><i class="fa fa-user"></i></div>
                         <h3 class="h4">设备维护</h3>
                         <h3 class="h4">设备维护</h3>
                         <p>扫码即可查看设备信息、云端配置维保计划。</p>
                         <p>扫码即可查看设备信息、云端配置维保计划。</p>
                     </div>
                     </div>
-                    </div>
-                </div>
                 </div>
                 </div>
-            </section>
-            <section class="bar background-pentagon no-mb text-md-center">
-                <div class="container">
-                <div class="heading text-center">
-                    <h2>Testimonials</h2>
-                </div>
-                <p class="lead">We have worked with many clients and we always like to hear they come out from the cooperation happy and satisfied. Have a look what our clients said about us.</p>
-                <!-- Carousel Start-->
-                <ul class="owl-carousel testimonials list-unstyled equal-height">
-                    <li class="item">
+            </div>
+        </div>
+    </section>
+    <section class="bar background-pentagon no-mb text-md-center">
+        <div class="container">
+            <div class="heading text-center">
+                <h2>客户说</h2>
+            </div>
+            <p class="lead">We have worked with many clients and we always like to hear they come out from the
+                cooperation happy and satisfied. Have a look what our clients said about us.</p>
+            <!-- Carousel Start-->
+            <ul class="owl-carousel testimonials list-unstyled equal-height">
+                <li class="item">
                     <div class="testimonial d-flex flex-wrap">
                     <div class="testimonial d-flex flex-wrap">
                         <div class="text">
                         <div class="text">
-                        <p>One morning, when Gregor Samsa woke from troubled dreams, he found himself transformed in his bed into a horrible vermin. He lay on his armour-like back, and if he lifted his head a little he could see his brown belly, slightly domed and divided by arches into stiff sections.</p>
+                            <p>「 对比多家供应商后,我们选择了塑维,事实证明我们的选择是正确的,产能得到了大幅度提升! 」</p>
                         </div>
                         </div>
                         <div class="bottom d-flex align-items-center justify-content-between align-self-end">
                         <div class="bottom d-flex align-items-center justify-content-between align-self-end">
-                        <div class="icon"><i class="fa fa-quote-left"></i></div>
-                        <div class="testimonial-info d-flex">
-                            <div class="title">
-                            <h5>John McIntyre</h5>
-                            <p>CEO, TransTech</p>
+                            <div class="icon"><i class="fa fa-quote-left"></i></div>
+                            <div class="testimonial-info d-flex">
+                                <div class="title">
+                                    <h5>南京维和制造</h5>
+                                    <p>CEO, 杨树人</p>
+                                </div>
+                                <div class="avatar"><img alt="" src="img/person-1.jpg" class="img-fluid"></div>
                             </div>
                             </div>
-                            <div class="avatar"><img alt="" src="img/person-1.jpg" class="img-fluid"></div>
-                        </div>
                         </div>
                         </div>
                     </div>
                     </div>
-                    </li>
-                    <li class="item">
+                </li>
+                <li class="item">
                     <div class="testimonial d-flex flex-wrap">
                     <div class="testimonial d-flex flex-wrap">
                         <div class="text">
                         <div class="text">
-                        <p>The bedding was hardly able to cover it and seemed ready to slide off any moment. His many legs, pitifully thin compared with the size of the rest of him, waved about helplessly as he looked. "What's happened to me? " he thought. It wasn't a dream.</p>
+                            <p>「 工厂内很多以前难以收集、分析的数据,通过黑湖智造系统得以聚合、分析,帮助我们更好地发现生产问题,提升产能! 」</p>
                         </div>
                         </div>
                         <div class="bottom d-flex align-items-center justify-content-between align-self-end">
                         <div class="bottom d-flex align-items-center justify-content-between align-self-end">
-                        <div class="icon"><i class="fa fa-quote-left"></i></div>
-                        <div class="testimonial-info d-flex">
-                            <div class="title">
-                            <h5>John McIntyre</h5>
-                            <p>CEO, TransTech</p>
+                            <div class="icon"><i class="fa fa-quote-left"></i></div>
+                            <div class="testimonial-info d-flex">
+                                <div class="title">
+                                    <h5>黑湖科技</h5>
+                                    <p>设备 生产主管</p>
+                                </div>
+                                <div class="avatar"><img alt="" src="img/person-2.jpg" class="img-fluid"></div>
                             </div>
                             </div>
-                            <div class="avatar"><img alt="" src="img/person-2.jpg" class="img-fluid"></div>
-                        </div>
                         </div>
                         </div>
                     </div>
                     </div>
-                    </li>
-                    <li class="item">
+                </li>
+                <li class="item">
                     <div class="testimonial d-flex flex-wrap">
                     <div class="testimonial d-flex flex-wrap">
                         <div class="text">
                         <div class="text">
-                        <p>His room, a proper human room although a little too small, lay peacefully between its four familiar walls.</p>
-                        <p>A collection of textile samples lay spread out on the table - Samsa was a travelling salesman - and above it there hung a picture that he had recently cut out of an illustrated magazine and housed in a nice, gilded frame.</p>
+                            <p>「 上了黑湖智造系统之后,有效改造了厂内协同混乱的情况!物料、排程、生产、质检等信息都能够无缝打通! 」</p>
+                            <!--<p>A collection of textile samples lay spread out on the table - Samsa was a travelling salesman - and above it there hung a picture that he had recently cut out of an illustrated magazine and housed in a nice, gilded frame.</p>-->
                         </div>
                         </div>
                         <div class="bottom d-flex align-items-center justify-content-between align-self-end">
                         <div class="bottom d-flex align-items-center justify-content-between align-self-end">
-                        <div class="icon"><i class="fa fa-quote-left"></i></div>
-                        <div class="testimonial-info d-flex">
-                            <div class="title">
-                            <h5>John McIntyre</h5>
-                            <p>CEO, TransTech</p>
+                            <div class="icon"><i class="fa fa-quote-left"></i></div>
+                            <div class="testimonial-info d-flex">
+                                <div class="title">
+                                    <h5>黑湖科技</h5>
+                                    <p>设备 项目经理</p>
+                                </div>
+                                <div class="avatar"><img alt="" src="img/person-3.png" class="img-fluid"></div>
                             </div>
                             </div>
-                            <div class="avatar"><img alt="" src="img/person-3.png" class="img-fluid"></div>
-                        </div>
                         </div>
                         </div>
                     </div>
                     </div>
-                    </li>
-                    <li class="item">
+                </li>
+                <li class="item">
                     <div class="testimonial d-flex flex-wrap">
                     <div class="testimonial d-flex flex-wrap">
                         <div class="text">
                         <div class="text">
-                        <p>It showed a lady fitted out with a fur hat and fur boa who sat upright, raising a heavy fur muff that covered the whole of her lower arm towards the viewer. Gregor then turned to look out the window at the dull weather. Drops of rain could be heard hitting the pane, which made him feel quite sad.</p>
+                            <p>「 对比多家供应商后,我们选择了塑维,事实证明我们的选择是正确的,产能得到了大幅度提升! 」</p>
                         </div>
                         </div>
                         <div class="bottom d-flex align-items-center justify-content-between align-self-end">
                         <div class="bottom d-flex align-items-center justify-content-between align-self-end">
-                        <div class="icon"><i class="fa fa-quote-left"></i></div>
-                        <div class="testimonial-info d-flex">
-                            <div class="title">
-                            <h5>John McIntyre</h5>
-                            <p>CEO, TransTech</p>
+                            <div class="icon"><i class="fa fa-quote-left"></i></div>
+                            <div class="testimonial-info d-flex">
+                                <div class="title">
+                                    <h5>南京维和制造</h5>
+                                    <p>生产经理, 张大牛</p>
+                                </div>
+                                <div class="avatar"><img alt="" src="img/person-4.jpg" class="img-fluid"></div>
                             </div>
                             </div>
-                            <div class="avatar"><img alt="" src="img/person-4.jpg" class="img-fluid"></div>
-                        </div>
                         </div>
                         </div>
                     </div>
                     </div>
-                    </li>
-                    <li class="item">
-                    <div class="testimonial d-flex flex-wrap">
-                        <div class="text">
-                        <p>It showed a lady fitted out with a fur hat and fur boa who sat upright, raising a heavy fur muff that covered the whole of her lower arm towards the viewer. Gregor then turned to look out the window at the dull weather. Drops of rain could be heard hitting the pane, which made him feel quite sad. Gregor then turned to look out the window at the dull weather. Drops of rain could be heard hitting the pane, which made him feel quite sad.</p>
-                        </div>
-                        <div class="bottom d-flex align-items-center justify-content-between align-self-end">
-                        <div class="icon"><i class="fa fa-quote-left"></i></div>
-                        <div class="testimonial-info d-flex">
-                            <div class="title">
-                            <h5>John McIntyre</h5>
-                            <p>CEO, TransTech</p>
-                            </div>
-                            <div class="avatar"><img alt="" src="img/person-1.jpg" class="img-fluid"></div>
-                        </div>
+                </li>
+                <!--<li class="item">-->
+                <!--<div class="testimonial d-flex flex-wrap">-->
+                <!--<div class="text">-->
+                <!--<p>It showed a lady fitted out with a fur hat and fur boa who sat upright, raising a heavy fur muff that covered the whole of her lower arm towards the viewer. Gregor then turned to look out the window at the dull weather. Drops of rain could be heard hitting the pane, which made him feel quite sad. Gregor then turned to look out the window at the dull weather. Drops of rain could be heard hitting the pane, which made him feel quite sad.</p>-->
+                <!--</div>-->
+                <!--<div class="bottom d-flex align-items-center justify-content-between align-self-end">-->
+                <!--<div class="icon"><i class="fa fa-quote-left"></i></div>-->
+                <!--<div class="testimonial-info d-flex">-->
+                <!--<div class="title">-->
+                <!--<h5>John McIntyre</h5>-->
+                <!--<p>CEO, TransTech</p>-->
+                <!--</div>-->
+                <!--<div class="avatar"><img alt="" src="img/person-1.jpg" class="img-fluid"></div>-->
+                <!--</div>-->
+                <!--</div>-->
+                <!--</div>-->
+                <!--</li>-->
+            </ul>
+            <!-- Carousel End-->
+        </div>
+    </section>
+    <section style="background: url(img/background_bottom.jpg) center top no-repeat; background-size: cover;"
+             class="bar no-mb color-white text-center bg-fixed relative-positioned">
+        <div class="dark-mask"></div>
+        <div class="container">
+            <div class="icon icon-outlined icon-lg"><i class="fa fa-file-code-o"></i></div>
+            <h3 class="text-uppercase">想要看到更多吗?</h3>
+            <p class="lead">我们准备了多个关于本公司的400多个产品的介绍,想要了解更多点击了解详情。</p>
+            <p class="text-center"><a href="about.html" class="btn btn-template-outlined-white btn-lg">了解详情</a></p>
+        </div>
+    </section>
+    <section class="bg-white bar">
+        <div class="container">
+            <div class="heading text-center">
+                <h2>成功案例</h2>
+            </div>
+            <!--<p class="lead">Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis-->
+            <!--egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero-->
+            <!--sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. <a-->
+            <!--href="blog.html">Check our blog</a></p>-->
+            <div class="row">
+                <div class="col-lg-3" th:each="item : ${articles}">
+                    <div class="home-blog-post">
+                        <div class="image" style="text-align: center"><img th:src="${{item.imageUrl}}" src="img/portfolio-4.jpg" alt="..."
+                                                                           class="img-fluid">
+                            <!--<div class="overlay d-flex align-items-center justify-content-center">-->
+                            <!--<a href="#" class="btn btn-template-outlined-white">-->
+                            <!--<i class="fa fa-chain"> </i> Read More</a></div>-->
                         </div>
                         </div>
-                    </div>
-                    </li>
-                </ul>
-                <!-- Carousel End-->
-                </div>
-            </section>
-            <section style="background: url(img/background_bottom.jpg) center top no-repeat; background-size: cover;" class="bar no-mb color-white text-center bg-fixed relative-positioned">
-                <div class="dark-mask"></div>
-                <div class="container">
-                <div class="icon icon-outlined icon-lg"><i class="fa fa-file-code-o"></i></div>
-                <h3 class="text-uppercase">Do you want to see more?</h3>
-                <p class="lead">We have prepared for you more than 40 different HTML pages, including 5 variations of homepage.</p>
-                <p class="text-center"><a href="index2.html" class="btn btn-template-outlined-white btn-lg">See another homepage</a></p>
-                </div>
-            </section>
-            <section class="bg-white bar">
-                <div class="container">
-                <div class="heading text-center">
-                    <h2>From the blog</h2>
-                </div>
-                <p class="lead">Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. <a href="blog.html">Check our blog</a></p>
-                <div class="row">
-                    <div class="col-lg-3" th:each="item : ${articles}">
-                        <div class="home-blog-post" >
-                            <div class="image"><img  th:src="${{item.imageUrl}}" src="img/portfolio-4.jpg" alt="..." class="img-fluid">
-                                <div class="overlay d-flex align-items-center justify-content-center">
-                                    <!--<a href="#" class="btn btn-template-outlined-white">-->
-                                        <i class="fa fa-chain"> </i> Read More</a></div>
-                            </div>
-                            <div class="text">
-                                <h4><a href="#">Fashion Now </a></h4>
-                                <p class="author-category" th:text="${{item.title}}">
-                                     <!--By <a href="#">John Snow</a> in <a href="blog.html">Webdesign</a>-->
-                                </p>
-                                <!--这里的 th:utext 是对html标签进行转译 -->
-                                <p class="intro" th:utext="${{item.content}}">Fifth abundantly made Give sixth hath. Cattle creature i be don't them behold green moved fowl Moved life us beast good yielding. Have bring.</p>
-                                <!--<a href="#" class="btn btn-template-outlined">Continue Reading</a>-->
-                            </div>
+                        <div class="text">
+                            <!--<h4><a href="#">Fashion Now </a></h4>-->
+                            <p class="author-category" th:text="${{item.title}}">
+                                <!--By <a href="#">John Snow</a> in <a href="blog.html">Webdesign</a>-->
+                            </p>
+                            <!--这里的 th:utext 是对html标签进行转译 -->
+                            <p class="intro" th:utext="${{item.content}}">Fifth abundantly made Give sixth hath. Cattle
+                                creature i be don't them behold green moved fowl Moved life us beast good yielding. Have
+                                bring.</p>
+                            <!--<a href="#" class="btn btn-template-outlined">Continue Reading</a>-->
                         </div>
                         </div>
                     </div>
                     </div>
-                    <!--<div class="col-lg-3">-->
-                    <!--<div class="home-blog-post">-->
-                        <!--<div class="image"><img src="img/portfolio-3.jpg" alt="..." class="img-fluid">-->
-                        <!--<div class="overlay d-flex align-items-center justify-content-center"><a href="#" class="btn btn-template-outlined-white"><i class="fa fa-chain"> </i> Read More</a></div>-->
-                        <!--</div>-->
-                        <!--<div class="text">-->
-                        <!--<h4><a href="#">What to do</a></h4>-->
-                        <!--<p class="author-category">By <a href="#">John Snow</a> in <a href="blog.html">Webdesign</a></p>-->
-                        <!--<p class="intro">Fifth abundantly made Give sixth hath. Cattle creature i be don't them behold green moved fowl Moved life us beast good yielding. Have bring.</p><a href="#" class="btn btn-template-outlined">Continue Reading</a>-->
-                        <!--</div>-->
-                    <!--</div>-->
-                    <!--</div>-->
-                    <!--<div class="col-lg-3">-->
-                    <!--<div class="home-blog-post">-->
-                        <!--<div class="image"><img src="img/portfolio-5.jpg" alt="..." class="img-fluid">-->
-                        <!--<div class="overlay d-flex align-items-center justify-content-center"><a href="#" class="btn btn-template-outlined-white"><i class="fa fa-chain"> </i> Read More</a></div>-->
-                        <!--</div>-->
-                        <!--<div class="text">-->
-                        <!--<h4><a href="#">5 ways to look awesome</a></h4>-->
-                        <!--<p class="author-category">By <a href="#">John Snow</a> in <a href="blog.html">Webdesign</a></p>-->
-                        <!--<p class="intro">Fifth abundantly made Give sixth hath. Cattle creature i be don't them behold green moved fowl Moved life us beast good yielding. Have bring.</p><a href="#" class="btn btn-template-outlined">Continue Reading</a>-->
-                        <!--</div>-->
-                    <!--</div>-->
-                    <!--</div>-->
-                    <!--<div class="col-lg-3">-->
-                    <!--<div class="home-blog-post">-->
-                        <!--<div class="image"><img src="img/portfolio-6.jpg" alt="..." class="img-fluid">-->
-                        <!--<div class="overlay d-flex align-items-center justify-content-center"><a href="#" class="btn btn-template-outlined-white"><i class="fa fa-chain"> </i> Read More</a></div>-->
-                        <!--</div>-->
-                        <!--<div class="text">-->
-                        <!--<h4><a href="#">Fashion Now </a></h4>-->
-                        <!--<p class="author-category">By <a href="#">John Snow</a> in <a href="blog.html">Webdesign</a></p>-->
-                        <!--<p class="intro">Fifth abundantly made Give sixth hath. Cattle creature i be don't them behold green moved fowl Moved life us beast good yielding. Have bring.</p><a href="#" class="btn btn-template-outlined">Continue Reading</a>-->
-                        <!--</div>-->
-                    <!--</div>-->
-                    <!--</div>-->
                 </div>
                 </div>
-                </div>
-            </section>
-            <section class="bar bg-gray">
-                <div class="container">
-                <div class="heading text-center">
-                    <h2>Our Clients</h2>
-                </div>
-                <ul class="list-unstyled owl-carousel customers no-mb">
+                <!--<div class="col-lg-3">-->
+                <!--<div class="home-blog-post">-->
+                <!--<div class="image"><img src="img/portfolio-3.jpg" alt="..." class="img-fluid">-->
+                <!--<div class="overlay d-flex align-items-center justify-content-center"><a href="#" class="btn btn-template-outlined-white"><i class="fa fa-chain"> </i> Read More</a></div>-->
+                <!--</div>-->
+                <!--<div class="text">-->
+                <!--<h4><a href="#">What to do</a></h4>-->
+                <!--<p class="author-category">By <a href="#">John Snow</a> in <a href="blog.html">Webdesign</a></p>-->
+                <!--<p class="intro">Fifth abundantly made Give sixth hath. Cattle creature i be don't them behold green moved fowl Moved life us beast good yielding. Have bring.</p><a href="#" class="btn btn-template-outlined">Continue Reading</a>-->
+                <!--</div>-->
+                <!--</div>-->
+                <!--</div>-->
+                <!--<div class="col-lg-3">-->
+                <!--<div class="home-blog-post">-->
+                <!--<div class="image"><img src="img/portfolio-5.jpg" alt="..." class="img-fluid">-->
+                <!--<div class="overlay d-flex align-items-center justify-content-center"><a href="#" class="btn btn-template-outlined-white"><i class="fa fa-chain"> </i> Read More</a></div>-->
+                <!--</div>-->
+                <!--<div class="text">-->
+                <!--<h4><a href="#">5 ways to look awesome</a></h4>-->
+                <!--<p class="author-category">By <a href="#">John Snow</a> in <a href="blog.html">Webdesign</a></p>-->
+                <!--<p class="intro">Fifth abundantly made Give sixth hath. Cattle creature i be don't them behold green moved fowl Moved life us beast good yielding. Have bring.</p><a href="#" class="btn btn-template-outlined">Continue Reading</a>-->
+                <!--</div>-->
+                <!--</div>-->
+                <!--</div>-->
+                <!--<div class="col-lg-3">-->
+                <!--<div class="home-blog-post">-->
+                <!--<div class="image"><img src="img/portfolio-6.jpg" alt="..." class="img-fluid">-->
+                <!--<div class="overlay d-flex align-items-center justify-content-center"><a href="#" class="btn btn-template-outlined-white"><i class="fa fa-chain"> </i> Read More</a></div>-->
+                <!--</div>-->
+                <!--<div class="text">-->
+                <!--<h4><a href="#">Fashion Now </a></h4>-->
+                <!--<p class="author-category">By <a href="#">John Snow</a> in <a href="blog.html">Webdesign</a></p>-->
+                <!--<p class="intro">Fifth abundantly made Give sixth hath. Cattle creature i be don't them behold green moved fowl Moved life us beast good yielding. Have bring.</p><a href="#" class="btn btn-template-outlined">Continue Reading</a>-->
+                <!--</div>-->
+                <!--</div>-->
+                <!--</div>-->
+            </div>
+        </div>
+    </section>
+    <section class="bar bg-gray">
+        <div class="container">
+            <div class="heading text-center">
+                <h2>合作公司</h2>
+            </div>
+            <ul class="list-unstyled owl-carousel customers no-mb">
 
 
-                    <li class="item" th:each="item : ${cooperations}"><img th:src="${{item.imageUrl}}" src="img/customer-1.png" alt="" class="img-fluid"></li>
-                    <!--<li class="item"><img src="img/customer-2.png" alt="" class="img-fluid"></li>-->
-                    <!--<li class="item"><img src="img/customer-3.png" alt="" class="img-fluid"></li>-->
-                    <!--<li class="item"><img src="img/customer-4.png" alt="" class="img-fluid"></li>-->
-                    <!--<li class="item"><img src="img/customer-5.png" alt="" class="img-fluid"></li>-->
-                    <!--<li class="item"><img src="img/customer-6.png" alt="" class="img-fluid"></li>-->
-                </ul>
-                </div>
-            </section>
-            <!-- FOOTER -->
-            <footer class="main-footer">
-                <div class="container">
-                    <div class="row">
-                        <div class="col-lg-3">
-                        <h4 class="h6">About Us</h4>
-                        <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
-                        <hr>
-                        <h4 class="h6">Join Our Monthly Newsletter</h4>
-                        <form>
-                            <div class="input-group">
+                <li class="item" th:each="item : ${cooperations}">
+                    <img th:src="${{item.imageUrl}}" src="img/customer-1.png" alt="" class="img-fluid">
+                    <div style="text-align: center;" th:text="${{item.name}}">
+                    </div>
+                </li>
+                <!--<li class="item"><img src="img/customer-2.png" alt="" class="img-fluid"></li>-->
+                <!--<li class="item"><img src="img/customer-3.png" alt="" class="img-fluid"></li>-->
+                <!--<li class="item"><img src="img/customer-4.png" alt="" class="img-fluid"></li>-->
+                <!--<li class="item"><img src="img/customer-5.png" alt="" class="img-fluid"></li>-->
+                <!--<li class="item"><img src="img/customer-6.png" alt="" class="img-fluid"></li>-->
+            </ul>
+        </div>
+    </section>
+    <!-- FOOTER -->
+    <footer class="main-footer">
+        <div class="container">
+            <div class="row">
+                <div class="col-lg-3">
+                    <h4 class="h6">About Us</h4>
+                    <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
+                    <hr>
+                    <h4 class="h6">Join Our Monthly Newsletter</h4>
+                    <form>
+                        <div class="input-group">
                             <input type="text" class="form-control">
                             <input type="text" class="form-control">
                             <div class="input-group-append">
                             <div class="input-group-append">
                                 <button type="button" class="btn btn-secondary"><i class="fa fa-send"></i></button>
                                 <button type="button" class="btn btn-secondary"><i class="fa fa-send"></i></button>
                             </div>
                             </div>
-                            </div>
-                        </form>
-                        <hr class="d-block d-lg-none">
                         </div>
                         </div>
-                        <div class="col-lg-3">
-                        <h4 class="h6">Blog</h4>
-                        <ul class="list-unstyled footer-blog-list">
-                            <li class="d-flex align-items-center">
+                    </form>
+                    <hr class="d-block d-lg-none">
+                </div>
+                <div class="col-lg-3">
+                    <h4 class="h6">Blog</h4>
+                    <ul class="list-unstyled footer-blog-list">
+                        <li class="d-flex align-items-center">
                             <div class="image"><img src="img/detailsquare.jpg" alt="..." class="img-fluid"></div>
                             <div class="image"><img src="img/detailsquare.jpg" alt="..." class="img-fluid"></div>
                             <div class="text">
                             <div class="text">
-                                <h5 class="mb-0"> <a href="post.html">Blog post name</a></h5>
+                                <h5 class="mb-0"><a href="post.html">Blog post name</a></h5>
                             </div>
                             </div>
-                            </li>
-                            <li class="d-flex align-items-center">
+                        </li>
+                        <li class="d-flex align-items-center">
                             <div class="image"><img src="img/detailsquare.jpg" alt="..." class="img-fluid"></div>
                             <div class="image"><img src="img/detailsquare.jpg" alt="..." class="img-fluid"></div>
                             <div class="text">
                             <div class="text">
-                                <h5 class="mb-0"> <a href="post.html">Blog post name</a></h5>
+                                <h5 class="mb-0"><a href="post.html">Blog post name</a></h5>
                             </div>
                             </div>
-                            </li>
-                            <li class="d-flex align-items-center">
+                        </li>
+                        <li class="d-flex align-items-center">
                             <div class="image"><img src="img/detailsquare.jpg" alt="..." class="img-fluid"></div>
                             <div class="image"><img src="img/detailsquare.jpg" alt="..." class="img-fluid"></div>
                             <div class="text">
                             <div class="text">
-                                <h5 class="mb-0"> <a href="post.html">Very very long blog post name</a></h5>
+                                <h5 class="mb-0"><a href="post.html">Very very long blog post name</a></h5>
                             </div>
                             </div>
-                            </li>
-                        </ul>
-                        <hr class="d-block d-lg-none">
-                        </div>
-                        <div class="col-lg-3">
-                        <h4 class="h6">Contact</h4>
-                        <p class="text-uppercase"><strong>Universal Ltd.</strong><br>13/25 New Avenue <br>Newtown upon River <br>45Y 73J <br>England <br><strong>Great Britain</strong></p><a href="contact.html" class="btn btn-template-main">Go to contact page</a>
-                        <hr class="d-block d-lg-none">
-                        </div>
-                        <div class="col-lg-3">
-                        <ul class="list-inline photo-stream">
-                            <li class="list-inline-item"><a href="#"><img src="img/detailsquare.jpg" alt="..." class="img-fluid"></a></li>
-                            <li class="list-inline-item"><a href="#"><img src="img/detailsquare2.jpg" alt="..." class="img-fluid"></a></li>
-                            <li class="list-inline-item"><a href="#"><img src="img/detailsquare3.jpg" alt="..." class="img-fluid"></a></li>
-                            <li class="list-inline-item"><a href="#"><img src="img/detailsquare3.jpg" alt="..." class="img-fluid"></a></li>
-                            <li class="list-inline-item"><a href="#"><img src="img/detailsquare2.jpg" alt="..." class="img-fluid"></a></li>
-                            <li class="list-inline-item"><a href="#"><img src="img/detailsquare.jpg" alt="..." class="img-fluid"></a></li>
-                        </ul>
-                        </div>
-                    </div>
+                        </li>
+                    </ul>
+                    <hr class="d-block d-lg-none">
+                </div>
+                <div class="col-lg-3">
+                    <h4 class="h6">Contact</h4>
+                    <p class="text-uppercase"><strong>Universal Ltd.</strong><br>13/25 New Avenue <br>Newtown upon River
+                        <br>45Y 73J <br>England <br><strong>Great Britain</strong></p><a href="contact.html"
+                                                                                         class="btn btn-template-main">Go
+                    to contact page</a>
+                    <hr class="d-block d-lg-none">
                 </div>
                 </div>
-            </footer>
+                <div class="col-lg-3">
+                    <ul class="list-inline photo-stream">
+                        <li class="list-inline-item"><a href="#"><img src="img/detailsquare.jpg" alt="..."
+                                                                      class="img-fluid"></a></li>
+                        <li class="list-inline-item"><a href="#"><img src="img/detailsquare2.jpg" alt="..."
+                                                                      class="img-fluid"></a></li>
+                        <li class="list-inline-item"><a href="#"><img src="img/detailsquare3.jpg" alt="..."
+                                                                      class="img-fluid"></a></li>
+                        <li class="list-inline-item"><a href="#"><img src="img/detailsquare3.jpg" alt="..."
+                                                                      class="img-fluid"></a></li>
+                        <li class="list-inline-item"><a href="#"><img src="img/detailsquare2.jpg" alt="..."
+                                                                      class="img-fluid"></a></li>
+                        <li class="list-inline-item"><a href="#"><img src="img/detailsquare.jpg" alt="..."
+                                                                      class="img-fluid"></a></li>
+                    </ul>
+                </div>
+            </div>
         </div>
         </div>
-        <!-- Javascript files-->
-        <script src="vendor/jquery/jquery.min.js"></script>
-        <script src="vendor/popper.js/umd/popper.min.js"> </script>
-        <script src="vendor/bootstrap/js/bootstrap.min.js"></script>
-        <script src="vendor/jquery.cookie/jquery.cookie.js"> </script>
-        <script src="vendor/waypoints/lib/jquery.waypoints.min.js"> </script>
-        <script src="vendor/jquery.counterup/jquery.counterup.min.js"> </script>
-        <script src="vendor/owl.carousel/owl.carousel.min.js"></script>
-        <script src="vendor/owl.carousel2.thumbs/owl.carousel2.thumbs.min.js"></script>
-        <script src="js/jquery.parallax-1.1.3.js"></script>
-        <script src="vendor/bootstrap-select/js/bootstrap-select.min.js"></script>
-        <script src="vendor/jquery.scrollto/jquery.scrollTo.min.js"></script>
-        <script src="js/front.js"></script>
-    </body>
+    </footer>
+</div>
+<!-- Javascript files-->
+<script src="vendor/jquery/jquery.min.js"></script>
+<script src="vendor/popper.js/umd/popper.min.js"></script>
+<script src="vendor/bootstrap/js/bootstrap.min.js"></script>
+<script src="vendor/jquery.cookie/jquery.cookie.js"></script>
+<script src="vendor/waypoints/lib/jquery.waypoints.min.js"></script>
+<script src="vendor/jquery.counterup/jquery.counterup.min.js"></script>
+<script src="vendor/owl.carousel/owl.carousel.min.js"></script>
+<script src="vendor/owl.carousel2.thumbs/owl.carousel2.thumbs.min.js"></script>
+<script src="js/jquery.parallax-1.1.3.js"></script>
+<script src="vendor/bootstrap-select/js/bootstrap-select.min.js"></script>
+<script src="vendor/jquery.scrollto/jquery.scrollTo.min.js"></script>
+<script src="js/front.js"></script>
+</body>
 </html>
 </html>