examwin_web/js/search.js

$(function () {
  let params = lxd.parseUrl(window.location.href).query,
    my_search = $(".my-search>div"), start = 0, end = 0, currentPage = 1, pageSize = 20, totalPage = 1;
  if (JSON.stringify(params) != '{}') {
    params.inputval = decodeURI(params.inputval);
    my_search.find("select").val(params.selectval);
    my_search.find("input").val(params.inputval);
  }
  // 数据渲染
  function work (data, parameter) {
    $(".content>ul>li").remove();
    data = data.map(item => {
      let reg = new RegExp(`(${parameter})`, "g"), newstr = item.title.replace(reg, `<font color=red>$1</font>`);
      let li = document.createElement("li");
      li.innerHTML = `<a target="_blank" href="${item.url}">
        <h5>${newstr}</h5>
        <div class="flex">
          <img data-original="${item.thumbnail}"
          src="./imgs/app.png" alt=""
            class="flex-item">
          <div class="flex-item">
            <p><span class="label label-default">${item.area}</span> <span>${item.status}</span></p>
            <p>${item.time}</p>
          </div>
        </div>
      </a>`;
      return li;
    })
    $(".content>ul").append(data);
    $("img").lazyload();
  }
  // 分页请求
  function request (data) {
    return new Promise(resolve => {
      $.ajax({
        method: "get",
        data: {
          type: data.selectval,
          parameter: data.inputval,
          currentPage,
          pageSize
        },
        url: "http://admin.gaokaoapp.net/find/search/",
        success: function (res) {
          let { dataList: datas, totalPage: total, totalResult } = res.data;
          totalPage = total;
          $(".content>p").html(`为您找到相关结果约${totalResult}个`);
          work(datas, data.inputval)
          resolve(total);
        }
      })
    })
  }
  request(params).then(res => problem(res));
  // 页面搜索逻辑
  function axios () {
    let div = $(".my-search>div"), data = { selectval: div.find("select").val(), inputval: div.find("input").val() };
    window.location.href = `/search.html?selectval=${data.selectval}&inputval=${data.inputval}`;
  }
  $(".button").click(axios);
  // 分页问题 小于5
  function problem (res) {
    let ul = $(".pagination>li");
    if (res <= 5) {
      Array.from(ul).forEach((item, index) => {
        if (index > res) $(item).addClass("disabled")
      })
    } else {
      Array.from(ul).forEach((item, index) => {
        if (index != 0) $(item).removeClass("disabled")
      })
    }
  }
  my_search.keydown(function (event) {
    if (event.keyCode == 13) axios();
  }).find("label").click(axios);
  // let lis = $(".pagination>li");
  // 分页逻辑
  $(".pagination").click(function (e) {
    let li = $(e.target).parent();
    if (li.hasClass("active") || li.hasClass("disabled")) return false;
    $(this).find(".active").removeClass("active");
    let val = $(e.target).html(), arr = [];
    function operation (num, arr) {
      let brr = [];
      Array.from(arr).forEach(item => brr.push($(item).html()))
      brr = brr.slice(1, -1);
      if (num > 0 && Number(brr[4]) < totalPage) {
        Array.from(arr).forEach((item, index) => {
          $(item).parent().removeClass("disabled");
          if (index != 0 && index != 6) {
            let html = Number(brr[index - 1]) + num;
            if (html > totalPage) {
              $(item).html(html).parent().addClass("disabled");
            } else {
              if (index == 1) {
                $(item).html(html).parent().addClass("active");
                req(html)
              } else {
                $(item).html(html);
              }
            }
          }
          if (index == 6 && Number(brr[4]) + num > totalPage) {
            $(item).parent().addClass("disabled");
          }
        })
      }
      if (num < 0 && Number(brr[0]) != 1) {
        Array.from(arr).forEach((item, index) => {
          $(item).parent().removeClass("disabled");
          let html = Number(brr[index - 1]) + num;
          if (index != 0 && index != 6) {
            if (index == 1) {
              $(item).html(html).parent().addClass("active");
              req(html)
            } else {
              $(item).html(html)
            }
          }
          if (index == 0 && Number(brr[0]) + num == 1) {
            $(item).parent().addClass("disabled");
          }
        })
      }
    }
    function req (val) {
      currentPage = Number(val);
      request(params)
    }
    switch (val) {
      case "»":
        arr = li.parent().find("a");
        operation(5, arr)
        break;
      case "«":
        arr = li.parent().find("a");
        operation(-5, arr)
        break;
      default:
        li.addClass("active");
        req(val)
    }
  })
})