index.js 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120
  1. import {
  2. getHeight
  3. } from "../../utils/getHeight";
  4. Component({
  5. properties: {
  6. list: {
  7. type: Array,
  8. value: [{
  9. label: "筛选1",
  10. index: null,
  11. showName: "name", //显示字段
  12. valueKey: "name", //返回Key
  13. selectKey: "id", //传参 代表选着字段 不传参返回整个选择对象
  14. value: "", //选中值
  15. list: [{
  16. name: "a1",
  17. id: 0
  18. }, {
  19. name: "a2",
  20. id: 1
  21. }]
  22. }]
  23. },
  24. show: Boolean,
  25. handle: Function, //按钮回调函数
  26. dateRange: Boolean, //是否开启日期范围筛选
  27. zIndex: {
  28. type: String,
  29. value: 99999,
  30. },
  31. interrupt: Function
  32. },
  33. data: {
  34. startdate: "", //开始时间
  35. enddate: "", //结束时间
  36. },
  37. lifetimes: {
  38. ready() {
  39. getHeight('.head', this).then(res => this.setData({
  40. listHeight: res - 80
  41. }));
  42. }
  43. },
  44. methods: {
  45. /* 选择 */
  46. onSelect(e) {
  47. const {
  48. item, //被选项
  49. index, //列表下标
  50. i //被选项下标
  51. } = e.currentTarget.dataset;
  52. if (this.data.list[index].index == i) {
  53. this.setData({
  54. [`list[${index}].value`]: "",
  55. [`list[${index}].index`]: null
  56. });
  57. } else {
  58. this.setData({
  59. [`list[${index}].value`]: this.data.list[index].selectKey ? item[this.data.list[index].selectKey] : item,
  60. [`list[${index}].index`]: i
  61. });
  62. };
  63. if (this.data.list[index].interrupt) this.triggerEvent("interrupt", {
  64. item,
  65. index,
  66. name: this.data.list[index].selectKey,
  67. list: this.data.list
  68. })
  69. },
  70. /* 点击按钮 */
  71. onClick(e) {
  72. const {
  73. name
  74. } = e.target.dataset;
  75. if (name == 'reset') {
  76. this.setData({
  77. list: this.data.list.map(v => {
  78. v.value = "";
  79. v.index = null;
  80. return v;
  81. })
  82. })
  83. this.setData({
  84. startdate: '',
  85. enddate: ''
  86. })
  87. this.triggerEvent("handle", {})
  88. } else if (name == 'confirm') {
  89. let obj = {};
  90. this.data.list.forEach(v => {
  91. if (v.type == 'multilevelClass') {
  92. obj[v.valueKey] = getApp().globalData.temporaryId;
  93. delete(getApp().globalData.temporaryId);
  94. } else {
  95. obj[v.valueKey] = v.value;
  96. }
  97. });
  98. if (this.data.dateRange) {
  99. obj.startdate = this.data.startdate;
  100. obj.enddate = this.data.enddate;
  101. };
  102. this.triggerEvent("handle", obj);
  103. }
  104. this.onClose();
  105. },
  106. /* 筛选日期范围 */
  107. changeDate(e) {
  108. const name = e.currentTarget.dataset.name,
  109. value = e.detail.value;
  110. this.setData({
  111. [name]: value
  112. })
  113. },
  114. onClose() {
  115. this.setData({
  116. show: false
  117. })
  118. }
  119. }
  120. })