yql/pages/chat/message.vue

<template>

	<view class="page" :style="{overflow: 'hidden','--custom-font-size': custom_font_size+'px'}">
		<!-- #ifdef APP-PLUS -->
		<serving-view :list_id="list_id" @setState="setSeringState" :show="showServing" :state="servingState"
			@closeServing="showServing = false" ref="serving"></serving-view>
		<!-- #endif -->
		<view class="page-content">
			<view class="gong-gao-content" v-if="msgList.type == 1">
				<view class="member-image-logo">
					<view class="member-content" v-for="(item,i) in memberPhotos" :key="i">
						<image class="img-logo" :src="staticPhoto+ item.photo" @tap="toUserDetail(item)"></image>
					</view>
					<view class="jiazai" v-if="memberPhotos.length >=5" @tap="group_info">
						<image src="/static/theme/default/jiazai.png"></image>
					</view>
				</view>
				<view class="gong-gao-content-info" v-if="0">
					<view class="iconfont-im icon-gonggao gong-gao-content-info-icon"></view>
					<text-scroll :text="notice" ref="scrollNotice"></text-scroll>
				</view>
				<!--<view class="member-image-logo">-->
				<!--<image src="https://im.smiaoshen.com/static/photo/default_man/300.jpg"></image>-->
				<!--</view>-->
			</view>

			<view class="content">

				<scroll-view class="msg-list" :style="{height:scrollHeight}" scroll-y="true"
					:scroll-with-animation="scrollAnimation" :scroll-into-view="scrollToView"
					@scrolltoupper="loadHistory" :upper-threshold="30" id="scrollview" :scroll-top="scrollTop"
					@scroll="scrollEven" @touchstart="hideDrawer(3)">
					<!--<view class="loading"-->
					<!--v-if="isHistoryLoading">-->
					<!--<view class="spinner">-->
					<!--<view class="rect1"></view>-->
					<!--<view class="rect2"></view>-->
					<!--<view class="rect3"></view>-->
					<!--<view class="rect4"></view>-->
					<!--<view class="rect5"></view>-->
					<!--</view>-->
					<!--</view>-->

					<uni-load-more status="noMore" v-if="noMore && !(isHistoryLoading)" />

					<view class="row" v-for="(row,index) in msgList.list" :key="index" :id="'msg' + row.msg.id">

						<!-- 系统消息 -->
						<block v-if="row.type==1">
							<view :class="['system',msgList.type == 1 && index == 0 ? 'sys':'']"
								:style="{padding:'10upx 0',marginBottom:'10upx'}">

								<!-- 文字消息-->
								<view v-if="row.msg.type==0 && row.msg.content && row.msg.content.text" class="text">
									{{row.msg.content.text}}
								</view>
								<!-- 领取红包消息 -->
								<view v-if="row.msg.type==5" class="red-envelope" style="letter-spacing:4upx;">
									<image src="/static/img/red-envelope-chat.png" :lazy-load="true" />
									<!-- {{row.msg}} -->
									<block
										v-if="row.msg.content.rid_user_id == my_data.id && row.msg.content.user_id == my_data.id">
										我领取了自己发出的
									</block>
									<block
										v-else-if="row.msg.content.rid_user_id != my_data.id && row.msg.content.user_id == my_data.id">
										我领取了{{row.msg.content.rid_nickname}}发出的
									</block>
									<block
										v-else-if="row.msg.content.rid_user_id == my_data.id && row.msg.content.user_id != my_data.id">
										{{row.msg.content.nickname}}领取了我发出的
									</block>
									<block v-else>
										{{row.msg.content.nickname}}领取了{{row.msg.content.rid_nickname}}发出的
									</block>
									<text style="color: red;" @tap="toDetails(row.msg.content.rid)">红包</text>
								</view>
							</view>
						</block>

						<block
							v-if="row.type == 0 && (index == 0 || (row.msg.time - msgList.list[index - 1].msg.time > 300))">
							<view class="system" style="margin-bottom: 10upx">
								<!-- 文字消息 -->
								<view class="text" style="color: #ffffff;border-radius:12px;font-weight:600">
									{{ timestampFormat(row.msg.time + '') }}
								</view>
							</view>
						</block>

						<!-- 用户消息 -->
						<block v-if="row.type==0">
							<!-- 自己发出的消息 -->
							<view class="my" v-if="row.msg.user_info.uid == my_data.id ">
								<!-- 左-消息 -->
								<view class="left"
									@longtap="msgAction(row.msg.id +'',row.msg.user_info.uid + '',row.msg.content,row.msg.type)"
									:id="row.msg.id">
									<image v-if="row.msg.time<=nowReadTime" src="/static/img/read.png" mode="widthFix"
										style="width: 30upx;margin-right: 10upx;"></image>
									<image v-else src="/static/img/unread.png" mode="widthFix"
										style="width: 30upx;margin-right: 10upx;">
									</image>
									<!-- 文字消息 非图片-->
									<view v-if="row.msg.type==0 && !isImage(row.msg.content.text)" class="bubble">
										<rich-text :nodes="row.msg.content.text ? getHtml(row.msg.content.text) : ' '"
											space="true" selectable="true" />
									</view>
									<!-- 文字消息 图片链接 -->
									<view v-if="row.msg.type==0 && isImage(row.msg.content.text)" class="bubble"
										@tap="showPic2(row.msg.content.text)">
										<image :src="row.msg.content.text" :style="{'width':'200px','height':'200px'}"
											mode="widthFix" :lazy-load="true" />
									</view>
									<!-- 语言消息 -->
									<view v-if="row.msg.type==1" class="bubble voice" @tap="playVoice(row.msg)"
										:class="playMsgid == row.msg.id?'play':''">
										<view class="length">{{row.msg.content.length}}</view>
										<view class="icon my-voice"></view>
									</view>
									<!-- 图片消息 -->
									<view v-if="row.msg.type==2" class="bubble img" @tap="showPic1(row.msg)">
										<image :src="(staticPath + list_id + '/' + row.msg.content.url)"
											:style="{'width': row.msg.content.w+'px','height': row.msg.content.h+'px'}"
											mode="widthFix" :lazy-load="true" />
									</view>
									<!-- 视频消息 -->
									<view v-if="row.msg.type==3" class="bubble img">
										<image :src=" staticPath + row.msg.content.full_movie"
											style="width: 320px;height: 240px">
										</image>
										<image class="bubble-bofang" src="/static/theme/default/my/bofang.png"
											style="width: 50px;height: 50px;" @tap="autoVideo(row.msg)"></image>
									</view>
									<!-- 红包 -->
									<view v-if="row.msg.type==5" class="bubble red-envelope"
										@tap="openRedEnvelope(row.msg,index)">
										<image src="/static/img/red-envelope.png" :lazy-load="true"
											:style="{'opacity':(receive_list.indexOf(row.msg.content.rid))< 0 ? 1 : 0.6}">
										</image>
										<view class="tis">
											{{(receive_list.indexOf(row.msg.content.rid)) <0?'恭喜发财，大吉大利':'已领取'}}
										</view>
										<view class="blessing">
											<view class="info">
												{{row.msg.content.blessing}}
											</view>
											<view class="has-get-red">
												点击打开红包
											</view>
											<!--{{row.msg.content.blessing}}-->
										</view>
									</view>
									<!-- 在线视频 -->
									<view v-if="row.msg.type==6" class="bubble">

										<view> {{row.msg.content.text}}
										</view>
										<text style="margin-left:2px" class="iconfont-im">&#xe619;
										</text>
									</view>
									<!-- 在线音频-->
									<view v-if="row.msg.type==7" class="bubble">
										<view> {{row.msg.content.text}}
										</view>
										<text style="margin-left:2px" class="iconfonts">&#xe60b;
										</text>
									</view>
									<!--卡片-->
									<view v-if="row.msg.type==8" class="send-card" @tap="getCard(row.msg)">
										<view class="send-card-content">
											<image :src="staticPhoto+row.msg.content.face" :lazy-load="true"
												style="width: 85upx;height: 85upx;"></image>
											<text>{{row.msg.content.nickname}}</text>
										</view>
										<view class="send-card-content-text">
											<text>名片</text>
										</view>
									</view>
									<!--戳一戳-->
									<view v-if="row.msg.type==9" class="bubble img">
										<image src="/static/theme/default/chuoyichuo.gif" :lazy-load="true"
											style="height: 70px;width: 130px;" mode="heightFix" />
									</view>
									<!-- 位置-->
									<view v-if="row.msg.type==10" class="bubble" @tap="openMap(row.msg.content)">
										<view class="address-flex">
											<view class="address-name">
												<text>{{row.msg.content && row.msg.content.name}}</text>
												<text
													class="text-gray">{{row.msg.content && row.msg.content.address}}</text>
											</view>
											<image class="fun-icon" src="../../static/theme/default/position.png"
												mode="widthFix"></image>
										</view>
									</view>
									<!-- 文件 -->
									<view v-if="row.msg.type==11" class="bubble"
										@tap="downFile(staticPath+ list_id+'/' + row.msg.content.url)">
										<view class="address-flex">
											<view class="address-name">
												<text>{{row.msg.content && row.msg.content.name}}</text>
												<text
													class="text-gray">{{row.msg.content && row.msg.content.length}}kb</text>
											</view>
											<image class="fun-icon" src="../../static/theme/default/file.png"
												mode="widthFix"></image>
										</view>
									</view>

								</view>
								<!-- 右-头像 -->
								<view class="right" @tap="goDetails(row.msg.user_info.uid,row)">
									<image
										:src="(row.msg.is_niming == 1) ? '/static/theme/default/my/niming.png' : myPhoto"
										:lazy-load="true" style="border-radius: 10px;" @error="imageError2" />
								</view>
							</view>

							<!-- 别人发出的消息 -->
							<view class="other" v-if="row.msg.user_info.uid != my_data.id">
								<!-- 左-头像 -->
								<view class="left">
									<image @longtap="showAction(row)" @tap="goDetails(row.msg.user_info.uid,row)"
										:src="(row.msg.is_niming == 1)? '/static/theme/default/my/niming.png' : (staticPhoto + row.msg.user_info.face)"
										:lazy-load="true" style="border-radius: 10px;" :data-id="index"
										@error="imageError" class="u-logo"/>
									<view class="action" v-if="row.showAction">
										<view class="action-item" @click="addFriendChat(row)">
											@TA
										</view>
										<view class="action-line">

										</view>
										<view class="action-item" @click="selectMember(row)">
											禁言
										</view>
										<view class="action-line">

										</view>
										<view class="action-item" @click="selectRemoveMember(row)">
											踢出
										</view>

									</view>
								</view>
								<!-- 右-用户名称-时间-消息 -->
								<view class="right"
									@longtap="msgAction(row.msg.id +'',row.msg.user_info.uid + '',row.msg.content,row.msg.type)">
									<!-- <view class="username">
                                                      <view class="name">{{row.msg.user_info.username}}</view> <view class="time">{{row.msg.time}}</view>
                                                  </view> -->
									<!-- 文字消息 -->
									<view v-if="row.msg.type==0 && !isImage(row.msg.content.text)" class="bubble">
										<rich-text :nodes="row.msg.content.text ? getHtml(row.msg.content.text) : ' '"
											space="true" />
									</view>
									<!-- 文字消息 图片链接 -->
									<view v-if="row.msg.type==0 && isImage(row.msg.content.text)" class="bubble"
										@tap="showPic2(row.msg.content.text)">
										<image :src="row.msg.content.text" :style="{'width':'200px','height':'auto'}"
											mode="widthFix" :lazy-load="true" />
									</view>
									<!-- 语音消息 -->
									<view v-if="row.msg.type==1" class="bubble voice" @tap="playVoice(row.msg)"
										:class="playMsgid == row.msg.id?'play':''">
										<view class="icon other-voice"></view>
										<view class="length">{{row.msg.content.length}}</view>
									</view>
									<!-- 图片消息 -->
									<view v-if="row.msg.type==2" class="bubble img" @tap="showPic1(row.msg)">
										<image :src="(staticPath + list_id + '/' + row.msg.content.url)"
											:style="{'width': row.msg.content.w+'px','height': row.msg.content.h+'px'}"
											mode="widthFix" :lazy-load="true" />
									</view>
									<!-- 视频消息 -->
									<view v-if="row.msg.type==3" class="bubble img">
										<image :src="staticPath + row.msg.content.full_movie"
											style="width: 320px;height: 240px"></image>
										<image class="bubble-bofang-left" src="/static/theme/default/my/bofang.png"
											style="width: 50px;height: 50px;" @tap="autoVideo(row.msg)"></image>
									</view>
									<!-- 红包 -->
									<view v-if="row.msg.type==5" class="bubble red-envelope"
										@tap="openRedEnvelope(row.msg,index)">
										<image src="/static/img/red-envelope-o.png" :lazy-load="true"
											:style="{'opacity':(receive_list.indexOf(row.msg.content.rid))< 0 ? 1 : 0.6}">
										</image>
										<view class="tis">
											{{(receive_list.indexOf(row.msg.content.rid)) <0?'恭喜发财，大吉大利':'已领取'}}
										</view>
										<view class="blessing">
											<view class="info">
												{{row.msg.content.blessing}}
											</view>
											<view class="has-get-red">
												点击打开红包
											</view>
											<!--{{row.msg.content.blessing}}-->
										</view>
									</view>
									<view v-if="row.msg.type==6" class="bubble">
										<text style="margin-right:2px" class="iconfont-im">&#xe619;
										</text>
										{{row.msg.content.text}}

									</view>
									<view v-if="row.msg.type==7" class="bubble">
										<text style="margin-right:2px" class="iconfonts">&#xe60b;
										</text>
										{{row.msg.content.text}}
									</view>
									<view v-if="row.msg.type==8" class="send-card" @tap="getCard(row.msg)">
										<view class="send-card-content">
											<image :src="staticPhoto+row.msg.content.face" :lazy-load="true"
												style="width: 85upx;height: 85upx;"></image>
											<text>{{row.msg.content.nickname}}</text>
										</view>
										<view class="send-card-content-text">
											<text>名片</text>
										</view>
									</view>
									<!-- 戳一戳 -->
									<view v-if="row.msg.type==9" class="bubble img" @tap="showPic(row.msg)">
										<image src="/static/theme/default/youchuo.gif" :lazy-load="true"
											style="width: 70px;height: 70px;" />
									</view>
									<!-- 位置-->
									<view v-if="row.msg.type==10" class="bubble" @tap="openMap(row.msg.content)">
										<view class="address-flex">
											<view class="address-name">
												<text>{{row.msg.content && row.msg.content.name}}</text>
												<text
													class="text-gray">{{row.msg.content && row.msg.content.address}}</text>
											</view>
											<image class="fun-icon" src="../../static/theme/default/position.png"
												mode="widthFix"></image>
										</view>
									</view>
									<!-- 文件 -->
									<view v-if="row.msg.type==11" class="bubble"
										@tap="downFile(staticPath+ list_id+'/' + row.msg.content.url)">
										<view class="address-flex">
											<view class="address-name">
												<text>{{row.msg.content && row.msg.content.name}}</text>
												<text
													class="text-gray">{{row.msg.content && row.msg.content.length}}kb</text>
											</view>
											<image class="fun-icon" src="../../static/theme/default/file.png"
												mode="widthFix"></image>
										</view>
									</view>
								</view>
							</view>
						</block>
					</view>
				</scroll-view>
			</view>
			<!-- 抽屉栏 -->
			<view class="popup-layer" :class="popupLayerClass" @touchmove.stop.prevent="discard">
				<!-- 表情 -->
				<swiper class="emoji-swiper" :class="{hidden:hideEmoji}" :indicator-dots="true" duration="150">
					<swiper-item v-for="(page,pid) in emojiList" :key="pid">
						<view v-for="(em,eid) in page" :key="eid" @tap="addEmoji(em)">
							<image :src="'/static/img/emoji/' + em.url" :lazy-load="true" />
						</view>
					</swiper-item>
				</swiper>
				<!-- 更多功能 相册-拍照-红包 -->
				<swiper class="more-layer" style="height:50vw" :indicator-dots="true" indicator-active-color="#51c9c3"
					:class="{hidden:hideMore || !hideEmoji}" duration="150">
					<swiper-item>
						<view class="list">
							<!-- <view class="list-box" @tap="videoCall(1)" v-if="msgList.type == 0">
								<image class="fun-icon" src="../../static/theme/default/message/concat.png"
									mode="heightFix">
									<view class="tool_text">视频通话</view>
							</view> -->
							<!-- <view class="list-box" @tap="videoCall(2)" v-if="msgList.type == 0">
								<image class="fun-icon" src="../../static/theme/default/message/voice.png"
									mode="heightFix">
									<view class="tool_text">语音通话</view>
							</view> -->
							
							<view class="list-box" @tap="chooseImage">
								<image class="fun-icon" src="../../static/theme/default/Image.png" mode="heightFix">
								</image>
								<view class="tool_text">相册</view>
							</view>

							<view class="list-box" @tap="camera">
								<image class="fun-icon" src="../../static/theme/default/shooting_icon.png"
									mode="heightFix">
								</image>
								<view class="tool_text">拍摄</view>
							</view>

<!-- 							<view class="list-box" @tap="video">
								<image class="fun-icon" src="../../static/theme/default/message/video.png"
									mode="heightFix">
								</image>
								<view class="tool_text">视频</view>
							</view>

							<view class="list-box" @tap="handRedEnvelopes">
								<image class="fun-icon" src="../../static/theme/default/envelope_icon.png"
									mode="heightFix">
								</image>
								<view class="tool_text">红包</view>
							</view> -->
							<view class="list-box" @tap="video">
								<image class="fun-icon" src="../../static/theme/default/message/video.png"
									mode="heightFix">
								</image>
								<view class="tool_text">视频</view>
							</view>
							<view class="list-box" @tap="handRedEnvelopes">
								<image class="fun-icon" src="../../static/theme/default/envelope_icon.png"
									mode="heightFix">
								</image>
								<view class="tool_text">红包</view>
							</view>
						</view>
						<view class="list" style="margin-top: 8upx;">
							
							
							
							
							<view class="list-box" @tap="chooseChuo">
								<image class="fun-icon" src="../../static/theme/default/tool_icon.png" mode="heightFix">
								</image>
								<view class="tool_text">戳一戳</view>
							</view>
							
							<view class="list-box" @tap="sendPos">
								<image class="fun-icon" src="../../static/theme/default/location_icon.png"
									mode="heightFix">
								</image>
								<view class="tool_text2">位置</view>
							</view>

<!-- 							<view class="list-box" @tap="videoCall(1)" v-if="msgList.type == 0">
								<image class="fun-icon" src="../../static/theme/default/message/concat.png"
									mode="heightFix">
									<view class="tool_text">视频通话</view>
							</view>
							<view class="list-box" @tap="videoCall(2)" v-if="msgList.type == 0">
								<image class="fun-icon" src="../../static/theme/default/message/voice.png"
									mode="heightFix">
									<view class="tool_text">语音通话</view>
							</view> -->

							<view class="list-box" @tap="sayCall()" v-if="msgList.type == 1 && 0">
								<text class="iconfont-im icon-niming" style="font-size:50upx;">
								</text>
								<view class="tool_text">{{niming_msg}}</view>
							</view>
							<view class="list-box" @tap="zhendong" v-if="msgList.type == 1  && is_main">
								<view class="iconfont-im icon-zhendong"></view>
								<view class="tool_text2">振动</view>
							</view>
							<view class="list-box" @tap="showQiang()"
								v-if="msgList.type == 1 && vendor_status && is_main">
								<text class="iconfont-im icon-qiang" style="font-size:50upx;">
								</text>
								<view class="tool_text">发包</view>
							</view>
							<view class="list-box" @tap="chooseCard">
								<image class="fun-icon" src="../../static/theme/default/contact_icon.png"
									mode="heightFix">
								</image>
								<view class="tool_text2">名片</view>
							</view>
							<view class="list-box" @tap="chooseLike">
								<image class="fun-icon" src="../../static/theme/default/collection_icon.png"
									mode="heightFix">
								</image>
								<view class="tool_text">收藏</view>
							</view>
						</view>
					</swiper-item>
					<swiper-item>
						<view class="list">
							
							<view class="list-box" @tap="chooseFile">
								<image class="fun-icon" src="../../static/theme/default/file_icon.png" mode="heightFix">
								</image>
								<view class="tool_text">文件</view>
							</view>
						</view>
					</swiper-item>
				</swiper>
			</view>

			<view class="input-box" v-if="msgList.is_msg">
				<view
					style="text-align: center !important;width:750upx;line-height: 100upx;border-top: #c9c9c9 solid 2upx;">
					全员禁言中...
				</view>
			</view>

			<!-- @touchmove.stop.prevent="discard" -->

			<!-- 底部输入栏 -->
			<view class="input-box" :class="popupLayerClass" v-else>

				<!-- H5下不能录音，输入栏布局改动一下 -->
				<!-- #ifndef H5 -->
				<view class="voice">
					<view class="icon" :class="isVoice?'jianpan':'yuyin'" @tap="switchVoice"></view>
				</view>
				<!-- #endif -->

				<!-- #ifdef H5 -->
				<view class="more" @tap="showMore">
					<view class="icon add"></view>
				</view>
				<!-- #endif -->

				<view class="textbox">
					<view class="voice-mode" :class="[isVoice?'':'hidden',recording?'recording':'']"
						@touchstart="voiceBegin" @touchmove.stop.prevent="voiceIng" @touchend="voiceEnd"
						@touchcancel="voiceCancel">
						{{voiceTis}}
					</view>
					<view class="text-mode" :class="isVoice?'hidden':''">

						<view class="box">
							<textarea auto-height="true" confirm-type="search" @confirm="sendText" @input="inputText"
								:value="textMsg" @focus="textareaFocus" :maxlength="-1" :show-confirm-bar="false"
								style="max-height: 190upx;overflow:auto;border: 1px solid black; border-radius: 17px;padding-top: 4px;padding-bottom: 4px; " />
						</view>

						<view class="em" @tap="chooseEmoji">
							<view class="icon biaoqing"></view>
						</view>
					</view>
				</view>

				<!-- #ifndef H5 -->
				<view :class="iconShow" @tap="showMore">
					<view class="icon add"></view>
				</view>
				<!-- #endif -->

				<view class="send" :class="sendMsgClass" @tap="sendText">

					<view class="btn">发送</view>
				</view>
			</view>


		</view>

		<view v-show="showVedio" class="showVedio">
			<!-- <video :src="videoPath"
             style="height: 100%;width: 100%"
             id="myVideo"
             object-fit="fill"
             airplay="allow" /> -->
			<video autoplay="true" object-fit="fill" page-gesture="true" controls="false"
				style="height: 100%;width: 100%" id="myVideo" :src="videoPath" @error="videoErrorCallback">
				<!-- <cover-view
                    @tap="showVedio = false"> -->
				<cover-image @tap="showVedio = false" src="/static/theme/default/my/close.png" class="cloneBut">
				</cover-image>
				<!-- </cover-view> -->
			</video>
		</view>


		<!-- #ifndef H5 -->
		<!-- 录音UI效果 -->
		<view class="record" :class="recording?'':'hidden'">
			<view class="ing" :class="willStop?'hidden':''">
				<view class="icon luyin2"></view>
			</view>
			<view class="cancel" :class="willStop?'':'hidden'">
				<view class="icon chehui"></view>
			</view>
			<view class="tis" :class="willStop?'change':''">{{recordTis}}</view>
		</view>
		<!-- #endif -->

		<!-- 红包弹窗 -->
		<view class="windows" :class="windowsState">
			<!-- 遮罩层 -->
			<view class="mask" @touchmove.stop.prevent="discard" @tap="closeRedEnvelope"></view>
			<view class="layer" @touchmove.stop.prevent="discard">
				<view class="open-redenvelope">
					<view class="top">
						<view class="close-btn">
							<view class="icon close" @tap="closeRedEnvelope"></view>
						</view>
						<image :src="staticPhoto+redenvelopeData.face" :lazy-load="true"></image>
					</view>
					<view class="from">来自{{redenvelopeData.from}}的红包</view>
					<view class="blessing">{{redenvelopeData.blessing}}</view>
					<view class="money" @tap="openRed(redenvelopeData)">

						<image :class="luckbtn" src="/static/theme/default/my/red_2.png"
							style="width: 180upx; height: 180upx;">
						</image>
					</view>
					<view class="showDetails" @tap="toDetails(redenvelopeData.rid)">
						查看领取详情
						<view class="icon to"></view>
					</view>
				</view>
			</view>
		</view>
		<uni-popup ref="popup2" :show="videPoup" position="bottom" mode="666">
			<view class="video-but-view">
				<button class="video-but" type="primary" @tap="videoBut('video')" :loading="videoLoading">视频聊天</button>
				<button class="video-but" type="primary" @tap="videoBut('voice')" :loading="voiceLoading">语音聊天</button>
				<button type="default" @click="videPoup=false">取消</button>
			</view>
		</uni-popup>
		<uni-popup ref="popup" type="confirm">
			<uni-popup-confirm title="温馨提示" :content="popuMsg" @confirm="confirm"> </uni-popup-confirm>
		</uni-popup>
		<uni-popup ref="qiang" type="qiang">
			<uni-popup-qiang title="开启发包" :status="miaoqiang + ''" :content="popuMsg" @confirm="goQiang">
			</uni-popup-qiang>
		</uni-popup>
		<!-- 上传文件 -->
		<nk-select-file v-model="showUploadFile" @confirm="uploadAFile"></nk-select-file>
		<uni-popup ref="popup_friends" type="bottom">
			<view class="popup_friends" :style="{height:popHeight+'px'}">
				<view class="popup_friends-top">

				</view>
				<select-friend :list_id="list_id" @close="closeFriends">
				</select-friend>
			</view>
		</uni-popup>
	</view>
</template>
<script>
	import uniLoadMore from "../../components/uni-ui/uni-load-more/uni-load-more.vue";
	import emoj_data from "../../static/js/message/emoji_data.js";
	import _get from "../../common/_get";
	import _hook from "../../common/_hook";
	import _action from "../../common/_action";
	import _data from "../../common/_data";
	import htmlParser from "../../common/html-parser";
	import uniPopup from "../../components/uni-popup/uni-popup.vue";
	import uniPopupConfirm from "../../components/uni-popup/uni-popup-confirm.vue";
	import uniPopupQiang from "../../components/uni-popup/uni-popup-qiang.vue";
	import textScroll from "../../components/textScroll/textScroll.vue";
	import nkSelectFile from "@/components/nk-select-file/nk-select-file.vue";
	import {
		mapState,
		mapMutations
	} from "vuex";

	import selectFriend from "./select_friend.vue";

	import {
		genTestUserSig
	} from "@/debug/GenerateTestUserSig.js";

	export default {
		components: {
			uniLoadMore,
			uniPopup,
			uniPopupConfirm,
			uniPopupQiang,
			textScroll,
			nkSelectFile,
			selectFriend,
		},
		data() {
			return {
				servingState: 3,
				onLine: false,
				showServing: false,
				memberPhotos: [],
				is_main: 0,
				nowReadTime: 1635013026,
				redTimer: null,
				notice: "",
				scrollInfo: {
					input_box_height1: 0,
					input_box_height2: 0,
					totall_height: 0,
				},
				scrollHeight: "0px",
				niming_msg: "匿名",
				videoContext: null,
				videoPath: "",
				showVedio: false,
				receive_list: [],
				luckbtn: "",
				scrollTop: 0,
				chat_id: "",
				//文字消息
				videPoup: false,
				videPlay: false,
				voiceLoading: false,
				videoLoading: false,
				textMsg: "",
				//消息列表
				isHistoryLoading: false,
				scrollAnimation: false,
				scrollToView: "",
				msgList: {
					show_name: "",
					list: [],
					type: 0,
					is_msg: 0,
					is_action: 0,
				},
				msgImgList: [],
				noMore: 0,

				isVoice: false,
				voiceTis: "按住 说话",
				recordTis: "手指上滑 取消发送",
				recording: false,
				willStop: false,
				initPoint: {
					identifier: 0,
					Y: 0,
				},
				recordTimer: null,
				recordLength: 0,
				// #ifdef APP-PLUS
				// call: uni.requireNativePlugin("TUICallingUniPlugin-TUICallingModule"),
				// call: uni.requireNativePlugin('TencentCloud-TUICallKit'),
				// #endif
				playMsgid: null,
				VoiceTimer: null,
				// 抽屉参数
				popupLayerClass: "",
				// more参数
				hideMore: true,
				//表情定义
				hideEmoji: true,
				emojiList: emoj_data.emoji_list,

				//表情图片图床名称 ，由于我上传的第三方图床名称会有改变，所以有此数据来做对应，您实际应用中应该不需要
				//onlineEmoji: emoj_data.online_emoji,

				//红包相关参数
				windowsState: "",
				redenvelopeData: {
					rid: null, //红包ID
					from: null,
					face: null,
					blessing: null,
					money: null,
					index: null,
				},
				list_id: 0,
				my_data: {},
				style: {
					pageHeight: 0,
					contentViewHeight: 0,
					footViewHeight: 90,
					mitemHeight: 0,
				},
				call_ret: false,
				my_photo: "",
				callType: 1, //默认视频,
				popuMsg: "",
				payTimer: false,
				type: "",
				Keyboard: 0,
				miaoqiang: 0,
				vendor_status: 0,
				doubleClick: false,
				doubleTime: {
					firstTime: "",
					towTime: "",
					flag: true,
					timer: null,
				},
				group_state: null,
				isOnline: 2, // （0表示离线，1表示在线）
				showUploadFile: false, //上传文件

				send_user_id: "", //@好友的信息

				popHeight: "", //todo弹出选择好友高度

				members: [], //群成员
			};
		},
		onBackPress(options) {
			console.log(options);
			uni.navigateTo({
				url: "/pages/chat/index",
			});
			return false;
		},
		onLoad(option) {
			// 监听语音视频通话事件
			// #ifdef APP-PLUS
			// uni.$TUICallingEvent.addEventListener("onCallStart", (data) => {
			// 	console.log("onCallStart" + JSON.stringify(data));
			// 	console.log("onCallStart" + data.roomID);
			// });
			// uni.$TUICallingEvent.addEventListener("onCallEnd", (data) => {
			// 	console.log("onCallEnd" + JSON.stringify(data));
			// 	data.time = data.totalTime;
			// 	// _get.cancelCall(data, function(res) {});
			// });
			// uni.$TUICallingEvent.addEventListener("onCallSucceed", (data) => {
			// 	console.log("onCallSucceed" + JSON.stringify(data));
			// });
			// uni.$TUICallingEvent.addEventListener("onCallFailed", (data) => {
			// 	console.log("onCallFailed" + JSON.stringify(data));
			// 	data.time = data.totalTime;
			// 	// _get.cancelCall(data, function(res) {});
			// });
			// #endif

			this.list_id = option.list_id;
			if ("chat_id" in option) {
				this.chat_id = option.chat_id;
			}
			if ("trans" in option) {
				uni.showToast({
					title: "转发成功",
					icon: "none",
					ducation: 2000,
				});
			}
			//注册事件
			// 注册发送音频事件
			this.regOnStartEvent((e) => {
				this.recordBegin(e);
			});
			// 注册发送音频事件
			this.regSendVoiceEvent((e) => {
				this.recordEnd(e);
			});

			// 注册发送音频事件
			this.regVudioEndEvent((e) => {
				this.playMsgid = null;
			});
			// //语音自然播放结束
			// this.AUDIO.onEnded((res) => {
			//   this.playMsgid = null;
			// });
			//
			// // #ifndef H5
			// //录音开始事件
			// this.RECORDER.onStart((e) => {
			//   this.recordBegin(e);
			// })
			// //录音结束事件
			// this.RECORDER.onStop((e) => {
			//   this.recordEnd(e);
			// })
			// //#endif
		},
		onUnload() {
			/** 这里只保留最新的15条会话记录，以保证初次加载性能 */
			let _this = this;
			let chat_data = this.msgList;
			chat_data.list = chat_data.list.slice(-15);
			_data.localData(this.list_id, chat_data);
			/** 去除当前会话的list_id */
			_data.localData("message_list_id", "");
			/** 暂停语音播放 */
			// this.AUDIO.pause();
			/** 移除监听事件 */
			uni.$off("data_chat_data_unshift");
			uni.$off("data_chat_data_push");
			uni.$off("data_chat_data");
			uni.$off("data_user_info");
			uni.$off("data_chat_data_delete");
			uni.$off("update_text_msg");
			uni.$off("memberJoinRoom");
			uni.$off("closeVoiceRoom");
			clearInterval(_this.timer);
			clearInterval(_this.redTimer);

			if (_data.data("voice_room_type")) {
				_this.$refs.serving.xiaMai(_this.list_id);
			} else {
				_this.$refs.serving && _this.$refs.serving.closeVoiceRoom();
			}
		},
		mounted() {
			let _this = this;
			if (this.chat_id) {
				this.$nextTick(() => {
					this.scrollToView = "msg" + this.chat_id;
				});
			}
			setTimeout(function() {
				_this.getScrollContentHeight("hide", 0);
			}, 400);
		},
		created() {},

		onShow() {
			this.initData();
		},
		computed: {
			...mapState({
				RECORD: (state) => state.audio.RECORD,
				AUDIO: (state) => state.audio.AUDIO,
				RecordTime: (state) => state.audio.RecordTime,
				KeyboardH: (state) => state.common.KeyboardHeight,
				custom_font_size: (state) => state.common.custom_font_size,
			}),
			getServingText() {
				return _data.data("dragInfo").state == 1 ? "下麦" : "上麦";
			},
			myPhoto() {
				return this.my_photo;
			},
			imgRan() {
				return Math.random();
			},
			staticPath() {
				return _data.staticChat();
			},
			staticVideoImg() {
				return _data.staticVideoImg();
			},
			staticPhoto() {
				return _data.staticPhoto();
			},
			sendMsgClass() {
				// #ifdef H5
				return this.isVoice ? "hidden" : "";
				// #endif
				return (this.isVoice ? "hidden" : "") || this.textMsg.length ?
					"" :
					"hidden";
			},
			iconShow() {
				return this.textMsg.length ? "hidden" : "more";
			},
			systemClass() {
				return this.msgList.type == 1 ? "sys" : "";
			},
		},
		onReady: function(res) {
			let _this = this;
			if (_this.msgList.type == 1) {
				// setTimeout(function () {
				//   _this.$refs.scrollNotice.textScroll()
				// },300);
			}
		},
		methods: {
			...mapMutations([
				"regSendVoiceEvent",
				"regOnStartEvent",
				"regVudioEndEvent",
			]),
			// 消息是否是图片
			isImage(con) {
				// console.log("con",con);
				// 如果是图片，则转换成图片
				let reg =
					/^https?:\/\/(.+\/)+.+(\.(gif|png|jpg|jpeg|webp|svg|psd|bmp|tif))$/i;
				let reg2 = RegExp(/data:image\/.*;base64,/);
				if (reg.test(con) || reg2.test(con)) {
					return true;
				} else {
					return false;
				}
			},
			// 选择要禁言的人
			selectMember(row) {
				console.log("row", row);
				let user_id = row.msg.user_info.uid + "";
				if (user_id) {
					let i = this.members.indexOf(user_id);
					if (i > -1) {
						this.members.splice(i, 1);
					} else {
						this.members.push(user_id);
					}
				}
				let _this = this;
				_this.$httpSend({
					path: "/im/message/setGroupAdmin",
					data: {
						users: JSON.stringify(_this.members),
						list_id: _this.list_id,
						type: 2,
					},
					success_action: true,
					success(res) {
						row.showAction = false;
						_this.$forceUpdate();
						// 禁言
						uni.showToast({
							title: res.msg,
							duration: 2000,
						});
					},
				});
			},
			// 选择要剔出的人
			selectRemoveMember(row) {
				console.log("row", row);
				let user_id = row.msg.user_info.uid;
				if (user_id) {
					let i = this.members.indexOf(user_id);
					if (i > -1) {
						this.members.splice(i, 1);
					} else {
						this.members.push(user_id);
					}
				}
				let _this = this;
				_this.$httpSend({
					path: "/im/message/removeChat",
					data: {
						users: JSON.stringify(_this.members),
						list_id: _this.list_id,
					},
					success_action: true,
					success(res) {
						row.showAction = false;
						_this.$forceUpdate();
						uni.showToast({
							title: res.msg,
							duration: 2000,
							icon: "none",
						});
					},
				});
			},
			// 所有群成员
			getGroupMembers(row) {
				let _this = this;
				_this.$httpSend({
					path: "/im/message/getGroupAdmin",
					data: {
						list_id: this.list_id,
						type: 2,
					},
					success(data) {
						_this.members = data.user_ids;
						console.log("_this.members", _this.members);
						row.showAction = true;
						_this.$forceUpdate();
					},
				});
			},
			// todo 长按显示面板
			showAction(row) {
				this.msgList.list.map((item) => {
					item.showAction = false;
				});
				this.getGroupMembers(row);
			},
			// todo 长按头像@好友
			addFriendChat(msg) {
				msg.showAction = false;
				this.textMsg = this.textMsg + "@" + msg.msg.user_info.name + " ";
				if (!this.send_user_id) {
					this.send_user_id = msg.msg.user_info.uid;
				} else {
					this.send_user_id = this.send_user_id + "," + msg.msg.user_info.uid;
				}
			},
			closeFriends() {
				this.$refs.popup_friends.close();
			},
			// 初始化数据
			initData() {
				_hook.routeSonHook();
				_get.getUserInfo({});
				// todo 选择@好友高度
				this.popHeight = uni.getSystemInfoSync().windowHeight;

				let _this = this;
				/** 先移除监听事件（避免重复触发消息） */
				uni.$off("remove_member");
				uni.$off("group_delete_chat");
				uni.$off("chat_del");
				uni.$off("data_chat_data_unshift");
				uni.$off("data_chat_data_push");
				uni.$off("data_chat_data");
				uni.$off("data_user_info");
				uni.$off("data_chat_data_delete");
				uni.$off("update_text_msg");
				uni.$off("memberJoinRoom");
				uni.$off("closeVoiceRoom");
				uni.$off("newReadTime");
				clearInterval(_this.timer);
				clearInterval(_this.redTimer);
				_this.getReadTime();
				uni.$on("newReadTime", function(time) {
					console.log('newReadTime：成功');
					_this.nowReadTime = time;
				});
				_this.my_photo = _data.data("cache").local_photo;
				let chat_data = _data.localData(_this.list_id);
				_this.my_data = _data.data("user_info");
				/* 重新获取对话内容 */
				_get.getChatData({
					send_data: {
						list_id: _this.list_id,
						time: 0,
						is_up: 1,
					},
					is_action_data: 1,
				});
				console.log(chat_data,'chat_data+++++++');
				if (chat_data && chat_data.list.length) {
					_this.scrollAnimation = false;
					// TODO 图片列表
					console.log(chat_data);
					let msg = "";
					if (chat_data.online == 1) {
						msg = "(在线)";
					} else {
						msg = "(离线)";
					}
					uni.setNavigationBarTitle({
						title: chat_data.show_name + (chat_data.type == 1 ? "" : msg),
					});
					_this.addMsgImgList(chat_data.list);
					chat_data.list = _this.msgDataHandle(chat_data.list);
					_this.msgList = chat_data;

					_this.receive_list = _this.msgList.receive_list;
					/** 滚动到指定位置 */
					setTimeout(function() {
						_this.$nextTick(function() {
							_this.scrollTop = new Date().getTime();
							// console.log("11111111111111111111111111111")
							// _this.scrollToView = 'msg' + data[data.length - 1].msg.id;
						});
					}, 400);
					/** 如果是群聊要实时检测群有无禁言 */
					_this.type = chat_data.type;
					if (chat_data.type == 1) {
						_this.getGroupSteate();
					}
				}
				console.log('添加当前的会话',this.list_id);
				/** 添加当前的会话list_id */
				_data.localData("message_list_id", this.list_id);
				console.log('_data',_data);
console.log('监听会话数据变化的会话');
				/** 监听会话数据变化 */
				uni.$on("data_chat_data_unshift", function(data) {
					console.log('会话数据有变化');
					data = _this.msgDataHandle(data);
					_this.scrollAnimation = false;
					let position_id = _this.msgList.list[0].msg.id;
					_this.msgList.list.unshift(...data);
					/** 滚动到指定位置 */
					_this.$nextTick(function() {
						_this.scrollToView = "msg" + position_id;
					});
					// TODO 图片列表
					console.log("图片列表++++++", _this.msgList);
				});
				/** 监听会话数据变化 */
				uni.$on("data_chat_data_push", function(data) {
					_this.setReadTime();
					/** 保持页面15条数据，提升性能 */
					_this.noMore = 0;
					data = _this.msgDataHandle(data);
					_this.scrollAnimation = true;
					_this.msgList.list = data;
					// TODO 图片列表
					console.log("图片列表-----", _this.msgList);
					_this.receive_list = _this.msgList.receive_list;
					/** 滚动到指定位置 */
					setTimeout(function() {
						_this.$nextTick(function() {
							// _this.scrollTop =(new Date()).getTime();
							_this.scrollTop = new Date().getTime();
							// _this.scrollToView = 'msg' + data[data.length - 1].msg.id;
						});
					}, 400);
				});
				/** 监听撤回消息 */
				uni.$on("data_chat_data_delete", function(list) {
					_this.msgList.list = list;
					// TODO 图片列表
					console.log("图片列表", _this.msgList);
				});
				/** 监听会话数据变化 */
				uni.$on("data_chat_data", function(data) {
					let msg = "";
					if (data.online == 1) {
						msg = "(在线)";
					} else {
						msg = "(离线)";
					}
					uni.setNavigationBarTitle({
						title: data.show_name + (_this.msgList.type == 1 ? "" : msg),
					});
					data.list = _this.msgDataHandle(data.list);
					_this.scrollAnimation = false;
					_this.msgList = data;
					// TODO 图片列表
					console.log("图片列表+++++", _this.msgList);
					_this.receive_list = _this.msgList.receive_list;

					if (_this.msgList.type == 1) {
						_this.getGroupSteate();
					}
					/** 滚动到指定位置 */
					_this.$nextTick(function() {
						// _this.scrollTop =(new Date()).getTime();
						// _this.scrollToView = 'msg' + data.list[data.list.length - 1].msg.id;
						_this.scrollTop = new Date().getTime();
					});
				});
				/** 监听新的个人数据 */
				uni.$on("data_user_info", function(data) {
					_this.my_data = data;
					_this.my_photo = _data.staticPhoto() + _this.my_data.photo;
				});
				//监听键盘高度变化
				uni.onKeyboardHeightChange((res) => {
					console.log("软键盘高度变化", res);
					_this.Keyboard = res.height;

					if (res.height) {
						//todo @好友软键盘高度变化
						this.popHeight = uni.getSystemInfoSync().windowHeight - res.height;
						_this.getScrollContentHeight("show", 0);
					} else {
						this.popHeight = uni.getSystemInfoSync().windowHeight;
						_this.getScrollContentHeight("hide", 0);
					}
				});
				uni.$on("update_text_msg", function(res) {
					_this.textMsg += res.msg;
					//todo @好友  如果消息不为空，
					_this.$refs.popup_friends.close();
					if (!_this.send_user_id) {
						_this.send_user_id = res.user_id;
					} else {
						_this.send_user_id = _this.send_user_id + "," + res.user_id;
					}
				});

				uni.$on("memberJoinRoom", function(res) {
					_this.$refs.serving.memberJoin(_this.list_id, function() {
						_this.onLine = true;
						_this.showServing = true;
					});
				});
				uni.$on("closeVoiceRoom", function(res) {
					_this.$refs.serving.closeVoiceRoom();
				});
				_get.getMemberPhotos({
						list_id: _this.list_id,
					},
					function(ret) {
						_this.memberPhotos = ret;
						console.log("群成员通话", _this.memberPhotos);
					}
				);
				// 监听清空消息
				uni.$on("chat_del", function(res) {
					uni.showModal({
						title: "提示",
						showCancel: false,
						content: "消息被清空",
						success: function(res) {},
					});
					_this.msgList = [];
				});
				// 监听消息清空
				uni.$on("group_delete_chat", function(list_id) {
					_this.msgList = [];
					_get.getChatData({
						send_data: {
							list_id: _this.list_id,
							time: 0,
							is_up: 1,
						},
						is_action_data: 1,
					});
				});
				// 监听踢出会员重新获取消息
				uni.$on("remove_member", function(list_id) {
					_this.msgList = [];
					_data.localData(list_id, null);
					_this.initData();
				});
				//收到信息 回传
				this.setReadTime();
			},
			// 选择收藏
			chooseLike() {
				this.hideDrawer(1); //隐藏抽屉
				uni.navigateTo({
					url: "/pages/my/store?choose_collect=1",
				});
			},
			// 下载文件
			downFile(file) {
				uni.downloadFile({
					url: file,
					success: (data) => {
						if (data.statusCode === 200) {
							console.log("下载成功");
							uni.saveFile({
								tempFilePath: data.tempFilePath,
								success(res) {
									uni.showModal({
										title: "下载成功",
										content: "文件已保存:" + res.savedFilePath,
										success: (res_) => {},
									});
								},
							});
						}
					},
				});
			},
			// 打开地图
			openMap(pos) {
				uni.openLocation({
					latitude: pos.latitude,
					longitude: pos.longitude,
					name: pos.name,
					address: pos.address,
				});
			},
			uploadAFile(data) {
				console.log("data", data);
				let _this = this;
				for (let i = 0; i < data.length; i++) {
					let msg = {
						url: data[i].url,
						name: data[i].name,
						length: parseInt(data[i].sizeMB * 1024),
					};
					_this.sendMsg(msg, 11);
				}
			},
			// 上传文件
			chooseFile() {
				const _this = this;
				_this.hideDrawer(1); //隐藏抽屉
				// #ifdef H5
				uni.chooseFile({
					success: function(res) {
						console.log("res", res);
						console.log("size", parseInt(res.tempFiles[0].size / 1024));
						console.log(JSON.stringify(res.tempFilePaths));
						for (let i = 0; i < res.tempFilePaths.length; i++) {
							let msg = {
								url: res.tempFilePaths[i],
								name: res.tempFiles[i].name,
								length: parseInt(res.tempFiles[i].size / 1024),
							};
							_this.sendMsg(msg, 11);
						}
					},
				});
				// #endif
				// #ifdef APP-PLUS
				this.showUploadFile = true;
				// #endif
			},
			// 戳一戳
			chooseChuo() {
				this.sendChuoYiChuoMsg();
			},
			// 发送位置
			sendPos() {
				let _this = this;
				uni.chooseLocation({
					success: function(res) {
						console.log("位置名称：" + res.name);
						console.log("详细地址：" + res.address);
						console.log("纬度：" + res.latitude);
						console.log("经度：" + res.longitude);
						let msg = {
							latitude: res.latitude,
							longitude: res.longitude,
							name: res.name,
							address: res.address,
						};
						_this.sendMsg(msg, 10);
					},
				});
			},

			getHtml(content) {
				return htmlParser(content);
			},

			inputText(e) {
				//截取最后一位

				let str = e.detail.value;
				// todo @好友
				if (str === "") {
					this.send_user_id = "";
				}
				let length1 = str.length;
				let key = str.substr(length1 - 1, 1);
				if (
					key &&
					key == "@" &&
					this.msgList.type == 1 &&
					length1 > this.textMsg.length
				) {
					this.textMsg = str;
					console.log("跳转到群成员列表");
					// TODO群成员弹窗
					// 关闭输入框
					uni.hideKeyboard();
					this.$refs.popup_friends.open();
					// uni.navigateTo({
					// 	url: '/pages/chat/group_list?list_id=' + this.list_id,
					// 	animationType: "slide-in-bottom"
					// });
					return true;
				}
				this.textMsg = str;
			},
			getScrollContentHeight(type = "show", not_return = 1) {
				let _this = this;
				let query = uni.createSelectorQuery();
				query.select(".more-layer").boundingClientRect();
				query.select(".input-box").boundingClientRect();
				uni.getSystemInfo({
					success: function(res) {
						_this.scrollInfo.totall_height = res.windowHeight;
						query.exec((data) => {
							_this.scrollInfo.input_box_height1 = data[0].height || 0;
							_this.scrollInfo.input_box_height2 = data[1].height || 0;

							_this.autoHeight(type, not_return);
						});
					},
				});
			},
			autoHeight(type, not_return) {
				let _this = this;
				if (type == "show") {
					if (this.Keyboard) {
						this.scrollHeight =
							_this.scrollInfo.totall_height -
							_this.Keyboard -
							_this.scrollInfo.input_box_height2 +
							"px";
					} else {
						this.scrollHeight =
							_this.scrollInfo.totall_height -
							_this.scrollInfo.input_box_height1 -
							_this.scrollInfo.input_box_height2 +
							"px";
					}
				} else {
					//content高度 = 屏幕高度-tool高度
					uni.getSystemInfo({
						success: function(res) {
							res.windowHeight = res.windowHeight;
							if (_this.Keyboard) {
								_this.scrollHeight =
									res.windowHeight -
									_this.scrollInfo.Keyboard -
									_this.scrollInfo.input_box_height2 +
									"px";
							} else {
								_this.scrollHeight =
									res.windowHeight - _this.scrollInfo.input_box_height2 + "px";
							}
						},
					});
					// this.scrollHeight = '100%'
				}
				if (not_return == 0) {
					this.$nextTick(() => {
						_this.scrollTop = new Date().getTime();
					});
				}
			},
			getGroupSteate() {
				let _this = this;
				this.$httpSend({
					path: "/im/action/groupState",
					data: {
						list_id: _this.list_id,
					},
					success(res) {
						_this.msgList.is_msg = res.is_msg;
						_this.msgList.is_action = res.is_action;
						_this.msgList.is_niming = res.is_niming;
						_this.niming_msg = res.is_niming == 0 ? "匿名" : "退出匿名";
						_this.miaoqiang = res.miaoqiang;
						_this.vendor_status = res.vendor_status;
						_this.notice = res.notice;
						_this.is_main = res.is_main;
						_this.group_state = res;

						if (_this.miaoqiang && _this.is_main && res.qiang_time > 0) {
							_this.autoFaRed(res.qiang_time);
						}
						if (res.voice_room_state) {
							//有人发起语音则自动加入
							//加入视频
							_this.$refs.serving.memberJoin(_this.list_id, function() {
								_this.onLine = true;
							});
						}
					},
				});
			},
			videoErrorCallback() {},
			autoVideo(msg) {
				this.showVedio = true;
				this.videoPath =
					_data.staticChat() + this.list_id + "/" + msg.content.url;
			},
			getCard(msg) {
				if (msg.content.user_id != undefined) {
					uni.navigateTo({
						url: "/pages/details/index?in=1&user_id=" + msg.content.user_id,
					});
				}
			},
			chooseCard() {
				uni.navigateTo({
					url: "./message/card_list?list_id=" + this.list_id,
				});
			},
			imageError(e) {
				// this.my_photo = _data.staticPhoto() + '/default_photo_path.png';

				let index = e.currentTarget.dataset.id;
				//替换index对应的图片

				this.msgList.list[index].msg.user_info.face = "/default_photo_path.png";
			},
			imageError2(e) {
				this.my_photo = _data.staticPhoto() + "/default_photo_path.png";
			},
			scrollToDom() {
				let that = this;
				let query = uni.createSelectorQuery();
				query.select("#msg" + that.chat_id).boundingClientRect();
				query.select("#scrollview").boundingClientRect();
				query.exec((res) => {
					that.style.mitemHeight = 0;

					let rect = res[0];
					that.style.mitemHeight = that.style.mitemHeight + rect.height + 40;
					if (that.style.mitemHeight > that.style.contentViewHeight - 100) {
						//判断子元素高度是否大于显示高度
						that.scrollTop =
							that.style.mitemHeight - that.style.contentViewHeight; //用子元素的高度减去显示的高度就获益获得序言滚动的高度
					}
				});
			},
			//
			//发起视频聊天
			videoBut(type) {
				console.log("发起通话->", type);
				let data = {};
				if (type == "voice") {
					data.callType = 1
				} else {
					data.callType = 2
				}

				let arr = [];
				this.memberPhotos.forEach(item => {
					arr.push(item.user_id.toString());
				})
				data.user_ids = arr;
				console.log("发起通话数据", data);
				this.sendCall(data);

				return;

				let content_type = 6;
				this.call_ret = false;
				if (type === "voice") {
					this.voiceLoading = true;
					content_type = 7;
				} else {
					this.videoLoading = true;
				}
				let _this = this;

				this.$httpSend({
					path: "/im/message/sendVideo",
					data: {
						list_id: this.list_id,
						content_type: content_type,
						_token: uni.getStorageSync("token"),
					},
					success_action: true,
					success(res) {
						if (res.err === 0) {
							console.log("通话数据",res);
							//图片转化
							res.data.myavatar = _this.staticPhoto + res.data.myavatar;
							res.data.avatar = _this.staticPhoto + res.data.avatar;
							_this.getVideo(res.data);
						} else {}
					},
				});
			},
			// 发起腾讯通话
			sendCall(data) {
				console.log('开始发起腾讯通话');
				let my_id = this.my_data.id;
				let user_id = '';
				data.user_ids.forEach(item => {
					if (item != my_id) {
						user_id = item;
					}
				})
				console.log("开始打电话",data);
				console.log(uni.$TUICalling,'uni.$TUICalling');
				uni.$TUICalling.call({
						type: data.callType,
						userID: user_id,
					},
					(res) => {
						console.log(JSON.stringify(res));
					}
				);
				// uni.$TUICalling.groupCall({
				// 		type: data.callType,
				// 		groupID: "",
				// 		userIDList: data.user_ids,
				// 	},
				// 	(res) => {
				// 		console.log(JSON.stringify(res));
				// 	}
				// );
			},

			//调用视频/音频
			getVideo(data) {
				this.sendCall(data);
				return;
				data.usersig = genTestUserSig(data.userid).userSig;
				console.log("调用传参", data);
				console.log("_this.call", _this.call);
				console.log("调用腾讯云data", data);
				let _this = this;
				_this.call.groupCall({
						type: data.callType == "voice" ? 1 : 2,
						groupID: "",
						userIDList: data.user_ids,
					},
					(ret) => {
						this.doubleClick = false;
						console.log(data);
						console.log(ret);
						console.log("9909090909090");
						if (ret) {
							_this.videPoup = false;
							_this.voiceLoading = false;
							if (ret.code == 5 && !_this.payTimer) {
								console.log("发起付费");
								//先扣一次
								_get.payVideoAamount({
										list_id: _this.list_id,
									},
									function(res) {
										console.log(res);
									},
									function(res) {
										console.log(res);
									}
								);
								_this.payTimer = setInterval(function() {
									_get.payVideoAamount({
											list_id: _this.list_id,
										},
										function(res) {
											console.log(res);
										},
										function(res) {
											console.log(res);
											clearInterval(_this.payTimer); //取消收费
											_this.payTimer = false;
										}
									);
								}, 60000);
							}
							if (ret.code == 1 && ret.time != undefined) {
								//对方或者自己取消
								data.time = ret.time;
								data.ret_code = ret.code;
								console.log(JSON.stringify(data));
								_get.cancelCall(data, function(res) {});
							}
						}
					}
				);
			},
			// 发起视频通话
			videoCall(type) {
				let _this = this;
				_this.callType = type;
				console.log('kaishi');
				//
				console.log("确认开始->")
				_this.confirm();
				// this.videPoup = true
				// this.hideDrawer();
			},
			confirm() {
				// if (this.doubleClick) return false;
				// this.doubleClick = true;
				if (this.callType == 1) {
					this.videoBut("video");
				} else {
					this.videoBut("voice");
				}
				this.$refs.popup.close();
			},
			msgDataHandle(data, type) {
				for (let i = 0, j = data.length, msg_img; i < j; i++) {
					if (data[i].type == 0 && data[i].msg.type == 2) {
						msg_img =
							this.staticPath +
							this.list_id +
							"/" +
							data[i].msg.content.url.replace("_thumb", "");
						if (type) {
							this.msgImgList.unshift(msg_img);
						} else {
							this.msgImgList.push(msg_img);
						}
						data[i].msg.content = this.setPicSize(data[i].msg.content);
					} else if (data[i].type == 0 && data[i].msg.type == 0) {
						data[i].msg.content.text = this.replaceEmoji(
							data[i].msg.content.text
						);
					}
				}
				// console.log("this.msgImgList",this.msgImgList);
				return data;
			},
			// 所有图片列表
			addMsgImgList(data) {
				this.msgImgList = [];
				for (let i = 0, j = data.length, msg_img; i < j; i++) {
					if (data[i].type == 0 && data[i].msg.type == 2) {
						this.msgImgList.push(
							this.staticPath +
							this.list_id +
							"/" +
							data[i].msg.content.url.replace("_thumb", "")
						);
					}
				}
			},
			timestampFormat(time) {
				return _action.timestampFormat(time);
			},
			msgAction(id, user_id, content, type) {
				let _this = this;
				// switch (_this.msgList.type) {
				//   case 0:
				//     if (user_id != _this.my_data.id) {
				//       return;
				//     }
				//     break;
				//   case 1:
				//     if (_this.msgList.is_action == 0 && user_id != _this.my_data.id) {
				//       return;
				//     }
				//     break;
				//   default:
				//     return;
				//     break;
				// }
				uni.showActionSheet({
					itemList: ["撤回", "收藏", "转发", "复制"],
					success: function(res) {
						switch (res.tapIndex) {
							case 0:
								_this.$httpSend({
									path: "/im/message/withdraw",
									data: {
										list_id: _this.list_id,
										type: _this.msgList.type,
										msg_id: id,
									},
									success_action: true,
									success(res) {
										uni.showToast({
											title: res.msg,
											icon: "none",
											duration: 1500,
										});
									},
								});
								break;
							case 1:
								console.log("收藏");
								console.log("收藏文件", {
									list_id: _this.list_id,
									type: _this.msgList.type,
									msg_id: id,
								});
								_this.$httpSend({
									path: "/im/vendor/saveStore",
									data: {
										list_id: _this.list_id,
										type: _this.msgList.type,
										msg_id: id,
									},
									success_action: true,
									success(res) {
										uni.showToast({
											title: res.msg,
											icon: "none",
											duration: 1500,
										});
									},
								});
								break;
							case 2:
								console.log("转发");
								let datas = {
									list_id: _this.list_id,
									type: _this.msgList.type,
									msg_id: id,
								};
								uni.setStorageSync("data_msg", JSON.stringify(datas));
								uni.navigateTo({
									url: "../push/sendallsome?type=" +
										type +
										"&content=" +
										JSON.stringify(content),
								});
								break;
								//收藏
							case 3:
								console.log("复制", content);
								if (type == 0) {
									let reg = /<\/?.+?\/?>/g;
									let str = content.text;
									str = str.replace(reg, "");
									uni.setClipboardData({
										data: str,
										success: function() {
											uni.showToast({
												icon: "none",
												title: "复制成功",
											});
										},
										fail: function() {
											uni.showToast({
												icon: "none",
												title: "复制失败",
											});
										},
									});
								} else {
									uni.showToast({
										icon: "none",
										title: "不支持该类消息复制",
									});
								}

								break;

							default:
								break;
						}
					},
					fail: function(res) {
						//console.log(res.errMsg);
					},
				});
			},
			copyToClipboard(str) {
				const el = document.createElement("textarea");
				el.value = str;
				el.setAttribute("readonly", "");
				el.style.position = "absolute";
				el.style.left = "-9999px";
				document.body.appendChild(el);
				const selected =
					document.getSelection().rangeCount > 0 ?
					document.getSelection().getRangeAt(0) :
					false;
				el.select();
				document.execCommand("copy");
				document.body.removeChild(el);
				if (selected) {
					document.getSelection().removeAllRanges();
					document.getSelection().addRange(selected);
				}
			},
			goDetails(user_id, row) {
				/** 如果是群聊，没有权限的话，查看不了其他会员信息 */
				if (
					this.msgList.type == 1 &&
					(this.msgList.is_action == 0 || row.msg.is_niming == 1)
				) {
					uni.showToast({
						title: "没有权限查看",
						icon: "none",
						duration: 1000,
					});
					return;
				}
				uni.navigateTo({
					url: "../details/index?user_id=" + user_id,
				});
			},

			// 接受消息(筛选处理)
			screenMsg(msg) {
				//从长连接处转发给这个方法，进行筛选处理
				if (msg.type == 2) {
					//已读信息
					this.nowReadTime = msg.msg.time;
				} else if (msg.type == 1) {
					// 系统消息
					switch (msg.msg.type) {
						case 0:
							this.addSystemTextMsg(msg);
							break;
						case 5:
							this.addSystemRedEnvelopeMsg(msg);
							break;
					}
				} else if (msg.type == 0) {
					// 用户消息
					switch (msg.msg.type) {
						case 0:
							this.addTextMsg(msg);
							break;
						case 1:
							this.addVoiceMsg(msg);
							break;
						case 2:
							this.addImgMsg(msg);
							break;
						case 5:
							this.addRedEnvelopeMsg(msg);
							break;
					}
					//console.log('用户消息');
					//非自己的消息震动
					if (msg.msg.user_info.uid != this.my_data.id) {
						//console.log('振动');
						uni.vibrateLong();
					}
					//收到信息 回传
					this.setReadTime();
				}
				let _this = this;
				this.$nextTick(function() {
					// 滚动到底
					_this.scrollTop = new Date().getTime();
				});
			},
			getReadTime() {
				var _this = this;
				this.$httpSend({
					path: "/im/message/getListTime",
					data: {
						list_id: this.list_id,
					},
					success_action: true,
					success(res) {
						console.log('getReadTime：成功');
						_this.nowReadTime = res.read_time;
					},
				});
			},
			setReadTime() {
				this.$httpSend({
					path: "/im/message/setListTime",
					data: {
						list_id: this.list_id,
					},
					success_action: true,
					success(res) {
						// console.log(res)
					},
				});
			},

			//触发滑动到顶部(加载历史信息记录)
			loadHistory() {
				if (this.isHistoryLoading || this.noMore) {
					return;
				}
				let _this = this;
				this.isHistoryLoading = true; //参数作为进入请求标识，防止重复请求

				_get.getChatData({
					send_data: {
						list_id: _this.list_id,
						time: _this.msgList.list[0].msg.time,
						is_up: 0,
					},
					callback(data) {
						if (data.list.length < 15) {
							_this.noMore = 1;
						}
						_this.isHistoryLoading = false;
					},
					is_action_data: 0,
				});
			},

			//处理图片尺寸，如果不处理宽高，新进入页面加载图片时候会闪
			setPicSize(content) {
				// 让图片最长边等于设置的最大长度，短边等比例缩小，图片控件真实改变，区别于aspectFit方式。
				let maxW = uni.upx2px(350); //350是定义消息图片最大宽度
				let maxH = uni.upx2px(350); //350是定义消息图片最大高度
				if (content.w > maxW || content.h > maxH) {
					let scale = content.w / content.h;
					content.w = scale > 1 ? maxW : maxH * scale;
					content.h = scale > 1 ? maxW / scale : maxH;
					let url_array = content.url.split(".");
					if (content.url.indexOf("_thumb.") == -1) {
						content.url = url_array[0] + "_thumb." + url_array[1];
					}
				}
				return content;
			},
			//更多功能(点击+弹出)
			showMore() {
				this.isVoice = false;
				this.hideEmoji = true;
				if (this.hideMore) {
					this.hideMore = false;
					this.openDrawer();
				} else {
					this.hideDrawer();
				}
			},
			// 打开抽屉
			openDrawer() {
				let _this = this;
				this.popupLayerClass = "showLayer";
				this.hideMore = false;
				setTimeout(function() {
					console.log("scorll...");
					_this.getScrollContentHeight("show", 0);
				}, 150);
			},
			// 隐藏抽屉
			hideDrawer(not_return = 0, type = "hide") {
				//判断时间
				if (not_return == 3) {
					let time = new Date().getTime();
					if (this.doubleTime.flag) {
						this.doubleTime.firstTime = time;
						this.doubleTime.flag = false;
					} else {
						this.doubleTime.towTime = time;
						this.doubleTime.flag = true;
					}
					let timeBucket = this.doubleTime.towTime - this.doubleTime.firstTime;
					console.log("timeBucket:", timeBucket);
					if (timeBucket < 200 && this.doubleTime.flag) {
						//第二次进来
						clearTimeout(this.timer);
						this.doubleTime.towTime = "";
						this.doubleTime.firstTime = "";
						// this.sendChuoYiChuoMsg();
						// this.textMsg = '[戳一戳]'
						// this.sendMsg(this.textMsg, 0);
						// this.textMsg = ''
						// //发送戳一戳
						return false;
					}
					let _this = this;
					this.timer = setTimeout(function() {
						_this.toHideDrawer(not_return, type);
					}, 280);
				} else {
					this.toHideDrawer(not_return, type);
				}
			},
			sendChuoYiChuoMsg() {
				_get.sendChuoYiChuoMsg({
						list_id: this.list_id,
					},
					function() {}
				);
			},
			toHideDrawer(not_return = 0, type = "hide") {
				this.popupLayerClass = "";
				setTimeout(() => {
					this.hideMore = true;
					this.hideEmoji = true;
					this.getScrollContentHeight(type, not_return);
				}, 150);
			},
			// 选择图片发送
			chooseImage() {
				this.getImage("album");
			},
			//拍照发送
			camera() {
				this.getImage("camera");
			},
			//拍摄视频发送
			video() {
				uni.chooseVideo({
					success: (res) => {
						let min = parseInt(res.size / 60),
							sec = res.size % 60;
						min = min < 10 ? "0" + min : min;
						sec = sec < 10 ? "0" + sec : sec;
						let msg = {
							url: res.tempFilePath,
							length: min + ":" + sec,
						};
						this.sendMsg(msg, 3);
					},
				});
			},
			//发红包
			handRedEnvelopes() {
				// this.hideDrawer(1);
				console.log(111);
				let url =
					"message/hand?list_id=" +
					this.list_id +
					"&msg_type=" +
					this.msgList.type;
				if (this.vendor_status)
					url =
					"message/hand_pin?list_id=" +
					this.list_id +
					"&msg_type=" +
					this.msgList.type;
				uni.navigateTo({
					url: url,
				});
			},
			//转账
			transfers() {
				//TODO跳转到转账页面
			},

			//选照片 or 拍照
			getImage(type) {
				this.hideDrawer(1);
				uni.chooseImage({
					sourceType: [type],
					sizeType: ["original", "compressed"], //可以指定是原图还是压缩图，默认二者都有
					success: (res) => {
						for (let i = 0; i < res.tempFilePaths.length; i++) {
							uni.getImageInfo({
								src: res.tempFilePaths[i],
								success: (image) => {
									//console.log(image.width);
									//console.log(image.height);
									let msg = {
										url: res.tempFilePaths[i],
										w: image.width,
										h: image.height,
									};
									this.sendMsg(msg, 2);
								},
							});
						}
					},
				});
			},
			// 选择表情
			chooseEmoji() {
				this.hideMore = true;
				if (this.hideEmoji) {
					this.hideEmoji = false;
					this.openDrawer();
				} else {
					this.hideDrawer();
				}
			},
			//添加表情
			addEmoji(em) {
				this.textMsg += em.alt;
			},

			//获取焦点，如果不是选表情ing,则关闭抽屉
			textareaFocus() {
				let _this = this;
				_this.hideDrawer(0, "show");
				return;
				if (_this.popupLayerClass == "showLayer" && this.hideMore == false) {
					_this.hideDrawer();
				}
			},

			// 发送文字消息
			sendText() {
				this.hideDrawer(1); //隐藏抽屉
				if (!this.textMsg) {
					return;
				}
				this.sendMsg("", 0);
				//清空输入框
				this.textMsg = "";
			},

			//替换表情符号为图片
			replaceEmoji(str) {
				str = str ? str : "";
				let replacedStr = str.replace(/\[([^(\]|\[)]*)\]/g, (item, index) => {
					// console.log("item: " + item);
					for (let i = 0; i < this.emojiList.length; i++) {
						let row = this.emojiList[i];
						for (let j = 0; j < row.length; j++) {
							let EM = row[j];
							if (EM.alt == item) {
								//在线表情路径，图文混排必须使用网络路径，请上传一份表情到你的服务器后再替换此路径
								//比如你上传服务器后，你的100.gif路径为https://www.xxx.com/emoji/100.gif 则替换onlinePath填写为https://www.xxx.com/emoji/
								let imgstr =
									'<img style="width:22px;height:22px;" src="' +
									_data.data("static_url") +
									"/static/emoji/" +
									EM.url +
									'">';
								// console.log("imgstr: " + imgstr);
								return imgstr;
							}
						}
					}
				});
				// display: flex;
				// return '<div style="align-items: center;word-break:break-all;">' + replacedStr + '</div>';
				return replacedStr;
			},
			showQiang() {
				this.$refs.qiang.open();
			},
			autoFaRed(num) {
				let _this = this;
				let time = num * 1000;
				if (time <= 0) return false;
				if (_this.timer) clearInterval(_this.redTimer);
				_this.redTimer = setInterval(function() {
					_get.autoBigRed({
							list_id: _this.list_id,
						},
						function() {}
					);
				}, num * 1000);
			},
			goQiang(e) {
				let _this = this;
				e.list_id = _this.list_id;
				_get.updateMiaoqiang(e, function(res) {
					_this.miaoqiang = e.status;
					console.log(e);
					if (e.status == 1) {
						console.log("发包.......");
						_this.autoFaRed(e.num);
					} else {
						clearInterval(_this.redTimer);
					}
					setTimeout(function() {
						uni.showToast({
							title: "操作成功",
							duration: 2000,
						});
						_this.$refs.qiang.close();
					}, 500);
				});
			},
			// 发送消息
			sendMsg(content, type) {
				// uni.showLoading();
				let _this = this,
					sendMsg = content;
				((callback) => {
					switch (type) {
						/** 文字/表情消息 */
						case 0:
							let msg = this.textMsg.replace(/</g, "&lt;");
							sendMsg = {
								text: msg,
							};
							// todo @好友
							if (_this.send_user_id) {
								sendMsg.user_id = _this.send_user_id;
							}
							callback();
							break;
							/** 语音/图片/视频/文件 */
						case 1:
						case 2:
						case 3:
						case 4:
							uni.showLoading({
								title: "发送中",
							});
							_this.$httpSendFile({
								type: 0,
								local_url: sendMsg.url,
								data: {
									list_id: _this.list_id,
								},
								success(data) {
									console.log("数据", data);

									uni.hideLoading();
									sendMsg.url = data.save_name;
									sendMsg.full_url = data.full_url;
									sendMsg.full_movie = data.full_movie;
									if ("save_gif_path" in data)
										sendMsg.save_pic_path = data.save_gif_path;
									console.log("success");
									callback();
								},
							});
							break;
							/** 红包消息 */
						case 5:
							break;

						case 10:
							// 地图
							sendMsg = content;
							callback();
							break;
						case 11:
							// 文件
							uni.showLoading({
								title: "发送中",
							});
							_this.$httpSendFile({
								type: 0,
								local_url: sendMsg.url,
								data: {
									list_id: _this.list_id,
								},
								success(data) {
									console.log("数据");

									uni.hideLoading();
									sendMsg.url = data.save_name;
									sendMsg.full_url = data.full_url;
									sendMsg.full_movie = data.full_movie;
									if ("save_gif_path" in data)
										sendMsg.save_pic_path = data.save_gif_path;
									console.log("success");
									callback();
								},
							});
							break;
						default:
							break;
					}
				})(() => {
					//todo @好友 发送后清空user_id
					_this.send_user_id = "";
					_this.$httpSend({
						path: "/im/message/textMsg",
						data: {
							list_id: _this.list_id,
							content_type: type,
							content: JSON.stringify(sendMsg),
						},
						success_action: true,
						success(res) {
							// uni.hideLoading();
							switch (res.err) {
								case 0:
									if (type == 1) {
										_action.playVoice("/static/voice/voice.mp3");
									}
									break;
								case 1:
									uni.showModal({
										title: "好友提示",
										confirmText: "发送好友申请",
										content: res.msg,
										success: function(res) {
											if (res.confirm) {
												uni.navigateTo({
													url: "../friend/apply?user_id=" +
														_data.localData(_this.list_id)
														.obj_id +
														"&is_type=0",
												});
											}
										},
									});
									break;
								case 2:
									uni.showModal({
										content: res.msg,
									});
									let data = _data.localData(data.list_id);
									data.is_msg = 1;
									_this.msgList.is_msg = 1;
									_data.localData(data.list_id, data);
									break;
								default:
									break;
							}
							console.log("重新获取聊天内容。。。。。。。。。");
							_get.getChatData({
								send_data: {
									list_id: _this.list_id,
									time: 0,
									is_up: 1,
								},
								is_action_data: 1,
							});
						},
					});
				});
			},

			// 添加文字消息到列表
			addTextMsg(msg) {
				this.msgList.list.push(msg);
			},
			// 添加语音消息到列表
			addVoiceMsg(msg) {
				this.msgList.list.push(msg);
			},
			// 添加图片消息到列表
			addImgMsg(msg) {
				this.msgImgList.push(
					this.staticPath +
					this.list_id +
					"/" +
					msg.content.url.replace("_thumb", "")
				);
				msg.msg.content = this.setPicSize(msg.msg.content);
				this.msgList.list.push(msg);
				console.log("this.msgImgList", this.msgImgList);
				console.log("this.msgList", this.msgList);
			},
			addRedEnvelopeMsg(msg) {
				this.msgList.push(msg);
			},
			// 添加系统文字消息到列表
			addSystemTextMsg(msg) {
				this.msgList.list.push(msg);
			},
			// 添加系统红包消息到列表
			addSystemRedEnvelopeMsg(msg) {
				this.msgList.list.push(msg);
			},
			openRed(params) {
				let _this = this;
				_this.luckbtn = "luckbtn";
				uni.showLoading({
					title: "加载中...",
				});
				//TODO 判断是哪种红包
				if (this.vendor_status == 1) {
					_get.getLeiHongBao(
						params,
						function(ret) {
							_this.receive_list.push(params.rid);
							_this.msgList.receive_list = _this.receive_list;
							_data.localData(_this.list_id, _this.msgList);
							console.log(ret);
							uni.$emit("data_user_info", ret);
							_data.data("user_info", ret);
							setTimeout(function() {
								_this.luckbtn = "";
								_this.closeRedEnvelope();
								_this.toDetails(params.rid);
							}, 1000);
						},
						function(ret) {
							setTimeout(function() {
								_this.luckbtn = "";
								_this.closeRedEnvelope();
								_this.toDetails(params.rid);
							}, 1000);
						}
					);
				} else {
					_get.getHongBao(
						params,
						function(ret) {
							_this.receive_list.push(params.rid);
							_this.msgList.receive_list = _this.receive_list;
							_data.localData(_this.list_id, _this.msgList);
							console.log(ret);
							uni.$emit("data_user_info", ret);
							_data.data("user_info", ret);
							setTimeout(function() {
								_this.luckbtn = "";
								_this.closeRedEnvelope();
								_this.toDetails(params.rid);
							}, 1000);
						},
						function(ret) {
							setTimeout(function() {
								_this.luckbtn = "";
								_this.closeRedEnvelope();
								_this.toDetails(params.rid);
							}, 1000);
						}
					);
				}

				uni.hideLoading();
			},
			// 打开红包
			openRedEnvelope(msg, index) {
				if (this.receive_list.indexOf(msg.content.rid) >= 0) {
					this.toDetails(msg.content.rid);
					return true;
				}
				this.windowsState = "show";
				this.redenvelopeData = msg.content;
				this.redenvelopeData.index = index;
				return true;
			},
			// 关闭红包弹窗
			closeRedEnvelope() {
				this.windowsState = "hide";
				setTimeout(() => {
					this.windowsState = "";
				}, 200);
			},
			sendSystemMsg(content, type) {
				let lastid = this.msgList.list[this.msgList.list.length - 1].msg.id;
				lastid++;
				let row = {
					type: "system",
					msg: {
						id: lastid,
						type: type,
						content: content,
					},
				};
				this.screenMsg(row);
			},
			//领取详情
			toDetails(rid) {
				uni.navigateTo({
					url: "message/details?rid=" + rid + "&list_id=" + this.list_id,
				});
			},
			// 预览图片
			showPic(msg) {
				console.log("msg预览1", msg);
				let url =
					this.staticPath +
					this.list_id +
					"/" +
					msg.content.url.replace("_thumb", "");
				uni.previewImage({
					indicator: "none",
					urls: [url],
				});
			},
			// 预览图片
			showPic1(msg) {
				console.log("msg预览2类型图片", msg);
				let url =
					this.staticPath +
					this.list_id +
					"/" +
					msg.content.url.replace("_thumb", "");
				uni.previewImage({
					current: url,
					indicator: "none",
					urls: this.msgImgList,
				});
			},
			// 预览文字图片链接
			showPic2(url) {
				console.log("msg预览3", url);
				uni.previewImage({
					indicator: "none",
					urls: [url],
				});
			},
			// 播放语音
			playVoice(msg) {
				console.log("播放语音", msg);
				this.AUDIO.stop();
				let _this = this;
				if (this.playMsgid == msg.id) {
					this.playMsgid = null;
				} else {
					this.playMsgid = msg.id;
					// this.AUDIO.obeyMuteSwitch = false;
					// todo修复语音
					let url = this.staticPath + msg.content.full_url;
					_this.AUDIO.src = url;
					_this.$nextTick(function() {
						_this.AUDIO.play();
					});
					// this.AUDIO.src = (this.staticPath + msg.content.url + '?_=' + Math.random());
				}
			},
			// 录音开始
			voiceBegin(e) {
				if (e.touches.length > 1) {
					return;
				}
				this.initPoint.Y = e.touches[0].clientY;
				this.initPoint.identifier = e.touches[0].identifier;
				// this.RECORDER.start({ format: "mp3" });//录音开始,
				// 开始录音
				this.RECORD.start({
					format: "mp3",
				});
			},
			//录音开始UI效果
			recordBegin(e) {
				/** 暂停语音播放 */
				this.AUDIO.pause();
				this.recording = true;
				this.voiceTis = "松开 结束";
			},
			// 录音被打断
			voiceCancel() {
				this.recording = false;
				this.voiceTis = "按住 说话";
				this.recordTis = "手指上滑 取消发送";
				this.willStop = true; //不发送录音
				this.RECORD.stop(); //录音结束
			},
			// 录音中(判断是否触发上滑取消发送)
			voiceIng(e) {
				if (!this.recording) {
					return;
				}
				let touche = e.touches[0];
				//上滑一个导航栏的高度触发上滑取消发送
				if (this.initPoint.Y - touche.clientY >= uni.upx2px(100)) {
					this.willStop = true;
					this.recordTis = "松开手指 取消发送";
				} else {
					this.willStop = false;
					this.recordTis = "手指上滑 取消发送";
				}
			},
			// 结束录音
			voiceEnd(e) {
				if (!this.recording) {
					return;
				}
				this.recording = false;
				this.voiceTis = "按住 说话";
				this.recordTis = "手指上滑 取消发送";
				this.RECORD.stop(); //录音结束
			},
			//录音结束(回调文件)
			recordEnd(e) {
				if (!this.willStop) {
					//console.log("e: " + JSON.stringify(e));
					let msg = {
						length: 0,
						url: e.tempFilePath,
					};
					console.log(JSON.stringify(msg));
					let min = parseInt(this.RecordTime / 60);
					let sec = this.RecordTime % 60;
					min = min < 10 ? "0" + min : min;
					sec = sec < 10 ? "0" + sec : sec;
					if (min > 0 || sec > 0) {
						msg.length = min + ":" + sec;
						this.sendMsg(msg, 1);
					}
				} else {
					console.log("取消发送录音");
				}
				this.willStop = false;
			},
			// 切换语音/文字输入
			switchVoice() {
				this.hideDrawer(1);
				this.isVoice = this.isVoice ? false : true;
			},
			discard() {
				return;
			},
			sayCall() {
				let status = 0; //默认关闭匿名
				console.log("this.msgList.is_niming:", this.msgList.is_niming);
				if (this.msgList.is_niming == 0) {
					uni.showLoading({
						title: "匿名开启中...",
					});
					status = 1;
				}
				let _this = this;
				_get.updateUserSayType({
						list_id: this.list_id,
						status: status,
					},
					function() {
						if (_this.msgList.is_niming == 0) {
							uni.showToast({
								title: "开启成功",
								image: "/static/theme/default/my/niming.png",
								duration: 2000,
							});
							_this.msgList.is_niming = 1;

							_this.niming_msg = "退出匿名";
						} else {
							_this.msgList.is_niming = 0;
							_this.niming_msg = "匿名";
						}
						_this.textareaFocus(); //隐藏抽屉
					},
					function(ret) {
						uni.showToast({
							title: ret.msg,
							icon: "none",
							duration: 2000,
						});
					}
				);
			},
			scrollEven(e) {},
			zhendong() {
				_get.zhendong({
						list_id: this.list_id,
					},
					function(res) {},
					function(res) {
						uni.showToast({
							title: res.msg,
							duration: 2000,
							icon: "none",
						});
					}
				);
			},
			group_info() {
				uni.navigateTo({
					url: "./message/more?list_id=" +
						this.list_id +
						"&type=" +
						this.msgList.type,
				});
			},
			toUserDetail(item) {
				if (this.msgList.type == 1 && this.msgList.is_action == 0) {
					uni.showToast({
						title: "没有权限查看",
						icon: "none",
						duration: 1000,
					});
					return;
				}
				uni.navigateTo({
					url: "../details/index?user_id=" +
						item.user_id +
						"&type=1&list_id=" +
						this.list_id +
						"&is_action=" +
						this.is_action,
				});
			},
			getServing() {
				//判断权限
				if (
					this.msgList.type == 1 &&
					this.msgList.is_action == 0 &&
					this.group_state &&
					this.group_state.can_shangmai == 0
				) {
					uni.showToast({
						title: "此群被设置为只有群主和管理员才能上麦",
						icon: "none",
						duration: 1000,
					});
					return;
				}
				let _this = this;
				if (this.onLine) {
					//在房间里直开启
					_this.showServing = true;
					console.log("onLine.....");
					this.$refs.serving.joinOnline(this.list_id);
					return true;
				}
				console.log("_this.servingState:", _this.servingState);
				if (_this.servingState == 1) {
					//下麦
					_this.showServing = false;
					_this.$refs.serving.xiaMai(this.list_id);
				} else {
					//上麦
					console.log("joinRoom....");
					_this.showServing = true;
					this.$refs.serving.joinRoom(this.list_id);
				}
			},
			setSeringState(detail) {
				console.log("this.servingState:", JSON.stringify(detail));
				this.servingState = detail.state;
			},
		},
		watch: {},
		onNavigationBarButtonTap(e) {
			uni.navigateTo({
				url: "./message/more?list_id=" + this.list_id + "&type=" + this.msgList.type,
			});
		},
	};
</script>

<style lang="scss">
	@import "@/static/css/chat/style.scss";
	.other {
		.left {
			position: relative;
			.u-logo {
				width: 90rpx !important;
				height: 90rpx !important;
				flex-shrink: 0;
			}
			.action {
				width: 160rpx;
				background: #fff;
				border-radius: 10rpx;
				box-shadow: 0 0 10rpx 0 rgba(0, 0, 0, 0.2);
				position: absolute;
				z-index: 10;
				top: 100rpx;
				left: 0;
				display: flex;
				flex-direction: column;
				align-items: center;
				box-sizing: border-box;
				padding: 0 30rpx;

				.action-line {
					height: 2rpx;
					width: 100rpx;
					margin: 6rpx auto;
					background-color: #ddd;
				}

				.action-item {
					font-size: 24rpx;
					display: flex;
					align-items: center;
					height: 54rpx;
				}
			}
		}
	}

	.popup_friends {
		background-color: rgba(0, 0, 0, 0.3);
		height: 100vh;
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		justify-content: flex-end;
	}

	.popup_friends-top {
		height: 200rpx;
		flex-shrink: 0;
		/* #ifdef H5 */
		height: 500rpx;
		/* #endif */
	}

	.text-gray {
		color: gray;
	}

	.address-name {
		display: flex;
		flex-direction: column;
	}

	.address-flex {
		display: flex;
		align-items: center;
	}

	.fun-icon {
		width: 100rpx;
		height: 100rpx;
		margin: 10rpx;
	}

	.more-layer {
		// height: 800rpx;
	}

	.send-card {
		width: 700rpx;
		height: 200rpx;
		display: flex;
		max-width: 70%;
		min-height: 25px;
		border-radius: 5px;
		font-size: 14px;
		background-color: #fff;
		flex-direction: column;
		color: #333;
	}

	.send-card-content {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		padding: 20upx;
		height: 100%;
		border-bottom: 2px solid #e1e1e1;
	}

	.send-card-content text {
		margin-left: 20upx;
	}

	.send-card-content-text {
		display: flex;
		justify-content: center;
		flex-direction: column;
		height: 100%;
		margin-left: 20upx;
	}

	.video-but-view {
		padding: 20upx;
		border-radius: 10upx 10upx 0 0;

		.video-but {
			margin-bottom: 18upx;
			background: #817e7e;
			color: #fff;
		}
	}

	.box textarea {
		padding-left: 5px;
	}

	.list .list-box {
		width: 25%;
		display: flex;
		align-items: center;
		flex-direction: column;
	}

	.luckbtn {
		-webkit-transform: rotateY(360deg);
		animation: rotation 0.4s linear infinite;
		-moz-animation: rotation 0.4s linear infinite;
		-webkit-animation: rotation 0.4s linear infinite;
		-o-animation: rotation 0.4s linear infinite;
	}

	@-webkit-keyframes rotation {
		from {
			-webkit-transform: rotateY(0deg);
		}

		to {
			-webkit-transform: rotateY(360deg);
		}
	}

	.bubble-bofang {
		position: absolute;
		right: 215upx;
	}

	.bubble-bofang-left {
		position: absolute;
		left: 215upx;
	}

	.showVedio {
		width: 100%;
		height: 100%;
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		z-index: 300;
	}

	.cloneBut {
		position: relative;
		text-align: right;
		font-size: 24px;
		color: red;
		margin-left: 10px;
		margin-top: 10px;
		height: 30px;
		width: 30px;
	}

	.cloneBut-img {
		position: absolute;
		width: 30px;
	}

	::-webkit-scrollbar {
		width: 0;
		height: 0;
		color: transparent;
	}

	.gong-gao-content {
		position: fixed;
		/*height: 30px;*/
		width: 100%;
		z-index: 2;
		/*padding: 10rpx 10rpx;*/
	}

	.gong-gao-content-info {
		display: flex;
		align-items: center;
		background-color: #e0e0e0;
		height: 100%;
	}

	.gong-gao-content-info-icon {
		font-size: 20px;
		margin-right: 20rpx;
		margin-left: 20rpx;
	}

	.sys:nth-child(1) {
		margin-top: 50px;
	}

	.member-image-logo {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		padding-top: 10px;
		box-shadow: inset 0px 15px 15px -23px #000;
		background-color: #ffffff;
		overflow-x: auto;
	}

	.member-content {
		white-space: nowrap;
		text-align: center;
	}

	.img-logo {
		width: 40px !important;
		height: 40px !important;
		border-radius: 10px;
		display: inline-block;
		padding: 0 5px;
	}

	.jiazai {
		margin-right: 20px;
	}

	.jiazai image {
		width: 40rpx;
		height: 40rpx;
	}
</style>