104 lines
2.7 KiB
Vue
104 lines
2.7 KiB
Vue
<template>
|
|
<view class="sent--text">
|
|
<input
|
|
class="input"
|
|
type="text"
|
|
:auto-blur="true"
|
|
:focus="focusState"
|
|
v-model="inputTxt"
|
|
confirm-type="send"
|
|
cursor-spacing="10"
|
|
@focus="focus"
|
|
@blur="blur"
|
|
@confirm="sent"
|
|
/>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import im from '@/utils/im/index.js'
|
|
import * as RongIMLib from '@/uni_modules/RongCloud-IMWrapper/js_sdk/index'
|
|
import imBase from '../../mixins/imBase.js'
|
|
|
|
export default {
|
|
mixins: [
|
|
imBase
|
|
],
|
|
props: {
|
|
conversationType: {
|
|
type: Number,
|
|
default: 0
|
|
},
|
|
targetId: {
|
|
type: String,
|
|
default: ''
|
|
}
|
|
},
|
|
computed: {
|
|
disabled() {
|
|
return this.inputTxt.length === 0
|
|
},
|
|
},
|
|
mounted() {
|
|
RongIMLib.getTextMessageDraft(this.conversationType, this.targetId, ({
|
|
draft
|
|
}) => {
|
|
draft ? this.inputTxt = draft : ''
|
|
})
|
|
},
|
|
beforeDestroy() {
|
|
// 保存草稿
|
|
RongIMLib.saveTextMessageDraft(this.conversationType, this.targetId, this.inputTxt)
|
|
},
|
|
data() {
|
|
return {
|
|
focusState: false,
|
|
inputTxt: ''
|
|
}
|
|
},
|
|
created(){
|
|
uni.$on('emojiValue', res => {
|
|
this.inputTxt = res.value
|
|
})
|
|
},
|
|
|
|
methods: {
|
|
sent() {
|
|
if (!this.disabled) {
|
|
im.sentText(this.conversationType, this.targetId, this.inputTxt, this.sender, () => {
|
|
RongIMLib.clearTextMessageDraft(this.conversationType, this.targetId)
|
|
this.$emit('success')
|
|
this.inputTxt = ''
|
|
})
|
|
}
|
|
},
|
|
focus() {
|
|
this.$emit('focus')
|
|
},
|
|
blur(e) {
|
|
uni.hideKeyboard()
|
|
this.$emit('blur', e.detail)
|
|
}
|
|
},
|
|
destroyed() {
|
|
uni.$off('emojiValue')
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.sent--text {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
.input {
|
|
background: #F3F6FB;
|
|
height: 70rpx;
|
|
width: 400rpx;
|
|
border-radius: 10rpx;
|
|
margin-right: 15rpx;
|
|
padding: 0 20rpx;
|
|
}
|
|
}
|
|
</style>
|