@zengqiao@异网相关页面

2019/bj-zqzt/biz/css/base.css

@@ -841,7 +841,7 @@
  color:rgba(43,47,51,1);
  line-height: .16rem;
}
.task-item .task-desc{
.task-desc {
  margin-left:.06rem;
  padding-left: .05rem;
  padding-right: .05rem;
@@ -889,25 +889,61 @@
.task-btn.ipu-active {
  opacity: .7;
}
.business-info-content .task-item{
  margin:0;
.normal-customer-item {
  background:rgba(255,255,255,1);
  box-shadow:0 0 .04rem 0 rgba(196,200,204,0.4);
  border:1px solid rgba(240,242,245,1);
  padding:.16rem .16rem .16rem .12rem;
}
.business-info-content>.task-item:not(:last-child){
.normal-customer-item:not(:last-child){
  margin-bottom:.12rem;
}
.business-info-content .task-item .task-btn{
  margin-top: .285rem;
  margin-right: .16rem;
.normal-customer-item .business-pic{
  width: .16rem;
  height: .16rem;
  background: url(../img/money-bulb.png) center center no-repeat;
  background-size: contain;
  align-self: flex-start;
}
.normal-customer-item .different-net-pic{
  width: .16rem;
  height: .16rem;
  background: url(../img/different-net.png) center center no-repeat;
  background-size: contain;
  align-self: flex-start;
}
.normal-customer-price {
  font-size: .1rem;
  color: #FFA842;
  font-weight:400;
  line-height: .12rem;
  margin-left:.15rem;
}
.normal-customer-content {
  margin-left:.12rem;
  overflow: unset;
}
.normal-customer-title {
  font-size: .15rem;
  font-weight: 400;
  color: rgba(43,47,51,1);
  line-height: .16rem;
  overflow: unset;
}
.task-resource-time {
  padding:.08rem 0 .16rem .34rem;
.normal-customer-desc {
  margin-top:.08rem;
  font-size: .12rem;
  font-weight:400;
  color:rgba(142,147,153,1);
  line-height: .12rem;
}
.task-resource-time>div:not(:last-child){
  margin-bottom: .06rem;
.arrow-right-btn {
  width: .12rem;
  height: .12rem;
  background: url(../img/arrow-right3.png) center center no-repeat;
  background-size: contain;
  margin-left:.15rem;
  margin-right:.16rem;
}
/*开发票*/
.pages-invoice-list,.pages-invoice-filling{
@@ -3872,7 +3908,7 @@ button.add-others {
  line-height: .12rem;
  margin-left: .04rem;
}
.business-info-area,.special-examining-area,.service-info-area,.order-info-area {
.business-info-area,.special-examining-area,.service-info-area,.order-info-area,.different-nets-info-area {
  margin-top:.08rem;
  padding: .2rem;
  background-color:rgba(255,255,255,1);
@@ -7273,3 +7309,17 @@ ul li .details-info {
  margin-right:0;
  margin-left:.05rem;
}
/*异网信息列表*/
.net-item-content {
  padding:.18rem .2rem;
  background-color: #fff;
  margin-bottom: 1px;
}
.net-item-content .normal-customer-desc {
  font-size: .13rem;
  line-height: .13rem;
}
.pages-different-nets-list .card-action-item {
  height: .94rem;
  line-height: .94rem;
}

2019/bj-zqzt/biz/js/customer-details-established.js

@@ -240,6 +240,11 @@ require(['jquery', 'ipuUI', 'echarts'], function ($, ipuUI, echarts) {
      location.href = "";
    });
    // 点击异网信息更多
    $(".different-nets-info-area .customer-more-btn").click(function () {
      location.href = "different-nets-list.html";
    });
    // 点击特殊资费详情更多
    $(".special-examining-area .customer-more-btn").click(function () {
      location.href = "special-cost-examine-list.html";
@@ -250,12 +255,22 @@ require(['jquery', 'ipuUI', 'echarts'], function ($, ipuUI, echarts) {
      location.href = "customer-details-service-info.html";
    });
    // 点击选项，打开商机信息详情界面
    $(".business-info-content").on("click", ".normal-customer-item", function () {
    });
    // 点击选项，打开异网信息详情界面
    $(".different-nets-info-content").on("click", ".normal-customer-item", function () {
    });
    // 点击选项，打开特殊资费审核详情界面
    $(".special-examining-content").on("click", ".special-examining-item", function () {
      location.href = "special-cost-examine-details.html";
    });
    // 业务信息售前列表 点击事件
    // 业务信息售前、售中列表 点击事件
    $(document).on("click",".before-sales-item",function () {
      location.href = "before-sales-details.html";
    });

2019/bj-zqzt/biz/js/different-nets-details.js

@@ -0,0 +1,54 @@
require(['jquery', 'ipuUI',], function ($, ipuUI) {
  $(function () {
    // 工具栏弹层
    // 工具栏更多按钮
    $(".tool-bar-more-btn").click(function () {
      $(".tool-bar-popup-slide").addClass("active");
    });
    // 点空白区域关闭工具栏弹层
    $(".tool-bar-popup-slide").click(function () {
      $(".tool-bar-popup-slide").removeClass("active");
    });
    //点击其他地方不做处理
    $(".tool-bar-popup-slide .tool-bar-popup-wrap").click(function () {
      return false;
    });
    // 编辑
    $("#edit").click(function () {
      $(".tool-bar-popup-slide").removeClass("active");
      ipuUI.toast("编辑");
    });
    // 删除
    $("#delete").click(function () {
      $(".tool-bar-popup-slide").removeClass("active");
      $(".normal-tips-popup-slide").addClass("active");
    });
    // 普通提示弹层
    // 取消
    $(".normal-tips-btn-cancel").click(function () {
      $(".normal-tips-popup-slide").removeClass("active");
    });
    // 确认
    $(".normal-tips-btn-confirm").click(function () {
      $(".normal-tips-popup-slide").removeClass("active");
      ipuUI.toast("删除");
    });
    // 点空白区域关闭普通提示弹层
    $(".normal-tips-popup-slide").click(function () {
      $(".normal-tips-popup-slide").removeClass("active");
    });
    //点击其他地方不做处理
    $(".normal-tips-popup-slide .normal-tips-popup-wrap").click(function () {
      return false;
    });
  });
});

2019/bj-zqzt/biz/js/different-nets-info-delete.js

@@ -0,0 +1,21 @@
require(['jquery', 'ipuUI',], function ($, ipuUI) {
  $(function () {
    // 取消
    $("#cancel").click(function () {
    });
    // 语音输入
    $(".voice-input-btn").click(function () {
      let $node = $(this).parents(".ipu-form-item").find(".contact-content");
      $node.val($node.val());
    });
    // 提交
    $(".common-btn").click(function () {
    });
  });
});

2019/bj-zqzt/biz/js/different-nets-info-edit.js

@@ -0,0 +1,48 @@
require(['jquery', 'ipuUI'], function ($, ipuUI) {
  $(function () {
    // 页面类型0：新增；1：编辑
    var pageType = 1;
    init();
    // 页面初始化
    function init() {
      if (pageType == 0) {// 新增
        $(".ipu-toolbar-title").text('新增异网信息')
      } else if (pageType == 1) {// 编辑
        $(".ipu-toolbar-title").text('编辑异网信息')
      }
    }
    // 取消
    $("#cancel").click(function () {
      console.log("返回");
    });
    // 时间
    var dataPickerData = ipuUI.dtPicker({type: "datetime", hasClear: true, beginDate: new Date()});
    $("#time-select").click(function () {
      let self = $(this).find("input");
      dataPickerData.show(function (sltDate, index) {
        if (index == 1) {// 确定按钮
          let slt = dataPickerData.getSelected();
          self.val(slt.text);
        } else if (index == 2) {// 清除按钮
          self.val("");
        }
      });
    });
    // 语音输入
    $(".voice-input-btn").click(function () {
      let $node = $(this).parents(".ipu-form-item").find(".contact-content");
      $node.val($node.val());
    });
    // 提交
    $(".common-btn").click(function () {
    });
  });
});

2019/bj-zqzt/biz/js/different-nets-list.js

@@ -0,0 +1,125 @@
require(['jquery', 'ipuUI', 'echarts', 'LeftSwipe'], function ($, ipuUI, echarts, LeftSwipe) {
  $(function () {
    // 刷新列表
    var search;
    showNetList();
    // 异网信息列表下拉刷新组件初始化
    function showNetList() {
      var totalPage = 3;  // 总页数
      var currentPage = 1;    // 当前显示第几页，因为默认有一些数据了，所以为1
      var listObj = $("#refresh ul.different-nets-list");
      var contentHtml = $("li.net-item:lt(5)", listObj).clone(); // 测试用，复制5条数据
      // 移除初始的数据，并初始nowPage=0;
      listObj.empty();
      currentPage = 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();
        currentPage++;
        var localCountNo = ++countNo;  // 执行查询前，保留当前计数器，当查询返回时进行检查是否最新查询，不是则抛弃查询结果
        setTimeout(function () { // 模拟延时加载
          if (localCountNo == countNo) { // 检查是否最新查询返回数据，不是则抛弃查询结果
            // 此处先更新togalPage等信息
            myRefresh.enableTop(totalPage != 0); // 假设totalPage为0时表示没数据，此时停用刷新功能，也可不停用，强行刷新
            myRefresh.enableBottom(currentPage < 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();  //最后调用
              }
              var leftSwipe = new LeftSwipe('.ipu-carousel');  // 组件依赖页面写的部分样式
            }
          }
        }, 1000);
      }
      // 下拉刷新
      function refreshData() {   // 刷新数据
        currentPage = 0; // 底部加载时，停用底部加载功能和底部加载
        myRefresh.enableBottom(false);
        if (myRefresh.bottomLoading) {
          myRefresh.endBottomLoading();
        }
        addData(true);
      }
      // 非下拉刷新列表
      search = function searchData() {   // 刷新数据
        myRefresh.enableBottom(false);
        if (myRefresh.bottomLoading) {
          myRefresh.endBottomLoading();
        }
        myRefresh.enableTop(false);
        if (myRefresh.topLoading) {
          myRefresh.endTopLoading();
        }
        currentPage = 0;
        listObj.empty();
        myRefresh.enableBottom(true);
        myRefresh.refresh();
      }
    }
    // 点击列表选项
    $(".different-nets-list").on("click", ".net-item-content", function () {
      // location.href = "building-details.html"
    });
    // 选项操作点击
    $(".different-nets-list").on("click", ".card-action-item", function () {
      let option = $.trim($(this).text());
      if (option === "编辑") {
      } else if (option === "删除") {
        $(".normal-tips-popup-slide").addClass("active");
      }
    });
    // 普通提示弹层
    // 取消
    $(".normal-tips-btn-cancel").click(function () {
      $(".normal-tips-popup-slide").removeClass("active");
    });
    // 确认
    $(".normal-tips-btn-confirm").click(function () {
      $(".normal-tips-popup-slide").removeClass("active");
      // 删除后刷新列表
      search();
    });
    // 新增异网信息
    $(".add-customer").click(function () {
    });
    // 新增后回调刷新列表
    // search();
  });
});

2019/bj-zqzt/customer-details-established.html

@@ -105,48 +105,84 @@
      </div>
      <div class="business-info-content">
        <div class="task-item ipu-flex ipu-flex-justify-space">
          <div class="ipu-flex-col task-info">
        <div class="normal-customer-item ipu-flex ipu-flex-align-center">
          <div class="business-pic"></div>
          <div class="ipu-flex-grow-1 normal-customer-content">
            <div class="ipu-flex ipu-flex-align-center">
              <div class="task-type-pic business-pushing"></div>
              <div class="task-type">50M企业宽带</div>
              <div class="normal-customer-title ipu-flex-grow-1">50M企业宽带</div>
              <div class="task-desc task-warning">暂不上报</div>
            </div>
            <div class="task-resource-time">
              <div>来源：网罗天下</div>
              <div>跟进时间：2020-01-20</div>
            </div>
            <div class="normal-customer-desc">来源：网罗天下</div>
            <div class="normal-customer-desc">跟进时间：2020-01-20</div>
          </div>
          <div class="task-btn">看详情</div>
          <div class="arrow-right-btn"></div>
        </div>
        <div class="task-item ipu-flex ipu-flex-justify-space">
          <div class="ipu-flex-col task-info">
        <div class="normal-customer-item ipu-flex ipu-flex-align-center">
          <div class="business-pic"></div>
          <div class="ipu-flex-grow-1 normal-customer-content">
            <div class="ipu-flex ipu-flex-align-center">
              <div class="task-type-pic business-pushing"></div>
              <div class="task-type">100M企业宽带</div>
            </div>
            <div class="task-resource-time">
              <div>来源：1008688转派</div>
              <div>跟进时间：2020-01-20</div>
              <div class="normal-customer-title ipu-flex-grow-1">100M企业宽带</div>
            </div>
            <div class="normal-customer-desc">来源：1008688转派</div>
            <div class="normal-customer-desc">跟进时间：2020-01-20</div>
          </div>
          <div class="task-btn">看详情</div>
          <div class="arrow-right-btn"></div>
        </div>
        <div class="task-item ipu-flex ipu-flex-justify-space">
          <div class="ipu-flex-col task-info">
        <div class="normal-customer-item ipu-flex ipu-flex-align-center">
          <div class="business-pic"></div>
          <div class="ipu-flex-grow-1 normal-customer-content">
            <div class="ipu-flex ipu-flex-align-center">
              <div class="task-type-pic business-pushing"></div>
              <div class="task-type">50M企业宽带</div>
            </div>
            <div class="task-resource-time">
              <div>来源：1008688转派</div>
              <div>跟进时间：2020-01-20</div>
              <div class="normal-customer-title ipu-flex-grow-1">50M企业宽带</div>
            </div>
            <div class="normal-customer-desc">来源：1008688转派</div>
            <div class="normal-customer-desc">跟进时间：2020-01-20</div>
          </div>
          <div class="task-btn">看详情</div>
          <div class="arrow-right-btn"></div>
        </div>
      </div>
    </div>
    <div class="different-nets-info-area">
      <div class="customer-normal-head ipu-flex ipu-flex-justify-space ipu-flex-align-center">
        <div class="ipu-flex ipu-flex-align-center">
          <div class="customer-normal-title">异网信息</div>
          <div class="customer-normal-num">(<span>6</span>)</div>
        </div>
        <div class="customer-more-btn ipu-flex ipu-flex-align-center">
          <span>更多</span>
          <i class="iconfont-material icon-chevron-right more-btn"></i>
        </div>
      </div>
      <div class="different-nets-info-content">
        <div class="normal-customer-item ipu-flex ipu-flex-align-center">
          <div class="different-net-pic"></div>
          <div class="ipu-flex-grow-1 normal-customer-content">
            <div class="normal-customer-title">异网单位名称：联通</div>
            <div class="normal-customer-desc">业务信息: 数字传输专线<span class="normal-customer-price">19.2元</span></div>
            <div class="normal-customer-desc">到期时间: 2020-02-21 13:34:21</div>
          </div>
          <div class="arrow-right-btn"></div>
        </div>
        <div class="normal-customer-item ipu-flex ipu-flex-align-center">
          <div class="different-net-pic"></div>
          <div class="ipu-flex-grow-1 normal-customer-content">
            <div class="normal-customer-title">异网单位名称：联通</div>
            <div class="normal-customer-desc">业务信息: 数字传输专线<span class="normal-customer-price">19.2元</span></div>
            <div class="normal-customer-desc">到期时间: 2020-02-21 13:34:21</div>
          </div>
          <div class="arrow-right-btn"></div>
        </div>
        <div class="normal-customer-item ipu-flex ipu-flex-align-center">
          <div class="different-net-pic"></div>
          <div class="ipu-flex-grow-1 normal-customer-content">
            <div class="normal-customer-title">异网单位名称：联通</div>
            <div class="normal-customer-desc">业务信息: 数字传输专线<span class="normal-customer-price">19.2元</span></div>
            <div class="normal-customer-desc">到期时间: 2020-02-21 13:34:21</div>
          </div>
          <div class="arrow-right-btn"></div>
        </div>
      </div>
    </div>
    <div class="special-examining-area">

2019/bj-zqzt/different-nets-details.html

@@ -0,0 +1,84 @@
<!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/different-nets-details.js"></script>
</head>
<body class="pages-different-nets-details">
<div class="ipu-flex-row ipu-flex-vertical">
  <div class="ipu-flex-col common-border-bottom">
    <div class="ipu-toolbar">
      <a class="ipu-fn-left link-back ipu-flex ipu-flex-align-center" href="javascript:;" id="back">
        <div class="left-back"></div>
      </a>
      <h1 class="ipu-toolbar-title">异网信息详情</h1>
      <div class="tool-bar-more-btn"></div>
    </div>
  </div>
  <div class="ipu-flex-col ipu-flex-col-auto">
    <div class="normal-content-area">
      <div class="normal-content-title">基础信息</div>
      <div class="normal-content-item ipu-flex">
        <div class="normal-content-tag ipu-flex-col">异网单位名称</div>
        <div class="normal-content-value ipu-flex-col-auto">歌华</div>
      </div>
      <div class="normal-content-item ipu-flex">
        <div class="normal-content-tag ipu-flex-col">业务信息</div>
        <div class="normal-content-value ipu-flex-col-auto">数字传输专线</div>
      </div>
      <div class="normal-content-item ipu-flex">
        <div class="normal-content-tag ipu-flex-col">业务资费</div>
        <div class="normal-content-value ipu-flex-col-auto">1000元</div>
      </div>
      <div class="normal-content-item ipu-flex">
        <div class="normal-content-tag ipu-flex-col">套餐类型</div>
        <div class="normal-content-value ipu-flex-col-auto">月套餐</div>
      </div>
      <div class="normal-content-item ipu-flex">
        <div class="normal-content-tag ipu-flex-col">业务到期时间</div>
        <div class="normal-content-value ipu-flex-col-auto">2020-02-21 13:21:23</div>
      </div>
      <div class="normal-content-item ipu-flex">
        <div class="normal-content-tag ipu-flex-col">其他信息</div>
        <div class="normal-content-value ipu-flex-col-auto">这里是备注的内容这里是备注的内容这里是备注这里是备注的内容这里是备注的内容这里是备注这里是备注的内容这里是备注的内容这里是备注这里是备注的内容这里是备注的内容这里是备注</div>
      </div>
    </div>
  </div>
</div>
<!--工具栏弹层-->
<div class="tool-bar-popup-slide">
  <div class="tool-bar-popup-wrap">
    <div class="tool-bar-popup-arrow"></div>
    <div class="tool-bar-popup-item" id="edit">编辑</div>
    <div class="tool-bar-popup-item" id="delete">删除</div>
  </div>
</div>
<!--普通提示弹层-->
<div class="normal-tips-popup-slide">
  <div class="normal-tips-popup-wrap">
    <div class="normal-tips-content">确认删除该信息，进入异网信息<br/>删除审批流程？</div>
    <div class="normal-tips-btn ipu-flex ipu-flex-align-center">
      <div class="normal-tips-btn-cancel">取消</div>
      <div class="normal-tips-btn-confirm">确定</div>
    </div>
  </div>
</div>
</body>
</html>

2019/bj-zqzt/different-nets-info-delete.html

@@ -0,0 +1,103 @@
<!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/different-nets-info-delete.js"></script>
</head>
<body class="pages-different-nets-info-delete main-body-bg-grey">
<div class="ipu-flex-row ipu-flex-vertical">
  <div class="ipu-flex-col common-border-bottom">
    <div class="ipu-toolbar">
      <a class="ipu-fn-left link-back ipu-flex ipu-flex-align-center" href="javascript:;" id="back">
        <div class="left-back"></div>
      </a>
      <h1 class="ipu-toolbar-title">删除异网信息</h1>
      <div class="tool-bar-edit main-blue" id="cancel">取消</div>
    </div>
  </div>
  <div class="ipu-flex-col ipu-flex-col-auto">
    <div class="normal-content-area">
      <div class="normal-content-title">基础信息</div>
      <div class="normal-content-item ipu-flex">
        <div class="normal-content-tag ipu-flex-col">异网单位名称</div>
        <div class="normal-content-value ipu-flex-col-auto">歌华</div>
      </div>
      <div class="normal-content-item ipu-flex">
        <div class="normal-content-tag ipu-flex-col">业务信息</div>
        <div class="normal-content-value ipu-flex-col-auto">数字传输专线</div>
      </div>
      <div class="normal-content-item ipu-flex">
        <div class="normal-content-tag ipu-flex-col">业务资费</div>
        <div class="normal-content-value ipu-flex-col-auto">1000元</div>
      </div>
      <div class="normal-content-item ipu-flex">
        <div class="normal-content-tag ipu-flex-col">套餐类型</div>
        <div class="normal-content-value ipu-flex-col-auto">月套餐</div>
      </div>
      <div class="normal-content-item ipu-flex">
        <div class="normal-content-tag ipu-flex-col">业务到期时间</div>
        <div class="normal-content-value ipu-flex-col-auto">2020-02-21 13:21:23</div>
      </div>
      <div class="normal-content-item ipu-flex">
        <div class="normal-content-tag ipu-flex-col">其他信息</div>
        <div class="normal-content-value ipu-flex-col-auto">
          这里是备注的内容这里是备注的内容这里是备注这里是备注的内容这里是备注的内容这里是备注这里是备注的内容这里是备注的内容这里是备注这里是备注的内容这里是备注的内容这里是备注
        </div>
      </div>
    </div>
    <div class="normal-content-area" style="padding:0">
      <div class="ipu-form-item">
        <div class="common-border-bottom-white">
          <div class="ipu-flex ipu-flex-justify-space">
            <div class="item-key">操作原因：</div>
            <div class="voice-input-btn ipu-flex ipu-flex-align-center">
              <div class="voice-pic"></div>
              <div class="voice-text">语音输入</div>
            </div>
          </div>
          <div class="item-value">
            <textarea id="reason" class="contact-content mid-textarea" maxlength="300" placeholder="请输入原因"></textarea>
            <div class="item-value-textarea">
              <div class="text-statistic ipu-fn-hide"><span class="text-number">0</span>/300</div>
            </div>
          </div>
        </div>
        <div class="check-tips"></div>
      </div>
    </div>
    <div class="normal-content-area" style="padding:0">
      <div class="ipu-form-item">
        <div class="ipu-flex common-border-bottom-white">
          <div class="item-key">下一审批人：</div>
          <div class="item-value ipu-flex-col-auto">
            <div class="ipu-flex ipu-flex-justify-end ipu-flex-align-center">
              <input type="text" placeholder="请选择" readonly/>
              <div class="right-arrow"></div>
            </div>
          </div>
        </div>
        <div class="check-tips"></div>
      </div>
    </div>
  </div>
  <div class="ipu-flex-col form-btn" style="margin-top:.2rem;">
    <button class="ipu-btn common-btn">提交</button>
  </div>
</div>
</body>
</html>

2019/bj-zqzt/different-nets-info-edit.html

@@ -0,0 +1,124 @@
<!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">
  <link rel="stylesheet" type="text/css" href="biz/css/iconfont/iconfont.css">
  <script src="ipu/lib/requirejs/require.min.js"></script>
  <script src="biz/js/require-config.js"></script>
  <script src="biz/js/different-nets-info-edit.js"></script>
</head>
<body class="pages-different-nets-info-edit">
<div class="ipu-pages">
  <div class="ipu-page">
    <div class="ipu-flex-row ipu-flex-vertical">
      <div class="ipu-flex-col common-border-bottom">
        <div class="ipu-toolbar">
          <a class="ipu-fn-left link-back ipu-flex ipu-flex-align-center" href="javascript:;" id="back">
            <div class="left-back"></div>
          </a>
          <h1 class="ipu-toolbar-title">编辑异网信息</h1>
          <div class="tool-bar-edit main-blue" id="cancel">取消</div>
        </div>
      </div>
      <div class="normal-form ipu-flex-col ipu-flex-col-auto">
        <div class="ipu-form-item">
          <div class="ipu-flex common-border-bottom">
            <div class="item-key">异网单位名称：</div>
            <div class="item-value ipu-flex-col-auto">
              <div class="ipu-flex ipu-flex-justify-end ipu-flex-align-center">
                <input type="text" placeholder="可下拉选择或手动输入"/>
                <div class="right-arrow"></div>
              </div>
            </div>
          </div>
          <div class="check-tips"></div>
        </div>
        <div class="ipu-form-item">
          <div class="ipu-flex common-border-bottom">
            <div class="item-key">业务信息：</div>
            <div class="item-value ipu-flex-col-auto">
              <div class="ipu-flex ipu-flex-justify-end ipu-flex-align-center">
                <input type="text" placeholder="可下拉选择或手动输入"/>
                <div class="right-arrow"></div>
              </div>
            </div>
          </div>
          <div class="check-tips"></div>
        </div>
        <div class="ipu-form-item" valiFormNonnegativeFloat>
          <div class="ipu-flex common-border-bottom">
            <div class="item-key">业务资费：</div>
            <div class="item-value ipu-flex-col-auto">
              <div class="ipu-flex ipu-flex-justify-end ipu-flex-align-center">
                <input type="text" placeholder="请输入" oninput="this.value = this.value.replace(/[^0-9-.]/g, '');">
              </div>
            </div>
            <div class="item-value-after ipu-flex-middle-center">元</div>
          </div>
        </div>
        <div class="ipu-form-item">
          <div class="ipu-flex common-border-bottom">
            <div class="item-key">套餐类型：</div>
            <div class="item-value ipu-flex-col-auto">
              <div class="ipu-flex ipu-flex-justify-end ipu-flex-align-center">
                <input type="text" placeholder="可下拉选择或手动输入"/>
                <div class="right-arrow"></div>
              </div>
            </div>
          </div>
          <div class="check-tips"></div>
        </div>
        <div class="ipu-form-item">
          <div class="ipu-flex common-border-bottom">
            <div class="item-key">业务到期时间：</div>
            <div class="item-value ipu-flex-col-auto">
              <div id="time-select" class="ipu-flex ipu-flex-justify-end ipu-flex-align-center">
                <input type="text" placeholder="请选择" readonly/>
                <div class="right-arrow"></div>
              </div>
            </div>
          </div>
          <div class="check-tips"></div>
        </div>
        <div class="ipu-form-item">
          <div class="common-border-bottom">
            <div class="ipu-flex ipu-flex-justify-space">
              <div class="item-key">其他信息：</div>
              <div class="voice-input-btn ipu-flex ipu-flex-align-center">
                <div class="voice-pic"></div>
                <div class="voice-text">语音输入</div>
              </div>
            </div>
            <div class="item-value">
              <textarea id="reason" class="contact-content mid-textarea" maxlength="300" placeholder="请输入其他信息（非必填"></textarea>
              <div class="item-value-textarea">
                <div class="text-statistic ipu-fn-hide"><span class="text-number">0</span>/300</div>
              </div>
            </div>
          </div>
          <div class="check-tips"></div>
        </div>
      </div>
      <div class="ipu-flex-col form-btn" style="margin-top:.2rem;">
        <button class="ipu-btn common-btn">提交</button>
      </div>
    </div>
  </div>
</div>
</body>
</html>

2019/bj-zqzt/different-nets-list.html

@@ -0,0 +1,90 @@
<!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">
  <link rel="stylesheet" type="text/css" href="biz/css/iconfont/iconfont.css">
  <script src="ipu/lib/requirejs/require.min.js"></script>
  <script src="biz/js/require-config.js"></script>
  <script src="biz/js/different-nets-list.js"></script>
</head>
<body class="pages-different-nets-list main-body-bg-grey">
<div class="ipu-flex-row ipu-flex-vertical">
  <div class="ipu-flex-col common-border-bottom">
    <div class="ipu-toolbar">
      <a class="ipu-fn-left link-back ipu-flex ipu-flex-align-center" href="javascript:;" id="back">
        <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="customer-list-head ipu-flex ipu-flex-justify-space ipu-flex-align-center">
      <div class="business-count">全部<span>12</span>条数据</div>
    </div>
    <div class="add-customer ipu-flex ipu-flex-justify-center ipu-flex-align-center">
      <div class="add-customer-icon"></div>
    </div>
    <div class="page-content">
      <div class="ipu-list ipu-list-media ipu-flex-content" id="refresh" style="margin-top: .38rem">
        <!-- 组件html结构，最外层div应有一个固定的高度，会在此元素上初始化iScroll -->
        <div class="ipu-refresh-wrapper">
          <!-- 此处组件初始化后，会添加上拉html -->
          <div class="refresh-content">
            <div>
              <ul class="different-nets-list">
                <li class="net-item">
                  <div class="ipu-carousel">
                    <ul class="ipu-carousel-wrapper">
                      <li>
                        <div class="net-item-content">
                          <div class="normal-customer-title">异网单位名称：联通</div>
                          <div class="normal-customer-desc">业务信息：数据传输专线</div>
                          <div class="normal-customer-desc">到期时间: 2020-02-21 13:34:21</div>
                        </div>
                      </li>
                      <li class="card-actions-wrapper">
                        <div class="card-actions ipu-flex">
                          <div class="card-action-item edit">编辑</div>
                          <div class="card-action-item delete">删除</div>
                        </div>
                      </li>
                    </ul>
                  </div>
                </li>
              </ul>
            </div>
            <div class="no-result-msg ipu-fn-p ipu-txt-center">
              暂无记录
            </div>
          </div>
          <!-- 此处组件初始化后，会添加下拉html -->
        </div>
      </div>
    </div>
  </div>
</div>
<!--普通提示弹层-->
<div class="normal-tips-popup-slide">
  <div class="normal-tips-popup-wrap">
    <div class="normal-tips-content">确认删除该信息，进入异网信息<br/>删除审批流程？</div>
    <div class="normal-tips-btn ipu-flex ipu-flex-align-center">
      <div class="normal-tips-btn-cancel">取消</div>
      <div class="normal-tips-btn-confirm">确定</div>
    </div>
  </div>
</div>
</body>
</html>