完成消息也websockt链接！

components/listItem/listItem.js

@@ -34,9 +34,9 @@ Component({
             type: String,
             value: "",
         },
-        customerId:{
-            type:Number,
-            value:null,
+        customerId: {
+            type: Number,
+            value: null,
         },
     },
 
@@ -58,8 +58,8 @@ Component({
             if (this.data.listClass == 'disabled-model-view') {
                 return
             }
-            let dataset = e.currentTarget.dataset;
-            this.triggerEvent('getItem', dataset.item);
+            let value = e.currentTarget.dataset.value;
+            this.triggerEvent('getItem', value);
         },
         // 进入个人主页
         goHomePage(e) {
@@ -88,7 +88,12 @@ Component({
                 url: "/pages/msgModule/wechat2/wechat2",
                 success: function (res) {
                     // 通过eventChannel向被打开页面传送数据
-                    res.eventChannel.emit('customerid', { customerid: item.customerId, businessCommunicationDemandId: item.businessCommunicationDemandId, chatHeads: item.chatHeads })
+                    res.eventChannel.emit('customerid', {
+                        customerid: item.customerId,
+                        businessCommunicationDemandId: item.businessCommunicationDemandId,
+                        chatHeads: item.chatHeads,
+                        info: item.info
+                    })
                 }
             })
         },

components/listItem/listItem.wxml

@@ -20,7 +20,7 @@
     </view>
     <!-- 内容 -->
     <view class="list-content">
-        <view bindtap="goDetails" data-item="{{ item }}">
+        <view bindtap="goDetails" data-value="{{ item.businessCommunicationDemandId }}">
             <!-- 详情 -->
             <view>
                 <text space class="list-details-text" user-select wx:if="{{ pageStatus == 'detatil' || pageStatus == 'myRelease' }}">{{ item.info }}

pages/index/components/listDetails/Details.js

@@ -9,7 +9,7 @@ Page({
      */
     data: {
         // 页面Loading
-        pageLoading: false,
+        pageLoading: true,
         customerId: null,
         // 路由接受的参数
         currentData: {},
@@ -27,31 +27,41 @@ Page({
         currentIndex: 0,
         // 当前登录器用户登录ID
         userCustomerId: null,
+        businessCommunicationDemandId: "",
     },
 
     /**
      * 生命周期函数--监听页面加载
      */
     onLoad(option) {
+        // console.log(option,`option触发--11`)
+        this.setData({
+            businessCommunicationDemandId: option.businessCommunicationDemandId
+        })
     },
     onShow() {
+        this.setData({
+            pageLoading: true,
+        })
         const businessCommunicationCustomer = wx.getStorageSync('businessCommunicationCustomer') || null;
         if (businessCommunicationCustomer) {
             this.setData({
-                userCustomerId:businessCommunicationCustomer.customerId
+                userCustomerId: businessCommunicationCustomer.customerId
             })
         }
-        const listDetail = wx.getStorageSync('listDetail') || null;
-        this.setData({
-            currentData: listDetail,
-            type: listDetail.type.join(),
-            pageLoading: true,
-        })
+        // const listDetail = wx.getStorageSync('listDetail') || null;
+        // this.setData({
+        //     currentData: listDetail,
+        //     type: listDetail.type.join(),
+        //     pageLoading: true,
+        // })
+        // 获取当前数据
+        this.getCurrentData();
         if (app.globalData.customerId) {
             this.setData({
                 customerId: app.globalData.customerId
             })
-            this.getIsCollect();
+            // this.getIsCollect();
         } else {
             this.getListData();
         }
@@ -59,18 +69,41 @@ Page({
     // 热门详情点击
     goDetails(e) {
         this.setData({
-            currentData: e.detail,
-            type: e.detail.type.join(),
+            currentData: null,
+            type: [],
             pageLoading: true,
             listData: [],
             page: 1,
             onRefresh: true,
             isCollect: false,
+            businessCommunicationDemandId:e.detail
         })
+        this.getCurrentData();
         wx.pageScrollTo({
             scrollTop: 0,
         });
-        this.getIsCollect();
+    },
+    getCurrentData() {
+        let { businessCommunicationDemandId } = this.data;
+        $request.get('/businessCommunicationDemand/getDemandByDemandId.action',
+            { demandId: businessCommunicationDemandId }
+        ).then(res => {
+            if (res.status == 0) {
+                let listDetail = res.data;
+                listDetail.createdOn = $util.formatTime(new Date(listDetail.createdOn), true);
+                listDetail.createdOn = listDetail.createdOn.replaceAll('/', '-');
+                if (typeof listDetail.type == 'string') {
+                    listDetail.type = listDetail.type.split(',');
+                }
+                this.setData({
+                    currentData: listDetail,
+                    type: listDetail.type,
+                })
+                this.getIsCollect();
+            }
+        }).catch(err => {
+            console.log(err, 'error appletLogin')
+        })
     },
     // 判断是否收藏
     getIsCollect() {
@@ -80,7 +113,8 @@ Page({
         ).then(res => {
             if (res.status == 0) {
                 this.setData({
-                    isCollect: res.data == 0 ? false : true
+                    isCollect: res.data == 0 ? false : true,
+                    pageLoading: true,
                 })
             }
             this.getListData();

pages/index/index.js

@@ -155,9 +155,8 @@ Page({
     },
     // 进入详情
     goDetails(e) {
-        wx.setStorageSync('listDetail', e.detail)
-        wx.navigateTo({
-            url: '/pages/index/components/listDetails/Details',
+        wx.reLaunch({
+            url: '/pages/index/components/listDetails/Details?businessCommunicationDemandId=' + e.detail,
         })
     },
     // 获取tab数据

pages/msgModule/index.js

@@ -21,12 +21,54 @@ Page({
       * 生命周期函数--监听页面加载
       */
     onLoad() {
-        
+        const businessCommunicationCustomer = wx.getStorageSync('businessCommunicationCustomer') || null;
+        if (businessCommunicationCustomer) {
+            this.setData({
+                customerId: businessCommunicationCustomer.customerId
+            })
+        }
+        // 初始化websocket
+        this.initWebSocket();
     },
-    onShow(){
-        // this.getMsgData();
+    onShow() {
+        // 初始化数据
         this.initData();
     },
+    //  websocket初始化
+    initWebSocket: function () {
+        var _this = this;
+        let { customerId } = _this.data;
+        // console.log()
+        //建立连接
+        wx.connectSocket({
+            url: `ws://192.168.18.138/webSocket/{"userno":${customerId},"messageModule":"010"}`,//本地
+            success: function () {
+                console.log('消息页-websocket连接成功~')
+            },
+            fail: function () {
+                console.log('消息页-websocket连接失败~')
+            },
+        })
+
+        //连接成功
+        wx.onSocketOpen(function () {
+            console.log('消息页-连接成功,真正的成功', 'onSocketOpen');
+        })
+
+        //  接收服务器的消息事件
+        wx.onSocketMessage(function (res) {
+            // 接收到的消息{date,message,type}  type类型为 1 是对方的消息 为 0 是自己的消息
+            console.log(res,'消息页----收到新消息')
+            _this.initData();
+        })
+
+        //  监听连接关闭
+        wx.onSocketClose(function () {
+            console.log('监听 WebSocket 连接关闭事件')
+        })
+
+    },
+    // 关闭顶部关注
     closeTopShow() {
         this.setData({
             topShow: false
@@ -44,10 +86,9 @@ Page({
             }
         })
     },
-    initData(){
+    initData() {
         this.setData({
-            pageLoading: true,
-            page:1,
+            page: 1,
             size: 10,
             msgData: [],
         })

pages/msgModule/wechat2/wechat2.js

@@ -26,7 +26,7 @@ Page({
         historyList: [],
         input: null,
         openid: null,
-        connectemoji: ["😘", "😡", "😔", "😄", "❤","😍","👼"],
+        connectemoji: ["😘", "😡", "😔", "😄", "❤", "😍", "👼", ""],
         emoji_list: ['emoji1i1', 'emoji2i2', 'emoji3i3', 'emoji4i4', 'emoji5i5'],
         emotionVisible: false,
         inputShowed: false,
@@ -44,22 +44,30 @@ Page({
         pageNo: 1,
         // 当前产品ID
         businessCommunicationDemandId: null,
+        // 当前产品详情
+        productInfo: null,
     },
 
     /**
     * 生命周期函数--监听页面加载
     */
-    onLoad: function (options) {
+    onLoad(options) {
         const eventChannel = this.getOpenerEventChannel()
         // 监听acceptDataFromOpenerPage事件，获取上一页面通过eventChannel传送到当前页面的数据
 
         eventChannel.on('customerid', data => {
+            let productInfo = data.info ? data.info : null;
+            let businessCommunicationDemandId = null;
+            if (data.businessCommunicationDemandId) {
+                businessCommunicationDemandId = data.businessCommunicationDemandId;
+            }
             this.setData({
                 sendMemberId: data.customerid,
-                businessCommunicationDemandId: data.businessCommunicationDemandId,
+                businessCommunicationDemandId,
                 receivebaseInfo: {
-                    avatar: data.chatHeads
-                }
+                    avatar: data.chatHeads,
+                },
+                productInfo
             })
 
             //  获取历史记录 
@@ -68,8 +76,7 @@ Page({
         let customerId = app.globalData.customerId;
         let sendAvatar = app.globalData.businessCommunicationCustomer.chatHeads;
         console.log(customerId, 'customerId');
-        var _this = this;
-        _this.setData({
+        this.setData({
             receiveMemberId: customerId,
             sendAvatar
         })
@@ -80,21 +87,21 @@ Page({
         this.setScrollHeight()
         // 初始化websocket
         this.initWebSocket()
-        //  页面进入滚动到底部
-        this.scrollBottom()
+        // setTimeout(() => {
+            
+        // }, 100);
     },
-
     /**
     * 生命周期函数--监听页面初次渲染完成
     */
     onReady: function () {
-
+        
     },
 
     //  websocket初始化
     initWebSocket: function () {
         var _this = this;
-        let { receiveMemberId, sendMemberId } = this.data;
+        let { receiveMemberId, sendMemberId } = _this.data;
         // console.log()
         //建立连接
         wx.connectSocket({
@@ -166,8 +173,7 @@ Page({
                 // 如果产品ID存在
                 console.log(businessCommunicationDemandId, '产品ID是否存在')
                 if (businessCommunicationDemandId) {
-                    // this.data.historyList
-                    if(historyList.length > 0){
+                    if (historyList.length > 0) {
                         for (let index = historyList.length - 1; index >= 0; index--) {
                             const element = historyList[index];
                             if (element.messageType == 1) {
@@ -178,11 +184,13 @@ Page({
                                 }
                             }
                         }
-                    }else{
+                    } else {
                         this.sendmsgApi("", 1);
                     }
                 }
             }
+            //  页面进入滚动到底部
+            this.scrollBottom()
         }).catch(err => {
             console.log(err)
         })
@@ -191,7 +199,10 @@ Page({
     // 滚动到底部
     scrollBottom: function () {
         var { newsList } = this.data
-        var scrollid = `scrollid${newsList.length - 1}`
+        var scrollid = `scrollid${newsList.length - 1}`;
+        if (newsList.length == 0) {
+            scrollid = "scrollid0"
+        }
         this.setData({
             scrollid
         })
@@ -205,7 +216,13 @@ Page({
             scrollHeight
         })
     },
-
+    // 进入详情
+    goDetails(e) {
+        let value = e.currentTarget.dataset.value;
+        wx.reLaunch({
+            url: '/pages/index/components/listDetails/Details?businessCommunicationDemandId=' + value,
+        })
+    },
     // 获取内存中聊天列表的用户信息
     getStorageBaseInfo: function () {
         //获取存储信息
@@ -221,34 +238,33 @@ Page({
 
     // 自定义下拉刷新
     refresh: function () {
-        // 下拉的实际操作
-        var pageNo = this.data.pageNo + 1
-        this.setData({
-            pageNo
-        })
-        if (this.timer) {
-            clearTimeout(this.timer)
-        }
-        this.timer = setTimeout(() => {
-            this.setData({
-                triggered: false
-            })
-            this.getHistory()
-        }, 2000)
+        // // 下拉的实际操作
+        // var pageNo = this.data.pageNo + 1
+        // this.setData({
+        //     pageNo
+        // })
+        // if (this.timer) {
+        //     clearTimeout(this.timer)
+        // }
+        // this.timer = setTimeout(() => {
+        //     this.setData({
+        //         triggered: false
+        //     })
+        //     this.getHistory()
+        // }, 2000)
     },
 
     /**
     * 生命周期函数--监听页面显示
     */
     onShow: function () {
-
     },
 
     /**
     * 生命周期函数--监听页面隐藏
     */
     onHide: function () {
-
+        
     },
 
     /**
@@ -301,28 +317,30 @@ Page({
         $request.post('/businessCommunicationDemand/addChatRecord.action', params).then(res => {
             console.log(`------------聊一聊保存记录-----------------`)
             console.log(res);
+            // 是由需求点击的聊一聊 保存完信息后需要再发送一条
+            if (msgType == 1) {
+                this.sendmsgApi("你好，我对这个需求很有兴趣，可以聊聊吗？", 0);
+            }
             console.log(`------------聊一聊保存记录-----------------`)
         }).catch(err => {
             console.log(err)
         })
-        // wx.sendSocketMessage({
-        //     data: _this.data.input,
-        //     success: (res) => {
-
-        //     },
-        //     fail: (err) => {
-        //         console.log('sendSocketMessage', '失败')
-        //     }
-        // })
         var list = [];
         list = this.data.newsList;
-        var temp = { 'message': this.data.input, 'date': utils.formatTime(new Date()), type: 0 };
+        var temp = { 'message': content, 'date': utils.formatTime(new Date()), type: 0 };
+        temp.date = temp.date.replaceAll('/', '-');
+        temp.messageType = msgType;
+        temp.transactionId = transactionId;
+        if (msgType == 1) {
+            temp.info = this.data.productInfo;
+        }
         list.push(temp);
         this.setData({
             newsList: list,
             input: null
         })
 
+        console.log(this.data.newsList, 'this.data.newsList')
         this.scrollBottom()
         //  表情选择隐藏
         this.setData({

pages/msgModule/wechat2/wechat2.wxml

@@ -1,71 +1,79 @@
 <!-- pages/wechat2/wechat2.wxml -->
 <view class='news'>
     <view class="historycon">
-        <!-- <scroll-view scroll-y="true" scroll-into-view="{{scrollid}}" scroll-with-animation="{{true}}" style="height:{{scrollHeight}}" class="history" refresher-enabled="true" bindrefresherrefresh="refresh" refresher-triggered="{{triggered}}"> -->
-        <!-- 历史记录部分start -->
-        <view wx:if="{{historyList.length > 0}}">
-            <view class="historyText">历史消息</view>
-            <block wx:for="{{historyList}}" wx:key="index">
+        <scroll-view scroll-y="{{ true }}" scroll-into-view="{{scrollid}}" scroll-with-animation="{{true}}" style="height:{{scrollHeight}}" class="history">
+            <!-- 历史记录部分start -->
+            <view wx:if="{{historyList.length > 0}}">
+                <view class="historyText">历史消息</view>
+                <block wx:for="{{historyList}}" wx:key="index">
+                    <!-- 此处为other -->
+                    <view wx:if="{{item.type==1 && item.messageType != 1}}" id="historyscrollid{{index}}">
+                        <view>
+                            <text class='chat-time' style="display:none;">{{item.date}}</text>
+                        </view>
+                        <view class='other-record'>
+                            <image class='other-head-img' src='{{item.senderHeadPortrait}}'></image>
+                            <view class='other-record-content-triangle'></view>
+                            <view class='other-record-content'>{{item.content}}</view>
+                        </view>
+                    </view>
+                    <!-- 此处为结尾 -->
+                    <!-- 此处为own -->
+                    <view id="historyscrollid{{index}}" wx:elif="{{item.type==0 && item.messageType != 1}}">
+                        <view>
+                            <text class='chat-time' style="display:none;">{{item.date}}</text>
+                        </view>
+                        <view class='own-record'>
+                            <view class='own-record-content'>{{item.content}}</view>
+                            <view class='own-record-content-triangle'></view>
+                            <image class='own-head-img' src='{{item.senderHeadPortrait}}'></image>
+                        </view>
+                    </view>
+                    <view wx:else class="product-item-view" bindtap="goDetails" data-value="{{ item.transactionId }}">
+                        <view class="content-view">
+                            <view class="product-info-item">{{ item.object.info }}</view>
+                            <view class="product-send-time">{{ item.date }} 由你发起沟通</view>
+                        </view>
+                    </view>
+                    <!-- own结尾 -->
+                </block>
+                <view class="historyText" id="lastHistoryText">以上为历史消息</view>
+            </view>
+            <!-- 历史记录部分end -->
+            <view wx:if="{{ newsList.length == 0}}" id="scrollid0"></view>
+            <block wx:for="{{newsList}}" wx:key="index">
                 <!-- 此处为other -->
-                <view wx:if="{{item.type==1 && item.messageType != 1}}" id="historyscrollid{{index}}">
+                <view wx:if="{{item.type==1 && item.messageType != 1}}" id="scrollid{{index}}">
                     <view>
                         <text class='chat-time' style="display:none;">{{item.date}}</text>
                     </view>
                     <view class='other-record'>
-                        <image class='other-head-img' src='{{item.senderHeadPortrait}}'></image>
+                        <image class='other-head-img' src='{{receivebaseInfo.avatar}}'></image>
                         <view class='other-record-content-triangle'></view>
-                        <view class='other-record-content'>{{item.content}}</view>
+                        <view class='other-record-content'>{{item.message}}</view>
                     </view>
                 </view>
                 <!-- 此处为结尾 -->
                 <!-- 此处为own -->
-                <view id="historyscrollid{{index}}" wx:elif="{{item.type==0 && item.messageType != 1}}">
+                <view id="scrollid{{index}}" wx:elif="{{item.type==0 && item.messageType != 1}}">
                     <view>
                         <text class='chat-time' style="display:none;">{{item.date}}</text>
                     </view>
                     <view class='own-record'>
-                        <view class='own-record-content'>{{item.content}}</view>
+                        <view class='own-record-content'>{{item.message}}</view>
                         <view class='own-record-content-triangle'></view>
-                        <image class='own-head-img' src='{{item.senderHeadPortrait}}'></image>
+                        <image class='own-head-img' src='{{sendAvatar}}'></image>
                     </view>
                 </view>
-                <view wx:else class="product-item-view">
+                <!-- own结尾 -->
+                <view wx:else class="product-item-view" bindtap="goDetails" data-value="{{ item.transactionId }}">
                     <view class="content-view">
-                        {{ item.object.info }} \ {{ item.date }}
+                        <view class="product-info-item">{{ item.info }}</view>
+                        <view class="product-send-time">{{ item.date }} 由你发起沟通</view>
                     </view>
                 </view>
-                <!-- own结尾 -->
             </block>
-            <view class="historyText">以上为历史消息</view>
-        </view>
-        <!-- 历史记录部分end -->
-        <block wx:for="{{newsList}}" wx:key="index">
-            <!-- 此处为other -->
-            <view wx:if="{{item.type==1}}" id="scrollid{{index}}">
-                <view>
-                    <text class='chat-time' style="display:none;">{{item.date}}</text>
-                </view>
-                <view class='other-record'>
-                    <image class='other-head-img' src='{{receivebaseInfo.avatar}}'></image>
-                    <view class='other-record-content-triangle'></view>
-                    <view class='other-record-content'>{{item.message}}</view>
-                </view>
-            </view>
-            <!-- 此处为结尾 -->
-            <!-- 此处为own -->
-            <view id="scrollid{{index}}" wx:else>
-                <view>
-                    <text class='chat-time' style="display:none;">{{item.date}}</text>
-                </view>
-                <view class='own-record'>
-                    <view class='own-record-content'>{{item.message}}</view>
-                    <view class='own-record-content-triangle'></view>
-                    <image class='own-head-img' src='{{sendAvatar}}'></image>
-                </view>
-            </view>
-            <!-- own结尾 -->
-        </block>
-        <!-- </scroll-view> -->
+        </scroll-view>
     </view>
 </view>
 <view class="sendmessage">

pages/msgModule/wechat2/wechat2.wxss

@@ -63,7 +63,7 @@ page {
 /* 聊天内容 */
 
 .news {
-    margin-top: 30px;
+    margin-top: 10px;
     text-align: center;
     margin-bottom: 98px;
 }
@@ -190,7 +190,7 @@ page {
     background-color: #fff;
     box-shadow: -2px 9px 21px 0px 
 		rgba(0, 0, 0, 0.05);
-    max-width: 180rpx;
+    max-width: 180px;
     border-radius: 8px;
     padding: 15rpx 20rpx;
     text-align: left;
@@ -227,7 +227,7 @@ page {
     background-color: #5e73e5;
 	box-shadow: -2px 9px 21px 0px 
 		rgba(0, 0, 0, 0.05);
-    max-width: 180rpx;
+    max-width: 180px;
     border-radius: 8px;
     padding: 15rpx 20rpx;
     color: #fff;
@@ -289,6 +289,7 @@ page {
 .product-item-view {
     width: 100%;
     margin-bottom: 15rpx;   
+    margin-top: 15rpx;   
     box-sizing: border-box;
     padding: 0 20rpx; 
 }
@@ -297,4 +298,29 @@ page {
     border-radius: 20rpx;
     box-shadow: -1px 3px 12px 4px 
 		rgba(186, 186, 186, 0.1);
+    position: relative;
+    left: -20rpx;    
+    box-sizing: border-box;
+}
+.product-item-view .product-info-item{
+    box-sizing: border-box;
+    padding: 30rpx;
+    border-bottom: 1px solid #eaedf4;
+    text-align: left;
+    word-break: break-all;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+    font-size: 26rpx;
+    color: #666;
+}
+.product-item-view .product-send-time{
+    box-sizing: border-box;
+    padding: 20rpx 30rpx;
+    color: #b3bfcb;
+    font-size: 24rpx;
+    color: #b3bfcb;
+    text-align: left;
 }

pages/myModule/components/myCollect/myCollect.js

@@ -65,9 +65,8 @@ Page({
 
     // 进入详情
     goDetails(e) {
-        wx.setStorageSync('listDetail', e.detail)
-        wx.navigateTo({
-            url: '/pages/index/components/listDetails/Details',
+        wx.reLaunch({
+            url: '/pages/index/components/listDetails/Details?businessCommunicationDemandId=' + e.detail,
         })
     },
     // 删除收藏

pages/releaseModule/index.js

@@ -115,15 +115,9 @@ Page({
                                 console.log('用户点击确定')
                             } else if (res1.cancel) { 
                                 let listDetail = res.data;
-                                if (typeof listDetail.type == 'string') {
-                                    listDetail.type = listDetail.type.split(',');
-                                    listDetail.createdOn = $util.formatTime(new Date(listDetail.createdOn), true);
-                                    listDetail.createdOn = listDetail.createdOn.replaceAll('/', '-');
-                                }
                                 that.clearData();
-                                wx.setStorageSync('listDetail', listDetail)
                                 wx.reLaunch({
-                                    url: '/pages/index/components/listDetails/Details',
+                                    url: '/pages/index/components/listDetails/Details?businessCommunicationDemandId=' + listDetail.businessCommunicationDemandId,
                                 })
                             }
                         }