| | |
| | | {{ $t('historyMessage') }} |
| | | </div> |
| | | <ul class="flex flex-col pt-3"> |
| | | <li v-for="(item, index) in list" :key="item.id" class="flex flex-col my-3"> |
| | | <li v-for="(item) in list" :key="item.id" class="flex flex-col my-3"> |
| | | <!-- <p class="font-13 text-center py-2 text-grey font-15" v-if="showTime(index)">{{ |
| | | item.createtime && |
| | | item.createtime.split(' ')[0] |
| | |
| | | <div class="flex" :class="item.send_receive === 'send' ? 'justify-end' : ''"> |
| | | <template v-if="item.send_receive === 'receive'"> |
| | | <img src="@/assets/image/service/responser.png" class="w-10 h-10 mr-5" /> |
| | | <div class="responser px-18 py-8 font-15 left-chatBg"> |
| | | <div class="responser px-18 py-8 rounded-ban font-15 left-chatBg"> |
| | | <p class="break-word textColor font-15" style="max-width: 200px;" |
| | | v-if="item.content_type === 'text' || item.type === 'text'"> |
| | | {{ item.content }}</p> |
| | |
| | | <div class="py-8 px-18 rounded-ban flex flex-col right-chatBg" v-else> |
| | | <img :src="`${item.content}`" class="w-200 h-200" |
| | | v-if="item.content_type === 'img' || item.type === 'img'" @click="onPreview(item.content)" /> |
| | | <p class="break-word textColor font-15" v-else style="max-width: 200px;">{{ item.content }}</p> |
| | | <p class="break-word textColor2 font-15" v-else style="max-width: 200px;">{{ item.content }}</p> |
| | | </div> |
| | | </div> |
| | | </li> |
| | |
| | | .right-chatBg { |
| | | position: relative; |
| | | background: $color_main; |
| | | color: $text_color; |
| | | |
| | | &::after { |
| | | content: ''; |
| | |
| | | } |
| | | |
| | | .left-chatBg { |
| | | background: $input_background; |
| | | background: $bg_yellow; |
| | | } |
| | | </style> |