|
@@ -9,7 +9,7 @@
|
|
<p>访谈时你可以提出以下问题:</p>
|
|
<p>访谈时你可以提出以下问题:</p>
|
|
</div>
|
|
</div>
|
|
<div class="question-list">
|
|
<div class="question-list">
|
|
- <p class="question-list-item" v-for="(item, index) in questionBankList" :key="index" @click="quickSendMsg(item)">
|
|
|
|
|
|
+ <p class="question-list-item" v-for="(item, index) in questionBankList" :key="index" @click="sendRequest(item.question)">
|
|
{{index+1}}.{{item.question}}
|
|
{{index+1}}.{{item.question}}
|
|
</p>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
@@ -50,8 +50,9 @@
|
|
<div v-show="expandIndexList.includes(index)" v-html="item.content" class="content-text"></div>
|
|
<div v-show="expandIndexList.includes(index)" v-html="item.content" class="content-text"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
- <div style="margin: 4px">
|
|
|
|
- <el-text>{{item.createTime}}</el-text>
|
|
|
|
|
|
+ <div style="margin: 4px;display: flex;align-items: center">
|
|
|
|
+ <p><el-text>{{item.createTime}}</el-text></p>
|
|
|
|
+ <p style="margin-left: 1vw"><el-text>数据来源于AI,仅供参考</el-text></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div v-if="index !== chatRecordList.length-1">
|
|
<div v-if="index !== chatRecordList.length-1">
|
|
@@ -74,17 +75,30 @@
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
+ <div class="question-tip-box" ref="questionTipBoxRef" v-if="showQuestionTipBoxFlag">
|
|
|
|
+ <div>
|
|
|
|
+ <div style="display: flex;justify-content: space-between;align-items: center">
|
|
|
|
+ <div class="tip-title">你可以选择以下问题</div>
|
|
|
|
+ <div>X</div>
|
|
|
|
+ </div>
|
|
|
|
+ <div style="display: flex;align-items: center;flex-wrap: wrap">
|
|
|
|
+ <div class="tip-item" v-for="(item, index) in questionBankByKeywordList" :key="index" @click="tipSendRequest(item.question)">
|
|
|
|
+ {{index+1}}.{{item.question}}
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
<div class="input-component">
|
|
<div class="input-component">
|
|
<div class="input-search">
|
|
<div class="input-search">
|
|
<el-input
|
|
<el-input
|
|
v-model="inputMessage"
|
|
v-model="inputMessage"
|
|
style="width: 1220px;height: 84px"
|
|
style="width: 1220px;height: 84px"
|
|
- type="textarea"
|
|
|
|
placeholder="请输入消息"
|
|
placeholder="请输入消息"
|
|
|
|
+ @input="getQuestionBankByKeyword"
|
|
@keyup.enter="sendMessage"
|
|
@keyup.enter="sendMessage"
|
|
>
|
|
>
|
|
<template #suffix>
|
|
<template #suffix>
|
|
- <span style="font-size: 38px;color: #444040;margin-left: 37px;">
|
|
|
|
|
|
+ <span style="font-size: 38px;color: #444040;margin-left: 37px;cursor: pointer" @click="clearInput">
|
|
X
|
|
X
|
|
</span>
|
|
</span>
|
|
</template>
|
|
</template>
|
|
@@ -147,9 +161,14 @@
|
|
// 播放按钮状态
|
|
// 播放按钮状态
|
|
let playActiveIndex = ref(0)
|
|
let playActiveIndex = ref(0)
|
|
let playButtonFlag = ref(false)
|
|
let playButtonFlag = ref(false)
|
|
- // 推荐问题
|
|
|
|
|
|
+ // 左侧推荐问题
|
|
let questionBankList = ref([])
|
|
let questionBankList = ref([])
|
|
|
|
+ // 关键词提示问题
|
|
|
|
+ let questionBankByKeywordList = ref([])
|
|
|
|
|
|
|
|
+ // 显示提示
|
|
|
|
+ let showQuestionTipBoxFlag = ref(false)
|
|
|
|
+ // 提示信息
|
|
const HELLO_MSG = '你是谁?'
|
|
const HELLO_MSG = '你是谁?'
|
|
// 查看所有聊天记录
|
|
// 查看所有聊天记录
|
|
function list() {
|
|
function list() {
|
|
@@ -184,19 +203,20 @@
|
|
})
|
|
})
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+ // 第一次聊天发送消息
|
|
function sayHi() {
|
|
function sayHi() {
|
|
- /* const botMsg = {
|
|
|
|
- isUser: true,
|
|
|
|
- content: '',
|
|
|
|
- isTyping: false
|
|
|
|
- }
|
|
|
|
- chatRecordList.value.push(botMsg);*/
|
|
|
|
-
|
|
|
|
sendRequest(HELLO_MSG)
|
|
sendRequest(HELLO_MSG)
|
|
}
|
|
}
|
|
|
|
|
|
- function quickSendMsg(item){
|
|
|
|
- sendRequest(item.question);
|
|
|
|
|
|
+ // 清除输入框
|
|
|
|
+ function clearInput(){
|
|
|
|
+ inputMessage.value = '';
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ // 在关键词搜索页点击发送问题
|
|
|
|
+ function tipSendRequest(content){
|
|
|
|
+ sendRequest(content);
|
|
|
|
+ showQuestionTipBoxFlag.value = false
|
|
}
|
|
}
|
|
|
|
|
|
const sendMessage = () => {
|
|
const sendMessage = () => {
|
|
@@ -755,22 +775,42 @@
|
|
router.go(-1)
|
|
router.go(-1)
|
|
}
|
|
}
|
|
|
|
|
|
- function getQuestionBank(){
|
|
|
|
|
|
+ function getRecommendQuestionBank(){
|
|
let form = {
|
|
let form = {
|
|
type: 1,
|
|
type: 1,
|
|
- isRecommend: 1
|
|
|
|
|
|
+ isRecommend: 1,
|
|
|
|
+ pageNum: 1,
|
|
|
|
+ pageSize: 10000
|
|
}
|
|
}
|
|
getQuestionBankList(form).then(resp => {
|
|
getQuestionBankList(form).then(resp => {
|
|
questionBankList.value = resp.rows
|
|
questionBankList.value = resp.rows
|
|
})
|
|
})
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+ function getQuestionBankByKeyword(){
|
|
|
|
+ let form = {
|
|
|
|
+ type: 1,
|
|
|
|
+ pageNum: 1,
|
|
|
|
+ pageSize: 10000,
|
|
|
|
+ keyword: inputMessage.value
|
|
|
|
+ }
|
|
|
|
+ getQuestionBankList(form).then(resp => {
|
|
|
|
+ if(resp.rows && resp.rows.length >0){
|
|
|
|
+ showQuestionTipBoxFlag.value = true
|
|
|
|
+ questionBankByKeywordList.value = resp.rows
|
|
|
|
+ }else{
|
|
|
|
+ showQuestionTipBoxFlag.value = false
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+
|
|
onMounted(()=>{
|
|
onMounted(()=>{
|
|
nextTick(()=>{
|
|
nextTick(()=>{
|
|
initSpeechRecognition();
|
|
initSpeechRecognition();
|
|
initSpeechSynthesis();
|
|
initSpeechSynthesis();
|
|
list();
|
|
list();
|
|
- getQuestionBank();
|
|
|
|
|
|
+ getRecommendQuestionBank();
|
|
})
|
|
})
|
|
|
|
|
|
})
|
|
})
|
|
@@ -987,7 +1027,7 @@
|
|
}
|
|
}
|
|
|
|
|
|
::v-deep .el-input__wrapper {
|
|
::v-deep .el-input__wrapper {
|
|
- background: #E2E2E2;
|
|
|
|
|
|
+ background-color: #F5F9FA;;
|
|
box-shadow: none;
|
|
box-shadow: none;
|
|
height: 84px;
|
|
height: 84px;
|
|
width: 1220px;
|
|
width: 1220px;
|
|
@@ -1009,7 +1049,7 @@
|
|
}
|
|
}
|
|
.iat-box-default{
|
|
.iat-box-default{
|
|
position: absolute;
|
|
position: absolute;
|
|
- right: 10vw;
|
|
|
|
|
|
+ right: 97px;
|
|
top:50vh;
|
|
top:50vh;
|
|
display: flex;
|
|
display: flex;
|
|
justify-content: center;
|
|
justify-content: center;
|
|
@@ -1027,7 +1067,39 @@
|
|
width: 150px;
|
|
width: 150px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
- .iat-box-active{
|
|
|
|
-
|
|
|
|
|
|
+ .question-tip-box{
|
|
|
|
+ width: 1346px;
|
|
|
|
+ height: 100px;
|
|
|
|
+ overflow: auto;
|
|
|
|
+ z-index: 10;
|
|
|
|
+ position: absolute;
|
|
|
|
+ right: 68px;
|
|
|
|
+ bottom: 100px;
|
|
|
|
+
|
|
|
|
+ .tip-title{
|
|
|
|
+ font-weight: 400;
|
|
|
|
+ font-size: 24px;
|
|
|
|
+ color: #000000;
|
|
|
|
+ line-height: 40px;
|
|
|
|
+ text-align: left;
|
|
|
|
+ font-style: normal;
|
|
|
|
+ text-transform: none;
|
|
|
|
+ }
|
|
|
|
+ .tip-item{
|
|
|
|
+ height: 41px;
|
|
|
|
+ background: #E9FBFF;
|
|
|
|
+ border-radius: 35px 35px 35px 35px;
|
|
|
|
+ border: 1px solid #8CE349;
|
|
|
|
+ padding: 0 20px;
|
|
|
|
+ font-weight: 400;
|
|
|
|
+ font-size: 24px;
|
|
|
|
+ color: #7D7C7C;
|
|
|
|
+ line-height: 40px;
|
|
|
|
+ text-align: left;
|
|
|
|
+ font-style: normal;
|
|
|
|
+ text-transform: none;
|
|
|
|
+ cursor: pointer;
|
|
|
|
+ }
|
|
}
|
|
}
|
|
|
|
+
|
|
</style>
|
|
</style>
|