1 | import { createVNode as _createVNode, isVNode as _isVNode } from "vue";
|
2 | import PropTypes from '../_util/vue-types';
|
3 | import KEYCODE from './KeyCode';
|
4 | import BaseMixin from '../_util/BaseMixin';
|
5 | import { withDirectives } from 'vue';
|
6 | import antInput from '../_util/antInputDirective';
|
7 |
|
8 | function _isSlot(s) {
|
9 | return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !_isVNode(s);
|
10 | }
|
11 |
|
12 | export default {
|
13 | mixins: [BaseMixin],
|
14 | props: {
|
15 | disabled: PropTypes.looseBool,
|
16 | changeSize: PropTypes.func,
|
17 | quickGo: PropTypes.func,
|
18 | selectComponentClass: PropTypes.any,
|
19 | current: PropTypes.number,
|
20 | pageSizeOptions: PropTypes.array.def(['10', '20', '30', '40']),
|
21 | pageSize: PropTypes.number,
|
22 | buildOptionText: PropTypes.func,
|
23 | locale: PropTypes.object,
|
24 | rootPrefixCls: PropTypes.string,
|
25 | selectPrefixCls: PropTypes.string,
|
26 | goButton: PropTypes.any
|
27 | },
|
28 | data: function data() {
|
29 | return {
|
30 | goInputText: ''
|
31 | };
|
32 | },
|
33 | methods: {
|
34 | getValidValue: function getValidValue() {
|
35 | var goInputText = this.goInputText,
|
36 | current = this.current;
|
37 | return !goInputText || isNaN(goInputText) ? current : Number(goInputText);
|
38 | },
|
39 | defaultBuildOptionText: function defaultBuildOptionText(opt) {
|
40 | return "".concat(opt.value, " ").concat(this.locale.items_per_page);
|
41 | },
|
42 | handleChange: function handleChange(e) {
|
43 | var _e$target = e.target,
|
44 | value = _e$target.value,
|
45 | composing = _e$target.composing;
|
46 | if (e.isComposing || composing || this.goInputText === value) return;
|
47 | this.setState({
|
48 | goInputText: value
|
49 | });
|
50 | },
|
51 | handleBlur: function handleBlur(e) {
|
52 | var _this$$props = this.$props,
|
53 | goButton = _this$$props.goButton,
|
54 | quickGo = _this$$props.quickGo,
|
55 | rootPrefixCls = _this$$props.rootPrefixCls;
|
56 |
|
57 | if (goButton) {
|
58 | return;
|
59 | }
|
60 |
|
61 | if (e.relatedTarget && (e.relatedTarget.className.indexOf("".concat(rootPrefixCls, "-prev")) >= 0 || e.relatedTarget.className.indexOf("".concat(rootPrefixCls, "-next")) >= 0)) {
|
62 | return;
|
63 | }
|
64 |
|
65 | quickGo(this.getValidValue());
|
66 | },
|
67 | go: function go(e) {
|
68 | var goInputText = this.goInputText;
|
69 |
|
70 | if (goInputText === '') {
|
71 | return;
|
72 | }
|
73 |
|
74 | if (e.keyCode === KEYCODE.ENTER || e.type === 'click') {
|
75 |
|
76 | this.quickGo(this.getValidValue());
|
77 | this.setState({
|
78 | goInputText: ''
|
79 | });
|
80 | }
|
81 | }
|
82 | },
|
83 | render: function render() {
|
84 | var _this = this;
|
85 |
|
86 | var rootPrefixCls = this.rootPrefixCls,
|
87 | locale = this.locale,
|
88 | changeSize = this.changeSize,
|
89 | quickGo = this.quickGo,
|
90 | goButton = this.goButton,
|
91 | Select = this.selectComponentClass,
|
92 | defaultBuildOptionText = this.defaultBuildOptionText,
|
93 | selectPrefixCls = this.selectPrefixCls,
|
94 | pageSize = this.pageSize,
|
95 | pageSizeOptions = this.pageSizeOptions,
|
96 | goInputText = this.goInputText,
|
97 | disabled = this.disabled;
|
98 | var prefixCls = "".concat(rootPrefixCls, "-options");
|
99 | var changeSelect = null;
|
100 | var goInput = null;
|
101 | var gotoButton = null;
|
102 |
|
103 | if (!changeSize && !quickGo) {
|
104 | return null;
|
105 | }
|
106 |
|
107 | if (changeSize && Select) {
|
108 | var buildOptionText = this.buildOptionText || defaultBuildOptionText;
|
109 | var options = pageSizeOptions.map(function (opt, i) {
|
110 | var _slot;
|
111 |
|
112 | return _createVNode(Select.Option, {
|
113 | "key": i,
|
114 | "value": opt
|
115 | }, _isSlot(_slot = buildOptionText({
|
116 | value: opt
|
117 | })) ? _slot : {
|
118 | default: function _default() {
|
119 | return [_slot];
|
120 | }
|
121 | });
|
122 | });
|
123 | changeSelect = _createVNode(Select, {
|
124 | "disabled": disabled,
|
125 | "prefixCls": selectPrefixCls,
|
126 | "showSearch": false,
|
127 | "class": "".concat(prefixCls, "-size-changer"),
|
128 | "optionLabelProp": "children",
|
129 | "value": (pageSize || pageSizeOptions[0]).toString(),
|
130 | "onChange": function onChange(value) {
|
131 | return _this.changeSize(Number(value));
|
132 | },
|
133 | "getPopupContainer": function getPopupContainer(triggerNode) {
|
134 | return triggerNode.parentNode;
|
135 | }
|
136 | }, _isSlot(options) ? options : {
|
137 | default: function _default() {
|
138 | return [options];
|
139 | }
|
140 | });
|
141 | }
|
142 |
|
143 | if (quickGo) {
|
144 | if (goButton) {
|
145 | gotoButton = typeof goButton === 'boolean' ? _createVNode("button", {
|
146 | "type": "button",
|
147 | "onClick": this.go,
|
148 | "onKeyup": this.go,
|
149 | "disabled": disabled
|
150 | }, [locale.jump_to_confirm]) : _createVNode("span", {
|
151 | "onClick": this.go,
|
152 | "onKeyup": this.go
|
153 | }, _isSlot(goButton) ? goButton : {
|
154 | default: function _default() {
|
155 | return [goButton];
|
156 | }
|
157 | });
|
158 | }
|
159 |
|
160 | goInput = _createVNode("div", {
|
161 | "class": "".concat(prefixCls, "-quick-jumper")
|
162 | }, [locale.jump_to, withDirectives(_createVNode("input", {
|
163 | "disabled": disabled,
|
164 | "type": "text",
|
165 | "value": goInputText,
|
166 | "onInput": this.handleChange,
|
167 | "onChange": this.handleChange,
|
168 | "onKeyup": this.go,
|
169 | "onBlur": this.handleBlur
|
170 | }, null), [[antInput]]), locale.page, gotoButton]);
|
171 | }
|
172 |
|
173 | return _createVNode("li", {
|
174 | "class": "".concat(prefixCls)
|
175 | }, [changeSelect, goInput]);
|
176 | }
|
177 | }; |
\ | No newline at end of file |