前端首页完成

application/home/controller/About.php

@@ -0,0 +1,111 @@
+<?php
+
+namespace app\home\controller;
+
+use think\Lang;
+use think\Cache;
+use think\Request;
+use think\Controller;
+use think\Validate;
+
+/**
+ * 关于我们类
+ */
+class About extends Controller
+{
+
+
+    /**
+     * 构造函数
+     *
+     * @access public
+     */
+    public function __construct()
+    {
+        parent::__construct();
+
+    }//end __construct()
+
+
+    /**
+     * 关于我们管理
+     *
+     * @access public
+     * @return array JsonString
+     */
+    public function index()
+    {
+        // 获取导航.
+        $navigationField = [
+            'navigation_zhName',
+            'navigation_enName',
+            'navigation_id',
+        ];
+        $navigationWhere = ['navigation_type' => 1];
+        $getNavigation = model('Navigation')->getSelect($navigationField, $navigationWhere);
+        $this->assign('navigation', $getNavigation);
+        // 导航Id.
+        $navigationId = [
+            'home',
+            'service',
+            'count',
+            'about-us',
+            'pricing',
+            'contact',
+        ];
+        $this->assign('navigationId', $navigationId);
+        // 获取未显示在导航的标题.
+        $navigationWhere = ['navigation_type' => 2];
+        $getNavigation = model('Navigation')->getSelect($navigationField, $navigationWhere);
+        $this->assign('navigationTitle', $getNavigation);
+        // 主获取页主介绍.
+        $getIndexIntroduceSlt = ['product_ctitle'];
+        $getIndexIntroduceWhr['product_type'] = 1;
+        $getIndexIntroduce = model('Product')->getSelect($getIndexIntroduceSlt, $getIndexIntroduceWhr);
+        $getIndexIntroduceArr = explode("@#", $getIndexIntroduce[0]['product_ctitle']);
+        $this->assign('indexIntroduceArr', $getIndexIntroduceArr);
+        // 获取服务.
+        $getServiceSlt = [
+            'product_ctitle',
+            'product_title',
+        ];
+        $getServiceWhr['product_type'] = 2;
+        $getService = model('Product')->getSelect($getServiceSlt, $getServiceWhr);
+        $this->assign('service', $getService);
+        // 获取解决方案.
+        $getSolutionSlt = ['product_title'];
+        $getSolutionWhr['product_type'] = 4;
+        $getSolution = model('Product')->getSelect($getSolutionSlt, $getSolutionWhr);
+        $this->assign('solution', $getSolution);
+        // 获取案例展示.
+        $getCaseSlt = [
+            'product_title',
+            'product_ctitle',
+        ];
+        $getCaseWhr['product_type'] = 3;
+        $getCase = model('Product')->getSelect($getCaseSlt, $getCaseWhr);
+        $this->assign('case', $getCase);
+        // 合作流程.
+        $getCooperationProcessSlt = ['product_title'];
+        $getCooperationProcessWhr['product_type'] = 7;
+        $getCooperationProcess = model('Product')->getSelect($getCooperationProcessSlt, $getCooperationProcessWhr);
+        $this->assign('cooperationProcess', $getCooperationProcess);
+        // 获取foot.
+        $getFootSlt = [
+            'value',
+            'remark',
+        ];
+        $getFootWhr = [
+            ['code' => 'site_phone'],
+            ['code' => 'site_email'],
+            ['code' => 'fax'],
+        ];
+        $getFoot = model('Config')->getSelect($getFootSlt, $getFootWhr);
+        $this->assign('foot', $getFoot);
+
+        return $this->fetch();
+
+    }//end index()
+
+
+}

application/home/controller/ContactUs.php

@@ -0,0 +1,53 @@
+<?php
+
+namespace app\home\controller;
+
+use think\Lang;
+use think\Cache;
+use think\Request;
+use think\Controller;
+use think\Validate;
+
+/**
+ * 主页管理类
+ */
+class ContactUs extends Controller
+{
+
+
+    /**
+     * 构造函数
+     *
+     * @access public
+     */
+    public function __construct()
+    {
+        parent::__construct();
+
+    }//end __construct()
+
+
+    /**
+     * 主页管理
+     *
+     * @access public
+     * @return array JsonString
+     */
+    public function index()
+    {
+        // 获取导航.
+        $navigationField = [
+            'navigation_zhName',
+            'navigation_enName',
+            'navigation_id',
+        ];
+        $navigationWhere = ['navigation_type' => 1];
+        $getNavigation = model('Navigation')->getSelect($navigationField, $navigationWhere);
+        $this->assign('navigation', $getNavigation);
+
+        return $this->fetch();
+
+    }//end index()
+
+
+}

application/home/controller/Index.php

@@ -6,6 +6,7 @@ use think\Lang;
 use think\Cache;
 use think\Request;
 use think\Controller;
+use think\Validate;
 
 /**
  * 主页管理类
@@ -32,6 +33,7 @@ class Index extends Controller
      */
     public function index()
     {
+        // 获取导航.
         $navigationField = [
             'navigation_zhName',
             'navigation_enName',
@@ -40,6 +42,7 @@ class Index extends Controller
         $navigationWhere = ['navigation_type' => 1];
         $getNavigation = model('Navigation')->getSelect($navigationField, $navigationWhere);
         $this->assign('navigation', $getNavigation);
+        // 导航Id.
         $navigationId = [
             'home',
             'service',
@@ -49,13 +52,118 @@ class Index extends Controller
             'contact',
         ];
         $this->assign('navigationId', $navigationId);
+        // 获取未显示在导航的标题.
         $navigationWhere = ['navigation_type' => 2];
         $getNavigation = model('Navigation')->getSelect($navigationField, $navigationWhere);
         $this->assign('navigationTitle', $getNavigation);
+        // 主获取页主介绍.
+        $getIndexIntroduceSlt = ['product_ctitle'];
+        $getIndexIntroduceWhr['product_type'] = 1;
+        $getIndexIntroduce = model('Product')->getSelect($getIndexIntroduceSlt, $getIndexIntroduceWhr);
+        $getIndexIntroduceArr = explode("@#", $getIndexIntroduce[0]['product_ctitle']);
+        $this->assign('indexIntroduceArr', $getIndexIntroduceArr);
+        // 获取服务.
+        $getServiceSlt = [
+            'product_ctitle',
+            'product_title',
+        ];
+        $getServiceWhr['product_type'] = 2;
+        $getService = model('Product')->getSelect($getServiceSlt, $getServiceWhr);
+        $this->assign('service', $getService);
+        // 获取解决方案.
+        $getSolutionSlt = ['product_title'];
+        $getSolutionWhr['product_type'] = 4;
+        $getSolution = model('Product')->getSelect($getSolutionSlt, $getSolutionWhr);
+        $this->assign('solution', $getSolution);
+        // 获取案例展示.
+        $getCaseSlt = [
+            'product_title',
+            'product_ctitle',
+        ];
+        $getCaseWhr['product_type'] = 3;
+        $getCase = model('Product')->getSelect($getCaseSlt, $getCaseWhr);
+        $this->assign('case', $getCase);
+        // 合作流程.
+        $getCooperationProcessSlt = ['product_title'];
+        $getCooperationProcessWhr['product_type'] = 7;
+        $getCooperationProcess = model('Product')->getSelect($getCooperationProcessSlt, $getCooperationProcessWhr);
+        $this->assign('cooperationProcess', $getCooperationProcess);
+        // 获取foot.
+        $getFootSlt = [
+            'value',
+            'remark',
+        ];
+        $getFootWhr = [
+            ['code' => 'site_phone'],
+            ['code' => 'site_email'],
+            ['code' => 'fax'],
+        ];
+        $getFoot = model('Config')->getSelect($getFootSlt, $getFootWhr);
+        $this->assign('foot', $getFoot);
 
-        $this->assign('admin_info', 11);
         return $this->fetch();
-    }
+    }//endindex()
+
+    /**
+     * 主页管理
+     *
+     * @access public
+     * @return array JsonString
+     */
+    public function userNeeds()
+    {
+        if (request()->isPost() === true) {
+            $name = input('post.name');
+            $email = input('post.email');
+            $phone = input('post.phone');
+            $content = input('post.content');
+            $data = array(
+                'message_customer' => $name,
+                'message_email' => $email,
+                'message_phone' => $phone,
+                'message_content' => $content,
+            );
+            // 验证数据  BEGIN.
+            $rule = [
+                ['message_customer', 'require', '称呼不能为空'],
+                ['message_email', 'email', '邮箱格式不符合要求'],
+                ['message_phone', 'require', '电话不能为空'],
+                ['message_content', 'require', '需求不能为空'],
+            ];
+            $validate = new Validate($rule);
+            $validate_result = $validate->check($data);
+            // 验证失败.
+            if ($validate_result === false) {
+                $result = [
+                    'code' => 601,
+                    'msg' => $validate->getError(),
+                    'success' => false,
+                    'data' => [],
+                ];
+                return json_encode($result);
+            }//end if
+            $getAddId = model('Message')->addMessage($data);
+            if (empty($getAddId) === false) {
+                $result = [
+                    'code' => 200,
+                    'msg' => '操作成功',
+                    'success' => true,
+                    'data' => [],
+                ];
+                return json_encode($result);
+            } else {
+                $result = [
+                    'code' => 601,
+                    'msg' => '操作失败',
+                    'success' => false,
+                    'data' => [],
+                ];
+                return json_encode($result);
+            }
+        }//end if
+
+    }//end userNeeds()
+
 
     /**
      * 修改密码

application/home/model/Config.php

@@ -0,0 +1,42 @@
+<?php
+namespace app\home\model;
+
+use think\Model;
+
+/**
+ * 主页导航管理模型
+ */
+class Config extends Model
+{
+
+
+    /**
+     * 主页文字获取
+     *
+     * @access public
+     * @param mixed $field 查询字段
+     * @param mixed $where 条件
+     * @param mixed $order 排序
+     * @return array 返回类型
+     */
+    public function getSelect($field, $where=[], $order='id asc')
+    {
+        $result = $this->field($field);
+        if (empty($where) === false) {
+            foreach ($where as $key => $value) {
+                if ($key === 0) {
+                    $result = $result->where($value);
+                } else {
+                    $result = $result->whereOr(function ($query) use ($value) {
+                        $query->where($value);
+                    });
+                }
+            }
+        }
+
+        $result = $result->order($order)->select();
+        return $result;
+    }//endgetSelect()
+
+
+}

application/home/model/Message.php

@@ -0,0 +1,27 @@
+<?php
+namespace app\home\model;
+
+use think\Model;
+
+/**
+ * 主页导航管理模型
+ */
+class Message extends Model
+{
+
+
+    /**
+     * 添加建议
+     *
+     * @access public
+     * @param mixed $data 添加内容
+     * @return string 返回类型
+     */
+    public function addMessage($data)
+    {
+        $result = $this->insertGetId($data);
+        return $result;
+    }//endgetSelect()
+
+
+}

application/home/model/Product.php

@@ -0,0 +1,34 @@
+<?php
+namespace app\home\model;
+
+use think\Model;
+
+/**
+ * 主页导航管理模型
+ */
+class Product extends Model
+{
+
+
+    /**
+     * 主页文字获取
+     *
+     * @access public
+     * @param mixed $field 查询字段
+     * @param mixed $where 条件
+     * @param mixed $order 排序
+     * @return array 返回类型
+     */
+    public function getSelect($field, $where=[], $order='product_id asc')
+    {
+        $result = $this->field($field);
+        if (empty($where) === false) {
+            $result = $result->where($where);
+        }
+
+        $result = $result->order($order)->select();
+        return $result;
+    }//endgetSelect()
+
+
+}

application/home/view/about/index.html

@@ -0,0 +1,865 @@
+<!DOCTYPE html>
+<!--[if lt IE 7]>      <html lang="en" class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
+<!--[if IE 7]>         <html lang="en" class="no-js lt-ie9 lt-ie8"> <![endif]-->
+<!--[if IE 8]>         <html lang="en" class="no-js lt-ie9"> <![endif]-->
+<!--[if gt IE 8]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
+<head>
+    <!-- Mobile Specific Meta -->
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- Always force latest IE rendering engine -->
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <!-- Meta Keyword -->
+    <meta name="keywords" content="one page, business template, single page, onepage, responsive, parallax, creative, business, html5, css3, css3 animation">
+    <!-- meta character set -->
+    <meta charset="utf-8">
+    <link rel="SHORTCUT ICON" href="{$Think.HOME_SITE_ROOT}/images/title.png"/>
+
+    <!-- Site Title -->
+    <title>AQM官网</title>
+
+    <!--
+    Google Fonts
+    ============================================= -->
+    <link href="http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700" rel="stylesheet" type="text/css">
+    <link href="https://fonts.googleapis.com/css?family=Baloo+Thambi|Slabo+27px" rel="stylesheet">
+
+    <!--
+    CSS
+    ============================================= -->
+    <!-- Fontawesome -->
+    <link rel="stylesheet" href="{$Think.HOME_SITE_ROOT}/css/font-awesome.min.css">
+    <!-- Bootstrap -->
+    <link rel="stylesheet" href="{$Think.HOME_SITE_ROOT}/css/bootstrap.min.css">
+    <!-- Fancybox -->
+    <link rel="stylesheet" href="{$Think.HOME_SITE_ROOT}/css/jquery.fancybox.css">
+    <!-- owl carousel -->
+    <link rel="stylesheet" href="{$Think.HOME_SITE_ROOT}/css/owl.carousel.css">
+    <!-- Animate -->
+    <link rel="stylesheet" href="{$Think.HOME_SITE_ROOT}/css/animate.css">
+    <!-- Main Stylesheet -->
+    <link rel="stylesheet" href="{$Think.HOME_SITE_ROOT}/css/main.css">
+    <!-- Main Responsive -->
+    <link rel="stylesheet" href="{$Think.HOME_SITE_ROOT}/css/responsive.css">
+
+    <!-- Modernizer Script for old Browsers -->
+    <script src="{$Think.HOME_SITE_ROOT}/js/vendor/modernizr-2.6.2.min.js"></script>
+
+</head>
+
+<body>
+
+<!--
+Fixed Navigation
+==================================== -->
+<header id="navigation" class="navbar-fixed-top">
+    <div class="container">
+
+        <div class="navbar-header">
+            <!-- responsive nav button -->
+            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
+                <span class="sr-only">Toggle navigation</span>
+                <span class="icon-bar"></span>
+                <span class="icon-bar"></span>
+                <span class="icon-bar"></span>
+            </button>
+            <!-- /responsive nav button -->
+
+            <!-- logo -->
+            <!--<h1 class="navbar-brand">-->
+            <h1 class="">
+                <a href="#body">
+                    <img src="{$Think.HOME_SITE_ROOT}/images/logo.png" width="70%">
+                    <!--<div class="site-logo"><span>K</span>eeper</div>-->
+                </a>
+            </h1>
+            <!-- /logo -->
+
+        </div>
+
+        <!-- main nav -->
+        <nav class="collapse navigation navbar-collapse navbar-right" role="navigation">
+            <ul id="nav" class="nav navbar-nav">
+                {foreach name="navigation" item="value" key="key"}
+                    {if $value.navigation_enName === 'contact us'}
+                        <li><a href="/home/contact/index">{$value.navigation_zhName}</a></li>
+                    {elseif $value.navigation_enName === 'about us'}
+                        <li><a href="/home/about/index">{$value.navigation_zhName}</a></li>
+                    {else}
+                        <li><a href="/home/index/index">{$value.navigation_zhName}</a></li>
+                    {/if}
+                {/foreach}
+                <!--<li><a href="#service">Service</a></li>
+                <li><a href="#portfolio">portfolio</a></li>
+                <li><a href="#about">About</a></li>
+                <li><a href="#pricing">Pricing</a></li>
+                <li><a href="#contact">Contact</a></li>-->
+            </ul>
+        </nav>
+        <!-- /main nav -->
+    </div>
+
+</header>
+<!--
+End Fixed Navigation
+==================================== -->
+
+
+<!--
+Home Slider
+==================================== -->
+<section id="home" style="background: url('{$Think.HOME_SITE_ROOT}/images/bg4.png') fixed no-repeat left top / cover;">
+    <div class="container">
+        <!--<div class="container"style="background-color: rgba(50, 50, 50, 0.8); margin-top: -100px; width: 100%;">-->
+        <div class="home-intro">
+            <div class="animated bounceInRight" style="text-align: left; float: left">
+                <p style="font-size: 150px; font-weight: 800; margin-top: -100px;">A</p>
+            </div>
+            <div class="animated bounceInRight" style="text-align: left; float: left; margin-left: 20px;">
+                <p style="font-size: 30px; margin-left: 10px;">BOUT</p>
+                <p style="font-size: 30px;">关于我们</p>
+            </div>
+        </div>
+    </div>
+</section>
+<!--
+End #home Slider
+========================== -->
+
+
+<!--
+#service
+========================== -->
+<section id="{$navigationId[1]}">
+    <div class="container">
+        <div class="row">
+            <div class="col-md-12">
+                <div class="section-title text-center wow fadeInDown">
+                    <h1>{$navigation[5]->navigation_zhName}</h1>
+                    <h3>—&nbsp;&nbsp;&nbsp;{$navigation[5]->navigation_enName}&nbsp;&nbsp;&nbsp;—</h3>
+                </div>
+            </div>
+        </div>
+        <div class="row">
+
+            <div class="col-md-12">
+                <div class="section-title text-center wow fadeInUp" style="display: flex; justify-content: center; width: 100%">
+                    <p style="text-align: left; width: 1000px">成都安全猫网络科技有限公司-软件开发公司是国内专业的软件外包、定制开发公司。自成立以来，秉承"诚信、协作、奉献、超越"的精神，着力打造集战略咨询、平台技术和专业服务为一体的软件企业。在金融、保险、银行、医疗、物流、制造、教育、核能、汽车等行业拥有丰富的软件开发经验。 北京软件开发公司宜天信达涵盖多种应用与技术平台，拥有成熟的信息系统和软件开发外包解决方案，我们的专业团队将作为您的IT部门来开展长期紧密的合作，立足于您的业务和信息化目标，开发符合您业务目标和商业价值的软件。 我们将抓住机遇，坚持以人为本，加大自主产品创新，提升重大工程实施能力，加快规范化进程，实现规模经济和跨越式发展，立志打造“中国软件行业优秀企业”。</p>
+                </div>
+            </div>
+
+        </div> <!-- end .row -->
+    </div> <!-- end .container -->
+</section><div class="tlinks">Collect from <a href="http://www.cssmoban.com/" >自助建站</a></div>
+<!--
+End #service
+========================== -->
+
+<!--
+#service-bottom
+========================== -->
+
+<!--<section id="service-bottom">
+    <div class="container">
+        <div class="mobile-device">
+            <img data-wow-delay="0.2s" class="img-responsive black  wow fadeInLeftBig" src="img/iphone/iphone-black.png" alt="iPhone Black">
+            <img data-wow-delay="0.5s" class="img-responsive white  wow fadeInLeftBig" src="img/iphone/iphone-white.png" alt="iPhone White">
+        </div>
+        <div class="service-features wow fadeInRight">
+            <h3>Our Latest Services</h3>
+            <p>Curabitur arcu erat, accumsan iditea imperdiet et, porttitor at sem. Mauris blandit aliquet elit ciduntue.</p>
+            <ul>
+                <li><i class="fa fa-android"></i>Responsive Design</li>
+                <li><i class="fa fa-apple"></i>Modern And Clean Design</li>
+                <li><i class="fa fa-globe"></i>Browser Friendly</li>
+                <li><i class="fa fa-code"></i>Clean Code</li>
+            </ul>
+        </div>
+    </div>
+</section>-->
+<!--
+End #service-bottom
+========================== -->
+
+
+<!--
+#Portfolio
+========================== -->
+
+<!--<section id="portfolio">
+
+    <div class="section-title text-center wow fadeInDown">
+        <h2>Portfolio</h2>
+        <p>Aliquam condimen tum velit ut sapien dignissim, ut blandit neque fermentum. Suspendisse ante nunc, eleifend eget turpis sit amet, sodales porttitor felis.</p>
+    </div>
+
+    <nav class="project-filter clearfix text-center wow fadeInLeft"  data-wow-delay="0.5s">
+        <ul class="list-inline">
+            <li><a href="javascript:;" class="filter" data-filter="all">All</a></li>
+            <li><a href="javascript:;" class="filter" data-filter=".app">App</a></li>
+            <li><a href="javascript:;" class="filter" data-filter=".photography">Photography</a></li>
+            <li><a href="javascript:;" class="filter" data-filter=".web">Web</a></li>
+            <li><a href="javascript:;" class="filter" data-filter=".print">Print</a></li>
+        </ul>
+    </nav>
+
+    <div id="projects" class="clearfix">
+
+        <figure class="mix portfolio-item app">
+            <img class="img-responsive" src="img/portfolio/portfolio-1.jpg" alt="Portfolio Item">
+            <a href="img/portfolio/portfolio-1.jpg" title="Title One" rel="portfolio" class="fancybox"><span class="plus"></span></a>
+        </figure>
+
+        <figure class="mix portfolio-item photography">
+            <img class="img-responsive" src="img/portfolio/portfolio-2.jpg" alt="Portfolio Item">
+            <a href="img/portfolio/portfolio-2.jpg" title="Title Two" rel="portfolio" class="fancybox"><span class="plus"></span></a>
+        </figure>
+
+        <figure class="mix portfolio-item web">
+            <img class="img-responsive" src="img/portfolio/portfolio-3.jpg" alt="Portfolio Item">
+            <a href="img/portfolio/portfolio-3.jpg" title="Title Three" rel="portfolio" class="fancybox"><span class="plus"></span></a>
+        </figure>
+
+        <figure class="mix portfolio-item print">
+            <img class="img-responsive" src="img/portfolio/portfolio-4.jpg" alt="Portfolio Item">
+            <a href="img/portfolio/portfolio-4.jpg" title="Title Four" rel="portfolio" class="fancybox"><span class="plus"></span></a>
+        </figure>
+
+        <figure class="mix portfolio-item app">
+            <img class="img-responsive" src="img/portfolio/portfolio-4.jpg" alt="Portfolio Item">
+            <a href="img/portfolio/portfolio-4.jpg" title="Title Five" rel="portfolio" class="fancybox"><span class="plus"></span></a>
+        </figure>
+
+        <figure class="mix portfolio-item photography">
+            <img class="img-responsive" src="img/portfolio/portfolio-1.jpg" alt="Portfolio Item">
+            <a href="img/portfolio/portfolio-1.jpg" title="Title Six" rel="portfolio" class="fancybox"><span class="plus"></span></a>
+        </figure>
+
+        <figure class="mix portfolio-item web app">
+            <img class="img-responsive" src="img/portfolio/portfolio-2.jpg" alt="Portfolio Item">
+            <a href="img/portfolio/portfolio-2.jpg" title="Title Seven" rel="portfolio" class="fancybox"><span class="plus"></span></a>
+        </figure>
+
+        <figure class="mix portfolio-item print web">
+            <img class="img-responsive" src="img/portfolio/portfolio-3.jpg" alt="Portfolio Item">
+            <a href="img/portfolio/portfolio-3.jpg" title="Title Eight" rel="portfolio" class="fancybox"><span class="plus"></span></a>
+        </figure>
+
+    </div> &lt;!&ndash; end #projects &ndash;&gt;
+
+</section>-->
+<!--
+End #Portfolio
+========================== -->
+
+<!--
+#about
+========================== -->
+<!--<section id="about">
+    <div class="container">
+        <div class="row">
+
+            <div class="col-md-12">
+                <div class="section-title text-center wow fadeInUp">
+                    <h2>About Us</h2>
+                    <p>Aliquam condimen tum velit ut sapien dignissim, ut blandit neque fermentum. Suspendisse ante nunc, eleifend eget turpis sit amet, sodales porttitor felis.</p>
+                    <a class="btn btn-blue" role="button">Read More</a>
+                </div>
+            </div>
+            <div class="col-md-12 text-center">
+
+                <div class="about-us text-center wow fadeInDown">
+                    <img src="img/about.png" alt="About Us" class="img-responsive">
+                </div>
+            </div>
+
+        </div>
+    </div>
+</section>-->
+<!--
+End #about
+========================== -->
+
+
+<!--
+#count
+========================== -->
+
+<section id="count">
+    <div class="container">
+        <div class="row" style="color: #fff">
+
+            <div class="col-md-12" style="margin-bottom: 50px">
+                <div class="section-title text-center wow fadeInUp">
+                    <h1>{$navigation[2]->navigation_zhName}</h1>
+                    <h3>—&nbsp;&nbsp;&nbsp;{$navigation[2]->navigation_enName}&nbsp;&nbsp;&nbsp;—</h3>
+                </div>
+            </div>
+
+            <div class="col-md-5 col-sm-6 col-xs-12 wow fadeInLeft" data-wow-delay="0.5s">
+                <p style="font-size: 18px; padding-right: 120px">新零售，即企业以互联网为依托，通过运用大数
+                    据，人工智能等先进技术手段并运用心理学知
+                    识，对商品的生产，流通与销售过程进行升级
+                    改造，进而重塑业态结构与生态圈，并对线上
+                    服务，线下体验以及现代物流进行升读融合的
+                    临售模式。</p>
+            </div>
+
+            <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px; margin-right: 40px;" data-wow-delay="0.5s">
+                <!--<div class="fact-item text-center">
+                    <div class="count-icon">
+                        <i class="fa fa-android"></i>
+                    </div>
+                    <span data-to="120">0</span>
+                    <p>Completed Projects</p>
+                </div>-->
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/onlinMarket.png" style="margin-bottom: 20px;"></h3>
+                <h3>{$solution[0]->product_title}</h3>
+            </div>
+
+            <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px; margin-right: 40px;" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/storeManagement.png" style="margin-bottom: 20px;"></h3>
+                <h3>{$solution[1]->product_title}</h3>
+            </div>
+
+            <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px;" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/bargain.png" style="margin-bottom: 20px;"></h3>
+                <h3>{$solution[2]->product_title}</h3>
+            </div>
+
+            <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px; margin-right: 40px;" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/customerManagement.png" style="margin-bottom: 20px;"></h3>
+                <h3>{$solution[3]->product_title}</h3>
+            </div>
+
+            <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px;" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/Invoicing.png" style="margin-bottom: 20px;"></h3>
+                <h3>{$solution[4]->product_title}</h3>
+            </div>
+
+        </div>
+    </div>
+</section>
+<!--
+End #count
+========================== -->
+
+<!--
+#about-us
+========================== -->
+<section id="about-us">
+    <div class="container">
+        <div class="row">
+
+            <div class="col-md-12" style="margin-bottom: 50px">
+                <div class="section-title text-center wow fadeInUp">
+                    <h1>{$navigation[3]->navigation_zhName}</h1>
+                    <h3>—&nbsp;&nbsp;&nbsp;{$navigation[3]->navigation_enName}&nbsp;&nbsp;&nbsp;—</h3>
+                </div>
+            </div>
+
+            <div style="float: left">
+                <div class="col-md-5 col-md-offset-1 wow fadeInLeft">
+                    <img src="{$Think.HOME_SITE_ROOT}/images/custom.png">
+                </div> <!-- end .col-md-5 -->
+                <div class="col-md-5 col-md-offset-1 wow fadeInRight">
+                    <div class="subtitle">
+                        <h3>{$case[0]->product_title}</h3>
+                        <p>{$case[0]->product_ctitle}</p>
+                    </div>
+                </div>
+            </div>
+
+            <div style="float: left; margin-top: 50px">
+                <div class="col-md-5 col-md-offset-1 wow fadeInRight">
+                    <div class="subtitle">
+                        <h3>{$case[1]->product_title}</h3>
+                        <p>{$case[1]->product_ctitle}</p>
+                    </div>
+                </div>  <!-- end .col-md-5 -->
+                <div class="col-md-5 col-md-offset-1 wow fadeInLeft">
+                    <img src="{$Think.HOME_SITE_ROOT}/images/4444.png">
+                </div> <!-- end .col-md-5 -->
+            </div>
+
+            <div style="float: left; margin-top: 50px">
+                <div class="col-md-5 col-md-offset-1 wow fadeInLeft">
+                    <img src="{$Think.HOME_SITE_ROOT}/images/433433.png">
+                </div> <!-- end .col-md-5 -->
+                <div class="col-md-5 col-md-offset-1 wow fadeInRight">
+                    <div class="subtitle">
+                        <h3>{$case[2]->product_title}</h3>
+                        <p>{$case[2]->product_ctitle}</p>
+                    </div>
+                </div>
+            </div>
+
+        </div>
+    </div>
+</section>
+<!--
+End #about-us
+========================== -->
+
+
+<section id="service-bottom">
+    <div class="container"style="background-color: rgba(50, 50, 50, 0.8); margin-top: -100px; width: 100%;">
+        <div class="row" style="color: #fff">
+
+            <div class="col-md-12" style="margin-top: 100px;">
+                <div class="section-title text-center wow fadeInUp">
+                    <h1>{$navigationTitle[0]->navigation_zhName}</h1>
+                    <h3>—&nbsp;&nbsp;&nbsp;{$navigationTitle[0]->navigation_enName}&nbsp;&nbsp;&nbsp;—</h3>
+                </div>
+            </div>
+
+<div style="display: flex; justify-content: center; clear: both;">
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/demandDegotiation.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[0]->product_title}</h3>
+            </div>
+
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/productDesign.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[1]->product_title}</h3>
+            </div>
+
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/technology.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[2]->product_title}</h3>
+            </div>
+
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/systemTesting.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[3]->product_title}</h3>
+            </div>
+
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/updateBug.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[4]->product_title}</h3>
+            </div>
+
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/productLine.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[5]->product_title}</h3>
+            </div>
+
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/maintenance.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[6]->product_title}</h3>
+            </div>
+</div>
+
+        </div>
+    </div>
+</section>
+
+<!--
+#quotes
+========================== -->
+<section id="portfolio">
+    <div class="container">
+        <div class="row">
+            <div class="col-md-12">
+                <div class="section-title text-center wow fadeInDown">
+                    <h1>{$navigationTitle[1]->navigation_zhName}</h1>
+                    <h3>—&nbsp;&nbsp;&nbsp;{$navigationTitle[1]->navigation_enName}&nbsp;&nbsp;&nbsp;—</h3>
+                </div>
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/dohop.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/tincy.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/dohop2.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/cityDesign.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/cityDesign2.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/cityDesign3.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/tincy2.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/dohop3.png" width="280px">
+            </div>
+
+        </div>
+    </div>
+</section>
+<!--
+End #quotes
+========================== -->
+
+<!--
+#pricing
+========================== -->
+<!--<section id="pricing">
+    <div class="container">
+        <div class="row">
+
+            <div class="section-title text-center wow fadeInUp">
+                <h2>Pricing</h2>
+                <p>Aliquam condimen tum velit ut sapien dignissim, ut blandit neque fermentum. Suspendisse ante nunc, eleifend eget turpis sit amet, sodales porttitor felis.</p>
+            </div>
+
+            <div class="col-md-3 col-sm-6 col-xs-12 wow fadeInUp">
+                <div class="pricing-table text-center">
+                    <div class="plan-icon">
+                        <i class="fa fa-taxi"></i>
+                    </div>
+                    <div class="plan-title">
+                        <span class="plan">Basic</span>
+                    </div>
+                    <div class="price">
+                        <span class="value"><small>$</small><strong>19</strong>/MO</span>
+                    </div>
+                    <ul class="text-center">
+                        <li>condimen tum velit</li>
+                        <li>Aliquam condimen</li>
+                        <li>sapien dignissim</li>
+                        <li>Psapien dignis</li>
+                    </ul>
+                    <a href="#" class="btn btn-price">Buy Now</a>
+                </div>
+            </div>
+
+            <div class="col-md-3 col-sm-6 col-xs-12 wow fadeInUp" data-wow-delay="0.3s">
+                <div class="pricing-table text-center">
+                    <div class="plan-icon">
+                        <i class="fa fa-ambulance"></i>
+                    </div>
+                    <div class="plan-title">
+                        <span class="plan">Premium</span>
+                    </div>
+                    <div class="price">
+                        <span class="value"><small>$</small><strong>19</strong>/MO</span>
+                    </div>
+                    <ul class="text-center">
+                        <li>condimen tum velit</li>
+                        <li>Aliquam condimen</li>
+                        <li>sapien dignissim</li>
+                        <li>Psapien dignis</li>
+                    </ul>
+                    <a href="#" class="btn btn-price">Buy Now</a>
+                </div>
+            </div>
+
+            <div class="col-md-3 col-sm-6 col-xs-12 wow fadeInUp" data-wow-delay="0.6s">
+                <div class="pricing-table highlight text-center">
+                    <div class="plan-icon">
+                        <i class="fa fa-rocket"></i>
+                    </div>
+                    <div class="plan-title">
+                        <span class="plan">Pro</span>
+                    </div>
+                    <div class="price">
+                        <span class="value"><small>$</small><strong>19</strong>/MO</span>
+                    </div>
+                    <ul class="text-center">
+                        <li>condimen tum velit</li>
+                        <li>Aliquam condimen</li>
+                        <li>sapien dignissim</li>
+                        <li>Psapien dignis</li>
+                    </ul>
+                    <a href="#" class="btn btn-price">Buy Now</a>
+                </div>
+            </div>
+
+            <div class="col-md-3 col-sm-6 col-xs-12 wow fadeInUp" data-wow-delay="0.9s">
+                <div class="pricing-table text-center">
+                    <div class="plan-icon">
+                        <i class="fa fa-plane"></i>
+                    </div>
+                    <div class="plan-title">
+                        <span class="plan">Platinum</span>
+                    </div>
+                    <div class="price">
+                        <span class="value"><small>$</small><strong>19</strong>/MO</span>
+                    </div>
+                    <ul class="text-center">
+                        <li>condimen tum velit</li>
+                        <li>Aliquam condimen</li>
+                        <li>sapien dignissim</li>
+                        <li>Psapien dignis</li>
+                    </ul>
+                    <a href="#" class="btn btn-price">Buy Now</a>
+                </div>
+            </div>
+        </div>
+        <div class="row">
+            <div class="col-md-12 wow fadeInUp">
+                <div class="special-plan text-center">
+                    <p>Contact us if you have special request</p>
+                    <a href="#" class="btn btn-blue">Contact Us</a>
+                </div>
+            </div>
+        </div>
+    </div>
+</section>
+&lt;!&ndash;
+End #pricing
+========================== &ndash;&gt;
+
+
+&lt;!&ndash;
+#subscribe
+========================== &ndash;&gt;
+<section id="subscribe">
+    <div class="container">
+        <div class="row">
+
+            <div class="col-md-4 col-sm-5 col-xs-12 text-left wow fadeInRight">
+                <div class="subscribe-man"><img class="img-responsive" src="img/young-men.png" /></div>
+            </div>
+            <div class="col-md-7 col-sm-7 col-xs-12 wow fadeInLeft">
+                <form action="#" method="post" class="subscription-form">
+                    <i class="fa fa-envelope-o fa-lg"></i>
+                    <input type="email" name="subscribe" class="subscribe" placeholder="YOUR MAIL">
+                    <input type="submit" value="SUBSCRIBE" id="mail-submit">
+                </form>
+            </div>
+
+        </div>
+    </div>
+</section>-->
+<!--
+End #subscribe
+========================== -->
+
+<!--
+#contact
+========================== -->
+<section id="contact">
+    <div class="container">
+        <div class="row">
+
+            <div class="col-md-12">
+                <div class="section-title text-center wow fadeInUp">
+                    <h1>{$navigationTitle[2]->navigation_zhName}</h1>
+                    <h3>—&nbsp;&nbsp;&nbsp;{$navigationTitle[2]->navigation_enName}&nbsp;&nbsp;&nbsp;—</h3>
+                </div>
+            </div>
+
+            <div class="contact-form clearfix">
+                <div class="text-center">
+                    <div class="col-md-6 col-sm-12 wow fadeInLeft">
+                        <div class="input-field">
+                            <input id="inputName" type="text" class="form-control" name="name" placeholder="您的称呼" required="">
+                        </div>
+                        <div class="input-field">
+                            <input id="inputEmail" type="text" class="form-control" name="email" placeholder="您的邮箱" required="">
+                        </div>
+                        <div class="input-field">
+                            <input id="inputPhone" type="text" class="form-control" name="phone" placeholder="您的电话" required="">
+                        </div>
+                    </div>
+                    <div class="col-md-6 col-sm-12 wow fadeInLeft input-field message">
+                        <textarea id="inputContent" name="content" class="form-control" placeholder="把您的需求填写在这里......" style="height: 225px;" required></textarea>
+                    </div>
+                    <input type="submit" onclick="userNeeds()" class="btn btn-blue" value="提交" id="msg-submit">
+                </div>
+            </div>
+
+            <!--<div class="col-md-8 col-md-offset-2 wow fadeInLeft">
+                <div class="contact-form clearfix">
+                    <form class="text-center" action="index.html" method="post">
+                        <div class="input-field">
+                            <input type="text" class="form-control" name="name" placeholder="Your Name" required="">
+                        </div>
+                        <div class="input-field">
+                            <input type="email" class="form-control" name="email" placeholder="Your Email" required="">
+                        </div>
+                        <div class="input-field message">
+                            <textarea name="message" class="form-control" placeholder="Your Message" required></textarea>
+                        </div>
+                        <input type="submit" class="btn btn-blue" value="SEND MESSAGE" id="msg-submit">
+                    </form>
+                </div> &lt;!&ndash; end .contact-form &ndash;&gt;
+            </div>--> <!-- .col-md-8 -->
+
+        </div>
+    </div>
+</section>
+<!--
+End #contact
+========================== -->
+
+<!--
+#footer
+========================== -->
+<footer id="footer" class="text-center">
+    <div class="container" style="margin-top: -70px; color: #fff;">
+        <div class="row">
+            <div class="col-md-3 col-sm-12">
+                <div class="footer-social wow fadeInUp">
+                    <h4 style="text-align: left;">联系我们</h4>
+                    <ul class="text-center list-inline">
+                        <li>
+                            <a href="#" class="pull-left text-center" style="margin-right: 10px">
+                                <img src="{$Think.HOME_SITE_ROOT}/images/fax.png">
+                            </a>
+                            <div class="media-body">
+                                <p>{$foot[2]->remark}：{$foot[2]->value}</p>
+                            </div>
+                        </li>
+                        <li>
+                            <a href="#" class="pull-left text-center" style="margin-right: 10px">
+                                <img src="{$Think.HOME_SITE_ROOT}/images/email.png">
+                            </a>
+                            <div class="media-body">
+                                <p>{$foot[1]->remark}：{$foot[1]->value}</p>
+                            </div>
+                        </li>
+                        <li>
+                            <a href="#" class="pull-left text-center" style="margin-right: 10px">
+                                <img src="{$Think.HOME_SITE_ROOT}/images/phone.png">
+                            </a>
+                            <div class="media-body">
+                                <p>{$foot[0]->remark}：{$foot[0]->value}</p>
+                            </div>
+                        </li>
+                    </ul>
+
+                </div>
+            </div>
+            <div class="col-md-3 col-sm-12">
+                <div class="footer-social wow fadeInUp">
+                    <h4 style="text-align: left;">站点导航</h4>
+                    <ul class="text-center list-inline">
+                        {foreach name="navigation" item="value" key="key"}
+                            {if $key !== 0}
+                                <li style="width: 45%;">
+                                    <div class="media-body">
+                                        <a href="#{$navigationId[$key]}" style="color: #fff">{$value.navigation_zhName}</a>
+                                    </div>
+                                </li>
+                            {/if}
+                        {/foreach}
+                    </ul>
+
+                </div>
+            </div>
+            <div class="col-md-4 col-sm-12" style="margin-left: 100px">
+                <div class="footer-social wow fadeInUp" style="float: left">
+                    <h4>关注微信</h4>
+                    <div style="margin-top: 20px;">
+                        <img src="{$Think.HOME_SITE_ROOT}/images/code.png">
+                    </div>
+                </div>
+                <div class="footer-social wow fadeInUp" style="float: left; margin-left: 80px">
+                    <h4>关注微博</h4>
+                    <div style="margin-top: 20px;">
+                        <img src="{$Think.HOME_SITE_ROOT}/images/code.png">
+                    </div>
+                </div>
+            </div>
+            <!--<div class="col-lg-12">
+                <div class="footer-social wow fadeInUp">
+                    <h3><span>K</span>eeper</h3>
+                    <ul class="text-center list-inline">
+                        <li>
+                            <div class="fact-icon">
+                                <i class="fa fa-facebook fa-lg"></i>
+                            </div>
+                        </li>
+                        <li>
+                            <div class="fact-icon">
+                                <i class="fa fa-twitter fa-lg"></i>
+                            </div>
+                        </li>
+                        <li>
+                            <div class="fact-icon">
+                                <i class="fa fa-google-plus fa-lg"></i>
+                            </div>
+                        </li>
+                    </ul>
+                </div>
+
+                <div class="copyright">
+
+                    <p>Theme by Scripteden. Developed by Shaifuddin / More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></p>
+                </div>
+
+            </div>-->
+        </div>
+    </div>
+</footer>
+<!--
+End #footer
+========================== -->
+
+
+<!--
+JavaScripts
+========================== -->
+
+<!-- main jQuery -->
+<script src="{$Think.HOME_SITE_ROOT}/js/vendor/jquery-1.11.1.min.js"></script>
+<!-- Bootstrap -->
+<script src="{$Think.HOME_SITE_ROOT}/js/bootstrap.min.js"></script>
+<!-- jquery.nav -->
+<script src="{$Think.HOME_SITE_ROOT}/js/jquery.nav.js"></script>
+<!-- Portfolio Filtering -->
+<script src="{$Think.HOME_SITE_ROOT}/js/jquery.mixitup.min.js"></script>
+<!-- Fancybox -->
+<script src="{$Think.HOME_SITE_ROOT}/js/jquery.fancybox.pack.js"></script>
+<!-- Parallax sections -->
+<script src="{$Think.HOME_SITE_ROOT}/js/jquery.parallax-1.1.3.js"></script>
+<!-- jQuery Appear -->
+<script src="{$Think.HOME_SITE_ROOT}/js/jquery.appear.js"></script>
+<!-- countTo -->
+<script src="{$Think.HOME_SITE_ROOT}/js/jquery-countTo.js"></script>
+<!-- owl carousel -->
+<script src="{$Think.HOME_SITE_ROOT}/js/owl.carousel.min.js"></script>
+<!-- WOW script -->
+<script src="{$Think.HOME_SITE_ROOT}/js/wow.min.js"></script>
+<!-- theme custom scripts -->
+<script src="{$Think.HOME_SITE_ROOT}/js/main.js"></script>
+<script>
+    const locationHost = window.location.host;
+    function userNeeds() {
+        let inputName = $(" #inputName").val();
+        let inputEmail = $(" #inputEmail").val();
+        let inputPhone = $(" #inputPhone").val();
+        let inputContent = $(" #inputContent").val();
+        if (inputName && inputEmail && inputPhone && inputContent) {
+            $.ajax({
+                type: "post",
+                url: '/home/index/userNeeds',
+                data: {name: inputName, email: inputEmail, phone: inputPhone, content: inputContent},
+                xhrFields: {
+                    withCredentials: true
+                },
+                dataType: "json",
+                success: function (msg) {
+                    let backMsg = JSON.parse(msg);
+                    if (backMsg && backMsg.success) {
+                        alert('发送成功');
+                    } else {
+                        alert('请求失败');
+                    }
+                },
+                error: function () {
+                    alert('请求失败');
+                }
+            });
+        }
+    }
+</script>
+</body>
+</html>

application/home/view/contactUs/index.html

@@ -0,0 +1,925 @@
+<!DOCTYPE html>
+<!--[if lt IE 7]>      <html lang="en" class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
+<!--[if IE 7]>         <html lang="en" class="no-js lt-ie9 lt-ie8"> <![endif]-->
+<!--[if IE 8]>         <html lang="en" class="no-js lt-ie9"> <![endif]-->
+<!--[if gt IE 8]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
+<head>
+    <!-- Mobile Specific Meta -->
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <!-- Always force latest IE rendering engine -->
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <!-- Meta Keyword -->
+    <meta name="keywords" content="one page, business template, single page, onepage, responsive, parallax, creative, business, html5, css3, css3 animation">
+    <!-- meta character set -->
+    <meta charset="utf-8">
+    <link rel="SHORTCUT ICON" href="{$Think.HOME_SITE_ROOT}/images/title.png"/>
+
+    <!-- Site Title -->
+    <title>AQM官网</title>
+
+    <!--
+    Google Fonts
+    ============================================= -->
+    <link href="http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700" rel="stylesheet" type="text/css">
+    <link href="https://fonts.googleapis.com/css?family=Baloo+Thambi|Slabo+27px" rel="stylesheet">
+
+    <!--
+    CSS
+    ============================================= -->
+    <!-- Fontawesome -->
+    <link rel="stylesheet" href="{$Think.HOME_SITE_ROOT}/css/font-awesome.min.css">
+    <!-- Bootstrap -->
+    <link rel="stylesheet" href="{$Think.HOME_SITE_ROOT}/css/bootstrap.min.css">
+    <!-- Fancybox -->
+    <link rel="stylesheet" href="{$Think.HOME_SITE_ROOT}/css/jquery.fancybox.css">
+    <!-- owl carousel -->
+    <link rel="stylesheet" href="{$Think.HOME_SITE_ROOT}/css/owl.carousel.css">
+    <!-- Animate -->
+    <link rel="stylesheet" href="{$Think.HOME_SITE_ROOT}/css/animate.css">
+    <!-- Main Stylesheet -->
+    <link rel="stylesheet" href="{$Think.HOME_SITE_ROOT}/css/main.css">
+    <!-- Main Responsive -->
+    <link rel="stylesheet" href="{$Think.HOME_SITE_ROOT}/css/responsive.css">
+
+    <!-- Modernizer Script for old Browsers -->
+    <script src="{$Think.HOME_SITE_ROOT}/js/vendor/modernizr-2.6.2.min.js"></script>
+
+</head>
+
+<body>
+
+<!--
+Fixed Navigation
+==================================== -->
+<header id="navigation" class="navbar-fixed-top">
+    <div class="container">
+
+        <div class="navbar-header">
+            <!-- responsive nav button -->
+            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
+                <span class="sr-only">Toggle navigation</span>
+                <span class="icon-bar"></span>
+                <span class="icon-bar"></span>
+                <span class="icon-bar"></span>
+            </button>
+            <!-- /responsive nav button -->
+
+            <!-- logo -->
+            <!--<h1 class="navbar-brand">-->
+            <h1 class="">
+                <a href="#body">
+                    <img src="{$Think.HOME_SITE_ROOT}/images/logo.png" width="70%">
+                    <!--<div class="site-logo"><span>K</span>eeper</div>-->
+                </a>
+            </h1>
+            <!-- /logo -->
+
+        </div>
+
+        <!-- main nav -->
+        <nav class="collapse navigation navbar-collapse navbar-right" role="navigation">
+            <ul id="nav" class="nav navbar-nav">
+                {foreach name="navigation" item="value" key="key"}
+                    {if $value.navigation_enName === 'contact us'}
+                        <li><a href="/home/contactUs/index">{$value.navigation_zhName}</a></li>
+                    {elseif $value.navigation_enName === 'about us'}
+                        <li><a href="/home/aboutUs/index">{$value.navigation_zhName}</a></li>
+                    {elseif $value.navigation_enName === 'Index'}
+                        <li><a href="/home/index/index">{$value.navigation_zhName}</a></li>
+                    {else}
+                        <li><a href="#{$navigationId[$key]}">{$value.navigation_zhName}</a></li>
+                    {/if}
+                {/foreach}
+                <!--<li><a href="#service">Service</a></li>
+                <li><a href="#portfolio">portfolio</a></li>
+                <li><a href="#about">About</a></li>
+                <li><a href="#pricing">Pricing</a></li>
+                <li><a href="#contact">Contact</a></li>-->
+            </ul>
+        </nav>
+        <!-- /main nav -->
+    </div>
+
+</header>
+<!--
+End Fixed Navigation
+==================================== -->
+
+
+<!--
+Home Slider
+==================================== -->
+<section id="home">
+    <div class="container">
+        <!--<div class="container"style="background-color: rgba(50, 50, 50, 0.8); margin-top: -100px; width: 100%;">-->
+        <div class="home-intro">
+            <div class="animated bounceInRight" style="text-align: left">
+                <p style="font-size: 40px;">{$indexIntroduceArr[0]}</p>
+                <p style="font-size: 40px; text-decoration:underline; color: #4080fc">{$indexIntroduceArr[1]}</p>
+                <p>{$indexIntroduceArr[2]}</p>
+                <p>{$indexIntroduceArr[3]}</p>
+            </div>
+        </div>
+    </div>
+</section>
+<!--
+End #home Slider
+========================== -->
+
+
+<!--
+#service
+========================== -->
+<section id="{$navigationId[1]}">
+    <div class="container">
+        <div class="row">
+            <div class="col-md-12">
+                <div class="section-title text-center wow fadeInDown">
+                    <h1>{$navigation[1]->navigation_zhName}</h1>
+                    <h3>—&nbsp;&nbsp;&nbsp;{$navigation[1]->navigation_enName}&nbsp;&nbsp;&nbsp;—</h3>
+                </div>
+            </div>
+        </div>
+        <div class="row">
+
+            <div class="col-md-4 col-sm-6 wow fadeInLeft">
+                <div class="media service-item">
+                    <!--<a href="#" class="pull-left text-center">
+                        <div class="fact-icon">
+                            <i class="fa fa-cog fa-lg"></i>
+                        </div>
+                    </a>-->
+                    <div class="media-body" style="text-align: center">
+                        <h3><img src="{$Think.HOME_SITE_ROOT}/images/web.png"></h3>
+                        <h3>{$service[0]->product_title}</h3>
+                        <p style="text-align: left">{$service[0]->product_ctitle}</p>
+                    </div>
+                </div>
+            </div>
+
+            <div class="col-md-4 col-sm-6 wow fadeInLeft">
+                <div class="media service-item">
+                    <div class="media-body" style="text-align: center">
+                        <h3><img src="{$Think.HOME_SITE_ROOT}/images/smallProgram.png"></h3>
+                        <h3>{$service[1]->product_title}</h3>
+                        <p style="text-align: left">{$service[1]->product_ctitle}</p>
+                    </div>
+                </div>
+            </div>
+
+            <div class="col-md-4 col-sm-6 wow fadeInLeft">
+                <div class="media service-item">
+                    <div class="media-body" style="text-align: center">
+                        <h3><img src="{$Think.HOME_SITE_ROOT}/images/app.png"></h3>
+                        <h3>{$service[2]->product_title}</h3>
+                        <p style="text-align: left">{$service[2]->product_ctitle}</p>
+                    </div>
+                </div>
+            </div>
+
+            <div class="col-md-4 col-sm-6 wow fadeInLeft">
+                <div class="media service-item">
+                    <div class="media-body" style="text-align: center">
+                        <h3><img src="{$Think.HOME_SITE_ROOT}/images/system.png"></h3>
+                        <h3>{$service[3]->product_title}</h3>
+                        <p style="text-align: left">{$service[3]->product_ctitle}</p>
+                    </div>
+                </div>
+            </div>
+
+            <div class="col-md-4 col-sm-6 wow fadeInLeft">
+                <div class="media service-item">
+                    <div class="media-body" style="text-align: center">
+                        <h3><img src="{$Think.HOME_SITE_ROOT}/images/mobile.png"></h3>
+                        <h3>{$service[4]->product_title}</h3>
+                        <p style="text-align: left">{$service[4]->product_ctitle}</p>
+                    </div>
+                </div>
+            </div>
+
+            <div class="col-md-4 col-sm-6 wow fadeInLeft">
+                <div class="media service-item">
+                    <div class="media-body" style="text-align: center">
+                        <h3><img src="{$Think.HOME_SITE_ROOT}/images/market.png"></h3>
+                        <h3>{$service[5]->product_title}</h3>
+                        <p style="text-align: left">{$service[5]->product_ctitle}</p>
+                    </div>
+                </div>
+            </div>
+
+        </div> <!-- end .row -->
+    </div> <!-- end .container -->
+</section><div class="tlinks">Collect from <a href="http://www.cssmoban.com/" >自助建站</a></div>
+<!--
+End #service
+========================== -->
+
+<!--
+#service-bottom
+========================== -->
+
+<!--<section id="service-bottom">
+    <div class="container">
+        <div class="mobile-device">
+            <img data-wow-delay="0.2s" class="img-responsive black  wow fadeInLeftBig" src="img/iphone/iphone-black.png" alt="iPhone Black">
+            <img data-wow-delay="0.5s" class="img-responsive white  wow fadeInLeftBig" src="img/iphone/iphone-white.png" alt="iPhone White">
+        </div>
+        <div class="service-features wow fadeInRight">
+            <h3>Our Latest Services</h3>
+            <p>Curabitur arcu erat, accumsan iditea imperdiet et, porttitor at sem. Mauris blandit aliquet elit ciduntue.</p>
+            <ul>
+                <li><i class="fa fa-android"></i>Responsive Design</li>
+                <li><i class="fa fa-apple"></i>Modern And Clean Design</li>
+                <li><i class="fa fa-globe"></i>Browser Friendly</li>
+                <li><i class="fa fa-code"></i>Clean Code</li>
+            </ul>
+        </div>
+    </div>
+</section>-->
+<!--
+End #service-bottom
+========================== -->
+
+
+<!--
+#Portfolio
+========================== -->
+
+<!--<section id="portfolio">
+
+    <div class="section-title text-center wow fadeInDown">
+        <h2>Portfolio</h2>
+        <p>Aliquam condimen tum velit ut sapien dignissim, ut blandit neque fermentum. Suspendisse ante nunc, eleifend eget turpis sit amet, sodales porttitor felis.</p>
+    </div>
+
+    <nav class="project-filter clearfix text-center wow fadeInLeft"  data-wow-delay="0.5s">
+        <ul class="list-inline">
+            <li><a href="javascript:;" class="filter" data-filter="all">All</a></li>
+            <li><a href="javascript:;" class="filter" data-filter=".app">App</a></li>
+            <li><a href="javascript:;" class="filter" data-filter=".photography">Photography</a></li>
+            <li><a href="javascript:;" class="filter" data-filter=".web">Web</a></li>
+            <li><a href="javascript:;" class="filter" data-filter=".print">Print</a></li>
+        </ul>
+    </nav>
+
+    <div id="projects" class="clearfix">
+
+        <figure class="mix portfolio-item app">
+            <img class="img-responsive" src="img/portfolio/portfolio-1.jpg" alt="Portfolio Item">
+            <a href="img/portfolio/portfolio-1.jpg" title="Title One" rel="portfolio" class="fancybox"><span class="plus"></span></a>
+        </figure>
+
+        <figure class="mix portfolio-item photography">
+            <img class="img-responsive" src="img/portfolio/portfolio-2.jpg" alt="Portfolio Item">
+            <a href="img/portfolio/portfolio-2.jpg" title="Title Two" rel="portfolio" class="fancybox"><span class="plus"></span></a>
+        </figure>
+
+        <figure class="mix portfolio-item web">
+            <img class="img-responsive" src="img/portfolio/portfolio-3.jpg" alt="Portfolio Item">
+            <a href="img/portfolio/portfolio-3.jpg" title="Title Three" rel="portfolio" class="fancybox"><span class="plus"></span></a>
+        </figure>
+
+        <figure class="mix portfolio-item print">
+            <img class="img-responsive" src="img/portfolio/portfolio-4.jpg" alt="Portfolio Item">
+            <a href="img/portfolio/portfolio-4.jpg" title="Title Four" rel="portfolio" class="fancybox"><span class="plus"></span></a>
+        </figure>
+
+        <figure class="mix portfolio-item app">
+            <img class="img-responsive" src="img/portfolio/portfolio-4.jpg" alt="Portfolio Item">
+            <a href="img/portfolio/portfolio-4.jpg" title="Title Five" rel="portfolio" class="fancybox"><span class="plus"></span></a>
+        </figure>
+
+        <figure class="mix portfolio-item photography">
+            <img class="img-responsive" src="img/portfolio/portfolio-1.jpg" alt="Portfolio Item">
+            <a href="img/portfolio/portfolio-1.jpg" title="Title Six" rel="portfolio" class="fancybox"><span class="plus"></span></a>
+        </figure>
+
+        <figure class="mix portfolio-item web app">
+            <img class="img-responsive" src="img/portfolio/portfolio-2.jpg" alt="Portfolio Item">
+            <a href="img/portfolio/portfolio-2.jpg" title="Title Seven" rel="portfolio" class="fancybox"><span class="plus"></span></a>
+        </figure>
+
+        <figure class="mix portfolio-item print web">
+            <img class="img-responsive" src="img/portfolio/portfolio-3.jpg" alt="Portfolio Item">
+            <a href="img/portfolio/portfolio-3.jpg" title="Title Eight" rel="portfolio" class="fancybox"><span class="plus"></span></a>
+        </figure>
+
+    </div> &lt;!&ndash; end #projects &ndash;&gt;
+
+</section>-->
+<!--
+End #Portfolio
+========================== -->
+
+<!--
+#about
+========================== -->
+<!--<section id="about">
+    <div class="container">
+        <div class="row">
+
+            <div class="col-md-12">
+                <div class="section-title text-center wow fadeInUp">
+                    <h2>About Us</h2>
+                    <p>Aliquam condimen tum velit ut sapien dignissim, ut blandit neque fermentum. Suspendisse ante nunc, eleifend eget turpis sit amet, sodales porttitor felis.</p>
+                    <a class="btn btn-blue" role="button">Read More</a>
+                </div>
+            </div>
+            <div class="col-md-12 text-center">
+
+                <div class="about-us text-center wow fadeInDown">
+                    <img src="img/about.png" alt="About Us" class="img-responsive">
+                </div>
+            </div>
+
+        </div>
+    </div>
+</section>-->
+<!--
+End #about
+========================== -->
+
+
+<!--
+#count
+========================== -->
+
+<section id="count">
+    <div class="container">
+        <div class="row" style="color: #fff">
+
+            <div class="col-md-12" style="margin-bottom: 50px">
+                <div class="section-title text-center wow fadeInUp">
+                    <h1>{$navigation[2]->navigation_zhName}</h1>
+                    <h3>—&nbsp;&nbsp;&nbsp;{$navigation[2]->navigation_enName}&nbsp;&nbsp;&nbsp;—</h3>
+                </div>
+            </div>
+
+            <div class="col-md-5 col-sm-6 col-xs-12 wow fadeInLeft" data-wow-delay="0.5s">
+                <p style="font-size: 18px; padding-right: 120px">新零售，即企业以互联网为依托，通过运用大数
+                    据，人工智能等先进技术手段并运用心理学知
+                    识，对商品的生产，流通与销售过程进行升级
+                    改造，进而重塑业态结构与生态圈，并对线上
+                    服务，线下体验以及现代物流进行升读融合的
+                    临售模式。</p>
+            </div>
+
+            <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px; margin-right: 40px;" data-wow-delay="0.5s">
+                <!--<div class="fact-item text-center">
+                    <div class="count-icon">
+                        <i class="fa fa-android"></i>
+                    </div>
+                    <span data-to="120">0</span>
+                    <p>Completed Projects</p>
+                </div>-->
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/onlinMarket.png" style="margin-bottom: 20px;"></h3>
+                <h3>{$solution[0]->product_title}</h3>
+            </div>
+
+            <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px; margin-right: 40px;" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/storeManagement.png" style="margin-bottom: 20px;"></h3>
+                <h3>{$solution[1]->product_title}</h3>
+            </div>
+
+            <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px;" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/bargain.png" style="margin-bottom: 20px;"></h3>
+                <h3>{$solution[2]->product_title}</h3>
+            </div>
+
+            <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px; margin-right: 40px;" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/customerManagement.png" style="margin-bottom: 20px;"></h3>
+                <h3>{$solution[3]->product_title}</h3>
+            </div>
+
+            <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px;" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/Invoicing.png" style="margin-bottom: 20px;"></h3>
+                <h3>{$solution[4]->product_title}</h3>
+            </div>
+
+        </div>
+    </div>
+</section>
+<!--
+End #count
+========================== -->
+
+<!--
+#about-us
+========================== -->
+<section id="about-us">
+    <div class="container">
+        <div class="row">
+
+            <div class="col-md-12" style="margin-bottom: 50px">
+                <div class="section-title text-center wow fadeInUp">
+                    <h1>{$navigation[3]->navigation_zhName}</h1>
+                    <h3>—&nbsp;&nbsp;&nbsp;{$navigation[3]->navigation_enName}&nbsp;&nbsp;&nbsp;—</h3>
+                </div>
+            </div>
+
+            <div style="float: left">
+                <div class="col-md-5 col-md-offset-1 wow fadeInLeft">
+                    <img src="{$Think.HOME_SITE_ROOT}/images/custom.png">
+                </div> <!-- end .col-md-5 -->
+                <div class="col-md-5 col-md-offset-1 wow fadeInRight">
+                    <div class="subtitle">
+                        <h3>{$case[0]->product_title}</h3>
+                        <p>{$case[0]->product_ctitle}</p>
+                    </div>
+                </div>
+            </div>
+
+            <div style="float: left; margin-top: 50px">
+                <div class="col-md-5 col-md-offset-1 wow fadeInRight">
+                    <div class="subtitle">
+                        <h3>{$case[1]->product_title}</h3>
+                        <p>{$case[1]->product_ctitle}</p>
+                    </div>
+                </div>  <!-- end .col-md-5 -->
+                <div class="col-md-5 col-md-offset-1 wow fadeInLeft">
+                    <img src="{$Think.HOME_SITE_ROOT}/images/4444.png">
+                </div> <!-- end .col-md-5 -->
+            </div>
+
+            <div style="float: left; margin-top: 50px">
+                <div class="col-md-5 col-md-offset-1 wow fadeInLeft">
+                    <img src="{$Think.HOME_SITE_ROOT}/images/433433.png">
+                </div> <!-- end .col-md-5 -->
+                <div class="col-md-5 col-md-offset-1 wow fadeInRight">
+                    <div class="subtitle">
+                        <h3>{$case[2]->product_title}</h3>
+                        <p>{$case[2]->product_ctitle}</p>
+                    </div>
+                </div>
+            </div>
+
+        </div>
+    </div>
+</section>
+<!--
+End #about-us
+========================== -->
+
+
+<section id="service-bottom">
+    <div class="container"style="background-color: rgba(50, 50, 50, 0.8); margin-top: -100px; width: 100%;">
+        <div class="row" style="color: #fff">
+
+            <div class="col-md-12" style="margin-top: 100px;">
+                <div class="section-title text-center wow fadeInUp">
+                    <h1>{$navigationTitle[0]->navigation_zhName}</h1>
+                    <h3>—&nbsp;&nbsp;&nbsp;{$navigationTitle[0]->navigation_enName}&nbsp;&nbsp;&nbsp;—</h3>
+                </div>
+            </div>
+
+<div style="display: flex; justify-content: center; clear: both;">
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/demandDegotiation.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[0]->product_title}</h3>
+            </div>
+
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/productDesign.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[1]->product_title}</h3>
+            </div>
+
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/technology.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[2]->product_title}</h3>
+            </div>
+
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/systemTesting.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[3]->product_title}</h3>
+            </div>
+
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/updateBug.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[4]->product_title}</h3>
+            </div>
+
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/productLine.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[5]->product_title}</h3>
+            </div>
+
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/maintenance.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[6]->product_title}</h3>
+            </div>
+</div>
+
+        </div>
+    </div>
+</section>
+
+<!--
+#quotes
+========================== -->
+<section id="portfolio">
+    <div class="container">
+        <div class="row">
+            <div class="col-md-12">
+                <div class="section-title text-center wow fadeInDown">
+                    <h1>{$navigationTitle[1]->navigation_zhName}</h1>
+                    <h3>—&nbsp;&nbsp;&nbsp;{$navigationTitle[1]->navigation_enName}&nbsp;&nbsp;&nbsp;—</h3>
+                </div>
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/dohop.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/tincy.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/dohop2.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/cityDesign.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/cityDesign2.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/cityDesign3.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/tincy2.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/dohop3.png" width="280px">
+            </div>
+
+        </div>
+    </div>
+</section>
+<!--
+End #quotes
+========================== -->
+
+<!--
+#pricing
+========================== -->
+<!--<section id="pricing">
+    <div class="container">
+        <div class="row">
+
+            <div class="section-title text-center wow fadeInUp">
+                <h2>Pricing</h2>
+                <p>Aliquam condimen tum velit ut sapien dignissim, ut blandit neque fermentum. Suspendisse ante nunc, eleifend eget turpis sit amet, sodales porttitor felis.</p>
+            </div>
+
+            <div class="col-md-3 col-sm-6 col-xs-12 wow fadeInUp">
+                <div class="pricing-table text-center">
+                    <div class="plan-icon">
+                        <i class="fa fa-taxi"></i>
+                    </div>
+                    <div class="plan-title">
+                        <span class="plan">Basic</span>
+                    </div>
+                    <div class="price">
+                        <span class="value"><small>$</small><strong>19</strong>/MO</span>
+                    </div>
+                    <ul class="text-center">
+                        <li>condimen tum velit</li>
+                        <li>Aliquam condimen</li>
+                        <li>sapien dignissim</li>
+                        <li>Psapien dignis</li>
+                    </ul>
+                    <a href="#" class="btn btn-price">Buy Now</a>
+                </div>
+            </div>
+
+            <div class="col-md-3 col-sm-6 col-xs-12 wow fadeInUp" data-wow-delay="0.3s">
+                <div class="pricing-table text-center">
+                    <div class="plan-icon">
+                        <i class="fa fa-ambulance"></i>
+                    </div>
+                    <div class="plan-title">
+                        <span class="plan">Premium</span>
+                    </div>
+                    <div class="price">
+                        <span class="value"><small>$</small><strong>19</strong>/MO</span>
+                    </div>
+                    <ul class="text-center">
+                        <li>condimen tum velit</li>
+                        <li>Aliquam condimen</li>
+                        <li>sapien dignissim</li>
+                        <li>Psapien dignis</li>
+                    </ul>
+                    <a href="#" class="btn btn-price">Buy Now</a>
+                </div>
+            </div>
+
+            <div class="col-md-3 col-sm-6 col-xs-12 wow fadeInUp" data-wow-delay="0.6s">
+                <div class="pricing-table highlight text-center">
+                    <div class="plan-icon">
+                        <i class="fa fa-rocket"></i>
+                    </div>
+                    <div class="plan-title">
+                        <span class="plan">Pro</span>
+                    </div>
+                    <div class="price">
+                        <span class="value"><small>$</small><strong>19</strong>/MO</span>
+                    </div>
+                    <ul class="text-center">
+                        <li>condimen tum velit</li>
+                        <li>Aliquam condimen</li>
+                        <li>sapien dignissim</li>
+                        <li>Psapien dignis</li>
+                    </ul>
+                    <a href="#" class="btn btn-price">Buy Now</a>
+                </div>
+            </div>
+
+            <div class="col-md-3 col-sm-6 col-xs-12 wow fadeInUp" data-wow-delay="0.9s">
+                <div class="pricing-table text-center">
+                    <div class="plan-icon">
+                        <i class="fa fa-plane"></i>
+                    </div>
+                    <div class="plan-title">
+                        <span class="plan">Platinum</span>
+                    </div>
+                    <div class="price">
+                        <span class="value"><small>$</small><strong>19</strong>/MO</span>
+                    </div>
+                    <ul class="text-center">
+                        <li>condimen tum velit</li>
+                        <li>Aliquam condimen</li>
+                        <li>sapien dignissim</li>
+                        <li>Psapien dignis</li>
+                    </ul>
+                    <a href="#" class="btn btn-price">Buy Now</a>
+                </div>
+            </div>
+        </div>
+        <div class="row">
+            <div class="col-md-12 wow fadeInUp">
+                <div class="special-plan text-center">
+                    <p>Contact us if you have special request</p>
+                    <a href="#" class="btn btn-blue">Contact Us</a>
+                </div>
+            </div>
+        </div>
+    </div>
+</section>
+&lt;!&ndash;
+End #pricing
+========================== &ndash;&gt;
+
+
+&lt;!&ndash;
+#subscribe
+========================== &ndash;&gt;
+<section id="subscribe">
+    <div class="container">
+        <div class="row">
+
+            <div class="col-md-4 col-sm-5 col-xs-12 text-left wow fadeInRight">
+                <div class="subscribe-man"><img class="img-responsive" src="img/young-men.png" /></div>
+            </div>
+            <div class="col-md-7 col-sm-7 col-xs-12 wow fadeInLeft">
+                <form action="#" method="post" class="subscription-form">
+                    <i class="fa fa-envelope-o fa-lg"></i>
+                    <input type="email" name="subscribe" class="subscribe" placeholder="YOUR MAIL">
+                    <input type="submit" value="SUBSCRIBE" id="mail-submit">
+                </form>
+            </div>
+
+        </div>
+    </div>
+</section>-->
+<!--
+End #subscribe
+========================== -->
+
+<!--
+#contact
+========================== -->
+<section id="contact">
+    <div class="container">
+        <div class="row">
+
+            <div class="col-md-12">
+                <div class="section-title text-center wow fadeInUp">
+                    <h1>{$navigationTitle[2]->navigation_zhName}</h1>
+                    <h3>—&nbsp;&nbsp;&nbsp;{$navigationTitle[2]->navigation_enName}&nbsp;&nbsp;&nbsp;—</h3>
+                </div>
+            </div>
+
+            <div class="contact-form clearfix">
+                <div class="text-center">
+                    <div class="col-md-6 col-sm-12 wow fadeInLeft">
+                        <div class="input-field">
+                            <input id="inputName" type="text" class="form-control" name="name" placeholder="您的称呼" required="">
+                        </div>
+                        <div class="input-field">
+                            <input id="inputEmail" type="text" class="form-control" name="email" placeholder="您的邮箱" required="">
+                        </div>
+                        <div class="input-field">
+                            <input id="inputPhone" type="text" class="form-control" name="phone" placeholder="您的电话" required="">
+                        </div>
+                    </div>
+                    <div class="col-md-6 col-sm-12 wow fadeInLeft input-field message">
+                        <textarea id="inputContent" name="content" class="form-control" placeholder="把您的需求填写在这里......" style="height: 225px;" required></textarea>
+                    </div>
+                    <input type="submit" onclick="userNeeds()" class="btn btn-blue" value="提交" id="msg-submit">
+                </div>
+            </div>
+
+            <!--<div class="col-md-8 col-md-offset-2 wow fadeInLeft">
+                <div class="contact-form clearfix">
+                    <form class="text-center" action="index.html" method="post">
+                        <div class="input-field">
+                            <input type="text" class="form-control" name="name" placeholder="Your Name" required="">
+                        </div>
+                        <div class="input-field">
+                            <input type="email" class="form-control" name="email" placeholder="Your Email" required="">
+                        </div>
+                        <div class="input-field message">
+                            <textarea name="message" class="form-control" placeholder="Your Message" required></textarea>
+                        </div>
+                        <input type="submit" class="btn btn-blue" value="SEND MESSAGE" id="msg-submit">
+                    </form>
+                </div> &lt;!&ndash; end .contact-form &ndash;&gt;
+            </div>--> <!-- .col-md-8 -->
+
+        </div>
+    </div>
+</section>
+<!--
+End #contact
+========================== -->
+
+<!--
+#footer
+========================== -->
+<footer id="footer" class="text-center">
+    <div class="container" style="margin-top: -70px; color: #fff;">
+        <div class="row">
+            <div class="col-md-3 col-sm-12">
+                <div class="footer-social wow fadeInUp">
+                    <h4 style="text-align: left;">联系我们</h4>
+                    <ul class="text-center list-inline">
+                        <li>
+                            <a href="#" class="pull-left text-center" style="margin-right: 10px">
+                                <img src="{$Think.HOME_SITE_ROOT}/images/fax.png">
+                            </a>
+                            <div class="media-body">
+                                <p>{$foot[2]->remark}：{$foot[2]->value}</p>
+                            </div>
+                        </li>
+                        <li>
+                            <a href="#" class="pull-left text-center" style="margin-right: 10px">
+                                <img src="{$Think.HOME_SITE_ROOT}/images/email.png">
+                            </a>
+                            <div class="media-body">
+                                <p>{$foot[1]->remark}：{$foot[1]->value}</p>
+                            </div>
+                        </li>
+                        <li>
+                            <a href="#" class="pull-left text-center" style="margin-right: 10px">
+                                <img src="{$Think.HOME_SITE_ROOT}/images/phone.png">
+                            </a>
+                            <div class="media-body">
+                                <p>{$foot[0]->remark}：{$foot[0]->value}</p>
+                            </div>
+                        </li>
+                    </ul>
+
+                </div>
+            </div>
+            <div class="col-md-3 col-sm-12">
+                <div class="footer-social wow fadeInUp">
+                    <h4 style="text-align: left;">站点导航</h4>
+                    <ul class="text-center list-inline">
+                        {foreach name="navigation" item="value" key="key"}
+                            {if $key !== 0}
+                                <li style="width: 45%;">
+                                    <div class="media-body">
+                                        <a href="#{$navigationId[$key]}" style="color: #fff">{$value.navigation_zhName}</a>
+                                    </div>
+                                </li>
+                            {/if}
+                        {/foreach}
+                    </ul>
+
+                </div>
+            </div>
+            <div class="col-md-4 col-sm-12" style="margin-left: 100px">
+                <div class="footer-social wow fadeInUp" style="float: left">
+                    <h4>关注微信</h4>
+                    <div style="margin-top: 20px;">
+                        <img src="{$Think.HOME_SITE_ROOT}/images/code.png">
+                    </div>
+                </div>
+                <div class="footer-social wow fadeInUp" style="float: left; margin-left: 80px">
+                    <h4>关注微博</h4>
+                    <div style="margin-top: 20px;">
+                        <img src="{$Think.HOME_SITE_ROOT}/images/code.png">
+                    </div>
+                </div>
+            </div>
+            <!--<div class="col-lg-12">
+                <div class="footer-social wow fadeInUp">
+                    <h3><span>K</span>eeper</h3>
+                    <ul class="text-center list-inline">
+                        <li>
+                            <div class="fact-icon">
+                                <i class="fa fa-facebook fa-lg"></i>
+                            </div>
+                        </li>
+                        <li>
+                            <div class="fact-icon">
+                                <i class="fa fa-twitter fa-lg"></i>
+                            </div>
+                        </li>
+                        <li>
+                            <div class="fact-icon">
+                                <i class="fa fa-google-plus fa-lg"></i>
+                            </div>
+                        </li>
+                    </ul>
+                </div>
+
+                <div class="copyright">
+
+                    <p>Theme by Scripteden. Developed by Shaifuddin / More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></p>
+                </div>
+
+            </div>-->
+        </div>
+    </div>
+</footer>
+<!--
+End #footer
+========================== -->
+
+
+<!--
+JavaScripts
+========================== -->
+
+<!-- main jQuery -->
+<script src="{$Think.HOME_SITE_ROOT}/js/vendor/jquery-1.11.1.min.js"></script>
+<!-- Bootstrap -->
+<script src="{$Think.HOME_SITE_ROOT}/js/bootstrap.min.js"></script>
+<!-- jquery.nav -->
+<script src="{$Think.HOME_SITE_ROOT}/js/jquery.nav.js"></script>
+<!-- Portfolio Filtering -->
+<script src="{$Think.HOME_SITE_ROOT}/js/jquery.mixitup.min.js"></script>
+<!-- Fancybox -->
+<script src="{$Think.HOME_SITE_ROOT}/js/jquery.fancybox.pack.js"></script>
+<!-- Parallax sections -->
+<script src="{$Think.HOME_SITE_ROOT}/js/jquery.parallax-1.1.3.js"></script>
+<!-- jQuery Appear -->
+<script src="{$Think.HOME_SITE_ROOT}/js/jquery.appear.js"></script>
+<!-- countTo -->
+<script src="{$Think.HOME_SITE_ROOT}/js/jquery-countTo.js"></script>
+<!-- owl carousel -->
+<script src="{$Think.HOME_SITE_ROOT}/js/owl.carousel.min.js"></script>
+<!-- WOW script -->
+<script src="{$Think.HOME_SITE_ROOT}/js/wow.min.js"></script>
+<!-- theme custom scripts -->
+<script src="{$Think.HOME_SITE_ROOT}/js/main.js"></script>
+<script>
+    const locationHost = window.location.host;
+    function userNeeds() {
+        let inputName = $(" #inputName").val();
+        let inputEmail = $(" #inputEmail").val();
+        let inputPhone = $(" #inputPhone").val();
+        let inputContent = $(" #inputContent").val();
+        if (inputName && inputEmail && inputPhone && inputContent) {
+            $.ajax({
+                type: "post",
+                url: '/home/index/userNeeds',
+                data: {name: inputName, email: inputEmail, phone: inputPhone, content: inputContent},
+                xhrFields: {
+                    withCredentials: true
+                },
+                dataType: "json",
+                success: function (msg) {
+                    let backMsg = JSON.parse(msg);
+                    if (backMsg && backMsg.success) {
+                        alert('发送成功');
+                    } else {
+                        alert('请求失败');
+                    }
+                },
+                error: function () {
+                    alert('请求失败');
+                }
+            });
+        }
+    }
+</script>
+</body>
+</html>

application/home/view/index/index.html

@@ -12,6 +12,7 @@
     <meta name="keywords" content="one page, business template, single page, onepage, responsive, parallax, creative, business, html5, css3, css3 animation">
     <!-- meta character set -->
     <meta charset="utf-8">
+    <link rel="SHORTCUT ICON" href="{$Think.HOME_SITE_ROOT}/images/title.png"/>
 
     <!-- Site Title -->
     <title>AQM官网</title>
@@ -79,7 +80,13 @@ Fixed Navigation
         <nav class="collapse navigation navbar-collapse navbar-right" role="navigation">
             <ul id="nav" class="nav navbar-nav">
                 {foreach name="navigation" item="value" key="key"}
-                    <li><a href="#{$navigationId[$key]}">{$value.navigation_zhName}</a></li>
+                    {if $value.navigation_enName === 'contact us'}
+                        <li><a href="/home/contact/index">{$value.navigation_zhName}</a></li>
+                    {elseif $value.navigation_enName === 'about us'}
+                        <li><a href="/home/about/index">{$value.navigation_zhName}</a></li>
+                    {else}
+                        <li><a href="#{$navigationId[$key]}">{$value.navigation_zhName}</a></li>
+                    {/if}
                 {/foreach}
                 <!--<li><a href="#service">Service</a></li>
                 <li><a href="#portfolio">portfolio</a></li>
@@ -102,10 +109,13 @@ Home Slider
 ==================================== -->
 <section id="home">
     <div class="container">
+        <!--<div class="container"style="background-color: rgba(50, 50, 50, 0.8); margin-top: -100px; width: 100%;">-->
         <div class="home-intro">
             <div class="animated bounceInRight" style="text-align: left">
-                <h2>HELLO Keeper <br>WE ARE KASPER,WE MAKE ART.</h2>
-                <p>Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Curabitur aliquet quam. Accumsan id imperdiet et, porttitor at sem. Mauris blandit aliquet elit, eget tincidunt accumsan id imperdiet.</p>
+                <p style="font-size: 40px;">{$indexIntroduceArr[0]}</p>
+                <p style="font-size: 40px; text-decoration:underline; color: #4080fc">{$indexIntroduceArr[1]}</p>
+                <p>{$indexIntroduceArr[2]}</p>
+                <p>{$indexIntroduceArr[3]}</p>
             </div>
         </div>
     </div>
@@ -139,8 +149,8 @@ End #home Slider
                     </a>-->
                     <div class="media-body" style="text-align: center">
                         <h3><img src="{$Think.HOME_SITE_ROOT}/images/web.png"></h3>
-                        <h3>Google web fonts</h3>
-                        <p style="text-align: left">Curabitur arcu erat, accumsan iditea imperdiet et, porttitor at sem. Mauris blandit aliquet elit ciduntue.</p>
+                        <h3>{$service[0]->product_title}</h3>
+                        <p style="text-align: left">{$service[0]->product_ctitle}</p>
                     </div>
                 </div>
             </div>
@@ -149,8 +159,8 @@ End #home Slider
                 <div class="media service-item">
                     <div class="media-body" style="text-align: center">
                         <h3><img src="{$Think.HOME_SITE_ROOT}/images/smallProgram.png"></h3>
-                        <h3>Google web fonts</h3>
-                        <p style="text-align: left">Curabitur arcu erat, accumsan iditea imperdiet et, porttitor at sem. Mauris blandit aliquet elit ciduntue.</p>
+                        <h3>{$service[1]->product_title}</h3>
+                        <p style="text-align: left">{$service[1]->product_ctitle}</p>
                     </div>
                 </div>
             </div>
@@ -159,8 +169,8 @@ End #home Slider
                 <div class="media service-item">
                     <div class="media-body" style="text-align: center">
                         <h3><img src="{$Think.HOME_SITE_ROOT}/images/app.png"></h3>
-                        <h3>Google web fonts</h3>
-                        <p style="text-align: left">Curabitur arcu erat, accumsan iditea imperdiet et, porttitor at sem. Mauris blandit aliquet elit ciduntue.</p>
+                        <h3>{$service[2]->product_title}</h3>
+                        <p style="text-align: left">{$service[2]->product_ctitle}</p>
                     </div>
                 </div>
             </div>
@@ -169,8 +179,8 @@ End #home Slider
                 <div class="media service-item">
                     <div class="media-body" style="text-align: center">
                         <h3><img src="{$Think.HOME_SITE_ROOT}/images/system.png"></h3>
-                        <h3>Google web fonts</h3>
-                        <p style="text-align: left">Curabitur arcu erat, accumsan iditea imperdiet et, porttitor at sem. Mauris blandit aliquet elit ciduntue.</p>
+                        <h3>{$service[3]->product_title}</h3>
+                        <p style="text-align: left">{$service[3]->product_ctitle}</p>
                     </div>
                 </div>
             </div>
@@ -179,8 +189,8 @@ End #home Slider
                 <div class="media service-item">
                     <div class="media-body" style="text-align: center">
                         <h3><img src="{$Think.HOME_SITE_ROOT}/images/mobile.png"></h3>
-                        <h3>Google web fonts</h3>
-                        <p style="text-align: left">Curabitur arcu erat, accumsan iditea imperdiet et, porttitor at sem. Mauris blandit aliquet elit ciduntue.</p>
+                        <h3>{$service[4]->product_title}</h3>
+                        <p style="text-align: left">{$service[4]->product_ctitle}</p>
                     </div>
                 </div>
             </div>
@@ -189,8 +199,8 @@ End #home Slider
                 <div class="media service-item">
                     <div class="media-body" style="text-align: center">
                         <h3><img src="{$Think.HOME_SITE_ROOT}/images/market.png"></h3>
-                        <h3>Google web fonts</h3>
-                        <p style="text-align: left">Curabitur arcu erat, accumsan iditea imperdiet et, porttitor at sem. Mauris blandit aliquet elit ciduntue.</p>
+                        <h3>{$service[5]->product_title}</h3>
+                        <p style="text-align: left">{$service[5]->product_ctitle}</p>
                     </div>
                 </div>
             </div>
@@ -344,9 +354,12 @@ End #about
             </div>
 
             <div class="col-md-5 col-sm-6 col-xs-12 wow fadeInLeft" data-wow-delay="0.5s">
-                <p style="font-size: 18px; padding-right: 120px">反反复复付付付付付付付付付付付付反反复复付付付付付付反反复复付付付付付付付付付付付付
-                    付付付付付付反反复复付付付付付付付付付付付付反反复复付付付付付付反反复复付付付付付付付付付付付付
-                    反反复复付付付付付付付付付付付付付付付付付付</p>
+                <p style="font-size: 18px; padding-right: 120px">新零售，即企业以互联网为依托，通过运用大数
+                    据，人工智能等先进技术手段并运用心理学知
+                    识，对商品的生产，流通与销售过程进行升级
+                    改造，进而重塑业态结构与生态圈，并对线上
+                    服务，线下体验以及现代物流进行升读融合的
+                    临售模式。</p>
             </div>
 
             <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px; margin-right: 40px;" data-wow-delay="0.5s">
@@ -358,55 +371,27 @@ End #about
                     <p>Completed Projects</p>
                 </div>-->
                 <h3><img src="{$Think.HOME_SITE_ROOT}/images/onlinMarket.png" style="margin-bottom: 20px;"></h3>
-                <h3>Google</h3>
+                <h3>{$solution[0]->product_title}</h3>
             </div>
 
             <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px; margin-right: 40px;" data-wow-delay="0.5s">
-                <!--<div class="fact-item text-center">
-                    <div class="count-icon">
-                        <i class="fa fa-android"></i>
-                    </div>
-                    <span data-to="120">0</span>
-                    <p>Completed Projects</p>
-                </div>-->
                 <h3><img src="{$Think.HOME_SITE_ROOT}/images/storeManagement.png" style="margin-bottom: 20px;"></h3>
-                <h3>Google</h3>
+                <h3>{$solution[1]->product_title}</h3>
             </div>
 
             <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px;" data-wow-delay="0.5s">
-                <!--<div class="fact-item text-center">
-                    <div class="count-icon">
-                        <i class="fa fa-android"></i>
-                    </div>
-                    <span data-to="120">0</span>
-                    <p>Completed Projects</p>
-                </div>-->
                 <h3><img src="{$Think.HOME_SITE_ROOT}/images/bargain.png" style="margin-bottom: 20px;"></h3>
-                <h3>Google</h3>
+                <h3>{$solution[2]->product_title}</h3>
             </div>
 
             <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px; margin-right: 40px;" data-wow-delay="0.5s">
-                <!--<div class="fact-item text-center">
-                    <div class="count-icon">
-                        <i class="fa fa-android"></i>
-                    </div>
-                    <span data-to="120">0</span>
-                    <p>Completed Projects</p>
-                </div>-->
                 <h3><img src="{$Think.HOME_SITE_ROOT}/images/customerManagement.png" style="margin-bottom: 20px;"></h3>
-                <h3>Google</h3>
+                <h3>{$solution[3]->product_title}</h3>
             </div>
 
             <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px;" data-wow-delay="0.5s">
-                <!--<div class="fact-item text-center">
-                    <div class="count-icon">
-                        <i class="fa fa-android"></i>
-                    </div>
-                    <span data-to="120">0</span>
-                    <p>Completed Projects</p>
-                </div>-->
                 <h3><img src="{$Think.HOME_SITE_ROOT}/images/Invoicing.png" style="margin-bottom: 20px;"></h3>
-                <h3>Google</h3>
+                <h3>{$solution[4]->product_title}</h3>
             </div>
 
         </div>
@@ -436,11 +421,8 @@ End #count
                 </div> <!-- end .col-md-5 -->
                 <div class="col-md-5 col-md-offset-1 wow fadeInRight">
                     <div class="subtitle">
-                        <h3>OUR SKILLS</h3>
-                        <p>Aliquam condimen tum velit ut sapien dignissim, ut blandit neque fermentum. Suspendisse ante
-                            nunc eifend eget turp.</p>
-                        <p>Aliquam condimen tum velit ut sapien dignissim, ut blandit neque fermentum. Suspendisse ante
-                            nunc eifend eget turp.</p>
+                        <h3>{$case[0]->product_title}</h3>
+                        <p>{$case[0]->product_ctitle}</p>
                     </div>
                 </div>
             </div>
@@ -448,11 +430,8 @@ End #count
             <div style="float: left; margin-top: 50px">
                 <div class="col-md-5 col-md-offset-1 wow fadeInRight">
                     <div class="subtitle">
-                        <h3>OUR SKILLS</h3>
-                        <p>Aliquam condimen tum velit ut sapien dignissim, ut blandit neque fermentum. Suspendisse ante
-                            nunc eifend eget turp.</p>
-                        <p>Aliquam condimen tum velit ut sapien dignissim, ut blandit neque fermentum. Suspendisse ante
-                            nunc eifend eget turp.</p>
+                        <h3>{$case[1]->product_title}</h3>
+                        <p>{$case[1]->product_ctitle}</p>
                     </div>
                 </div>  <!-- end .col-md-5 -->
                 <div class="col-md-5 col-md-offset-1 wow fadeInLeft">
@@ -466,11 +445,8 @@ End #count
                 </div> <!-- end .col-md-5 -->
                 <div class="col-md-5 col-md-offset-1 wow fadeInRight">
                     <div class="subtitle">
-                        <h3>OUR SKILLS</h3>
-                        <p>Aliquam condimen tum velit ut sapien dignissim, ut blandit neque fermentum. Suspendisse ante
-                            nunc eifend eget turp.</p>
-                        <p>Aliquam condimen tum velit ut sapien dignissim, ut blandit neque fermentum. Suspendisse ante
-                            nunc eifend eget turp.</p>
+                        <h3>{$case[2]->product_title}</h3>
+                        <p>{$case[2]->product_ctitle}</p>
                     </div>
                 </div>
             </div>
@@ -494,31 +470,43 @@ End #about-us
                 </div>
             </div>
 
-            <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px; margin-right: 40px;" data-wow-delay="0.5s">
-                <h3><img src="{$Think.HOME_SITE_ROOT}/images/demandDegotiation.png" style="margin-bottom: 20px;"></h3>
-                <h3>Google</h3>
+<div style="display: flex; justify-content: center; clear: both;">
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/demandDegotiation.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[0]->product_title}</h3>
             </div>
 
-            <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px; margin-right: 40px;" data-wow-delay="0.5s">
-                <h3><img src="{$Think.HOME_SITE_ROOT}/images/productDesign.png" style="margin-bottom: 20px;"></h3>
-                <h3>Google</h3>
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/productDesign.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[1]->product_title}</h3>
             </div>
 
-            <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px;" data-wow-delay="0.5s">
-                <h3><img src="{$Think.HOME_SITE_ROOT}/images/bargain.png" style="margin-bottom: 20px;"></h3>
-                <h3>Google</h3>
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/technology.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[2]->product_title}</h3>
             </div>
 
-            <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px; margin-right: 40px;" data-wow-delay="0.5s">
-                <h3><img src="{$Think.HOME_SITE_ROOT}/images/customerManagement.png" style="margin-bottom: 20px;"></h3>
-                <h3>Google</h3>
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/systemTesting.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[3]->product_title}</h3>
             </div>
 
-            <div class="col-md-2 col-sm-6 col-xs-12 wow fadeInLeft" style="text-align: center; margin-bottom: 40px;" data-wow-delay="0.5s">
-                <h3><img src="{$Think.HOME_SITE_ROOT}/images/Invoicing.png" style="margin-bottom: 20px;"></h3>
-                <h3>Google</h3>
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/updateBug.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[4]->product_title}</h3>
+            </div>
+
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/productLine.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[5]->product_title}</h3>
             </div>
 
+            <div class="col-md-1 col-sm-6 col-xs-12 wow fadeInLeft cooperation_fade" data-wow-delay="0.5s">
+                <h3><img src="{$Think.HOME_SITE_ROOT}/images/maintenance.png" class="cooperation_h3"></h3>
+                <h3>{$cooperationProcess[6]->product_title}</h3>
+            </div>
+</div>
+
         </div>
     </div>
 </section>
@@ -526,16 +514,48 @@ End #about-us
 <!--
 #quotes
 ========================== -->
-<section id="quotes">
+<section id="portfolio">
     <div class="container">
-        <div class="row wow zoomIn">
-            <div class="col-lg-12">
-                <div class="call-to-action text-center">
-                    <div class="twitter"><i class="fa fa-twitter"></i></div>
-                    <p>“ACCUMSAN ID CURABITUR ET PORTITOR MAURIS BLANDIT DOLOR LOREM SOME EST OUR DONEC STIN LORTIOS”</p>
-                    <span>Albart Windy, ThemeForest</span>
+        <div class="row">
+            <div class="col-md-12">
+                <div class="section-title text-center wow fadeInDown">
+                    <h1>{$navigationTitle[1]->navigation_zhName}</h1>
+                    <h3>—&nbsp;&nbsp;&nbsp;{$navigationTitle[1]->navigation_enName}&nbsp;&nbsp;&nbsp;—</h3>
                 </div>
             </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/dohop.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/tincy.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/dohop2.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/cityDesign.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/cityDesign2.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/cityDesign3.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/tincy2.png" width="280px">
+            </div>
+
+            <div class="col-md-3 col-sm-6 wow fadeInLeft">
+                <img src="{$Think.HOME_SITE_ROOT}/images/dohop3.png" width="280px">
+            </div>
+
         </div>
     </div>
 </section>
@@ -546,7 +566,7 @@ End #quotes
 <!--
 #pricing
 ========================== -->
-<section id="pricing">
+<!--<section id="pricing">
     <div class="container">
         <div class="row">
 
@@ -649,14 +669,14 @@ End #quotes
         </div>
     </div>
 </section>
-<!--
+&lt;!&ndash;
 End #pricing
-========================== -->
+========================== &ndash;&gt;
 
 
-<!--
+&lt;!&ndash;
 #subscribe
-========================== -->
+========================== &ndash;&gt;
 <section id="subscribe">
     <div class="container">
         <div class="row">
@@ -674,7 +694,7 @@ End #pricing
 
         </div>
     </div>
-</section>
+</section>-->
 <!--
 End #subscribe
 ========================== -->
@@ -686,12 +706,34 @@ End #subscribe
     <div class="container">
         <div class="row">
 
-            <div class="section-title text-center wow fadeInDown">
-                <h2>Contact Us</h2>
-                <p>Aliquam condimen tum velit ut sapien dignissim, ut blandit neque fermentum. Suspendisse ante nunc, eleifend eget turpis sit amet, sodales porttitor felis.</p>
+            <div class="col-md-12">
+                <div class="section-title text-center wow fadeInUp">
+                    <h1>{$navigationTitle[2]->navigation_zhName}</h1>
+                    <h3>—&nbsp;&nbsp;&nbsp;{$navigationTitle[2]->navigation_enName}&nbsp;&nbsp;&nbsp;—</h3>
+                </div>
+            </div>
+
+            <div class="contact-form clearfix">
+                <div class="text-center">
+                    <div class="col-md-6 col-sm-12 wow fadeInLeft">
+                        <div class="input-field">
+                            <input id="inputName" type="text" class="form-control" name="name" placeholder="您的称呼" required="">
+                        </div>
+                        <div class="input-field">
+                            <input id="inputEmail" type="text" class="form-control" name="email" placeholder="您的邮箱" required="">
+                        </div>
+                        <div class="input-field">
+                            <input id="inputPhone" type="text" class="form-control" name="phone" placeholder="您的电话" required="">
+                        </div>
+                    </div>
+                    <div class="col-md-6 col-sm-12 wow fadeInLeft input-field message">
+                        <textarea id="inputContent" name="content" class="form-control" placeholder="把您的需求填写在这里......" style="height: 225px;" required></textarea>
+                    </div>
+                    <input type="submit" onclick="userNeeds()" class="btn btn-blue" value="提交" id="msg-submit">
+                </div>
             </div>
 
-            <div class="col-md-8 col-md-offset-2 wow fadeInLeft">
+            <!--<div class="col-md-8 col-md-offset-2 wow fadeInLeft">
                 <div class="contact-form clearfix">
                     <form class="text-center" action="index.html" method="post">
                         <div class="input-field">
@@ -705,8 +747,8 @@ End #subscribe
                         </div>
                         <input type="submit" class="btn btn-blue" value="SEND MESSAGE" id="msg-submit">
                     </form>
-                </div> <!-- end .contact-form -->
-            </div> <!-- .col-md-8 -->
+                </div> &lt;!&ndash; end .contact-form &ndash;&gt;
+            </div>--> <!-- .col-md-8 -->
 
         </div>
     </div>
@@ -719,10 +761,72 @@ End #contact
 #footer
 ========================== -->
 <footer id="footer" class="text-center">
-    <div class="container">
+    <div class="container" style="margin-top: -70px; color: #fff;">
         <div class="row">
-            <div class="col-lg-12">
+            <div class="col-md-3 col-sm-12">
+                <div class="footer-social wow fadeInUp">
+                    <h4 style="text-align: left;">联系我们</h4>
+                    <ul class="text-center list-inline">
+                        <li>
+                            <a href="#" class="pull-left text-center" style="margin-right: 10px">
+                                <img src="{$Think.HOME_SITE_ROOT}/images/fax.png">
+                            </a>
+                            <div class="media-body">
+                                <p>{$foot[2]->remark}：{$foot[2]->value}</p>
+                            </div>
+                        </li>
+                        <li>
+                            <a href="#" class="pull-left text-center" style="margin-right: 10px">
+                                <img src="{$Think.HOME_SITE_ROOT}/images/email.png">
+                            </a>
+                            <div class="media-body">
+                                <p>{$foot[1]->remark}：{$foot[1]->value}</p>
+                            </div>
+                        </li>
+                        <li>
+                            <a href="#" class="pull-left text-center" style="margin-right: 10px">
+                                <img src="{$Think.HOME_SITE_ROOT}/images/phone.png">
+                            </a>
+                            <div class="media-body">
+                                <p>{$foot[0]->remark}：{$foot[0]->value}</p>
+                            </div>
+                        </li>
+                    </ul>
 
+                </div>
+            </div>
+            <div class="col-md-3 col-sm-12">
+                <div class="footer-social wow fadeInUp">
+                    <h4 style="text-align: left;">站点导航</h4>
+                    <ul class="text-center list-inline">
+                        {foreach name="navigation" item="value" key="key"}
+                            {if $key !== 0}
+                                <li style="width: 45%;">
+                                    <div class="media-body">
+                                        <a href="#{$navigationId[$key]}" style="color: #fff">{$value.navigation_zhName}</a>
+                                    </div>
+                                </li>
+                            {/if}
+                        {/foreach}
+                    </ul>
+
+                </div>
+            </div>
+            <div class="col-md-4 col-sm-12" style="margin-left: 100px">
+                <div class="footer-social wow fadeInUp" style="float: left">
+                    <h4>关注微信</h4>
+                    <div style="margin-top: 20px;">
+                        <img src="{$Think.HOME_SITE_ROOT}/images/code.png">
+                    </div>
+                </div>
+                <div class="footer-social wow fadeInUp" style="float: left; margin-left: 80px">
+                    <h4>关注微博</h4>
+                    <div style="margin-top: 20px;">
+                        <img src="{$Think.HOME_SITE_ROOT}/images/code.png">
+                    </div>
+                </div>
+            </div>
+            <!--<div class="col-lg-12">
                 <div class="footer-social wow fadeInUp">
                     <h3><span>K</span>eeper</h3>
                     <ul class="text-center list-inline">
@@ -749,7 +853,7 @@ End #contact
                     <p>Theme by Scripteden. Developed by Shaifuddin / More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></p>
                 </div>
 
-            </div>
+            </div>-->
         </div>
     </div>
 </footer>
@@ -784,5 +888,36 @@ JavaScripts
 <script src="{$Think.HOME_SITE_ROOT}/js/wow.min.js"></script>
 <!-- theme custom scripts -->
 <script src="{$Think.HOME_SITE_ROOT}/js/main.js"></script>
+<script>
+    const locationHost = window.location.host;
+    function userNeeds() {
+        let inputName = $(" #inputName").val();
+        let inputEmail = $(" #inputEmail").val();
+        let inputPhone = $(" #inputPhone").val();
+        let inputContent = $(" #inputContent").val();
+        if (inputName && inputEmail && inputPhone && inputContent) {
+            $.ajax({
+                type: "post",
+                url: '/home/index/userNeeds',
+                data: {name: inputName, email: inputEmail, phone: inputPhone, content: inputContent},
+                xhrFields: {
+                    withCredentials: true
+                },
+                dataType: "json",
+                success: function (msg) {
+                    let backMsg = JSON.parse(msg);
+                    if (backMsg && backMsg.success) {
+                        alert('发送成功');
+                    } else {
+                        alert('请求失败');
+                    }
+                },
+                error: function () {
+                    alert('请求失败');
+                }
+            });
+        }
+    }
+</script>
 </body>
 </html>

public/static/home/css/main.css

@@ -1041,7 +1041,7 @@ body > section {
 ============================================================*/
 
 #footer {
-    background-color: #121116;
+    background: url('../images/footer.png') scroll no-repeat center bottom / cover;
     padding: 115px 0 35px;
 }
 
@@ -1138,3 +1138,28 @@ body > section {
 .copyright p:first-child {
     margin-bottom: 15px;
 }
+
+.footer-social h4 {
+    text-align: left;
+}
+
+.list-inline {
+    margin-top: 20px;
+}
+
+.list-inline li {
+    float: left;
+}
+
+.cooperation_fade {
+    text-align: center;
+    margin-bottom: 40px;
+    margin-right: 60px;
+}
+
+.cooperation_h3 {
+    margin-bottom: 20px;
+    width: 102px;
+    height: 117px;
+}
+