UNPKG

tdesign-mobile-vue

Version:
1 lines 11.5 kB
{"version":3,"file":"pull-refresh.mjs","sources":["../../src/list/pull-refresh.tsx"],"sourcesContent":["import { defineComponent, nextTick, reactive, ref, computed, watch } from 'vue';\nimport { preventDefault } from '../shared/dom';\nimport config from '../config';\nimport TLoading from '../loading';\nimport { useConfig } from '../config-provider/useConfig';\n\nconst { prefix } = config;\nconst { globalConfig } = useConfig('list');\nconst name = `${prefix}-pull-refresh`;\ntype PullRefreshStatus = 'normal' | 'loading' | 'loosing' | 'pulling' | 'success';\n\nfunction useTouch() {\n const startY = ref(0);\n const deltaY = ref(0);\n\n const start = (event: TouchEvent) => {\n startY.value = event.touches[0].clientY;\n deltaY.value = 0;\n };\n const move = (event: TouchEvent) => {\n const touch = event.touches[0];\n deltaY.value = touch.clientY - startY.value;\n };\n return {\n startY,\n deltaY,\n start,\n move,\n };\n}\n\nconst PULL_DISTANCE = 50;\nconst ANIMATION_DURATION = 300;\nconst TEXT_MAP = {\n loading: globalConfig.value.loading,\n pulling: globalConfig.value.pulling,\n loosing: globalConfig.value.loosing,\n success: globalConfig.value.success,\n};\nconst SHOW_TEXT_LIST = ['pulling', 'loosing', 'success'];\nconst PullRefreshProps = {\n modelValue: Boolean,\n};\n\nconst easeDistance = (distance: number, pullDistance: number) => {\n if (distance > pullDistance) {\n if (distance < pullDistance * 2) {\n distance = pullDistance + (distance - pullDistance) / 2;\n } else {\n distance = pullDistance * 1.5 + (distance - pullDistance * 2) / 4;\n }\n }\n return Math.round(distance);\n};\n\nfunction isElement(node: Element) {\n const ELEMENT_NODE_TYPE = 1;\n return node.tagName !== 'HTML' && node.tagName !== 'BODY' && node.nodeType === ELEMENT_NODE_TYPE;\n}\n\nconst getScrollParent = (node: Element) => {\n let res = node;\n while (res && isElement(res)) {\n if (/auto|scroll/i.test(window.getComputedStyle(res).overflowY)) {\n return res;\n }\n res = res.parentNode as Element;\n }\n};\n\nexport default defineComponent({\n name,\n components: { TLoading },\n props: PullRefreshProps,\n emits: ['refresh', 'update:modelValue'],\n setup(props, { emit, slots }) {\n const state = reactive({\n status: 'normal' as PullRefreshStatus,\n distance: 0,\n duration: 0,\n });\n\n const setStatus = (distance: number, isLoading?: boolean) => {\n state.distance = distance;\n\n if (isLoading) {\n state.status = 'loading';\n } else if (distance === 0) {\n state.status = 'normal';\n } else if (distance < PULL_DISTANCE) {\n state.status = 'pulling';\n } else {\n state.status = 'loosing';\n }\n };\n\n const touch = useTouch();\n\n const isTouchable = () => state.status !== 'loading' && state.status !== 'success';\n\n const isReachTop = (e: TouchEvent) => {\n const scrollParent = getScrollParent(e.target as Element);\n return !scrollParent || !scrollParent.scrollTop;\n };\n\n const onTouchStart = (e: TouchEvent) => {\n if (!isReachTop(e)) return;\n\n if (isTouchable()) {\n state.duration = 0;\n touch.start(e);\n }\n };\n\n const onTouchMove = (e: TouchEvent) => {\n if (!isTouchable()) return;\n if (!isReachTop(e)) return;\n\n const { deltaY } = touch;\n if (deltaY.value >= 0) {\n preventDefault(e, false);\n setStatus(easeDistance(deltaY.value, PULL_DISTANCE));\n }\n touch.move(e);\n };\n\n const onTouchEnd = () => {\n state.duration = ANIMATION_DURATION;\n if (state.status === 'loosing') {\n emit('update:modelValue', true);\n nextTick(() => emit('refresh'));\n } else {\n setStatus(0);\n }\n };\n\n const trackStyle = computed(() => ({\n transitionDuration: `${state.duration}ms`,\n transform: state.distance ? `translate3d(0, ${state.distance}px, 0)` : '',\n }));\n\n watch(\n () => props.modelValue,\n (value) => {\n if (value) {\n setStatus(PULL_DISTANCE, true);\n } else {\n state.status = 'success';\n\n setTimeout(() => {\n setStatus(0, false);\n }, ANIMATION_DURATION);\n }\n },\n );\n\n return () => (\n <div class={name}>\n <div\n class={`${name}__track`}\n style={trackStyle.value}\n onTouchstart={onTouchStart}\n onTouchmove={onTouchMove}\n onTouchend={onTouchEnd}\n onTouchcancel={onTouchEnd}\n >\n <div class={`${name}__head`}>\n {SHOW_TEXT_LIST.includes(state.status) && <div>{TEXT_MAP[state.status]}</div>}\n {state.status === 'loading' && <TLoading text={globalConfig.value.loading} />}\n </div>\n {slots.default && slots.default()}\n </div>\n </div>\n );\n },\n});\n"],"names":["prefix","config","_useConfig","useConfig","globalConfig","name","useTouch","startY","ref","deltaY","start","event","value","touches","clientY","move","touch","PULL_DISTANCE","ANIMATION_DURATION","TEXT_MAP","loading","pulling","loosing","success","SHOW_TEXT_LIST","PullRefreshProps","modelValue","Boolean","easeDistance","distance","pullDistance","Math","round","isElement","node","ELEMENT_NODE_TYPE","tagName","nodeType","getScrollParent","res","test","window","getComputedStyle","overflowY","parentNode","defineComponent","components","TLoading","props","emits","setup","_ref","emit","slots","state","reactive","status","duration","setStatus","isLoading","isTouchable","isReachTop","e","scrollParent","target","scrollTop","onTouchStart","onTouchMove","preventDefault","onTouchEnd","nextTick","trackStyle","computed","transitionDuration","concat","transform","watch","setTimeout","_createVNode","includes","default"],"mappings":"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"}