|
@@ -0,0 +1,57 @@
|
|
|
|
|
+import {
|
|
|
|
|
+ reactive
|
|
|
|
|
+} from "vue"
|
|
|
|
|
+import {getUserIdentity} from "@/utils/common.js"
|
|
|
|
|
+
|
|
|
|
|
+export function useSwiper(Da, callBack) {
|
|
|
|
|
+
|
|
|
|
|
+ const userCode = getUserIdentity()
|
|
|
|
|
+
|
|
|
|
|
+ const swiperData = reactive({
|
|
|
|
|
+ startX: 0, // 触摸起点X坐标
|
|
|
|
|
+ isAllowed: true // 是否允许切
|
|
|
|
|
+ })
|
|
|
|
|
+
|
|
|
|
|
+ // if (userCode!='VIP') {
|
|
|
|
|
+ // swiperData.isAllowed = false;
|
|
|
|
|
+ // }
|
|
|
|
|
+
|
|
|
|
|
+ // 1. 触摸开始：记录起点
|
|
|
|
|
+ function handleTouchStart(e) {
|
|
|
|
|
+ swiperData.startX = e.touches[0].pageX;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ // 2. 触摸结束：校验距离与业务条件
|
|
|
|
|
+ function handleTouchEnd(e) {
|
|
|
|
|
+ const endX = e.changedTouches[0].pageX;
|
|
|
|
|
+ const deltaX = endX - swiperData.startX;
|
|
|
|
|
+ const absDeltaX = Math.abs(deltaX);
|
|
|
|
|
+
|
|
|
|
|
+ // 校验条件：滑动距离 > 10px 且业务条件通过
|
|
|
|
|
+ if (absDeltaX > 10 && checkBusinessCondition()) {
|
|
|
|
|
+ swiperData.isAllowed = true;
|
|
|
|
|
+ } else {
|
|
|
|
|
+ swiperData.isAllowed = false;
|
|
|
|
|
+ }
|
|
|
|
|
+ if (absDeltaX > 10) {
|
|
|
|
|
+ callBack && callBack(userCode)
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ // 4. 业务条件校验（示例）
|
|
|
|
|
+ function checkBusinessCondition() {
|
|
|
|
|
+ // if (userCode != 'VIP') {
|
|
|
|
|
+ // return false
|
|
|
|
|
+ // }
|
|
|
|
|
+ return true
|
|
|
|
|
+
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ return {
|
|
|
|
|
+ swiperData,
|
|
|
|
|
+ userCode,
|
|
|
|
|
+ handleTouchStart,
|
|
|
|
|
+ handleTouchEnd
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+}
|
wangxy