askbot-dragon 1.6.24-beta → 1.6.25-beta

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "askbot-dragon",
-  "version": "1.6.24-beta",
+  "version": "1.6.25-beta",
   "scripts": {
     "serve": "vue-cli-service serve",
     "build": "vue-cli-service build",

package/src/components/ConversationContainer.vue

@@ -1,6 +1,7 @@
 <!-- 消息记录容器 -->
 <template>
   <div id="conversation">
+    <answer-radio :msg="answerRadiosPri"></answer-radio>
     <!-- <asser-deatils></asser-deatils> -->
     <!-- <msg-loading v-if="inLoading"></msg-loading>
     <div style="position: relative" class="img_div">
@@ -4751,6 +4752,74 @@ export default {
         }
       },
       answerRadios: { "content": { "options": [{ "scope": "KNOWLEDGE", "name": "本文提供了什么内容？", "value": "64915d6e098ec248701da267" }, { "scope": "KNOWLEDGE", "name": "什么是街舞穿搭指南？", "value": "64915d6e098ec248701da267" }, { "scope": "KNOWLEDGE", "name": "为什么街舞爱好者需要关注本文？", "value": "64915d6e098ec248701da267" }], "description": "了解更多", "isKnowledgeSummary": true }, "id": "knowledgeRecdNodeId", "type": "answer_radio", "sessionId": 1687251699065, "keyId": "139480f2-5af1-44fd-a7bd-a73dd7b566b7_________", "isKnowledgeSummary": true },
+      answerRadiosPri: {
+                "refAttrId": null,
+                "createTime": null,
+                "intentId": null,
+                "refApiKey": null,
+                "updateTime": null,
+                "id": "recdNodeId",
+                "refBotVersion": null,
+                "type": "answer_radio",
+                "nodeId": null,
+                "version": null,
+                "content": {
+                    "lastOptionName": "以上都不是",
+                    "options": [
+                        {
+                            "answerId": null,
+                            "apiKey": "14f02c001a29434d9aaa2c2e581a1a17",
+                            "scope": "INTENT",
+                            "name": "打印机卡纸怎么办",
+                            "value": "155539"
+                        },
+                        {
+                            "answerId": null,
+                            "apiKey": "14f02c001a29434d9aaa2c2e581a1a17",
+                            "scope": "INTENT",
+                            "name": "打印机打印模糊",
+                            "value": "155540"
+                        },
+                        {
+                            "answerId": null,
+                            "apiKey": "14f02c001a29434d9aaa2c2e581a1a17",
+                            "scope": "INTENT",
+                            "name": "SAP系统输入编码系统显示报错",
+                            "value": "155541"
+                        },
+                        {
+                            "answerId": null,
+                            "apiKey": "14f02c001a29434d9aaa2c2e581a1a17",
+                            "scope": "INTENT",
+                            "name": "合同已经上传影像归档了，但是在CE中还是关联不到合同",
+                            "value": "155542"
+                        },
+                        {
+                            "answerId": null,
+                            "apiKey": "14f02c001a29434d9aaa2c2e581a1a17",
+                            "scope": "INTENT",
+                            "name": "如何查询社保缴费基数",
+                            "value": "155543"
+                        },
+                        {
+                            "answerId": null,
+                            "apiKey": "14f02c001a29434d9aaa2c2e581a1a17",
+                            "scope": "INTENT",
+                            "name": "如何查询公积金缴费基数",
+                            "value": "155544"
+                        },
+                        {
+                            "answerId": null,
+                            "apiKey": "14f02c001a29434d9aaa2c2e581a1a17",
+                            "scope": "INTENT",
+                            "name": "以上都不是",
+                            "value": "155533"
+                        }
+                    ],
+                    "description": "猜您可能想问："
+                },
+                "refAttrVersion": null
+            },
       htmlContainer: '<input placeholder="请输入"></input>',
       isOpen: true,
       chatMessageList:[

package/src/components/answerRadio.vue

@@ -1,62 +1,107 @@
 <template>
   <div id="answer-radio">
-    <p class="radio-description" v-html="msg.content.description" v-if="msg.content.description && !msg.content.isKnowledgeSummary"></p>
+    <p class="radio-description" v-html="msg.content.description"
+      v-if="msg.content.description && !msg.content.isKnowledgeSummary"></p>
     <div class="bottom-link" v-if="msg.content.description && !msg.content.isKnowledgeSummary"></div>
-    <div :class="['options-list',msg.content.isKnowledgeSummary ? 'isKnowledgeSummary' : '']">
+    <div :class="['options-list', msg.content.isKnowledgeSummary ? 'isKnowledgeSummary' : '']">
       <div v-if="msg.content.isKnowledgeSummary" class="tips">AI为您推荐了以下内容</div>
-      <div
-          v-for="(option, index) in msg.content.options"
-          class="options-item"
-          :class="index!==msg.content.options.length -1?'recommend-item':'last-item'"
-          :key="msg.nodeId + '_' + index"
-          @click="radioClick(msg,option,index)">
-       
-          <!-- <el-tooltip class="item" effect="dark" :content="option.name" placement="bottom-start" v-if="!isMobile">
+      <div v-for="(option, index) in formatOptions[activeIndex]" class="options-item"
+        :class="index !== msg.content.options.length - 1 ? 'recommend-item' : 'last-item'" :key="msg.nodeId + '_' + index"
+        @click="radioClick(msg, option, index)">
+
+        <!-- <el-tooltip class="item" effect="dark" :content="option.name" placement="bottom-start" v-if="!isMobile">
             <span > {{ option.name }}</span>
           </el-tooltip> -->
-          <span> {{ option.name }}</span>
+        <span> {{ option.name }}</span>
         <i class="arsenal_icon arsenalangle-right-solid"></i>
       </div>
     </div>
+    <div v-if="showPage" class="switch-page">
+      <span @click="changeActivePage" class="switch-page-btn">换一批</span>
+    </div>
   </div>
 </template>
 
 <script>
 export default {
-	name: "answerRadio",
-	data(){
-		return{
-		isMobile:false,
-		}
-	},
-	props:['msg'],
-	mounted(){
-		console.log(this.msg,'msg');
-		this.judgeIsMobile();
-	},
-	methods:{
-		judgeIsMobile() {
-			let flag = navigator.userAgent.match(
-				/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i
-			);
-			if (flag) {
-				this.isMobile = true;
-			} else {
-				this.isMobile = false;
-			}
-			console.log(this.isMobile,'this.isMobile');
-		},
-		radioClick(msg,option,index){
-      let value = option.answerId ? msg.id +'_' + index + '_' + option.value + '_' + option.name + '_' + option.answerId : msg.id +'_' + index + '_' + option.value + '_' + option.name
-			this.$emit('onRadioClick',value,option.name, msg.apiKey,msg.actionCategory, msg.msgId?msg.msgId:'',option.apiKey)
-		}
-	}
+  name: "answerRadio",
+  data() {
+    return {
+      isMobile: false,
+      formatOptions: [],
+      activeIndex: 0,
+      pageSize: 5,
+      showPage: false,
+    }
+  },
+  props: ['msg'],
+  mounted() {
+    console.log(this.msg, 'msg');
+    // 关键词推荐 前端分页
+    if (this.msg.id == "recdNodeId" && this.msg.content.options.length > this.pageSize) {
+      this.formatOptions = this.chunkArray(this.msg.content.options, this.pageSize);
+      this.activeIndex = 0;
+      this.showPage = true;
+    } else {
+      this.formatOptions = [this.msg.content.options];
+      this.activeIndex = 0;
+    }
+    this.judgeIsMobile();
+  },
+  methods: {
+    changeActivePage(){
+      if (this.activeIndex >= this.formatOptions.length - 1) {
+        this.activeIndex = 0;
+      } else {
+        this.activeIndex++;
+      }
+    },
+    chunkArray(array, size) {
+      let chunks = [];
+      for (let i = 0; i < array.length; i += size) {
+        let chunk = array.slice(i, i + size);
+        chunks.push(chunk);
+      }
+      return chunks;
+    },
+    judgeIsMobile() {
+      let flag = navigator.userAgent.match(
+        /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i
+      );
+      if (flag) {
+        this.isMobile = true;
+      } else {
+        this.isMobile = false;
+      }
+      console.log(this.isMobile, 'this.isMobile');
+    },
+    radioClick(msg, option, index) {
+      let value = option.answerId ? msg.id + '_' + index + '_' + option.value + '_' + option.name + '_' + option.answerId : msg.id + '_' + index + '_' + option.value + '_' + option.name
+      this.$emit('onRadioClick', value, option.name, msg.apiKey, msg.actionCategory, msg.msgId ? msg.msgId : '', option.apiKey)
+    }
+  }
 
 }
 </script>
 
 <style scoped lang="less">
-#answer-radio{
+#answer-radio {
+  .switch-page {
+    margin-top: 10px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    .switch-page-btn {
+      width: 80px;
+      height: 30px;
+      border-radius: 15px;
+      border: solid 1px #366AFF;
+      color: #366AFF;
+      line-height: 30px;
+      text-align: center;
+      cursor: pointer;
+    }
+  }
   .radio-description {
     word-wrap: break-word;
     word-break: break-all;
@@ -64,51 +109,57 @@ export default {
     /*padding: 8px 10px 10px 0;*/
     padding-bottom: 10px;
     height: auto;
-   /* border-bottom: 1px solid #EEEEEE;*/
+    /* border-bottom: 1px solid #EEEEEE;*/
   }
-  .bottom-link{
+
+  .bottom-link {
     height: 1px;
-    background-color:#EEEEEE;
+    background-color: #EEEEEE;
   }
-  .options-list{
+
+  .options-list {
     padding-top: 4px;
-   /* padding-top: 10px;*/
+    /* padding-top: 10px;*/
     /*padding-right: 10px;*/
-    
-    .options-item{
+
+    .options-item {
       // height: 25px;
       line-height: 25px;
       background-color: #ffffff;
       color: #366aff;
-      cursor:pointer;
+      cursor: pointer;
       display: flex;
       align-items: center;
       justify-content: space-between;
-     
 
-      i{
+
+      i {
         padding-left: 10px;
       }
-      .options-item-text{
+
+      .options-item-text {
         text-overflow: ellipsis;
         display: -webkit-box; //使用了flex，需要加
-        overflow: hidden;     //超出隐藏
+        overflow: hidden; //超出隐藏
         word-break: break-all; //纯英文、数字、中文
-        text-overflow: ellipsis;  //省略号
+        text-overflow: ellipsis; //省略号
         -webkit-box-orient: vertical; //垂直
-        -webkit-line-clamp: 1;  //显示一行
-        white-space:pre-line;   //
+        -webkit-line-clamp: 1; //显示一行
+        white-space: pre-line; //
       }
     }
-    &.isKnowledgeSummary{
+
+    &.isKnowledgeSummary {
       background: #EEF1FF;
       border-radius: 10px;
       padding: 10px;
-      .options-item{
+
+      .options-item {
         background: #EEF1FF;
       }
     }
-    .tips{
+
+    .tips {
       width: 131px;
       height: 22px;
       background: #366AFF;
@@ -118,13 +169,16 @@ export default {
       color: #fff;
       font-size: 12px;
     }
-    .recommend-item{
+
+    .recommend-item {
       padding: 8px 0;
     }
-    .last-item{
+
+    .last-item {
       padding-top: 8px;
     }
-    .end{
+
+    .end {
       border-bottom-left-radius: 25px !important;
       border-bottom-right-radius: 25px !important;
     }