From c55d02570ef38c0b3c3dc606bd4d764521d79bbf Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E6=B5=A9?= <15830956848@163.com> Date: Wed, 9 Apr 2025 17:36:48 +0800 Subject: [PATCH] =?UTF-8?q?=E7=AB=99=E5=86=85=E4=BF=A1=E4=BF=A1=E6=81=AF?= =?UTF-8?q?=E5=B1=95=E7=A4=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- TUIKit/components/TUIChat/index.vue | 14 +- TUIKit/components/TUIContact/indexsea.vue | 6 +- api/home.js | 15 +- api/members.js | 35 +++ config/api.js | 5 +- package-lock.json | 10 + package.json | 4 +- pages.json | 44 +-- pages/mine/set/personMsg.vue | 80 +++--- pages/tabbar/home/template/tpl_shop.vue | 115 ++++++++ pages/tabbar/home/views.vue | 5 +- pages/tabbar/im/details/index.vue | 49 ++++ pages/tabbar/im/index.vue | 314 ++++++++++++++++++---- static/im/znx.png | Bin 0 -> 404 bytes 14 files changed, 581 insertions(+), 115 deletions(-) create mode 100644 pages/tabbar/home/template/tpl_shop.vue create mode 100644 pages/tabbar/im/details/index.vue create mode 100644 static/im/znx.png diff --git a/TUIKit/components/TUIChat/index.vue b/TUIKit/components/TUIChat/index.vue index 377dc669..4dcbac60 100644 --- a/TUIKit/components/TUIChat/index.vue +++ b/TUIKit/components/TUIChat/index.vue @@ -76,6 +76,8 @@ :placeholder="TUITranslateService.t('TUIChat.请输入消息')" :inputToolbarDisplayType="inputToolbarDisplayType" @changeToolbarDisplayType="changeToolbarDisplayType" + + /> @@ -111,7 +113,7 @@ import { isPC, isWeChat, isUniFrameWork, isMobile, isApp } from '../../utils/env import { ToolbarDisplayType } from '../../interface'; import TUIChatConfig from './config'; // @Start uniapp use Chat only -import { onLoad, onUnload } from '@dcloudio/uni-app'; +import { onLoad, onUnload,onNavigationBarButtonTap } from '@dcloudio/uni-app'; import { initChat, logout } from './entry-chat-only.ts'; onLoad((options) => { @@ -141,7 +143,12 @@ const messageInputRef = ref(); const messageListRef = ref>(); const headerExtensionList = ref([]); const featureConfig = TUIChatConfig.getFeatureConfig(); -const ht = uni.getSystemInfoSync().windowHeight + +onNavigationBarButtonTap((e) => { + if (isGroup.value) { + handleGroup(); + } +}); onMounted(() => { @@ -214,6 +221,9 @@ const handleEditor = (message: IMessageModel, type: string) => { const handleGroup = () => { headerExtensionList.value[0].listener.onClicked({ groupID: groupID.value }); + uni.navigateTo({ + url: `/TUIKit/components/TUIGroup/index` + }); }; function changeToolbarDisplayType(type: ToolbarDisplayType) { diff --git a/TUIKit/components/TUIContact/indexsea.vue b/TUIKit/components/TUIContact/indexsea.vue index 45008971..0c22861f 100644 --- a/TUIKit/components/TUIContact/indexsea.vue +++ b/TUIKit/components/TUIContact/indexsea.vue @@ -5,7 +5,7 @@ :class="['tui-contact', !isPC && 'tui-contact-h5']" >
- +
{ + emits('switchConversation', item); + } const displayTypeRef = ref(props.displayType || 'contactList'); const isShowSelectFriend = ref(false); const isShowContactList = ref(true); diff --git a/api/home.js b/api/home.js index d490004e..59287f8a 100644 --- a/api/home.js +++ b/api/home.js @@ -36,7 +36,20 @@ export function getCategory(parent_id = 0) { loading: false, }); } - +/** + * 获取首页商品分类 + * @param pagesize + * @param page + * @param keyword + * @param category_id + */ +export function getbendi(data) { + return http.request({ + url: `goods/goods/bendi`, + method: Method.GET, + data + }); +} /** * 获取热门关键词 * @param num diff --git a/api/members.js b/api/members.js index 67c26b5b..b36296b5 100644 --- a/api/members.js +++ b/api/members.js @@ -291,6 +291,41 @@ export function getUserimInfo() { needToken: true, }); } + +/** + * 获取站内信的数据 + * @returns {AxiosPromise} + */ +export function getMember(params) { + return http.request({ + url: "/message/member", + method: Method.GET, + needToken: true, + data:params + }); +} +/** + * 获取站内信已读状态修改 + */ +export function getMemberstate(params) { + return http.request({ + url: "/message/member/read", + method: Method.POST, + needToken: true, + data:params + }); +} +/** + * 获取站内信删除 + */ +export function getMemberdelete(params) { + return http.request({ + url: "/message/member/delete", + method: Method.POST, + needToken: true, + data:params + }); +} /** * 获取当前用户的预存款 * @returns {AxiosPromise} diff --git a/config/api.js b/config/api.js index b318692f..19d7df32 100644 --- a/config/api.js +++ b/config/api.js @@ -9,7 +9,8 @@ const dev = { common: "http://192.168.1.200:8890", buyer: "http://192.168.1.200:8888", - vlog: "http://192.168.1.86:8099" + vlog: "http://192.168.1.200:8099", + web: "http://192.168.1.200:8099", }; // 生产环境 @@ -18,7 +19,7 @@ const prod = { // buyer: "https://buyer-api.pickmall.cn", common: "http://192.168.1.200:8890", buyer: "http://192.168.1.200:8888", - vlog: "http://192.168.1.86:8099" + vlog: "http://192.168.1.200:8099", }; //默认生产环境 diff --git a/package-lock.json b/package-lock.json index b62191e5..1b4024af 100644 --- a/package-lock.json +++ b/package-lock.json @@ -236,6 +236,11 @@ "@babel/helper-validator-identifier": "^7.25.9" } }, + "@dcloudio/uni-app": { + "version": "2.0.2-4050720250324001", + "resolved": "https://registry.npmmirror.com/@dcloudio/uni-app/-/uni-app-2.0.2-4050720250324001.tgz", + "integrity": "sha512-3hqUSmRQnclnG9bCcjxWsAy5A7fmBOKNZ2BbzmoPihGQVY5HvLDsDZp7VK3ZA6d7l80kAhMM/8ayceT0fWN0oQ==" + }, "@jridgewell/gen-mapping": { "version": "0.3.8", "resolved": "https://registry.npmmirror.com/@jridgewell/gen-mapping/-/gen-mapping-0.3.8.tgz", @@ -1143,6 +1148,11 @@ "sdp": "^3.2.0" } }, + "ws": { + "version": "8.18.1", + "resolved": "https://registry.npmmirror.com/ws/-/ws-8.18.1.tgz", + "integrity": "sha512-RKW2aJZMXeMxVpnZ6bck+RswznaxmzdULiBr6KY7XkTnW8uvt0iT9H5DkHUChXrc+uurzwa0rVI16n/Xzjdz1w==" + }, "yallist": { "version": "3.1.1", "resolved": "https://registry.npmmirror.com/yallist/-/yallist-3.1.1.tgz", diff --git a/package.json b/package.json index aa8c51db..2cde5c22 100644 --- a/package.json +++ b/package.json @@ -1,8 +1,10 @@ { "dependencies": { + "@dcloudio/uni-app": "^2.0.2-4050720250324001", "@tencentcloud/chat-uikit-uniapp": "^2.4.3", "@vue/runtime-core": "^3.5.13", "unplugin-vue2-script-setup": "^0.11.4", - "vue": "^3.2.0" + "vue": "^3.2.0", + "ws": "^8.18.1" } } diff --git a/pages.json b/pages.json index 4f6c0bf2..685686d0 100644 --- a/pages.json +++ b/pages.json @@ -535,6 +535,15 @@ "navigationBarTextStyle": "white", "navigationBarBackgroundColor": "#181b27" } + }, + { + "path": "pages/tabbar/im/details/index", + "style": { + "navigationBarTitleText": "消息详情", + "navigationBarTextStyle": "white", + "navigationBarBackgroundColor": "#181b27" + + } } ], "subPackages": [ @@ -1192,22 +1201,27 @@ { "path": "components/TUIChat/index", "style": { - "navigationBarTitleText": "腾讯云 IM", - "app-plus": { - "softinputMode": "adjustResize", - "titleNView": { - "buttons": [{ - "type": "menu" - }] - } - }, - "h5": { - "titleNView": { - "buttons": [] + "navigationBarTitleText": "腾讯云 IM", + "app-plus": { + "softinputMode": "adjustResize", + "titleNView": { + "buttons": [ + { + "type": "menu" + // "click": "handleMenuClick" // 绑定点击事件 } + ] } + }, + "h5": { + "titleNView": { + "buttons": [{ + "type": "menu" + }] + } + } } - }, + }, // 集成 chat 组件，必须配置该路径: 视频播放 { "path": "components/TUIChat/video-play", @@ -1235,7 +1249,7 @@ { "path": "components/TUIGroup/index", "style": { - "navigationBarTitleText": "腾讯云 IM4", + "navigationBarTitleText": "群管理", "app-plus": { "titleNView": { "backButton": true // 显示返回按钮 @@ -1284,7 +1298,7 @@ "text": "消息" }, { - "pagePath": "pages/me/me", + "pagePath": "pages/tabbar/user/my", "text": "我的" } ], diff --git a/pages/mine/set/personMsg.vue b/pages/mine/set/personMsg.vue index dbd4436c..b7944e95 100644 --- a/pages/mine/set/personMsg.vue +++ b/pages/mine/set/personMsg.vue @@ -32,7 +32,7 @@ 保存 退出登录
- @@ -44,7 +44,7 @@ } from "@/api/members.js"; import { upload - } from "@/api/common.js"; + } from "@/api/common.js"; import { logout } from "@/api/login"; import storage from "@/utils/storage.js"; import uFormItem from "@/uview-ui/components/u-form-item/u-form-item.vue"; @@ -55,8 +55,8 @@ "m-city": gkcity }, data() { - return { - quitShow:false, + return { + quitShow:false, userInfo:{}, lightColor: this.$lightColor, //高亮颜色 form: { @@ -90,35 +90,35 @@ }; }, onShow() { - console.log('personMSg') - this.userInfo = this.$options.filters.isLogin(); + console.log('personMSg') + this.userInfo = this.$options.filters.isLogin(); console.log(this.userInfo) }, - methods: { - showModalDialog() { - this.quitShow = true; - }, - clear() { - storage.setAccessToken(""); - storage.setRefreshToken(""); - storage.setUserInfo({}); - // 清理vlog信息 - storage.setVlogToken("") - storage.setVlogUserInfo({}) - this.$options.filters.navigateToLogin("redirectTo"); - }, - /** - * 确认退出 - * 清除缓存重新登录 - */ - async confirm() { - await logout(); - this.clear(); + methods: { + showModalDialog() { + this.quitShow = true; + }, + clear() { + storage.setAccessToken(""); + storage.setRefreshToken(""); + storage.setUserInfo({}); + // 清理vlog信息 + storage.setVlogToken("") + storage.setVlogUserInfo({}) + this.$options.filters.navigateToLogin("redirectTo"); + }, + /** + * 确认退出 + * 清除缓存重新登录 + */ + async confirm() { + await logout(); + this.clear(); }, /** * 退出登录 */ - quiteLoginOut() { + quiteLoginOut() { console.log(this.$options) this.$options.filters.quiteLoginOut(); }, @@ -260,18 +260,18 @@ .form { background-color: #ffffff; - } - .bottom{ - position: fixed; - bottom: 40px; - display: flex; - align-items: center; - width: 100%; - >.submit{ - background: $light-color; - color: #fff; - width: 40%; - } - + } + .bottom{ + position: fixed; + bottom: 40px; + display: flex; + align-items: center; + width: 100%; + >.submit{ + background: $light-color; + color: #fff; + width: 40%; + } + } \ No newline at end of file diff --git a/pages/tabbar/home/template/tpl_shop.vue b/pages/tabbar/home/template/tpl_shop.vue new file mode 100644 index 00000000..edb4a10d --- /dev/null +++ b/pages/tabbar/home/template/tpl_shop.vue @@ -0,0 +1,115 @@ + + + diff --git a/pages/tabbar/home/views.vue b/pages/tabbar/home/views.vue index 810d1ebe..2ca2b6aa 100644 --- a/pages/tabbar/home/views.vue +++ b/pages/tabbar/home/views.vue @@ -18,6 +18,7 @@ + @@ -30,7 +31,7 @@ - + @@ -61,6 +62,7 @@ import tpl_group from "@/pages/tabbar/home/template/tpl_group"; // import tpl_goods from "@/pages/tabbar/home/template/tpl_goods"; //商品分类以及分类中的商品 import Talent from "@/pages/tabbar/home/template/Talent"; //达人店 import tpl_activity from "@/pages/tabbar/home/template/tpl_activity"; //活动 +import tpl_shop from "@/pages/tabbar/home/template/tpl_shop"; //活动 // 结束引用组件 import { getFloorData ,getFloorgetBendi} from "@/api/home"; //获取楼层装修接口 import permision from "@/js_sdk/wa-permission/permission.js"; //权限工具类 @@ -97,6 +99,7 @@ export default { group: tpl_group, Talent, activity: tpl_activity, + shop:tpl_shop // spike: tpl_spike, // joinGroup: tpl_join_group, // integral: tpl_integral, diff --git a/pages/tabbar/im/details/index.vue b/pages/tabbar/im/details/index.vue new file mode 100644 index 00000000..35b9afb2 --- /dev/null +++ b/pages/tabbar/im/details/index.vue @@ -0,0 +1,49 @@ + + + + + diff --git a/pages/tabbar/im/index.vue b/pages/tabbar/im/index.vue index 647cde69..bb7f34db 100644 --- a/pages/tabbar/im/index.vue +++ b/pages/tabbar/im/index.vue @@ -1,45 +1,84 @@ @@ -55,7 +94,12 @@ import SelectFriend from "@/TUIKit/components/TUIContact/select-friend/index.vue import SelectFriendqlioa from "@/TUIKit/components/TUIGroup/index.vue"; import TUICore, { ExtensionInfo, TUIConstants } from "@tencentcloud/tui-core"; import storage from "@/utils/storage.js"; -import { getUserimInfo } from "@/api/members"; +import { + getUserimInfo, + getMember, + getMemberstate, + getMemberdelete, +} from "@/api/members"; TUIChatKit.init(); let vueVersion = 2; // vueVersion = 3; @@ -73,9 +117,19 @@ export default { }, data() { return { - statue: 0, //1联系人 2添加好友/群聊 0对话记录 3建群 4群名称 + statue: 0, // 0对话记录 1联系人 2添加好友/群聊 3建群 4群名称 6站内信 isPopupVisible: false, // 控制弹出框的显示与隐藏 isq: false, + popupRef: null, // 新增，用于保存弹窗的引用 + meList: [], + swipeStates: [], + startX: 0, + tole: 0, //已读未读 + cleartime: null, + pageSize: 20, + pageNumber: 1, + total: 0, + loadMoreStatus: "more", // 加载更多状态 }; }, created() {}, @@ -107,21 +161,86 @@ export default { }); }); }, - mounted() {}, + mounted() { + this.getMembermethod(); + this.setTime(); + // 监听全局点击事件 + document.addEventListener("click", (event) => + this.handleGlobalClick(event) + ); + // 监听滚动事件 + }, + beforeDestroy() { + // 移除全局点击事件 + document.removeEventListener("click", this.handleGlobalClick); + // 清除定时器 + clearTimeout(this.cleartime); + // 移除滚动事件监听 + }, methods: { + lowerBottom() { + if(this.total>=this.meList.length){ + this.pageSize+=10; + this.getMembermethod(); + } + }, + setTime() { + const th = this; + this.cleartime = setTimeout(() => { + this.getMembermethod(); + th.setTime(); //递归调用setTime函数，实现每10秒执行一次getMembermethod函数的效果 + }, 10000); + }, + torut(item) { + // 将 item 对象转换为 JSON 字符串，以便在 URL 中传递 + const itemJson = encodeURIComponent(JSON.stringify(item)); + // 使用 uni.navigateTo 方法跳转到详情页，并传递信息 + uni.navigateTo({ + url: `/pages/tabbar/im/details/index?item=${itemJson}`, + }); + getMemberstate({ messageId: item.messageId }).then((res) => { + this.getMembermethod(); + }); + }, //完成跳转群名 confn() { - this.statue = 4; + // this.statue = 0; + this.isPopupVisible = false; }, concen() { this.statue = 0; - this.isPopupVisible = false; }, hui(index) { this.statue = index; }, fnkiopl() { this.isPopupVisible = !this.isPopupVisible; + this.popupRef = this.$refs.popup; + }, + handleGlobalClick(event) { + if (this.isPopupVisible && event.target._prevClass != "jolkp_l") { + this.isPopupVisible = false; + } + }, + + getMembermethod() { + const param = { + pageSize: this.pageSize, + pageNumber: this.pageNumber, + }; + getMember(param).then((res) => { + this.total = res.data.result.total; + if (this.pageNumber === 1) { + this.meList = res.data.result.records; + } else { + this.meList = this.meList.concat(res.data.result.records); + } + this.swipeStates = new Array(this.meList.length).fill(0); + this.tole = this.meList.filter( + (item) => item.status === "UN_READY" + ).length; + + }); }, handleMenu() { const fn = [ @@ -143,19 +262,38 @@ export default { this.statue = 2; this.isPopupVisible = false; }, - - // // 打开会话列表 - // openConversationList() { - // uni.navigateTo({ - // url: '/TUIKit/components/TUIConversation/index' - // }); - // }, - // // 打开联系人 - // openContact() { - // uni.navigateTo({ - // url: '/TUIKit/components/TUIContact/index' - // }); - // }, + handleScan() { + this.isPopupVisible = false; + uni.scanCode({ + success: (res) => { + console.log("扫码结果:", res); + this.statue=0 + // 可以在这里添加处理扫码结果的逻辑 + }, + fail: (err) => { + console.error("扫码失败:", err); + this.statue=0 + }, + }); + }, + startLongPress(item, index) { + this.longPressTimer = setTimeout(() => { + uni.showModal({ + title: "确认删除", + content: "确定要删除这条消息吗？", + success: (res) => { + if (res.confirm) { + getMemberdelete({ messageId: item.messageId }).then((res) => { + this.getMembermethod(); + }); + } + }, + }); + }, 2000); + }, + endLongPress() { + clearTimeout(this.longPressTimer); + }, }, }; @@ -191,7 +329,7 @@ page { /* 背景图不重复 */ background-repeat: no-repeat; margin-top: 35px; - margin-right: 20px; + margin-right: 10px; } .jolkp_h { @@ -205,7 +343,24 @@ page { margin-top: 35px; margin-right: 20px; } +.jolkp_z { + width: 2rem; + height: 1.5rem; + background-image: url("@/static/im/znx.png"); + /* 让背景图覆盖整个元素 */ + background-size: cover; + /* 背景图不重复 */ + background-size: 100% 100%; + margin-top: 35px; + margin-right: 20px; +} +.tiole { + margin-top: -10px; + margin-left: 105%; + color: #fff; + font-size: 14px; +} .popup { position: absolute; top: 65px; @@ -238,10 +393,20 @@ page { height: "100%"; font-size: 18px; display: flex; - align-items: end; + padding: 5px; } - +@media screen and (device-width: 393px) and (device-height: 851px) and (-webkit-device-pixel-ratio: 3) { + .fan { + margin-right: 56% !important; + width: 10%; + height: "100%"; + font-size: 18px; + display: flex; + margin-top: 85%; + padding: 5px; + } +} .three { width: 100%; height: 10%; @@ -250,10 +415,10 @@ page { align-items: center; background: rgb(255, 255, 255); } -.con{ - width: 100%; - height: 100%; - display: flex; +.con { + width: 100%; + height: 100%; + display: flex; flex-direction: column; align-items: center; justify-content: center; @@ -270,7 +435,7 @@ page { } .three_div2 { - width: 40%; + width: 40%; height: 3rem; background-image: url("@/static/im/hy.png"); background-size: 100% 100%; @@ -285,5 +450,52 @@ page { background-repeat: no-repeat; width: 40%; } +.tui-conversation-item { + /* height: 10%; */ + padding: 12px; + display: flex; + align-items: center; + cursor: pointer; + box-sizing: border-box; + overflow: hidden; + border: 1px solid #d9d9d9; + width: 98%; + margin-top: 10px; + position: relative; +} +.content { + display: flex; + flex: 1; + padding-left: 8px; + justify-content: end; + box-sizing: border-box; + overflow: hidden; +} +.left { + position: relative; + width: 36px; + height: 36px; +} +.znx { + max-height: 100vh; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + overflow-y: auto; +} +.delete-button { + position: absolute; + right: 0; + top: 0; + bottom: 0; + width: 100px; + background-color: red; + color: white; + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; +} diff --git a/static/im/znx.png b/static/im/znx.png new file mode 100644 index 0000000000000000000000000000000000000000..9f67305c952e2dd42ac488be8f47acace507f8f6 GIT binary patch literal 404 zcmeAS@N?(olHy`uVBq!ia0vp^#vshW1|+Q(8fXD2#^NA%Cx&(BWL^R}EX7WqAsj$Z z!;#Vfl(X}6aSX|5d^^j~%h^%H^?e8Th7BG+rzbpQV=-6M*ulJU%ccTGv1!x9@($=R zwwg?P=WtLh^}wO~vfVBmhh6^rEc#qmvApIE|Mvs+M|p%B8kbmmw!hL>_Ecw-Sao0N zeh-twTd~(ktIHZo9~p%eO0M3~6B=_&OD|b;`o^x)5vjW$%og{2elbVkrQJkZk27+@ zo0UB$XO!t?>MxJzJY&-GVT%RBtPq29XE(2WQOxmB_mppOckY$^XGUR~H)pc#=t;9) znV_`2XY-LhlbuKZlp#z$nz{yNVc;#_NtGvTGyPPy)?Z9vjXEo58q@JEhEetSoBxZO zkFXcS>`qs&6Rc$2lqb6SQ}YRd8*A_CcdIIyKl`ris`8O@&b4