<import src="./chat-send-status.wxml"/>
<import src="./voice.wxml"/>
<template name="chat-word">
    <view style="width: 100%;display: flex;flex-direction: {{isMy?'row-reverse':'row'}};margin-bottom: {{index===length-1?150:20}}rpx;margin-top: 20rpx;">
        <image style="width: 70rpx;height: 70rpx;border-radius: 50%;margin-left: 15rpx;margin-right: 15rpx;"
               src="{{headUrl}}"/>
        <image wx:if="{{type==='text'||type==='voice'}}" class="chat-list-arrow-style"
               src="./../../image/chat/popu_{{isMy?'blue':'white'}}.png"/>
        <!-- 文本消息 -->
        <block wx:if="{{type==='text'}}">
            <view wx:if="{{type==='text'}}" class="{{isMy?'isMyWordStyle':'isOtherWordStyle'}}"
                  style="border-radius: 10rpx;padding: 20rpx;font-size: 30rpx;max-width: 60%;"
                  bindtap="chatTextItemClickEvent"
                  data-index="{{index}}">{{content}}
              </view>
        </block>

        <block wx:if="{{type==='image'}}">
            <image wx:if="{{type==='image'}}" class="chat-list-pic-style" src="{{content}}"
                   mode="aspectFill" bindtap="imageClickEvent" data-url="{{content}}"/>
        </block>

        <block wx:if="{{type==='voice'}}">
            <view style="width: {{(voiceDuration-1)*0.6+10}}%;border-radius: 10rpx;padding: 20rpx;font-size: 30rpx;max-width: 60%;display: flex;justify-content: {{isMy?'flex-end':'flex-start'}}"
                  class="{{isMy?'isMyWordStyle':'isOtherWordStyle'}}"
                  bindtap="chatVoiceItemClickEvent"
                  data-voice-path="{{content}}"
                  data-voice-duration="{{voiceDuration}}"
                  data-is-my="{{isMy}}"
                  data-index="{{index}}">
                <template is="voice-item" data="{{isMy:isMy,isPlaying:isPlaying}}"/>
            </view>
            <view class="voice-duration-style">{{voiceDuration}}"</view>
        </block>

        <block wx:if="{{isMy}}">
            <template is="chat-send-status" data="{{sendStatus:sendStatus,index:index}}"/>
        </block>

    </view>
</template>