yuminge-app/yun-min-program-plugin-master/packageH/chitchat/chatWindow/chatWindow.wxml

296 lines
14 KiB
Plaintext

<!--packageH/chitchat/chatWindow/chatWindow.wxml-->
<view style="display:flex;flex-direction:column;overflow:hidden;padding-bottom:{{operation.safeBottom}}px">
<view class="no-connect" wx:if="{{currentReconnectNum >= maxReconnectNum}}">
<i class="el-icon-warning"></i>
<text>当前网络不可用</text>
</view>
<scroll-view
refresher-triggered="{{chatGetLoading}}"
bindrefresherrefresh="getChatList"
refresher-enabled="{{!chatFinished}}" class="chat-scroll" scroll-y="true" id="chatScroll" scroll-with-animation="{{scrollTopAnimation}}" bindtap="handPageTouchStart" bindscroll="floatDeFocus" scroll-into-view="{{scrollTopTarget}}" style="width: 100%;height:calc(100vh - {{operation.flag==true ? operation.height : operation.height+operation.safeBottom}}px);padding-top:{{currentReconnectNum >= maxReconnectNum ? '40px' : '0.5rem'}}">
<view class="no-more-message" wx:if="{{chatFinished}}">
<text>没有更多消息记录啦~</text>
</view>
<view class="conversation" id="listItem{{index}}" wx:for="{{chatList}}" wx:key="id">
<block wx:if="{{item.is_system_opt}}">
<view class="system-opt-message">{{ item.content }}</view>
</block>
<block wx:elif="{{item.is_backed}}">
<view class="system-opt-message">
<block wx:if="{{chatType == 2}}">
<view wx:if="{{item.direction_type === 0}}">您撤回了消息</view>
<view wx:if="{{item.direction_type === 1}}">{{ memberInfo.nickname }}撤回了消息</view>
</block>
<block wx:if="{{chatType == 1}}">
<view wx:if="{{item.direction_type === 0}}">{{ employeeInfo.nickname }}撤回了消息</view>
<view wx:if="{{item.direction_type === 1}}">您撤回了消息</view>
</block>
</view>
</block>
<block wx:elif="{{item._is_time}}">
<view class="system-opt-message">{{ item._message_time }}</view>
</block>
<block wx:else>
<view class="chat-msg my-msg" wx:if="{{(item.direction_type === 0 && chatType == 2) || (item.direction_type === 1 && chatType == 1)}}">
<view class="avater">
<block wx:if="{{item.direction_type === 0}}">
<van-image src="{{employeeInfo.avatar}}" width="2.281rem" height="2.281rem"></van-image>
</block>
<block wx:else>
<van-image src="{{memberInfo.avatar}}" width="2.281rem" height="2.281rem"></van-image>
</block>
</view>
<view class="content">
<view class="my-info" id="my-info-{{index}}" bindtap="handLongpress" data-item="{{item}}" data-index="{{index}}" >
<view wx:if="{{!item.id && !item.send_fail}}" class="send-msg-loading">
<!-- <image src='https://mini-app-img-1251768088.cos.ap-guangzhou.myqcloud.com/img_loading.gif' mode='widthFix' /> -->
<van-loading type="spinner" size="20px" />
</view>
<view class="txt">
<block wx:if="{{item.content_type == 1}}">
<chat-content-pic item="{{item}}" data-src="{{item.content}}" bindtap="viewPicture" />
</block>
<block wx:elif="{{item.content_type == 2}}">
<chat-content-goods item="{{item}}" />
</block>
<block wx:elif="{{item.content_type == 3}}">
<chat-content-order item="{{item}}" />
</block>
<block wx:else>
<chat-content-txt item="{{item}}" ></chat-content-txt>
</block>
</view>
<view wx:if="{{item.send_fail}}">
<chat-content-failed item="{{item}}" />
</view>
<view class="arrow-r"></view>
</view>
</view>
</view>
<view class="chat-msg other-msg" wx:else>
<view class="avater">
<block wx:if="{{item.direction_type === 0}}">
<van-image src="{{employeeInfo.avatar}}" width="2.281rem" height="2.281rem" />
</block>
<block wx:else>
<van-image src="{{memberInfo.avatar}}" width="2.281rem" height="2.281rem" />
</block>
</view>
<view class="content">
<view class="other-info">
<view class="txt">
<block wx:if="{{item.content_type == 1}}">
<chat-content-pic item="{{item}}" data-src="{{item.content}}" bindtap="viewPicture" />
</block>
<block wx:elif="{{item.content_type == 2}}">
<chat-content-goods item="{{item}}" />
</block>
<block wx:elif="{{item.content_type == 3}}">
<chat-content-order item="{{item}}" />
</block>
<block wx:else>
<chat-content-txt item="{{item}}" ></chat-content-txt>
</block>
</view>
<!-- <view wx:if="{{item.send_fail}}">
<ChatContentFailed item="{{item}}" />
</view> -->
<view class="arrow-l"></view>
</view>
</view>
</view>
</block>
</view>
<view wx:if="{{show_tool_bar==1}}" style="height:88rpx;"></view>
<view style="height:2px;" id="listItemBottom1"></view>
<view style="height:2px;" id="listItemBottom2"></view>
</scroll-view>
<view class="chat-footer" bindtap="floatDeFocus" style="bottom:0px;padding-bottom:{{operation.safeBottom}}px;box-sizing:content-box;height:{{operation.flag==true ? (operation.height-operation.safeBottom) : operation.height}}px;">
<view class="show_tool_bar" wx:if="{{show_tool_bar==1}}">
<view class="chat_tool_bars">
<view class="chat_tool_item" wx:for="{{chat_tool_bars}}" wx:key="id" data-item="{{item}}" bindtap="handClickChatToolBars" >{{item.name}}</view>
<view style="width:1rpx;flex-shrink: 0;height: 1rpx;"></view>
</view>
</view>
<view class="chat-opt-input">
<view class="chat-opt-input-box">
<view class="chat-opt-input-more-icon" bindtap="handClickAddIcon">
<van-icon name="add" size="30px" color="#fb4a4a" />
</view>
<view class="inputWrapper">
<input id="text_in" bindinput="handInput" maxlength="-1" hold-keyboard bindtap="bindClickInput" model:value="{{msgText}}" bindfocus="inputFocus" bindblur="inputBlur" adjust-position="{{false}}" class="edit-ipt" />
<view class="chat-opt-input-emoji-icon">
<view class="emoticon-con" catchtap="setEmotionFlag">
<van-icon name="smile-o" style="display:flex;align-items:center;" size="30px" color="#666" />
</view>
<view class="emotion-wrapper" wx:if="{{operation.emotion}}">
<div class="faces_content">
<view class="face-item" wx:for="{{emojiList}}" wx:key="id" bindtap="selectEmoji" data-item="{{item}}">
<image src="{{item.url}}" />
</view>
</div>
</view>
</view>
</view>
<view class="chat-opt-send-msg-btn" bindtap="sendMsgBtn">发送</view>
</view>
</view>
<view class="opet">
<view class="opetItem" wx:if="{{chat_opt_setting.pic == 1}}">
<image bindtap="selectImage" class="iconImg" src="https://mini-app-img-1251768088.cos.ap-guangzhou.myqcloud.com/chatWindowPic.png"></image>
<text>图片</text>
</view>
<view class="opetItem" bindtap="setGoodsPopupShow" wx:if="{{chat_opt_setting.goods == 1}}">
<image class="iconImg" src="https://mini-app-img-1251768088.cos.ap-guangzhou.myqcloud.com/chatWindowGoods.png"></image>
<text>商品</text>
</view>
<view class="opetItem" bindtap="setOrderPopupShow" wx:if="{{chat_opt_setting.order == 1}}">
<image class="iconImg" src="https://mini-app-img-1251768088.cos.ap-guangzhou.myqcloud.com/chatWindowOrder.png"></image>
<text>订单</text>
</view>
<view class="opetItem" bindtap="setReplyPopupShow" wx:if="{{chatType == 2 && chat_opt_setting.reply == 1}}">
<image class="iconImg" src="https://mini-app-img-1251768088.cos.ap-guangzhou.myqcloud.com/chatWindowQuick.png"></image>
<text>快捷回复</text>
</view>
<view class="opetItem" bindtap="setTransferPopupShow" wx:if="{{chatType == 2 && chat_opt_setting.transfer == 1}}">
<image class="iconImg" src="https://mini-app-img-1251768088.cos.ap-guangzhou.myqcloud.com/chatWindowTransfer.png"></image>
<text>转接客服</text>
</view>
</view>
</view>
</view>
<view wx:if="{{withdrawObj.show}}" class="withdraw {{withdrawObj.direction==0 ? 'up' :'down'}}" style="left:{{withdrawObj.left}}px;top:{{withdrawObj.top}}px;">
<view class="item" bindtap="backMsg">撤回</view>
</view>
<view class="sendGoods" wx:if="{{goodsObj.show}}" bindtap="bindSendGoods" style="bottom:{{operation.safeBottom+70}}px;">
<view class="tips">点击发送该商品</view>
<image src="{{goodsObj.info.thumb}}"></image>
<view class="price">
<text style="font-size:0.6rem;">¥</text>
{{ goodsObj.info.price }}
</view>
</view>
<van-popup show="{{goodsPopupShow}}" position="bottom" custom-style="height:80%;" bind:close="setGoodsPopupShow">
<view class="search-list-popup-con">
<view class="search-con">
<view class="input">
<input type="text" model:value="{{goodsSearchKwd}}" placeholder="搜索商品" />
<i class="iconfont icon-sousuo" bindtap="getGoodsList"></i>
</view>
</view>
<view class="list">
<view wx:for="{{goodsList}}" wx:key="id" class="goods-con">
<view class="goods-img">
<image src="{{item.thumb}}" ></image>
</view>
<view class="goods-txt">
<view class="goods-title">{{ item.title }}</view>
<view class="goods-price">¥{{ item.price }}</view>
</view>
<view class="goods-send">
<view class="goods-send-btn" data-item="{{item}}" bindtap="selectGoods">发 送</view>
</view>
</view>
</view>
</view>
</van-popup>
<van-popup show="{{orderPopupShow}}" position="bottom" custom-style="height:80%;" bind:close="setOrderPopupShow">
<view class="search-list-popup-con">
<view class="search-con">
<view class="input">
<input type="text" model:value="{{orderSearchKeyword}}" placeholder="搜索订单" />
<i class="iconfont icon-sousuo" bindtap="getOrderList"></i>
</view>
</view>
<view class="list">
<view wx:for="{{orderList}}" wx:key="id" class="order-con">
<view class="order-header">
<view class="order-no">订单号:{{ item.order_sn }}</view>
<view class="order-status">{{ item.status_name }}</view>
</view>
<view wx:for="{{item.has_many_order_goods}}" wx:for-item="goods_item" wx:key="goods_id" class="order-item-con">
<view class="order-goods-img">
<image src="{{goods_item.thumb}}" ></image>
</view>
<view class="order-item-txt">
<view class="order-goods-title">{{ goods_item.title }}</view>
<view class="order-goods-price">
<view class="order-goods-num">x{{ goods_item.total }}</view>
¥{{ goods_item.price }}
</view>
</view>
</view>
<view class="order-footer">
<view class="totle-txt">共 {{ item.goods_total }} 件商品 实付:¥{{ item.price }}</view>
<view>
<view class="send-btn" data-item="{{item}}" bindtap="selectOrder">发 送</view>
</view>
</view>
</view>
</view>
</view>
</van-popup>
<van-popup show="{{replyPopupShow}}" position="bottom" custom-style="height:80%;" bind:close="setReplyPopupShow">
<view class="search-list-popup-con">
<view class="search-con">
<view class="input">
<input type="text" model:value="{{replySearchKwd}}" placeholder="请输入标题" />
<i class="iconfont icon-sousuo" bindtap="getReplyList"></i>
</view>
</view>
<view class="list">
<view wx:for="{{replyList}}" wx:key="id" class="reply-con">
<view class="reply-txt">
<view class="reply-title">{{ item.title }}</view>
<view class="reply-content">{{ item.content }}</view>
</view>
<view class="reply-send">
<text class="reply-send-btn" data-item="{{item}}" bindtap="selectReply">发 送</text>
</view>
</view>
</view>
</view>
</van-popup>
<van-popup show="{{transferPopupShow}}" position="bottom" custom-style="height:80%;" bind:close="setTransferPopupShow">
<view class="search-list-popup-con">
<view class="search-con">
<view class="input">
<input type="text" model:value="{{transferSearchKwd}}" placeholder="请输入客服昵称或手机号" />
<i class="iconfont icon-sousuo" bindtap="getTransferEmployeeList"></i>
</view>
</view>
<view class="list">
<view wx:for="{{transferEmployeeList}}" wx:key="id" class="transfer-con">
<view class="transfer-avatar">
<image src="{{item.avatar}}"></image>
</view>
<view class="transfer-txt">
<view class>{{ item.nickname }}</view>
<view class>{{ item.has_one_member.mobile }}</view>
</view>
<view class="transfer-send">
<text class="transfer-send-btn" data-item="{{item}}" bindtap="selectTransfer">转 接</text>
</view>
</view>
</view>
</view>
</van-popup>