修改地图点击其他用户定位展示用户信息，发起聊天功能

light-application-wx/pages/chat-detail/chat-detail.js

@@ -10,15 +10,7 @@ Page({
         username: {
             your: "",
         },
-        list: [{
-            id: 1,
-            photo: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fup.enterdesk.com%2Fedpic_source%2Fc0%2F8e%2F28%2Fc08e28eb52da5a2b5b451ad6272a8197.jpg&refer=http%3A%2F%2Fup.enterdesk.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1652429449&t=63437c824c18680ecb5e5f27d06f941b',
-            content: '你到了吗？'
-        }, {
-            id: 2,
-            photo: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fnimg.ws.126.net%2F%3Furl%3Dhttp%253A%252F%252Fdingyue.ws.126.net%252F2021%252F0314%252F94ad46dbj00qpy1do0021d200rs00rsg008t008t.jpg%26thumbnail%3D650x2147483647%26quality%3D80%26type%3Djpg&refer=http%3A%2F%2Fnimg.ws.126.net&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1652429449&t=3fd0174f597633f23248e79587f76513',
-            content: '刚刚到达，已找到位置，谢谢！'
-        }]
+        list: []
     },
 
     /**

light-application-wx/pages/chat-room/chat-room.js

@@ -165,9 +165,8 @@ Page({
      * 查询聊天记录（包含陌生人版本）
      */
     getChatList: function () {
-        var myName = wx.getStorageSync("myUsername");
-        var array = [];
-        const that = this
+        let myName = wx.getStorageSync("myUsername");
+        let that = this
         wx.getStorageInfo({
             success: function (res) {
                 console.info(res);
@@ -370,7 +369,9 @@ Page({
         }
     },
 
-    //	单聊
+    /**
+     * 进入单聊
+     */
     into_singleChatRoom: function (detail) {
         var my = wx.getStorageSync("myUsername");
         var nameList = {
@@ -382,7 +383,10 @@ Page({
         });
     },
 
-    //	群聊 和 聊天室 （两个概念）
+    /**
+     * 进入群聊
+     * 	群聊 和 聊天室 （两个概念）
+     */
     into_groupChatRoom: function (detail) {
         var my = wx.getStorageSync("myUsername");
         var nameList = {
@@ -395,6 +399,9 @@ Page({
         });
     },
 
+    /**
+     * 删除聊天
+     */
     del_chat: function (event) {
         let detail = event.currentTarget.dataset.item;
         let nameList;
@@ -431,6 +438,9 @@ Page({
         });
     },
 
+    /**
+     * 进入聊天界面（废弃）
+     */
     chatDetail: function (e) {
         let id = e.currentTarget.dataset.id;
         let name = e.currentTarget.dataset.name;

light-application-wx/pages/chat-room/chat-room.wxml

@@ -19,7 +19,7 @@
         <image src="{{imgPath}}/chat-group.png"></image>
         <text>群组</text>
     </view>
-    <view class="chat" wx:for="{{arr}}" wx:key="i" data-item="{{item}}" catchtap="into_chatRoom">
+    <view class="chat" wx:for="{{arr}}" wx:key="i" data-item="{{item}}" catchtap="into_chatRoom" bindlongtap="del_chat">
         <image class="photo" src="{{ (item.chatType == 'groupchat' || item.chatType == 'chatRoom') ? imgPath + '/chat-group2.png' : imgPath + '/chat-user.png'}}" mode="cover"></image>
         <view class="item-row">
             <text class="chat-name">{{(item.chatType == 'groupchat' || item.chatType == 'chatRoom' || item.groupName) ? item.groupName : item.username}}</text>

light-application-wx/pages/chat-room/chat-room.wxss

@@ -86,16 +86,16 @@
 
 .unread-num {
     background-color: #e95543;
-    width: 40rpx;
-    height: 40rpx;
-    border-radius: 20rpx;
-    text-align: center;
+    width: 50rpx;
+    height: 50rpx;
+    border-radius: 25rpx;
     color: white;
     position: absolute;
     right: 48rpx;
     margin-top: 50rpx;
-    box-sizing: border-box;
-    font-size: .8em;
+    font-size: .5em;
+    line-height: 50rpx;
+    text-align: center;
 }
 
 

light-application-wx/pages/light-map/light-map.js

@@ -169,7 +169,20 @@ Page({
 
     },
 
+    /**
+     * 点击地图隐藏底部用户信息块
+     */
+    mapTap: function () {
+        this.setData({
+            show: false
+        });
+    },
+
+    /**
+     * 点击其他用户定位
+     */
     markerTap: function (e) {
+        let that = this;
         console.info(e);
         let id = e.markerId;
 
@@ -178,6 +191,16 @@ Page({
             success: (res) => {
                 wx.hideLoading();
                 console.info(res);
+                if (res.data.code != 200) {
+                    util.toast(res.data.msg);
+                } else {
+                    that.setData({
+                        show: true,
+                        userPhoto: res.data.data.data.avatarurl,
+                        nickname: res.data.data.data.nickname,
+                        username: id,
+                    });
+                }
             }
         });
     },
@@ -227,7 +250,7 @@ Page({
             // 对成功的相关定义，sdk会将消息id登记到日志进行备份处理
             success: function () {
                 console.log('send room text success');
-                // disp.fire('em.chat.sendSuccess', id, 'location');
+                disp.fire('em.chat.sendSuccess', id, 'location');
             },
             // 对失败的相关定义，sdk会将消息id登记到日志进行备份处理
             fail: function () {
@@ -246,7 +269,9 @@ Page({
         let myName = wx.getStorageSync("myUsername");
         console.info(groupId, myName);
         let historyChatMsgs = wx.getStorageSync("rendered_" + groupId + myName) || [];
+        console.info('chatMsg:', historyChatMsgs);
         let chatMsg = wx.getStorageSync(groupId + myName) || [];
+        console.info('chatMsg:', chatMsg);
         chatMsg = historyChatMsgs.concat(chatMsg);
         if (!chatMsg.length) return;
         chatMsg = chatMsg.slice(-20);
@@ -271,6 +296,21 @@ Page({
                 markers: markerList,
             });
         }
+    },
+
+    /**
+     * 打开聊天
+     */
+    intoChatRoom: function () {
+        let that = this;
+        let myName = wx.getStorageSync("myUsername");
+        let nameInfo = {
+            myName: myName,
+            your: that.data.username.toString()
+        };
+        wx.navigateTo({
+            url: "../chat-detail/chat-detail?username=" + JSON.stringify(nameInfo)
+        });
     }
 
 })

light-application-wx/pages/light-map/light-map.wxml

@@ -1,20 +1,20 @@
 <!--pages/light-map/light-map.wxml-->
-<map id="map" longitude="{{longitude}}" latitude="{{latitude}}" scale="{{scale}}" show-location="true" markers="{{markers}}" bindmarkertap="markerTap"></map>
+<map id="map" longitude="{{longitude}}" latitude="{{latitude}}" scale="{{scale}}" show-location="true" markers="{{markers}}" bindtap="mapTap" bindmarkertap="markerTap"></map>
 
 <view class="bottom-card" wx:if="{{show}}">
     <view class="left">
-        <image class="user-photo" src="{{imgPath}}/map-user2.png"></image>
+        <image class="user-photo" src="{{userPhoto}}"></image>
         <view class="user-info">
-            <text class="username">{{username}}</text>
-            <text class="user-role">{{roleName}}</text>
+            <text class="username">{{nickname}}</text>
+            <text class="user-role" wx:if="{{showRole}}">{{roleName}}</text>
         </view>
     </view>
     <view class="right">
-        <view class="video-card" style="background-image: url({{imgPath}}/map-btn-bg1.png);">
+        <view class="video-card" style="background-image: url({{imgPath}}/map-btn-bg1.png);" wx:if="{{showVideo}}">
             <image class="video" src="{{imgPath}}/map-video.png"></image>
             <text>视频</text>
         </view>
-        <view class="message-card" style="background-image: url({{imgPath}}/map-btn-bg2.png);">
+        <view class="message-card" style="background-image: url({{imgPath}}/map-btn-bg2.png);" bindtap="intoChatRoom">
             <image class="message" src="{{imgPath}}/map-message.png"></image>
             <text>发消息</text>
         </view>

light-application-wx/pages/light-map/light-map.wxss

@@ -13,7 +13,7 @@
     border-top-right-radius: 40rpx;
     background-color: #FFFCF5;
     box-sizing: border-box;
-    padding: 30rpx;
+    padding: 30rpx 15rpx 22rpx 32rpx;
     display: inline-flex;
     flex-direction: row;
     justify-content: space-between;
@@ -30,6 +30,7 @@
     width: 86rpx;
     height: 86rpx;
     margin-right: 18rpx;
+    border-radius: 43rpx;
 }
 
 .user-info {
@@ -53,7 +54,7 @@
 }
 
 .right {
-    display: inline-flex;
+    display: flex;
     flex-direction: row;
     align-items: center;
 }