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.setCurrent = function (value) {
                if (!value) {
                    return;
                }

                $scope.state.current = $scope.getCurrent(value);
                $scope.handleChange();
            };

            $scope.handleBlur = function (event) {
                $scope.setCurrent(event.target.value);
                event.target.value = null;
            };

            $scope.onKeyPress = function (event) {
                if (event.keyCode === 13 || event.keyCode === 32) {
                    $scope.setCurrent(event.target.value);
                    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);
        },
    };
});