宽带保养的达标弹窗和提交时完成情况加入，和一些2期页面

2019/ah-hsx/biz/css/base-wk.css

@@ -756,19 +756,19 @@
    font-weight: 600;
}
.pages-step-three  .finish-list{
.pages-step-three  .finish-list,.pages-step-four  .finish-list{
    margin: 0.19rem .36rem
}
.pages-step-three  .finish-list-num{
.pages-step-three  .finish-list-num,.pages-step-four  .finish-list-num{
    width:.32rem;height: .32rem;border-radius: .16rem;background-color: #F6F6F7;text-align: center;line-height: .32rem
}
.pages-step-three  .finish-list-value{
.pages-step-three  .finish-list-value,.pages-step-four  .finish-list-value{
    margin-left: .21rem;color: #42505C;font-size: .14rem;line-height: .32rem;
}
.pages-step-three  .finish-true-pic{
.pages-step-three  .finish-true-pic,.pages-step-four  .finish-true-pic{
    background-image: url('../img/true-logo.png');background-repeat: no-repeat;background-size:100% 100%;width:.32rem;height: .32rem;
}
@@ -1117,4 +1117,32 @@
.pages-reserve .finish-condition-states,.pages-reserve .un-transact{
    width: 4rem;
}
.kd-new-install .step-2to3{
    left: 39.5%;
}
.kd-new-install .step-3to4{
    left: 67.5%;
}
.kd-new-install .new-install-step{
    width: .7rem;
}
.pages-step-four .finish-list-content{
    margin-bottom: .1rem;
    padding-bottom: .1rem;
}
.pages-step-two .reach-msg{
    height: 3.2rem;
}
.pages-step-two .reach-msg-item{
    text-align: left
}
.pages-step-two .reach-msg-item-key{
    color: #007AFF;
}

2019/ah-hsx/biz/js/kd-new-install.js

@@ -0,0 +1,262 @@
require(['jquery', 'ipuUI',], function ($, ipuUI) {
  $(function () {
    // 顶部消息框默认隐藏
    $(".inform-message").hide();
    // 消息数组
    var count = 0;
    var infoArray = [{text: '您有一条他人转单信息！'}, {text: '您有一条转单失败信息！'}, {text: '您的转单已被人接收。'}];
    if (infoArray.length > 0) {
      $(".inform-message").show();
      setInterval(function(){messagePlay(infoArray)}, 3000);
    }else{
      $(".inform-message").hide();
    }
    $(".inform-message .check-btn").bind("click", function(){
        console.log("跳转到查看消息");
    });
    $(".inform-message .close-btn").bind("click", function(){
      $(".inform-message").hide();
    });
    // 轮播消息函数
    function messagePlay(infoArray) {
      if (count > infoArray.length - 1) {
        count = 0;
      }
      for (var i = 0; i < infoArray.length; i++) {
        if (count == i) {
          $(".message-content span:eq(1)").text(infoArray[i].text);
          break;
        }
      }
      console.log($(".message-content span:eq(1)").text());
      count++;
    }
    var tab = ipuUI.tab(".ipu-tab");
    $(".ipu-fn-right").click(function () {
      if ($(this).attr("isSwitch") == "true") {
        $('.pop-shadow').show();
        $('.pop').show();
      } else {
        $(this).attr("isSwitch", "true");
        $(this).find(".other-order-switch").css("background-image", "url('./biz/img/switch-on.png')");
      }
    });
    $(".pop-button").click(function () {
      $('.pop-shadow').hide();
      $('.pop').hide();
      $(".ipu-fn-right").attr("isSwitch", "false");
      $(".ipu-fn-right").find(".other-order-switch").css("background-image", "url('./biz/img/switch-off.png')");
    });
    $(".pop-close").click(function () {
      $('.pop-shadow').hide();
      $('.pop').hide();
    });
    $(".mission-list").on("click",".mission-gy",function () {
      location.href = "change-order.html";
    });
    all();
    order();
    finish();
    function all() {
      var totalPage = 3;  // 总页数
      var nowPage = 1;    // 当前显示第几页，因为默认有一些数据了，所以为1
      var listObj = $("#refresh ul");
      var contentHtml = $("li:lt(5)", listObj).clone(); // 测试用，复制5条数据
      // 移除初始的数据，并初始nowPage=0;
      listObj.empty();
      nowPage = 0;
      var countNo = 0; // 重要计数器,以此来判断不需要
      // 初始化下拉刷新
      var myRefresh = ipuUI.refresh("#refresh", {
        bottomLoadFun: function () { // 加载更多
          console.log('加载更多'); // 手势上拉，内容下滚动动
          addData();
        },
        topLoadFun: function () { // 刷新
          console.log('刷新数据'); // 手势下拉，内容上滚动
          refreshData();
        }
      });
      // 查询数据
      function addData(refresh) {// 0搜索，1刷新，2加载更多
        $('#refresh .no-result-msg').hide();
        nowPage++;
        var localCountNo = ++countNo;  // 执行查询前，保留当前计数器，当查询返回时进行检查是否最新查询，不是则抛弃查询结果
        setTimeout(function () { // 模拟延时加载
          if (localCountNo == countNo) { // 检查是否最新查询返回数据，不是则抛弃查询结果
            // 此处先更新togalPage等信息
            myRefresh.enableTop(totalPage != 0); // 假设totalPage为0时表示没数据，此时停用刷新功能，也可不停用，强行刷新
            myRefresh.enableBottom(nowPage < totalPage); // enable应该总是先于endBottom/TopLoading方法执行
            if (totalPage == 0) {
              $('#refresh .no-result-msg').show();
            } else {
              if (refresh) {                    // 顶部刷新，刷新也可能已经没有数据了，待处理
                listObj.empty(); // 清空已有内容
                contentHtml.clone().appendTo(listObj);
                myRefresh.endTopLoading(); //最后调用
              } else {  // 底部加载更多,或查询
                contentHtml.clone().appendTo(listObj);
                myRefresh.endBottomLoading();  //最后调用
              }
            }
          }
        }, 3000);
      }
      // 刷新
      function refreshData() {   // 刷新数据
        nowPage = 0; // 底部加载时，停用底部加载功能和底部加载
        myRefresh.enableBottom(false);
        if (myRefresh.bottomLoading) {
          myRefresh.endBottomLoading();
        }
        addData(true);
      }
    }
    function order() {
      var totalPage = 3;  // 总页数
      var nowPage = 1;    // 当前显示第几页，因为默认有一些数据了，所以为1
      var listObj = $("#order-refresh ul");
      var contentHtml = $("li:lt(4)", listObj).clone(); // 测试用，复制5条数据
      // 移除初始的数据，并初始nowPage=0;
      listObj.empty();
      nowPage = 0;
      var countNo = 0; // 重要计数器,以此来判断不需要
      // 初始化下拉刷新
      var myRefresh = ipuUI.refresh("#order-refresh", {
        bottomLoadFun: function () { // 加载更多
          console.log('加载更多'); // 手势上拉，内容下滚动动
          addData();
        },
        topLoadFun: function () { // 刷新
          console.log('刷新数据'); // 手势下拉，内容上滚动
          refreshData();
        }
      });
      // 查询数据
      function addData(refresh) {// 0搜索，1刷新，2加载更多
        $('#order-refresh .no-result-msg').hide();
        nowPage++;
        var localCountNo = ++countNo;  // 执行查询前，保留当前计数器，当查询返回时进行检查是否最新查询，不是则抛弃查询结果
        setTimeout(function () { // 模拟延时加载
          if (localCountNo == countNo) { // 检查是否最新查询返回数据，不是则抛弃查询结果
            // 此处先更新togalPage等信息
            myRefresh.enableTop(totalPage != 0); // 假设totalPage为0时表示没数据，此时停用刷新功能，也可不停用，强行刷新
            myRefresh.enableBottom(nowPage < totalPage); // enable应该总是先于endBottom/TopLoading方法执行
            if (totalPage == 0) {
              $('#order-refresh .no-result-msg').show();
            } else {
              if (refresh) {                    // 顶部刷新，刷新也可能已经没有数据了，待处理
                listObj.empty(); // 清空已有内容
                contentHtml.clone().appendTo(listObj);
                myRefresh.endTopLoading(); //最后调用
              } else {  // 底部加载更多,或查询
                contentHtml.clone().appendTo(listObj);
                myRefresh.endBottomLoading();  //最后调用
              }
            }
          }
        }, 3000);
      }
      // 刷新
      function refreshData() {   // 刷新数据
        nowPage = 0; // 底部加载时，停用底部加载功能和底部加载
        myRefresh.enableBottom(false);
        if (myRefresh.bottomLoading) {
          myRefresh.endBottomLoading();
        }
        addData(true);
      }
    }
    function finish() {
      var totalPage = 3;  // 总页数
      var nowPage = 1;    // 当前显示第几页，因为默认有一些数据了，所以为1
      var listObj = $("#finish-refresh ul");
      var contentHtml = $("li:lt(4)", listObj).clone(); // 测试用，复制5条数据
      // 移除初始的数据，并初始nowPage=0;
      listObj.empty();
      nowPage = 0;
      var countNo = 0; // 重要计数器,以此来判断不需要
      // 初始化下拉刷新
      var myRefresh = ipuUI.refresh("#finish-refresh", {
        bottomLoadFun: function () { // 加载更多
          console.log('加载更多'); // 手势上拉，内容下滚动动
          addData();
        },
        topLoadFun: function () { // 刷新
          console.log('刷新数据'); // 手势下拉，内容上滚动
          refreshData();
        }
      });
      // 查询数据
      function addData(refresh) {// 0搜索，1刷新，2加载更多
        $('#finish-refresh .no-result-msg').hide();
        nowPage++;
        var localCountNo = ++countNo;  // 执行查询前，保留当前计数器，当查询返回时进行检查是否最新查询，不是则抛弃查询结果
        setTimeout(function () { // 模拟延时加载
          if (localCountNo == countNo) { // 检查是否最新查询返回数据，不是则抛弃查询结果
            // 此处先更新togalPage等信息
            myRefresh.enableTop(totalPage != 0); // 假设totalPage为0时表示没数据，此时停用刷新功能，也可不停用，强行刷新
            myRefresh.enableBottom(nowPage < totalPage); // enable应该总是先于endBottom/TopLoading方法执行
            if (totalPage == 0) {
              $('#finish-refresh .no-result-msg').show();
            } else {
              if (refresh) {                    // 顶部刷新，刷新也可能已经没有数据了，待处理
                listObj.empty(); // 清空已有内容
                contentHtml.clone().appendTo(listObj);
                myRefresh.endTopLoading(); //最后调用
              } else {  // 底部加载更多,或查询
                contentHtml.clone().appendTo(listObj);
                myRefresh.endBottomLoading();  //最后调用
              }
            }
          }
        }, 3000);
      }
      // 刷新
      function refreshData() {   // 刷新数据
        nowPage = 0; // 底部加载时，停用底部加载功能和底部加载
        myRefresh.enableBottom(false);
        if (myRefresh.bottomLoading) {
          myRefresh.endBottomLoading();
        }
        addData(true);
      }
    }
  });
});

2019/ah-hsx/biz/js/step-two.js

@@ -102,9 +102,14 @@ require(['jquery', 'ipuUI',], function ($, ipuUI) {
    // 点击办理按钮
    $(".business-handling").click(function () {
      $('.pop-shadow').show();
      $('.pop').show();
      $('.business-msg').show();
    });
    $(".reach-item").click(function(){
      $('.pop-shadow').show();
      $('.reach-msg').show();
    })
    $(".pop-button").click(function () {
      $('.pop-shadow').hide();
      $('.pop').hide();

2019/ah-hsx/kd-new-install.html

@@ -0,0 +1,574 @@
<!DOCTYPE html>
<html lang="en">
<head>
  <title>任务大厅-宽带新装</title>
  <meta charset="utf-8">
  <!-- 宽度自动适配 -->
  <meta name="viewport"
        content="width=device-width, initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0, user-scalable=no"/>
  <!-- 不识别页面上的数字为可拨打号码 -->
  <meta content="telephone=no" name="format-detection"/>
  <link rel="stylesheet" type="text/css" href="ipu/ui/css/ipuUI.css">
  <link rel="stylesheet" type="text/css" href="biz/css/base.css">
  <script src="ipu/lib/requirejs/require.min.js"></script>
  <script src="biz/js/require-config.js"></script>
  <script src="biz/js/kd-new-install.js"></script>
</head>
<body class="pages-mission">
<div class="ipu-flex-row ipu-flex-vertical">
  <div class="ipu-flex-col">
    <div class="ipu-toolbar">
      <a class="ipu-fn-left link-back ipu-flex ipu-flex-align-center" href="javascript:history.back(-1);">
        <div class="left-back"></div>
      </a>
      <h1 class="ipu-toolbar-title">宽带新装
        <!--<img src="./biz/img/jiantou.png"/>-->
      </h1>
      <!--<div class="ipu-fn-right ipu-flex ipu-flex-align-center" isSwitch="true">-->
        <!--<div class="ipu-flex ipu-flex-align-center">-->
          <!--<div class="other-order-title">额外接单</div>-->
          <!--<div class="other-order-switch"></div>-->
        <!--</div>-->
      <!--</div>-->
    </div>
  </div>
  <!--顶部消息框-->
  <div class="ipu-flex ipu-flex-align-center inform-message">
    <div class="ipu-flex-col notice-pic"></div>
    <div class="ipu-flex-col-auto message-content"><span>通知：</span><span>您有一条他人转单信息！</span></div>
    <div class="ipu-flex-col check-btn">查看</div>
    <div class="ipu-flex-col close-btn"></div>
  </div>
  <div class="ipu-flex-col ipu-flex-col-auto">
    <div class="ipu-tab">  <!-- 如果class中添加 ipu-tab-fixed，则可固定头部，此时需要父元素的高度是确定的 -->
      <ul class="ipu-tab-title ipu-tab-title-link"> <!-- 页头有 ipu-tab-title-link 和 ipu-tab-title-button两种样式 -->
        <li class="ipu-current">全部</li>
        <li class="ipu-flex ipu-flex-justify-center">
          <div>已预约</div>
          <div class="mission-circle">
            <div class="mission-type-number">6</div>
          </div>
        </li>  <!-- class为ipu-current为默认选中项 -->
        <li>已完成</li>
      </ul>
      <div class="ipu-tab-body">
        <ul class="ipu-tab-body-wrapper">
          <li>
            <div class="page-content">
              <div class="ipu-list ipu-list-media ipu-flex-content" id="refresh" style="margin-top: .46rem">
                <!-- 组件html结构，最外层div应有一个固定的高度，会在此元素上初始化iScroll -->
                <div class="ipu-refresh-wrapper">
                  <!-- 此处组件初始化后，会添加上拉html -->
                  <div class="refresh-content">
                    <div>
                      <ul class="mission-list">
                        <li class="">
                          <div class="mission-container">
                            <div class="ipu-flex mission-list-title">
                              <div class="mission-kdxz"></div>
                              <div class="ipu-flex ipu-flex-col-auto mission-order-number">
                                <div>订单编号：</div>
                                <div>201906267689</div>
                              </div>
                            </div>
                            <div class="mission-content-min-height">
                              <div class="ipu-flex mission-content">
                                <div class="mission-male-person mission-person-margin"></div>
                                <div class="ipu-flex-col-auto">
                                  <div class="ipu-flex  ipu-flex-justify-space">
                                    <div class="mission-person-name">李海涛</div>
                                    <div class="mission-state">待上门</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">装机地址：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">安徽省合肥市蜀山区长江西路125号</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">最近上门：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">6月9日 15:30-16:30</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">一年内上门次数：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">2</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">预约失败原因：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">客户表示不需要</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">备注：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">无</div>
                                  </div>
                                </div>
                              </div>
                              <!--<div class="mission-sell">-->
                                <!--<div class="ipu-flex ipu-flex-align-center">-->
                                  <!--<div class="mission-sheji"></div>-->
                                  <!--<div class="mission-sell-title">上门话术</div>-->
                                <!--</div>-->
                                <!--<div class="mission-sell-content">-->
                                  <!--<span class="mission-sell-tag">宽带保养-宽带到期：</span>-->
                                  <!--您的宽带下个月即将到期，为不影响使用，建议尽快续费。为了方便您办理，我可以在您方便的时候上门服务…-->
                                <!--</div>-->
                              <!--</div>-->
                            </div>
                            <div class="ipu-flex ipu-flex-justify-end mission-list-bottom">
                              <div class="mission-qxyy">取消预约</div>
                              <div class="mission-gy">改约</div>
                              <div class="mission-zd">转单</div>
                              <div class="mission-yy">上门</div>
                            </div>
                          </div>
                        </li>
                        <li class="">
                          <div class="mission-container">
                            <div class="ipu-flex mission-list-title">
                              <div class="mission-kdxz"></div>
                              <div class="ipu-flex ipu-flex-col-auto mission-order-number">
                                <div>订单编号：</div>
                                <div>201906267689</div>
                              </div>
                            </div>
                            <div class="ipu-flex mission-content">
                              <div class="mission-male-person mission-person-margin"></div>
                              <div class="ipu-flex-col-auto">
                                <div class="ipu-flex  ipu-flex-justify-space">
                                  <div class="mission-person-name">王心怡</div>
                                  <div class="mission-finish"></div>
                                </div>
                                <div class="ipu-flex">
                                  <div class="ipu-flex-col mission-content-tag">完成时间：</div>
                                  <div class="ipu-flex-col-auto mission-content-value">6月9日 15:30-16:30</div>
                                </div>
                                <div class="ipu-flex">
                                  <div class="ipu-flex-col mission-content-tag">装机地址：</div>
                                  <div class="ipu-flex-col-auto mission-content-value">安徽省合肥市庐阳区金海世纪花园4栋2304</div>
                                </div>
                                <div class="ipu-flex">
                                  <div class="ipu-flex-col mission-content-tag">随销结果：</div>
                                  <div class="ipu-flex-col-auto mission-content-value">随销成功</div>
                                </div>
                                <div class="ipu-flex">
                                  <div class="ipu-flex-col mission-content-tag">随销产品：</div>
                                  <div class="ipu-flex-col-auto mission-content-value">全球通任我用个人版128元</div>
                                </div>
                              </div>
                            </div>
                            <div class="ipu-flex ipu-flex-justify-end mission-list-bottom">
                              <div class="mission-yy">上门</div>
                            </div>
                          </div>
                        </li>
                        <li class="">
                          <div class="mission-container">
                            <div class="ipu-flex mission-list-title">
                              <div class="mission-kdxz"></div>
                              <div class="ipu-flex ipu-flex-col-auto mission-order-number">
                                <div>订单编号：</div>
                                <div>201906267689</div>
                              </div>
                            </div>
                            <div class="mission-content-min-height">
                              <div class="ipu-flex mission-content">
                                <div class="mission-male-person mission-person-margin"></div>
                                <div class="ipu-flex-col-auto">
                                  <div class="ipu-flex  ipu-flex-justify-space">
                                    <div class="mission-person-name">李海涛</div>
                                    <div class="mission-state">待上门</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">装机地址：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">安徽省合肥市蜀山区长江西路125号</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">最近上门：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">6月9日 15:30-16:30</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">一年内上门次数：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">2</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">预约失败原因：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">客户表示不需要</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">备注：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">无</div>
                                  </div>
                                </div>
                              </div>
                              <!--<div class="mission-sell">-->
                              <!--<div class="ipu-flex ipu-flex-align-center">-->
                              <!--<div class="mission-sheji"></div>-->
                              <!--<div class="mission-sell-title">上门话术</div>-->
                              <!--</div>-->
                              <!--<div class="mission-sell-content">-->
                              <!--<span class="mission-sell-tag">宽带保养-宽带到期：</span>-->
                              <!--您的宽带下个月即将到期，为不影响使用，建议尽快续费。为了方便您办理，我可以在您方便的时候上门服务…-->
                              <!--</div>-->
                              <!--</div>-->
                            </div>
                            <div class="ipu-flex ipu-flex-justify-end mission-list-bottom">
                              <div class="mission-qxyy">取消预约</div>
                              <div class="mission-gy">改约</div>
                              <div class="mission-zd">转单</div>
                              <div class="mission-yy">上门</div>
                            </div>
                          </div>
                        </li>
                      </ul>
                    </div>
                    <div class="no-result-msg ipu-fn-p ipu-txt-center">
                      暂无记录
                    </div>
                  </div>
                  <!-- 此处组件初始化后，会添加下拉html -->
                </div>
              </div>
            </div>
          </li>
          <li>
            <div class="page-content">
              <div class="ipu-list ipu-list-media ipu-flex-content" id="order-refresh" style="margin-top: .46rem">
                <!-- 组件html结构，最外层div应有一个固定的高度，会在此元素上初始化iScroll -->
                <div class="ipu-refresh-wrapper">
                  <!-- 此处组件初始化后，会添加上拉html -->
                  <div class="refresh-content">
                    <div>
                      <ul class="mission-list">
                        <li class="">
                          <div class="mission-container">
                            <div class="ipu-flex mission-list-title">
                              <div class="mission-kdxz"></div>
                              <div class="ipu-flex ipu-flex-col-auto mission-order-number">
                                <div>订单编号：</div>
                                <div>201906267689</div>
                              </div>
                            </div>
                            <div class="mission-content-min-height">
                              <div class="ipu-flex mission-content">
                                <div class="mission-male-person mission-person-margin"></div>
                                <div class="ipu-flex-col-auto">
                                  <div class="ipu-flex  ipu-flex-justify-space">
                                    <div class="mission-person-name">李海涛</div>
                                    <div class="mission-state">待上门</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">装机地址：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">安徽省合肥市蜀山区长江西路125号</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">最近上门：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">6月9日 15:30-16:30</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">一年内上门次数：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">2</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">预约失败原因：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">客户表示不需要</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">备注：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">无</div>
                                  </div>
                                </div>
                              </div>
                              <!--<div class="mission-sell">-->
                              <!--<div class="ipu-flex ipu-flex-align-center">-->
                              <!--<div class="mission-sheji"></div>-->
                              <!--<div class="mission-sell-title">上门话术</div>-->
                              <!--</div>-->
                              <!--<div class="mission-sell-content">-->
                              <!--<span class="mission-sell-tag">宽带保养-宽带到期：</span>-->
                              <!--您的宽带下个月即将到期，为不影响使用，建议尽快续费。为了方便您办理，我可以在您方便的时候上门服务…-->
                              <!--</div>-->
                              <!--</div>-->
                            </div>
                            <div class="ipu-flex ipu-flex-justify-end mission-list-bottom">
                              <div class="mission-qxyy">取消预约</div>
                              <div class="mission-gy">改约</div>
                              <div class="mission-zd">转单</div>
                              <div class="mission-yy">上门</div>
                            </div>
                          </div>
                        </li>
                        <li class="">
                          <div class="mission-container">
                            <div class="ipu-flex mission-list-title">
                              <div class="mission-kdxz"></div>
                              <div class="ipu-flex ipu-flex-col-auto mission-order-number">
                                <div>订单编号：</div>
                                <div>201906267689</div>
                              </div>
                            </div>
                            <div class="mission-content-min-height">
                              <div class="ipu-flex mission-content">
                                <div class="mission-male-person mission-person-margin"></div>
                                <div class="ipu-flex-col-auto">
                                  <div class="ipu-flex  ipu-flex-justify-space">
                                    <div class="mission-person-name">李海涛</div>
                                    <div class="mission-state">待上门</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">装机地址：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">安徽省合肥市蜀山区长江西路125号</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">最近上门：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">6月9日 15:30-16:30</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">一年内上门次数：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">2</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">预约失败原因：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">客户表示不需要</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">备注：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">无</div>
                                  </div>
                                </div>
                              </div>
                              <!--<div class="mission-sell">-->
                              <!--<div class="ipu-flex ipu-flex-align-center">-->
                              <!--<div class="mission-sheji"></div>-->
                              <!--<div class="mission-sell-title">上门话术</div>-->
                              <!--</div>-->
                              <!--<div class="mission-sell-content">-->
                              <!--<span class="mission-sell-tag">宽带保养-宽带到期：</span>-->
                              <!--您的宽带下个月即将到期，为不影响使用，建议尽快续费。为了方便您办理，我可以在您方便的时候上门服务…-->
                              <!--</div>-->
                              <!--</div>-->
                            </div>
                            <div class="ipu-flex ipu-flex-justify-end mission-list-bottom">
                              <div class="mission-qxyy">取消预约</div>
                              <div class="mission-gy">改约</div>
                              <div class="mission-zd">转单</div>
                              <div class="mission-yy">上门</div>
                            </div>
                          </div>
                        </li>
                        <li class="">
                          <div class="mission-container">
                            <div class="ipu-flex mission-list-title">
                              <div class="mission-kdxz"></div>
                              <div class="ipu-flex ipu-flex-col-auto mission-order-number">
                                <div>订单编号：</div>
                                <div>201906267689</div>
                              </div>
                            </div>
                            <div class="mission-content-min-height">
                              <div class="ipu-flex mission-content">
                                <div class="mission-male-person mission-person-margin"></div>
                                <div class="ipu-flex-col-auto">
                                  <div class="ipu-flex  ipu-flex-justify-space">
                                    <div class="mission-person-name">李海涛</div>
                                    <div class="mission-state">待上门</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">装机地址：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">安徽省合肥市蜀山区长江西路125号</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">最近上门：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">6月9日 15:30-16:30</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">一年内上门次数：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">2</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">预约失败原因：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">客户表示不需要</div>
                                  </div>
                                  <div class="ipu-flex">
                                    <div class="ipu-flex-col mission-content-tag">备注：</div>
                                    <div class="ipu-flex-col-auto mission-content-value">无</div>
                                  </div>
                                </div>
                              </div>
                              <!--<div class="mission-sell">-->
                              <!--<div class="ipu-flex ipu-flex-align-center">-->
                              <!--<div class="mission-sheji"></div>-->
                              <!--<div class="mission-sell-title">上门话术</div>-->
                              <!--</div>-->
                              <!--<div class="mission-sell-content">-->
                              <!--<span class="mission-sell-tag">宽带保养-宽带到期：</span>-->
                              <!--您的宽带下个月即将到期，为不影响使用，建议尽快续费。为了方便您办理，我可以在您方便的时候上门服务…-->
                              <!--</div>-->
                              <!--</div>-->
                            </div>
                            <div class="ipu-flex ipu-flex-justify-end mission-list-bottom">
                              <div class="mission-qxyy">取消预约</div>
                              <div class="mission-gy">改约</div>
                              <div class="mission-zd">转单</div>
                              <div class="mission-yy">上门</div>
                            </div>
                          </div>
                        </li>
                      </ul>
                    </div>
                    <div class="no-result-msg ipu-fn-p ipu-txt-center">
                      暂无记录
                    </div>
                  </div>
                  <!-- 此处组件初始化后，会添加下拉html -->
                </div>
              </div>
            </div>
          </li>
          <li>
            <div class="page-content">
              <div class="ipu-list ipu-list-media ipu-flex-content" id="finish-refresh" style="margin-top: .46rem">
                <!-- 组件html结构，最外层div应有一个固定的高度，会在此元素上初始化iScroll -->
                <div class="ipu-refresh-wrapper">
                  <!-- 此处组件初始化后，会添加上拉html -->
                  <div class="refresh-content">
                    <div>
                      <ul class="mission-list">
                        <li class="">
                          <div class="mission-container">
                            <div class="ipu-flex mission-list-title">
                              <div class="mission-kdxz"></div>
                              <div class="ipu-flex ipu-flex-col-auto mission-order-number">
                                <div>订单编号：</div>
                                <div>201906267689</div>
                              </div>
                            </div>
                            <div class="ipu-flex mission-content">
                              <div class="mission-male-person mission-person-margin"></div>
                              <div class="ipu-flex-col-auto">
                                <div class="ipu-flex  ipu-flex-justify-space">
                                  <div class="mission-person-name">王心怡</div>
                                  <div class="mission-finish"></div>
                                </div>
                                <div class="ipu-flex">
                                  <div class="ipu-flex-col mission-content-tag">完成时间：</div>
                                  <div class="ipu-flex-col-auto mission-content-value">6月9日 15:30-16:30</div>
                                </div>
                                <div class="ipu-flex">
                                  <div class="ipu-flex-col mission-content-tag">装机地址：</div>
                                  <div class="ipu-flex-col-auto mission-content-value">安徽省合肥市庐阳区金海世纪花园4栋2304</div>
                                </div>
                                <div class="ipu-flex">
                                  <div class="ipu-flex-col mission-content-tag">随销结果：</div>
                                  <div class="ipu-flex-col-auto mission-content-value">随销成功</div>
                                </div>
                                <div class="ipu-flex">
                                  <div class="ipu-flex-col mission-content-tag">随销产品：</div>
                                  <div class="ipu-flex-col-auto mission-content-value">全球通任我用个人版128元</div>
                                </div>
                              </div>
                            </div>
                            <div class="ipu-flex ipu-flex-justify-end mission-list-bottom">
                              <div class="mission-yy">上门</div>
                            </div>
                          </div>
                        </li>
                        <li class="">
                          <div class="mission-container">
                            <div class="ipu-flex mission-list-title">
                              <div class="mission-kdxz"></div>
                              <div class="ipu-flex ipu-flex-col-auto mission-order-number">
                                <div>订单编号：</div>
                                <div>201906267689</div>
                              </div>
                            </div>
                            <div class="ipu-flex mission-content">
                              <div class="mission-male-person mission-person-margin"></div>
                              <div class="ipu-flex-col-auto">
                                <div class="ipu-flex  ipu-flex-justify-space">
                                  <div class="mission-person-name">王心怡</div>
                                  <div class="mission-finish"></div>
                                </div>
                                <div class="ipu-flex">
                                  <div class="ipu-flex-col mission-content-tag">完成时间：</div>
                                  <div class="ipu-flex-col-auto mission-content-value">6月9日 15:30-16:30</div>
                                </div>
                                <div class="ipu-flex">
                                  <div class="ipu-flex-col mission-content-tag">装机地址：</div>
                                  <div class="ipu-flex-col-auto mission-content-value">安徽省合肥市庐阳区金海世纪花园4栋2304</div>
                                </div>
                                <div class="ipu-flex">
                                  <div class="ipu-flex-col mission-content-tag">随销结果：</div>
                                  <div class="ipu-flex-col-auto mission-content-value">随销成功</div>
                                </div>
                                <div class="ipu-flex">
                                  <div class="ipu-flex-col mission-content-tag">随销产品：</div>
                                  <div class="ipu-flex-col-auto mission-content-value">全球通任我用个人版128元</div>
                                </div>
                              </div>
                            </div>
                            <div class="ipu-flex ipu-flex-justify-end mission-list-bottom">
                              <div class="mission-yy">上门</div>
                            </div>
                          </div>
                        </li>
                        <li class="">
                          <div class="mission-container">
                            <div class="ipu-flex mission-list-title">
                              <div class="mission-kdxz"></div>
                              <div class="ipu-flex ipu-flex-col-auto mission-order-number">
                                <div>订单编号：</div>
                                <div>201906267689</div>
                              </div>
                            </div>
                            <div class="ipu-flex mission-content">
                              <div class="mission-male-person mission-person-margin"></div>
                              <div class="ipu-flex-col-auto">
                                <div class="ipu-flex  ipu-flex-justify-space">
                                  <div class="mission-person-name">王心怡</div>
                                  <div class="mission-finish"></div>
                                </div>
                                <div class="ipu-flex">
                                  <div class="ipu-flex-col mission-content-tag">完成时间：</div>
                                  <div class="ipu-flex-col-auto mission-content-value">6月9日 15:30-16:30</div>
                                </div>
                                <div class="ipu-flex">
                                  <div class="ipu-flex-col mission-content-tag">装机地址：</div>
                                  <div class="ipu-flex-col-auto mission-content-value">安徽省合肥市庐阳区金海世纪花园4栋2304</div>
                                </div>
                                <div class="ipu-flex">
                                  <div class="ipu-flex-col mission-content-tag">随销结果：</div>
                                  <div class="ipu-flex-col-auto mission-content-value">随销成功</div>
                                </div>
                                <div class="ipu-flex">
                                  <div class="ipu-flex-col mission-content-tag">随销产品：</div>
                                  <div class="ipu-flex-col-auto mission-content-value">全球通任我用个人版128元</div>
                                </div>
                              </div>
                            </div>
                            <div class="ipu-flex ipu-flex-justify-end mission-list-bottom">
                              <div class="mission-yy">上门</div>
                            </div>
                          </div>
                        </li>
                      </ul>
                    </div>
                    <div class="no-result-msg ipu-fn-p ipu-txt-center">
                      暂无记录
                    </div>
                  </div>
                  <!-- 此处组件初始化后，会添加下拉html -->
                </div>
              </div>
            </div>
          </li>
        </ul>
      </div>
    </div>
  </div>
</div>
</body>
</html>

2019/ah-hsx/kd-new-step-four.html

@@ -0,0 +1,123 @@
<!DOCTYPE html>
<html lang="en">
<head>
  <title>宽带新装</title>
  <meta charset="utf-8">
  <!-- 宽度自动适配 -->
  <meta name="viewport"
        content="width=device-width, initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0, user-scalable=no"/>
  <!-- 不识别页面上的数字为可拨打号码 -->
  <meta content="telephone=no" name="format-detection"/>
  <link rel="stylesheet" type="text/css" href="ipu/ui/css/ipuUI.css">
  <link rel="stylesheet" type="text/css" href="biz/css/base.css">
  <script src="ipu/lib/requirejs/require.min.js"></script>
  <script src="biz/js/require-config.js"></script>
  <script src="biz/js/step-four.js"></script>
</head>
<body class="pages-step-four">
<div class="ipu-flex-row ipu-flex-vertical">
  <div class="ipu-flex-col">
    <div class="ipu-toolbar">
      <a class="ipu-fn-left link-back ipu-flex ipu-flex-align-center" href="javascript:history.back(-1);">
        <div class="left-back"></div>
      </a>
      <h1 class="ipu-toolbar-title">宽带新装
      </h1>
    </div>
  </div>
  <div class="ipu-flex-col ipu-flex-col-auto">
    <div class="ipu-flex mission-content">
      <div class="mission-female-person mission-person-margin"></div>
      <div class="ipu-flex-col-auto">
        <div class="ipu-flex  ipu-flex-justify-space">
          <div class="mission-person-name">王心怡</div>
          <div class="mission-state">
            <div class="phone-pic"></div>
          </div>
        </div>
        <div class="ipu-flex">
          <div class="ipu-flex-col mission-content-tag">装机地址：</div>
          <div class="ipu-flex-col-auto mission-content-value">合肥市蜀山区长江西路125号</div>
        </div>
        <div class="ipu-flex">
          <div class="ipu-flex-col mission-content-tag">最近上门：</div>
          <div class="ipu-flex-col-auto mission-content-value">6月9日 15:30-16:30</div>
        </div>
        <div class="ipu-flex">
          <div class="ipu-flex-col mission-content-tag">一年内上门次数：</div>
          <div class="ipu-flex-col-auto mission-content-value">2</div>
        </div>
      </div>
    </div>
    <div class="ipu-flex  ipu-flex-justify-space step-content">
      <div class="ipu-flex-vertical ipu-flex ipu-flex-justify-center ipu-flex-align-center">
        <div class="true-pic"></div>
        <div class="step-value">预约前必看</div>
      </div>
      <div class="step-1to2 step-finish"></div>
      <div class="ipu-flex-vertical  ipu-flex ipu-flex-justify-center ipu-flex-align-center">
        <div class="true-pic"></div>
        <div class="step-value">上门前必看</div>
      </div>
      <div class="step-2to3 step-finish"></div>
      <div class="ipu-flex-vertical ipu-flex ipu-flex-justify-center ipu-flex-align-center">
        <div class="true-pic"></div>
        <div class="step-value">上门后必做</div>
      </div>
      <div class="step-3to4 step-finish"></div>
      <div class="ipu-flex-vertical ipu-flex ipu-flex-justify-center ipu-flex-align-center">
        <div class="true-pic"></div>
        <div class="step-value">业务必推荐</div>
      </div>
      <div class="step-4to5 step-un-finish"></div>
      <div class="ipu-flex-vertical ipu-flex ipu-flex-justify-center ipu-flex-align-center">
        <div class="step-num">5</div>
        <div class="step-value">完成必确认</div>
      </div>
    </div>
    <div class="back-white">
      <div class="finish-title">验证上门打卡码</div>
      <div>
        <div class="verify-num-title">请输入打卡码</div>
        <div class="ipu-flex ipu-flex-justify-center" id="numBox">
          <input type="number" oninput="if(value.length>1)value=value.slice(0,1)" class="verify-num-input"/>
          <input type="number" oninput="if(value.length>1)value=value.slice(0,1)"
                 class="verify-num-input verify-num-input-margin"/>
          <input type="number" oninput="if(value.length>1)value=value.slice(0,1)"
                 class="verify-num-input verify-num-input-margin"/>
          <input type="number" oninput="if(value.length>1)value=value.slice(0,1)"
                 class="verify-num-input verify-num-input-margin"/>
        </div>
        <div class="ipu-flex ipu-flex-justify-center">
          <div class="reissue-num" id="sendNumber">
            补发打卡码
          </div>
        </div>
      </div>
    </div>
    <div class="back-white unfinish-content-margin ipu-fn-hide">
      <div class="unfinish-title">随销未办理</div>
      <div class="unfinish-reason-title">随销未办理原因:</div>
      <div class="ipu-flex">
        <textarea class="ipu-flex-col-auto other-reason-description unfinish-remarks-margin" placeholder="请输入营销未办理原因"></textarea>
      </div>
    </div>
    <div class="back-white blank-height">
    </div>
  </div>
  <div class="ipu-flex ipu-flex-col bottom-button">
    <div class="ipu-flex ipu-flex-justify-center ipu-flex-align-center unfinish-step">
      <div class="right-circle ipu-fn-hide"></div>
      <div class="button-text">营销未办理</div>
    </div>
    <div class="ipu-flex ipu-flex-justify-center ipu-flex-align-center finish-step active-step-state">
      <div class="right-circle"></div>
      <div class="button-text">营销已办理</div>
    </div>
  </div>
</div>
</body>
</html>

2019/ah-hsx/kd-new-step-one.html

@@ -0,0 +1,991 @@
<!DOCTYPE html>
<html lang="en">
<head>
  <title>宽带新装</title>
  <meta charset="utf-8">
  <!-- 宽度自动适配 -->
  <meta name="viewport"
        content="width=device-width, initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0, user-scalable=no"/>
  <!-- 不识别页面上的数字为可拨打号码 -->
  <meta content="telephone=no" name="format-detection"/>
  <link rel="stylesheet" type="text/css" href="ipu/ui/css/ipuUI.css">
  <link rel="stylesheet" type="text/css" href="biz/css/base.css">
  <script src="ipu/lib/requirejs/require.min.js"></script>
  <script src="biz/js/require-config.js"></script>
  <script src="biz/js/step-two.js"></script>
</head>
<body class="pages-step-two kd-new-install">
<div class="ipu-flex-row ipu-flex-vertical">
  <div class="ipu-flex-col">
    <div class="ipu-toolbar">
      <a class="ipu-fn-left link-back ipu-flex ipu-flex-align-center" href="javascript:history.back(-1);">
        <div class="left-back"></div>
      </a>
      <h1 class="ipu-toolbar-title">宽带新装
      </h1>
    </div>
  </div>
  <div class="ipu-flex-col ipu-flex-col-auto">
    <div class="ipu-flex mission-content">
      <div class="mission-female-person mission-person-margin"></div>
      <div class="ipu-flex-col-auto">
        <div class="ipu-flex  ipu-flex-justify-space">
          <div class="mission-person-name">王心怡</div>
          <div class="mission-state">
            <div class="phone-pic"></div>
          </div>
        </div>
        <div class="ipu-flex">
          <div class="ipu-flex-col mission-content-tag">装机地址：</div>
          <div class="ipu-flex-col-auto mission-content-value">合肥市蜀山区长江西路125号</div>
        </div>
        <div class="ipu-flex">
          <div class="ipu-flex-col mission-content-tag">最近上门：</div>
          <div class="ipu-flex-col-auto mission-content-value">6月9日 15:30-16:30</div>
        </div>
        <div class="ipu-flex">
          <div class="ipu-flex-col mission-content-tag">一年内上门次数：</div>
          <div class="ipu-flex-col-auto mission-content-value">2</div>
        </div>
        <div class="ipu-flex">
          <div class="ipu-flex-col mission-content-tag">备注：</div>
          <div class="ipu-flex-col-auto mission-content-value">无</div>
        </div>
      </div>
    </div>
    <div class="ipu-flex ipu-flex-justify-space step-content">
      <div class="ipu-flex-vertical  ipu-flex ipu-flex-justify-center ipu-flex-align-center">
        <div class="true-pic"></div>
        <div class="step-value">上门前必看</div>
      </div>
      <div class="step-1to2 step-un-finish new-install-step"></div>
      <div class="ipu-flex-vertical ipu-flex ipu-flex-justify-center ipu-flex-align-center">
        <div class="step-num">2</div>
        <div class="step-value">上门后必做</div>
      </div>
      <div class="step-2to3 step-un-finish new-install-step"></div>
      <div class="ipu-flex-vertical ipu-flex ipu-flex-justify-center ipu-flex-align-center">
        <div class="step-num">3</div>
        <div class="step-value">上门必推荐</div>
      </div>
      <div class="step-3to4 step-un-finish new-install-step"></div>
      <div class="ipu-flex-vertical ipu-flex ipu-flex-justify-center ipu-flex-align-center">
        <div class="step-num">4</div>
        <div class="step-value">完工必确认</div>
      </div>
    </div>
    <div>
      <div class="ipu-tab tab-fav tab-fav-count back-white" >  <!-- 如果class中添加 ipu-tab-fixed，则可固定头部，此时需要父元素的高度是确定的 -->
        <div class="tab-head">
          <ul class="ipu-tab-title ipu-tab-title-link scroll-tab"> <!-- 页头有 ipu-tab-title-link 和 ipu-tab-title-button两种样式 -->
            <li class="ipu-current">宽带用户</li>
            <li>手机用户1</li>  <!-- class为ipu-current为默认选中项 -->
            <li>手机用户2</li>
          </ul>
        </div>
        <div class="ipu-tab-body">
          <ul class="ipu-tab-body-wrapper">
            <li class="back-white">
              <div>
                <div class="ipu-flex  kdyh-title-content" style="">
                  <div class="kdyh-title-active target00">基本信息</div>
                  <div class="kdyh-title target01">营销策略1</div>
                  <div class="kdyh-title target02">营销策略2</div>
                  <div class="kdyh-title target03">营销策略3</div>
                </div>
                <div class="ipu-flex-col basic-info basic-info-margin" id="target00">
                  <div class="ipu-flex info-category">
                    <div class="ipu-flex-col info-pic"></div>
                    <div class="ipu-flex-col-auto info-title">基本信息</div>
                  </div>
                  <div class="ipu-flex info-type info-background-white info-code">FF****3262</div>
                  <div class="ipu-flex info-type">
                    <div class="ipu-flex-col-auto info-type-name">宽带类型：</div>
                    <div class="ipu-flex-col info-type-state">融合-不限量</div>
                  </div>
                  <div class="ipu-flex info-type info-background-white">
                    <div class="ipu-flex-col-auto info-type-name">地址分类：</div>
                    <div class="ipu-flex-col info-type-state">家宽</div>
                  </div>
                  <div class="ipu-flex info-type">
                    <div class="ipu-flex-col-auto info-type-name">宽带套餐：</div>
                    <div class="ipu-flex-col info-type-state">全球通任我用家宽100M (10元，2019版)</div>
                  </div>
                  <div class="ipu-flex info-type info-background-white">
                    <div class="ipu-flex-col-auto info-type-name">宽带速率：</div>
                    <div class="ipu-flex-col info-type-state">100M</div>
                  </div>
                  <div class="basic-info-hidden">
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">是否订购互联网电视：</div>
                      <div class="ipu-flex-col info-type-state">是</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">互联网电视是否活跃：</div>
                      <div class="ipu-flex-col info-type-state">是</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">家庭成员数：</div>
                      <div class="ipu-flex-col info-type-state">2</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">一年内上门次数：</div>
                      <div class="ipu-flex-col info-type-state">2</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">最近上门时间：</div>
                      <div class="ipu-flex-col info-type-state">2018-11-09</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">联系方式：</div>
                      <div class="ipu-flex-col info-type-state">138****1234</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">宽带使用时长：</div>
                      <div class="ipu-flex-col info-type-state">0年</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">宽带月使用流量：</div>
                      <div class="ipu-flex-col info-type-state">0G</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">是否办理家庭组网：</div>
                      <div class="ipu-flex-col info-type-state">否</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">是否为质差用户：</div>
                      <div class="ipu-flex-col info-type-state">否</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">到期时间：</div>
                      <div class="ipu-flex-col info-type-state">2020-05-31</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name info-background-white">装机时间：</div>
                      <div class="ipu-flex-col info-type-state">2018-04-01</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">受限期限：</div>
                      <div class="ipu-flex-col info-type-state">2020-05-31</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">每月返还话费：</div>
                      <div class="ipu-flex-col info-type-state">30元</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">小区名称：</div>
                      <div class="ipu-flex-col info-type-state">丽江花园</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">接入方式：</div>
                      <div class="ipu-flex-col info-type-state">FFTH</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">异网号码数量：</div>
                      <div class="ipu-flex-col info-type-state">2</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">用户达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-right"></div></div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">套餐达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-right"></div></div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">产品达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-right"></div></div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">V网达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-wrong"></div></div>
                    </div>
                  </div>
                  <div class="ipu-flex info-fold ipu-flex-justify-center ipu-flex-align-center">
                    <div class="ipu-flex-col info-fold-text">展开查看更多</div>
                    <div class="ipu-flex-col info-unfold-icon"></div>
                  </div>
                </div>
                <div class="kdyh-content kdyh-content-padding" id="target01">
                  <div class="ipu-flex ipu-flex-justify-start ipu-flex-align-center">
                    <div class="title-tag"></div>
                    <div class="title">营销策略1</div>
                  </div>
                  <div>
                    <div class="mission-sell">
                      <div class="ipu-flex ipu-flex-align-center">
                        <div class="mission-sheji"></div>
                        <div class="mission-sell-title">营销话术</div>
                      </div>
                      <div class="mission-sell-content">
                        <span class="mission-sell-tag">宽带保养-宽带到期：</span>
                        您的宽带下个月即将到期，为不影响使用，建议尽快续费。为了方便您办理，我可以在您方便的时候上门服务…
                      </div>
                    </div>
                    <!--<div class="sub-title">用户画像</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月瀛湖手厅高频业务查询次数-月：</div>-->
                      <!--<div class="information-value">3</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月用户网厅高频业务查询次数-月：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key"> 当月用户全渠道业务办理接触次数-日：</div>-->
                      <!--<div class="information-value">1</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月用户全渠道加油包订购次数-日：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space can-hidden">-->
                      <!--<div class="information-key"> 当月用户手厅流量包订购次数-日：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space can-hidden">-->
                      <!--<div class="information-key">当月用户收听主套餐订购次数：</div>-->
                      <!--<div class="information-value">1</div>-->
                    <!--</div>-->
                    <div class="sub-title">营销推荐</div>
                    <div class="ipu-flex ipu-flex-justify-space ipu-flex-align-center information" >
                      <div class="information-key information-key-inline information-width">TC（RWY68-198，ZX288-388) 优惠【1级，受限12个月】</div>
                      <div class="business-handling">点击办理</div>
                    </div>
                    <ul>
                      <li class="information-value step-un-finish">尊享388（限12月）+返60元*12</li>
                      <li class="information-value step-un-finish">尊享288（限12月）+返50元*12</li>
                      <li class="information-value step-un-finish">任138（限12月）+返30元*12</li>
                      <li class="information-value step-un-finish">任198（限12月）+200分钟*12月（延1月）</li>
                    </ul>
                    <!--<div class="sub-title">营销话术</div>-->
                    <!--<div>-->
                      <!--<div class="ipu-flex ipu-flex-justify-center information">-->
                        <!--<div class="information-key information-key-inline" >感谢您选择我们移动宽带，我是您的宽带管家小王，后续宽带使用有问题可以随时找我，如果公司有新的优惠我会第一时间推荐给您。</div>-->
                      <!--</div>-->
                    <!--</div>-->
                  </div>
                </div>
                <div class="kdyh-content kdyh-content-padding" id="target02">
                  <div class="ipu-flex ipu-flex-justify-start ipu-flex-align-center">
                    <div class="title-tag"></div>
                    <div class="title">营销策略2</div>
                  </div>
                  <div>
                    <div class="mission-sell">
                      <div class="ipu-flex ipu-flex-align-center">
                        <div class="mission-sheji"></div>
                        <div class="mission-sell-title">营销话术</div>
                      </div>
                      <div class="mission-sell-content">
                        <span class="mission-sell-tag">宽带保养-宽带到期：</span>
                        您的宽带下个月即将到期，为不影响使用，建议尽快续费。为了方便您办理，我可以在您方便的时候上门服务…
                      </div>
                    </div>
                    <!--<div class="sub-title">用户画像</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月瀛湖手厅高频业务查询次数-月：</div>-->
                      <!--<div class="information-value">3</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月用户网厅高频业务查询次数-月：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key"> 当月用户全渠道业务办理接触次数-日：</div>-->
                      <!--<div class="information-value">1</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月用户全渠道加油包订购次数-日：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space can-hidden">-->
                      <!--<div class="information-key"> 当月用户手厅流量包订购次数-日：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space can-hidden">-->
                      <!--<div class="information-key">当月用户收听主套餐订购次数：</div>-->
                      <!--<div class="information-value">1</div>-->
                    <!--</div>-->
                    <div class="sub-title">营销推荐</div>
                    <div class="ipu-flex ipu-flex-justify-space ipu-flex-align-center information" >
                      <div class="information-key information-key-inline information-width">TC（RWY68-198，ZX288-388) 优惠【1级，受限12个月】</div>
                      <div class="business-handling">点击办理</div>
                    </div>
                    <ul>
                      <li class="information-value step-un-finish">尊享388（限12月）+返60元*12</li>
                      <li class="information-value step-un-finish">尊享288（限12月）+返50元*12</li>
                      <li class="information-value step-un-finish">任138（限12月）+返30元*12</li>
                      <li class="information-value step-un-finish">任198（限12月）+200分钟*12月（延1月）</li>
                    </ul>
                    <!--<div class="sub-title">营销话术</div>-->
                    <!--<div>-->
                      <!--<div class="ipu-flex ipu-flex-justify-center information">-->
                        <!--<div class="information-key information-key-inline" >感谢您选择我们移动宽带，我是您的宽带管家小王，后续宽带使用有问题可以随时找我，如果公司有新的优惠我会第一时间推荐给您。</div>-->
                      <!--</div>-->
                    <!--</div>-->
                  </div>
                </div>
                <div class="kdyh-content kdyh-content-padding" id="target03">
                  <div class="ipu-flex ipu-flex-justify-start ipu-flex-align-center">
                    <div class="title-tag"></div>
                    <div class="title">营销策略3</div>
                  </div>
                  <div>
                    <div class="mission-sell">
                      <div class="ipu-flex ipu-flex-align-center">
                        <div class="mission-sheji"></div>
                        <div class="mission-sell-title">营销话术</div>
                      </div>
                      <div class="mission-sell-content">
                        <span class="mission-sell-tag">宽带保养-宽带到期：</span>
                        您的宽带下个月即将到期，为不影响使用，建议尽快续费。为了方便您办理，我可以在您方便的时候上门服务…
                      </div>
                    </div>
                    <!--<div class="sub-title">用户画像</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月瀛湖手厅高频业务查询次数-月：</div>-->
                      <!--<div class="information-value">3</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月用户网厅高频业务查询次数-月：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key"> 当月用户全渠道业务办理接触次数-日：</div>-->
                      <!--<div class="information-value">1</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月用户全渠道加油包订购次数-日：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space can-hidden">-->
                      <!--<div class="information-key"> 当月用户手厅流量包订购次数-日：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space can-hidden">-->
                      <!--<div class="information-key">当月用户收听主套餐订购次数：</div>-->
                      <!--<div class="information-value">1</div>-->
                    <!--</div>-->
                    <div class="sub-title">营销推荐</div>
                    <div class="ipu-flex ipu-flex-justify-space ipu-flex-align-center information" >
                      <div class="information-key information-key-inline information-width">TC（RWY68-198，ZX288-388) 优惠【1级，受限12个月】</div>
                      <div class="business-handling">点击办理</div>
                    </div>
                    <ul>
                      <li class="information-value step-un-finish">尊享388（限12月）+返60元*12</li>
                      <li class="information-value step-un-finish">尊享288（限12月）+返50元*12</li>
                      <li class="information-value step-un-finish">任138（限12月）+返30元*12</li>
                      <li class="information-value step-un-finish">任198（限12月）+200分钟*12月（延1月）</li>
                    </ul>
                    <!--<div class="sub-title">营销话术</div>-->
                    <!--<div>-->
                      <!--<div class="ipu-flex ipu-flex-justify-center information">-->
                        <!--<div class="information-key information-key-inline" >感谢您选择我们移动宽带，我是您的宽带管家小王，后续宽带使用有问题可以随时找我，如果公司有新的优惠我会第一时间推荐给您。</div>-->
                      <!--</div>-->
                    <!--</div>-->
                  </div>
                </div>
                <div
                        class="submit-reserve">
                  下一步
                </div>
              </div>
            </li>
            <li class="back-white">
              <div>
                <div class="ipu-flex  kdyh-title-content" style="">
                  <div class="kdyh-title-active target10">基本信息</div>
                  <div class="kdyh-title target11">营销策略1</div>
                  <div class="kdyh-title target12">营销策略2</div>
                </div>
                <div class="ipu-flex-col basic-info basic-info-margin" id="target10">
                  <div class="ipu-flex info-category">
                    <div class="ipu-flex-col info-pic"></div>
                    <div class="ipu-flex-col-auto info-title">基本信息</div>
                  </div>
                  <div class="ipu-flex info-type info-background-white info-code">FF****3262</div>
                  <div class="ipu-flex info-type">
                    <div class="ipu-flex-col-auto info-type-name">宽带类型：</div>
                    <div class="ipu-flex-col info-type-state">融合-不限量</div>
                  </div>
                  <div class="ipu-flex info-type info-background-white">
                    <div class="ipu-flex-col-auto info-type-name">地址分类：</div>
                    <div class="ipu-flex-col info-type-state">家宽</div>
                  </div>
                  <div class="ipu-flex info-type">
                    <div class="ipu-flex-col-auto info-type-name">宽带套餐：</div>
                    <div class="ipu-flex-col info-type-state">全球通任我用家宽100M (10元，2019版)</div>
                  </div>
                  <div class="ipu-flex info-type info-background-white">
                    <div class="ipu-flex-col-auto info-type-name">宽带速率：</div>
                    <div class="ipu-flex-col info-type-state">100M</div>
                  </div>
                  <div class="basic-info-hidden">
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">是否订购互联网电视：</div>
                      <div class="ipu-flex-col info-type-state">是</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">互联网电视是否活跃：</div>
                      <div class="ipu-flex-col info-type-state">是</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">家庭成员数：</div>
                      <div class="ipu-flex-col info-type-state">2</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">一年内上门次数：</div>
                      <div class="ipu-flex-col info-type-state">2</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">最近上门时间：</div>
                      <div class="ipu-flex-col info-type-state">2018-11-09</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">联系方式：</div>
                      <div class="ipu-flex-col info-type-state">138****1234</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">宽带使用时长：</div>
                      <div class="ipu-flex-col info-type-state">0年</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">宽带月使用流量：</div>
                      <div class="ipu-flex-col info-type-state">0G</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">是否办理家庭组网：</div>
                      <div class="ipu-flex-col info-type-state">否</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">是否为质差用户：</div>
                      <div class="ipu-flex-col info-type-state">否</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">到期时间：</div>
                      <div class="ipu-flex-col info-type-state">2020-05-31</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name info-background-white">装机时间：</div>
                      <div class="ipu-flex-col info-type-state">2018-04-01</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">受限期限：</div>
                      <div class="ipu-flex-col info-type-state">2020-05-31</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">每月返还话费：</div>
                      <div class="ipu-flex-col info-type-state">30元</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">小区名称：</div>
                      <div class="ipu-flex-col info-type-state">丽江花园</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">接入方式：</div>
                      <div class="ipu-flex-col info-type-state">FFTH</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">异网号码数量：</div>
                      <div class="ipu-flex-col info-type-state">2</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">用户达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-right"></div></div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">套餐达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-right"></div></div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">产品达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-right"></div></div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">V网达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-wrong"></div></div>
                    </div>
                  </div>
                  <div class="ipu-flex info-fold ipu-flex-justify-center ipu-flex-align-center">
                    <div class="ipu-flex-col info-fold-text">展开查看更多</div>
                    <div class="ipu-flex-col info-unfold-icon"></div>
                  </div>
                </div>
                <div class="kdyh-content kdyh-content-padding" id="target11" >
                  <div class="ipu-flex ipu-flex-justify-start ipu-flex-align-center">
                    <div class="title-tag"></div>
                    <div class="title">营销策略1</div>
                  </div>
                  <div>
                    <div class="mission-sell">
                      <div class="ipu-flex ipu-flex-align-center">
                        <div class="mission-sheji"></div>
                        <div class="mission-sell-title">营销话术</div>
                      </div>
                      <div class="mission-sell-content">
                        <span class="mission-sell-tag">宽带保养-宽带到期：</span>
                        您的宽带下个月即将到期，为不影响使用，建议尽快续费。为了方便您办理，我可以在您方便的时候上门服务…
                      </div>
                    </div>
                    <!--<div class="sub-title">用户画像</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月瀛湖手厅高频业务查询次数-月：</div>-->
                      <!--<div class="information-value">3</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月用户网厅高频业务查询次数-月：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key"> 当月用户全渠道业务办理接触次数-日：</div>-->
                      <!--<div class="information-value">1</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月用户全渠道加油包订购次数-日：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space can-hidden">-->
                      <!--<div class="information-key"> 当月用户手厅流量包订购次数-日：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space can-hidden">-->
                      <!--<div class="information-key">当月用户收听主套餐订购次数：</div>-->
                      <!--<div class="information-value">1</div>-->
                    <!--</div>-->
                    <div class="sub-title">营销推荐</div>
                    <div class="ipu-flex ipu-flex-justify-space ipu-flex-align-center information" >
                      <div class="information-key information-key-inline information-width">TC（RWY68-198，ZX288-388) 优惠【1级，受限12个月】</div>
                      <div class="business-handling">点击办理</div>
                    </div>
                    <ul>
                      <li class="information-value step-un-finish">尊享388（限12月）+返60元*12</li>
                      <li class="information-value step-un-finish">尊享288（限12月）+返50元*12</li>
                      <li class="information-value step-un-finish">任138（限12月）+返30元*12</li>
                      <li class="information-value step-un-finish">任198（限12月）+200分钟*12月（延1月）</li>
                    </ul>
                    <!--<div class="sub-title">营销话术</div>-->
                    <!--<div>-->
                      <!--<div class="ipu-flex ipu-flex-justify-center information">-->
                        <!--<div class="information-key information-key-inline" >感谢您选择我们移动宽带，我是您的宽带管家小王，后续宽带使用有问题可以随时找我，如果公司有新的优惠我会第一时间推荐给您。</div>-->
                      <!--</div>-->
                    <!--</div>-->
                  </div>
                </div>
                <div class="kdyh-content kdyh-content-padding" id="target12">
                  <div class="ipu-flex ipu-flex-justify-start ipu-flex-align-center">
                    <div class="title-tag"></div>
                    <div class="title">营销策略2</div>
                  </div>
                  <div>
                    <div class="mission-sell">
                      <div class="ipu-flex ipu-flex-align-center">
                        <div class="mission-sheji"></div>
                        <div class="mission-sell-title">营销话术</div>
                      </div>
                      <div class="mission-sell-content">
                        <span class="mission-sell-tag">宽带保养-宽带到期：</span>
                        您的宽带下个月即将到期，为不影响使用，建议尽快续费。为了方便您办理，我可以在您方便的时候上门服务…
                      </div>
                    </div>
                    <!--<div class="sub-title">用户画像</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月瀛湖手厅高频业务查询次数-月：</div>-->
                      <!--<div class="information-value">3</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月用户网厅高频业务查询次数-月：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key"> 当月用户全渠道业务办理接触次数-日：</div>-->
                      <!--<div class="information-value">1</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月用户全渠道加油包订购次数-日：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space can-hidden">-->
                      <!--<div class="information-key"> 当月用户手厅流量包订购次数-日：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space can-hidden">-->
                      <!--<div class="information-key">当月用户收听主套餐订购次数：</div>-->
                      <!--<div class="information-value">1</div>-->
                    <!--</div>-->
                    <div class="sub-title">营销推荐</div>
                    <div class="ipu-flex ipu-flex-justify-space ipu-flex-align-center information" >
                      <div class="information-key information-key-inline information-width">TC（RWY68-198，ZX288-388) 优惠【1级，受限12个月】</div>
                      <div class="business-handling">点击办理</div>
                    </div>
                    <ul>
                      <li class="information-value step-un-finish">尊享388（限12月）+返60元*12</li>
                      <li class="information-value step-un-finish">尊享288（限12月）+返50元*12</li>
                      <li class="information-value step-un-finish">任138（限12月）+返30元*12</li>
                      <li class="information-value step-un-finish">任198（限12月）+200分钟*12月（延1月）</li>
                    </ul>
                    <!--<div class="sub-title">营销话术</div>-->
                    <!--<div>-->
                      <!--<div class="ipu-flex ipu-flex-justify-center information">-->
                        <!--<div class="information-key information-key-inline" >感谢您选择我们移动宽带，我是您的宽带管家小王，后续宽带使用有问题可以随时找我，如果公司有新的优惠我会第一时间推荐给您。</div>-->
                      <!--</div>-->
                    <!--</div>-->
                  </div>
                </div>
                <div
                        class="submit-reserve">
                  下一步
                </div>
              </div>
            </li>
            <li class="back-white">
              <div>
                <div class="ipu-flex  kdyh-title-content" style="">
                  <div class="kdyh-title-active target20">基本信息</div>
                  <div class="kdyh-title target21">营销策略1</div>
                  <div class="kdyh-title target22">营销策略2</div>
                  <div class="kdyh-title target23">营销策略3</div>
                </div>
                <div class="ipu-flex-col basic-info basic-info-margin" id="target20">
                  <div class="ipu-flex info-category">
                    <div class="ipu-flex-col info-pic"></div>
                    <div class="ipu-flex-col-auto info-title">基本信息</div>
                  </div>
                  <div class="ipu-flex info-type info-background-white info-code">FF****3262</div>
                  <div class="ipu-flex info-type">
                    <div class="ipu-flex-col-auto info-type-name">宽带类型：</div>
                    <div class="ipu-flex-col info-type-state">融合-不限量</div>
                  </div>
                  <div class="ipu-flex info-type info-background-white">
                    <div class="ipu-flex-col-auto info-type-name">地址分类：</div>
                    <div class="ipu-flex-col info-type-state">家宽</div>
                  </div>
                  <div class="ipu-flex info-type">
                    <div class="ipu-flex-col-auto info-type-name">宽带套餐：</div>
                    <div class="ipu-flex-col info-type-state">全球通任我用家宽100M (10元，2019版)</div>
                  </div>
                  <div class="ipu-flex info-type info-background-white">
                    <div class="ipu-flex-col-auto info-type-name">宽带速率：</div>
                    <div class="ipu-flex-col info-type-state">100M</div>
                  </div>
                  <div class="basic-info-hidden">
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">是否订购互联网电视：</div>
                      <div class="ipu-flex-col info-type-state">是</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">互联网电视是否活跃：</div>
                      <div class="ipu-flex-col info-type-state">是</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">家庭成员数：</div>
                      <div class="ipu-flex-col info-type-state">2</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">一年内上门次数：</div>
                      <div class="ipu-flex-col info-type-state">2</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">最近上门时间：</div>
                      <div class="ipu-flex-col info-type-state">2018-11-09</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">联系方式：</div>
                      <div class="ipu-flex-col info-type-state">138****1234</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">宽带使用时长：</div>
                      <div class="ipu-flex-col info-type-state">0年</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">宽带月使用流量：</div>
                      <div class="ipu-flex-col info-type-state">0G</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">是否办理家庭组网：</div>
                      <div class="ipu-flex-col info-type-state">否</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">是否为质差用户：</div>
                      <div class="ipu-flex-col info-type-state">否</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">到期时间：</div>
                      <div class="ipu-flex-col info-type-state">2020-05-31</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name info-background-white">装机时间：</div>
                      <div class="ipu-flex-col info-type-state">2018-04-01</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">受限期限：</div>
                      <div class="ipu-flex-col info-type-state">2020-05-31</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">每月返还话费：</div>
                      <div class="ipu-flex-col info-type-state">30元</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">小区名称：</div>
                      <div class="ipu-flex-col info-type-state">丽江花园</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">接入方式：</div>
                      <div class="ipu-flex-col info-type-state">FFTH</div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">异网号码数量：</div>
                      <div class="ipu-flex-col info-type-state">2</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">用户达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-right"></div></div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">套餐达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-right"></div></div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                      <div class="ipu-flex-col-auto info-type-name">产品达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-right"></div></div>
                    </div>
                    <div class="ipu-flex info-type">
                      <div class="ipu-flex-col-auto info-type-name">V网达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-wrong"></div></div>
                    </div>
                  </div>
                  <div class="ipu-flex info-fold ipu-flex-justify-center ipu-flex-align-center">
                    <div class="ipu-flex-col info-fold-text">展开查看更多</div>
                    <div class="ipu-flex-col info-unfold-icon"></div>
                  </div>
                </div>
                <div class="kdyh-content kdyh-content-padding" id="target21">
                  <div class="ipu-flex ipu-flex-justify-start ipu-flex-align-center">
                    <div class="title-tag"></div>
                    <div class="title">营销策略1</div>
                  </div>
                  <div>
                    <div class="mission-sell">
                      <div class="ipu-flex ipu-flex-align-center">
                        <div class="mission-sheji"></div>
                        <div class="mission-sell-title">营销话术</div>
                      </div>
                      <div class="mission-sell-content">
                        <span class="mission-sell-tag">宽带保养-宽带到期：</span>
                        您的宽带下个月即将到期，为不影响使用，建议尽快续费。为了方便您办理，我可以在您方便的时候上门服务…
                      </div>
                    </div>
                    <!--<div class="sub-title">用户画像</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月瀛湖手厅高频业务查询次数-月：</div>-->
                      <!--<div class="information-value">3</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月用户网厅高频业务查询次数-月：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key"> 当月用户全渠道业务办理接触次数-日：</div>-->
                      <!--<div class="information-value">1</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月用户全渠道加油包订购次数-日：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space can-hidden">-->
                      <!--<div class="information-key"> 当月用户手厅流量包订购次数-日：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space can-hidden">-->
                      <!--<div class="information-key">当月用户收听主套餐订购次数：</div>-->
                      <!--<div class="information-value">1</div>-->
                    <!--</div>-->
                    <div class="sub-title">营销推荐</div>
                    <div class="ipu-flex ipu-flex-justify-space ipu-flex-align-center information" >
                      <div class="information-key information-key-inline information-width">TC（RWY68-198，ZX288-388) 优惠【1级，受限12个月】</div>
                      <div class="business-handling">点击办理</div>
                    </div>
                    <ul>
                      <li class="information-value step-un-finish">尊享388（限12月）+返60元*12</li>
                      <li class="information-value step-un-finish">尊享288（限12月）+返50元*12</li>
                      <li class="information-value step-un-finish">任138（限12月）+返30元*12</li>
                      <li class="information-value step-un-finish">任198（限12月）+200分钟*12月（延1月）</li>
                    </ul>
                    <!--<div class="sub-title">营销话术</div>-->
                    <!--<div>-->
                      <!--<div class="ipu-flex ipu-flex-justify-center information">-->
                        <!--<div class="information-key information-key-inline" >感谢您选择我们移动宽带，我是您的宽带管家小王，后续宽带使用有问题可以随时找我，如果公司有新的优惠我会第一时间推荐给您。</div>-->
                      <!--</div>-->
                    <!--</div>-->
                  </div>
                </div>
                <div class="kdyh-content kdyh-content-padding" id="target22">
                  <div class="ipu-flex ipu-flex-justify-start ipu-flex-align-center">
                    <div class="title-tag"></div>
                    <div class="title">营销策略2</div>
                  </div>
                  <div>
                    <div class="mission-sell">
                      <div class="ipu-flex ipu-flex-align-center">
                        <div class="mission-sheji"></div>
                        <div class="mission-sell-title">营销话术</div>
                      </div>
                      <div class="mission-sell-content">
                        <span class="mission-sell-tag">宽带保养-宽带到期：</span>
                        您的宽带下个月即将到期，为不影响使用，建议尽快续费。为了方便您办理，我可以在您方便的时候上门服务…
                      </div>
                    </div>
                    <!--<div class="sub-title">用户画像</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月瀛湖手厅高频业务查询次数-月：</div>-->
                      <!--<div class="information-value">3</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月用户网厅高频业务查询次数-月：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key"> 当月用户全渠道业务办理接触次数-日：</div>-->
                      <!--<div class="information-value">1</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月用户全渠道加油包订购次数-日：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space can-hidden">-->
                      <!--<div class="information-key"> 当月用户手厅流量包订购次数-日：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space can-hidden">-->
                      <!--<div class="information-key">当月用户收听主套餐订购次数：</div>-->
                      <!--<div class="information-value">1</div>-->
                    <!--</div>-->
                    <div class="sub-title">营销推荐</div>
                    <div class="ipu-flex ipu-flex-justify-space ipu-flex-align-center information" >
                      <div class="information-key information-key-inline information-width">TC（RWY68-198，ZX288-388) 优惠【1级，受限12个月】</div>
                      <div class="business-handling">点击办理</div>
                    </div>
                    <ul>
                      <li class="information-value step-un-finish">尊享388（限12月）+返60元*12</li>
                      <li class="information-value step-un-finish">尊享288（限12月）+返50元*12</li>
                      <li class="information-value step-un-finish">任138（限12月）+返30元*12</li>
                      <li class="information-value step-un-finish">任198（限12月）+200分钟*12月（延1月）</li>
                    </ul>
                    <!--<div class="sub-title">营销话术</div>-->
                    <!--<div>-->
                      <!--<div class="ipu-flex ipu-flex-justify-center information">-->
                        <!--<div class="information-key information-key-inline" >感谢您选择我们移动宽带，我是您的宽带管家小王，后续宽带使用有问题可以随时找我，如果公司有新的优惠我会第一时间推荐给您。</div>-->
                      <!--</div>-->
                    <!--</div>-->
                  </div>
                </div>
                <div class="kdyh-content kdyh-content-padding" id="target23">
                  <div class="ipu-flex ipu-flex-justify-start ipu-flex-align-center">
                    <div class="title-tag"></div>
                    <div class="title">营销策略3</div>
                  </div>
                  <div>
                    <div class="mission-sell">
                      <div class="ipu-flex ipu-flex-align-center">
                        <div class="mission-sheji"></div>
                        <div class="mission-sell-title">营销话术</div>
                      </div>
                      <div class="mission-sell-content">
                        <span class="mission-sell-tag">宽带保养-宽带到期：</span>
                        您的宽带下个月即将到期，为不影响使用，建议尽快续费。为了方便您办理，我可以在您方便的时候上门服务…
                      </div>
                    </div>
                    <!--<div class="sub-title">用户画像</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月瀛湖手厅高频业务查询次数-月：</div>-->
                      <!--<div class="information-value">3</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月用户网厅高频业务查询次数-月：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key"> 当月用户全渠道业务办理接触次数-日：</div>-->
                      <!--<div class="information-value">1</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space">-->
                      <!--<div class="information-key">当月用户全渠道加油包订购次数-日：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space can-hidden">-->
                      <!--<div class="information-key"> 当月用户手厅流量包订购次数-日：</div>-->
                      <!--<div class="information-value">0</div>-->
                    <!--</div>-->
                    <!--<div class="ipu-flex ipu-flex-justify-space can-hidden">-->
                      <!--<div class="information-key">当月用户收听主套餐订购次数：</div>-->
                      <!--<div class="information-value">1</div>-->
                    <!--</div>-->
                    <div class="sub-title">营销推荐</div>
                    <div class="ipu-flex ipu-flex-justify-space ipu-flex-align-center information" >
                      <div class="information-key information-key-inline information-width">TC（RWY68-198，ZX288-388) 优惠【1级，受限12个月】</div>
                      <div class="business-handling">点击办理</div>
                    </div>
                    <ul>
                      <li class="information-value step-un-finish">尊享388（限12月）+返60元*12</li>
                      <li class="information-value step-un-finish">尊享288（限12月）+返50元*12</li>
                      <li class="information-value step-un-finish">任138（限12月）+返30元*12</li>
                      <li class="information-value step-un-finish">任198（限12月）+200分钟*12月（延1月）</li>
                    </ul>
                    <!--<div class="sub-title">营销话术</div>-->
                    <!--<div>-->
                      <!--<div class="ipu-flex ipu-flex-justify-center information">-->
                        <!--<div class="information-key information-key-inline" >感谢您选择我们移动宽带，我是您的宽带管家小王，后续宽带使用有问题可以随时找我，如果公司有新的优惠我会第一时间推荐给您。</div>-->
                      <!--</div>-->
                    <!--</div>-->
                  </div>
                </div>
                <div
                        class="submit-reserve">
                  下一步
                </div>
              </div>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>
<!-- 这里是遮罩层的div，给他相对于body的绝对定位，然后隐藏，z-index:98 -->
<div class="pop-shadow"></div>
<!-- 这个是弹窗的div，给他相对于浏览器的绝对定位，层级比遮罩层高，z-index:99 -->
<div class="pop">
  <div>
    <div class="pop-bg">
      <div class="ipu-flex ipu-flex-justify-end pop-bg-pic">
        <div class="pop-close"></div>
      </div>
    </div>
    <div class="pop-content">
      业务信息已传送至<span>和行销APP</span>,请打开<span>和行销APP</span>为用户办理。
    </div>
    <div class="ipu-flex ipu-flex-justify-center">
      <div class="pop-button">知道了</div>
    </div>
  </div>
</div>
</body>
</html>

2019/ah-hsx/kd-new-step-two.html

@@ -0,0 +1,151 @@
<!DOCTYPE html>
<html lang="en">
<head>
  <title>宽带新装</title>
  <meta charset="utf-8">
  <!-- 宽度自动适配 -->
  <meta name="viewport"
        content="width=device-width, initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0, user-scalable=no"/>
  <!-- 不识别页面上的数字为可拨打号码 -->
  <meta content="telephone=no" name="format-detection"/>
  <link rel="stylesheet" type="text/css" href="ipu/ui/css/ipuUI.css">
  <link rel="stylesheet" type="text/css" href="biz/css/base.css">
  <script src="ipu/lib/requirejs/require.min.js"></script>
  <script src="biz/js/require-config.js"></script>
  <script src="biz/js/step-three.js"></script>
</head>
<body class="pages-step-three kd-new-install">
<div class="ipu-flex-row ipu-flex-vertical">
  <div class="ipu-flex-col">
    <div class="ipu-toolbar">
      <a class="ipu-fn-left link-back ipu-flex ipu-flex-align-center" href="javascript:history.back(-1);">
        <div class="left-back"></div>
      </a>
      <h1 class="ipu-toolbar-title">宽带新装
      </h1>
    </div>
  </div>
  <div class="ipu-flex-col ipu-flex-col-auto">
    <div class="ipu-flex mission-content">
      <div class="mission-female-person mission-person-margin"></div>
      <div class="ipu-flex-col-auto">
        <div class="ipu-flex  ipu-flex-justify-space">
          <div class="mission-person-name">王心怡</div>
          <div class="mission-state">
            <div class="phone-pic"></div>
          </div>
        </div>
        <div class="ipu-flex">
          <div class="ipu-flex-col mission-content-tag">装机地址：</div>
          <div class="ipu-flex-col-auto mission-content-value">合肥市蜀山区长江西路125号</div>
        </div>
        <div class="ipu-flex">
          <div class="ipu-flex-col mission-content-tag">最近上门：</div>
          <div class="ipu-flex-col-auto mission-content-value">6月9日 15:30-16:30</div>
        </div>
        <div class="ipu-flex">
          <div class="ipu-flex-col mission-content-tag">上门次数：</div>
          <div class="ipu-flex-col-auto mission-content-value">2</div>
        </div>
      </div>
    </div>
    <div class="ipu-flex  ipu-flex-justify-space step-content">
      <div class="ipu-flex-vertical  ipu-flex ipu-flex-justify-center ipu-flex-align-center">
        <div class="true-pic"></div>
        <div class="step-value">上门前必看</div>
      </div>
      <div class="step-1to2 step-finish new-install-step"></div>
      <div class="ipu-flex-vertical ipu-flex ipu-flex-justify-center ipu-flex-align-center">
        <div class="true-pic"></div>
        <div class="step-value">上门后必做</div>
      </div>
      <div class="step-2to3 step-finish new-install-step"></div>
      <div class="ipu-flex-vertical ipu-flex ipu-flex-justify-center ipu-flex-align-center">
        <div class="step-num">3</div>
        <div class="step-value">上门必推荐</div>
      </div>
      <div class="step-3to4 step-un-finish new-install-step"></div>
      <div class="ipu-flex-vertical ipu-flex ipu-flex-justify-center ipu-flex-align-center">
        <div class="step-num">4</div>
        <div class="step-value">完工必确认</div>
      </div>
    </div>
    <div class="back-white">
      <div class="finish-title">上门完成情况</div>
      <div>
        <div class="ipu-flex ipu-flex-justify-space finish-list">
          <div class="ipu-flex">
            <div class="finish-list-num">1</div>
            <div class="finish-list-value">路由器安装调测</div>
          </div>
          <div class="finish-true-pic"></div>
        </div>
        <div class="ipu-flex ipu-flex-justify-space finish-list" >
          <div class="ipu-flex">
            <div class="finish-list-num">2</div>
            <div class="finish-list-value">测入户线光功率衰减</div>
          </div>
          <div class="finish-true-pic"></div>
        </div>
        <div class="ipu-flex ipu-flex-justify-space finish-list" >
          <div class="ipu-flex">
            <div class="finish-list-num">3</div>
            <div class="finish-list-value">测智能网关+路由器有线口网速</div>
          </div>
          <div class="finish-true-pic"></div>
        </div>
        <div class="ipu-flex ipu-flex-justify-space finish-list" >
          <div class="ipu-flex">
            <div class="finish-list-num">4</div>
            <div class="finish-list-value">测路由器WIFI信号覆盖及网速</div>
          </div>
          <div class="finish-true-pic"></div>
        </div>
        <div class="ipu-flex ipu-flex-justify-space finish-list" >
          <div class="ipu-flex">
            <div class="finish-list-num">5</div>
            <div class="finish-list-value">网线水晶头老化检查</div>
          </div>
          <div class="finish-true-pic"></div>
        </div>
        <div class="ipu-flex ipu-flex-justify-space finish-list" >
          <div class="ipu-flex">
            <div class="finish-list-num">6</div>
            <div class="finish-list-value">升级智能网关</div>
          </div>
          <div class="finish-true-pic"></div>
        </div>
        <div class="ipu-flex ipu-flex-justify-space finish-list" >
          <div class="ipu-flex">
            <div class="finish-list-num">7</div>
            <div class="finish-list-value">互联网电视操作指导</div>
          </div>
          <div class="finish-true-pic finish-true-pic"></div>
        </div>
        <div class="ipu-flex ipu-flex-justify-space finish-list" >
          <div class="ipu-flex">
            <div class="finish-list-num">8</div>
            <div class="finish-list-value">互联网电视清理优化</div>
          </div>
          <div class="finish-true-pic finish-false-pic"></div>
        </div>
        <div class="ipu-flex ipu-flex-justify-space finish-list">
          <div class="ipu-flex">
            <div class="finish-list-num">9</div>
            <div class="finish-list-value">互联网电视无线改有线</div>
          </div>
          <div class="finish-true-pic finish-false-pic"></div>
        </div>
      </div>
      <div class="ipu-flex bottom-button">
        <div class="last-step">上一步</div>
        <div class="next-step">下一步</div>
      </div>
    </div>
  </div>
</div>
</div>
</body>
</html>

2019/ah-hsx/kd-upkeep-step-four.html

@@ -77,6 +77,62 @@
        <div class="step-value">完成必确认</div>
      </div>
    </div>
    <div class="back-white finish-list-content">
      <div class="finish-title">上门完成情况</div>
      <div class="finish-content">
        <div class="ipu-flex ipu-flex-justify-space finish-list">
          <div class="ipu-flex">
            <div class="finish-list-num">1</div>
            <div class="finish-list-value">路由器安装调测</div>
          </div>
          <div class="finish-true-pic"></div>
        </div>
        <div class="ipu-flex ipu-flex-justify-space finish-list">
          <div class="ipu-flex">
            <div class="finish-list-num">2</div>
            <div class="finish-list-value">测入户线光功率衰减</div>
          </div>
          <div class="finish-true-pic"></div>
        </div>
        <div class="ipu-flex ipu-flex-justify-space finish-list">
          <div class="ipu-flex">
            <div class="finish-list-num">3</div>
            <div class="finish-list-value">测智能网关+路由器有线口网速</div>
          </div>
          <div class="finish-true-pic"></div>
        </div>
        <div class="ipu-flex ipu-flex-justify-space finish-list">
          <div class="ipu-flex">
            <div class="finish-list-num">4</div>
            <div class="finish-list-value">测路由器WIFI信号覆盖及网速</div>
          </div>
          <div class="finish-true-pic"></div>
        </div>
        <div class="ipu-flex ipu-flex-justify-space finish-list">
          <div class="ipu-flex">
            <div class="finish-list-num">5</div>
            <div class="finish-list-value">网线水晶头老化检查</div>
          </div>
          <div class="finish-true-pic"></div>
        </div>
        <div class="ipu-flex ipu-flex-justify-space finish-list">
          <div class="ipu-flex">
            <div class="finish-list-num">6</div>
            <div class="finish-list-value">升级智能网关</div>
          </div>
          <div class="finish-true-pic"></div>
        </div>
        <div class="ipu-flex ipu-flex-justify-space finish-list">
          <div class="ipu-flex">
            <div class="finish-list-num">7</div>
            <div class="finish-list-value">互联网电视操作指导</div>
          </div>
          <div class="finish-true-pic finish-true-pic"></div>
        </div>
      </div>
    </div>
    <div class="back-white">
      <div class="finish-title">验证上门打卡码</div>
      <div>

2019/ah-hsx/kd-upkeep-step-two.html

@@ -192,19 +192,19 @@
                      <div class="ipu-flex-col-auto info-type-name">异网号码数量：</div>
                      <div class="ipu-flex-col info-type-state">2</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                    <div class="ipu-flex info-type info-background-white reach-item">
                      <div class="ipu-flex-col-auto info-type-name">用户达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-right"></div></div>
                    </div>
                    <div class="ipu-flex info-type">
                    <div class="ipu-flex info-type reach-item">
                      <div class="ipu-flex-col-auto info-type-name">套餐达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-right"></div></div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                    <div class="ipu-flex info-type info-background-white reach-item">
                      <div class="ipu-flex-col-auto info-type-name">产品达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-right"></div></div>
                    </div>
                    <div class="ipu-flex info-type">
                    <div class="ipu-flex info-type reach-item">
                      <div class="ipu-flex-col-auto info-type-name">V网达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-wrong"></div></div>
                    </div>
@@ -508,19 +508,19 @@
                      <div class="ipu-flex-col-auto info-type-name">异网号码数量：</div>
                      <div class="ipu-flex-col info-type-state">2</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                    <div class="ipu-flex info-type info-background-white reach-item">
                      <div class="ipu-flex-col-auto info-type-name">用户达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-right"></div></div>
                    </div>
                    <div class="ipu-flex info-type">
                    <div class="ipu-flex info-type reach-item">
                      <div class="ipu-flex-col-auto info-type-name">套餐达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-right"></div></div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                    <div class="ipu-flex info-type info-background-white reach-item">
                      <div class="ipu-flex-col-auto info-type-name">产品达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-right"></div></div>
                    </div>
                    <div class="ipu-flex info-type">
                    <div class="ipu-flex info-type reach-item">
                      <div class="ipu-flex-col-auto info-type-name">V网达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-wrong"></div></div>
                    </div>
@@ -761,19 +761,19 @@
                      <div class="ipu-flex-col-auto info-type-name">异网号码数量：</div>
                      <div class="ipu-flex-col info-type-state">2</div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                    <div class="ipu-flex info-type info-background-white reach-item">
                      <div class="ipu-flex-col-auto info-type-name">用户达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-right"></div></div>
                    </div>
                    <div class="ipu-flex info-type">
                    <div class="ipu-flex info-type reach-item">
                      <div class="ipu-flex-col-auto info-type-name">套餐达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-right"></div></div>
                    </div>
                    <div class="ipu-flex info-type info-background-white">
                    <div class="ipu-flex info-type info-background-white reach-item">
                      <div class="ipu-flex-col-auto info-type-name">产品达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-right"></div></div>
                    </div>
                    <div class="ipu-flex info-type">
                    <div class="ipu-flex info-type reach-item">
                      <div class="ipu-flex-col-auto info-type-name">V网达标：</div>
                      <div class="ipu-flex-col info-type-state"><div class=" information-value-wrong"></div></div>
                    </div>
@@ -984,7 +984,7 @@
<div class="pop-shadow"></div>
<!-- 这个是弹窗的div，给他相对于浏览器的绝对定位，层级比遮罩层高，z-index:99 -->
<div class="pop">
<div class="pop business-msg">
  <div>
    <div class="pop-bg">
      <div class="ipu-flex ipu-flex-justify-end pop-bg-pic">
@@ -999,5 +999,35 @@
    </div>
  </div>
</div>
<div class="pop reach-msg">
  <div>
    <div class="">
      <div class="ipu-flex ipu-flex-justify-end">
        <div class="pop-close"></div>
      </div>
    </div>
    <div class="pop-content">
      <div class="reach-msg-item">
        <span class="reach-msg-item-key">用户达标：</span>家庭中的手机都是移动用户则用户达标
      </div>
      <div class="reach-msg-item">
        <span class="reach-msg-item-key">套餐达标：</span>家庭中的手机都是移动用户（包含融合群副卡）都是不限量套餐则套餐达标
      </div>
      <div class="reach-msg-item">
        <span class="reach-msg-item-key">产品达标：</span>家庭有订购移动互联网电视则用户达标
      </div>
      <div class="reach-msg-item">
        <span class="reach-msg-item-key">V网达标：</span>
      </div>
      <div class="reach-msg-item">
        <span class="reach-msg-item-key">地址类型为家庭：</span>家庭中的移动手机用户都是家庭V网成员则V网达标
      </div>
      <div class="reach-msg-item">
        <span class="reach-msg-item-key">地址类型为聚类：</span>无该达标项
      </div>
    </div>
  </div>
</div>
</body>
</html>