@penggy/element-ui 2.4.11 → 2.4.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (334) hide show
  1. package/lib/autocomplete.js +8 -8
  2. package/lib/carousel.js +1 -1
  3. package/lib/cascader.js +9 -9
  4. package/lib/checkbox-button.js +1 -1
  5. package/lib/checkbox-group.js +1 -1
  6. package/lib/checkbox.js +1 -1
  7. package/lib/collapse-item.js +3 -3
  8. package/lib/color-picker.js +6 -6
  9. package/lib/date-picker.js +17 -17
  10. package/lib/dialog.js +3 -3
  11. package/lib/directives/repeat-click.js +1 -1
  12. package/lib/dropdown-item.js +1 -1
  13. package/lib/dropdown-menu.js +1 -1
  14. package/lib/dropdown.js +6 -6
  15. package/lib/element-ui.common.js +443 -91
  16. package/lib/form-item.js +3 -3
  17. package/lib/form.js +1 -1
  18. package/lib/index.js +1 -1
  19. package/lib/input-number.js +3 -3
  20. package/lib/input.js +4 -4
  21. package/lib/loading.js +4 -4
  22. package/lib/locale/format.js +11 -11
  23. package/lib/locale/index.js +1 -1
  24. package/lib/menu-item.js +2 -2
  25. package/lib/menu.js +28 -28
  26. package/lib/message-box.js +9 -9
  27. package/lib/message.js +2 -2
  28. package/lib/mixins/locale.js +1 -1
  29. package/lib/mixins/migrating.js +20 -20
  30. package/lib/notification.js +2 -2
  31. package/lib/option-group.js +1 -1
  32. package/lib/option.js +2 -2
  33. package/lib/pagination.js +5 -5
  34. package/lib/popover.js +3 -3
  35. package/lib/radio-button.js +1 -1
  36. package/lib/radio-group.js +1 -1
  37. package/lib/radio.js +1 -1
  38. package/lib/rate.js +2 -2
  39. package/lib/scrollbar.js +4 -4
  40. package/lib/select.js +13 -13
  41. package/lib/slider.js +3 -3
  42. package/lib/steps.js +1 -1
  43. package/lib/submenu.js +3 -3
  44. package/lib/switch.js +2 -2
  45. package/lib/table-column.js +4 -4
  46. package/lib/table.js +14 -14
  47. package/lib/tabs.js +1 -1
  48. package/lib/time-picker.js +15 -15
  49. package/lib/time-select.js +14 -14
  50. package/lib/tooltip.js +4 -4
  51. package/lib/transfer.js +7 -7
  52. package/lib/transitions/collapse-transition.js +1 -1
  53. package/lib/tree.js +6 -6
  54. package/lib/upload.js +3 -3
  55. package/lib/utils/after-leave.js +7 -7
  56. package/lib/utils/aria-dialog.js +16 -16
  57. package/lib/utils/aria-utils.js +25 -25
  58. package/lib/utils/clickoutside.js +8 -8
  59. package/lib/utils/date.js +37 -37
  60. package/lib/utils/popper.js +321 -321
  61. package/lib/utils/popup/index.js +2 -2
  62. package/lib/utils/popup/popup-manager.js +1 -1
  63. package/lib/utils/vdom.js +1 -1
  64. package/lib/utils/vue-popper.js +8 -8
  65. package/package.json +1 -1
  66. package/packages/alert/index.js +8 -8
  67. package/packages/alert/src/main.vue +88 -88
  68. package/packages/aside/index.js +8 -8
  69. package/packages/aside/src/main.vue +20 -20
  70. package/packages/autocomplete/index.js +8 -8
  71. package/packages/autocomplete/src/autocomplete-suggestions.vue +76 -76
  72. package/packages/autocomplete/src/autocomplete.vue +269 -269
  73. package/packages/badge/index.js +8 -8
  74. package/packages/badge/src/main.vue +53 -53
  75. package/packages/breadcrumb/index.js +8 -8
  76. package/packages/breadcrumb/src/breadcrumb-item.vue +41 -41
  77. package/packages/breadcrumb/src/breadcrumb.vue +34 -34
  78. package/packages/breadcrumb-item/index.js +8 -8
  79. package/packages/button/index.js +8 -8
  80. package/packages/button/src/button-group.vue +10 -10
  81. package/packages/button/src/button.vue +78 -78
  82. package/packages/button-group/index.js +8 -8
  83. package/packages/card/index.js +8 -8
  84. package/packages/card/src/main.vue +23 -23
  85. package/packages/carousel/index.js +8 -8
  86. package/packages/carousel/src/item.vue +114 -114
  87. package/packages/carousel/src/main.vue +262 -262
  88. package/packages/carousel-item/index.js +8 -8
  89. package/packages/cascader/index.js +8 -8
  90. package/packages/cascader/src/main.vue +456 -456
  91. package/packages/cascader/src/menu.vue +376 -376
  92. package/packages/checkbox/index.js +8 -8
  93. package/packages/checkbox/src/checkbox-button.vue +191 -191
  94. package/packages/checkbox/src/checkbox-group.vue +48 -48
  95. package/packages/checkbox/src/checkbox.vue +219 -219
  96. package/packages/checkbox-button/index.js +8 -8
  97. package/packages/checkbox-group/index.js +8 -8
  98. package/packages/col/index.js +9 -9
  99. package/packages/col/src/col.js +71 -71
  100. package/packages/collapse/index.js +9 -9
  101. package/packages/collapse/src/collapse-item.vue +113 -113
  102. package/packages/collapse/src/collapse.vue +73 -73
  103. package/packages/collapse-item/index.js +8 -8
  104. package/packages/color-picker/index.js +8 -8
  105. package/packages/color-picker/src/color.js +316 -316
  106. package/packages/color-picker/src/components/alpha-slider.vue +132 -132
  107. package/packages/color-picker/src/components/hue-slider.vue +123 -123
  108. package/packages/color-picker/src/components/picker-dropdown.vue +121 -121
  109. package/packages/color-picker/src/components/predefine.vue +60 -60
  110. package/packages/color-picker/src/components/sv-panel.vue +100 -100
  111. package/packages/color-picker/src/draggable.js +36 -36
  112. package/packages/color-picker/src/main.vue +188 -188
  113. package/packages/container/index.js +8 -8
  114. package/packages/container/src/main.vue +33 -33
  115. package/packages/date-picker/index.js +8 -8
  116. package/packages/date-picker/src/basic/date-table.vue +437 -437
  117. package/packages/date-picker/src/basic/month-table.vue +105 -105
  118. package/packages/date-picker/src/basic/time-spinner.vue +301 -301
  119. package/packages/date-picker/src/basic/year-table.vue +101 -101
  120. package/packages/date-picker/src/panel/date-range.vue +640 -640
  121. package/packages/date-picker/src/panel/date.vue +579 -579
  122. package/packages/date-picker/src/panel/time-range.vue +248 -248
  123. package/packages/date-picker/src/panel/time-select.vue +177 -177
  124. package/packages/date-picker/src/panel/time.vue +186 -186
  125. package/packages/date-picker/src/picker/date-picker.js +40 -40
  126. package/packages/date-picker/src/picker/time-picker.js +39 -39
  127. package/packages/date-picker/src/picker/time-select.js +21 -21
  128. package/packages/date-picker/src/picker.vue +924 -924
  129. package/packages/date-picker/src/util/index.js +273 -273
  130. package/packages/dialog/index.js +8 -8
  131. package/packages/dialog/src/component.vue +201 -201
  132. package/packages/dropdown/index.js +8 -8
  133. package/packages/dropdown/src/dropdown-item.vue +35 -35
  134. package/packages/dropdown/src/dropdown-menu.vue +60 -60
  135. package/packages/dropdown/src/dropdown.vue +271 -271
  136. package/packages/dropdown-item/index.js +8 -8
  137. package/packages/dropdown-menu/index.js +8 -8
  138. package/packages/footer/index.js +8 -8
  139. package/packages/footer/src/main.vue +20 -20
  140. package/packages/form/index.js +8 -8
  141. package/packages/form/src/form-item.vue +290 -290
  142. package/packages/form/src/form.vue +148 -148
  143. package/packages/form-item/index.js +8 -8
  144. package/packages/header/index.js +8 -8
  145. package/packages/header/src/main.vue +20 -20
  146. package/packages/icon/index.js +8 -8
  147. package/packages/icon/src/icon.vue +13 -13
  148. package/packages/input/index.js +8 -8
  149. package/packages/input/src/calcTextareaHeight.js +104 -104
  150. package/packages/input/src/input.vue +349 -349
  151. package/packages/input-number/index.js +8 -8
  152. package/packages/input-number/src/input-number.vue +255 -255
  153. package/packages/loading/index.js +11 -11
  154. package/packages/loading/src/directive.js +128 -128
  155. package/packages/loading/src/index.js +106 -106
  156. package/packages/loading/src/loading.vue +41 -41
  157. package/packages/main/index.js +8 -8
  158. package/packages/main/src/main.vue +12 -12
  159. package/packages/menu/index.js +8 -8
  160. package/packages/menu/src/menu-item-group.vue +45 -45
  161. package/packages/menu/src/menu-item.vue +112 -112
  162. package/packages/menu/src/menu-mixin.js +44 -44
  163. package/packages/menu/src/menu.vue +311 -311
  164. package/packages/menu/src/submenu.vue +335 -335
  165. package/packages/menu-item/index.js +8 -8
  166. package/packages/menu-item-group/index.js +8 -8
  167. package/packages/message/index.js +2 -2
  168. package/packages/message/src/main.js +72 -72
  169. package/packages/message/src/main.vue +112 -112
  170. package/packages/message-box/index.js +2 -2
  171. package/packages/message-box/src/main.js +216 -216
  172. package/packages/message-box/src/main.vue +327 -327
  173. package/packages/notification/index.js +2 -2
  174. package/packages/notification/src/main.js +93 -93
  175. package/packages/notification/src/main.vue +152 -152
  176. package/packages/option/index.js +8 -8
  177. package/packages/option-group/index.js +8 -8
  178. package/packages/pagination/index.js +8 -8
  179. package/packages/pagination/src/pager.vue +163 -163
  180. package/packages/pagination/src/pagination.js +430 -430
  181. package/packages/popover/index.js +14 -14
  182. package/packages/popover/src/directive.js +20 -20
  183. package/packages/popover/src/main.vue +207 -207
  184. package/packages/progress/index.js +8 -8
  185. package/packages/progress/src/progress.vue +138 -138
  186. package/packages/radio/index.js +8 -8
  187. package/packages/radio/src/radio-button.vue +114 -114
  188. package/packages/radio/src/radio-group.vue +100 -100
  189. package/packages/radio/src/radio.vue +126 -126
  190. package/packages/radio-button/index.js +8 -8
  191. package/packages/radio-group/index.js +8 -8
  192. package/packages/rate/index.js +8 -8
  193. package/packages/rate/src/main.vue +350 -350
  194. package/packages/row/index.js +9 -9
  195. package/packages/row/src/row.js +47 -47
  196. package/packages/scrollbar/index.js +8 -8
  197. package/packages/scrollbar/src/bar.js +88 -88
  198. package/packages/scrollbar/src/main.js +130 -130
  199. package/packages/scrollbar/src/util.js +34 -34
  200. package/packages/select/index.js +8 -8
  201. package/packages/select/src/navigation-mixin.js +54 -54
  202. package/packages/select/src/option-group.vue +60 -60
  203. package/packages/select/src/option.vue +159 -159
  204. package/packages/select/src/select-dropdown.vue +74 -74
  205. package/packages/select/src/select.vue +878 -878
  206. package/packages/slider/index.js +8 -8
  207. package/packages/slider/src/button.vue +235 -235
  208. package/packages/slider/src/main.vue +385 -385
  209. package/packages/spinner/index.js +8 -8
  210. package/packages/spinner/src/spinner.vue +27 -27
  211. package/packages/step/index.js +8 -8
  212. package/packages/steps/index.js +8 -8
  213. package/packages/steps/src/step.vue +180 -180
  214. package/packages/steps/src/steps.vue +68 -68
  215. package/packages/submenu/index.js +8 -8
  216. package/packages/switch/index.js +9 -9
  217. package/packages/switch/src/component.vue +163 -163
  218. package/packages/tab-pane/index.js +8 -8
  219. package/packages/table/index.js +8 -8
  220. package/packages/table/src/dropdown.js +28 -28
  221. package/packages/table/src/filter-panel.vue +203 -203
  222. package/packages/table/src/layout-observer.js +68 -68
  223. package/packages/table/src/table-body.js +392 -392
  224. package/packages/table/src/table-column.js +462 -462
  225. package/packages/table/src/table-footer.js +147 -147
  226. package/packages/table/src/table-header.js +522 -522
  227. package/packages/table/src/table-layout.js +231 -231
  228. package/packages/table/src/table-store.js +657 -657
  229. package/packages/table/src/table.vue +660 -660
  230. package/packages/table/src/util.js +122 -122
  231. package/packages/table-column/index.js +8 -8
  232. package/packages/tabs/index.js +8 -8
  233. package/packages/tabs/src/tab-bar.vue +57 -57
  234. package/packages/tabs/src/tab-nav.vue +280 -280
  235. package/packages/tabs/src/tab-pane.vue +58 -58
  236. package/packages/tabs/src/tabs.vue +185 -185
  237. package/packages/tag/index.js +8 -8
  238. package/packages/tag/src/tag.vue +39 -39
  239. package/packages/time-picker/index.js +8 -8
  240. package/packages/time-select/index.js +8 -8
  241. package/packages/tooltip/index.js +8 -8
  242. package/packages/tooltip/src/main.js +216 -216
  243. package/packages/transfer/index.js +8 -8
  244. package/packages/transfer/src/main.vue +231 -231
  245. package/packages/transfer/src/transfer-panel.vue +251 -251
  246. package/packages/tree/index.js +8 -8
  247. package/packages/tree/src/model/node.js +481 -481
  248. package/packages/tree/src/model/tree-store.js +333 -333
  249. package/packages/tree/src/model/util.js +27 -27
  250. package/packages/tree/src/tree-node.vue +277 -277
  251. package/packages/tree/src/tree.vue +495 -495
  252. package/packages/upload/index.js +8 -8
  253. package/packages/upload/src/ajax.js +85 -85
  254. package/packages/upload/src/index.vue +315 -315
  255. package/packages/upload/src/upload-dragger.vue +70 -70
  256. package/packages/upload/src/upload-list.vue +103 -103
  257. package/packages/upload/src/upload.vue +211 -211
  258. package/src/directives/mousewheel.js +18 -18
  259. package/src/directives/repeat-click.js +24 -24
  260. package/src/index.js +1 -1
  261. package/src/locale/format.js +46 -46
  262. package/src/locale/index.js +48 -48
  263. package/src/locale/lang/af-ZA.js +109 -109
  264. package/src/locale/lang/ar.js +108 -108
  265. package/src/locale/lang/bg.js +109 -109
  266. package/src/locale/lang/ca.js +108 -108
  267. package/src/locale/lang/cs-CZ.js +111 -111
  268. package/src/locale/lang/da.js +108 -108
  269. package/src/locale/lang/de.js +110 -110
  270. package/src/locale/lang/ee.js +109 -109
  271. package/src/locale/lang/el.js +109 -109
  272. package/src/locale/lang/en.js +109 -109
  273. package/src/locale/lang/es.js +108 -108
  274. package/src/locale/lang/eu.js +109 -109
  275. package/src/locale/lang/fa.js +109 -109
  276. package/src/locale/lang/fi.js +109 -109
  277. package/src/locale/lang/fr.js +108 -108
  278. package/src/locale/lang/he.js +109 -109
  279. package/src/locale/lang/hu.js +108 -108
  280. package/src/locale/lang/id.js +109 -109
  281. package/src/locale/lang/it.js +108 -108
  282. package/src/locale/lang/ja.js +109 -109
  283. package/src/locale/lang/km.js +109 -109
  284. package/src/locale/lang/ko.js +109 -109
  285. package/src/locale/lang/ku.js +109 -109
  286. package/src/locale/lang/kz.js +109 -109
  287. package/src/locale/lang/lt.js +109 -109
  288. package/src/locale/lang/lv.js +109 -109
  289. package/src/locale/lang/mn.js +109 -109
  290. package/src/locale/lang/nb-NO.js +108 -108
  291. package/src/locale/lang/nl.js +109 -109
  292. package/src/locale/lang/pl.js +109 -109
  293. package/src/locale/lang/pt-br.js +109 -109
  294. package/src/locale/lang/pt.js +109 -109
  295. package/src/locale/lang/ro.js +109 -109
  296. package/src/locale/lang/ru-RU.js +109 -109
  297. package/src/locale/lang/sk.js +111 -111
  298. package/src/locale/lang/sl.js +109 -109
  299. package/src/locale/lang/sr.js +109 -109
  300. package/src/locale/lang/sv-SE.js +109 -109
  301. package/src/locale/lang/ta.js +108 -108
  302. package/src/locale/lang/th.js +109 -109
  303. package/src/locale/lang/tk.js +109 -109
  304. package/src/locale/lang/tr-TR.js +109 -109
  305. package/src/locale/lang/ua.js +109 -109
  306. package/src/locale/lang/ug-CN.js +109 -109
  307. package/src/locale/lang/vi.js +109 -109
  308. package/src/locale/lang/zh-CN.js +109 -109
  309. package/src/locale/lang/zh-TW.js +109 -109
  310. package/src/mixins/emitter.js +33 -33
  311. package/src/mixins/focus.js +9 -9
  312. package/src/mixins/locale.js +9 -9
  313. package/src/mixins/migrating.js +51 -51
  314. package/src/transitions/collapse-transition.js +77 -77
  315. package/src/utils/after-leave.js +27 -27
  316. package/src/utils/aria-dialog.js +90 -90
  317. package/src/utils/aria-utils.js +121 -121
  318. package/src/utils/clickoutside.js +76 -76
  319. package/src/utils/date.js +344 -344
  320. package/src/utils/dom.js +174 -174
  321. package/src/utils/menu/aria-menubar.js +14 -14
  322. package/src/utils/menu/aria-menuitem.js +49 -49
  323. package/src/utils/menu/aria-submenu.js +59 -59
  324. package/src/utils/merge.js +15 -15
  325. package/src/utils/popper.js +1276 -1276
  326. package/src/utils/popup/index.js +226 -226
  327. package/src/utils/popup/popup-manager.js +194 -194
  328. package/src/utils/resize-event.js +35 -35
  329. package/src/utils/scroll-into-view.js +27 -27
  330. package/src/utils/scrollbar-width.js +29 -29
  331. package/src/utils/shared.js +7 -7
  332. package/src/utils/util.js +122 -122
  333. package/src/utils/vdom.js +9 -9
  334. package/src/utils/vue-popper.js +200 -200
@@ -1,8 +1,8 @@
1
- import ElCheckbox from './src/checkbox';
2
-
3
- /* istanbul ignore next */
4
- ElCheckbox.install = function(Vue) {
5
- Vue.component(ElCheckbox.name, ElCheckbox);
6
- };
7
-
8
- export default ElCheckbox;
1
+ import ElCheckbox from './src/checkbox';
2
+
3
+ /* istanbul ignore next */
4
+ ElCheckbox.install = function(Vue) {
5
+ Vue.component(ElCheckbox.name, ElCheckbox);
6
+ };
7
+
8
+ export default ElCheckbox;
@@ -1,191 +1,191 @@
1
- <template>
2
- <label
3
- class="el-checkbox-button"
4
- :class="[
5
- size ? 'el-checkbox-button--' + size : '',
6
- { 'is-disabled': isDisabled },
7
- { 'is-checked': isChecked },
8
- { 'is-focus': focus },
9
- ]"
10
- role="checkbox"
11
- :aria-checked="isChecked"
12
- :aria-disabled="isDisabled"
13
- >
14
- <input
15
- v-if="trueLabel || falseLabel"
16
- class="el-checkbox-button__original"
17
- type="checkbox"
18
- :name="name"
19
- :disabled="isDisabled"
20
- :true-value="trueLabel"
21
- :false-value="falseLabel"
22
- v-model="model"
23
- @change="handleChange"
24
- @focus="focus = true"
25
- @blur="focus = false">
26
- <input
27
- v-else
28
- class="el-checkbox-button__original"
29
- type="checkbox"
30
- :name="name"
31
- :disabled="isDisabled"
32
- :value="label"
33
- v-model="model"
34
- @change="handleChange"
35
- @focus="focus = true"
36
- @blur="focus = false">
37
-
38
- <span class="el-checkbox-button__inner"
39
- v-if="$slots.default || label"
40
- :style="isChecked ? activeStyle : null">
41
- <slot>{{label}}</slot>
42
- </span>
43
-
44
- </label>
45
- </template>
46
- <script>
47
- import Emitter from 'element-ui/src/mixins/emitter';
48
-
49
- export default {
50
- name: 'ElCheckboxButton',
51
-
52
- mixins: [Emitter],
53
-
54
- inject: {
55
- elForm: {
56
- default: ''
57
- },
58
- elFormItem: {
59
- default: ''
60
- }
61
- },
62
-
63
- data() {
64
- return {
65
- selfModel: false,
66
- focus: false,
67
- isLimitExceeded: false
68
- };
69
- },
70
-
71
- props: {
72
- value: {},
73
- label: {},
74
- disabled: Boolean,
75
- checked: Boolean,
76
- name: String,
77
- trueLabel: [String, Number],
78
- falseLabel: [String, Number]
79
- },
80
- computed: {
81
- model: {
82
- get() {
83
- return this._checkboxGroup
84
- ? this.store : this.value !== undefined
85
- ? this.value : this.selfModel;
86
- },
87
-
88
- set(val) {
89
- if (this._checkboxGroup) {
90
- this.isLimitExceeded = false;
91
- (this._checkboxGroup.min !== undefined &&
92
- val.length < this._checkboxGroup.min &&
93
- (this.isLimitExceeded = true));
94
-
95
- (this._checkboxGroup.max !== undefined &&
96
- val.length > this._checkboxGroup.max &&
97
- (this.isLimitExceeded = true));
98
-
99
- this.isLimitExceeded === false &&
100
- this.dispatch('ElCheckboxGroup', 'input', [val]);
101
- } else if (this.value !== undefined) {
102
- this.$emit('input', val);
103
- } else {
104
- this.selfModel = val;
105
- }
106
- }
107
- },
108
-
109
- isChecked() {
110
- if ({}.toString.call(this.model) === '[object Boolean]') {
111
- return this.model;
112
- } else if (Array.isArray(this.model)) {
113
- return this.model.indexOf(this.label) > -1;
114
- } else if (this.model !== null && this.model !== undefined) {
115
- return this.model === this.trueLabel;
116
- }
117
- },
118
-
119
- _checkboxGroup() {
120
- let parent = this.$parent;
121
- while (parent) {
122
- if (parent.$options.componentName !== 'ElCheckboxGroup') {
123
- parent = parent.$parent;
124
- } else {
125
- return parent;
126
- }
127
- }
128
- return false;
129
- },
130
-
131
- store() {
132
- return this._checkboxGroup ? this._checkboxGroup.value : this.value;
133
- },
134
-
135
- activeStyle() {
136
- return {
137
- backgroundColor: this._checkboxGroup.fill || '',
138
- borderColor: this._checkboxGroup.fill || '',
139
- color: this._checkboxGroup.textColor || '',
140
- 'box-shadow': '-1px 0 0 0 ' + this._checkboxGroup.fill
141
-
142
- };
143
- },
144
-
145
- _elFormItemSize() {
146
- return (this.elFormItem || {}).elFormItemSize;
147
- },
148
-
149
- size() {
150
- return this._checkboxGroup.checkboxGroupSize || this._elFormItemSize || (this.$ELEMENT || {}).size;
151
- },
152
-
153
- isDisabled() {
154
- return this._checkboxGroup
155
- ? this._checkboxGroup.disabled || this.disabled || (this.elForm || {}).disabled
156
- : this.disabled || (this.elForm || {}).disabled;
157
- }
158
- },
159
- methods: {
160
- addToStore() {
161
- if (
162
- Array.isArray(this.model) &&
163
- this.model.indexOf(this.label) === -1
164
- ) {
165
- this.model.push(this.label);
166
- } else {
167
- this.model = this.trueLabel || true;
168
- }
169
- },
170
- handleChange(ev) {
171
- if (this.isLimitExceeded) return;
172
- let value;
173
- if (ev.target.checked) {
174
- value = this.trueLabel === undefined ? true : this.trueLabel;
175
- } else {
176
- value = this.falseLabel === undefined ? false : this.falseLabel;
177
- }
178
- this.$emit('change', value, ev);
179
- this.$nextTick(() => {
180
- if (this._checkboxGroup) {
181
- this.dispatch('ElCheckboxGroup', 'change', [this._checkboxGroup.value]);
182
- }
183
- });
184
- }
185
- },
186
-
187
- created() {
188
- this.checked && this.addToStore();
189
- }
190
- };
191
- </script>
1
+ <template>
2
+ <label
3
+ class="el-checkbox-button"
4
+ :class="[
5
+ size ? 'el-checkbox-button--' + size : '',
6
+ { 'is-disabled': isDisabled },
7
+ { 'is-checked': isChecked },
8
+ { 'is-focus': focus },
9
+ ]"
10
+ role="checkbox"
11
+ :aria-checked="isChecked"
12
+ :aria-disabled="isDisabled"
13
+ >
14
+ <input
15
+ v-if="trueLabel || falseLabel"
16
+ class="el-checkbox-button__original"
17
+ type="checkbox"
18
+ :name="name"
19
+ :disabled="isDisabled"
20
+ :true-value="trueLabel"
21
+ :false-value="falseLabel"
22
+ v-model="model"
23
+ @change="handleChange"
24
+ @focus="focus = true"
25
+ @blur="focus = false">
26
+ <input
27
+ v-else
28
+ class="el-checkbox-button__original"
29
+ type="checkbox"
30
+ :name="name"
31
+ :disabled="isDisabled"
32
+ :value="label"
33
+ v-model="model"
34
+ @change="handleChange"
35
+ @focus="focus = true"
36
+ @blur="focus = false">
37
+
38
+ <span class="el-checkbox-button__inner"
39
+ v-if="$slots.default || label"
40
+ :style="isChecked ? activeStyle : null">
41
+ <slot>{{label}}</slot>
42
+ </span>
43
+
44
+ </label>
45
+ </template>
46
+ <script>
47
+ import Emitter from '@penggy/element-ui/src/mixins/emitter';
48
+
49
+ export default {
50
+ name: 'ElCheckboxButton',
51
+
52
+ mixins: [Emitter],
53
+
54
+ inject: {
55
+ elForm: {
56
+ default: ''
57
+ },
58
+ elFormItem: {
59
+ default: ''
60
+ }
61
+ },
62
+
63
+ data() {
64
+ return {
65
+ selfModel: false,
66
+ focus: false,
67
+ isLimitExceeded: false
68
+ };
69
+ },
70
+
71
+ props: {
72
+ value: {},
73
+ label: {},
74
+ disabled: Boolean,
75
+ checked: Boolean,
76
+ name: String,
77
+ trueLabel: [String, Number],
78
+ falseLabel: [String, Number]
79
+ },
80
+ computed: {
81
+ model: {
82
+ get() {
83
+ return this._checkboxGroup
84
+ ? this.store : this.value !== undefined
85
+ ? this.value : this.selfModel;
86
+ },
87
+
88
+ set(val) {
89
+ if (this._checkboxGroup) {
90
+ this.isLimitExceeded = false;
91
+ (this._checkboxGroup.min !== undefined &&
92
+ val.length < this._checkboxGroup.min &&
93
+ (this.isLimitExceeded = true));
94
+
95
+ (this._checkboxGroup.max !== undefined &&
96
+ val.length > this._checkboxGroup.max &&
97
+ (this.isLimitExceeded = true));
98
+
99
+ this.isLimitExceeded === false &&
100
+ this.dispatch('ElCheckboxGroup', 'input', [val]);
101
+ } else if (this.value !== undefined) {
102
+ this.$emit('input', val);
103
+ } else {
104
+ this.selfModel = val;
105
+ }
106
+ }
107
+ },
108
+
109
+ isChecked() {
110
+ if ({}.toString.call(this.model) === '[object Boolean]') {
111
+ return this.model;
112
+ } else if (Array.isArray(this.model)) {
113
+ return this.model.indexOf(this.label) > -1;
114
+ } else if (this.model !== null && this.model !== undefined) {
115
+ return this.model === this.trueLabel;
116
+ }
117
+ },
118
+
119
+ _checkboxGroup() {
120
+ let parent = this.$parent;
121
+ while (parent) {
122
+ if (parent.$options.componentName !== 'ElCheckboxGroup') {
123
+ parent = parent.$parent;
124
+ } else {
125
+ return parent;
126
+ }
127
+ }
128
+ return false;
129
+ },
130
+
131
+ store() {
132
+ return this._checkboxGroup ? this._checkboxGroup.value : this.value;
133
+ },
134
+
135
+ activeStyle() {
136
+ return {
137
+ backgroundColor: this._checkboxGroup.fill || '',
138
+ borderColor: this._checkboxGroup.fill || '',
139
+ color: this._checkboxGroup.textColor || '',
140
+ 'box-shadow': '-1px 0 0 0 ' + this._checkboxGroup.fill
141
+
142
+ };
143
+ },
144
+
145
+ _elFormItemSize() {
146
+ return (this.elFormItem || {}).elFormItemSize;
147
+ },
148
+
149
+ size() {
150
+ return this._checkboxGroup.checkboxGroupSize || this._elFormItemSize || (this.$ELEMENT || {}).size;
151
+ },
152
+
153
+ isDisabled() {
154
+ return this._checkboxGroup
155
+ ? this._checkboxGroup.disabled || this.disabled || (this.elForm || {}).disabled
156
+ : this.disabled || (this.elForm || {}).disabled;
157
+ }
158
+ },
159
+ methods: {
160
+ addToStore() {
161
+ if (
162
+ Array.isArray(this.model) &&
163
+ this.model.indexOf(this.label) === -1
164
+ ) {
165
+ this.model.push(this.label);
166
+ } else {
167
+ this.model = this.trueLabel || true;
168
+ }
169
+ },
170
+ handleChange(ev) {
171
+ if (this.isLimitExceeded) return;
172
+ let value;
173
+ if (ev.target.checked) {
174
+ value = this.trueLabel === undefined ? true : this.trueLabel;
175
+ } else {
176
+ value = this.falseLabel === undefined ? false : this.falseLabel;
177
+ }
178
+ this.$emit('change', value, ev);
179
+ this.$nextTick(() => {
180
+ if (this._checkboxGroup) {
181
+ this.dispatch('ElCheckboxGroup', 'change', [this._checkboxGroup.value]);
182
+ }
183
+ });
184
+ }
185
+ },
186
+
187
+ created() {
188
+ this.checked && this.addToStore();
189
+ }
190
+ };
191
+ </script>
@@ -1,48 +1,48 @@
1
- <script>
2
- import Emitter from 'element-ui/src/mixins/emitter';
3
-
4
- export default {
5
- name: 'ElCheckboxGroup',
6
-
7
- componentName: 'ElCheckboxGroup',
8
-
9
- mixins: [Emitter],
10
-
11
- inject: {
12
- elFormItem: {
13
- default: ''
14
- }
15
- },
16
-
17
- props: {
18
- value: {},
19
- disabled: Boolean,
20
- min: Number,
21
- max: Number,
22
- size: String,
23
- fill: String,
24
- textColor: String
25
- },
26
-
27
- computed: {
28
- _elFormItemSize() {
29
- return (this.elFormItem || {}).elFormItemSize;
30
- },
31
- checkboxGroupSize() {
32
- return this.size || this._elFormItemSize || (this.$ELEMENT || {}).size;
33
- }
34
- },
35
-
36
- watch: {
37
- value(value) {
38
- this.dispatch('ElFormItem', 'el.form.change', [value]);
39
- }
40
- }
41
- };
42
- </script>
43
-
44
- <template>
45
- <div class="el-checkbox-group" role="group" aria-label="checkbox-group">
46
- <slot></slot>
47
- </div>
48
- </template>
1
+ <script>
2
+ import Emitter from '@penggy/element-ui/src/mixins/emitter';
3
+
4
+ export default {
5
+ name: 'ElCheckboxGroup',
6
+
7
+ componentName: 'ElCheckboxGroup',
8
+
9
+ mixins: [Emitter],
10
+
11
+ inject: {
12
+ elFormItem: {
13
+ default: ''
14
+ }
15
+ },
16
+
17
+ props: {
18
+ value: {},
19
+ disabled: Boolean,
20
+ min: Number,
21
+ max: Number,
22
+ size: String,
23
+ fill: String,
24
+ textColor: String
25
+ },
26
+
27
+ computed: {
28
+ _elFormItemSize() {
29
+ return (this.elFormItem || {}).elFormItemSize;
30
+ },
31
+ checkboxGroupSize() {
32
+ return this.size || this._elFormItemSize || (this.$ELEMENT || {}).size;
33
+ }
34
+ },
35
+
36
+ watch: {
37
+ value(value) {
38
+ this.dispatch('ElFormItem', 'el.form.change', [value]);
39
+ }
40
+ }
41
+ };
42
+ </script>
43
+
44
+ <template>
45
+ <div class="el-checkbox-group" role="group" aria-label="checkbox-group">
46
+ <slot></slot>
47
+ </div>
48
+ </template>