C端小程序
Nevar pievienot vairāk kā 25 tēmas Tēmai ir jāsākas ar burtu vai ciparu, tā var saturēt domu zīmes ('-') un var būt līdz 35 simboliem gara.

FMScrollGroupsControl.js 2.4 KiB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112
  1. // component/FMScrollGroupsControl/FMScrollGroupsControl.js
  2. Component({
  3. /**
  4. * 组件的属性列表
  5. */
  6. properties: {
  7. //楼层数组
  8. groupIDs: {
  9. type: Array,
  10. value: null
  11. },
  12. //视野内显示多少个按钮,可手触上下滚动
  13. showBtnCount: {
  14. type: Number,
  15. value: 0,
  16. observer: function (newVal, oldVal) {
  17. // console.log('height----', this.properties.showBtnCount * 84);
  18. if (this.properties.showBtnCount < this.properties.groupIDs.length) {
  19. this.setData({
  20. needArrow: true,
  21. scrollHeight: this.properties.showBtnCount * 84
  22. })
  23. }
  24. }
  25. },
  26. //当前的聚焦楼层id
  27. focusGroupID: {
  28. type: Number,
  29. value: 1,
  30. observer: function (newVal, oldVal) {
  31. console.log("focusGroupID")
  32. this._setArrowBtnStatus(this.properties.focusGroupID);
  33. }
  34. },
  35. allLayer: {
  36. type: Boolean
  37. }
  38. },
  39. /**
  40. * 组件的初始数据
  41. */
  42. data: {
  43. btnUrl: './image/',
  44. scrollHeight: 250,
  45. isTop: false,
  46. isBottom: true,
  47. needArrow: false
  48. },
  49. /**
  50. * 组件的方法列表
  51. */
  52. methods: {
  53. /**
  54. * 切换聚焦楼层
  55. * @param {*} e
  56. */
  57. switchGroup: function (e) {
  58. let focusId = e.currentTarget.dataset.gid;
  59. this.triggerEvent('switchGroup', focusId);
  60. this._setArrowBtnStatus(focusId);
  61. },
  62. /**
  63. * 设置上下箭头按钮的状态
  64. * @param {*} focusId 聚焦楼层id
  65. */
  66. _setArrowBtnStatus: function (focusId) {
  67. if (focusId === 1) {
  68. this.setData({
  69. isBottom: true
  70. })
  71. } else if (focusId === this.properties.groupIDs.length - 1) {
  72. this.setData({
  73. isTop: true
  74. })
  75. } else {
  76. this.setData({
  77. isTop: false,
  78. isBottom: false
  79. })
  80. }
  81. },
  82. /**
  83. * 切换单层多层
  84. */
  85. switchLayers: function () {
  86. this.triggerEvent('switchLayers');
  87. },
  88. /**
  89. * 向上切换楼层
  90. */
  91. goTop: function () {
  92. let gid = this.properties.focusGroupID + 1;
  93. this.triggerEvent('switchGroup', gid);
  94. this._setArrowBtnStatus(gid);
  95. },
  96. /**
  97. * 向下切换楼层
  98. */
  99. goBottom: function () {
  100. let gid = this.properties.focusGroupID - 1;
  101. this.triggerEvent('switchGroup', gid);
  102. this._setArrowBtnStatus(gid);
  103. }
  104. }
  105. })