<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>产品与解决方案_<?php echo e($data['title']); ?></title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="Keywords" content="智能科技,<?php echo e($data['keywords']); ?>">
  <meta name="Description" content="无人机领域先行者。<?php echo e($data['description']); ?>">
  <link rel="stylesheet" href="css/main.css"/>
</head>
<body>

<div class="header">
  <div class="HeaderTop">
    <div class="cmain">
      <div class="lf">欢迎登录科技官方网站！</div>
      <div class="HeaderTel">全国免费咨询服务热线：<em>010-1234 5678</em></div>
    </div>
  </div>
  <div class="HeaderBot">
    <div class="cmain">
      <div class="logo"><a href="index.html"><img src="images/logo.png" alt=""/></a></div>
      <div class="search">
        <div class="SearchBtn"></div>
        <div class="SliderForm SliderActive">
          <form>
            <div class="SearchLabel">
              <label>
                <input type="text" name="SearchName" class="SearchName" placeholder="请输入要搜索的内容"/>
              </label>
            </div>
          </form>
        </div>
      </div>
      <div class="HeaderList">
        <ul>
          <li>
            <a href="index.html">
              <span class="span1">首页</span>
              <span class="span2">HOME</span>
              <i class="med"></i>
            </a>
          </li>
          <li>
            <a href="about.html">
              <span class="span1">关于我们</span>
              <span class="span2">ABOUT US</span>
              <i class="med"></i>
            </a>
          </li>
          <li class="active">
            <a href="prodcuts.html">
              <span class="span1">产品与解决方案</span>
              <span class="span2">PRODUCTS&SOLUTION</span>
              <i class="med"></i>
            </a>
          </li>
          <li>
            <a href="service.html">
              <span class="span1">应用服务</span>
              <span class="span2">APPLICATION SERVICE</span>
              <i class="med"></i>
            </a>
          </li>
          <li>
            <a href="tome.html">
              <span class="span1">联系我们</span>
              <span class="span2">CONTACT</span>
              <i class="med"></i>
            </a>
          </li>
        </ul>
      </div>
    </div>
  </div>
</div>
<div class="main">
  <div class="NeiBanner" style="background-image: url('images/ban2.jpg')"></div>
  <div class="NeiNav">
    <div class="cmain">
      <ul class="lf">
        <li class="sp3">
          <a href="##">
            <span class="span3">Mavic Pro 铂金版</span>
          </a>
        </li>
        <li class="active">
          <a href="##" class="AMM">
            <span class="span1">产品介绍</span>
            <span class="span2">DESCRIPTION</span>
          </a>
        </li>
        <li>
          <a href="##" class="APP">
            <span class="span1">应用</span>
            <span class="span2">APPLICATION</span>
          </a>
        </li>
      </ul>
      <div class="ToProcuts">
        <a href="prodcuts.html">
          <em class="em1">返回列表</em>
          <em class="em2">RETURN</em>
        </a>
      </div>
      <ul class="rt">
        <li>
          <a href="##">
            <span class="span1">技术参数</span>
            <span class="span2">TECHNICAL DATA</span>
          </a>
        </li>
        <li>
          <a href="##">
            <span class="span1">常见问题</span>
            <span class="span2">Q&A</span>
          </a>
        </li>
      </ul>
    </div>
  </div>
  <div class="cmain">
    <div class="ProcutDetail">
      <div class="PDNav">
        <i></i>
        <span>产品详情</span>
      </div>
      <div class="PDThreeImg">
        <img src="images/pro2.jpg" alt="" width="294" height="294"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <img src="images/pro2.jpg" alt="" width="294" height="294"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <img src="images/pro2.jpg" alt="" width="294" height="294"/>
      </div>
      <div class="PDNeiDetail">
        <span>
          为严苛环境而生 <br/>
          Mavic Pro 铂金版严苛环境而生，无论在风雨、尘土还是高温严寒中都能稳定工作。 <br/>
          自加热双电池系统可适应低至-20°C的低温；抗雨抗水的机身设计让你在恶劣的工作环境下也能应对自如，游刃有余。 <br/>
          控制距离：7公里 <br/>
          最长飞行时间：38分钟 <br/>
          级别防护：IP43 <br/>
          最大载重：2公斤
        </span>
        <br/>
        <br/>
        <span>
          随时起飞 <br/>
          安装和准备工作轻松简单，只需展开飞行器机臂，装上相机、脚架和螺旋桨，无需调试即可起飞。机身和配件都可使用标配的包装箱运输和储存，携带和飞行前准备更加便捷
          <br/>
          机身尺寸及重量<br/>
          716mm220mm236mm     3.80kg
        </span>
      </div>
    </div>
  </div>
  <div class="AppMain">
    <div class="cmain">
      <div class="PDNav">
        <i></i>
        <span>产品应用</span>
      </div>
      <ul>
        <li>
          <a href="##">
            <img src="images/pro3.jpg" alt=""/>
            <i>消防领域</i>
            <div class="ProMed">
              <div class="ProMedCon">
                <div class="s1">消防领域</div>
                <div class="hen"></div>
                <div class="s2">迅速掌握火场全局形势，不受烟雾等环境限制，全天候工作。</div>
              </div>
            </div>
          </a>
        </li>
        <li>
          <a href="##">
            <img src="images/pro3.jpg" alt=""/>
            <i>消防领域</i>
            <div class="ProMed">
              <div class="ProMedCon">
                <div class="s1">消防领域</div>
                <div class="hen"></div>
                <div class="s2">迅速掌握火场全局形势，不受烟雾等环境限制，全天候工作。</div>
              </div>
            </div>
          </a>
        </li>
        <li style="margin-right: 0">
          <a href="##">
            <img src="images/pro3.jpg" alt=""/>
            <i>消防领域</i>
            <div class="ProMed">
              <div class="ProMedCon">
                <div class="s1">消防领域</div>
                <div class="hen"></div>
                <div class="s2">迅速掌握火场全局形势，不受烟雾等环境限制，全天候工作。</div>
              </div>
            </div>
          </a>
        </li>
        <li>
          <a href="##">
            <img src="images/pro3.jpg" alt=""/>
            <i>消防领域</i>
            <div class="ProMed">
              <div class="ProMedCon">
                <div class="s1">消防领域</div>
                <div class="hen"></div>
                <div class="s2">迅速掌握火场全局形势，不受烟雾等环境限制，全天候工作。</div>
              </div>
            </div>
          </a>
        </li>
        <li>
          <a href="##">
            <img src="images/pro3.jpg" alt=""/>
            <i>消防领域</i>
            <div class="ProMed">
              <div class="ProMedCon">
                <div class="s1">消防领域</div>
                <div class="hen"></div>
                <div class="s2">迅速掌握火场全局形势，不受烟雾等环境限制，全天候工作。</div>
              </div>
            </div>
          </a>
        </li>
        <li style="margin-right: 0">
          <a href="##">
            <img src="images/pro3.jpg" alt=""/>
            <i>消防领域</i>
            <div class="ProMed">
              <div class="ProMedCon">
                <div class="s1">消防领域</div>
                <div class="hen"></div>
                <div class="s2">迅速掌握火场全局形势，不受烟雾等环境限制，全天候工作。</div>
              </div>
            </div>
          </a>
        </li>
      </ul>
    </div>
  </div>
</div>
<div class="footer">
  <div class="FooterTop">
    <div class="cmain">
      <ul>
        <li class="active"><a href="##">产品与解决方案 </a></li>
        <li><a href="##">消费应用产品</a></li>
        <li><a href="##">商业应用产品</a></li>
        <li><a href="##">工业应用产品</a></li>
      </ul>
      <ul>
        <li class="active"><a href="##">应用服务</a></li>
        <li><a href="##">消费应用服务</a></li>
        <li><a href="##">商业应用服务</a></li>
        <li><a href="##">工业应用服务</a></li>
      </ul>
      <ul>
        <li class="active"><a href="##">关于我们</a></li>
        <li><a href="##">企业介绍</a></li>
        <li><a href="##">执业资质</a></li>
        <li><a href="##">公司新闻</a></li>
      </ul>
      <ul class="ImgList">
        <li class="active"><a href="##">联系我们</a></li>
        <li class="item">
          <a class="m1" href="##"></a>
          <a class="m2" href="##"></a>
        </li>
        <li class="item">
          <a class="m3" href="##"></a>
          <a class="m4" href="##"></a>
        </li>
      </ul>
      <ul>
        <li class="active">杭州智能科技有限公司</li>
        <li class="hen"></li>
        <li>地址：合肥市长江西路松枝万象城A座1421室</li>
        <li>电话：0551-1234 5678  邮箱：888888888@88.com</li>
      </ul>
      <div class="LinkItem">
        <div class="txt1"><em>友情链接 / </em> LINKS</div>
        <div class="txt2"><span class="hen"></span></div>
        <div class="txt3">
          <div class="LinkMain">点击选择下拉链接</div>
          <div class="LinkMList">
            <ul>
              <li><a href="##">111111</a></li>
              <li><a href="##">222222</a></li>
              <li><a href="##">333333</a></li>
              <li><a href="##">555555</a></li>
              <li><a href="##">666666</a></li>
              <li><a href="##">777777</a></li>
            </ul>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="FooterBot">
    <div class="cmain">
      <?php if($data['open_foot'] == 1): ?>
        <span style="display: inline !important;">Copyright ©<?php echo e($data['banquan']); ?></span> |
        <span style="display: inline !important;">备案号:<?php echo e($data['beian']); ?></span> |
        <span style="display: inline !important">友情链接:
          <?php foreach($data['lianjie_name'] as $key => $vo): ?>
            <a style="display: inline !important; color:#000;marhin-rignt:10px;"
               href="<?php echo e(is_or($data['lianjie'],$key)); ?>"><?php echo e($vo); ?></a>
          <?php endforeach; ?>
                </span>
      <?php else: ?>
        <div class="lf">Copyright © 2017  杭州科技有限公司 版权所有</div>
        <div class="rt">更多模板：<a href="http://www.mycodes.net/" target="_blank">源码之家</a></div>
      <?php endif; ?>
    </div>
  </div>

</div>
<script src="js/jquery-1.12.4.js"></script>
<script src="js/jquery.easing.js"></script>
<script src="js/jquery.SuperSlide.2.1.1.js"></script>
<script src="js/main.js"></script>
<?php if($data['open_bd'] == 1): ?>
  <script>
      let bd_image = "<?php echo e($data['bd_image']); ?>",
          bd_link = "<?php echo e($data['bd_link']); ?>";
  </script>
  <script src="/static/js/bd.js"></script>
<?php endif; ?>
<style>
  .nico {
    position: fixed;
    top: 10px;
    right: 0;
    bottom: 0;
    z-index: 10000;
    width: 400px;
    height: 500px;
    border: 0;
    background-color: #fff;
    box-shadow: 0 0 0 4px lightseagreen
  }

  .nico * {
    padding: 0;
    margin: 0;
  }

  .news_wrap {
    position: relative;
    height: 500px;
  }

  .news_wrap li {
    position: relative;
    padding-left: 10px;
    list-style-type: none;
    display: block;
    width: 380px;
    height: 40px;
    line-height: 40px;
    border-bottom: 1px solid grey
  }

  .news_wrap li > span {
    display: block;
    width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    height: 100%;
    line-height: 40px;
  }

  .news_wrap li > i {
    position: absolute;
    width: 80px;
    font-size: .5rem;
    top: 0;
    right: 0;
  }

  .page-btn {
    position: absolute;
    width: 100%;
    height: 70px;
    bottom: 0;
  }

  .page-btn li {
    font-size: .8rem;
    padding: 0 !important;
    margin-left: 2px;
    list-style-type: none;
    display: inline-block;
    width: 15px;
    height: 15px;
    line-height: 15px;
    text-align: center;
    border: 1px solid grey;
    cursor: pointer;
  }

  .clicked {
    background-color: #0c5460;
    color: #fff;
  }
</style>
<div class="nico">
  <div class="news_wrap">
    <ul>
      <?php foreach($data['list'][0] as $vo): ?>
        <li style="border-bottom: 1px solid #ccc;">
                <span><a style="text-decoration: none;color:#000" href="detail/<?php echo e(pathinfo($vo,PATHINFO_BASENAME)); ?>"
                         target="_blank"><?php echo e($data['titles'][rtrim(pathinfo($vo,PATHINFO_BASENAME),'.html')]); ?></a></span>
          <i><?php echo e(Date('Y/m/d',strtotime($data['times'][rtrim(pathinfo($vo,PATHINFO_BASENAME),'.html')]))); ?></i>
        </li>
      <?php endforeach; ?>
    </ul>
    <div class="page-btn">
      <ul>
        <?php foreach($data['list'] as $key => $vo): ?>
          <li class="pg-li <?php echo e($key ?'':'clicked'); ?>"><?php echo e($key + 1); ?></li>
        <?php endforeach; ?>
      </ul>
    </div>
  </div>
</div>
<script>
    let list = JSON.parse("<?php echo e(json_encode($data['list'])); ?>".replace(/&quot;/g, '"')),
        titles = JSON.parse("<?php echo e(json_encode($data['titles'])); ?>".replace(/&quot;/g, '"')),
        times = JSON.parse("<?php echo e(json_encode($data['times'])); ?>".replace(/&quot;/g, '"'));
    $('.pg-li').click(function () {
        $(this).addClass('clicked').siblings().removeClass('clicked');
        let p = ($(this).text() - 1) | 0,
            data = list[p];
        $('.news_wrap > ul').html(function () {
            let html = '';
            $(data).each(function (x, y) {
                let id = y.match(/(\d+)\.html/)[1],
                    time = times[id].split(' ')[0].replace('-', '/');
                html += '<li style="border-bottom: 1px solid #ccc;"><span><a style="text-decoration: none;color:#000" href="detail/' + id + '.html" target="_blank">' + titles[id] + '</a></span> <i>' + time + '</i></li>';
            });
            return html;
        });
    });
</script>
</body>
</html>