$(function () {
  let currentIndex = 1;
  let length = $(".pageArea").children().length;
  // console.log($(".pageArea").children());
  //设置默认第一页
  console.log("设置默认页码");
  let firstPage = $(".pageArea").children()[1];
  $(firstPage).css("background", "#ad222a");
  $(firstPage).css("color", "white");
  //按钮置灰
  let preBtn = $(".pageArea").children()[0];
  let lastBtn = $(".pageArea").children()[length - 1];
  $(preBtn).css("color", "#CCCCCC");

  //设置所有点击事件
  Object.entries($(".pageArea").children()).map(([i, element]) => {
    // console.log($(element)[0].className,'ss')
    // console.log(i)
    if ($(element)[0].className == "pre") {
      // $(element).click(function () {
      pageClick("上一页", element, i);
      // });
    } else if ($(element)[0].className == "next") {
      // $(element).click(function () {
      pageClick("下一页", element, i);
      // });
    } else {
      //按钮
      // $(element).click(function () {
      pageClick("", element, i);
      // });
    }

    // console.log($(element),$(firstPage))
  });

  function pageClick(type, element, i) {
    $(element).click(function () {
      let intoPage;
      if (type == "上一页") {
        intoPage = currentIndex - 1;
      } else if (type == "下一页") {
        intoPage = Number(currentIndex) + 1;
      } else {
        intoPage = i;
      }
      //如果不是第一页的话
      if (intoPage >= 1 && intoPage <= length - 2) {
        //让之前的页面css清除
        let prePage = $(".pageArea").children()[currentIndex];
        $(prePage).css("background", "#fff");
        $(prePage).css("color", "black");

        //更换之前的页面的编号
        if (type == "上一页") {
          currentIndex--;
        } else if (type == "下一页") {
          currentIndex++;
        } else {
          currentIndex = i;
        }
        console.log("点击页码" + currentIndex);

        //设置当前点击页码css
        let currentPage;
        if (type == "上一页") {
          currentPage = $(".pageArea").children()[currentIndex];
        } else if (type == "下一页") {
          currentPage = $(".pageArea").children()[currentIndex];
        } else {
          currentPage = $(".pageArea").children()[i];
        }

        $(currentPage).css("background", "#ad222a");
        $(currentPage).css("color", "white");

        //控制前后页禁用
        if (currentIndex == 1) {
          $(preBtn).css("color", "#ccc");
          //按钮恢复
          $(lastBtn).css("color", "black");
        } else if (currentIndex == length - 2) {
          $(lastBtn).css("color", "#ccc");
          //按钮恢复
          $(preBtn).css("color", "black");
        } else {
          //按钮恢复
          $(preBtn).css("color", "black");
          $(lastBtn).css("color", "black");
        }
      } else {
        if (intoPage <= 0) {
          $(preBtn).css("color", "#ccc");
        } else {
          $(lastBtn).css("color", "#ccc");
        }
      }
      // else {
      //   //按钮置灰
      //   $(preBtn).css("color", "#CCCCCC");
      //   $(lastBtn).css("color", "black");
      // }
    });
  }
});