| 1 |
- {"version":3,"sources":["../src/indexes/indexes.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAe,MAAM,qBAAqB,CAAC;AAUlE,MAAM,CAAC,OAAO,OAAO,QAAS,SAAQ,cAAc;IAClD,eAAe,WAAgC;IAE/C,UAAU,kCAAS;IAEnB,SAAS;mBACI,QAAQ;qBAUN,QAAQ;MAGrB;IAEF,IAAI;;;;;;;MAOF;IAEF,KAAK,MAAQ;IAEb,QAAQ,MAAQ;IAEhB,MAAM,MAAQ;IAEd,KAAK;IAIL,SAAS;IAaT,UAAU;IAwBV,aAAa,CAAC,IAAI,KAAA;IAclB,wBAAwB,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM;IASnD,qBAAqB,CAAC,SAAS,EAAE,MAAM;IASvC,SAAS,CAAC,IAAI,KAAA;IAKd,cAAc,CAAC,KAAK,KAAA;IASpB,eAAe,CAAC,GAAG,KAAA;IAsBnB,cAAc;IAmBd,YAAY;IAEZ,WAAW,CAAC,CAAC,KAAA;IAIb,aAAa;IAIb,UAAU,CAAC,CAAC,KAAA;IAKZ,SAAS,CAAC,CAAC,KAAA;IAKX,YAAY,CAAC,CAAC,KAAA;CAMf","file":"indexes.d.ts","sourcesContent":["import { SuperComponent, wxComponent } from '../common/src/index';\nimport config from '../common/config';\nimport props from './props';\n\nconst { prefix } = config;\n\nconst classPrefix = `${prefix}-indexes`;\nconst topOffset = 40; // 滑动选中高亮的顶部偏移(px)\n\n@wxComponent()\nexport default class IndexBar extends SuperComponent {\n externalClasses = ['t-class', 't-class-index'];\n\n properties = props;\n\n observers = {\n list(this: IndexBar, newValue) {\n let groups = newValue;\n // 分组没有title属性时，默认以index作为title\n if (!!newValue.length && newValue[0].title === undefined) {\n groups = groups.map((g) => {\n return { title: g.index, ...g };\n });\n }\n this.setData({ groups });\n },\n height(this: IndexBar) {\n this.getDomInfo();\n },\n };\n\n data = {\n classPrefix,\n clientHeight: 0,\n groups: [],\n activeGroup: null, // 当前高亮group\n currentGroup: null, // 当前跳转group\n showScrollTip: false,\n };\n\n timer = null;\n\n groupTop = null;\n\n btnBar = null;\n\n ready() {\n this.getHeight();\n }\n\n getHeight() {\n wx.getSystemInfo({\n success: (res) => {\n this.setData(\n {\n clientHeight: res.windowHeight,\n },\n this.getDomInfo,\n );\n },\n });\n }\n\n getDomInfo() {\n const query = this.createSelectorQuery();\n query.select(`#id-${classPrefix}__bar`).boundingClientRect();\n query.selectAll(`.${classPrefix}__group`).boundingClientRect();\n query.exec((res) => {\n if (!res[0]) return;\n this.btnBar = {\n top: res[0].top,\n height: res[0].height,\n itemHeight: res[0].height / this.data.groups.length,\n };\n if (!res[1]) return;\n // 计算每个group的scrollTop\n this.groupTop = res[1].map((element) => element.height);\n this.groupTop.reduce((acc, cur, index) => {\n const amount = acc + cur;\n this.groupTop[index] = amount;\n\n return amount;\n });\n });\n }\n\n // 通过点击索引的点击位置，判断点击的索引下标位置。\n computedIndex(tapY) {\n const offsetY = tapY - this.btnBar.top;\n let index;\n if (offsetY < 0) {\n index = 0;\n } else if (offsetY > this.btnBar.height) {\n index = this.data.groups.length - 1;\n } else {\n index = Math.floor(offsetY / this.btnBar.itemHeight);\n }\n return index;\n }\n\n // 通过scroll-view滑动高度计算当前下标位置\n computedIndexByScrollTop(scrollTop: number): number {\n if (!this.groupTop) {\n return -1;\n }\n\n return this.groupTop.findIndex((element) => element - topOffset > scrollTop);\n }\n\n // 在scroll-view滑动过程中，高亮对应的index\n activeIndexWhenScroll(scrollTop: number) {\n const curIndex = this.computedIndexByScrollTop(scrollTop);\n if (curIndex >= 0) {\n this.setData({\n activeGroup: this.data.groups[curIndex],\n });\n }\n }\n\n scrollToY(tapY) {\n const index = this.computedIndex(tapY);\n this.scrollToAnchor(index);\n }\n\n scrollToAnchor(index) {\n this.switchScrollTip(true);\n const curGroup = this.data.groups[index];\n this.setData({\n activeGroup: curGroup,\n currentGroup: curGroup,\n });\n }\n\n switchScrollTip(val) {\n val = !!val;\n const switchFun = (value) => {\n if (this.data.showScrollTip === value) {\n return;\n }\n this.setData({\n showScrollTip: value,\n });\n };\n // 关闭tip有延时，开启无延时\n if (!val) {\n clearInterval(this.timer);\n this.timer = setTimeout(() => {\n switchFun(false);\n }, 300);\n } else {\n switchFun(true);\n }\n }\n\n // 控制触发频率(防抖)\n throttleScroll() {\n return new Promise<void>((resolve) => {\n const delay = 100;\n const now = Date.now();\n if (this.lastScrollTime && this.lastScrollTime + delay > now) {\n if (this.scrollTimer) {\n clearTimeout(this.scrollTimer);\n }\n this.scrollTimer = setTimeout(() => {\n this.lastScrollTime = now;\n resolve();\n }, delay);\n } else {\n this.lastScrollTime = now;\n resolve();\n }\n });\n }\n\n onTouchStart() {}\n\n onTouchMove(e) {\n this.throttleScroll().then(() => this.scrollToY(e.changedTouches[0].pageY));\n }\n\n onTouchCancel() {\n this.switchScrollTip(false);\n }\n\n onTouchEnd(e) {\n this.switchScrollTip(false);\n this.scrollToY(e.changedTouches[0].pageY);\n }\n\n onCellTap(e) {\n const { indexes } = e.currentTarget.dataset;\n this.triggerEvent('select', { indexes });\n }\n\n onListScroll(e) {\n this.throttleScroll().then(() => {\n const { scrollTop } = e.detail;\n this.activeIndexWhenScroll(scrollTop);\n });\n }\n}\n"]}
|
