import template from "./Pagination.html"; import style from "antd/lib/pagination/style/index.css"; angular.module("esNgAntd").directive("esPagination", function (esNgAntd) { return { controllerAs: "esPagination", restrict: "E", transclude: true, replace: true, scope: { defaultCurrent: "@", current: "@", total: "@", defaultPageSize: "@", pageSize: "@", onChange: "&", onShowSizeChange: "&", showQuickJumper: "@", showSizeChanger: "@", }, template: template, controller: function ($scope, $element) { this.getContext = function () { return $scope; }; $scope.state = { total: null, current: null, pageSize: null, pageNum: null, pageNumList: null, }; $scope.getPageNum = function () { return ( Math.ceil( $scope.state.total / ($scope.pageSize || $scope.defaultPageSize || 10) ) || 1 ); }; $scope.handleNext = function () { if ($scope.state.current === $scope.state.pageNum) { return false; } $scope.handleClick(++$scope.state.current); }; $scope.getPopupContainer = function () { return $element[0].querySelector(".ant-pagination-options"); }; $scope.handlePrev = function () { if ($scope.state.current === 1) { return false; } $scope.handleClick(--$scope.state.current); }; $scope.handleClick = function (value) { $scope.state.current = value; // 更新回调 $scope.onChange({ page: $scope.state.current, pageSize: $scope.state.pageSize, }); }; $scope.handleChange = function () { let current = $scope.state.current; if ($scope.state.current > $scope.state.pageNum) { current = $scope.state.pageNum; } else if ($scope.state.current < 1) { current = 1; } $scope.onChange({ page: current, pageSize: $scope.state.pageSize, }); }; $scope.handleSelectChange = function (value) { $scope.state.current = 1; $scope.state.pageSize = parseInt(value); $scope.handleChange(); }; $scope.getCurrent = function (number) { if (number > $scope.state.pageNum) { return $scope.state.pageNum; } if (number < 1) { return 1; } return parseInt(number); }; $scope.handleBlur = function (event) { let value = event.target.value; if (!value) { return; } $scope.state.current = $scope.getCurrent(value); $scope.handleChange(); event.target.value = null; }; }, link: function ($scope, $element, $attrs, $controllers, $transclude) { esNgAntd.createStyle("ant-pagination", style); $scope.state.total = Number($scope.total || 0); $scope.state.current = Number( $scope.current || $scope.defaultCurrent || 1 ); $scope.state.pageSize = $scope.pageSize || $scope.defaultPageSize || 10; $scope.state.pageNum = $scope.getPageNum(); $scope.state.pageNumList = Array($scope.state.pageNum) .fill(0) .map((v, i) => i + 1); }, }; });