index.js 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155
  1. import { VantComponent } from '../common/component';
  2. VantComponent({
  3. classes: ['active-class', 'toolbar-class', 'column-class'],
  4. props: {
  5. title: String,
  6. loading: Boolean,
  7. showToolbar: Boolean,
  8. confirmButtonText: String,
  9. cancelButtonText: String,
  10. visibleItemCount: {
  11. type: Number,
  12. value: 5
  13. },
  14. valueKey: {
  15. type: String,
  16. value: 'text'
  17. },
  18. itemHeight: {
  19. type: Number,
  20. value: 44
  21. },
  22. columns: {
  23. type: Array,
  24. value: [],
  25. observer: function observer(columns) {
  26. var _this = this;
  27. if (columns === void 0) {
  28. columns = [];
  29. }
  30. this.set({
  31. simple: columns.length && !columns[0].values
  32. }, function () {
  33. var children = _this.children = _this.selectAllComponents('.van-picker__column');
  34. if (Array.isArray(children) && children.length) {
  35. _this.setColumns();
  36. }
  37. });
  38. }
  39. }
  40. },
  41. methods: {
  42. noop: function noop() {},
  43. setColumns: function setColumns() {
  44. var _this2 = this;
  45. var data = this.data;
  46. var columns = data.simple ? [{
  47. values: data.columns
  48. }] : data.columns;
  49. columns.forEach(function (columns, index) {
  50. _this2.setColumnValues(index, columns.values);
  51. });
  52. },
  53. emit: function emit(event) {
  54. var type = event.currentTarget.dataset.type;
  55. if (this.data.simple) {
  56. this.$emit(type, {
  57. value: this.getColumnValue(0),
  58. index: this.getColumnIndex(0)
  59. });
  60. } else {
  61. this.$emit(type, {
  62. value: this.getValues(),
  63. index: this.getIndexes()
  64. });
  65. }
  66. },
  67. onChange: function onChange(event) {
  68. if (this.data.simple) {
  69. this.$emit('change', {
  70. picker: this,
  71. value: this.getColumnValue(0),
  72. index: this.getColumnIndex(0)
  73. });
  74. } else {
  75. this.$emit('change', {
  76. picker: this,
  77. value: this.getValues(),
  78. index: event.currentTarget.dataset.index
  79. });
  80. }
  81. },
  82. // get column instance by index
  83. getColumn: function getColumn(index) {
  84. return this.children[index];
  85. },
  86. // get column value by index
  87. getColumnValue: function getColumnValue(index) {
  88. var column = this.getColumn(index);
  89. return column && column.getValue();
  90. },
  91. // set column value by index
  92. setColumnValue: function setColumnValue(index, value) {
  93. var column = this.getColumn(index);
  94. column && column.setValue(value);
  95. },
  96. // get column option index by column index
  97. getColumnIndex: function getColumnIndex(columnIndex) {
  98. return (this.getColumn(columnIndex) || {}).data.currentIndex;
  99. },
  100. // set column option index by column index
  101. setColumnIndex: function setColumnIndex(columnIndex, optionIndex) {
  102. var column = this.getColumn(columnIndex);
  103. column && column.setIndex(optionIndex);
  104. },
  105. // get options of column by index
  106. getColumnValues: function getColumnValues(index) {
  107. return (this.children[index] || {}).data.options;
  108. },
  109. // set options of column by index
  110. setColumnValues: function setColumnValues(index, options) {
  111. var column = this.children[index];
  112. if (column && JSON.stringify(column.data.options) !== JSON.stringify(options)) {
  113. column.set({
  114. options: options
  115. }, function () {
  116. column.setIndex(0);
  117. });
  118. }
  119. },
  120. // get values of all columns
  121. getValues: function getValues() {
  122. return this.children.map(function (child) {
  123. return child.getValue();
  124. });
  125. },
  126. // set values of all columns
  127. setValues: function setValues(values) {
  128. var _this3 = this;
  129. values.forEach(function (value, index) {
  130. _this3.setColumnValue(index, value);
  131. });
  132. },
  133. // get indexes of all columns
  134. getIndexes: function getIndexes() {
  135. return this.children.map(function (child) {
  136. return child.data.currentIndex;
  137. });
  138. },
  139. // set indexes of all columns
  140. setIndexes: function setIndexes(indexes) {
  141. var _this4 = this;
  142. indexes.forEach(function (optionIndex, columnIndex) {
  143. _this4.setColumnIndex(columnIndex, optionIndex);
  144. });
  145. }
  146. }
  147. });