index.js 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687
  1. import { VantComponent } from '../common/component';
  2. import { addUnit } from '../common/utils';
  3. function emit(target, value) {
  4. target.$emit('input', value);
  5. target.$emit('change', value);
  6. }
  7. VantComponent({
  8. field: true,
  9. relation: {
  10. name: 'checkbox-group',
  11. type: 'ancestor',
  12. linked(target) {
  13. this.parent = target;
  14. },
  15. unlinked() {
  16. this.parent = null;
  17. }
  18. },
  19. classes: ['icon-class', 'label-class'],
  20. props: {
  21. value: Boolean,
  22. disabled: Boolean,
  23. useIconSlot: Boolean,
  24. checkedColor: String,
  25. labelPosition: String,
  26. labelDisabled: Boolean,
  27. shape: {
  28. type: String,
  29. value: 'round'
  30. },
  31. iconSize: {
  32. type: null,
  33. observer: 'setSizeWithUnit'
  34. }
  35. },
  36. data: {
  37. sizeWithUnit: '20px'
  38. },
  39. methods: {
  40. emitChange(value) {
  41. if (this.parent) {
  42. this.setParentValue(this.parent, value);
  43. }
  44. else {
  45. emit(this, value);
  46. }
  47. },
  48. toggle() {
  49. const { disabled, value } = this.data;
  50. if (!disabled) {
  51. this.emitChange(!value);
  52. }
  53. },
  54. onClickLabel() {
  55. const { labelDisabled, disabled, value } = this.data;
  56. if (!disabled && !labelDisabled) {
  57. this.emitChange(!value);
  58. }
  59. },
  60. setParentValue(parent, value) {
  61. const parentValue = parent.data.value.slice();
  62. const { name } = this.data;
  63. const { max } = parent.data;
  64. if (value) {
  65. if (max && parentValue.length >= max) {
  66. return;
  67. }
  68. if (parentValue.indexOf(name) === -1) {
  69. parentValue.push(name);
  70. emit(parent, parentValue);
  71. }
  72. }
  73. else {
  74. const index = parentValue.indexOf(name);
  75. if (index !== -1) {
  76. parentValue.splice(index, 1);
  77. emit(parent, parentValue);
  78. }
  79. }
  80. },
  81. setSizeWithUnit(size) {
  82. this.set({
  83. sizeWithUnit: addUnit(size)
  84. });
  85. },
  86. }
  87. });