askbot-dragon 1.6.78-beta → 1.6.78

package/src/components/previewWisdom.vue

@@ -0,0 +1,255 @@
+<!-- preview-document 
+  组件主要负责 富文本中配置的链接，图片 及上传附件下的附件列表中的单纯预览
+  走的是kkview项目预览或者iframe直接打开文件地址，不对预览文件解析不包含其他功能开发
+-->
+<template>
+    <div class="previewDoc">
+        <div class="footer">
+            <span>查看详情</span>
+            <section @click="close">
+                <i class="iconfont guoran-shanchu"></i>
+            </section>
+        </div>
+        <!-- <div v-if="fileType == 'VIDEO'" style="width: 100%;height: calc(100% - 70px)">
+        <video :src="url" controls width="100%;" height="98%"></video>
+      </div>
+      <template v-else-if="url.includes('https://www') || url.includes('http://www')">
+        <iframe class="preview_iframe"
+                :src="url"
+                width="100%"
+                height="100%"
+                scrolling="100%"
+                frameborder="no"
+                border="0"></iframe>
+      </template>
+<template v-else>
+        <iframe class="preview_iframe" :src="previewUrl" style="border:none;"></iframe>
+      </template> -->
+        <div
+            v-show="fileType == 'VIDEO'"
+            style="width: 100%; height: calc(100% - 55px)"
+        >
+            <video :src="url" controls width="100%;" height="98%"></video>
+        </div>
+        <div
+            style="width: 100%; height: calc(100% - 55px)"
+            v-show="
+                fileType !== 'VIDEO' &&
+                fileType !== 'OTHER' &&
+                (url.includes('https://www') || url.includes('http://www'))
+            "
+        >
+            <iframe
+                class="preview_iframe"
+                :src="
+                    fileType !== 'VIDEO' &&
+                    fileType !== 'OTHER' &&
+                    (url.includes('https://www') || url.includes('http://www'))
+                        ? url
+                        : ''
+                "
+                width="100%"
+                height="100%"
+                scrolling="100%"
+                frameborder="no"
+                border="0"
+            ></iframe>
+        </div>
+        <div
+            style="width: 100%; height: calc(100% - 55px)"
+            v-show="
+                fileType == 'OTHER' &&
+                !url.includes('https://www') &&
+                !url.includes('http://www')
+            "
+        >
+            <iframe
+                class="preview_iframe"
+                :src="previewUrl"
+                style="border: none"
+            ></iframe>
+        </div>
+        <div class="onload_btn" @click="downLoad">下载</div>
+        <div id="text">
+            {{ copy }}
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            previewShowPopup: false,
+            title: "",
+            copy: "",
+            downloadUrl: "",
+        };
+    },
+    props: {
+        url: {
+            type: String,
+            required: true,
+        },
+        officePreviewType: {
+            type: String,
+            default: "",
+        },
+    },
+    computed: {
+        previewUrl() {
+            let url =
+                process.env.VUE_APP_ENV === "production"
+                    ? "https://kkfileview.askbot.cn/onlinePreview?url="
+                    : "https://test.open.askbot.cn/kkfileview/onlinePreview?url=";
+                if(process.env.VUE_APP_SOURCE == 'lining_test') {
+                    url = 'https://wxgw.lining.com/askbot/kkfileview/onlinePreview?url='
+                }
+                if(process.env.VUE_APP_SOURCE == 'lining_production') {
+                    url = 'https://wxgw.lining.com/askbot-prd/kkfileview/onlinePreview?url='
+                }
+            if (this.url != "") {
+                // if (/[\u4E00-\u9FA5]+/g.test(this.url)) {
+                //   url += btoa(encodeURIComponent(this.url))
+                // } else {
+                //   url += btoa(this.url)
+                // }
+                // url += '&encodeURIComponent=true'
+                // if(decodeURIComponent(this.url) == this.url) {
+                //   url += btoa(encodeURIComponent(this.url))
+                //   url += '&encodeURIComponent=true'
+                // } else {
+                //   url += btoa(encodeURIComponent(decodeURIComponent(this.url)))
+                //   url += '&encodeURIComponent=true'
+                // }
+                url += this.url;
+                if (
+                    this.fileType == ".ppt" ||
+                    this.fileType == ".pptx" ||
+                    this.fileType == ".pdf"
+                ) {
+                    url += "&officePreviewType=pdf";
+                }
+            }
+            return url;
+        },
+        fileType() {
+            const fileType = this.url.substring(this.url.lastIndexOf("."));
+            if (
+                fileType === ".mp4" ||
+                fileType === ".MP4" ||
+                fileType === ".MOV" ||
+                fileType === ".mov"
+            ) {
+                return "VIDEO";
+            } else if (fileType === ".html" || fileType === ".HTML") {
+                return "HTML";
+            } else {
+                return "OTHER";
+            }
+        },
+    },
+    methods: {
+        close() {
+            this.$emit("close");
+        },
+        loadIframe(item) {
+            let iframe = document.getElementsByClassName("preview_iframe")[0];
+            iframe.onload(() => {
+                iframe.contentWindow.postMessage(
+                    {
+                        type: "positionText",
+                        data: item.text,
+                        page: item.page,
+                    },
+                    "*"
+                );
+            });
+            // if(preview) {
+            //   preview.postMessage({
+            //     type: "positionText",
+            //     data: ``
+            //   }, '*')
+            // }
+        },
+        downLoad() {
+            // let a = document.createElement('a')
+            // a.href = this.url
+            // a.download = this.title
+            // a.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true, view: window }))
+            // window.open(this.url, "_blank")
+            let newWindow = window.open(this.downloadUrl, "_blank");
+            newWindow.document.title = this.title;
+            newWindow.focus();
+        },
+    },
+    mounted() {
+        this.$i18n.locale = sessionStorage.getItem("systemLanguage") || "cn";
+        setTimeout(() => {
+            let previewIframe =
+                document.getElementsByClassName("preview_iframe");
+            Array.from(previewIframe).forEach((item) => {
+                item.onload = () => {
+                    item.style.backgroundImage = `url('')`;
+                };
+            });
+        });
+    },
+};
+</script>
+
+<style lang="less" scoped>
+@import "../assets/less/variables.less";
+
+.previewDoc {
+    height: 100%;
+    position: relative;
+    overflow: hidden;
+}
+
+.preview_iframe {
+    width: 100%;
+    height: 100%;
+    overflow-y: scroll;
+    background-image: url("https://guoranopen-zjk.oss-cn-zhangjiakou.aliyuncs.com/cdn-common/images/loading.gif");
+    background-position: center;
+    background-size: 50px;
+    background-repeat: no-repeat;
+}
+
+.footer {
+    width: calc(100% - 40px);
+    height: 50px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    cursor: pointer;
+    padding: 0 20px;
+    border-bottom: 1px solid @border-color-r5;
+}
+
+/deep/.el-drawer__body {
+    height: 100%;
+}
+
+.onload_btn {
+    position: absolute;
+    left: 50%;
+    transform: translateX(-50%);
+    bottom: 40px;
+    width: 200px;
+    background-color: @primary-color;
+    color: @font-primary-light-color;
+    height: 48px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 28px;
+    cursor: pointer;
+    z-index: 9999;
+
+    i {
+        margin-right: 8px;
+    }
+}
+</style>

package/src/components/receiverMessagePlatform.vue

@@ -1,26 +1,27 @@
 <template>
     <div class="">
-        <span v-if="messagePlateform == 'IM'">
-            与
-            <span :class="payload.newSession.receiverId == userId ? '':'text_color'">
-                {{payload.newSession.receiverId == userId ? '您': payload.newSession.receiverDisplayInfo.name}}
-            </span>
-            建立对话
-        </span>
-        <span v-if="messagePlateform == 'BOT'">
-            与机器人【
-                <span class="text_color">{{payload.newSession.receiverDisplayInfo.name}}</span>
-            】建立对话
-        </span>
-        <span v-if="messagePlateform == 'oldTransfer'">
-            您将会话转接给&nbsp;&nbsp;<span class="text_color">{{payload.newSession.receiverDisplayInfo.name}}</span>
-        </span>
-        <span v-if="messagePlateform == 'newTransfer'">
-            <span class="text_color">{{payload.oldSession.receiverDisplayInfo.name}}</span>&nbsp;&nbsp;将会话转接给您
+      <span v-if="messagePlateform == 'IM'">
+        {{ $t('dragonCommon.establishConversationWith') }}
+        <span :class="payload.newSession.receiverId == userId ? '': 'text_color'">
+          {{ payload.newSession.receiverId == userId ? $t('dragonCommon.you') : payload.newSession.receiverDisplayInfo.name }}
         </span>
+        {{ $t('dragonCommon.createConversation') }}
+      </span>
+      <span v-if="messagePlateform == 'BOT'">
+        {{ $t('dragonCommon.establishConversationWith') }}
+        <span class="text_color">{{ $t('dragonCommon.bot') }}【{{ payload.newSession.receiverDisplayInfo.name }}】</span>
+        {{ $t('dragonCommon.createConversation') }}
+      </span>
+      <span v-if="messagePlateform == 'oldTransfer' && (isShow == true || isShow === null)">
+        {{ $t('dragonCommon.transferTo') }}
+        &nbsp;&nbsp;<span class="text_color">{{ payload.newSession.receiverDisplayInfo.name }}</span>
+      </span>
+      <span v-if="messagePlateform == 'newTransfer' && (isShow == true || isShow === null)">
+        <span class="text_color">{{ payload.oldSession.receiverDisplayInfo.name }}</span>
+        &nbsp;&nbsp;{{ $t('dragonCommon.transferFrom') }}
+      </span>
     </div>
-</template>
-
+  </template>
 <script>
 //  客服 的接入消息展示
 export default {
@@ -29,7 +30,7 @@ export default {
 
         }
     },
-    props:['source','payload','userId'],
+    props:['source','payload','userId', 'isShow'],
     computed: {
         messagePlateform() {
             if(this.payload) {
@@ -55,12 +56,17 @@ export default {
                 }
             }
         }
-    }
+    },
+    mounted() {
+      this.$i18n.locale = sessionStorage.getItem("systemLanguage") || 'cn';
+    },
 }
 </script>
 
 <style lang="less" scoped>
+@import "../assets/less/variables.less";
+
 .text_color {
-    color: #366aff;
+    color: @font-primary-accent-color;
 }
 </style>

package/src/components/recommend.vue

@@ -31,9 +31,11 @@ export default {
 </script>
 
 <style scoped lang="less">
+@import "../assets/less/variables.less";
+
 .text-recommed-intent{
  /* max-width: 300px;*/
-  background-color: white;
+  background-color: @background-color-light;
   .intent-des{
     word-wrap: break-word;
     word-break: break-all;
@@ -41,13 +43,13 @@ export default {
     padding: 8px 0;
     height: auto;
     /*border-bottom: 1px solid #EEEEEE;*/
-    color: #A9B3C6;
+    color: @font-primary-color-r4;
     font-size: 13px;
-    background-color: white;
+    background-color: @background-color-light;
   }
   .bottom-link{
     height: 1px;
-    background-color:#EEEEEE;
+    background-color:@background-color-link;
   }
   .options-list{
     padding-top: 4px;
@@ -56,7 +58,7 @@ export default {
 
       height: 25px;
       line-height: 25px;
-      background-color: #ffffff;
+      background-color: @background-color-light;
       color: #366aff;
       cursor:pointer;
       display: flex;
@@ -67,10 +69,10 @@ export default {
       }
     }
     .recommend-item{
-      padding: 8px 0;
+      padding: 4px 0;
     }
     .last-item{
-      padding-top: 8px;
+      padding-top: 4px;
     }
     .end{
       border-bottom-left-radius: 25px !important;

package/src/components/senderMessagePlatform.vue

@@ -1,26 +1,31 @@
 <template>
     <div class="">
-        <span v-if="messagePlateform == 'IM'">
-            IM人工&nbsp;&nbsp;<span class="text_color">{{payload.newSession.receiverDisplayInfo.name}}</span>&nbsp;&nbsp;将为您服务
-        </span>
-        <span v-if="messagePlateform == 'BOT'">
-            <span class="text_color">{{payload.newSession.receiverDisplayInfo.name}}</span>&nbsp;&nbsp;将为您服务
-        </span>
-        <span v-if="messagePlateform == 'Transfer'">
-            <span class="text_color">{{payload.oldSession.receiverDisplayInfo.name}}</span>&nbsp;&nbsp;将会话转接给&nbsp;&nbsp;<span class="text_color">{{payload.newSession.receiverDisplayInfo.name}}</span>
-        </span>
+      <span v-if="messagePlateform == 'IM'">
+        {{ $t('dragonCommon.imService') }}&nbsp;&nbsp;
+        <span class="text_color">{{ payload.newSession.receiverDisplayInfo.name }}</span>&nbsp;&nbsp;
+        {{ $t('dragonCommon.willServeYou') }}
+      </span>
+      <span v-if="messagePlateform == 'BOT'">
+        <span class="text_color">{{ payload.newSession.receiverDisplayInfo.name }}</span>&nbsp;&nbsp;
+        {{ $t('dragonCommon.willServeYou') }}
+      </span>
+      <span v-if="messagePlateform == 'Transfer' && (isShow === true || isShow === null)">
+        <span class="text_color">{{ payload.oldSession.receiverDisplayInfo.name }}</span>&nbsp;&nbsp;
+        {{ $t('dragonCommon.transferTo') }}&nbsp;&nbsp;
+        <span class="text_color">{{ payload.newSession.receiverDisplayInfo.name }}</span>
+      </span>
     </div>
-</template>
+  </template>
 
 <script>
 //  咨询者的接入消息展示
 export default {
     data() {
         return {
-
+            
         }
     },
-    props:['source','payload'],
+    props:['source','payload', 'isShow'],
     computed: {
         messagePlateform() {
             if(this.payload) {
@@ -40,12 +45,17 @@ export default {
                 }
             }
         }
-    }
+    },
+    mounted() {
+      this.$i18n.locale = sessionStorage.getItem("systemLanguage") || 'cn';
+    },
 }
 </script>
 
 <style lang="less" scoped>
+@import "../assets/less/variables.less";
+
 .text_color {
-    color: #366aff;
+    color: @primary-color;
 }
 </style>