ant-design-vue/components/vc-pagination/Pager.jsx

61 lines
1.3 KiB
Vue
Raw Normal View History

2019-01-12 03:33:27 +00:00
import PropTypes from '../_util/vue-types';
2018-03-05 11:06:44 +00:00
2017-11-07 03:57:16 +00:00
export default {
2018-05-26 14:47:19 +00:00
name: 'Pager',
2017-11-07 03:57:16 +00:00
props: {
2018-03-05 11:06:44 +00:00
rootPrefixCls: PropTypes.string,
page: PropTypes.number,
active: PropTypes.bool,
last: PropTypes.bool,
locale: PropTypes.object,
showTitle: PropTypes.bool,
2017-12-20 02:56:21 +00:00
itemRender: {
type: Function,
default: () => {},
},
2017-11-07 03:57:16 +00:00
},
computed: {
2019-01-12 03:33:27 +00:00
classes() {
const prefixCls = `${this.rootPrefixCls}-item`;
let cls = `${prefixCls} ${prefixCls}-${this.page}`;
2017-11-07 03:57:16 +00:00
if (this.active) {
2019-01-12 03:33:27 +00:00
cls = `${cls} ${prefixCls}-active`;
2017-11-07 03:57:16 +00:00
}
2019-01-12 03:33:27 +00:00
return cls;
2017-11-07 03:57:16 +00:00
},
},
methods: {
2019-01-12 03:33:27 +00:00
handleClick() {
this.$emit('click', this.page);
2017-11-07 03:57:16 +00:00
},
2019-01-12 03:33:27 +00:00
handleKeyPress(event) {
this.$emit('keypress', event, this.handleClick, this.page);
2017-11-07 03:57:16 +00:00
},
},
2019-01-12 03:33:27 +00:00
render() {
const { rootPrefixCls, page, active } = this;
const prefixCls = `${rootPrefixCls}-item`;
let cls = `${prefixCls} ${prefixCls}-${page}`;
2018-03-05 11:06:44 +00:00
if (active) {
2019-01-12 03:33:27 +00:00
cls = `${cls} ${prefixCls}-active`;
2018-03-05 11:06:44 +00:00
}
if (!page) {
2019-01-12 03:33:27 +00:00
cls = `${cls} ${prefixCls}-disabled`;
}
2017-12-20 02:56:21 +00:00
return (
<li
2018-03-05 11:06:44 +00:00
class={cls}
2017-12-20 02:56:21 +00:00
onClick={this.handleClick}
onKeypress={this.handleKeyPress}
2018-03-05 11:06:44 +00:00
title={this.showTitle ? this.page : null}
2019-01-12 03:33:27 +00:00
tabIndex="0"
2018-03-05 11:06:44 +00:00
>
2017-12-20 02:56:21 +00:00
{this.itemRender(this.page, 'page', <a>{this.page}</a>)}
</li>
2019-01-12 03:33:27 +00:00
);
2017-12-20 02:56:21 +00:00
},
2019-01-12 03:33:27 +00:00
};