askbot-dragon 0.6.26 → 0.6.27

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "askbot-dragon",
-  "version": "0.6.26",
+  "version": "0.6.27",
   "scripts": {
     "serve": "vue-cli-service serve",
     "build": "vue-cli-service build",

package/src/assets/less/ticketMessage.less

@@ -13,6 +13,26 @@
   .button-item:last-child{
     margin-bottom: 0!important;
   }
+  .buttonClassItem{
+    width: 178px;
+    /* padding: 0px 30px;*/
+    height: 30px;
+    background: #FFFFFF;
+    border: 1px solid #BBCDFF;
+    border-radius: 14px;
+    color: #366aff;
+    display: flex;
+    align-content: center;
+    justify-content: center;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    cursor: pointer;
+    .btn-name{
+      display: flex;
+      align-items: center;
+    }
+  }
   .isCompayClass{
     .el-divider--horizontal{
       margin: 8px 0 0 0 !important;
@@ -28,14 +48,6 @@
         }
       }
     }
-    .buttonClassItem{
-      font-weight: 600;
-      text-align: center;
-      border-top: 1.5px solid #DCDFE6;
-      padding: 8px 0;
-      color: #366aff;
-      cursor: pointer;
-    }
     .singleClass{
       padding: 8px 0;
       div, h1, h2, h3, h4, h5, h6, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td{
@@ -71,7 +83,7 @@
         overflow: hidden;
         img{
           width: 100%;
-          height:calc(80vw / 2.35);
+          height:calc((100vw - 120px) / 2.35);
           object-fit: contain;
         }
       }
@@ -127,22 +139,6 @@
         }
       }
     }
-    .buttonClassItem{
-     /* width: 178px;*/
-      padding: 0px 30px;
-      height: 30px;
-      background: #FFFFFF;
-      border: 1px solid #BBCDFF;
-      border-radius: 14px;
-      color: #366aff;
-      display: flex;
-      align-content: center;
-      justify-content: center;
-      .btn-name{
-        display: flex;
-        align-items: center;
-      }
-    }
   }
   .singleClass{
     display: flex;

package/src/components/ConversationContainer.vue

@@ -31,6 +31,7 @@
 <!--    满意或不满意-->
     <bot-action-satisfactor :msg="botActionSatis"></bot-action-satisfactor>
     <answer-dissatisfaction :msg="answerDiss"></answer-dissatisfaction>
+    <feed-back :feedBack="feedBack"></feed-back>
 
 <!--    <FileType :urls="urls" :color="black"></FileType>-->
 <!--    <FileType :urls="urls" :color="black"></FileType>
@@ -63,7 +64,7 @@ import FeedBack from "@/components/feedBack";*/
 /*import ActionAlert from "@/components/message/ActionAlertIframe";*/
 /*import FileType from "@/components/FileType";
 import ChatContent from "./chatContent";*/
-
+import FeedBack from "@/components/feedBack"
 export default {
   name: "ConversationContainer",
   components: {
@@ -80,7 +81,7 @@ export default {
     AnswerRadio,
     FormTemplate,
     TextMessage,
-
+    FeedBack
 
 
   },

package/src/components/associationIntention.vue

@@ -5,14 +5,14 @@
     </div>
     <div v-if=" (msgType === 'answer_welcofmetext' || msgType === 'answer_text') && (msg.recommend&& msg.recommend.status)">
       <p v-html="msg.content.replace(/\#[\u4E00-\u9FA5]{1,3}\;/gi, emotion)"></p>
-     <recommend :msg="msg"></recommend>
+     <Recommend :msg="msg" @onRadioClickReco="onRadioClickReco"></Recommend>
     </div>
     <div v-if="msg.type === 'answer_rich_text' && !(msg.content.recommend != undefined && msg.content.recommend.status)">
       <p v-html="$options.filters.imageStyle(msg.content.html)"></p>
     </div>
     <div  v-else-if="msg.type == 'answer_rich_text' && (msg.content.recommend != undefined && msg.content.recommend.status)">
       <p v-html="$options.filters.imageStyle(msg.content.html)"></p>
-      <recommend :msg="msg.content"></recommend>
+      <Recommend :msg="msg.content" @onRadioClickReco="onRadioClickReco"></Recommend>
     </div>
     <div v-else-if="msgType === 'answer_image'" >
       <div
@@ -26,16 +26,14 @@
             class="img-class"
         />
       </div>
-      <recommend :msg="msg"></recommend>
+      <Recommend :msg="msg" @onRadioClickReco="onRadioClickReco"></Recommend>
     </div>
     <div v-else-if="msgType === 'answer_video' || msgType === 'user_video' || msgType === 'VIDEO'">
       <div class="association-img">
         <ask-video :msg="msg" :url="msg.content.url" :local-url="msg.content.localUrl"
                    :progress="msg.content.progress"></ask-video>
       </div>
-      <div class="media-body-ps" style="border-radius: 0 0 32px 32px;">
-        <recommend :msg="msg"></recommend>
-      </div>
+      <Recommend :msg="msg" @onRadioClickReco="onRadioClickReco"></Recommend>
     </div>
   </div>
 </template>
@@ -70,8 +68,12 @@
         let index = list.indexOf(word)
         return `<img height="20px" src="https://guoranim.oss-cn-beijing.aliyuncs.com/emoji/${index+1}.png" align="middle">`
       },
-      onRadioClickReco(){},
-      onImageClick(){},
+      onRadioClickReco(id, name, apikey) {
+        this.$emit("onRadioClick", id, name, apikey, "recommend");
+      },
+      onImageClick(url){
+        console.debug('onImageClick',url)
+      },
     }
   }
 </script>
@@ -80,6 +82,7 @@
 <style scoped lang="less">
 @import "../assets/less/converSationContainer/common";
 .association-intention{
+  background-color: white;
   .association-img{
     /*display: flex;
     align-items: center;

package/src/components/feedBack.vue

@@ -1,12 +1,12 @@
 <template>
   <div id="feedBack" class="companyNotRem" :class="{phoneClass:isPhone,companyClass:isCompany,notClick:isDisabled===true}">
-    <span class="feed-positive-button" >
-      <el-button round class="btnClass" @click="positiveFeedback(feedBack,1)"   v-html="feedBack.positiveFeedback.text" v-if="positiveClick ===false">{{feedBack.positiveFeedback.text}}</el-button>
-      <el-button round class="btnClassActive"     v-html="feedBack.positiveFeedback.text" v-if="positiveClick ===true">{{feedBack.positiveFeedback.text}}</el-button>
+    <span :class="!positiveClick?'feed-positive-button':'feed-check-positive-button'">
+      <el-button round class="btnClass" @click="positiveFeedback(feedBack,1)"   v-html="feedBack.positiveFeedback.text" v-if="!positiveClick">{{feedBack.positiveFeedback.text}}</el-button>
+      <el-button round class="btnClassActive"  v-html="feedBack.positiveFeedback.text" v-else>{{feedBack.positiveFeedback.text}}</el-button>
     </span>
-    <span class="feed-negative-button">
-      <el-button round class="btnClass" @click="positiveFeedback(feedBack,2)"   v-html="feedBack.negativeFeedback.text" v-if="negativeClick ===false">{{feedBack.negativeFeedback.text}}</el-button>
-      <el-button round class="btnClassActive"  v-html="feedBack.negativeFeedback.text" v-if="negativeClick ===true">{{feedBack.negativeFeedback.text}}</el-button>
+    <span  :class="!negativeClick?'feed-negative-button':'feed-check-negative-button'">
+      <el-button round class="btnClass" @click="positiveFeedback(feedBack,2)"   v-html="feedBack.negativeFeedback.text" v-if="!negativeClick">{{feedBack.negativeFeedback.text}}</el-button>
+      <el-button round class="btnClassActive"  v-html="feedBack.negativeFeedback.text" v-else>{{feedBack.negativeFeedback.text}}</el-button>
     </span>
   </div>
 </template>
@@ -93,6 +93,25 @@ name: "feedBack",
       font-weight: 400;
     }
   }
+  .feed-check-positive-button{
+    margin-right: 8px;
+    /deep/.el-button{
+      border: 1px solid #4C61E1;
+      color: #FFFFFF;
+      background-color: #4C61E1;
+      border-radius: 14px;
+      font-weight: 400;
+    }
+  }
+  .feed-check-negative-button{
+    /deep/.el-button{
+      border: 1px solid #4C61E1;
+      color: #FFFFFF;
+      background-color: #4C61E1;
+      border-radius: 14px;
+      font-weight: 400;
+    }
+  }
   .feed-negative-button{
     background: #FFFFFF;
     /deep/.el-button{
@@ -117,10 +136,6 @@ name: "feedBack",
     line-height: 0.9;
   }
 }
-.btnClassActive{
-  color: #ffffff;
-  background-color: #4C61E1
-}
 .companyClass{
 /*  min-width: 300px;*/
   width: 370px;
@@ -136,10 +151,4 @@ name: "feedBack",
 .notClick{
   pointer-events: none;
 }
-.positiveActive{
-  color: red;
-}
-.negativeActive{
-  color: red;
-}
 </style>

package/src/components/message/swiper/ticketSwiper.vue

@@ -337,11 +337,11 @@ export default {
       if(flag){
         this.isPhone=true
         let el=this.$el
-        el.style.width='80vw'
+        el.style.width='calc(100vw - 120px)'
         let swiper=document.getElementsByClassName('swiper')
         for (let i=0;i<swiper.length;i++)
         {
-          swiper[i].style.width='80vw'
+          swiper[i].style.width='calc(100vw - 120px)'
           console.log(swiper[i].style.width)
         }
 

package/src/components/msgLoading.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="media-body-loading">
+  <div class="media-body-loadings">
     <svg viewBox="0 0 120 120" width="30px" height="30px" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
       <g id="circle" class="g-circles g-circles--v1">
         <circle id="12" transform="translate(35, 16.698730) rotate(-30) translate(-35, -16.698730) " cx="35" cy="16.6987298" r="10"></circle>
@@ -56,7 +56,7 @@ export default {
 .circle__svg {
   transform: rotate(-90deg);
 }
-.media-body-loading {
+.media-body-loadings {
   background-color: #DEE3F0;
  /* background-color: #f4f8fc;*/
  /* border: 1px solid #f4f8fc;*/

package/src/components/recommend.vue

@@ -45,7 +45,7 @@ export default {
     word-wrap: break-word;
     word-break: break-all;
     overflow: hidden;
-    padding: 14px 0;
+    padding: 10px 0;
     height: auto;
     border-bottom: 1px solid #EEEEEE;
     color: #A9B3C6;