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.
1232 lines
58 KiB
1232 lines
58 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 send-box" v-else :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 ref="uploadImageRef" @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)
|
|
const uploadImageRef = 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
|
|
addFlag.value = true
|
|
uploadImageRef.value?.openFilePicker()
|
|
}
|
|
|
|
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;
|
|
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: center;
|
|
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;
|
|
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 {
|
|
opacity: 0.5;
|
|
font-family: SourceHanSansCN-Normal;
|
|
font-size: 14rem;
|
|
color: #999999;
|
|
letter-spacing: 0;
|
|
text-align: justify;
|
|
}
|
|
|
|
/* .input-txt::selection{
|
|
background-color: transparent;
|
|
} */
|
|
|
|
.input-btn-box {
|
|
width: 30rem;
|
|
height: 30rem;
|
|
padding: 2.5rem 5rem 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: 30rem;
|
|
height: 30rem;
|
|
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('../assets/images/send-button.png') no-repeat center;
|
|
background-size: 100% auto;
|
|
border: 0;
|
|
}
|
|
|
|
.close-box {
|
|
background: url('data:image/png;base64,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') 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('data:image/png;base64,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') 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,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) 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>
|
|
|