1072 lines
		
	
	
		
			34 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
		
		
			
		
	
	
			1072 lines
		
	
	
		
			34 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
|   | <template> | |||
|  |   <div class="date-select"> | |||
|  |     <p>日期:2024-19-22</p> | |||
|  |     <van-icon name="arrow" @click="showCalendar = true"/> | |||
|  |   </div> | |||
|  |   <van-notice-bar | |||
|  |     left-icon="volume-o" | |||
|  |     mode="closeable" | |||
|  |     text="无论我们能活多久,我们能够享受的只有无法分割的此刻,此外别无其他。" | |||
|  |   /> | |||
|  |   <div class="interact-scroll" ref="container"> | |||
|  |     <div class="p20"> | |||
|  |       <div class="pulldown-wrapper"> | |||
|  |         <div v-if="hasNext"> | |||
|  |           <span>加载中...</span> | |||
|  |         </div> | |||
|  |         <div class="top-tip" v-else-if="!hasNext"> | |||
|  |           <span class="refresh-hook">暂无更多互动消息</span> | |||
|  |         </div> | |||
|  |       </div> | |||
|  |       <!-- isOpen 2: 不公开 1:公开 --> | |||
|  |       <ul class="interact-msg" ref="msgListRef"> | |||
|  |         <li | |||
|  |           v-for="(item) in informMsgList" | |||
|  |           :class="[ | |||
|  |             `li${item.id}`, | |||
|  |             item.phone === store.state.userInfo.account ? 'row-reverse' : '', | |||
|  |           ]" | |||
|  |           :key="item.id" | |||
|  |         > | |||
|  |           <div> | |||
|  |             <div class="chat-time" v-if="(isTg && item.tgChatTime) || (!isTg && item.chatTime)">{{ isTg ? item.tgChatTime : item.chatTime }}</div> | |||
|  |             <div | |||
|  |               :class="[ | |||
|  |                 'flex', | |||
|  |                 item.phone === store.state.userInfo.account ? 'row-reverse' : '', | |||
|  |               ]" | |||
|  |             > | |||
|  |               <div class="photo"> | |||
|  |                 <img | |||
|  |                   :src=" | |||
|  |                     item.advisorId | |||
|  |                       ? item.advisorBasic && item.advisorBasic.avatar | |||
|  |                         ? item.advisorBasic.avatar | |||
|  |                         : defaultPhoto | |||
|  |                       : item.userId | |||
|  |                       ? item.imgUrl | |||
|  |                       : tgDefaultPhoto | |||
|  |                   " | |||
|  |                   alt="" | |||
|  |                 /> | |||
|  |               </div> | |||
|  |               <div class="news-content-wrap"> | |||
|  |                 <div class="user-info"> | |||
|  |                   <h3> | |||
|  |                     {{ | |||
|  |                       item.userId | |||
|  |                         ? item.phone === store.state.userInfo.account | |||
|  |                           ? "我" | |||
|  |                           : detail.showNickname === 2 ? maskUserName(item.userName) : item.userName | |||
|  |                         : item.createUserVO ? item.createUserVO.name : item.advisorBasic?.showName | |||
|  |                     }} | |||
|  |                     <span v-if="item.advisorId">讲师</span> | |||
|  |                     <span v-else-if="item.createUserVO">助教</span> | |||
|  |                   </h3> | |||
|  |                 </div> | |||
|  |                 <div v-if="item.type === 1 && item.replyBasic"> | |||
|  |                   <div> | |||
|  |                     <div class="reply-content"> | |||
|  |                       <div class="reply"> | |||
|  |                         <span style="color: rgba(154, 164, 182, 1)">回复</span | |||
|  |                         ><label>{{ item.replyBasic.userId === store.state.userInfo.account | |||
|  |                             ? "我" : detail.showNickname === 2 ? maskUserName(item.replyBasic.userName) : item.replyBasic.userName }}:</label> | |||
|  |                         {{ item.content }} | |||
|  |                       </div> | |||
|  |                       <div class="reply" style="color: rgba(154, 164, 182, 1)"> | |||
|  |                         {{ item.replyBasic.userId === store.state.userInfo.account | |||
|  |                             ? "我" : detail.showNickname === 2 ? maskUserName(item.replyBasic.userName) : item.replyBasic.userName }}:{{ | |||
|  |                           item.replyBasic.content | |||
|  |                         }} | |||
|  |                       </div> | |||
|  |                     </div> | |||
|  |                     <div class="license">{{ item.advisorBasic?.name }}<i v-if="detail.advisorBasic.license">({{item.advisorBasic?.license}})</i></div> | |||
|  |                   </div> | |||
|  |                    | |||
|  |                 </div> | |||
|  |                 <div v-else-if="item.type === 1 && !item.replyBasic"> | |||
|  |                   <div> | |||
|  |                     <p class="text" v-if="!item.content.includes('upImg')"> | |||
|  |                       {{ item.content }} | |||
|  |                     </p> | |||
|  |                     <img | |||
|  |                       v-else | |||
|  |                       class="img" | |||
|  |                       @click="imagePreview(item.content.split('upImg-')[1])" | |||
|  |                       :src="item.content.split('upImg-')[1]" | |||
|  |                     /> | |||
|  |                   </div> | |||
|  |                 </div> | |||
|  |               </div> | |||
|  |             </div> | |||
|  |           </div> | |||
|  |         </li> | |||
|  |       </ul> | |||
|  |     </div> | |||
|  |   </div> | |||
|  |   <van-calendar v-model:show="showCalendar" /> | |||
|  |   <img class="refresh" src="@/assets/images/refresh.png"> | |||
|  | </template> | |||
|  | 
 | |||
|  | <script setup> | |||
|  | import { ref } from "vue" | |||
|  | import { useStore } from "vuex"; | |||
|  | import useChatData from "../hooks/useChatData"; | |||
|  | const store = useStore(); | |||
|  | const informMsgList = ref([ | |||
|  |             { | |||
|  |                 "advisorBasic": { | |||
|  |                     "avatar": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                     "deptName": "营业部3", | |||
|  |                     "id": 66, | |||
|  |                     "license": "sz232423423", | |||
|  |                     "name": "测测1", | |||
|  |                     "profile": "sdfsdfsdfsd", | |||
|  |                     "showName": "测测一", | |||
|  |                     "userId": 116 | |||
|  |                 }, | |||
|  |                 "advisorId": 66, | |||
|  |                 "content": "问卷1", | |||
|  |                 "createTime": "2025-01-24 15:20:52", | |||
|  |                 "createUserId": 116, | |||
|  |                 "createUserVO": { | |||
|  |                     "comId": null, | |||
|  |                     "comName": null, | |||
|  |                     "createTime": "2024-11-12 15:51:18", | |||
|  |                     "deptId": "2", | |||
|  |                     "deptName": null, | |||
|  |                     "id": 116, | |||
|  |                     "loginId": 116, | |||
|  |                     "mobile": null, | |||
|  |                     "name": "测测1", | |||
|  |                     "roleList": [], | |||
|  |                     "staffNo": null, | |||
|  |                     "status": 1, | |||
|  |                     "upId": null, | |||
|  |                     "userType": null | |||
|  |                 }, | |||
|  |                 "deleteTime": null, | |||
|  |                 "deleteUserId": null, | |||
|  |                 "id": 700418, | |||
|  |                 "imgUrl": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                 "isCurrentUser": null, | |||
|  |                 "isForbid": null, | |||
|  |                 "isOpen": null, | |||
|  |                 "messageCount": null, | |||
|  |                 "online": null, | |||
|  |                 "phone": null, | |||
|  |                 "productBasic": null, | |||
|  |                 "questionDesc": "", | |||
|  |                 "questionId": 617, | |||
|  |                 "replyBasic": null, | |||
|  |                 "replyId": null, | |||
|  |                 "status": 1, | |||
|  |                 "type": 11, | |||
|  |                 "userAdminVO": null, | |||
|  |                 "userId": null, | |||
|  |                 "userName": null, | |||
|  |                 "videoId": 21484 | |||
|  |             }, | |||
|  |             { | |||
|  |                 "advisorBasic": { | |||
|  |                     "avatar": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                     "deptName": "营业部3", | |||
|  |                     "id": 66, | |||
|  |                     "license": "sz232423423", | |||
|  |                     "name": "测测1", | |||
|  |                     "profile": "sdfsdfsdfsd", | |||
|  |                     "showName": "测测一", | |||
|  |                     "userId": 116 | |||
|  |                 }, | |||
|  |                 "advisorId": 66, | |||
|  |                 "content": "upImg-https://advisorimg.test.upchina.com/group1/M00/02/F9/rBAIx2eTPjaAFpSuAAH8dF_J2Lc574.png", | |||
|  |                 "createTime": "2025-01-24 15:16:10", | |||
|  |                 "createUserId": 116, | |||
|  |                 "createUserVO": { | |||
|  |                     "comId": null, | |||
|  |                     "comName": null, | |||
|  |                     "createTime": "2024-11-12 15:51:18", | |||
|  |                     "deptId": "2", | |||
|  |                     "deptName": null, | |||
|  |                     "id": 116, | |||
|  |                     "loginId": 116, | |||
|  |                     "mobile": null, | |||
|  |                     "name": "测测1", | |||
|  |                     "roleList": [], | |||
|  |                     "staffNo": null, | |||
|  |                     "status": 1, | |||
|  |                     "upId": null, | |||
|  |                     "userType": null | |||
|  |                 }, | |||
|  |                 "deleteTime": null, | |||
|  |                 "deleteUserId": null, | |||
|  |                 "id": 700415, | |||
|  |                 "imgUrl": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                 "isCurrentUser": null, | |||
|  |                 "isForbid": null, | |||
|  |                 "isOpen": null, | |||
|  |                 "messageCount": null, | |||
|  |                 "online": null, | |||
|  |                 "phone": null, | |||
|  |                 "productBasic": null, | |||
|  |                 "questionDesc": null, | |||
|  |                 "questionId": null, | |||
|  |                 "replyBasic": null, | |||
|  |                 "replyId": null, | |||
|  |                 "status": 1, | |||
|  |                 "type": 1, | |||
|  |                 "userAdminVO": null, | |||
|  |                 "userId": null, | |||
|  |                 "userName": null, | |||
|  |                 "videoId": 21484 | |||
|  |             }, | |||
|  |             { | |||
|  |                 "advisorBasic": { | |||
|  |                     "avatar": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                     "deptName": "营业部3", | |||
|  |                     "id": 66, | |||
|  |                     "license": "sz232423423", | |||
|  |                     "name": "测测1", | |||
|  |                     "profile": "sdfsdfsdfsd", | |||
|  |                     "showName": "测测一", | |||
|  |                     "userId": 116 | |||
|  |                 }, | |||
|  |                 "advisorId": 66, | |||
|  |                 "content": "阿事实上事实上事实上", | |||
|  |                 "createTime": "2025-01-24 15:16:02", | |||
|  |                 "createUserId": 116, | |||
|  |                 "createUserVO": { | |||
|  |                     "comId": null, | |||
|  |                     "comName": null, | |||
|  |                     "createTime": "2024-11-12 15:51:18", | |||
|  |                     "deptId": "2", | |||
|  |                     "deptName": null, | |||
|  |                     "id": 116, | |||
|  |                     "loginId": 116, | |||
|  |                     "mobile": null, | |||
|  |                     "name": "测测1", | |||
|  |                     "roleList": [], | |||
|  |                     "staffNo": null, | |||
|  |                     "status": 1, | |||
|  |                     "upId": null, | |||
|  |                     "userType": null | |||
|  |                 }, | |||
|  |                 "deleteTime": null, | |||
|  |                 "deleteUserId": null, | |||
|  |                 "id": 700414, | |||
|  |                 "imgUrl": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                 "isCurrentUser": null, | |||
|  |                 "isForbid": null, | |||
|  |                 "isOpen": null, | |||
|  |                 "messageCount": null, | |||
|  |                 "online": null, | |||
|  |                 "phone": null, | |||
|  |                 "productBasic": null, | |||
|  |                 "questionDesc": null, | |||
|  |                 "questionId": null, | |||
|  |                 "replyBasic": null, | |||
|  |                 "replyId": null, | |||
|  |                 "status": 1, | |||
|  |                 "type": 1, | |||
|  |                 "userAdminVO": null, | |||
|  |                 "userId": null, | |||
|  |                 "userName": null, | |||
|  |                 "videoId": 21484 | |||
|  |             }, | |||
|  |             { | |||
|  |                 "advisorBasic": { | |||
|  |                     "avatar": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                     "deptName": "营业部3", | |||
|  |                     "id": 66, | |||
|  |                     "license": "sz232423423", | |||
|  |                     "name": "测测1", | |||
|  |                     "profile": "sdfsdfsdfsd", | |||
|  |                     "showName": "测测一", | |||
|  |                     "userId": 116 | |||
|  |                 }, | |||
|  |                 "advisorId": 66, | |||
|  |                 "content": "产品1", | |||
|  |                 "createTime": "2025-01-24 15:15:08", | |||
|  |                 "createUserId": 116, | |||
|  |                 "createUserVO": { | |||
|  |                     "comId": null, | |||
|  |                     "comName": null, | |||
|  |                     "createTime": "2024-11-12 15:51:18", | |||
|  |                     "deptId": "2", | |||
|  |                     "deptName": null, | |||
|  |                     "id": 116, | |||
|  |                     "loginId": 116, | |||
|  |                     "mobile": null, | |||
|  |                     "name": "测测1", | |||
|  |                     "roleList": [], | |||
|  |                     "staffNo": null, | |||
|  |                     "status": 1, | |||
|  |                     "upId": null, | |||
|  |                     "userType": null | |||
|  |                 }, | |||
|  |                 "deleteTime": null, | |||
|  |                 "deleteUserId": null, | |||
|  |                 "id": 700413, | |||
|  |                 "imgUrl": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                 "isCurrentUser": null, | |||
|  |                 "isForbid": null, | |||
|  |                 "isOpen": null, | |||
|  |                 "messageCount": null, | |||
|  |                 "online": null, | |||
|  |                 "phone": null, | |||
|  |                 "productBasic": { | |||
|  |                     "authorityId": null, | |||
|  |                     "content": "三等奖付款时间打客服介绍上课的见风使舵看风使舵", | |||
|  |                     "id": 1, | |||
|  |                     "name": "产品1", | |||
|  |                     "productType": 111, | |||
|  |                     "typeLabel": null, | |||
|  |                     "url": "https://blog.csdn.net/weixin_45911857/article/details/132300931" | |||
|  |                 }, | |||
|  |                 "questionDesc": null, | |||
|  |                 "questionId": null, | |||
|  |                 "replyBasic": null, | |||
|  |                 "replyId": null, | |||
|  |                 "status": 1, | |||
|  |                 "type": 2, | |||
|  |                 "userAdminVO": null, | |||
|  |                 "userId": null, | |||
|  |                 "userName": null, | |||
|  |                 "videoId": 21484 | |||
|  |             }, | |||
|  |             { | |||
|  |                 "advisorBasic": { | |||
|  |                     "avatar": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                     "deptName": "营业部3", | |||
|  |                     "id": 66, | |||
|  |                     "license": "sz232423423", | |||
|  |                     "name": "测测1", | |||
|  |                     "profile": "sdfsdfsdfsd", | |||
|  |                     "showName": "测测一", | |||
|  |                     "userId": 116 | |||
|  |                 }, | |||
|  |                 "advisorId": 66, | |||
|  |                 "content": "十点多的点点滴滴滴答滴答", | |||
|  |                 "createTime": "2025-01-24 15:15:02", | |||
|  |                 "createUserId": 116, | |||
|  |                 "createUserVO": { | |||
|  |                     "comId": null, | |||
|  |                     "comName": null, | |||
|  |                     "createTime": "2024-11-12 15:51:18", | |||
|  |                     "deptId": "2", | |||
|  |                     "deptName": null, | |||
|  |                     "id": 116, | |||
|  |                     "loginId": 116, | |||
|  |                     "mobile": null, | |||
|  |                     "name": "测测1", | |||
|  |                     "roleList": [], | |||
|  |                     "staffNo": null, | |||
|  |                     "status": 1, | |||
|  |                     "upId": null, | |||
|  |                     "userType": null | |||
|  |                 }, | |||
|  |                 "deleteTime": null, | |||
|  |                 "deleteUserId": null, | |||
|  |                 "id": 700412, | |||
|  |                 "imgUrl": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                 "isCurrentUser": null, | |||
|  |                 "isForbid": null, | |||
|  |                 "isOpen": null, | |||
|  |                 "messageCount": null, | |||
|  |                 "online": null, | |||
|  |                 "phone": null, | |||
|  |                 "productBasic": null, | |||
|  |                 "questionDesc": null, | |||
|  |                 "questionId": null, | |||
|  |                 "replyBasic": null, | |||
|  |                 "replyId": null, | |||
|  |                 "status": 1, | |||
|  |                 "type": 1, | |||
|  |                 "userAdminVO": null, | |||
|  |                 "userId": null, | |||
|  |                 "userName": null, | |||
|  |                 "videoId": 21484 | |||
|  |             }, | |||
|  |             { | |||
|  |                 "advisorBasic": { | |||
|  |                     "avatar": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                     "deptName": "营业部3", | |||
|  |                     "id": 66, | |||
|  |                     "license": "sz232423423", | |||
|  |                     "name": "测测1", | |||
|  |                     "profile": "sdfsdfsdfsd", | |||
|  |                     "showName": "测测一", | |||
|  |                     "userId": 116 | |||
|  |                 }, | |||
|  |                 "advisorId": 66, | |||
|  |                 "content": "回复的是iOS发布的查看看安卓的显示是否自动显示", | |||
|  |                 "createTime": "2025-01-24 15:09:57", | |||
|  |                 "createUserId": 116, | |||
|  |                 "createUserVO": { | |||
|  |                     "comId": null, | |||
|  |                     "comName": null, | |||
|  |                     "createTime": "2024-11-12 15:51:18", | |||
|  |                     "deptId": "2", | |||
|  |                     "deptName": null, | |||
|  |                     "id": 116, | |||
|  |                     "loginId": 116, | |||
|  |                     "mobile": null, | |||
|  |                     "name": "测测1", | |||
|  |                     "roleList": [], | |||
|  |                     "staffNo": null, | |||
|  |                     "status": 1, | |||
|  |                     "upId": null, | |||
|  |                     "userType": null | |||
|  |                 }, | |||
|  |                 "deleteTime": null, | |||
|  |                 "deleteUserId": null, | |||
|  |                 "id": 700408, | |||
|  |                 "imgUrl": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                 "isCurrentUser": null, | |||
|  |                 "isForbid": null, | |||
|  |                 "isOpen": null, | |||
|  |                 "messageCount": null, | |||
|  |                 "online": null, | |||
|  |                 "phone": null, | |||
|  |                 "productBasic": null, | |||
|  |                 "questionDesc": null, | |||
|  |                 "questionId": null, | |||
|  |                 "replyBasic": { | |||
|  |                     "content": "哈哈白白净净斤斤计较", | |||
|  |                     "id": 700407, | |||
|  |                     "isOpen": 1, | |||
|  |                     "replyTime": "2025-01-24 15:09:21", | |||
|  |                     "userId": "up0206900", | |||
|  |                     "userName": "向日葵🌻" | |||
|  |                 }, | |||
|  |                 "replyId": 700407, | |||
|  |                 "status": 1, | |||
|  |                 "type": 1, | |||
|  |                 "userAdminVO": null, | |||
|  |                 "userId": null, | |||
|  |                 "userName": null, | |||
|  |                 "videoId": 21484 | |||
|  |             }, | |||
|  |             { | |||
|  |                 "advisorBasic": { | |||
|  |                     "avatar": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                     "deptName": "营业部3", | |||
|  |                     "id": 66, | |||
|  |                     "license": "sz232423423", | |||
|  |                     "name": "测测1", | |||
|  |                     "profile": "sdfsdfsdfsd", | |||
|  |                     "showName": "测测一", | |||
|  |                     "userId": 116 | |||
|  |                 }, | |||
|  |                 "advisorId": 66, | |||
|  |                 "content": "收到滴答滴答滴答滴答哒哒哒哒哒哒哒哒哒多大,手打付款时间打开福建师大开发机四大分三大发开始的福建省大多数咖啡机", | |||
|  |                 "createTime": "2025-01-24 15:08:58", | |||
|  |                 "createUserId": 116, | |||
|  |                 "createUserVO": { | |||
|  |                     "comId": null, | |||
|  |                     "comName": null, | |||
|  |                     "createTime": "2024-11-12 15:51:18", | |||
|  |                     "deptId": "2", | |||
|  |                     "deptName": null, | |||
|  |                     "id": 116, | |||
|  |                     "loginId": 116, | |||
|  |                     "mobile": null, | |||
|  |                     "name": "测测1", | |||
|  |                     "roleList": [], | |||
|  |                     "staffNo": null, | |||
|  |                     "status": 1, | |||
|  |                     "upId": null, | |||
|  |                     "userType": null | |||
|  |                 }, | |||
|  |                 "deleteTime": null, | |||
|  |                 "deleteUserId": null, | |||
|  |                 "id": 700406, | |||
|  |                 "imgUrl": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                 "isCurrentUser": null, | |||
|  |                 "isForbid": null, | |||
|  |                 "isOpen": null, | |||
|  |                 "messageCount": null, | |||
|  |                 "online": null, | |||
|  |                 "phone": null, | |||
|  |                 "productBasic": null, | |||
|  |                 "questionDesc": null, | |||
|  |                 "questionId": null, | |||
|  |                 "replyBasic": { | |||
|  |                     "content": "把喜不喜欢报道", | |||
|  |                     "id": 700405, | |||
|  |                     "isOpen": 1, | |||
|  |                     "replyTime": "2025-01-24 15:08:43", | |||
|  |                     "userId": "up0206900", | |||
|  |                     "userName": "向日葵🌻" | |||
|  |                 }, | |||
|  |                 "replyId": 700405, | |||
|  |                 "status": 1, | |||
|  |                 "type": 1, | |||
|  |                 "userAdminVO": null, | |||
|  |                 "userId": null, | |||
|  |                 "userName": null, | |||
|  |                 "videoId": 21484 | |||
|  |             }, | |||
|  |             { | |||
|  |                 "advisorBasic": { | |||
|  |                     "avatar": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                     "deptName": "营业部3", | |||
|  |                     "id": 66, | |||
|  |                     "license": "sz232423423", | |||
|  |                     "name": "测测1", | |||
|  |                     "profile": "sdfsdfsdfsd", | |||
|  |                     "showName": "测测一", | |||
|  |                     "userId": 116 | |||
|  |                 }, | |||
|  |                 "advisorId": 66, | |||
|  |                 "content": "回复三等奖防水防汗水电费还是洞口防护", | |||
|  |                 "createTime": "2025-01-24 15:08:22", | |||
|  |                 "createUserId": 116, | |||
|  |                 "createUserVO": { | |||
|  |                     "comId": null, | |||
|  |                     "comName": null, | |||
|  |                     "createTime": "2024-11-12 15:51:18", | |||
|  |                     "deptId": "2", | |||
|  |                     "deptName": null, | |||
|  |                     "id": 116, | |||
|  |                     "loginId": 116, | |||
|  |                     "mobile": null, | |||
|  |                     "name": "测测1", | |||
|  |                     "roleList": [], | |||
|  |                     "staffNo": null, | |||
|  |                     "status": 1, | |||
|  |                     "upId": null, | |||
|  |                     "userType": null | |||
|  |                 }, | |||
|  |                 "deleteTime": null, | |||
|  |                 "deleteUserId": null, | |||
|  |                 "id": 700403, | |||
|  |                 "imgUrl": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                 "isCurrentUser": null, | |||
|  |                 "isForbid": null, | |||
|  |                 "isOpen": null, | |||
|  |                 "messageCount": null, | |||
|  |                 "online": null, | |||
|  |                 "phone": null, | |||
|  |                 "productBasic": null, | |||
|  |                 "questionDesc": null, | |||
|  |                 "questionId": null, | |||
|  |                 "replyBasic": { | |||
|  |                     "content": "需要公开今生今世你说你睡觉", | |||
|  |                     "id": 700402, | |||
|  |                     "isOpen": 1, | |||
|  |                     "replyTime": "2025-01-24 15:05:51", | |||
|  |                     "userId": "up0206900", | |||
|  |                     "userName": "向日葵🌻" | |||
|  |                 }, | |||
|  |                 "replyId": 700402, | |||
|  |                 "status": 1, | |||
|  |                 "type": 1, | |||
|  |                 "userAdminVO": null, | |||
|  |                 "userId": null, | |||
|  |                 "userName": null, | |||
|  |                 "videoId": 21484 | |||
|  |             }, | |||
|  |             { | |||
|  |                 "advisorBasic": { | |||
|  |                     "avatar": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                     "deptName": "营业部3", | |||
|  |                     "id": 66, | |||
|  |                     "license": "sz232423423", | |||
|  |                     "name": "测测1", | |||
|  |                     "profile": "sdfsdfsdfsd", | |||
|  |                     "showName": "测测一", | |||
|  |                     "userId": 116 | |||
|  |                 }, | |||
|  |                 "advisorId": 66, | |||
|  |                 "content": "水电费水电费是的防守打法", | |||
|  |                 "createTime": "2025-01-24 15:01:29", | |||
|  |                 "createUserId": 116, | |||
|  |                 "createUserVO": { | |||
|  |                     "comId": null, | |||
|  |                     "comName": null, | |||
|  |                     "createTime": "2024-11-12 15:51:18", | |||
|  |                     "deptId": "2", | |||
|  |                     "deptName": null, | |||
|  |                     "id": 116, | |||
|  |                     "loginId": 116, | |||
|  |                     "mobile": null, | |||
|  |                     "name": "测测1", | |||
|  |                     "roleList": [], | |||
|  |                     "staffNo": null, | |||
|  |                     "status": 1, | |||
|  |                     "upId": null, | |||
|  |                     "userType": null | |||
|  |                 }, | |||
|  |                 "deleteTime": null, | |||
|  |                 "deleteUserId": null, | |||
|  |                 "id": 700395, | |||
|  |                 "imgUrl": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                 "isCurrentUser": null, | |||
|  |                 "isForbid": null, | |||
|  |                 "isOpen": null, | |||
|  |                 "messageCount": null, | |||
|  |                 "online": null, | |||
|  |                 "phone": null, | |||
|  |                 "productBasic": null, | |||
|  |                 "questionDesc": null, | |||
|  |                 "questionId": null, | |||
|  |                 "replyBasic": null, | |||
|  |                 "replyId": null, | |||
|  |                 "status": 1, | |||
|  |                 "type": 1, | |||
|  |                 "userAdminVO": null, | |||
|  |                 "userId": null, | |||
|  |                 "userName": null, | |||
|  |                 "videoId": 21484 | |||
|  |             }, | |||
|  |             { | |||
|  |                 "advisorBasic": { | |||
|  |                     "avatar": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                     "deptName": "营业部3", | |||
|  |                     "id": 66, | |||
|  |                     "license": "sz232423423", | |||
|  |                     "name": "测测1", | |||
|  |                     "profile": "sdfsdfsdfsd", | |||
|  |                     "showName": "测测一", | |||
|  |                     "userId": 116 | |||
|  |                 }, | |||
|  |                 "advisorId": 66, | |||
|  |                 "content": "水电费水电费水电费手动阀是打发水电费水电费水电费", | |||
|  |                 "createTime": "2025-01-24 15:01:00", | |||
|  |                 "createUserId": 116, | |||
|  |                 "createUserVO": { | |||
|  |                     "comId": null, | |||
|  |                     "comName": null, | |||
|  |                     "createTime": "2024-11-12 15:51:18", | |||
|  |                     "deptId": "2", | |||
|  |                     "deptName": null, | |||
|  |                     "id": 116, | |||
|  |                     "loginId": 116, | |||
|  |                     "mobile": null, | |||
|  |                     "name": "测测1", | |||
|  |                     "roleList": [], | |||
|  |                     "staffNo": null, | |||
|  |                     "status": 1, | |||
|  |                     "upId": null, | |||
|  |                     "userType": null | |||
|  |                 }, | |||
|  |                 "deleteTime": null, | |||
|  |                 "deleteUserId": null, | |||
|  |                 "id": 700394, | |||
|  |                 "imgUrl": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |                 "isCurrentUser": null, | |||
|  |                 "isForbid": null, | |||
|  |                 "isOpen": null, | |||
|  |                 "messageCount": null, | |||
|  |                 "online": null, | |||
|  |                 "phone": null, | |||
|  |                 "productBasic": null, | |||
|  |                 "questionDesc": null, | |||
|  |                 "questionId": null, | |||
|  |                 "replyBasic": null, | |||
|  |                 "replyId": null, | |||
|  |                 "status": 1, | |||
|  |                 "type": 1, | |||
|  |                 "userAdminVO": null, | |||
|  |                 "userId": null, | |||
|  |                 "userName": null, | |||
|  |                 "videoId": 21484 | |||
|  |             } | |||
|  |         ]) | |||
|  | const detail = ref({ | |||
|  |         "advisorBasic": { | |||
|  |             "avatar": "https://advisorimg.test.upchina.com/group1/M00/02/E5/rBAIx2czCRmAPCDfAAHFYtfoEBs588.png", | |||
|  |             "deptName": "营业部3", | |||
|  |             "id": 66, | |||
|  |             "license": "sz232423423", | |||
|  |             "name": "测测1", | |||
|  |             "profile": "sdfsdfsdfsd", | |||
|  |             "showName": "测测一", | |||
|  |             "userId": 116 | |||
|  |         }, | |||
|  |         "advisorId": 66, | |||
|  |         "auditTime": "2025-01-24 14:28:16", | |||
|  |         "authIds": [], | |||
|  |         "authResultVo": { | |||
|  |             "auth": true, | |||
|  |             "contractUrl": null, | |||
|  |             "riskUrl": null | |||
|  |         }, | |||
|  |         "authorityId": "", | |||
|  |         "createTime": "2025-01-24 14:28:02", | |||
|  |         "currentTime": "2025-01-31 19:37:20", | |||
|  |         "detail": "<p>详情水电费合适的尽快发货受打击发哈,阿是嘉华大厦接电话十九大三打哈,撒记得哈时间的哈时间段撒酒疯哈时间的哈数据库,撒即可哈就是的哈时间段</p>", | |||
|  |         "duration": 3467, | |||
|  |         "endTime": "2025-01-24 15:47:58", | |||
|  |         "exkey": null, | |||
|  |         "favorUserCount": 9, | |||
|  |         "guestInfo": null, | |||
|  |         "id": 21484, | |||
|  |         "imgUrl": "https://advisorimg.test.upchina.com/group1/M00/02/F9/rBAIx2eTMkCAC51tAAlK4YqQ09A911.png", | |||
|  |         "infoVO": null, | |||
|  |         "interactType": 1, | |||
|  |         "isCart": 1, | |||
|  |         "isDisplay": 1, | |||
|  |         "isFavor": 2, | |||
|  |         "isFinishRead": null, | |||
|  |         "isGenerateRecord": 1, | |||
|  |         "isSpeak": 1, | |||
|  |         "isSubAdvisor": 2, | |||
|  |         "isSubscribe": 2, | |||
|  |         "joinUserCount": 0, | |||
|  |         "libraryList": [ | |||
|  |             { | |||
|  |                 "duration": 3467, | |||
|  |                 "fileId": "1397757903546390815", | |||
|  |                 "id": 1208, | |||
|  |                 "liveIndex": 1, | |||
|  |                 "name": "测试1月24号横屏1", | |||
|  |                 "size": 1225081635, | |||
|  |                 "transStatus": 1 | |||
|  |             } | |||
|  |         ], | |||
|  |         "limitType": 1, | |||
|  |         "listCoverUrl": "https://advisorimg.test.upchina.com/group1/M00/02/F9/rBAIx2eTMoOAXV6EAAPlF6mEQcM893.png", | |||
|  |         "liveStatus": 4, | |||
|  |         "messageAudit": 2, | |||
|  |         "online": 1, | |||
|  |         "openQw": 1, | |||
|  |         "playStyle": 2, | |||
|  |         "playType": 1, | |||
|  |         "readCount": 57, | |||
|  |         "readDuration": null, | |||
|  |         "readUserCount": 0, | |||
|  |         "resizeUrl": "http://lczqvideodev.test.upchina.com/s/IuffWKn", | |||
|  |         "riskLevel": 2, | |||
|  |         "riskLevelLabel": "中低风险", | |||
|  |         "showNickname": 1, | |||
|  |         "size": null, | |||
|  |         "startTime": "2025-01-24 14:50:08", | |||
|  |         "status": 3, | |||
|  |         "subCount": 0, | |||
|  |         "subscribeUserCount": 2, | |||
|  |         "teacherId": 66, | |||
|  |         "title": "测试1月24号横屏1", | |||
|  |         "videoAuthId": null, | |||
|  |         "viewPoint": "看点圣诞节发货束带结发", | |||
|  |         "weight": 0 | |||
|  |     }) | |||
|  | const showCalendar =  ref(false) | |||
|  | const { msgListRef } = useChatData({id: 21484}); | |||
|  | </script> | |||
|  | <style scoped lang="scss"> | |||
|  | .interact-scroll { | |||
|  |   position: relative; | |||
|  |   overflow: hidden; | |||
|  |   text-align: left; | |||
|  |   height: 100%; | |||
|  |   box-sizing: border-box; | |||
|  |   background: #f5f6fa; | |||
|  |   .p20{ | |||
|  |     padding: 20px; | |||
|  |   } | |||
|  |   li { | |||
|  |     margin-bottom: 20px; | |||
|  |     .chat-time { | |||
|  |       color: #888; | |||
|  |       font-size: 24px; | |||
|  |       text-align: center; | |||
|  |     } | |||
|  |     .img { | |||
|  |       max-width: 100%; | |||
|  |       height: 200px; | |||
|  |     } | |||
|  |     .warn { | |||
|  |       text-align: center; | |||
|  |       color: #999; | |||
|  |       flex: 1; | |||
|  |       margin-bottom: 0; | |||
|  |     } | |||
|  |     .flex { | |||
|  |       display: flex; | |||
|  |     } | |||
|  |     .photo { | |||
|  |       margin-right: 20px; | |||
|  |       img { | |||
|  |         display: block; | |||
|  |         width: 88px; | |||
|  |         height: 88px; | |||
|  |         border-radius: 50%; | |||
|  |       } | |||
|  |     } | |||
|  |     .user-info { | |||
|  |       display: flex; | |||
|  |       align-items: center; | |||
|  |       h3 { | |||
|  |         display: flex; | |||
|  |         align-items: center; | |||
|  |         font-size: 28px; | |||
|  |         color: #1b2330; | |||
|  |         line-height: 28px; | |||
|  |         margin-bottom: 20px; | |||
|  |         span { | |||
|  |           color: #ff6f16; | |||
|  |           font-size: 22px; | |||
|  |           line-height: 22px; | |||
|  |           margin-left: 20px; | |||
|  |           border: 1px solid #ff3d36; | |||
|  |           padding: 6px 8px; | |||
|  |           border-radius: 8px; | |||
|  |         } | |||
|  |       } | |||
|  |     } | |||
|  |     .news-content-wrap { | |||
|  |       flex: 1; | |||
|  |       overflow: hidden; | |||
|  |       & > div { | |||
|  |         display: flex; | |||
|  |       } | |||
|  |       .align-center { | |||
|  |         align-items: center; | |||
|  |       } | |||
|  |     } | |||
|  |   } | |||
|  |   li:last-child{ | |||
|  |     margin-bottom: 0; | |||
|  |   } | |||
|  |   .row-reverse { | |||
|  |     justify-content: space-between; | |||
|  |     flex-flow: row-reverse; | |||
|  |     .user-info, | |||
|  |     h3 { | |||
|  |       justify-content: space-between; | |||
|  |       flex-flow: row-reverse; | |||
|  |     } | |||
|  |     .photo { | |||
|  |       margin-right: 0; | |||
|  |       margin-left: 20px; | |||
|  |     } | |||
|  |     h3 { | |||
|  |       span { | |||
|  |         margin-left: 0; | |||
|  |         margin-right: 20px; | |||
|  |       } | |||
|  |     } | |||
|  |     .reply-content, | |||
|  |     .text { | |||
|  |       background: #2e78fa; | |||
|  |       color: #fff; | |||
|  |     } | |||
|  |     .reply-content, | |||
|  |     .text, | |||
|  |     & > img, | |||
|  |     .share-tip { | |||
|  |       border-radius: 20px 4px 20px 20px; | |||
|  |     } | |||
|  |     .news-content-wrap > div { | |||
|  |       flex-flow: row-reverse; | |||
|  |     } | |||
|  |   } | |||
|  |   li > div { | |||
|  |     font-size: 24px; | |||
|  |     font-weight: 500; | |||
|  |     letter-spacing: 0; | |||
|  |     text-align: left; | |||
|  |     color: #1b2330; | |||
|  |     margin-bottom: 12px; | |||
|  |     .question-item, | |||
|  |     .product-item { | |||
|  |       display: block; | |||
|  |       p { | |||
|  |         background: none; | |||
|  |         padding-left: 0; | |||
|  |         padding-top: 0; | |||
|  |       } | |||
|  |     } | |||
|  |     label { | |||
|  |       color: #2e78fa; | |||
|  |     } | |||
|  |   } | |||
|  |   p, | |||
|  |   .reply-content { | |||
|  |     padding: 16px 24px; | |||
|  |     background: #fff; | |||
|  |     border-radius: 4px 20px 20px 20px; | |||
|  |     font-size: 26px; | |||
|  |     color: #606877; | |||
|  |     text-align: justify; | |||
|  |     line-height: 30px; | |||
|  |   } | |||
|  |   .license{ | |||
|  |     padding:0; | |||
|  |     color: #c6c7c9; | |||
|  |     line-height: 24px; | |||
|  |     font-size: 24px; | |||
|  |     border-radius: 0 20px 0 20px; | |||
|  |     margin: 12px 0 1px 1px; | |||
|  |   } | |||
|  |   .reply { | |||
|  |     line-height: 40px; | |||
|  |     margin-right: 10px; | |||
|  |   } | |||
|  |   button { | |||
|  |     height: 44px; | |||
|  |     line-height: 44px; | |||
|  |     border: none; | |||
|  |     border-radius: 20px; | |||
|  |     background-color: rgba(154, 164, 182, 0.1); | |||
|  |     background-repeat: no-repeat; | |||
|  |     background-position: left 10px center; | |||
|  |     background-size: 20px auto; | |||
|  |     padding-left: 32px; | |||
|  |     font-size: 24px; | |||
|  |     padding: 0 20px 0 30px; | |||
|  |     &.share { | |||
|  |       color: #ff3d36; | |||
|  |       background-image: url(../../../assets/images/share-icon2.png); | |||
|  |     } | |||
|  |     &.attention { | |||
|  |       color: #ff7d26; | |||
|  |       background-image: url(../../../assets/images/attention.png); | |||
|  |     } | |||
|  |   } | |||
|  | } | |||
|  | 
 | |||
|  | .pulldown-wrapper { | |||
|  |   position: absolute; | |||
|  |   width: 100%; | |||
|  |   padding: 20px; | |||
|  |   box-sizing: border-box; | |||
|  |   transform: translateY(-100%) translateZ(0); | |||
|  |   text-align: center; | |||
|  |   color: #999; | |||
|  |   font-size: 24px; | |||
|  | } | |||
|  | .product-item { | |||
|  |   .item-wrap { | |||
|  |     width: 600px; | |||
|  |   } | |||
|  | } | |||
|  | .question { | |||
|  |   width: 600px; | |||
|  |   background: #fff; | |||
|  |   border-radius: 8px; | |||
|  |   color: #000; | |||
|  |   padding: 16px; | |||
|  |   box-sizing: border-box; | |||
|  |   background: url(../../../assets/images/chat/question-bg.png) no-repeat center; | |||
|  |   background-size: 100% 100%; | |||
|  |   height: 174px; | |||
|  |   box-sizing: border-box; | |||
|  |   h5 { | |||
|  |     font-size: 28px; | |||
|  |     margin-bottom: 20px; | |||
|  |     color: #1e3566; | |||
|  |     overflow: hidden; | |||
|  |     text-overflow: ellipsis; | |||
|  |     white-space: nowrap; | |||
|  |   } | |||
|  |   span { | |||
|  |     color: #8ea4b6; | |||
|  |     font-size: 24px; | |||
|  |     line-height: 36px; | |||
|  |     overflow: hidden; | |||
|  |     text-overflow: ellipsis; | |||
|  |     white-space: nowrap; | |||
|  |     display: block; | |||
|  |   } | |||
|  | } | |||
|  | .hp { | |||
|  |   ::v-deep .item-wrap, | |||
|  |   .question { | |||
|  |     height: 140px; | |||
|  |   } | |||
|  |   .question { | |||
|  |     h5 { | |||
|  |       margin-bottom: 8px; | |||
|  |     } | |||
|  |   } | |||
|  |   ::v-deep .item-wrap { | |||
|  |     padding: 16px; | |||
|  |     h4 { | |||
|  |       margin-bottom: 0; | |||
|  |     } | |||
|  |     .intro { | |||
|  |       line-height: 1.2em; | |||
|  |     } | |||
|  |   } | |||
|  | } | |||
|  | .product-float { | |||
|  |   position: absolute; | |||
|  |   left: 0; | |||
|  |   bottom: 0; | |||
|  |   width: 470px; | |||
|  |   height: 180px; | |||
|  |   ::v-deep .item-wrap { | |||
|  |     background: url(../../../assets/images/chat/product-float-bg.png) no-repeat | |||
|  |       center; | |||
|  |     background-size: 100% 100%; | |||
|  |   } | |||
|  |   img { | |||
|  |     display: block; | |||
|  |     position: absolute; | |||
|  |     width: 24px; | |||
|  |     height: 24px; | |||
|  |     right: 20px; | |||
|  |     top: 20px; | |||
|  |   } | |||
|  | } | |||
|  | @media screen and (min-width: 480px) { | |||
|  |   .interact-scroll .question { | |||
|  |     height: 230px !important; | |||
|  |     padding: 20px 30px; | |||
|  |     h5 { | |||
|  |       line-height: 50px !important; | |||
|  |     } | |||
|  |   } | |||
|  |   .hp .question { | |||
|  |     height: 200px !important; | |||
|  |     padding: 20px 20px; | |||
|  |   } | |||
|  |   .interact-scroll h4 { | |||
|  |     line-height: 48px !important; | |||
|  |   } | |||
|  |   .hp ::v-deep .item-wrap { | |||
|  |     height: 170px !important; | |||
|  |     h4, | |||
|  |     p { | |||
|  |       line-height: 50px; | |||
|  |     } | |||
|  |   } | |||
|  | } | |||
|  | .new-msg-tip{ | |||
|  |   position: absolute; | |||
|  |   left: 0; | |||
|  |   bottom: 0px; | |||
|  |   color: #2e78fa; | |||
|  |   background: #fff; | |||
|  |   border: 1px solid rgba(204,204,204,0.2); | |||
|  |   font-size: 24px; | |||
|  |   padding: 8px 12px; | |||
|  |   border-radius: 20px; | |||
|  | } | |||
|  | .refresh{ | |||
|  |   position: fixed; | |||
|  |   right: 24px; | |||
|  |   bottom: 180px; | |||
|  |   width: 64px; | |||
|  | } | |||
|  | .date-select{ | |||
|  |   display: flex; | |||
|  |   justify-content: space-between; | |||
|  |   font-size: 28px; | |||
|  |   padding: 20px; | |||
|  | } | |||
|  | .van-notice-bar{ | |||
|  |   position: absolute; | |||
|  |   top: 156px; | |||
|  |   left:0; | |||
|  |   right:0; | |||
|  |   font-size: 24px; | |||
|  |   line-height: 48px; | |||
|  |   height: 48px; | |||
|  |   z-index: 2; | |||
|  | } | |||
|  | </style> |