field-picker.ts 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344
  1. // module/user/components/field-picker/field-picker.ts
  2. Component({
  3. behaviors: ['wx://form-field'],
  4. lifetimes: {},
  5. properties: {
  6. title: { type: String, value: '' },
  7. options: { type: Array, value: [] },
  8. optionsColumns: { type: Number, value: 3 },
  9. itemHeight: { type: Number, value: 64 },
  10. multiple: { type: Boolean, value: true },
  11. closeOnOverlayClick: { type: Boolean, value: true },
  12. },
  13. data: {
  14. visible: false,
  15. value: [],
  16. selected: [] as Option[],
  17. },
  18. observers: {
  19. 'value, options'(values: Option[] | Option | string, options: Option[]) {
  20. const selected = new Set<Option>();
  21. if (options.length) {
  22. const _values = Array.isArray(values) ? values : values ? [values] : [];
  23. for (const item of _values) {
  24. const value = typeof item === 'object' ? item?.value : item;
  25. const option = options.find(item => item.value === value)
  26. if (option) selected.add(option);
  27. }
  28. }
  29. this.setData({ selected: [...selected] });
  30. },
  31. },
  32. methods: {
  33. onShow() {
  34. this.setData({ visible: true });
  35. },
  36. onPickerConfirm(event: any) {
  37. const { options } = event.detail;
  38. this.setData({ value: options })
  39. },
  40. onPickerClose() {
  41. this.setData({ visible: false })
  42. }
  43. }
  44. })