You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1240 lines
61 KiB
1240 lines
61 KiB
<template>
|
|
<div class="footer-bar-input before-top" :class="[!associationalWord ? 'footer-overflow' : '', elder ? '' : '']">
|
|
<!-- 联想词 -->
|
|
<!-- <transition name="draw" v-show="associationalWord"> -->
|
|
<div class="associational-word-box" v-if="associationalWord">
|
|
<div class="word-cells" v-if="wordList.length > 0">
|
|
<a class="word-cell word-cell_access word-cell_example opacity" href="javascript:;"
|
|
v-for="(item, index) in wordList" :key="index" @click.stop="lenovoQuery(item.name)"
|
|
v-show="doesMatchMessage(item.name)">
|
|
<div class="word-cell__bd word-cell_primary">
|
|
<p v-html="brightenKeyword(item.name)"></p>
|
|
</div>
|
|
<span class="word-cell__ft"></span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- </transition> -->
|
|
<!-- 引用消息区块 -->
|
|
<div class="quote-preview-box" v-if="quoteMessageObj">
|
|
<div class="quote-text van-ellipsis">引用内容：{{ getQuotePreview(quoteMessageObj) }}</div>
|
|
<div class="quote-close-icon" @click="closeQuoteMessage">
|
|
<span style="
|
|
font-size: 18rem;
|
|
line-height: 1;
|
|
display: inline-block;
|
|
padding: 0 4rem;
|
|
color: #999;
|
|
">×</span>
|
|
</div>
|
|
</div>
|
|
<!-- 输入框模块 -->
|
|
<div class="input-box flex" :style="{ 'padding-bottom': isNewApp ? '15rem' : '' }">
|
|
<!-- <div class="input-box-margin"> -->
|
|
<div class="input-btn-box" style="padding-left: 0; padding-right: 10rem; display: flex; align-items: center"
|
|
v-if="isElder && asrData.switch == 1" @click="clickMicro">
|
|
<img src="@/assets/images/fill-microphone.png" alt="" />
|
|
</div>
|
|
<div class="input-box-txt">
|
|
<div v-if="!soundFlag" style="width: 100%">
|
|
<textarea class="input-txt" placeholder="有什么问题想要问我吗？" rows="1" ref="sendMessageArea" v-model="sendMessage"
|
|
@input.stop="monitorInputs" @blur.stop="monitorInputsBlur" @focus.stop="monitorInputsFocus($event)"
|
|
@keydown.delete="deleteFace($event)" is-pc="移动端" v-if="noTouchStop" :readonly="elderAndOutwork"></textarea>
|
|
|
|
<textarea class="input-txt" placeholder="有什么问题想要问我吗？" rows="1" ref="sendMessageArea" v-model="sendMessage"
|
|
@input.stop="monitorInputs" @blur.stop="monitorInputsBlur" @focus.stop="monitorInputsFocus($event)"
|
|
@keydown.delete="deleteFace($event)" @touchend.stop="clickInput" is-pc="移动端" v-else-if="!isPc"
|
|
:readonly="elderAndOutwork"></textarea>
|
|
|
|
<textarea class="input-txt" placeholder="有什么问题想要问我吗？" rows="1" ref="sendMessageArea" v-model="sendMessage"
|
|
@input.stop="monitorInputs" @blur.stop="monitorInputsBlur" @focus.stop="monitorInputsFocus($event)"
|
|
@keydown.delete="deleteFace($event)" @touchend.stop="clickInput" is-pc="pc端调试模式"
|
|
@keydown.stop="listenEnter($event)" required v-else :readonly="elderAndOutwork"></textarea>
|
|
</div>
|
|
|
|
<div v-else @click="clickMicro" style="width: 100%">
|
|
<voiceInput refNode="painSpotReason" ref="voiceInputRef" :content="sendMessage" :asrData="asrData"
|
|
@handleUpdateContent="onTTSContentUpdate" @isRecorderStart="isRecorderStart" @clickFinish="sayFinish">
|
|
</voiceInput>
|
|
</div>
|
|
|
|
<!-- <input
|
|
class="input-txt"
|
|
type="text"
|
|
placeholder="输入您想要问的问题吧～"
|
|
ref="sendMessageArea"
|
|
v-model="sendMessage"
|
|
@input="monitorInputs"
|
|
@focus.stop="monitorInputsFocus"
|
|
@blur.stop="monitorInputsBlur"
|
|
@keydown.delete="deleteFace"
|
|
@touchend.stop="clickInput"
|
|
@keyup.enter="lineFeed"
|
|
/>-->
|
|
<!-- <div class="input-box-middle">
|
|
|
|
</div> -->
|
|
<!-- <span v-show="!soundFlag" class="input-text-tips">{{ txtTips }}</span> -->
|
|
<div class="input-btn-box btn-box2" style="flex-shrink: 0">
|
|
<!-- <button class="btn-item opacity" v-if="!sendFlag" :class="addFlag ? 'add-box' : 'close-box'"
|
|
:disabled="sendDisabled || elderAndOutwork" @click.stop="addUpload()"></button> -->
|
|
<button class="btn-item opacity disabled-send-box" v-if="!sendFlag" :disabled="sendDisabled || elderAndOutwork"
|
|
@click.stop="clickSendMessage()"></button>
|
|
<button class="btn-item opacity send-box" v-if="sendFlag" :disabled="sendDisabled || elderAndOutwork"
|
|
@click.stop="clickSendMessage()"></button>
|
|
</div>
|
|
</div>
|
|
<!-- <div v-if="false" class="input-btn-box btn-box1">
|
|
<button
|
|
class="btn-item opacity"
|
|
:class="smileFlag ? 'smile-box' : 'keyboard-box'"
|
|
:disabled="smileDisabled || elderAndOutwork"
|
|
@click.stop="toggleShow()"
|
|
></button>
|
|
</div> -->
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 表情符号 -->
|
|
<!-- <transition name="draw"> -->
|
|
<emoticon-box class="smile-emoticon-box" :class="{ min_heightauto: !smileFlag }"
|
|
@onFaceChoose="handleFaceChoose"></emoticon-box>
|
|
<!-- </transition> -->
|
|
|
|
<upload-image :class="{ min_heightauto: !addFlag }" @image-selected="handleImageSelected"
|
|
@image-sent="handleImageSent" @image-failed="handleImageFailed"></upload-image>
|
|
|
|
<!-- <SoundRecord v-if="soundFlag" @clickFinish="sayFinish"></SoundRecord> -->
|
|
<!-- </div> -->
|
|
</template>
|
|
|
|
<script setup>
|
|
import {
|
|
ref,
|
|
computed,
|
|
watch,
|
|
inject,
|
|
onMounted,
|
|
onBeforeUnmount,
|
|
nextTick,
|
|
getCurrentInstance,
|
|
} from 'vue'
|
|
import { showToast } from 'vant'
|
|
import _ from 'lodash'
|
|
import uploadImage from '@/components/upload-image.vue'
|
|
import EmoticonBox from '@/components/emoticon-box.vue'
|
|
import voiceInput from '@/components/TTS.vue'
|
|
import { emitter } from '@/utils/mitt'
|
|
import utils from '@/utils/utils'
|
|
import { _debounce } from '@/utils'
|
|
import _Rules from '@/common/checkRules'
|
|
import faceJSON from '@/mock/face.json'
|
|
import mgcJSON from '@/mock/mgc.json'
|
|
import '@/assets/images/fill-microphone.png'
|
|
|
|
// Vue 2 中 this.$post / this.$xss 挂在全局属性上，<script setup> 中通过 globalProperties 获取
|
|
const { appContext } = getCurrentInstance()
|
|
const globalProps = appContext.config.globalProperties
|
|
const $post = globalProps.$post
|
|
const $xss = globalProps.$xss || ((v) => v)
|
|
|
|
// —— inject（对应原 Vuex mapState）——
|
|
const store = inject('appStore', null)
|
|
const userId = inject('userId', ref(''))
|
|
const sessionId = inject('sessionId', ref(''))
|
|
const sendLoading = inject('sendLoading', ref(false))
|
|
const source = inject('source', ref(''))
|
|
const mescrollContent = inject('mescrollContent', ref(null))
|
|
const chatList = inject('chatList', ref([]))
|
|
const manualService = inject('manualService', ref('1'))
|
|
const userInfo = inject('userInfo', ref({}))
|
|
const planCode = inject('planCode', ref(''))
|
|
const appentry = inject('appentry', ref(''))
|
|
const notitle = inject('notitle', ref(''))
|
|
const asrConfig = inject('asrConfig', ref({}))
|
|
const elder = inject('elder', ref(false))
|
|
|
|
// —— 模板引用 ——
|
|
const sendMessageArea = ref(null)
|
|
const voiceInputRef = ref(null)
|
|
|
|
// —— 响应式状态（原 data）——
|
|
const sendMessage = ref('') // 输入的内容
|
|
const smileFlag = ref(true)
|
|
const sendFlag = ref(false)
|
|
const addFlag = ref(true)
|
|
const smileDisabled = ref(false)
|
|
const sendDisabled = ref(false)
|
|
const associationalWord = ref(false) // 联想词
|
|
const cursorFirst = ref('') // 光标前一位的字符
|
|
const cursorIndex = ref(0) // 光标位置的索引
|
|
const leftBracketIndex = ref(0) // 右括号到左括号的索引
|
|
const isDeleteFace = ref(false) // 是否要删掉表情
|
|
const deleteFaceTxt = ref('') // 删除的表情
|
|
const wordList = ref([])
|
|
const oldMessage = ref('')
|
|
const facejson = faceJSON
|
|
const faceList = ref([])
|
|
const imageBoxShow = ref(false)
|
|
const onceClick = ref(0) // 初始化一次 只点击一次
|
|
const isPc = ref(false) // 是否pc
|
|
const emoticonClick = ref(false) // 当前点击的是否是表情
|
|
const txtMaxlength = ref(100)
|
|
const txtTips = ref(100)
|
|
const duolunFloat = ref(true) // 多轮的情况 o5 pdstart
|
|
const isNewApp = ref(false) // 是否寿险app
|
|
const startCursor = ref(0) // 连续表情输出处理
|
|
const endCursor = ref(0) // 连续表情输出处理
|
|
const noTouchStop = ref(false) // e办app上@touchend.stop会导致输入框需要长按才能输入
|
|
const showRecord = ref(true) // 是否显示录音按钮
|
|
const isRecording = ref(false) // 是否正在录音
|
|
const soundFlag = ref(false)
|
|
const asrData = ref({}) // asr入参
|
|
const lastMsg = ref('') // 语音转文字上一次返回的内容
|
|
const asrMsg = ref('') // 语音转文字所有内容
|
|
const currentMSg = ref('') // 点击语音转文字前输入框当前内容
|
|
const quoteMessageObj = ref(null)
|
|
let timer = null
|
|
|
|
const isElder = computed(() => !!elder.value) // 老年人关爱版
|
|
|
|
// 特定渠道 + 关爱版 + 非人工 时输入框只读
|
|
const elderAndOutwork = computed(() => {
|
|
return (
|
|
(source.value == '95290000' || source.value == '95460000' || source.value == '95830000') &&
|
|
isElder.value &&
|
|
manualService.value !== '2'
|
|
)
|
|
})
|
|
|
|
// —— 初始化（原 created）——
|
|
processedEmoji()
|
|
|
|
// 是否pc端（Vite 中用 import.meta.env.MODE 替代 process.env.NODE_ENV）
|
|
isPc.value = ['sit', 'development'].includes(import.meta.env.MODE)
|
|
|
|
// 是否寿险app
|
|
isNewApp.value = source.value == '95290000' && appentry.value == '1'
|
|
|
|
// e办app 养老金、b2bi渠道
|
|
noTouchStop.value = notitle.value === '1'
|
|
|
|
asrData.value = asrConfig.value || {}
|
|
|
|
// —— 生命周期（原 mounted）——
|
|
// 原 Bus.$on('quoteMessageBus')，迁移后统一走 mitt 的 quoteMessage 事件
|
|
function onQuoteMessage(item) {
|
|
quoteMessageObj.value = item
|
|
sendMessageArea.value && sendMessageArea.value.focus()
|
|
}
|
|
|
|
onMounted(() => {
|
|
emitter.on('quoteMessage', onQuoteMessage)
|
|
})
|
|
|
|
onBeforeUnmount(() => {
|
|
emitter.off('quoteMessage', onQuoteMessage)
|
|
if (timer) clearTimeout(timer)
|
|
})
|
|
|
|
// —— 方法（原 methods）——
|
|
// 表情处理
|
|
function processedEmoji() {
|
|
faceList.value = []
|
|
facejson.forEach((item, index) => {
|
|
for (let i = 0; i < item.faceList.length; i++) {
|
|
const element = `[${item.faceList[i].title}]`
|
|
faceList.value.push(element)
|
|
}
|
|
})
|
|
}
|
|
|
|
function isEmoji(face) {
|
|
var isFace = faceList.value.includes(face)
|
|
return isFace
|
|
}
|
|
|
|
function deleteFace(e) {
|
|
var elInput = sendMessageArea.value // 输入框最新的值
|
|
|
|
getHeight(elInput) // 处理删除时text的高度
|
|
|
|
emoticonClick.value = false
|
|
associationalWord.value = elInput.value.replace(/(^\s*)|(\s*$)/g, '') ? true : false
|
|
|
|
const startPos = elInput.selectionStart // input 第0个字符到选中的字符
|
|
const endPos = elInput.selectionEnd // 选中的字符到最后的字符
|
|
|
|
let afterEndPos = endPos
|
|
|
|
if (startPos === undefined || endPos === undefined) return
|
|
if (!elInput.value) return
|
|
|
|
if (elInput.setSelectionRange) {
|
|
if (isDeleteFace.value && leftBracketIndex.value != -1) {
|
|
let str = elInput.value
|
|
elInput.value = str.replace(/\[.*?\]/g, (item, index) => {
|
|
if (endPos === item.length + index && isEmoji(item)) {
|
|
e.preventDefault()
|
|
afterEndPos -= item.length
|
|
elInput.focus()
|
|
|
|
return ''
|
|
} else {
|
|
return item
|
|
}
|
|
})
|
|
elInput.selectionStart = afterEndPos
|
|
elInput.selectionEnd = afterEndPos
|
|
|
|
// 重置值
|
|
sendMessage.value = elInput.value
|
|
}
|
|
}
|
|
}
|
|
|
|
function clickInput() {
|
|
const elInput = sendMessageArea.value
|
|
const startPos = elInput.selectionStart // input 第0个字符到选中的字符
|
|
const endPos = elInput.selectionEnd // 选中的字符到最后的字符
|
|
|
|
onceClick.value++ // 点击次数
|
|
emoticonClick.value = false
|
|
|
|
scrollTopBody()
|
|
|
|
if (startPos === undefined || endPos === undefined) return
|
|
cursorIndex.value = startPos
|
|
cursorFirst.value = elInput.value.substring(startPos - 1, startPos)
|
|
|
|
// 截取光标之前的数据
|
|
const cursorBeforeTxt = elInput.value.substring(0, elInput.selectionStart)
|
|
isDeleteFace.value = cursorFirst.value != ']' ? false : true
|
|
if (cursorFirst.value != ']') return
|
|
|
|
const leftBracketIdx = cursorBeforeTxt.lastIndexOf('[') // 光标到左括号的索引
|
|
leftBracketIndex.value = leftBracketIdx
|
|
const deleteFaceTxt = cursorBeforeTxt.substring(leftBracketIdx, elInput.selectionStart + 1)
|
|
deleteFaceTxt.value = deleteFaceTxt
|
|
}
|
|
|
|
// 标签切换
|
|
function toggleShow() {
|
|
smileFlag.value = !smileFlag.value
|
|
imageBoxShow.value = true
|
|
addFlag.value = true
|
|
emoticonClick.value = false
|
|
soundFlag.value = false
|
|
|
|
scrollTopBody()
|
|
}
|
|
|
|
function scrollTopBody() {
|
|
setTimeout(() => {
|
|
// 滚动到底部
|
|
try {
|
|
mescrollContent.value.scrollTop = mescrollContent.value.scrollHeight || 0
|
|
} catch (error) {
|
|
console.log(error)
|
|
}
|
|
}, 300)
|
|
}
|
|
|
|
function listenEnter(event) {
|
|
const elInput = sendMessageArea.value
|
|
let elInputValue = $xss(elInput.value.replace(/(^\s*)|(\s*$)/g, ''))
|
|
|
|
if (event.keyCode == 13 && event.ctrlKey) {
|
|
elInput.value += '\n'
|
|
getHeight(elInput) // 处理删除时text的高度
|
|
} else if (event.keyCode == 13) {
|
|
// 避免回车键换行
|
|
event.preventDefault()
|
|
|
|
clickSendMessage() // 发送文本
|
|
}
|
|
}
|
|
|
|
// 发送消息
|
|
function clickSendMessage() {
|
|
// 包含敏感词不允许发送
|
|
if (sendMessage.value.includes('***')) {
|
|
showToast('有非法字符*，无法提交')
|
|
return
|
|
}
|
|
// 校验是否包含链接
|
|
if (_Rules.isContainsLink(sendMessage.value)) {
|
|
showToast('为了您的账号安全，请避免在消息中包含链接哦～')
|
|
return
|
|
}
|
|
const elInput = sendMessageArea.value
|
|
associationalWord.value = false
|
|
let elInputValue = $xss(elInput.value.replace(/(^\s*)|(\s*$)/g, ''))
|
|
|
|
if (!elInputValue) {
|
|
showToast({ message: '输入您想要问的问题吧～', position: 'bottom' })
|
|
return
|
|
}
|
|
|
|
if (sendFlag.value) {
|
|
let sendParmas = {
|
|
reqAndResType: '1', // 1文本 2图片 3问提评价
|
|
msgText: elInputValue,
|
|
msgSource: manualService.value, // 1机器人 2人工
|
|
}
|
|
if (quoteMessageObj.value) {
|
|
let quoteType = getQuoteType(quoteMessageObj.value)
|
|
let quoteMsg = ''
|
|
if (quoteType === '2') {
|
|
quoteMsg =
|
|
quoteMessageObj.value.imgUrl ||
|
|
quoteMessageObj.value.imgKey ||
|
|
quoteMessageObj.value.msgText ||
|
|
''
|
|
} else if (quoteType === '3') {
|
|
quoteMsg = quoteMessageObj.value.voiceUrl || ''
|
|
} else {
|
|
quoteMsg = getQuotePreview(quoteMessageObj.value)
|
|
}
|
|
sendParmas.quoteData = {
|
|
quoteMsg: quoteMsg,
|
|
quoteId: quoteMessageObj.value.chatId || '',
|
|
quoteType: quoteType,
|
|
}
|
|
closeQuoteMessage() // 清空状态
|
|
}
|
|
// 发送的消息 存到store
|
|
scrollTopBody()
|
|
sendFlag.value = !sendFlag.value
|
|
emoticonClick.value = false
|
|
sendMessage.value = ''
|
|
|
|
// 机器人走 /liics_api/semantic/qaChat，人工客服沿用 WebSocket。
|
|
const request = Number(manualService.value) === 2
|
|
? store?.sendmessageContent?.(sendParmas)
|
|
: store?.sendingRobot?.(sendParmas)
|
|
request?.then((res) => {
|
|
duolunFloat.value = !(res?.reqAndResType == '05' && res?.cmd == 'pbstart')
|
|
}).catch((err) => {
|
|
console.log(err)
|
|
})
|
|
}
|
|
}
|
|
|
|
function closeQuoteMessage() {
|
|
quoteMessageObj.value = null
|
|
}
|
|
|
|
function getQuotePreview(item) {
|
|
console.log('引用item====', item)
|
|
if (!item) return ''
|
|
if (item.voiceUrl || item.voiceNo) {
|
|
return '[语音]'
|
|
} else if (item.reqAndResType == '2' || item.imgUrl) {
|
|
return '[图片]'
|
|
} else {
|
|
let text = item.msgText || ''
|
|
return text.replace(/<[^>]+>/g, '') // 去除可能的 html 标签以纯文本展示
|
|
}
|
|
}
|
|
|
|
function getQuoteType(item) {
|
|
if (!item) return '1'
|
|
if (item.voiceUrl || item.voiceNo) {
|
|
return '3'
|
|
} else if (item.reqAndResType == '2' || item.imgUrl) {
|
|
return '2'
|
|
} else {
|
|
return '1'
|
|
}
|
|
}
|
|
|
|
// 选择的表情处理
|
|
function handleFaceChoose(face) {
|
|
nextTick(() => {
|
|
const elInput = sendMessageArea.value
|
|
startCursor.value = elInput.selectionStart || startCursor.value // input 第0个字符到选中的字符
|
|
endCursor.value = elInput.selectionEnd || endCursor.value // 选中的字符到最后的字符
|
|
|
|
emoticonClick.value = true
|
|
if (startCursor.value === undefined || endCursor.value === undefined) return
|
|
const txt = elInput.value
|
|
if (_.isEmpty(txt)) {
|
|
startCursor.value = 0
|
|
endCursor.value = 0
|
|
}
|
|
// 将表情添加到选中的光标位置
|
|
let result = txt.substring(0, startCursor.value) + face + txt.substring(endCursor.value)
|
|
|
|
sendMessage.value = result // 赋值给表单中的的字段，先赋值防止安卓端watch监听不到变化
|
|
elInput.value = result // 赋值给input的value
|
|
|
|
smileFlag.value = false
|
|
sendFlag.value = true // 添加表情成功改成发送按钮
|
|
|
|
// 重新定义光标位置
|
|
startCursor.value = startCursor.value + face.length
|
|
endCursor.value = endCursor.value + face.length
|
|
// 删除时用的处理
|
|
cursorIndex.value = startCursor.value
|
|
cursorFirst.value = elInput.value.substring(startCursor.value - 1, startCursor.value)
|
|
|
|
// 截取光标之前的数据
|
|
const cursorBeforeTxt = elInput.value.substring(0, startCursor.value)
|
|
isDeleteFace.value = cursorFirst.value != ']' ? false : true
|
|
if (cursorFirst.value != ']') return
|
|
const leftBracketIdx = cursorBeforeTxt.lastIndexOf('[') // 光标到左括号的索引
|
|
leftBracketIndex.value = leftBracketIdx
|
|
deleteFaceTxt.value = cursorBeforeTxt.substring(leftBracketIdx, startCursor.value + 1)
|
|
})
|
|
}
|
|
|
|
// 上传图片：底部滑出图片/拍照面板
|
|
function addUpload() {
|
|
smileFlag.value = true
|
|
emoticonClick.value = false
|
|
imageBoxShow.value = true
|
|
addFlag.value = !addFlag.value
|
|
scrollTopBody()
|
|
}
|
|
|
|
function handleImageSelected(payload) {
|
|
store?.pushImageMessage?.(payload)
|
|
scrollTopBody()
|
|
}
|
|
|
|
function handleImageSent(payload) {
|
|
store?.updateImageMessage?.(payload.localId, {
|
|
imageUrl: payload.imageUrl,
|
|
imageKey: payload.imageKey,
|
|
uploadStatus: 'success',
|
|
})
|
|
// liics upload/image returns the follow-up conversation record in res.data.
|
|
// Keep it in the chat list after updating the local image bubble.
|
|
if (payload.responseData) {
|
|
store?.setChatList?.(payload.responseData)
|
|
}
|
|
addFlag.value = true
|
|
imageBoxShow.value = false
|
|
scrollTopBody()
|
|
}
|
|
|
|
function handleImageFailed(payload) {
|
|
store?.updateImageMessage?.(payload.localId, { uploadStatus: 'failed' })
|
|
}
|
|
|
|
// input焦点事件
|
|
function monitorInputsFocus(e) {
|
|
const elInput = sendMessageArea.value
|
|
associationalWord.value = elInput.value ? true : false
|
|
|
|
if (utils.isAndroid() == 'isAndroid') {
|
|
smileFlag.value = true
|
|
addFlag.value = true
|
|
|
|
setTimeout(() => {
|
|
e.target.scrollIntoView(true)
|
|
e.target.scrollIntoViewIfNeeded()
|
|
// true:元素的顶端将和其所在滚动区的可视区域的顶端对齐; false:底端对齐。
|
|
}, 300) // 延时 == 键盘弹起需要时间
|
|
} else {
|
|
if (!emoticonClick.value) {
|
|
smileFlag.value = true
|
|
}
|
|
|
|
// 控制初始化点击输入框 被输入法挡着问题
|
|
setTimeout(() => {
|
|
addFlag.value = true
|
|
|
|
e.target.scrollIntoView(true)
|
|
e.target.scrollIntoViewIfNeeded()
|
|
|
|
// true:元素的顶端将和其所在滚动区的可视区域的顶端对齐; false:底端对齐。
|
|
}, 300) // 延时 == 键盘弹起需要时间
|
|
}
|
|
}
|
|
|
|
// input 失去焦点
|
|
function monitorInputsBlur() {
|
|
emoticonClick.value = false
|
|
const elInput = sendMessageArea.value
|
|
|
|
// this.associationalWord = false;
|
|
// this.smileFlag = true;
|
|
// this.addFlag = true;
|
|
resilience()
|
|
}
|
|
|
|
function changeMaxLength() {
|
|
if (sendMessage.value.length > txtMaxlength.value) {
|
|
sendMessage.value = sendMessage.value.slice(0, txtMaxlength.value)
|
|
sendMessageArea.value.setAttribute('maxlength', txtMaxlength.value)
|
|
|
|
// showToast(`不能超过${txtMaxlength.value}个字`)
|
|
} else {
|
|
sendMessageArea.value.removeAttribute('maxlength')
|
|
}
|
|
|
|
txtTips.value = txtMaxlength.value - sendMessage.value.length
|
|
}
|
|
|
|
// input正在输入
|
|
function monitorInputs(e) {
|
|
// 处理表情字符串的问题
|
|
const elInput = sendMessageArea.value
|
|
const startPos = elInput.selectionStart // input 第0个字符到选中的字符
|
|
const endPos = elInput.selectionEnd // 选中的字符到最后的字符
|
|
// 敏感词替换为***
|
|
let mgc = mgcJSON.mgc
|
|
const words = _Rules.replaceTaboo(mgc, sendMessage.value)
|
|
sendMessage.value = words
|
|
|
|
// 处理光标问题
|
|
if (startPos === undefined || endPos === undefined) return
|
|
cursorIndex.value = startPos
|
|
cursorFirst.value = elInput.value.substring(startPos - 1, startPos)
|
|
|
|
// 截取光标之前的数据
|
|
const cursorBeforeTxt = elInput.value.substring(0, elInput.selectionStart)
|
|
isDeleteFace.value = cursorFirst.value != ']' ? false : true
|
|
|
|
const leftBracketIdx = cursorBeforeTxt.lastIndexOf('[') // 光标到左括号的索引
|
|
leftBracketIndex.value = leftBracketIdx
|
|
deleteFaceTxt.value = cursorBeforeTxt.substring(leftBracketIdx, elInput.selectionStart + 1)
|
|
}
|
|
|
|
// 关键字加高亮
|
|
function brightenKeyword(val) {
|
|
let titleString = val
|
|
let keyword = sendMessage.value
|
|
if (titleString.length <= 0) {
|
|
return ''
|
|
}
|
|
|
|
var reg = new RegExp(keyword, 'gi')
|
|
val = val.replace(reg, function (txt) {
|
|
return '<font color=#FC5454>' + txt + '</font>'
|
|
})
|
|
|
|
return val
|
|
}
|
|
|
|
function doesMatchMessage(item) {
|
|
const elInput = sendMessage.value.toLowerCase()
|
|
item = item.toLowerCase()
|
|
|
|
if (item && item.indexOf(elInput) > -1) {
|
|
return true
|
|
}
|
|
return false
|
|
}
|
|
|
|
function offEmoticonsPic() {
|
|
if (!smileFlag.value || !addFlag.value || associationalWord.value) {
|
|
emoticonClick.value = false
|
|
smileFlag.value = true
|
|
addFlag.value = true
|
|
associationalWord.value = false
|
|
}
|
|
}
|
|
|
|
// 输入框高度
|
|
function getHeight(element) {
|
|
if (!element) return
|
|
timer = setTimeout(() => {
|
|
element.style.height = 'auto' // 必须设置为auto
|
|
element.style.height = element.scrollHeight + 'px'
|
|
}, 20)
|
|
}
|
|
|
|
// 解决微信输入框顶上去下不来问题
|
|
function resilience() {
|
|
setTimeout(() => {
|
|
var scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0
|
|
window.scrollTo(0, Math.max(scrollHeight - 1, 0))
|
|
}, 150)
|
|
}
|
|
|
|
// 点击联想词查询
|
|
function lenovoQuery(item) {
|
|
const sendParmas = {
|
|
reqAndResType: '1',
|
|
msgText: item,
|
|
msgSource: manualService.value,
|
|
questionType: 3,
|
|
}
|
|
|
|
// 发送的消息 存到store
|
|
scrollTopBody()
|
|
store?.sendingRobot?.(sendParmas).then(() => {
|
|
associationalWord.value = false
|
|
sendFlag.value = false
|
|
sendMessage.value = ''
|
|
}).catch((err) => {
|
|
console.log(err)
|
|
})
|
|
}
|
|
|
|
// 实时获取联想词
|
|
const getAssociationalWord = _debounce(function () {
|
|
let param = {
|
|
category: 5,
|
|
source: source.value,
|
|
planCode: planCode.value,
|
|
keyWord: sendMessage.value,
|
|
sceneId: (userInfo.value && userInfo.value.sceneId) || '',
|
|
}
|
|
|
|
if (!sendMessage.value) {
|
|
return
|
|
}
|
|
|
|
$post('config/activity', param)
|
|
.then((res) => {
|
|
if (res.code && res.code != 0) {
|
|
wordList.value = ''
|
|
return
|
|
}
|
|
|
|
wordList.value = res.data
|
|
})
|
|
.catch((error) => {
|
|
wordList.value = ''
|
|
console.log(error)
|
|
})
|
|
}, 200)
|
|
|
|
function recordShow() {
|
|
showRecord.value = !showRecord.value
|
|
smileFlag.value = true
|
|
}
|
|
|
|
// 点击完成
|
|
function sayFinish(num) {
|
|
soundFlag.value = true
|
|
}
|
|
|
|
// 成功调用录音
|
|
function isRecorderStart(isStart) {
|
|
if (isStart) {
|
|
soundFlag.value = false
|
|
} else {
|
|
soundFlag.value = true
|
|
}
|
|
}
|
|
|
|
function clickMicro() {
|
|
console.log('点击了麦克风')
|
|
lastMsg.value = sendMessage.value
|
|
asrMsg.value = ''
|
|
smileFlag.value = true
|
|
soundFlag.value = !soundFlag.value
|
|
}
|
|
|
|
// TTS 语音识别内容回填（替代原 :content.sync）
|
|
function onTTSContentUpdate(val) {
|
|
sendMessage.value = val
|
|
}
|
|
|
|
// 暴露给父组件通过 ref 调用（如 footer-bar.vue 的 offEmoticonsPictures）
|
|
defineExpose({
|
|
offEmoticonsPic,
|
|
})
|
|
|
|
// —— watch（原 sendMessage 侦听器）——
|
|
watch(sendMessage, (newValue, oldValue) => {
|
|
oldMessage.value = oldValue
|
|
|
|
const elInput = sendMessageArea.value
|
|
|
|
getHeight(elInput)
|
|
|
|
sendFlag.value = newValue ? true : false
|
|
addFlag.value = true
|
|
associationalWord.value = newValue ? true : false
|
|
|
|
// 联想词 人工时不调用联想词
|
|
if (elInput && elInput.value && manualService.value != 2) {
|
|
if (duolunFloat.value) {
|
|
getAssociationalWord()
|
|
} else if (chatList.value[chatList.value.length - 1]?.cmd == 'pbend') {
|
|
// 防止用户点击的时候， 状态没有更新
|
|
duolunFloat.value = true
|
|
getAssociationalWord()
|
|
} else {
|
|
associationalWord.value = false
|
|
}
|
|
}
|
|
|
|
changeMaxLength()
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
.footer-bar-input {
|
|
position: relative;
|
|
}
|
|
|
|
.footer-overflow {
|
|
overflow: hidden;
|
|
}
|
|
|
|
.associational-word-box {
|
|
width: 100%;
|
|
height: auto;
|
|
position: absolute;
|
|
top: 1rem;
|
|
left: 0;
|
|
z-index: 10;
|
|
-ms-transform: translate(0, -100%);
|
|
-webkit-transform: translate(0, -100%);
|
|
transform: translate(0, -100%);
|
|
background: #ffffff;
|
|
box-shadow: 0 -3rem 4rem 0 #eef2f8;
|
|
border-radius: 18rem 18rem 0 0;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.input-box {
|
|
padding: 9.5rem 10rem 9.5rem 15rem;
|
|
min-height: 54rem;
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
align-content: flex-start;
|
|
align-items: center;
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
background-color: #ebf1ff;
|
|
}
|
|
|
|
.input-box-txt {
|
|
width: 100%;
|
|
height: auto;
|
|
min-height: 10rem;
|
|
line-height: 10rem;
|
|
border-radius: 30rem;
|
|
padding: 7.5rem 20rem 7.5rem 15rem;
|
|
vertical-align: middle;
|
|
margin-right: 5rem;
|
|
-webkit-box-sizing: content-box;
|
|
box-sizing: content-box;
|
|
user-select: text;
|
|
-webkit-user-select: text;
|
|
-webkit-box-flex: 1;
|
|
-ms-flex: 1;
|
|
flex: 1;
|
|
position: relative;
|
|
overflow: hidden;
|
|
display: flex;
|
|
align-items: flex-end;
|
|
background: linear-gradient(111deg, #dcfcff 0%, #ffffffbf 12%, #ffffff 38%);
|
|
box-sizing: border-box;
|
|
/* border: 1.2px solid; */
|
|
border-image: linear-gradient(99deg, #ffffff 4%, #ffffff 88%) 1.2;
|
|
backdrop-filter: blur(14px);
|
|
box-shadow: 0px 4px 10px 0px rgba(181, 189, 216, 0.3);
|
|
|
|
z-index: 0;
|
|
}
|
|
|
|
.input-text-tips {
|
|
position: absolute;
|
|
bottom: 7.5rem;
|
|
right: 5rem;
|
|
font-size: 9rem;
|
|
color: #999;
|
|
line-height: 20rem;
|
|
}
|
|
|
|
.input-box-middle {
|
|
display: table-cell;
|
|
min-height: 20rem;
|
|
line-height: 20rem;
|
|
vertical-align: middle;
|
|
height: 100%;
|
|
margin: 7.5rem auto;
|
|
}
|
|
|
|
.input-txt {
|
|
box-sizing: border-box;
|
|
width: 100%;
|
|
/* height: 20rem; */
|
|
max-height: 80rem;
|
|
line-height: 20rem;
|
|
border: 0;
|
|
background: transparent;
|
|
border-radius: 2rem;
|
|
font-family: SourceHanSansCN-Normal;
|
|
font-size: 14rem;
|
|
color: #333;
|
|
letter-spacing: 0;
|
|
text-align: justify;
|
|
vertical-align: middle;
|
|
caret-color: #1988fe;
|
|
border: none;
|
|
resize: none;
|
|
overflow: hidden;
|
|
overflow-y: auto;
|
|
word-break: break-all;
|
|
-webkit-appearance: none;
|
|
-webkit-user-select: text;
|
|
-moz-user-select: text;
|
|
-ms-user-select: text;
|
|
user-select: text;
|
|
-webkit-overflow-scrolling: touch;
|
|
}
|
|
|
|
textarea:-moz-placeholder,
|
|
textarea:-webkit-input-placeholder,
|
|
textarea:-ms-input-placeholder {
|
|
font-family: SourceHanSansCN-Normal;
|
|
font-size: 14rem;
|
|
color: #b5bace;
|
|
letter-spacing: 0;
|
|
text-align: justify;
|
|
}
|
|
|
|
/* .input-txt::selection{
|
|
background-color: transparent;
|
|
} */
|
|
|
|
.input-btn-box {
|
|
width: 30rem;
|
|
height: 30rem;
|
|
padding: 0 5rem;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.input-btn-box .btn-box1 {
|
|
-ms-flex-negative: 0;
|
|
flex-shrink: 0;
|
|
-webkit-box-flex: 0;
|
|
-ms-flex-positive: 0;
|
|
flex-grow: 0;
|
|
}
|
|
|
|
.input-btn-box .btn-box2 {
|
|
-ms-flex-negative: 1;
|
|
flex-shrink: 1;
|
|
-webkit-box-flex: 1;
|
|
-ms-flex-positive: 1;
|
|
flex-grow: 1;
|
|
}
|
|
|
|
.btn-item {
|
|
display: block;
|
|
width: 28rem;
|
|
height: 28rem;
|
|
margin: 0 auto;
|
|
transition: transform 0.5s;
|
|
-moz-transition: -moz-transform 0.5s;
|
|
-webkit-transition: -webkit-transform 0.5s;
|
|
-o-transition: -o-transform 0.5s;
|
|
}
|
|
|
|
.btn-item:disabled {
|
|
opacity: 0.5;
|
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
|
}
|
|
|
|
.smile-box {
|
|
background: url('data:image/png;base64,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') no-repeat center;
|
|
background-size: 100% auto;
|
|
}
|
|
|
|
.keyboard-box {
|
|
background: url('data:image/png;base64,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') no-repeat center;
|
|
background-size: 100% auto;
|
|
}
|
|
|
|
.send-box {
|
|
background: url('data:image/png;base64,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') no-repeat center;
|
|
background-size: 100% 100%;
|
|
border: 0;
|
|
}
|
|
.disabled-send-box {
|
|
background: url('data:image/png;base64,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') no-repeat center;
|
|
background-size: 100% 100%;
|
|
border: 0;
|
|
}
|
|
|
|
.close-box {
|
|
background: url('../assets/images/add-icon.png') no-repeat center;
|
|
background-size: 100% auto;
|
|
transform: rotate(135deg);
|
|
-webkit-transform: rotate(135deg);
|
|
-moz-transform: rotate(135deg);
|
|
-o-transform: rotate(135deg);
|
|
border: 0;
|
|
}
|
|
|
|
.add-box {
|
|
background: url('../assets/images/add-icon.png') no-repeat center;
|
|
background-size: 100% auto;
|
|
border: 0;
|
|
}
|
|
|
|
.smile-emoticon-box {
|
|
min-height: 0;
|
|
height: 0;
|
|
background-color: #efefef;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.smile-emoticon-box.min_heightauto {
|
|
min-height: 245rem;
|
|
}
|
|
|
|
.upload-image {
|
|
min-height: 0;
|
|
height: 0;
|
|
background-color: #fff;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.upload-image.min_heightauto {
|
|
min-height: 123rem;
|
|
}
|
|
|
|
.draw-enter-active,
|
|
.draw-leave-active {
|
|
transition: all 0.4s ease;
|
|
}
|
|
|
|
.draw-enter,
|
|
.draw-leave-to {
|
|
height: 0;
|
|
}
|
|
|
|
.word-cells {
|
|
background-color: #ffffff;
|
|
line-height: 23rem;
|
|
font-size: 15rem;
|
|
overflow: hidden;
|
|
position: relative;
|
|
}
|
|
|
|
.word-cell_access {
|
|
-webkit-tap-highlight-color: rgba(255, 255, 255, 0.3);
|
|
color: inherit;
|
|
}
|
|
|
|
.word-cell {
|
|
padding: 0 15rem 0 18rem;
|
|
position: relative;
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-webkit-align-items: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.word-cell:before {
|
|
content: ' ';
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
right: 0;
|
|
height: 1rem;
|
|
border-top: 1rem solid rgba(0, 0, 0, 0.1);
|
|
color: rgba(0, 0, 0, 0.1);
|
|
-webkit-transform-origin: 0 0;
|
|
transform-origin: 0 0;
|
|
-webkit-transform: scaleY(0.5);
|
|
transform: scaleY(0.5);
|
|
left: 16rem;
|
|
z-index: 2;
|
|
}
|
|
|
|
.word-cell:first-child::before {
|
|
border: 0;
|
|
}
|
|
|
|
.word-cell_example:before {
|
|
left: 18rem;
|
|
}
|
|
|
|
.word-cell_access .word-cell__ft {
|
|
padding-right: 15rem;
|
|
position: relative;
|
|
}
|
|
|
|
.word-cell__bd {
|
|
-webkit-box-flex: 1;
|
|
-webkit-flex: 1;
|
|
flex: 1;
|
|
}
|
|
|
|
.word-cell__bd p {
|
|
height: 47rem;
|
|
text-align: left;
|
|
font-family: SourceHanSansCN-Regular;
|
|
font-size: 15rem;
|
|
color: #717985;
|
|
line-height: 47rem;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.word-cell_primary {
|
|
-webkit-box-align: start;
|
|
-webkit-align-items: flex-start;
|
|
align-items: flex-start;
|
|
width: 100%;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.word-cell__ft {
|
|
text-align: right;
|
|
color: rgba(0, 0, 0, 0.5);
|
|
}
|
|
|
|
.word-cell_access .word-cell__ft:after {
|
|
content: ' ';
|
|
width: 12rem;
|
|
height: 24rem;
|
|
mask-position: 0 0;
|
|
mask-repeat: no-repeat;
|
|
mask-size: 100%;
|
|
background-color: currentColor;
|
|
color: rgba(0, 0, 0, 0.3);
|
|
mask-image: url(data:image/svg+xml,%3Csvg%20width%3D%2212%22%20height%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2.454%206.58l1.06-1.06%205.78%205.779a.996.996%200%20010%201.413l-5.78%205.779-1.06-1.061%205.425-5.425-5.425-5.424z%22%20fill%3D%22%23B2B2B2%22%20fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E);
|
|
position: absolute;
|
|
top: 50%;
|
|
right: 0;
|
|
margin-top: -12rem;
|
|
}
|
|
|
|
.elder-wrapper .associational-word-box {
|
|
box-shadow: 0 -4rem 16rem 0 rgba(25, 28, 104, 0.1);
|
|
}
|
|
|
|
.elder-wrapper .associational-word-box .word-cell__bd p {
|
|
font-family: PingFangSC-Regular;
|
|
font-size: 20rem;
|
|
color: #2c3562;
|
|
letter-spacing: 0;
|
|
}
|
|
|
|
.elder-wrapper .input-txt {
|
|
font-family: PingFangSC-Medium;
|
|
font-size: 16rem;
|
|
color: #2c3562;
|
|
letter-spacing: 0;
|
|
height: 26rem;
|
|
max-height: 104rem;
|
|
line-height: 26rem;
|
|
}
|
|
|
|
.elder-wrapper .input-box {
|
|
align-items: center;
|
|
}
|
|
|
|
.elder-wrapper .input-box .btn-item {
|
|
width: 36rem;
|
|
height: 36rem;
|
|
}
|
|
|
|
.elder-wrapper .input-btn-box {
|
|
width: 36rem;
|
|
height: 40rem;
|
|
padding: 2.5rem 5rem 0 5rem;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.elder-wrapper .input-box .smile-box {
|
|
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGwAAABsCAYAAACPZlfNAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAbKADAAQAAAABAAAAbAAAAAD529oeAAAQDklEQVR4Ae1dfYwV1RWfO293wbUrlhLE+EFjqKQWVmADywo2K1EIMaalKdL0w6QsYsGaWG3TpJoWjTZpqzSpFRRYtNQ/qrS1iX9Y1K7bFrrsIqALlaAbg6itWLTC1gV2983t7zfvPXj75tz35uu93YWZZPfNnHvuOef+zsyde+/ce65lJUeCQIJAgkCCQIJAgkCCQIJAgkCCQIJAgkCCQIJAgsDZgoAajQVpuGllbfp9faVO6amO1lO1tqZY2roQZalTyqrjb7ZcvUjrxXmvpayPkdZjK3VQpdXB1CT1xu7nNvRl+UbNz6hwWGPjHRec1Ce/6FjOAm3pBXBOPRCOaruGhG5lqTbbstvGqrF/6+x85PhI91zUQpetfM3Nqz/1UV//V+CgWyxLN+NJSZVNGb2vrDT+t8OBW8bX1vyxvX3d/8qpL6zsEeew6XOWN1larYaTlmjLOj9swaLkAyifwHnPWkqv29e1uSOKrLjzjhiH1c9ZgerOuQdP0oK4CxlFHp68NmXZD3Z3bWqLIieuvMPusBlNt16TTjsPa63nxlWocshRSu1Mpey7X+3Y+I9yyPcrc9gc1tC8ckJ/X/pncNS3YWwIO9RhVFkHbGUdRPaDkPCObaneNFqFtlZsGVqO0nUptBodS9ehoXIZqlm0Kq2pqHI/j/PL/YKUx6fhuCdqalM/3N2+4WgevWKnIYCKbtu0xpblAPAXltbjfUtT1vvgfQFOaauuSb28e/uGw77zCowN81dePtCfvg7OZBW8EPZMEthkklIf4Qb5wf7O1s0yQ/moFXXYvHnL6471q424u5f5KRJabH0A5k9KW7+d+tlFL27dejNacvEfS5c+kzp4aNsNWlnfguO+jJZprT8t6ulxNfrWHTs2u0+0vzzRuCrmsKubWmam09YzeKqmlDIZL/oPUM2trVW16yvdN2Kfr0/3rcJNdRcaQBNL2Yr+QE8qZd38Wkfr3pK8MTBUxGH1jSu+6jj6KYAwppjNeD8c0Vr9tK6qbmNHxy9PFOMtd1pT0/fO6x3svVUp/SO8Zy8qrk+dsm31ze7OTb8vzhc9tewOq5+9YhXeE7+Gs2yTudlO6/qaC1L37n5pwzET33DQG65fOa7/ePoB2L+qeOddOXi/frd716b15bSzrA5D32qNo52fFCsA3lN77SqrpVJVSjFbiqWxSncGrVa832YW47OVfR/6bGuK8URJK9twjx9n4T217rIJtTdvf/mxd6MUohJ5j7y79/2Gq+c/ebxvkC3b2SadcGjzpEsb1JH39rSbeKLQy/KEZapBZ53RMKV6obhlX1frViPPCE6YPqdlKYbNWtGAyn0V8FiLAeXV5ageY3dYtoHxtOmdxRagsqsWd+/csMdTylFEqJ+7cpZ2Bp83tyTxTrPVsrgbIrE6zG26D1oYLJVbg1D2VnWVWrSno7VnFPnGaOqsppYpA4N6G562K2QmdSpVZTXF+X42ttxkA8xUdordflYRZ9WMrZp/tjiLSLAsLBNvRBkZPYaYEBs5PTg1Noe5IxiGTjGrQT5Zu/++4d/BTRzZOVgmli3T2RdsBSaZ0R0hLQQpFoe5Y4Om4SY2MPDOOpuerEKcWTaWEaMehiEqvSyDUWHO4NeR32EcdT/Vlz5oGsi1bXtp3C/e4MWsTA639aj1M6I2DBiPqU1NjTrKH/kJ4ycSk7PYzzpXnEUnZbopSu7O4MuEi5XoTf/ESA7jx8fs9yyPRo5goFN8lyfhLCewzCy7VExiRcykNL+0SA7jl2Io8lSrHBvkcNPzzz9yyq8hZwsfy8yyEwOhTCqLmZDkjxTaYe4cDONnfbU+zr6Hv6KMHK5M2ZU4CIynbC6xC2ttaIdhBP5eSSk/kXDUXUo7l2jEgFhIZeZkI4nuhxbKYZmpaPo6SQEGPx8caZ9IJDvLTSMGxELSw5lhLoZSYglaKIdl5g16JbPzWJcat8mbcm5SiIW5Q825l8GPwA7jjFyMFS6RVam1w/2lWLZreKgZLNRaWbteksFSTjVRAzssM33aOyOXE2Y4B8Ok6FylExNiU1h+zmomloX0UteBHYZ6+RZRKGY3VXrCjGjHCCO6mAAbySwjlhJzlhbIYZxRhOqwWZKHD3ZbJHpCsywzNro5g6l/lAI5jEt+xIkomOR55eQbXvKv9tzidLHJTIQdUnBiSUyHEEtcBHIY12cZ5L0Q1yTPpUvX1MT5/chgb0kybaAtJRl9MGSxeUFiLYKpxI6nNcCBOld0GKdPBxAjss5ovvPC6XNWPHXg0OHeY/3WsWmzl++Y2XjbVSJzGYnUSd20gbbQJtoWVaUJIxOmJn2+HcZlqpjGzJWPnoNz3T3EgIR0X++TWjvfQDbe1RyfvGbAGfhz0Do+oNoh7NRFndSNP9pQQ5toG84jHUaMgKmLrU/pvh3GNcWQ6RnoBelw5IUJ1668GGNsXxJsvuyEPnGjQC8LKasLq1yGHrStATYOpQa7ymCEFTfeQ2Wx9aYIFN8O4wJwIT/8pQ+I9ABE55SaaGRX2pxmzBQyoYiuojb6VWfAyoitINe3w7haX8hvZdZnSSn+aVMmX3wAn9c/knJA7w6JXg6aURdsc22MqNSElQlbSZ1vh6EJalh1gsV0EY+tW9f020qvhJj+fFG2bT28v2vzK/m0cp5TF3UW6HBto40F9BCXMlZmbL0qfDsMDQ65pYSVj16xwSndnZv/UG1Xz8Rbcg3q2Ycs214I2veDS4qWgzpTtrXItQG20CbaFk1qNrcJKxO2gtIqgWYiiXPr0Fw1zBQyiTHT93Y+/jpS7zNzVCbltc7N7DPxL9aDWOE7oiRTxFZi9P2E4TOBKJRriiXBCc2LgAkrE7ZeCRzm8n+IDsstAPcv5tzlLIKViK2EVBCHSfkTWoURCOIwsepjaIUK2zxq1RXBSsRWKqhvh6HpKQplHAxJcELzImDCyoStV0Kwd5joMLR6EodJyAq0IliJ2AoiAjQ6EG9QEoBWqmfsTeRLiPj2a8DKhK2Ame8qEU3PHiE/SPKQlcx7rlNlrMzYevHy7TBG8vRmRzwnxm5KDl8ImLAyYSsJ9e0whl2VBGQCbYkpCbEQATcoWSERg2AmbL2s/t9hjJGL/MK4ir6cgbYE2QkpD4EMRmIEOZ3FNo/bfOr7CXMDGiNGriSKUdEkekI7g4ARI2AaJFh0kMFfDKSrNsxBuPqMGZkzNFcX4Ow3hfSo19MaV9xgOZiWYFvd+zs3vRhVXrH85daVxchjAjH1EIsQfD9hlMHo0wZZCxnCzpAWiszJL5bjYMTceYi/7nUoSaUzlVtXFpuFkiVFMJXY/b/DmJuhwtEE9S5UQ3DIN95+8XpRQwgi7/bshJzTuXntPgWnKfGcVEIXYzHi7e8JoEksiWmQkgR6wjJTsVW7pADz626R6GFotnZmSPmUpZskehSaSabJhjC63MCZYkbVHnR6eyCHUSfq3C2ibkTyjG9KmkKAS++hHQuxeuM9zDJlG4JqdzEBNlI+I5YSc5YW2GEMwo+5bojrPvRAY6Q2E8lzKD3MlU7Zh6R80Ls4zlnBlEWZki6TDRJvMRoxITaFPMSQWBbSS10HdlhmxwQE4RcPfRcjeYpJQYipKnQf1KnCLCj4uOP91v2F9LDXlEWZ3vzQ7drgTQlCyWChDZEU1LNhdp8I7DDXYOyYIBmOzwQTe9PHVkhpQWj7tq//L0K3incfeu531je2hFq9mG8DZVBWPi13Tt20IXcd9pchaImJmN+AocibRwzlMHd7C6VezpNz+hT18j0Mu3qaEPYklXrclBXxgx+dNqdlXRg9zMO8lGGSbxXRbcxTkEA9jBdcQHYv0TpsC7tFSCiHUStmAD0gGYNpzRdlYuRKqf5p+zo2/hUtnC3GHFqv6j8++AZCKNyDGI2XGvmyCeQhb/+xwTcRuWeVkR86Xd1GBn8JxIBYSNzcGkSi+6Hh3Rf+QGylDhg1t1AC+xd2Ss2OGquDd+mpY2m8z8QxuDy1ykHz/J+YhrxTafU2+jyZWcTKGq+VnoxPCnOx99QXIKfEDaoOjxmXqo8aBcGND5zWu1AdegYTEApiJ0Iche6eRHIYw/AMDqa3AzmPHFSNey+dUNsUNRpO/bzlU/WAegk3RsmnKM+DgU8B5LuqWl/fvWPzwcCZ8zIsXnzHmHc+7NuJp1jqS+qqqtT8KPu3lLjj8iwRTqkYBX1CSMJNrme+c7RvrZQWhEYAU3b1tQzoHyRfIF5uFgAdUZ1FnW6ZZWehCOqJKM6i/EgOowBuHGNayIAqaDVD0pEvyvHqzscOTagdMxMFRvx75USRNTQvqlLIpGzqGJoW/CpTVi23YLGgwsUquNghOTxV2ZBUnxdu8EZHt4rsCPpo26nmuIIyZyLIqB+jisT8d29VLNrgJXKXom24oe4P21orFMmgzY6TbkdVKE9KslVLHJvrxOIwGj9tdsvvAMCywoLwGo2QD6pTal6cUUlnNN72ubQe/A7EL4LzrqIa6ipy0Emcu78tpaoee7Xz8TeL8AZKcoM1p/UOY5/LUk/v39X6tUBCDcylCmnI5iVzmOfYgNqDO2yKN9VF8y0GNC5H3N85c27/zEn7xDzHsSajlTgBHeIJtAGFO4pW4lEsIXp7rHPejq6uRz+UbItC48rM/pOD26HzClEO3o/jqvWsuHZAis1hNDYJg17oshEcBp2mst/FXX5wb4sNA96FA6g6WN8XFm20XbMMLIvxyQIGxCJqX7QQF0/HrpAh6DX2HHl90iUN/0Gz3rSY/Hykff2iS2b1fPDeXr5TRt2RDcb8LPou403G40vy7dg0Z4spPSw9dofRkCP/2vMKN4yBY5oNho0BfenES2ZNxAY0f+np6fJ+xTZkHE4yO8VjPz39V2hc/Rx2sAzi4e5wtGvTQ2JiRGJZHEabuLtPCaeRbXZv3+CNF0+e1cXdg0gYqQffzx9/MvAcnHVTMRvLvR1VrI0OqSDJhm8SKuFpZXcYTQu0pSLCrjKS53AHynS3VMS3PX4uQj9PHHU/A/tZtKVirlBukz/ZtDQHR+jfijxhOevcznWIbYEZb5Ah7OKKGJezJ/fLeYOcpufO/Eq2Bc7BcuY32Xj7DBZBzyr6hOUbl2xtn4+G//Nhc1jORH4E5fYWeLF7vlzneEbCLwaOd6ZS9t1Rv2dFLcuwOyxXAG5vgQUD92Lw+LocbUT8YrIR569g1MK0rqCiZo4Yh+VKndl1gkH49RKM052fo1fyF6BgoizmXmIqWlzfy+Kyf8Q5LFcwBuHPxMhn2HXdLE1oyfHG8cuJQ3BSO/pdWzgjN8wkzzjsKCVjxDos33DOT2f0aQY0xvjkAgy61iM9qu2YSGV1w0FtXPLDVSRBFybk21ip86iFrpSdQ/QwRi7DrjKSJ4ND4umbAideCKY6PCn8RJ/7TN+LNMbA6IVzPkZaDxeAc00xl6kGWfk4xIDkIkEgQSBBIEEgQSBBIEEgQSBBIEEgQSBBIEEgQSBBIEEgBgT+D9CXXd+PXVLkAAAAAElFTkSuQmCC) no-repeat;
|
|
background-size: 100%;
|
|
}
|
|
|
|
.elder-wrapper .input-box .send-box {
|
|
background: url(data:image/png;base64,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) no-repeat;
|
|
background-size: 100%;
|
|
}
|
|
|
|
.elder-wrapper textarea:-moz-placeholder {
|
|
font-family: PingFangSC-Medium;
|
|
font-size: 20rem;
|
|
color: #bfc3d1;
|
|
}
|
|
|
|
.elder-wrapper textarea:-webkit-input-placeholder {
|
|
font-family: PingFangSC-Medium;
|
|
font-size: 20rem;
|
|
color: #bfc3d1;
|
|
}
|
|
|
|
.elder-wrapper textarea:-ms-input-placeholder {
|
|
font-family: PingFangSC-Medium;
|
|
font-size: 20rem;
|
|
color: #bfc3d1;
|
|
}
|
|
|
|
.elder-wrapper .keyboard-box {
|
|
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGwAAABsCAMAAAC4uKf/AAAAflBMVEUAAAAsNWMtNmNTU304PGksNWIsNWMuOGQuN2Q3RGwtNWIsNWIsNmMsNWMsNmIsNWMsNWMtNmIuNmMuNmMvN2QuN2MwN2QtNWMzPGYsNmItNmMsNmMsNmMsNWMuNmQtN2MtNmMsNWMsN2MuOGMvNmUuNWQwNWUzQGZVVaosNWKh0xYfAAAAKXRSTlMA54gGDfuhMVUJ9d/avrqnlJBpXkE5Jc0c0Mfy7bKAfndtYk1MRzAUA416VbMAAAMeSURBVGje7JbZeqowFIV3mIKVQYYi2lpna97/Bc/3dUdTDQkZOL3yvwogLLOz9gAvXrx48UfMLuk22eTLLFvmm2SbXmbwf4hO1YpJrKpTNLlSU8RMQVw0U+q9J29My1vyDtPQ5syAvJ1iV2tmyNp3d98Je2BeVPWxpV1H22NdFXP2QPINHhw+mYAkTQ9P9E1CmODz4G7B8pcFyvMVBrmey1/2KR2NSTOxqZ32G9FObC+j4EAa36X2s9HSsr/LxSlYU9+04kVkFPPF/YUaLPlinCU1DvuScb4ctRYhGBMunNRqhnxYxj/9YEht7w1CrR1MbF1Cuda8A2u6OVejhrmcca0eHOi5WmaW3SWPYQdOdDySpVE95N6g4AjlLjkY1Hlee1NwJuVVebwHJDy/wAOeb8lor+R1IwQPQl5LxrrpWmtcy+RZg5ZWCqJXIFvQkaPrI/AkQv/nBie2B2/24tT0ViQz8GZGxgwZ4TCxgwnY4eiiPpBm6AdhQNgjJAjxvryW/ngDKoqhohYwmQDvy2upxBbKKGJ2nOEBwmQIvy+vBWfMWFUcT/jCdRqxK948wTCVMJBvGIW1KxhmJY7U1yDCbitFauCnepiIHr83nLQXHAZgMnBAuGh6XgGTUWi68HbwQMV5aNZ4ietnw23VhVEeLwMzBwa3taDWlMfNz7MjPEHMcovc1oLjz/ONppe1jmJ4IXViVU/DwYFah1EpRnGcgSFwEO6sDaIU63A01orZ4iAmwmiLQxiFQWyxN4iwvsOZiWKtt75/UuOao09quVy55BlhHH25kguxj1j8r10rOQEYhmH00UdHSDbo/gv2U+qHKUotU2SwFggkJtYFPmK3YphrnGDF+OUZHpB9Hnh5elrAw2gBJDw8jPBAKsfDqBwgqf7NMIx1YZKK6TcGpt9YWGznOjYvLKBk4g8zyYTFIH2NJgaxzGUHxGSuioBPtyZ0TJckO2ncL6ZklKVagFrmZp5tq2dIJ1ntiiFCRjyiGvzEIq3xnKUc1jExpHrAGo2OK4Tigbi/TpHhS0WjXvlkpVZTtzD0XoVqNBqNf3ABXVBf3qwAlzEAAAAASUVORK5CYII=) no-repeat;
|
|
background-size: 100%;
|
|
}
|
|
|
|
.elder-wrapper .add-box {
|
|
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGwAAABsCAMAAAC4uKf/AAAAgVBMVEUAAAAtNWMsNmI4PGksNWIsNWMtNmMtNmMuNmQvN2MvN2Q7RWwtNWIsNWIsNmMtNmMtNmMuNmMtNmMvN2QtN2UwN2QtNWMsNmIsNWMtNWIsNmMtNmMtNmMsNmIsNWMsNWMtNmMtNmMtN2ItNmMsN2MvOGQuO2IzPGYzQGYzPWYsNWJmp6vtAAAAKnRSTlMA8OkN+KKTa0s6MAj1wL2ef15UQTIlzdDh3dvZx7iyqKWOgndiVyceFBl1hbf5AAACwUlEQVRo3uzX23KqMBQG4B/COQVEQFvPZ23e/wH3DFlTqRuTAGl743cpzvwkWQsWeHl5efklPDlP/E06Wy5n6cafnBOOn8Gi/Vz8Z76PmPWkIvPEE15W2MyL/Teh9ObHsKPMhIGstLGqlTC0Gru6Wy6+eV8HYVRWdV2VURis38U3+Q0jnBxx5/rFFQ+uhe+KO+eEodi2VQK7CE9Eu1b5bBkGSRb3RR0ZFNjxvrxFggGm3ldUyKHBw684b4reQkG8gMEACzxBQvQ0EWSWGG/7TJDJwKyAwxgPFGn6PXSmPc/Z6b+TUyG5FXqqXCEZ32VCR/1Ro7f6g8rK8KjZgrI+McAnpS0YTGxpD2sMUtNObmHgRLVRYaCKquQErZujPeHLIc8PF219OTfo5NRfijec11SA4u1F/ZZDI6bnhqKXU9FIFd1Nz5IYait94bpUQPrmWUGpVG0icehIAO1GllDJ5E2zsWFMLj8zOLEQY8MQ6k/Nlwvj48O4XJqvWLwcJo4YH4ajHF0YninoDzbC6MYLTXnsYCMMO3WJMNkdkZ2wSHYsU152YScMrvLW91RAdsKotPfoNqcjtRNG5TZHJy4aV1thV9Hg6JLI7xTYCoP8xknQ5dxcW9sLWzf/OysG08BeWCAHVkX1hPbCQkV1b7r6Ik5d54EgzgM3jbv6dqN43Zdou3iiB++CtlIxPsjBoULbQfRyQFslxxl0WTbX6o5Zy1iOtrr5bfn3Yf/aNZcbgEEYho7B/pv2UnFDgmCTFylZoFL52X52/cb8DeLa+vmH2nVd5V/Ericm//E0yQKC4PFIOYJItchvhrFwWCaGGTTYXIqBl0cTnNBFFCeNf8VIQZk0AmSFm7rYlhdIi6J2IkRQ4BEq+IkhrTG/RYZ1NxiSDlij6LgCFA/g/jpFhpOKRr3yyU6tpm5haF2F6unp6XkzHxu1R0ZZuA0PAAAAAElFTkSuQmCC) no-repeat;
|
|
background-size: 100%;
|
|
}
|
|
|
|
.elder-wrapper .close-box {
|
|
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGwAAABsCAMAAAC4uKf/AAAAgVBMVEUAAAAtNWMsNmI4PGksNWIsNWMtNmMtNmMuNmQvN2MvN2Q7RWwtNWIsNWIsNmMtNmMtNmMuNmMtNmMvN2QtN2UwN2QtNWMsNmIsNWMtNWIsNmMtNmMtNmMsNmIsNWMsNWMtNmMtNmMtN2ItNmMsN2MvOGQuO2IzPGYzQGYzPWYsNWJmp6vtAAAAKnRSTlMA8OkN+KKTa0s6MAj1wL2ef15UQTIlzdDh3dvZx7iyqKWOgndiVyceFBl1hbf5AAACwUlEQVRo3uzX23KqMBQG4B/COQVEQFvPZ23e/wH3DFlTqRuTAGl743cpzvwkWQsWeHl5efklPDlP/E06Wy5n6cafnBOOn8Gi/Vz8Z76PmPWkIvPEE15W2MyL/Teh9ObHsKPMhIGstLGqlTC0Gru6Wy6+eV8HYVRWdV2VURis38U3+Q0jnBxx5/rFFQ+uhe+KO+eEodi2VQK7CE9Eu1b5bBkGSRb3RR0ZFNjxvrxFggGm3ldUyKHBw684b4reQkG8gMEACzxBQvQ0EWSWGG/7TJDJwKyAwxgPFGn6PXSmPc/Z6b+TUyG5FXqqXCEZ32VCR/1Ro7f6g8rK8KjZgrI+McAnpS0YTGxpD2sMUtNObmHgRLVRYaCKquQErZujPeHLIc8PF219OTfo5NRfijec11SA4u1F/ZZDI6bnhqKXU9FIFd1Nz5IYait94bpUQPrmWUGpVG0icehIAO1GllDJ5E2zsWFMLj8zOLEQY8MQ6k/Nlwvj48O4XJqvWLwcJo4YH4ajHF0YninoDzbC6MYLTXnsYCMMO3WJMNkdkZ2wSHYsU152YScMrvLW91RAdsKotPfoNqcjtRNG5TZHJy4aV1thV9Hg6JLI7xTYCoP8xknQ5dxcW9sLWzf/OysG08BeWCAHVkX1hPbCQkV1b7r6Ik5d54EgzgM3jbv6dqN43Zdou3iiB++CtlIxPsjBoULbQfRyQFslxxl0WTbX6o5Zy1iOtrr5bfn3Yf/aNZcbgEEYho7B/pv2UnFDgmCTFylZoFL52X52/cb8DeLa+vmH2nVd5V/Ericm//E0yQKC4PFIOYJItchvhrFwWCaGGTTYXIqBl0cTnNBFFCeNf8VIQZk0AmSFm7rYlhdIi6J2IkRQ4BEq+IkhrTG/RYZ1NxiSDlij6LgCFA/g/jpFhpOKRr3yyU6tpm5haF2F6unp6XkzHxu1R0ZZuA0PAAAAAElFTkSuQmCC) no-repeat;
|
|
background-size: 100%;
|
|
}
|
|
|
|
.elder-wrapper .input-box-txt {
|
|
min-height: 44rem;
|
|
line-height: 44rem;
|
|
background: #eef0f6;
|
|
border-radius: 22rem;
|
|
padding: 0 35rem 0 18rem;
|
|
}
|
|
|
|
.elder-wrapper .input-box-txt .input-txt {}
|
|
|
|
.elder-wrapper .input-box-txt .input-text-tips {
|
|
bottom: 12rem;
|
|
right: 16rem;
|
|
font-family: PingFangSC-Regular;
|
|
font-size: 14rem;
|
|
color: #d0d2db;
|
|
}
|
|
|
|
.quote-preview-box {
|
|
line-height: normal;
|
|
background-color: #f7f8fa;
|
|
padding: 8rem 16rem;
|
|
height: 28rem;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
font-size: 13rem;
|
|
color: #666;
|
|
border-top: 1rem solid #eee;
|
|
border-bottom: 1rem solid #eee;
|
|
}
|
|
|
|
.quote-text {
|
|
flex: 1;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.quote-close-icon {
|
|
padding-left: 10rem;
|
|
cursor: pointer;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
</style>
|
|
|