|
|
@@ -88,11 +88,8 @@
|
|
|
<!-- 温馨提示弹窗 -->
|
|
|
<KindReminder ref="kindReminder" @start="handleStartSelling" @viewRules="handleViewRules" />
|
|
|
|
|
|
- <view class="customer-service" :style="{
|
|
|
- left: servicePosition.left + 'px',
|
|
|
- right: servicePosition.right + 'px',
|
|
|
- bottom: servicePosition.bottom + 'px',
|
|
|
- }" @touchstart="touchStart" @touchmove="touchMove" @touchend="touchEnd">
|
|
|
+ <!-- 客服按钮 -->
|
|
|
+ <FloatingDrag :width="126" :height="140" :initial-position="servicePosition" @position-change="handlePositionChange">
|
|
|
<!-- #ifdef MP-ALIPAY -->
|
|
|
<button class="service-btn" @click="navigateToCustomerService">
|
|
|
<image src="/static/img/kf.png" mode="widthFix" style="width: 126rpx; height: 140rpx"></image>
|
|
|
@@ -103,7 +100,7 @@
|
|
|
<image src="/static/img/kf.png" mode="widthFix" style="width: 126rpx; height: 140rpx"></image>
|
|
|
</button>
|
|
|
<!-- #endif -->
|
|
|
- </view>
|
|
|
+ </FloatingDrag>
|
|
|
|
|
|
<ConfirmBooks ref="confirmBooks" @incomplete="handleIncomplete" />
|
|
|
<!-- 首单免费弹窗 -->
|
|
|
@@ -135,6 +132,7 @@ import UpsellBook from "./components/upsell-book.vue";
|
|
|
import UpsellRules from "./components/upsell-rules.vue";
|
|
|
import UpsellShare from "./components/upsell-share.vue";
|
|
|
import UpsellQrcode from "./components/upsell-qrcode.vue";
|
|
|
+import FloatingDrag from "@/components/floating-drag.vue";
|
|
|
import { eventBus } from "@/utils/event-bus";
|
|
|
|
|
|
const app = getApp();
|
|
|
@@ -153,6 +151,7 @@ export default {
|
|
|
UpsellRules,
|
|
|
UpsellShare,
|
|
|
UpsellQrcode,
|
|
|
+ FloatingDrag,
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
@@ -171,17 +170,6 @@ export default {
|
|
|
right: 0,
|
|
|
bottom: "20%",
|
|
|
},
|
|
|
- // 触摸开始位置
|
|
|
- startX: 0,
|
|
|
- startY: 0,
|
|
|
- // 屏幕宽度和高度
|
|
|
- screenWidth: 0,
|
|
|
- screenHeight: 0,
|
|
|
- // 初始位置记录,用于计算拖动
|
|
|
- initialLeft: 0,
|
|
|
- initialBottom: 0,
|
|
|
- // 是否正在更新位置,用于防止频繁更新
|
|
|
- isUpdatingPosition: false,
|
|
|
shareData: {},
|
|
|
deleteBook: {},
|
|
|
};
|
|
|
@@ -308,6 +296,11 @@ export default {
|
|
|
this.getLastOrder();
|
|
|
}
|
|
|
},
|
|
|
+ // #ifdef MP-ALIPAY
|
|
|
+ onPullDownRefresh() {
|
|
|
+ this.getLastOrder()
|
|
|
+ },
|
|
|
+ // #endif
|
|
|
|
|
|
//卸载loginSuccess事件
|
|
|
onUnload() {
|
|
|
@@ -319,8 +312,8 @@ export default {
|
|
|
// 登录成功之后
|
|
|
loginSuccess() {
|
|
|
let upsellCode = uni.getStorageSync("upsellCode");
|
|
|
- console.log(upsellCode, "登录成功之后助力的 code值:", upsellCode);
|
|
|
if (upsellCode) {
|
|
|
+ console.log(upsellCode, "登录成功之后助力的 code值:", upsellCode);
|
|
|
this.$refs.shareRef?.open(upsellCode);
|
|
|
}
|
|
|
this.getLastOrder();
|
|
|
@@ -362,110 +355,6 @@ export default {
|
|
|
this.$refs.upsellRulesRef.open();
|
|
|
},
|
|
|
|
|
|
- // 触摸开始
|
|
|
- touchStart(e) {
|
|
|
- const touch = e.touches[0];
|
|
|
- this.startX = touch.clientX;
|
|
|
- this.startY = touch.clientY;
|
|
|
-
|
|
|
- // 记录初始位置,用于计算移动距离
|
|
|
- if (this.servicePosition.right !== "auto") {
|
|
|
- // 如果是靠右定位,记录当前位置但不立即改变显示位置
|
|
|
- // 只在内部计算中使用,避免视觉上的位置跳动
|
|
|
- this.initialLeft = this.screenWidth - 126;
|
|
|
- } else {
|
|
|
- this.initialLeft = parseFloat(this.servicePosition.left);
|
|
|
- }
|
|
|
-
|
|
|
- // 如果bottom是百分比,转换为具体像素值,但不改变显示位置
|
|
|
- if (
|
|
|
- typeof this.servicePosition.bottom === "string" &&
|
|
|
- this.servicePosition.bottom.includes("%")
|
|
|
- ) {
|
|
|
- const percentage = parseFloat(this.servicePosition.bottom) / 100;
|
|
|
- this.initialBottom = this.screenHeight * percentage;
|
|
|
- } else {
|
|
|
- this.initialBottom = parseFloat(this.servicePosition.bottom);
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- // 触摸移动
|
|
|
- touchMove(e) {
|
|
|
- // 阻止默认行为,防止页面滚动
|
|
|
- e.preventDefault && e.preventDefault();
|
|
|
- e.stopPropagation && e.stopPropagation();
|
|
|
-
|
|
|
- const touch = e.touches[0];
|
|
|
-
|
|
|
- // 计算移动距离
|
|
|
- const deltaX = touch.clientX - this.startX;
|
|
|
- const deltaY = touch.clientY - this.startY;
|
|
|
-
|
|
|
- // 使用初始位置计算新位置,避免累积误差
|
|
|
- let newLeft = this.initialLeft + deltaX;
|
|
|
- let newBottom = this.initialBottom - deltaY; // 注意:y轴方向是相反的
|
|
|
-
|
|
|
- // 确保按钮不超出屏幕边界
|
|
|
- if (newLeft < 0) {
|
|
|
- newLeft = 0;
|
|
|
- } else if (newLeft > this.screenWidth - 126) {
|
|
|
- newLeft = this.screenWidth - 126;
|
|
|
- }
|
|
|
-
|
|
|
- // 确保按钮不超出屏幕垂直边界
|
|
|
- if (newBottom < 20) {
|
|
|
- newBottom = 20;
|
|
|
- } else if (newBottom > this.screenHeight - 160) {
|
|
|
- newBottom = this.screenHeight - 160;
|
|
|
- }
|
|
|
-
|
|
|
- // 使用节流方式更新位置,避免过于频繁的更新
|
|
|
- if (!this.isUpdatingPosition) {
|
|
|
- this.isUpdatingPosition = true;
|
|
|
-
|
|
|
- // 更新位置 - 第一次移动时才真正改变right为auto
|
|
|
- this.servicePosition = {
|
|
|
- left: newLeft,
|
|
|
- right: "auto",
|
|
|
- bottom: newBottom,
|
|
|
- };
|
|
|
-
|
|
|
- // 使用setTimeout代替requestAnimationFrame,在微信小程序中更兼容
|
|
|
- setTimeout(() => {
|
|
|
- this.isUpdatingPosition = false;
|
|
|
- }, 16); // 约等于60fps的刷新率
|
|
|
- }
|
|
|
-
|
|
|
- // 不更新起始点,保持相对于初始触摸点的位移计算
|
|
|
- // 这样可以避免累积误差,使拖动更精确
|
|
|
- },
|
|
|
-
|
|
|
- // 触摸结束,实现吸附效果
|
|
|
- touchEnd() {
|
|
|
- // 确保不再有待处理的更新
|
|
|
- this.isUpdatingPosition = false;
|
|
|
-
|
|
|
- const buttonCenter = this.servicePosition.left + 63; // 按钮中心位置
|
|
|
- const halfScreen = this.screenWidth / 2;
|
|
|
-
|
|
|
- // 判断是吸附到左边还是右边
|
|
|
- if (buttonCenter < halfScreen) {
|
|
|
- // 吸附到左边
|
|
|
- this.servicePosition = {
|
|
|
- left: 0,
|
|
|
- right: "auto",
|
|
|
- bottom: this.servicePosition.bottom,
|
|
|
- };
|
|
|
- } else {
|
|
|
- // 吸附到右边
|
|
|
- this.servicePosition = {
|
|
|
- left: "auto",
|
|
|
- right: 0,
|
|
|
- bottom: this.servicePosition.bottom,
|
|
|
- };
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
handleStart() {
|
|
|
this.showPopup = true;
|
|
|
},
|
|
|
@@ -615,8 +504,17 @@ export default {
|
|
|
})
|
|
|
: [];
|
|
|
this.serviceList = res.data.serviceList || [];
|
|
|
+ }else{
|
|
|
+ uni.showToast({
|
|
|
+ title: res.msg,
|
|
|
+ icon: "none",
|
|
|
+ });
|
|
|
}
|
|
|
- });
|
|
|
+ }).finally(()=>{
|
|
|
+ // #ifdef MP-ALIPAY
|
|
|
+ my.stopPullDownRefresh()
|
|
|
+ // #endif
|
|
|
+ })
|
|
|
},
|
|
|
|
|
|
goToScannedBooks() {
|
|
|
@@ -631,25 +529,19 @@ export default {
|
|
|
// 标记已显示过温馨提示
|
|
|
uni.setStorageSync("kindReminderShown", true);
|
|
|
},
|
|
|
+ // 处理位置变更
|
|
|
+ handlePositionChange(position) {
|
|
|
+ this.servicePosition = position;
|
|
|
+ },
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
-.customer-service {
|
|
|
- position: fixed;
|
|
|
- width: 126rpx;
|
|
|
- height: 140rpx;
|
|
|
- bottom: 20%;
|
|
|
- z-index: 999;
|
|
|
- transition: all 0.3s ease;
|
|
|
-
|
|
|
- /* 添加过渡效果使吸附更平滑 */
|
|
|
- button {
|
|
|
- height: max-content;
|
|
|
- background-color: transparent;
|
|
|
- padding: 0;
|
|
|
- }
|
|
|
+.service-btn {
|
|
|
+ height: max-content;
|
|
|
+ background-color: transparent;
|
|
|
+ padding: 0;
|
|
|
}
|
|
|
|
|
|
.container {
|