Group.js 5.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. Object.defineProperty(exports, "__esModule", {
  4. value: true
  5. });
  6. exports.default = void 0;
  7. var _vue = require("vue");
  8. var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
  9. var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
  10. var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/createForOfIteratorHelper"));
  11. var _Checkbox = _interopRequireDefault(require("./Checkbox"));
  12. var _FormItemContext = require("../form/FormItemContext");
  13. var _useConfigInject2 = _interopRequireDefault(require("../_util/hooks/useConfigInject"));
  14. var _interface = require("./interface");
  15. var _default2 = (0, _vue.defineComponent)({
  16. compatConfig: {
  17. MODE: 3
  18. },
  19. name: 'ACheckboxGroup',
  20. props: (0, _interface.checkboxGroupProps)(),
  21. // emits: ['change', 'update:value'],
  22. setup: function setup(props, _ref) {
  23. var slots = _ref.slots,
  24. emit = _ref.emit,
  25. expose = _ref.expose;
  26. var formItemContext = (0, _FormItemContext.useInjectFormItemContext)();
  27. var _useConfigInject = (0, _useConfigInject2.default)('checkbox', props),
  28. prefixCls = _useConfigInject.prefixCls,
  29. direction = _useConfigInject.direction;
  30. var mergedValue = (0, _vue.ref)((props.value === undefined ? props.defaultValue : props.value) || []);
  31. (0, _vue.watch)(function () {
  32. return props.value;
  33. }, function () {
  34. mergedValue.value = props.value || [];
  35. });
  36. var options = (0, _vue.computed)(function () {
  37. return props.options.map(function (option) {
  38. if (typeof option === 'string' || typeof option === 'number') {
  39. return {
  40. label: option,
  41. value: option
  42. };
  43. }
  44. return option;
  45. });
  46. });
  47. var triggerUpdate = (0, _vue.ref)(Symbol());
  48. var registeredValuesMap = (0, _vue.ref)(new Map());
  49. var cancelValue = function cancelValue(id) {
  50. registeredValuesMap.value.delete(id);
  51. triggerUpdate.value = Symbol();
  52. };
  53. var registerValue = function registerValue(id, value) {
  54. registeredValuesMap.value.set(id, value);
  55. triggerUpdate.value = Symbol();
  56. };
  57. var registeredValues = (0, _vue.ref)(new Map());
  58. (0, _vue.watch)(triggerUpdate, function () {
  59. var valuseMap = new Map();
  60. var _iterator = (0, _createForOfIteratorHelper2.default)(registeredValuesMap.value.values()),
  61. _step;
  62. try {
  63. for (_iterator.s(); !(_step = _iterator.n()).done;) {
  64. var value = _step.value;
  65. valuseMap.set(value, true);
  66. }
  67. } catch (err) {
  68. _iterator.e(err);
  69. } finally {
  70. _iterator.f();
  71. }
  72. registeredValues.value = valuseMap;
  73. });
  74. var toggleOption = function toggleOption(option) {
  75. var optionIndex = mergedValue.value.indexOf(option.value);
  76. var value = (0, _toConsumableArray2.default)(mergedValue.value);
  77. if (optionIndex === -1) {
  78. value.push(option.value);
  79. } else {
  80. value.splice(optionIndex, 1);
  81. }
  82. if (props.value === undefined) {
  83. mergedValue.value = value;
  84. }
  85. var val = value.filter(function (val) {
  86. return registeredValues.value.has(val);
  87. }).sort(function (a, b) {
  88. var indexA = options.value.findIndex(function (opt) {
  89. return opt.value === a;
  90. });
  91. var indexB = options.value.findIndex(function (opt) {
  92. return opt.value === b;
  93. });
  94. return indexA - indexB;
  95. });
  96. emit('update:value', val);
  97. emit('change', val);
  98. formItemContext.onFieldChange();
  99. };
  100. (0, _vue.provide)(_interface.CheckboxGroupContextKey, {
  101. cancelValue: cancelValue,
  102. registerValue: registerValue,
  103. toggleOption: toggleOption,
  104. mergedValue: mergedValue,
  105. name: (0, _vue.computed)(function () {
  106. return props.name;
  107. }),
  108. disabled: (0, _vue.computed)(function () {
  109. return props.disabled;
  110. })
  111. });
  112. expose({
  113. mergedValue: mergedValue
  114. });
  115. return function () {
  116. var _slots$default;
  117. var _props$id = props.id,
  118. id = _props$id === void 0 ? formItemContext.id.value : _props$id;
  119. var children = null;
  120. var groupPrefixCls = "".concat(prefixCls.value, "-group");
  121. if (options.value && options.value.length > 0) {
  122. children = options.value.map(function (option) {
  123. var _slots$label;
  124. return (0, _vue.createVNode)(_Checkbox.default, {
  125. "prefixCls": prefixCls.value,
  126. "key": option.value.toString(),
  127. "disabled": 'disabled' in option ? option.disabled : props.disabled,
  128. "indeterminate": option.indeterminate,
  129. "value": option.value,
  130. "checked": mergedValue.value.indexOf(option.value) !== -1,
  131. "onChange": option.onChange,
  132. "class": "".concat(groupPrefixCls, "-item")
  133. }, {
  134. default: function _default() {
  135. return [option.label === undefined ? (_slots$label = slots.label) === null || _slots$label === void 0 ? void 0 : _slots$label.call(slots, option) : option.label];
  136. }
  137. });
  138. });
  139. }
  140. return (0, _vue.createVNode)("div", {
  141. "class": [groupPrefixCls, (0, _defineProperty2.default)({}, "".concat(groupPrefixCls, "-rtl"), direction.value === 'rtl')],
  142. "id": id
  143. }, [children || ((_slots$default = slots.default) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots))]);
  144. };
  145. }
  146. });
  147. exports.default = _default2;