@zengqiao@优化资源勘查列表

2019/bj-zqzt/biz/js/resource-exploration-list.js

@@ -1,8 +1,8 @@
require(['jquery', 'ipuUI'], function ($, ipuUI) {
  $(function () {
    // 全部列表的刷新组件
    var refresh;
    // 搜索
    var search;
    var initData = {
      "全部": "refresh-all",
@@ -16,7 +16,7 @@ require(['jquery', 'ipuUI'], function ($, ipuUI) {
    // 页面初始化
    function init() {
      showAllList(initData["全部"]);
      showResList(initData["全部"]);
      $(".normal-tab-head>ul>li.active").attr("firstload", 0);
    }
@@ -42,6 +42,7 @@ require(['jquery', 'ipuUI'], function ($, ipuUI) {
      SELECT_PICKER.show(function (data) {
        self.text(data.text);
        self.data("value", data.value);
        search();
      });
    });
@@ -56,23 +57,26 @@ require(['jquery', 'ipuUI'], function ($, ipuUI) {
      let refreshId = $(this).text();
      if (refreshId == "全部") {
        $(".select-search-area").removeClass("ipu-fn-hide");
        if ($(this).attr("firstload") == 1) {
          showAllList(initData["全部"]);
          $(this).attr("firstload", 0);
        }
      } else {
        $(".select-search-area").addClass("ipu-fn-hide");
        if ($(this).attr("firstload") == 1) {
          showExplorationList(initData[refreshId]);
          $(this).attr("firstload", 0);
        }
      }
      if ($(this).attr("firstload") == 1) {
        showResList(initData[refreshId]);
        $(this).attr("firstload", 0);
      }
    });
    // 全部中的条件搜索事件
    $(".common-select-search-btn").click(function(){
      refresh();
      search();
    });
    // 监测输入框按下事件
    $(".common-search-input").keyup(function (e) {
      var currKey = e.keyCode || e.which || e.charCode;
      if (currKey == 13) {// 按下回车进行查询
        search();
      }
    });
    // 选项点击事件跳转至详情页
@@ -80,16 +84,16 @@ require(['jquery', 'ipuUI'], function ($, ipuUI) {
      console.log("跳转至详情页");
    });
    // 初始化全部勘察单列表的下拉刷新组件
    function showAllList(refreshId) {
    // 初始化下拉刷新组件
    function showResList(refreshId) {
      var totalPage = 5;  // 总页数
      var nowPage = 1;    // 当前显示第几页，因为默认有一些数据了，所以为1
      var currentPage = 1;    // 当前显示第几页，因为默认有一些数据了，所以为1
      var listObj = $("#" + refreshId + " ul");
      var contentHtml = $("li:lt(5)", listObj).clone(); // 测试用，复制5条数据
      // 移除初始的数据，并初始nowPage=0;
      // 移除初始的数据，并初始currentPage=0;
      listObj.empty();
      nowPage = 0;
      currentPage = 0;
      var countNo = 0; // 重要计数器,以此来判断不需要
      // 初始化下拉刷新
@@ -100,14 +104,14 @@ require(['jquery', 'ipuUI'], function ($, ipuUI) {
        },
        topLoadFun: function () { // 刷新
          console.log('刷新数据'); // 手势下拉，内容上滚动
          refresh();
          refreshData();
        }
      });
      // 查询数据
      function addData(refresh) {// 0搜索，1刷新，2加载更多
        $("#" + refreshId + " .no-result-msg").hide();
        nowPage++;
        currentPage++;
        var localCountNo = ++countNo;  // 执行查询前，保留当前计数器，当查询返回时进行检查是否最新查询，不是则抛弃查询结果
        setTimeout(function () { // 模拟延时加载
@@ -115,7 +119,7 @@ require(['jquery', 'ipuUI'], function ($, ipuUI) {
            // 此处先更新togalPage等信息
            myRefresh.enableTop(totalPage != 0); // 假设totalPage为0时表示没数据，此时停用刷新功能，也可不停用，强行刷新
            myRefresh.enableBottom(nowPage < totalPage); // enable应该总是先于endBottom/TopLoading方法执行
            myRefresh.enableBottom(currentPage < totalPage); // enable应该总是先于endBottom/TopLoading方法执行
            if (totalPage == 0) {
              $("#" + refreshId + " .no-result-msg").hide();
@@ -134,9 +138,8 @@ require(['jquery', 'ipuUI'], function ($, ipuUI) {
      }
      // 刷新
      refresh = function refreshData() {   // 刷新数据
        nowPage = 0; // 底部加载时，停用底部加载功能和底部加载
        listObj.empty(); // 清空已有内容
      function refreshData() {   // 刷新数据
        currentPage = 0; // 底部加载时，停用底部加载功能和底部加载
        addData(true);
        myRefresh.enableBottom(false);
        if (myRefresh.bottomLoading) {
@@ -144,69 +147,21 @@ require(['jquery', 'ipuUI'], function ($, ipuUI) {
        }
        addData(true);
      }
    }
    // 初始化全部以外勘察单列表的下拉刷新组件
    function showExplorationList(refreshId) {
      var totalPage = 5;  // 总页数
      var nowPage = 1;    // 当前显示第几页，因为默认有一些数据了，所以为1
      var listObj = $("#" + refreshId + " ul");
      var contentHtml = $("li:lt(5)", listObj).clone(); // 测试用，复制5条数据
      // 移除初始的数据，并初始nowPage=0;
      listObj.empty();
      nowPage = 0;
      var countNo = 0; // 重要计数器,以此来判断不需要
      // 初始化下拉刷新
      var myRefresh = ipuUI.refresh("#" + refreshId, {
        bottomLoadFun: function () { // 加载更多
          console.log('加载更多'); // 手势上拉，内容下滚动动
          addData();
        },
        topLoadFun: function () { // 刷新
          console.log('刷新数据'); // 手势下拉，内容上滚动
          refreshData();
        }
      });
      // 查询数据
      function addData(refresh) {// 0搜索，1刷新，2加载更多
        $("#" + refreshId + " .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) {
              $("#" + refreshId + " .no-result-msg").hide();
            } else {
              if (refresh) {                    // 顶部刷新，刷新也可能已经没有数据了，待处理
                listObj.empty(); // 清空已有内容
                contentHtml.clone().appendTo(listObj);
                myRefresh.endTopLoading(); //最后调用
              } else {  // 底部加载更多,或查询
                contentHtml.clone().appendTo(listObj);
                myRefresh.endBottomLoading();  //最后调用
              }
            }
          }
        }, 1000);
      }
      // 刷新
      function refreshData() {   // 刷新数据
        nowPage = 0; // 底部加载时，停用底部加载功能和底部加载
      // 搜索
      search = function searchData() {   // 刷新数据
        myRefresh.enableBottom(false);
        if (myRefresh.bottomLoading) {
          myRefresh.endBottomLoading();
        }
        addData(true);
        myRefresh.enableTop(false);
        if (myRefresh.topLoading) {
          myRefresh.endTopLoading();
        }
        currentPage = 0;
        listObj.empty();
        myRefresh.enableBottom(true);
        myRefresh.refresh();
      }
    }