cloud-web-corejs 1.0.54-dev.25 → 1.0.54-dev.250

package/src/components/onlineTalk/index.vue

@@ -42,10 +42,21 @@
                     <template v-if="item.contentType == 0">
                       {{ item.content }}
                     </template>
-                    <template v-else>
+                    <template v-else-if="item.contentType == 1">
                       <baseUpload accept="file" multi="false" :file.sync="item.file" :edit="false"
                                   :showProperties="false" :showSize="true" :createBy="false"></baseUpload>
                     </template>
+                    <template v-else-if="item.contentType == 2">
+                      <ul class="onlieTalk-search-list">
+                        <div class="tit"><i class="el-icon-chat-round"></i><b>猜你想问</b></div>
+                        <div class="o-cont">
+                        <li v-for="(answer,index) in item.answers" :key="index">
+                          <a href="javascript:void(0);" class="a-link"
+                             @click="answerCheckHandle(answer)">{{index+1}}、{{ answer.question }}</a>
+                        </li>
+                        </div>
+                      </ul>
+                    </template>
                   </div>
                 </div>
               </template>
@@ -60,16 +71,16 @@
                 <i class="el-icon-folder-opened btn" @click="addFile" :disabled="!talkUserId"></i>
               </el-tooltip>
             </div> -->
-            <div class="pop-inputTips" v-show="false">
-              <p>该商品的<span>有效</span>日期?</p>
-              <p><span>有效</span>使用时间是什么时候？</p>
-              <p>该商品的<span>有效</span>日期?</p>
-              <p><span>有效</span>使用时间是什么时候？</p>
-              <p>该商品的<span>有效</span>日期?</p>
-              <p><span>有效</span>使用时间是什么时候？</p>
-              <p>该商品的<span>有效</span>日期?</p>
-              <p><span>有效</span>使用时间是什么时候？</p>
-            </div>
+            <!--            <div class="pop-inputTips" v-show="false">
+                          <p>该商品的<span>有效</span>日期?</p>
+                          <p><span>有效</span>使用时间是什么时候？</p>
+                          <p>该商品的<span>有效</span>日期?</p>
+                          <p><span>有效</span>使用时间是什么时候？</p>
+                          <p>该商品的<span>有效</span>日期?</p>
+                          <p><span>有效</span>使用时间是什么时候？</p>
+                          <p>该商品的<span>有效</span>日期?</p>
+                          <p><span>有效</span>使用时间是什么时候？</p>
+                        </div>-->
             <el-input type="textarea" :rows="6" class="txt-textarea" v-model="talkUser.content" placeholder="请输入
 选择此处，可粘贴文件（Ctrl+V）"
                       :disabled="!talkUserId" ref="contentRef" @paste.native="pasteMessage"
@@ -127,7 +138,9 @@
                   <i class="iconfont icon-wendangshangchuan"></i>
                   从个人文档工作区选择
                 </el-button>
-                <el-button type="info" plain class="button-sty" @click="showHistoryDialog=true"><i class="el-icon-time"></i>历史记录</el-button>
+                <el-button type="info" plain class="button-sty" @click="openHistoryDialog"><i
+                  class="el-icon-time"></i>历史记录
+                </el-button>
               </div>
               <div class="fr">
                 <span class="t">Ctrl + Enter </span>
@@ -219,66 +232,44 @@
       <div class="history-box">
         <div class="h-form">
           <div class="search-box">
-            <div class="search-classify" v-if="fileTab == 'file'"><i class="el-icon-files"></i><span>文件</span><i class='el-icon-close' @click="fileTab = 'list'"></i></div>
-            <div class="search-classify" v-if="fileTab == 'pic'"><i class="el-icon-files"></i><span>图片</span><i class='el-icon-close' @click="fileTab = 'list'"></i></div>
-            <el-input class="search-input"></el-input>
+            <div class="search-classify" v-if="historyType == 2" @click="checkHistoryType(null)"><i
+              class="el-icon-files"></i><span>文件</span><i
+              class='el-icon-close'></i></div>
+            <div class="search-classify" v-if="historyType == 1" @click="checkHistoryType(null)"><i
+              class="el-icon-files"></i><span>图片</span><i
+              class='el-icon-close'></i></div>
+            <el-input class="search-input" v-model="historyKeyword" clearable @input="changeHistoryKeyword"></el-input>
           </div>
           <div class="keys-box">
-            <span @click="fileTab = 'file'">文件</span><span @click="fileTab = 'pic'">图片</span>
+            <span @click="checkHistoryType(2)">文件</span>
+            <span @click="checkHistoryType(1)">图片</span>
           </div>
         </div>
-        <div class="h-list" v-if="fileTab == 'list'">
-          <div class="item">
-            <div class="name">营销管理11</div>
-            <div class="time">2024-01-06 16:06</div>
-            <div>你好~</div>
-          </div>
-          <div class="item">
-            <div class="name">营销管理11</div>
-            <div class="time">2024-01-06 16:06</div>
-            <div>你好~</div>
-          </div>
-          <div class="item">
-            <div class="name">营销管理11</div>
-            <div class="time">2024-01-06 16:06</div>
-            <div>你好~</div>
-          </div>
-        </div>
-        <div class="h-file" v-if="fileTab == 'file'">
-          <div class="item">
-            <div class="img"><el-image :src="src"></el-image></div>
-            <div class="txt">
-              <div class="t-l">
-                <p class="name">放大.pdf</p>
-                <p>admin</p>
-              </div>
-              <div class="t-r">
-                <p>2021-12-10</p>
-                <p>
-                  <span>2.3M</span>
-                  <el-tooltip class="ico" effect="dark" content="下载" placement="top"><i class="el-icon-download"></i></el-tooltip>
-                </p>
-              </div>
+        <div class="h-list" @scroll="handleScrollH" >
+          <div class="item" v-for="(item,index) in talkHRecords" :key="index" :class="'talk_h'+item.id">
+            <div class="name">{{ item.sendUserName }}</div>
+            <div class="time">{{ item.createDate }}</div>
+            <div>
+              <template v-if="item.contentType == 0">
+                {{ item.content }}
+              </template>
+              <template v-else-if="item.contentType == 1">
+                <baseUpload accept="file" multi="false" :file.sync="item.file" :edit="false"
+                            :showProperties="false" :showSize="true" :createBy="false"></baseUpload>
+              </template>
+              <template v-else-if="item.contentType == 2">
+                <ul class="onlieTalk-search-list">
+                  <div class="tit"><i class="el-icon-chat-round"></i><b>猜你想问</b></div>
+                  <div class="o-cont">
+                  <li v-for="(answer,index) in item.answers" :key="index">
+                    <a href="javascript:void(0);" class="a-link">{{index+1}}、{{ answer.question }}</a>
+                  </li>
+                  </div>
+                </ul>
+              </template>
             </div>
           </div>
         </div>
-        <div class="h-pic" v-if="fileTab == 'pic'">
-          <div class="item">
-            <el-image :src="src"></el-image>
-          </div>
-          <div class="item">
-            <el-image :src="src"></el-image>
-          </div>
-          <div class="item">
-            <el-image :src="src"></el-image>
-          </div>
-          <div class="item">
-            <el-image :src="src"></el-image>
-          </div>
-          <div class="item">
-            <el-image :src="src"></el-image>
-          </div>
-        </div>
       </div>
     </el-dialog>
   </div>
@@ -295,10 +286,7 @@ export default {
     privateProfileDialog: () => import('../../components/VabUpload/privateProfileDialog')
   },
   data() {
-    return {
-      showHistoryDialog:false,
-      fileTab:'list'
-    };
+    return {};
   },
   mounted() {
   },
@@ -306,59 +294,197 @@ export default {
 </script>
 <style scoped lang="scss">
 @import '~@/styles/variables.scss';
-.history-box{
-  .h-form{
-    padding:2px 16px 10px;
-    .search-classify{
-      background:#F4F4F4;line-height:28px;height:28px;padding:0 8px;border-radius: 3px;
-      > i , > span{vertical-align: middle;font-size: 13px;margin-top: 2px;}
-      > span{margin:0 2px 0 4px}
-      .el-icon-close{cursor: pointer;}
+.onlieTalk-search-list{
+  list-style: none;margin: -8px -4px 0;padding: 0;min-width: 360px;max-width: 90%;
+  .tit{color: #333;font-size: 14px;margin: 10px 0 3px;padding-left: 6px;
+    i{margin-right: 3px;}
+  }
+  .o-cont{background: #FFF;border-radius: 5px;margin-top: 7px;padding: 0 12px;}
+  li{
+    padding: 10px 2px;border-bottom: dashed 1px #dfdfdf;display: block;position: relative;font-size: 12px;cursor: pointer;
+    &:after{content:"\e6e0";font-family: element-icons!important;color:#747474;height:30px;border-radius: 50%;position: absolute;top:50%;margin-top:-15px;right:0;line-height:30px;}
+    &:last-child{
+      border-bottom: none;
     }
-    ::v-deep .search-box{border:solid 1px #eee;padding:5px;border-radius: 8px;display:flex;background:#FFF;
-      .el-input{flex:1;
-        .el-input__inner{border:none;}
+  }
+}
+.history-box {
+  .h-form {
+    padding: 2px 16px 10px;
+
+    .search-classify {
+      background: #F4F4F4;
+      line-height: 28px;
+      height: 28px;
+      padding: 0 8px;
+      border-radius: 3px;
+
+      > i, > span {
+        vertical-align: middle;
+        font-size: 13px;
+        margin-top: 2px;
+      }
+
+      > span {
+        margin: 0 2px 0 4px
+      }
+
+      .el-icon-close {
+        cursor: pointer;
       }
     }
-    .keys-box{
-      margin-top:10px;padding: 0 2px;
-      span{display: inline-block;margin-right: 42px;font-size: 13px;color: #2A6494;cursor: pointer;border-bottom:solid 1px #F7F7F7;
-        &:hover{border-bottom:solid 1px #2A6494}
+
+    ::v-deep .search-box {
+      border: solid 1px #eee;
+      padding: 5px;
+      border-radius: 8px;
+      display: flex;
+      background: #FFF;
+
+      .el-input {
+        flex: 1;
+
+        .el-input__inner {
+          border: none;
+        }
+      }
+    }
+
+    .keys-box {
+      margin-top: 10px;
+      padding: 0 2px;
+
+      span {
+        display: inline-block;
+        margin-right: 42px;
+        font-size: 13px;
+        color: #2A6494;
+        cursor: pointer;
+        border-bottom: solid 1px #F7F7F7;
+
+        &:hover {
+          border-bottom: solid 1px #2A6494
+        }
       }
     }
   }
-  .h-list{
-    height: 520px;overflow: auto;padding:2px 0;background-color: #FFF;
-    .item{
-      border-bottom:solid 1px #f2f2f2;position: relative;padding:12px 16px;color: #323232;font-size: 13px;
-      .name{color:#999;margin-bottom: 5px;font-size: 12px;}
-      .time{position: absolute;right:16px;top: 14px;font-size: 12px;color: #999;}
-      &:hover{background:#f7f7f7;}
+
+  .h-list {
+    height: 520px;
+    overflow: auto;
+    padding: 2px 0;
+    background-color: #FFF;
+
+    .item {
+      border-bottom: solid 1px #f2f2f2;
+      position: relative;
+      padding: 12px 16px;
+      color: #323232;
+      font-size: 13px;
+      overflow: hidden;
+      .onlieTalk-search-list{
+        border: solid 1px #eee;padding:0 8px 6px;border-radius: 6px;margin: 10px 0 4px;background: #f7f7f7;overflow: hidden;
+      }
+      .name {
+        color: #999;
+        margin-bottom: 5px;
+        font-size: 12px;
+      }
+
+      .time {
+        position: absolute;
+        right: 16px;
+        top: 14px;
+        font-size: 12px;
+        color: #999;
+      }
+      ::v-deep .upload-box{margin:-10px 0 0 0 !important;border-top:none}
+      &:hover {
+        background: #f7f7f7;
+      }
+
     }
   }
-  .h-pic{
-    height: 520px;overflow: auto;padding:8px 14px;background-color: #FFF;
-    .item{
-      width:133px;height:133px;display:inline-block;vertical-align: middle;margin: 3px;
-      .el-image{width: 100%;height:100%;}
-      &:hover .el-image{border:solid 1px #2A6494}
+
+  .h-pic {
+    height: 520px;
+    overflow: auto;
+    padding: 8px 14px;
+    background-color: #FFF;
+
+    .item {
+      width: 133px;
+      height: 133px;
+      display: inline-block;
+      vertical-align: middle;
+      margin: 3px;
+
+      .el-image {
+        width: 100%;
+        height: 100%;
+      }
+
+      &:hover .el-image {
+        border: solid 1px #2A6494
+      }
     }
   }
-  .h-file{
-    height: 520px;overflow: auto;padding:8px 0;background-color: #FFF;
-    .item{
-      position: relative;padding:8px 16px 0;color: #323232;font-size: 13px;display: flex;
-      .img{
-        width:58px;height:58px;
-        .el-image{width: 100%;height:100%;}
+
+  .h-file {
+    height: 520px;
+    overflow: auto;
+    padding: 8px 0;
+    background-color: #FFF;
+
+    .item {
+      position: relative;
+      padding: 8px 16px 0;
+      color: #323232;
+      font-size: 13px;
+      display: flex;
+
+      .img {
+        width: 58px;
+        height: 58px;
+
+        .el-image {
+          width: 100%;
+          height: 100%;
+        }
       }
-      .txt{
-        border-bottom:solid 1px #f2f2f2;flex:1;display: flex;color:#999;font-size:12px;padding:0 0 6px;margin-left:12px;
-        p{margin:0 0 8px;}
-        .name{color:#323232;font-size: 13px;}
-        .t-l{flex:1}
-        .t-r{font-size:12px;text-align: right;
-          .ico{display: inline-block;color:#2A6494;margin-left:8px;font-size: 16px;}
+
+      .txt {
+        border-bottom: solid 1px #f2f2f2;
+        flex: 1;
+        display: flex;
+        color: #999;
+        font-size: 12px;
+        padding: 0 0 6px;
+        margin-left: 12px;
+
+        p {
+          margin: 0 0 8px;
+        }
+
+        .name {
+          color: #323232;
+          font-size: 13px;
+        }
+
+        .t-l {
+          flex: 1
+        }
+
+        .t-r {
+          font-size: 12px;
+          text-align: right;
+
+          .ico {
+            display: inline-block;
+            color: #2A6494;
+            margin-left: 8px;
+            font-size: 16px;
+          }
         }
       }
     }
@@ -366,7 +492,6 @@ export default {
 }
 
 
-
 .ico-online {
   background: url(~@/resources/images/ico-service.png) no-repeat center 19px #FFF;
   background-size: 40px;
@@ -491,7 +616,8 @@ export default {
 
           .item {
             margin: 10px 0;
-            font-size:14px;
+            font-size: 14px;
+
             .name {
               color: rgba(102, 102, 102, 0.6);
               margin-bottom: 4px;
@@ -536,7 +662,8 @@ export default {
 
             &.right {
               text-align: right;
-              font-size:14px;
+              font-size: 14px;
+
               .cont {
                 background-color: #D8E8F9;
 
@@ -571,13 +698,37 @@ export default {
           padding: 10px 12px;
           display: flex;
           flex-direction: column;
-          .pop-inputTips{
-            position: absolute;background: #FFF;left: 10px;border: solid 1px #eee;overflow: auto;height: 160px;width: 400px;font-size: 13px;bottom: 100%;margin-bottom: -22px;z-index: 22;box-shadow: 0 0 14px rgb(0 0 0 / 11%);padding:2px 0;
-            p{padding: 10px 16px;margin: 0;cursor: pointer;
-              &:hover{background:#f7f7f7}
-              span{color:$red}
+
+          .pop-inputTips {
+            position: absolute;
+            background: #FFF;
+            left: 10px;
+            border: solid 1px #eee;
+            overflow: auto;
+            height: 160px;
+            width: 400px;
+            font-size: 13px;
+            bottom: 100%;
+            margin-bottom: -22px;
+            z-index: 22;
+            box-shadow: 0 0 14px rgb(0 0 0 / 11%);
+            padding: 2px 0;
+
+            p {
+              padding: 10px 16px;
+              margin: 0;
+              cursor: pointer;
+
+              &:hover {
+                background: #f7f7f7
+              }
+
+              span {
+                color: $red
+              }
             }
           }
+
           .btns {
             background-color: #FAFAFA;
             height: 36px;
@@ -747,9 +898,14 @@ export default {
               }
             }
           }
-          .fl{
-            .button-sty .el-icon-time{margin-bottom: 2px;margin-right: 2px;}
+
+          .fl {
+            .button-sty .el-icon-time {
+              margin-bottom: 2px;
+              margin-right: 2px;
+            }
           }
+
           .fr {
             .t {
               vertical-align: middle;