From 29658de29b2eb5292bf0c2fad7427b374b769ebc Mon Sep 17 00:00:00 2001 From: qingyiay <2386314947@qq.com> Date: 星期三, 10 五月 2023 20:29:31 +0800 Subject: [PATCH] 样式修改,引入字体,修改逻辑 --- pages/tabbar-page/index-tabbar/index-tabbar.vue | 123 ++++++++++++++++++++++++++++++++++------ 1 files changed, 103 insertions(+), 20 deletions(-) diff --git a/pages/tabbar-page/index-tabbar/index-tabbar.vue b/pages/tabbar-page/index-tabbar/index-tabbar.vue index acae31a..da810e4 100644 --- a/pages/tabbar-page/index-tabbar/index-tabbar.vue +++ b/pages/tabbar-page/index-tabbar/index-tabbar.vue @@ -1,7 +1,12 @@ <template> - <view> + <view class="max-block"> <view class="search-bar"> - <view class="icon-box" @click="messagePage"><u-icon name="chat" color="#000" size="50"></u-icon></view> + <view class="icon-body"> + <view class="icon-box" @click="messagePage"> + <u-badge :isDot="true" type="error" v-if="dotShow"></u-badge> + <u-icon name="chat" color="#fff" size="50"></u-icon> + </view> + </view> </view> <customer-index v-if="roleType == 1" ref="customerIndexRef" :orderPlanDataStore="orderPlanDataStore"></customer-index> <freight-forwarder-index @@ -13,7 +18,10 @@ <driver-index v-if="roleType == 3" ref="driverIndexRef" :indexdriverBillOfLoadingData="indexdriverBillOfLoadingData"></driver-index> <tab-bar :current="0"></tab-bar> <!-- 鎺ㄩ�佹秷鎭脊绐� --> - <u-modal :show="messagePushShow" :title="messageList.title" :content="messageList.content" @confirm="messageconfirm"></u-modal> + <u-modal :show="messagePushShow" :title="messageList.title" @confirm="messageconfirm" confirm-text="鍓嶅幓鏌ョ湅"> + <view class="slot-content"><rich-text :nodes="messageList.content"></rich-text></view> + </u-modal> + <view class="white-block"></view> </view> </template> @@ -23,6 +31,7 @@ import freightForwarderIndex from '@/pages/freight-forwarder-page/freightForwarder-index/freightForwarder-index.vue'; import { mapState, mapMutations } from 'vuex'; import { webSocketUrl } from '@/api/request.js'; + let socket = null; export default { components: { @@ -102,6 +111,18 @@ console.log('寮�鍚弻浜洪�氳瘽鎴愬姛Complete'); } }); + let amap = require('../../../utils/amap-wx.130.js'); + let amapPlugin = new amap.AMapWX({ + key: 'e3106700a6225e6a25727d3a41fa54c5' + }); + amapPlugin.getRegeo({ + success: data => { + console.log(data, '鑾峰彇浣嶇疆'); + }, + fail: info => { + console.log(info, '閿欒淇℃伅'); + } + }); }, data() { return { @@ -112,7 +133,11 @@ indexdriverBillOfLoadingData: {}, messagePushShow: false, messageList: {}, - isconnect: false + isconnect: false, + dotShow: false, + amapPlugin: null, + key: 'e3106700a6225e6a25727d3a41fa54c5', + addressName: '' }; }, onShow() { @@ -121,6 +146,18 @@ this.initWebsocket(); } this.userAuthorization(); + this.messageReq(); + }, + onHide() { + console.log('椤甸潰闅愯棌'); + if (!this.isconnect) { + this.initWebsocket(); + } + }, + onUnload() { + console.log('椤甸潰鍗歌浇'); + socket.close(); + clearInterval(this.intervalId); }, methods: { ...mapMutations(['pushMessage', 'changeWeigh', 'changeinfraredStatus']), @@ -208,10 +245,19 @@ }); socket.onOpen(() => { console.log('onOpen'); + this.intervalId = setInterval(() => { + socket.send({ + data: JSON.stringify({ type: 'ping' }), + success(e) { + console.log(e, '鍙戦�佸績璺虫垚鍔�'); + } + }); + }, 30000); }); + // 鑾峰彇鏈嶅姟鍣ㄤ紶鏉ョ殑鏁版嵁锛屽仛鐩稿簲澶勭悊 socket.onMessage(res => { - console.log('socketWeigh', res); + console.log('message', res); if (res.data.startsWith('weigh')) { let nowWeighObj = JSON.parse(res.data.slice(7)); if (this.globalweighHouseCode && nowWeighObj.eqCode == this.globalweighHouseCode) { @@ -223,14 +269,15 @@ this.changeWeigh(nowWeighObj.weigh); } } - } else { + } else if (res.data.startsWith('msg')) { this.messageList = JSON.parse(res.data.slice(5)); this.messagePushShow = true; + } else { } }); - socket.onClose(() => { - console.log('webSocketClose'); - this.isconnect = true; + socket.onClose(e => { + console.log('webSocketClose', e); + this.isconnect = false; }); socket.onError(err => { console.log('socket鎶ラ敊', err); @@ -239,27 +286,63 @@ }, messageconfirm() { this.messagePushShow = false; + uni.navigateTo({ + url: '/pages/public-page/message/message' + }); + }, + messageReq() { + this.$reqGet('getMessageByUser', { current: 1, size: 10 }).then(res => { + if (res.code == 0) { + this.messageList = res.data.records; + this.messageList.map(v => { + if (v.status !== 1) { + this.dotShow = true; + } else { + this.dotShow = false; + } + }); + } + }); } } }; </script> <style lang="scss" scoped> +.max-block { + font-family: siYuanLight !important; +} +.white-block { + width: 100%; + height: vww(20); + margin-top: vww(10); +} .search-bar { height: vww(20); width: 96%; - margin: vww(3) auto; - position: relative; - .icon-box { - width: vww(30); - height: vww(30); - background-color: #eee; - border-radius: 50%; + position: absolute; + top: vww(96); + right: vww(32); + z-index: 1; + .icon-body { + position: relative; display: flex; - justify-content: center; - align-items: center; - position: absolute; - right: vww(-3); + justify-content: flex-end; + .icon-box { + width: vww(30); + height: vww(30); + border-radius: 50%; + display: flex; + justify-content: center; + align-items: center; + position: relative; + /deep/ .u-badge { + position: absolute; + left: vww(18); + top: vww(5); + z-index: 1; + } + } } } </style> -- Gitblit v1.9.1