|
@@ -14,6 +14,26 @@
|
|
|
</view>
|
|
</view>
|
|
|
<view class="contact-btn" @click.stop="handleContactClick" />
|
|
<view class="contact-btn" @click.stop="handleContactClick" />
|
|
|
</movable-view>
|
|
</movable-view>
|
|
|
|
|
+
|
|
|
|
|
+ <!-- 非工作时间确认弹窗 -->
|
|
|
|
|
+ <view v-if="confirmVisible" class="confirm-overlay" @click.stop="confirmVisible = false">
|
|
|
|
|
+ <view class="confirm-dialog" @click.stop>
|
|
|
|
|
+ <view class="confirm-title">客服提示</view>
|
|
|
|
|
+ <view class="confirm-msg">客服在线时间 9:30~21:30,当前留言可能会延迟回复</view>
|
|
|
|
|
+ <view class="confirm-actions">
|
|
|
|
|
+ <view class="confirm-cancel" @click="confirmVisible = false">取消</view>
|
|
|
|
|
+ <button
|
|
|
|
|
+ class="confirm-ok"
|
|
|
|
|
+ open-type="contact"
|
|
|
|
|
+ send-message-title="YesWash洗车客服"
|
|
|
|
|
+ session-from=""
|
|
|
|
|
+ @click="confirmVisible = false"
|
|
|
|
|
+ >
|
|
|
|
|
+ 继续留言
|
|
|
|
|
+ </button>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
</movable-area>
|
|
</movable-area>
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
@@ -21,6 +41,7 @@
|
|
|
import { ref } from 'vue'
|
|
import { ref } from 'vue'
|
|
|
|
|
|
|
|
const POS_KEY = 'kefuPos'
|
|
const POS_KEY = 'kefuPos'
|
|
|
|
|
+const confirmVisible = ref(false)
|
|
|
|
|
|
|
|
/** 客服在线时间 9:30 ~ 21:30 */
|
|
/** 客服在线时间 9:30 ~ 21:30 */
|
|
|
const isInServiceHours = (): boolean => {
|
|
const isInServiceHours = (): boolean => {
|
|
@@ -69,32 +90,18 @@ function onTouchEnd() {
|
|
|
uni.setStorageSync(POS_KEY, { x: snapX, y: snapY })
|
|
uni.setStorageSync(POS_KEY, { x: snapX, y: snapY })
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-const openCustomerService = () => {
|
|
|
|
|
- // #ifdef MP-WEIXIN
|
|
|
|
|
- wx.openCustomerServiceConversation({
|
|
|
|
|
- sessionFrom: '',
|
|
|
|
|
- showMessageCard: true,
|
|
|
|
|
- sendMessageTitle: 'YesWash洗车客服'
|
|
|
|
|
- })
|
|
|
|
|
- // #endif
|
|
|
|
|
-}
|
|
|
|
|
-
|
|
|
|
|
const handleContactClick = () => {
|
|
const handleContactClick = () => {
|
|
|
if (isInServiceHours()) {
|
|
if (isInServiceHours()) {
|
|
|
- openCustomerService()
|
|
|
|
|
|
|
+ // #ifdef MP-WEIXIN
|
|
|
|
|
+ wx.openCustomerServiceConversation({
|
|
|
|
|
+ sessionFrom: '',
|
|
|
|
|
+ showMessageCard: true,
|
|
|
|
|
+ sendMessageTitle: 'YesWash洗车客服'
|
|
|
|
|
+ })
|
|
|
|
|
+ // #endif
|
|
|
return
|
|
return
|
|
|
}
|
|
}
|
|
|
- uni.showModal({
|
|
|
|
|
- title: '客服提示',
|
|
|
|
|
- content: '客服在线时间 9:30~21:30,当前留言可能会延迟回复',
|
|
|
|
|
- cancelText: '取消',
|
|
|
|
|
- confirmText: '继续留言',
|
|
|
|
|
- success: (res) => {
|
|
|
|
|
- if (res.confirm) {
|
|
|
|
|
- openCustomerService()
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- })
|
|
|
|
|
|
|
+ confirmVisible.value = true
|
|
|
}
|
|
}
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
@@ -146,4 +153,86 @@ const handleContactClick = () => {
|
|
|
padding: 0;
|
|
padding: 0;
|
|
|
margin: 0;
|
|
margin: 0;
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
|
|
+.confirm-overlay {
|
|
|
|
|
+ position: fixed;
|
|
|
|
|
+ left: 0;
|
|
|
|
|
+ top: 0;
|
|
|
|
|
+ width: 100vw;
|
|
|
|
|
+ height: 100vh;
|
|
|
|
|
+ background: rgba(0, 0, 0, 0.5);
|
|
|
|
|
+ z-index: 1000000;
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+ justify-content: center;
|
|
|
|
|
+ pointer-events: auto;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.confirm-dialog {
|
|
|
|
|
+ width: 560rpx;
|
|
|
|
|
+ background: #FFFFFF;
|
|
|
|
|
+ border-radius: 20rpx;
|
|
|
|
|
+ overflow: hidden;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.confirm-title {
|
|
|
|
|
+ padding: 48rpx 32rpx 0;
|
|
|
|
|
+ font-size: 34rpx;
|
|
|
|
|
+ font-weight: 600;
|
|
|
|
|
+ color: #1A1A1A;
|
|
|
|
|
+ text-align: center;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.confirm-msg {
|
|
|
|
|
+ padding: 28rpx 32rpx 36rpx;
|
|
|
|
|
+ font-size: 28rpx;
|
|
|
|
|
+ color: #666666;
|
|
|
|
|
+ text-align: center;
|
|
|
|
|
+ line-height: 1.6;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.confirm-actions {
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ border-top: 1rpx solid #EEEEEE;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.confirm-cancel {
|
|
|
|
|
+ flex: 1;
|
|
|
|
|
+ height: 96rpx;
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+ justify-content: center;
|
|
|
|
|
+ font-size: 32rpx;
|
|
|
|
|
+ color: #666666;
|
|
|
|
|
+ border-right: 1rpx solid #EEEEEE;
|
|
|
|
|
+
|
|
|
|
|
+ &:active {
|
|
|
|
|
+ background: #F5F5F5;
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.confirm-ok {
|
|
|
|
|
+ flex: 1;
|
|
|
|
|
+ height: 96rpx;
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+ justify-content: center;
|
|
|
|
|
+ font-size: 32rpx;
|
|
|
|
|
+ color: #C6171E;
|
|
|
|
|
+ font-weight: 500;
|
|
|
|
|
+ background: none;
|
|
|
|
|
+ border: none;
|
|
|
|
|
+ border-radius: 0;
|
|
|
|
|
+ padding: 0;
|
|
|
|
|
+ margin: 0;
|
|
|
|
|
+ line-height: 96rpx;
|
|
|
|
|
+
|
|
|
|
|
+ &::after {
|
|
|
|
|
+ border: none;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ &:active {
|
|
|
|
|
+ background: #F5F5F5;
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
</style>
|
|
</style>
|