index.js 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120
  1. import baseComponent from '../helpers/baseComponent'
  2. baseComponent({
  3. relations: {
  4. '../accordion/index': {
  5. type: 'child',
  6. observer() {
  7. this.callDebounceFn(this.updated)
  8. },
  9. },
  10. },
  11. properties: {
  12. prefixCls: {
  13. type: String,
  14. value: 'wux-accordion-group',
  15. },
  16. cellGroupPrefixCls: {
  17. type: String,
  18. value: 'wux-cell-group',
  19. },
  20. defaultCurrent: {
  21. type: Array,
  22. value: [],
  23. },
  24. current: {
  25. type: Array,
  26. value: [],
  27. observer(newVal) {
  28. if (this.data.controlled) {
  29. this.updated(newVal)
  30. }
  31. },
  32. },
  33. controlled: {
  34. type: Boolean,
  35. value: false,
  36. },
  37. accordion: {
  38. type: Boolean,
  39. value: false,
  40. },
  41. title: {
  42. type: String,
  43. value: '',
  44. },
  45. label: {
  46. type: String,
  47. value: '',
  48. },
  49. mode: {
  50. type: String,
  51. value: 'default',
  52. },
  53. bodyStyle: {
  54. type: [String, Object],
  55. value: '',
  56. },
  57. },
  58. data: {
  59. activeKey: '',
  60. keys: [],
  61. },
  62. methods: {
  63. updated(activeKey = this.data.activeKey) {
  64. if (this.data.activeKey !== activeKey) {
  65. this.setData({ activeKey })
  66. }
  67. this.changeCurrent(activeKey)
  68. },
  69. changeCurrent(activeKey) {
  70. const elements = this.getRelationsByName('../accordion/index')
  71. if (elements.length > 0) {
  72. elements.forEach((element, index) => {
  73. const key = element.data.key || String(index)
  74. const current = this.data.accordion ? activeKey[0] === key : activeKey.indexOf(key) !== -1
  75. element.changeCurrent(current, key)
  76. })
  77. }
  78. if (this.data.keys.length !== elements.length) {
  79. this.setData({
  80. keys: elements.map((element) => element.data),
  81. })
  82. }
  83. },
  84. emitEvent(key) {
  85. this.triggerEvent('change', {
  86. key,
  87. keys: this.data.keys,
  88. })
  89. },
  90. setActiveKey(activeKey) {
  91. if (!this.data.controlled) {
  92. this.updated(activeKey)
  93. }
  94. this.emitEvent(this.data.accordion ? activeKey[0] : activeKey)
  95. },
  96. onClickItem(key) {
  97. let activeKey = [...this.data.activeKey]
  98. if (this.data.accordion) {
  99. activeKey = activeKey[0] === key ? [] : [key]
  100. } else {
  101. activeKey = activeKey.indexOf(key) !== -1 ? activeKey.filter((n) => n !== key) : [...activeKey, key]
  102. }
  103. this.setActiveKey(activeKey)
  104. },
  105. },
  106. ready() {
  107. const { defaultCurrent, current, controlled } = this.data
  108. const activeKey = controlled ? current : defaultCurrent
  109. this.updated(activeKey)
  110. },
  111. })