This commit is contained in:
gyq
2025-12-05 10:14:44 +08:00
10 changed files with 649 additions and 180 deletions

View File

@@ -50,11 +50,16 @@
> >
<chatItem :item="item"></chatItem> <chatItem :item="item"></chatItem>
</view> </view>
<view class="text-center u-m-t-20" v-if="item.msg_type==4&&item.hasGet">
<text>{{item.hasGet||0}}人已领取</text>
<text class="color-main">优惠券</text>
</view>
</view> </view>
<up-avatar <up-avatar
size="122rpx" size="122rpx"
shape="square" shape="square"
bg-color="#fff" bg-color="#fff"
:src="shopInfo.logo"
></up-avatar> ></up-avatar>
</view> </view>
</template> </template>
@@ -230,9 +235,7 @@ const modalData = reactive({
couponId: "", couponId: "",
}, },
}); });
const websocketUtil = inject("websocketUtil");
websocketUtil.closeSocket();
websocketUtil.offMessage();
const chatStore = useChatStore(); const chatStore = useChatStore();
chatStore.onReceiveMsg = (msg) => { chatStore.onReceiveMsg = (msg) => {
@@ -278,56 +281,122 @@ function moreBtnsClick(item, index) {
function videoErrorCallback(e) { function videoErrorCallback(e) {
console.error("视频播放失败", e); console.error("视频播放失败", e);
} }
function sendImg() { // 图片选择与发送优化
uni.chooseImage({ async function sendImg() {
count: 3, //默认9 try {
sizeType: ["original", "compressed"], //可以指定是原图还是压缩图,默认二者都有 // 1. 调用图片选择API添加fail回调
sourceType: ["album", "camera "], const res = await new Promise((resolve, reject) => {
success: async function (res) { uni.chooseImage({
uni.showLoading({ count: 3,
title: "发送中", sizeType: ["original", "compressed"],
sourceType: ["album", "camera"],
success: resolve,
fail: reject // 捕获选择失败(含权限拒绝)
}); });
console.log(res); });
for (let i = 0; i < res.tempFiles.length; i++) {
const fileRes = await uploadFile(res.tempFiles[i]);
if (fileRes) {
sendMsg({
image_url: fileRes,
msg_type: 2,
});
} else {
}
}
uni.hideLoading();
},
});
}
function sendVideo() { uni.showLoading({ title: "发送中" });
uni.chooseVideo({ console.log("选择图片成功", res);
count: 1, //默认9
sizeType: ["original", "compressed"], //可以指定是原图还是压缩图,默认二者都有 // 2. 批量上传图片(保持原有逻辑)
sourceType: ["album", "camera "], for (let i = 0; i < res.tempFiles.length; i++) {
success: async function (res) { const fileRes = await uploadFile(res.tempFiles[i]);
uni.showLoading({
title: "发送中",
});
console.log(res);
const fileRes = await uploadFile({ path: res.tempFilePath });
uni.hideLoading();
if (fileRes) { if (fileRes) {
sendMsg({ sendMsg({
image_url: fileRes, image_url: fileRes,
msg_type: 5, msg_type: 2,
});
} else {
uni.showToast({
title: "发送失败",
icon: "none",
}); });
} }
}, }
}); } catch (err) {
console.error("图片选择/发送失败", err);
// 3. 处理权限拒绝场景
handlePermissionError(err, "图片");
} finally {
// 4. 确保加载弹窗关闭(无论成功/失败)
uni.hideLoading();
}
}
// 视频选择与发送优化
async function sendVideo() {
try {
// 1. 调用视频选择API添加fail回调
const res = await new Promise((resolve, reject) => {
uni.chooseVideo({
count: 1,
sizeType: ["original", "compressed"],
sourceType: ["album", "camera"],
success: resolve,
fail: reject // 捕获选择失败(含权限拒绝)
});
});
uni.showLoading({ title: "发送中" });
console.log("选择视频成功", res);
// 2. 上传视频(保持原有逻辑)
const fileRes = await uploadFile({ path: res.tempFilePath });
if (fileRes) {
sendMsg({
image_url: fileRes,
msg_type: 5,
});
} else {
uni.showToast({
title: "视频发送失败",
icon: "none",
});
}
} catch (err) {
console.error("视频选择/发送失败", err);
// 3. 处理权限拒绝场景
handlePermissionError(err, "视频");
} finally {
// 4. 确保加载弹窗关闭(无论成功/失败)
uni.hideLoading();
}
}
// 通用权限错误处理函数
function handlePermissionError(err, mediaType) {
const errMsg = err.errMsg || "";
// 识别权限拒绝关键词(兼容不同平台)
const isAuthDenied = [
"auth deny",
"permission denied",
"auth denied",
"用户拒绝"
].some(keyword => errMsg.includes(keyword));
if (isAuthDenied) {
// 弹窗提示用户,并引导至设置页
uni.showModal({
title: "权限提示",
content: `需要${mediaType}权限才能使用该功能,请前往设置开启`,
confirmText: "去设置",
cancelText: "取消",
success: (modalRes) => {
if (modalRes.confirm) {
// 跳转到小程序设置页
uni.openSetting({
success: (settingRes) => {
console.log("设置页返回结果", settingRes);
// 可根据需要添加权限开启后的回调逻辑
}
});
}
}
});
} else {
// 其他错误(如取消选择),仅轻提示
if (!errMsg.includes("cancel")) {
uni.showToast({
title: `${mediaType}选择失败`,
icon: "none"
});
}
}
} }
const groupInfo = ref({}); const groupInfo = ref({});
@@ -428,7 +497,7 @@ function sendMsg(msg) {
content: msg.value, content: msg.value,
image_url: "", image_url: "",
order_id: "", order_id: "",
session_id: "", session_id: groupInfo.value.session_id||options.session_id,
...msg, ...msg,
}); });
} }

View File

@@ -13,27 +13,78 @@
:src="item.image_url" :src="item.image_url"
class="img" class="img"
mode="widthFix" mode="widthFix"
@click="previewVideo(item.video_url)"
></video> ></video>
<view class="" v-if="item.msg_type == 4"> <view class="" v-if="item.msg_type == 4">
<view>{{ item.coupon.title }}</view> <view>{{ item.coupon.title }}</view>
<view class="u-m-t-16 bg-f7 coupon u-flex"> <view class="u-m-t-16 bg-f7 coupon u-flex u-col-stretch" style="min-width: 500rpx;">
<view class="left"> <template v-if="item.coupon.type == 1">
<view class="price"> <view class="left">
<view class="price">
<text class="u-font-32">¥</text> <text class="u-font-32">¥</text>
<text style="font-size: 72rpx;">15</text> <text style="font-size: 72rpx">{{
item.coupon.discountAmount
}}</text>
</view>
<view class="u-font-24 color-999 no-wrap"
>{{ item.coupon.fullAmount }}可用</view
>
</view> </view>
<view class="u-font-24 color-999 no-wrap">{{item.coupon.fullAmount}}可用</view> </template>
</view> <template v-if="item.coupon.type == 2">
<view class="right u-p-l-28"> <view class="left">
<view class="u-font-32 ">{{item.coupon.couponName}}</view> <view class="price">
<view class="u-font-24 color-999 u-m-t-8">有效期{{ returnTime(item.coupon) }} </view> <text class="u-font-32"
</view> >商品兑换券</text
>
</view>
<view class="u-font-24 color-999 no-wrap"
>{{ item.coupon.fullAmount }}可用</view
>
</view>
</template>
<template v-if="item.coupon.type == 3">
<view class="left">
<view class="price">
<text class="u-font-32"
>{{ item.coupon.discountRate / 100 }}</text
>
</view>
<view class="u-font-24 color-999 no-wrap"
>{{ item.coupon.fullAmount }}可用</view
>
</view>
</template>
<template v-if="item.coupon.type == 4">
<view class="left">
<view class="price">
<text class="u-font-32"
>第二件半价券</text
>
</view>
</view>
</template>
<template v-if="item.coupon.type == 6">
<view class="left">
<view class="price">
<text class="u-font-32"
>买一送一券</text
>
</view>
</view>
</template>
<view class="right u-p-l-28 u-flex u-col-center">
<view class="u-font-32">{{ item.coupon.couponName }}</view>
</view>
</view> </view>
</view> </view>
</template> </template>
<script setup> <script setup>
import dayjs from 'dayjs'
const props = defineProps({ const props = defineProps({
item: { item: {
type: Object, type: Object,
@@ -46,6 +97,9 @@ function previewImage(url) {
}); });
} }
function returnTime(coupon){ function returnTime(coupon){
// if(coupon.validType=="fixed"){
// return dayjs().add(coupon.daysToTakeEffect,'day').format('YYYY-MM-DD')
// }
let startTime = coupon.useStartTime; let startTime = coupon.useStartTime;
let endTime = coupon.useEndTime; let endTime = coupon.useEndTime;
if(startTime && endTime){ if(startTime && endTime){
@@ -55,22 +109,39 @@ function returnTime(coupon){
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.img { .img {
width: 50vw; width: 50vw;
}
.coupon {
padding: 16rpx 10rpx;
border-radius: 16rpx;
.price {
color: #ff1c1c;
font-weight: 700;
} }
.coupon{ .left {
padding: 16rpx 10rpx; width: 112rpx;
border-radius: 16rpx; margin-right: 26rpx;
.price{ }
color: #FF1C1C; .right {
font-weight: 700; border-left: 1rpx solid #ededed;
}
.left{
padding-right: 26rpx;
border-right: 1rpx solid #EDEDED;
}
.right{
}
} }
}
.lingqu {
background-color: #e8ad7b;
line-height: 48rpx;
font-size: 28rpx;
padding: 6rpx 70rpx;
color: #fff;
border-radius: 140rpx;
&.hasGet {
background-color: #eee;
color: #999;
}
}
.u-col-stretch{
align-items: stretch;
}
</style> </style>

View File

@@ -163,8 +163,9 @@ function sendMsg(msg) {
}); });
} }
function toShare(item) { function toShare(item) {
const hasGet=item.couponJson.giveNum-item.couponJson.leftNum
sendMsg({ sendMsg({
coupon: { ...item.couponJson, title: item.title,activity_id:item.id }, coupon: { ...item.couponJson, title: item.title,activity_id:item.id, hasGet:hasGet<=0?0:hasGet} ,
chat_coupon_id:item.id, chat_coupon_id:item.id,
msg_type: 4, msg_type: 4,
}); });

View File

@@ -2,7 +2,7 @@
<view class="min-page bg-f7 u-font-28"> <view class="min-page bg-f7 u-font-28">
<view class="user-list bg-fff"> <view class="user-list bg-fff">
<view class="u-flex u-row-between u-col-center"> <view class="u-flex u-row-between u-col-center">
<text class="color-000">群成员22</text> <text class="color-000">群成员{{allUser.length}}</text>
<text class="color-red" @click="showRemove = !showRemove">移除</text> <text class="color-red" @click="showRemove = !showRemove">移除</text>
</view> </view>
<view class="list u-m-t-26"> <view class="list u-m-t-26">
@@ -17,7 +17,7 @@
:src="item.avatar" :src="item.avatar"
round="8rpx" round="8rpx"
></up-avatar> ></up-avatar>
<view class="u-m-t-8 color-000">{{ item.nick_name }}</view> <view class="u-m-t-8 color-000 u-line-1" style="max-width: 104rpx;">{{ item.nick_name }}</view>
<view <view
class="remove u-absolute" class="remove u-absolute"
v-if="showRemove && item.role != 1" v-if="showRemove && item.role != 1"
@@ -32,8 +32,10 @@
</view> </view>
</view> </view>
<view class="u-flex u-row-center color-666 u-m-t-30" v-if="hasMore"> <view class="u-flex u-row-center color-666 u-m-t-30" v-if="hasMore">
<text class="u-m-r-20">查看更多</text> <view class="u-flex" @click="loadMore">
<up-icon name="arrow-down" size="24rpx" color="#666"></up-icon> <text class="u-m-r-20">查看更多</text>
<up-icon name="arrow-down" size="24rpx" color="#666"></up-icon>
</view>
</view> </view>
</view> </view>
@@ -61,10 +63,12 @@
</view> </view>
<view <view
class="u-flex u-row-between default-padding bg-fff" class="u-flex u-row-between default-padding bg-fff"
@click="go.to('PAGES_CHAT_COUPON_ACTIVITY', { @click="
group_id: options.group_id, go.to('PAGES_CHAT_COUPON_ACTIVITY', {
session_id: options.session_id, group_id: options.group_id,
})" session_id: options.session_id,
})
"
> >
<text>优惠券领取记录</text> <text>优惠券领取记录</text>
<view class="u-flex color-666"> <view class="u-flex color-666">
@@ -122,16 +126,20 @@ function groupMuteChange(e) {
}); });
} }
const showRemove = ref(false); const showRemove = ref(false);
let allUser = []; let allUser = ref([]);
const userLists = ref([]); const userLists = ref([]);
const hasMore = ref(false); const hasMore = ref(false);
function getMembers() { function getMembers() {
chatApi.groupMembers({ group_id: options.group_id }).then((res) => { chatApi.groupMembers({ group_id: options.group_id }).then((res) => {
allUser = res.user_list || []; allUser.value = res.user_list || [];
hasMore.value = allUser.length > 20; hasMore.value = allUser.value.length > 20;
userLists.value = allUser.slice(0, 20); userLists.value = allUser.value.slice(0, 20);
}); });
} }
function loadMore() {
userLists.value=allUser.value
}
onShow(() => { onShow(() => {
getMembers(); getMembers();
}); });

View File

@@ -1,63 +1,175 @@
<template> <template>
<view class="min-page bg-f7 color-333 u-font-28"> <view class="min-page bg-f7 color-333 u-font-28">
<up-sticky> <up-sticky>
<view class="top u-flex u-row-between"> <view class="top u-flex u-row-between u-col-center">
<view></view> <view style="width: 420rpx">
<view class="u-flex" @click="clearAllmsg"> <up-search
v-model="query.key"
placeholder="搜索群名称"
:showAction="false"
@clear="throttleSearch"
@change="throttleSearch"
></up-search>
</view>
<view class="u-flex u-col-center" @click="clearAllmsg">
<text class="color-666 u-m-r-12">清空未读</text> <text class="color-666 u-m-r-12">清空未读</text>
<image src="/pageChat/static/clear.png" class="clear"></image> <image src="/pageChat/static/clear.png" class="clear"></image>
</view> </view>
</view> </view>
</up-sticky> </up-sticky>
<view class="list"> <view class="list">
<view <up-swipe-action>
class="item u-flex" <up-swipe-action-item
v-for="(item, index) in list" :options="options1"
:key="item.id" v-for="(item, index) in list"
@click="toDetail(item)" v-model:show="item.showOptions"
> @click="optionsClick($event, item, index)"
<view class="u-flex avatar"> :key="item.id"
<up-avatar >
size="118rpx" <view class="item u-flex" @click="toDetail(item)">
:src="item.avatar" <view class="u-flex avatar">
shape="square" <up-avatar
round="8rpx" size="118rpx"
></up-avatar> :src="item.avatar"
<view class="bandage" v-if="item.unread_count > 0">{{ shape="square"
item.unread_count >= 99 ? "99" : item.unread_count round="8rpx"
}}</view> ></up-avatar>
</view> <view class="bandage" v-if="item.unread_count > 0">{{
<view class="u-flex-1 u-flex u-row-between u-p-l-14"> item.unread_count >= 99 ? "99" : item.unread_count
<view style="max-width: 364rpx"> }}</view>
<view class="color-000 u-line-1">{{ item.name }}</view> </view>
<view class="u-m-t-28 u-line-1 u-font-24 color-999" <view class="u-flex-1 u-flex u-row-between u-p-l-14">
>用户昵称这里是消息内容这里,,,,</view <view style="max-width: 364rpx">
> <view class="color-000 u-line-1">{{ item.name }}</view>
<view class="u-m-t-28 u-line-1 u-font-24 color-999">{{
item.msg
}}</view>
</view>
<view class="color-333 u-font-24">{{ item.send_time }}</view>
</view>
</view> </view>
<view class="color-333 u-font-24">{{ item.send_time }}</view> </up-swipe-action-item>
</view> </up-swipe-action>
</view>
</view> </view>
</view> </view>
</template> </template>
<script setup> <script setup>
import go from "@/commons/utils/go.js";
import * as chatApi from "@/http/php/chat"; import * as chatApi from "@/http/php/chat";
import { ref ,reactive} from "vue"; import { ref, reactive,inject } from "vue";
import { onShow } from "@dcloudio/uni-app"; import { onShow } from "@dcloudio/uni-app";
import { useChatStore } from "@/store/chat";
const chatStore = useChatStore();
chatStore.onReceiveMsg = (msg) => {
console.log("onReceiveMsg", msg);
if (msg.operate_type == "receive_msg" && msg.chat_type == 2) {
const index = allList.value.findIndex((v) => v.group_id == msg.group_id);
if (index != -1) {
allList.value[index].unread_count += 1;
allList.value[index].msg = returnMsg(msg);
allList.value[index].send_time = msg.send_time;
}
const index1 = list.value.findIndex((v) => v.group_id == msg.group_id);
if (index1 != -1) {
list.value[index1].unread_count += 1;
list.value[index1].msg = returnMsg(msg);
list.value[index1].send_time = msg.send_time;
}
}
};
function returnMsg(msg) {
if (msg.msg_type == 1) {
return msg.nick+""+msg.content;
}
if (msg.msg_type == 2) {
return msg.nick+""+"[图片]";
}
if (msg.msg_type == 5) {
return msg.nick+""+"[视频]";
}
if (msg.msg_type == 4) {
return msg.nick+""+"[优惠券]";
}
}
chatStore.connectSocket();
// 使用 reactive 创建响应式对象
const options1 = reactive([
{
text: "删除",
style: {
backgroundColor: "#f56c6c",
color: "#fff",
},
},
]);
function optionsClick(e, item, index) {
if (e.index == 0) {
//删除
chatApi
.sessionlistdel({
session_id: item.session_id,
})
.then((res) => {
if (res) {
uni.showToast({
title: "删除成功",
icon: "none",
duration: 1000,
});
list.value.splice(index, 1);
setTimeout(() => {
getList();
}, 1000);
}
});
}
}
const list = ref([]); const list = ref([]);
let allList = ref([]);
const query = reactive({
key: "",
});
function throttle(fn, delay) {
let timer = null;
return function (...args) {
if (timer) {
clearTimeout(timer);
}
timer = setTimeout(() => {
fn.apply(this, args);
}, delay);
};
}
//使用节流函数
const throttleSearch = throttle(search, 500);
function search() {
list.value = allList.value
.filter((v) => v.name.includes(query.key.trim()))
.map((v) => {
return {
...v,
showOptions: false,
};
});
}
async function getList() { async function getList() {
const res = await chatApi.messageSessionList({}); const res = await chatApi.messageSessionList({});
list.value = (res.list || []).filter((v) => !v.is_del); allList.value = (res.list || []).filter((v) => !v.is_del);
search();
} }
async function clearAllmsg() { async function clearAllmsg() {
@@ -66,7 +178,9 @@ async function clearAllmsg() {
content: "确定要清空所有未读消息吗?", content: "确定要清空所有未读消息吗?",
success: async (res) => { success: async (res) => {
if (res.confirm) { if (res.confirm) {
const res = await chatApi.messageMarkReadAll({session_ids: list.value.map(v=>v.session_id).join(',')}); const res = await chatApi.messageMarkReadAll({
session_ids: list.value.map((v) => v.session_id).join(","),
});
if (res) { if (res) {
uni.showToast({ uni.showToast({
title: "清空成功", title: "清空成功",
@@ -83,9 +197,17 @@ async function clearAllmsg() {
} }
function toDetail(item) { function toDetail(item) {
go.to("PAGES_CHAT_CHAT", { if (!item.is_th) {
group_id: item.group_id, return uni.showToast({
session_id: item.session_id, title: "你已不在该群内",
icon: "none",
duration: 1500,
});
}
uni.navigateTo({
url:
"/pageChat/chat" +
`?group_id=${item.group_id}&session_id=${item.session_id}`,
}); });
} }
@@ -115,7 +237,9 @@ onShow(() => {
padding: 32rpx 28rpx; padding: 32rpx 28rpx;
background-color: #fff; background-color: #fff;
border-radius: 16rpx; border-radius: 16rpx;
margin-bottom: 16rpx; display: flex;
flex-direction: column;
gap: 16rpx;
.avatar { .avatar {
position: relative; position: relative;
.bandage { .bandage {

View File

@@ -222,6 +222,12 @@ async function save() {
console.log(form); console.log(form);
const submitData = { const submitData = {
...form, ...form,
conditionList: conditionLists.value
.filter((v) => v.checked)
.map((v) => ({
code: v.code,
value: v.value,
})),
}; };
const res = await superVipStore.editConfig(submitData); const res = await superVipStore.editConfig(submitData);
uni.showToast({ uni.showToast({
@@ -244,6 +250,18 @@ function setForm(data) {
if (data.rewardCount == -1) { if (data.rewardCount == -1) {
isLimitCount.value = 1; isLimitCount.value = 1;
} }
console.log(data);
conditionLists.value = conditionLists.value.map((v) => {
const findItem = data.conditionList.find((cond) => cond.code == v.code);
if (findItem) {
v.value = findItem.value;
v.checked = true;
} else {
v.checked = false;
}
return v;
});
Object.assign(form, data); Object.assign(form, data);
console.log(form); console.log(form);
} }

View File

@@ -18,11 +18,11 @@
/> />
</view> </view>
<view class="u-m-t-16"> <view class="u-m-t-16">
<view class="font-bold u-m-b-16">所需会员</view> <view class="font-bold u-m-b-16">所需成长</view>
<input <input
v-model="form.experienceValue" v-model="form.experienceValue"
:disabled="optiopns.index == 0 ? true : false" :disabled="optiopns.index == 0 ? true : false"
placeholder="请输入所需会员值" placeholder="请输入所需成长值"
:placeholderStyle="placeholderStyle" :placeholderStyle="placeholderStyle"
/> />
</view> </view>
@@ -171,7 +171,7 @@ const form = reactive({
remark: "", remark: "",
}); });
function addCoupon() { function addCoupon() {
form.couponList.push({ form.cycleRewardCouponList.push({
coupon: { id: null }, coupon: { id: null },
num: "", num: "",
title: "", title: "",
@@ -225,6 +225,13 @@ async function save() {
}); });
return false; return false;
} }
if(form.remark.trim() == ""){
uni.showToast({
title: "请输入等级说明",
icon: "none",
});
return false;
}
const submitForm = { const submitForm = {
...form, ...form,
}; };

View File

@@ -109,8 +109,15 @@
<view class="u-m-t-22 color-999 u-font-24">X{{item.number||item.num}}</view> <view class="u-m-t-22 color-999 u-font-24">X{{item.number||item.num}}</view>
</view> </view>
</view> </view>
<view class=" u-flex u-font-24 color-333" style="gap: 20rpx;">
<text v-if="item.dishOutTime">出菜时间{{item.dishOutTime}}</text>
<text v-if="item.foodServeTime">上菜时间{{item.foodServeTime}}</text>
</view> </view>
</view>
</view> </view>
<template v-if="canTuicai(orderInfo,item)"> <template v-if="canTuicai(orderInfo,item)">
<view class="u-flex u-row-right gap-20 u-m-t-24" v-if="item.returnNum*item.unitPrice<item.num*item.unitPrice"> <view class="u-flex u-row-right gap-20 u-m-t-24" v-if="item.returnNum*item.unitPrice<item.num*item.unitPrice">
<my-button :width="128" :height="48" plain shape="circle" @tap="tuicai(item,index)"><text <my-button :width="128" :height="48" plain shape="circle" @tap="tuicai(item,index)"><text

View File

@@ -1,5 +1,4 @@
import { defineStore } from "pinia"; import { defineStore } from "pinia";
// import * as shopApi from "@/http/api/shop.js";
// #ifdef H5 // #ifdef H5
const socketUrl = "http://192.168.1.42:2348"; const socketUrl = "http://192.168.1.42:2348";
@@ -17,8 +16,19 @@ export const useChatStore = defineStore("chat", {
socketTask: null, socketTask: null,
onReceiveMsg: () => {}, onReceiveMsg: () => {},
chatList: [], chatList: [],
// ========== 新增Socket 保活与重连状态 ==========
isManualClose: false, // 是否主动关闭true不重连false自动重连
heartbeatTimer: null, // 心跳定时器
reconnectTimer: null, // 重连定时器
reconnectCount: 0, // 当前重连次数
maxReconnectCount: 5, // 最大重连次数(避免无限重连)
reconnectDelay: 1000, // 初始重连延迟ms
maxReconnectDelay: 8000, // 最大重连延迟ms
heartbeatInterval: 30000, // 心跳间隔30s根据服务器调整
}; };
}, },
actions: { actions: {
init() { init() {
if (!this.isConnect) { if (!this.isConnect) {
@@ -37,14 +47,28 @@ export const useChatStore = defineStore("chat", {
false false
); );
}, },
sendMessage(msg, isAutoAppend = true) { sendMessage(msg, isAutoAppend = true) {
if (!this.isConnect) { // 1. 主动关闭状态:提示用户
if (this.isManualClose) {
return uni.showToast({ return uni.showToast({
title: "请先连接socket", title: "Socket已主动关闭请重新连接",
icon: "none", icon: "none",
}); });
} }
console.log(this.socketTask);
// 2. 连接未建立:尝试重连后发送
if (!this.isConnect) {
this.reconnect();
// 延迟发送,确保重连成功
setTimeout(() => {
this.sendMessage(msg, isAutoAppend);
}, this.reconnectDelay);
return;
}
// 3. 正常发送消息
console.log('发送的消息', msg);
const message = isAutoAppend const message = isAutoAppend
? { ? {
type: "OnbocChat", type: "OnbocChat",
@@ -54,6 +78,7 @@ export const useChatStore = defineStore("chat", {
...msg, ...msg,
} }
: msg; : msg;
this.socketTask.send({ this.socketTask.send({
data: JSON.stringify(message), data: JSON.stringify(message),
success: (res) => { success: (res) => {
@@ -61,65 +86,204 @@ export const useChatStore = defineStore("chat", {
}, },
fail: (error) => { fail: (error) => {
console.log("发送失败", error); console.log("发送失败", error);
}, // 发送失败可能是连接断开,触发重连
}); if (!this.isManualClose) {
}, this.reconnect();
connectSocket() {
this.socketTask = uni.connectSocket({
url: socketUrl,
success: (res) => {},
fail: (res) => {
console.log(res);
},
});
this.socketTask.onOpen((res) => {
this.isConnect = true;
this.init();
});
this.socketTask.onMessage((res) => {
const data = JSON.parse(res.data);
console.log("收到服务器消息", data);
if (data.msg) {
uni.showToast({
title: data.msg,
icon: "none",
});
}
if (data && data.operate_type == "sendMsg") {
this.chatList.unshift(data.data);
this.onReceiveMsg(data.data);
console.log(this.chatList);
}
if (data && data.operate_type == "receive_msg") {
const msg={
...data.data,
operate_type:"receive_msg",
} }
this.chatList.unshift(msg); },
this.onReceiveMsg(msg); });
console.log(this.chatList); },
// ========== 新增:发送心跳包 ==========
sendHeartbeat() {
if (!this.isConnect || this.isManualClose) return;
this.socketTask.send({
data: JSON.stringify({
type: "OnbocChat",
operate_type: "heartbeat", // 心跳类型(需与服务器约定)
shop_id: uni.getStorageSync("shopId"),
token: uni.getStorageSync("iToken").tokenValue || "",
timestamp: Date.now(), // 时间戳(可选,用于服务器校验)
}),
fail: (error) => {
console.log("心跳发送失败,触发重连", error);
this.reconnect();
},
});
},
// ========== 新增:启动心跳定时器 ==========
startHeartbeat() {
// 清除旧定时器,避免重复
if (this.heartbeatTimer) {
clearInterval(this.heartbeatTimer);
}
// 每30s发送一次心跳
this.heartbeatTimer = setInterval(() => {
this.sendHeartbeat();
}, this.heartbeatInterval);
},
// ========== 新增:停止心跳定时器 ==========
stopHeartbeat() {
if (this.heartbeatTimer) {
clearInterval(this.heartbeatTimer);
this.heartbeatTimer = null;
}
},
// ========== 新增:智能重连逻辑 ==========
reconnect() {
// 1. 主动关闭或已连接:不重连
if (this.isManualClose || this.isConnect) return;
// 2. 超过最大重连次数:停止重连
if (this.reconnectCount >= this.maxReconnectCount) {
console.log("已达最大重连次数,停止重连");
return;
}
// 3. 清除旧重连定时器
if (this.reconnectTimer) {
clearTimeout(this.reconnectTimer);
}
// 4. 计算重连延迟退避算法1s → 2s → 4s → 8s → 8s...
const delay = Math.min(
this.reconnectDelay * Math.pow(2, this.reconnectCount),
this.maxReconnectDelay
);
console.log(`${this.reconnectCount + 1}次重连,延迟${delay}ms`);
// 5. 延迟执行重连
this.reconnectTimer = setTimeout(() => {
this.connectSocket();
this.reconnectCount++;
}, delay);
},
// ========== 优化连接Socket ==========
connectSocket() {
// 1. 避免重复连接
if (this.isConnect || this.socketTask) {
return;
}
// 2. 重置主动关闭标记
this.isManualClose = false;
// 3. 创建Socket连接
this.socketTask = uni.connectSocket({
url: this.socketUrl,
success: (res) => {
console.log("Socket连接请求发送成功");
},
fail: (res) => {
console.log("Socket连接请求失败", res);
// 请求失败,触发重连
this.reconnect();
},
});
// 4. 连接成功回调
this.socketTask.onOpen((res) => {
console.log("Socket连接成功");
this.isConnect = true;
this.reconnectCount = 0; // 重置重连次数
this.init(); // 初始化聊天
this.startHeartbeat(); // 启动心跳
});
// 5. 接收消息回调(添加容错处理)
this.socketTask.onMessage((res) => {
try {
const data = JSON.parse(res.data);
console.log("收到服务器消息", data);
if (data.msg) {
uni.showToast({
title: data.msg,
icon: "none",
});
}
// 处理发送消息
if (data?.operate_type === "sendMsg") {
this.chatList.unshift(data.data);
this.onReceiveMsg(data.data);
}
// 处理接收消息
if (data?.operate_type === "receive_msg") {
const msg = {
...data.data,
operate_type: "receive_msg",
};
this.chatList.unshift(msg);
this.onReceiveMsg(msg);
}
// 处理心跳响应(如果服务器返回)
if (data?.operate_type === "heartbeat_ack") {
console.log("心跳响应正常");
}
} catch (error) {
console.error("消息解析失败", error);
} }
}); });
// 6. 连接错误回调
this.socketTask.onError((res) => { this.socketTask.onError((res) => {
console.log("Socket连接错误", res);
this.isConnect = false; this.isConnect = false;
console.log("连接错误", res); // 错误触发重连
this.reconnect();
}); });
// 7. 连接关闭回调(区分主动/意外关闭)
this.socketTask.onClose(() => { this.socketTask.onClose(() => {
console.log("Socket连接已关闭");
this.isConnect = false; this.isConnect = false;
console.log("连接已关闭"); this.stopHeartbeat(); // 停止心跳
this.connectSocket();
// 只有非主动关闭时才重连
if (!this.isManualClose) {
console.log("意外断开,触发重连");
this.reconnect();
} else {
console.log("主动关闭,不重连");
}
}); });
}, },
// ========== 优化主动关闭Socket ==========
closeSocket() { closeSocket() {
this.socketTask.close(); // 1. 设置主动关闭标记(关键:避免自动重连)
this.isManualClose = true;
// 2. 停止所有定时器,清理资源
this.stopHeartbeat();
if (this.reconnectTimer) {
clearTimeout(this.reconnectTimer);
this.reconnectTimer = null;
}
// 3. 关闭Socket连接
if (this.socketTask) {
this.socketTask.close();
this.socketTask = null; // 释放引用
}
// 4. 重置连接状态
this.isConnect = false; this.isConnect = false;
this.reconnectCount = 0; // 重置重连次数
console.log("Socket已主动关闭");
}, },
}, },
unistorage: false, // 开启后对 state 的数据读写都将持久化 unistorage: false, // 开启后对 state 的数据读写都将持久化
}); });

View File

@@ -93,7 +93,7 @@ export const useSuperVipStore = defineStore("superVip", {
state: () => { state: () => {
return { return {
config: { config: {
isOpen: 0, isOpen: '',
configList:[] configList:[]
}, },
vipLevelList:[] vipLevelList:[]