czg_team/cashier_app
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

聊天问题修复优化

Browse Source
This commit is contained in:
YeMingfei666
2025-12-05 19:19:44 +08:00
parent 9e275b0faf
commit a65b0e83b1
7 changed files with 438 additions and 162 deletions
Download Patch File Download Diff File Expand all files Collapse all files

113
pageChat/chat.vue
View File

@@ -5,7 +5,7 @@
<text style="max-width: 286rpx" class="u-line-1 u-font-32">
{{ groupInfo.name }}
</text>
<text class="u-m-l-22">（{{membersRes.user_list.length}}人）</text>
<text class="u-m-l-22">（{{ membersRes.user_list.length }}人）</text>
</view>
<view class="" @click="toMore()">
<view class="u-flex u-row-center">
@@ -36,7 +36,11 @@
>
<!-- 发消息 -->
<template
v-if="item.operate_type == 'sendMsg' || item.is_user_send == 1"
v-if="
item.operate_type == 'sendMsg' ||
item.is_user_send == 1 ||
item.from_id == shopInfo.id
"
>
<view class="shop u-flex u-row-right">
<view class="u-p-r-18">
@@ -50,8 +54,11 @@
>
<chatItem :item="item"></chatItem>
</view>
<view class="text-center u-m-t-20" v-if="item.msg_type==4&&item.hasGet">
<text>{{item.hasGet||0}}人已领取</text>
<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>
@@ -73,7 +80,7 @@
bg-color="#fff"
></up-avatar>
<view class="u-p-l-18">
<view class="color-000 u-line-1">{{ item.nick_name }}</view>
<view class="color-000 u-line-1">{{ item.nick }}</view>
<view
class="u-m-t-14 msg u-p-l-30"
:class="['type' + item.msg_type]"
@@ -116,7 +123,7 @@
<up-icon
name="plus-circle"
color="#666"
size="40rpx"
size="60rpx"
@click="showMoreBtnToggle"
v-else
></up-icon>
@@ -149,6 +156,7 @@
v-model="modalData.form.title"
placeholder="请输入自定义文案"
:placeholderStyle="placeholderStyle"
maxlength="12"
></up-input>
<view class="font-bold u-m-b-16 u-m-t-32">发放数量(张)</view>
@@ -161,6 +169,7 @@
<view class="font-bold u-m-b-16 u-m-t-32">每人限领量(张)</view>
<up-number-box
v-model="modalData.form.getLimit"
:max="modalData.form.giveNum"
inputWidth="240rpx"
@change="valChange"
></up-number-box>
@@ -174,13 +183,15 @@
import {
onReady,
onReachBottom,
onLoad,onShow,
onLoad,
onShow,
onPageScroll,
} from "@dcloudio/uni-app";
import {
ref,
inject,
onMounted,
onUnmounted,
nextTick,
reactive,
watch,
@@ -205,7 +216,6 @@ function refresherrefresh() {
if (isLoading.value || isEnd.value) {
scrollView.refresherTriggered = false; // 立即关闭刷新状态
if (isEnd.value) {
uni.showToast({ title: "没有更多了", icon: "none" });
}
return; // 终止后续逻辑
}
@@ -236,13 +246,16 @@ const modalData = reactive({
},
});
const chatStore = useChatStore();
chatStore.onReceiveMsg = (msg) => {
const handleReceiveMsg = (msg) => {
nextTick(() => {
scrollView.intoView = "msg-0";
});
};
// 注册消息回调
chatStore.registerReceiveMsgCallback(handleReceiveMsg);
const msg = ref("");
const shopInfo = uni.getStorageSync("shopInfo");
@@ -280,7 +293,6 @@ function moreBtnsClick(item, index) {
function videoErrorCallback(e) {
console.error("视频播放失败", e);
}
// 图片选择与发送优化
async function sendImg() {
try {
// 1. 调用图片选择API，添加fail回调
@@ -290,7 +302,7 @@ async function sendImg() {
sizeType: ["original", "compressed"],
sourceType: ["album", "camera"],
success: resolve,
fail: reject // 捕获选择失败（含权限拒绝）
fail: reject, // 捕获选择失败（含权限拒绝）
});
});
@@ -327,7 +339,7 @@ async function sendVideo() {
sizeType: ["original", "compressed"],
sourceType: ["album", "camera"],
success: resolve,
fail: reject // 捕获选择失败（含权限拒绝）
fail: reject, // 捕获选择失败（含权限拒绝）
});
});
@@ -365,8 +377,8 @@ function handlePermissionError(err, mediaType) {
"auth deny",
"permission denied",
"auth denied",
"用户拒绝"
].some(keyword => errMsg.includes(keyword));
"用户拒绝",
].some((keyword) => errMsg.includes(keyword));
if (isAuthDenied) {
// 弹窗提示用户，并引导至设置页
@@ -382,17 +394,17 @@ function handlePermissionError(err, mediaType) {
success: (settingRes) => {
console.log("设置页返回结果", settingRes);
// 可根据需要添加权限开启后的回调逻辑
}
},
});
}
}
},
});
} else {
// 其他错误（如取消选择），仅轻提示
if (!errMsg.includes("cancel")) {
uni.showToast({
title: `${mediaType}选择失败`,
icon: "none"
icon: "none",
});
}
}
@@ -405,6 +417,14 @@ async function init() {
});
console.log(res);
groupInfo.value = res || {};
if (res) {
chatStore.connectSocket();
// 确保状态监听已初始化
if (!chatStore._listenersInitialized) {
chatStore.initStateListeners();
chatStore._listenersInitialized = true;
}
}
getMsgList();
}
const query = reactive({
@@ -458,36 +478,33 @@ async function getMsgList() {
}
const options = reactive({});
const membersRes=reactive({
user_list:[]
})
const membersRes = reactive({
user_list: [],
});
onLoad((opt) => {
Object.assign(options, opt);
init();
chatApi.messageMarkReadAll({
session_ids: options.session_id,
session_ids: options.group_id,
});
chatStore.group_id = options.group_id;
chatApi.groupMembers({ group_id: options.group_id }).then((res) => {
console.log(res);
membersRes.user_list=res.user_list||[]
})
membersRes.user_list = res.user_list || [];
});
// #ifdef H5
scrollView.safeAreaHeight = uni.getSystemInfoSync().safeArea.height;
// #endif
});
onMounted(() => {
chatStore.connectSocket();
// 确保状态监听已初始化
if (!chatStore._listenersInitialized) {
chatStore.initStateListeners();
chatStore._listenersInitialized = true;
onShow(() => {
// 页面显示时，检查连接状态
if (!chatStore.isConnect || !chatStore.socketTask) {
console.log("聊天页显示，检查Socket连接");
chatStore.forceReconnect();
}
});
onShow(() => {
});
function toMore() {
go.to("PAGES_CHAT_GROUP_INFO", {
group_id: groupInfo.value.id,
@@ -508,7 +525,7 @@ function sendMsg(msg) {
content: msg.value,
image_url: "",
order_id: "",
session_id: groupInfo.value.session_id||options.session_id,
session_id: groupInfo.value.session_id || options.session_id,
...msg,
});
}
@@ -522,13 +539,13 @@ function closeModal() {
}
function confirmCoupon() {
console.log(modalData.form);
if (!modalData.form.title) {
uni.showToast({
title: "请输入自定义文案",
icon: "none",
});
return;
}
// if (!modalData.form.title) {
// uni.showToast({
// title: "请输入自定义文案",
// icon: "none",
// });
// return;
// }
if (!modalData.form.couponId) {
uni.showToast({
title: "请选择优惠券",
@@ -556,10 +573,15 @@ function confirmCoupon() {
modalData.show = false;
const couponJson = JSON.parse(res.couponJson);
sendMsg({
coupon: { ...couponJson, title: modalData.form.title,activity_id:res.id },
chat_coupon_id:res.id,
coupon: {
...couponJson,
title: modalData.form.title,
activity_id: res.id,
},
chat_coupon_id: res.id,
msg_type: 4,
});
closeModal();
} else {
uni.showToast({
title: "发送失败",
@@ -607,6 +629,11 @@ const pageHeight = computed(() => {
}
return "";
});
onUnmounted(() => {
// 组件卸载时，移除消息回调
chatStore.removeReceiveMsgCallback(handleReceiveMsg);
});
</script>
<style lang="scss" scoped>
.top {

106
pageChat/coupon-activity/detail.vue
View File

@@ -41,20 +41,29 @@
</view>
<view class="u-m-t-32 table bg-fff">
<view class="header">
<view class="header">
<view class="user">用户</view>
<view class="gettime">领取时间</view>
<view class="usetime">使用时间</view>
<view class="status">状态</view>
<view class="operation">操作</view>
</view>
<view class="body">
<view class="item" v-for="(item,index) in 10" :key="index">
<view class="user">用户昵称（40239）</view>
<view class="gettime">2025/06/27 20:07:18）</view>
<view class="usetime">2025/01/15 08:02:38</view>
<view class="status">已使用</view>
<view class="operation status3">失效</view>
<view class="body">
<view class="item" v-for="(item, index) in list" :key="index">
<view class="user">
<view>
{{ item.nickName }}
</view>
<view> ({{ item.shopUserId }}) </view>
</view>
<view class="gettime">{{ item.createTime }}</view>
<view class="usetime">{{ item.useTime }}</view>
<view class="status">{{ returnStatus(item.status) }}</view>
<view class="operation status3">
<text v-if="item.status == 0" @click="deleteRecord(item)"
>失效</text
></view
>
</view>
</view>
</view>
@@ -70,12 +79,49 @@ import { reactive, ref, watch } from "vue";
import { onShow } from "@dcloudio/uni-app";
import go from "@/commons/utils/go.js";
import * as chatCouponApi from "@/http/api/market/chat";
function deleteRecord(item) {
uni
.showModal({
title: "提示",
content: "确定要让该记录失效吗？",
})
.then((res) => {
if (res.confirm) {
chatCouponApi
.deleteRecord({
id: item.id,
})
.then((res) => {
uni.showToast({
title: "操作成功",
icon: "none",
});
setTimeout(() => {
refresh();
}, 1000);
});
}
});
}
const statusOptions = ref([
{ label: "全部", value: "" },
{ label: "未使用", value: 0 },
{ label: "已使用", value: 1 },
{ label: "已过期", value: 2 },
]);
function returnStatus(status) {
if (status == 0) {
return "未使用";
}
if (status == 1) {
return "已使用";
}
if (status == 2) {
return "已过期";
}
}
const selStatus = ref("");
const query = reactive({
page: 1,
@@ -146,39 +192,39 @@ onLoad((opt) => {
display: flex;
justify-content: space-between;
}
.table{
.user{
.table {
.user {
width: 142rpx;
}
.gettime{
.gettime {
width: 172rpx;
}
.usetime{
.usetime {
width: 158rpx;
}
.status{
.status {
width: 84rpx;
}
.operation{
.operation {
width: 56rpx;
&.status3{
color: #FF383C;
&.status3 {
color: #ff383c;
}
}
.header{
display: flex;
justify-content: space-between;
padding: 32rpx 16rpx;
color: #666;
border-bottom: 1px solid #E5E5E5;
}
.body{
.item{
display: flex;
justify-content: space-between;
padding: 24rpx 16rpx;
border-bottom: 1px solid #E5E5E5;
}
.header {
display: flex;
justify-content: space-between;
padding: 32rpx 16rpx;
color: #666;
border-bottom: 1px solid #e5e5e5;
}
.body {
.item {
display: flex;
justify-content: space-between;
padding: 24rpx 16rpx;
border-bottom: 1px solid #e5e5e5;
}
}
}
</style>

74
pageChat/group-info/index.vue
View File

@@ -2,7 +2,7 @@
<view class="min-page bg-f7 u-font-28">
<view class="user-list bg-fff">
<view class="u-flex u-row-between u-col-center">
<text class="color-000">群成员（{{allUser.length}}人）</text>
<text class="color-000">群成员（{{ allUser.length }}人）</text>
<text class="color-red" @click="showRemove = !showRemove">移除</text>
</view>
<view class="list u-m-t-26">
@@ -17,7 +17,9 @@
:src="item.avatar"
round="8rpx"
></up-avatar>
<view class="u-m-t-8 color-000 u-line-1" style="max-width: 104rpx;">{{ item.nick_name }}</view>
<view class="u-m-t-8 color-000 u-line-1" style="max-width: 104rpx">{{
item.nick_name
}}</view>
<view
class="remove u-absolute"
v-if="showRemove && item.role != 1"
@@ -40,7 +42,10 @@
</view>
<view class="bottom">
<view class="u-flex u-row-between default-padding bg-fff border-bottom">
<view
class="u-flex u-row-between default-padding bg-fff border-bottom"
@click="toEditTitle"
>
<text>群聊名称</text>
<view class="u-flex color-666">
<text>{{ groupInfo.name }}</text>
@@ -77,6 +82,17 @@
</view>
</view>
</view>
<Modal v-model="modalData.show" title="修改群名称" @confirm="modalConfirm">
<view class="u-p-40">
<view class="font-bold u-m-b-16">群名称</view>
<up-input
v-model="modalData.form.title"
placeholder="请输入群名称"
maxlength="20"
></up-input>
</view>
</Modal>
</view>
</template>
<script setup>
@@ -84,10 +100,50 @@ import go from "@/commons/utils/go.js";
import * as chatApi from "@/http/php/chat";
import { onShow, onLoad } from "@dcloudio/uni-app";
import { reactive, toRefs, computed, watch, onMounted, ref } from "vue";
import Modal from "@/pageChat/components/modal.vue";
const options = reactive({});
const groupInfo = ref({});
onLoad((opt) => {
Object.assign(options, opt);
const modalData = reactive({
show: false,
form: {
title: "",
},
key: "editTitle",
});
function toEditTitle() {
modalData.show = true;
modalData.form.title = groupInfo.value.name || "";
}
function modalConfirm(e) {
if (modalData.key == "editTitle") {
if (!modalData.form.title.trim().length) {
uni.showToast({
title: "请输入群名称",
icon: "none",
});
return;
}
chatApi
.groupEditTitle({
group_id: options.group_id,
title: modalData.form.title,
})
.then((res) => {
if (res) {
groupInfo.value.name = modalData.form.title;
modalData.show = false;
uni.showToast({
title: "修改成功",
icon: "none",
});
}
});
}
}
function getGroupInfo() {
chatApi
.groupInfo({
group_id: options.group_id,
@@ -95,6 +151,10 @@ onLoad((opt) => {
.then((res) => {
groupInfo.value = res || {};
});
}
onLoad((opt) => {
Object.assign(options, opt);
getGroupInfo();
});
function groupMuteChange(e) {
if (e) {
@@ -137,8 +197,8 @@ function getMembers() {
});
}
function loadMore() {
userLists.value=allUser.value
function loadMore() {
userLists.value = allUser.value;
}
onShow(() => {
getMembers();

131
pageChat/index.vue
View File

@@ -19,36 +19,37 @@
</up-sticky>
<view class="list">
<up-swipe-action>
<up-swipe-action-item
:options="options1"
v-for="(item, index) in list"
v-model:show="item.showOptions"
@click="optionsClick($event, item, index)"
:key="item.id"
>
<view class="item u-flex" @click="toDetail(item)">
<view class="u-flex avatar">
<up-avatar
size="118rpx"
:src="item.avatar"
shape="square"
round="8rpx"
></up-avatar>
<view class="bandage" v-if="item.unread_count > 0">{{
item.unread_count >= 99 ? "99" : item.unread_count
}}</view>
</view>
<view class="u-flex-1 u-flex u-row-between u-p-l-14">
<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
<template v-for="(item, index) in list" :key="item.id">
<up-swipe-action-item
:options="options1"
v-model:show="item.showOptions"
@click="optionsClick($event, item, index)"
>
<view class="item u-flex" @click="toDetail(item)">
<view class="u-flex avatar">
<up-avatar
size="118rpx"
:src="item.avatar"
shape="square"
round="8rpx"
></up-avatar>
<view class="bandage" v-if="item.unread_count > 0">{{
item.unread_count >= 99 ? "99" : item.unread_count
}}</view>
</view>
<view class="color-333 u-font-24">{{ item.send_time }}</view>
<view class="u-flex-1 u-flex u-row-between u-p-l-14">
<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>
</up-swipe-action-item>
</up-swipe-action-item>
<view style="height: 16rpx" class="bg-f7"></view>
</template>
</up-swipe-action>
</view>
</view>
@@ -56,45 +57,49 @@
<script setup>
import * as chatApi from "@/http/php/chat";
import { ref, reactive, inject, onMounted,onUnmounted } from "vue";
import { ref, reactive, onMounted, onUnmounted } from "vue";
import { onShow } from "@dcloudio/uni-app";
import { useChatStore } from "@/store/chat";
import dayjs from "dayjs";
const chatStore = useChatStore();
onMounted(() => {
chatStore.connectSocket();
// 确保状态监听已初始化
if (!chatStore._listenersInitialized) {
chatStore.initStateListeners();
chatStore._listenersInitialized = true;
const originalOnReceiveMsg = chatStore.onReceiveMsg;
// 定义消息回调函数
const handleReceiveMsg = (msg) => {
// 先执行原始回调（如果有）
if (typeof originalOnReceiveMsg === "function") {
originalOnReceiveMsg(msg);
}
});
const startReciveMsg=ref(true)
onUnmounted(() => {
startReciveMsg.value=false
})
chatStore.onReceiveMsg = (msg) => {
if(!startReciveMsg.value){
return
}
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;
allList.value[index].send_time_origin = msg.send_time_origin;
allList.value = listSort(allList.value);
}
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;
list.value[index1].send_time_origin = msg.send_time_origin;
list.value = listSort(list.value);
}
}
};
onMounted(() => {
chatStore.registerReceiveMsgCallback(handleReceiveMsg);
});
onUnmounted(() => {
// 移除消息回调，避免内存泄漏
chatStore.removeReceiveMsgCallback(handleReceiveMsg);
});
function returnMsg(msg) {
if (msg.msg_type == 1) {
return msg.nick + "：" + msg.content;
@@ -168,7 +173,7 @@ function throttle(fn, delay) {
//使用节流函数
const throttleSearch = throttle(search, 500);
function search() {
list.value = allList.value
const arr = allList.value
.filter((v) => v.name.includes(query.key.trim()))
.map((v) => {
return {
@@ -176,10 +181,20 @@ function search() {
showOptions: false,
};
});
list.value = listSort(arr);
}
function listSort(arr) {
return arr.sort((a, b) => {
return dayjs(b.send_time_origin).unix() - dayjs(a.send_time_origin).unix();
});
}
async function getList() {
const res = await chatApi.messageSessionList({});
allList.value = (res.list || []).filter((v) => !v.is_del);
const arr = (res.list || []).filter((v) => !v.is_del);
allList.value = listSort(arr);
search();
}
@@ -190,7 +205,7 @@ async function clearAllmsg() {
success: async (res) => {
if (res.confirm) {
const res = await chatApi.messageMarkReadAll({
session_ids: list.value.map((v) => v.session_id).join(","),
session_ids: list.value.map((v) => v.group_id).join(","),
});
if (res) {
uni.showToast({
@@ -224,8 +239,16 @@ function toDetail(item) {
const messageUnreadCount = ref(0);
onShow(() => {
startReciveMsg.value=true
getList();
// 检查连接状态，确保连接活跃
if (!chatStore.isConnect || !chatStore.socketTask) {
console.log("列表页显示，检查Socket连接");
chatStore.forceReconnect();
} else {
chatStore.shop_id = "";
chatStore.init();
}
// 获取未读消息总数
chatApi.messageUnreadCount({}).then((res) => {
console.log(res);
@@ -245,13 +268,11 @@ onShow(() => {
}
.list {
padding: 36rpx 28rpx;
.item {
padding: 32rpx 28rpx;
background-color: #fff;
border-radius: 16rpx;
display: flex;
flex-direction: column;
gap: 16rpx;
.avatar {
position: relative;
.bandage {
@@ -273,4 +294,10 @@ onShow(() => {
}
}
}
:deep(.u-swipe-action-item__content) {
background-color: transparent;
}
:deep(.u-swipe-action-item) {
border-radius: 16rpx;
}
</style>