Merge remote-tracking branch 'origin/企微聊天' into 企微聊天

.env.development

@@ -13,7 +13,7 @@ VUE_APP_LOG_URL =@/assets/logo/myhk.png
 ENV = 'development'
 
 # FS管理系统/开发环境
-VUE_APP_BASE_API ='/dev-api'
+VUE_APP_BASE_API ='http://company.jnmyunl.com/prod-api'
 
 #默认 1、会员 2、企微
 VUE_APP_COURSE_DEFAULT = 1

src/components/LemonUI/components/index.vue

@@ -449,32 +449,52 @@ export default {
     },
     _renderSidebarContact() {
       let prevIndex;
+      const { groupContacts, normalContacts } = this.contacts.reduce((acc, contact) => {
+          if (!contact.index) return acc; // 筛掉无index的联系人
+          // 临时处理index，不修改原数据
+          const processedIndex = contact.index.replace(/\[[0-9]*]/, "");
+          // 给contact添加处理后的index（不影响原数据）
+          const newContact = { ...contact, processedIndex };
+
+          if (contact.isGroup) {
+            acc.groupContacts.push(newContact);
+          } else {
+            acc.normalContacts.push(newContact);
+          }
+          return acc;
+        }, { groupContacts: [], normalContacts: [] });
       return this._renderSidebar(
         [
           useScopedSlot(this.$scopedSlots["sidebar-contact-top"], null, this),
-          this.contacts.map(contact => {
-            if (!contact.index) return;
-            contact.index = contact.index.replace(/\[[0-9]*]/, "");
-            const node = [
-              contact.index !== prevIndex && (
-                <p class="lemon-sidebar__label">{contact.index}</p>
-              ),
-              this._renderContact(
-                {
-                  contact: contact,
-                  simple: true,
-                },
-                () => {
-                  console.log("qxj contact click");
-                  this.currentNewContactId=contact.id;
-                  //this.changeContact(contact.id);
-                },
-                this.$scopedSlots["sidebar-contact"],
-              ),
-            ];
-            prevIndex = contact.index;
-            return node;
-          }),
+          this.$slots["group-top"],
+          this._renderGroupContacts(groupContacts), // 展开群聊列表
+          this.$slots["contact-top"],
+          this._renderNormalContacts(normalContacts), // 展开普通联系人列表
+          // this.contacts.map(contact => {
+          //   if (!contact.index) return;
+          //   if(contact.isGroup)
+          //   contact.index = contact.index.replace(/\[[0-9]*]/, "");
+          //   const node = [
+          //     contact.index !== prevIndex && (
+          //       <p class="lemon-sidebar__label">{contact.index}</p>
+          //     ),
+          //     this._renderContact(
+          //       {
+          //         contact:contact,
+          //         simple: true,
+          //       },
+          //       () => {
+          //         console.log("qxj contact click");
+          //         this.currentNewContactId=contact.id;
+          //         //this.changeContact(contact.id);
+          //       },
+          //       this.$scopedSlots["sidebar-contact"],
+          //     ),
+          //   ];
+          //   prevIndex = contact.index;
+          //   return node;
+          // }),
+
         ],
         DEFAULT_MENU_CONTACTS,
         useScopedSlot(
@@ -485,18 +505,67 @@ export default {
       );
     },
     _renderSidebar(children, name, fixedtop) {
+      //console.log(children,'name')
       return (
         <div
           class="lemon-sidebar"
           v-show={this.activeSidebar == name}
           on-scroll={this._handleSidebarScroll}
         >
-          <div class="lemon-sidebar__fixed-top">{fixedtop}</div>
-          <div class="lemon-sidebar__scroll">{children}</div>
+
+         <div class="lemon-sidebar__fixed-top">{fixedtop}</div>
+         <div class="lemon-sidebar__scroll" style="position:relative;">{children}</div>
+
+
         </div>
       );
 
     },
+    //群聊
+    _renderGroupContacts(groupContacts){
+       if (!this.openGroup) return null; // 收起时不渲染列表
+        let groupPrevIndex = null;
+        return groupContacts.map(contact => {
+          const node = [
+            // 首字母不同时显示索引标签
+            contact.processedIndex !== groupPrevIndex && (
+              <p class="lemon-sidebar__label">{contact.processedIndex}</p>
+            ),
+            this._renderContact(
+              { contact, simple: true },
+              () => {
+                console.log("qxj group contact click");
+                this.currentNewContactId = contact.id;
+              },
+              this.$scopedSlots["sidebar-contact"]
+            )
+          ];
+          groupPrevIndex = contact.processedIndex;
+          return node;
+        });
+      },
+      //联系人列表
+      _renderNormalContacts(normalContacts){
+        if (!this.openContact) return null; // 收起时不渲染列表
+        let normalPrevIndex = null;
+            return normalContacts.map(contact => {
+              const node = [
+                contact.processedIndex !== normalPrevIndex && (
+                  <p class="lemon-sidebar__label">{contact.processedIndex}</p>
+                ),
+                this._renderContact(
+                  { contact, simple: true },
+                  () => {
+                    console.log("qxj normal contact click");
+                    this.currentNewContactId = contact.id;
+                  },
+                  this.$scopedSlots["sidebar-contact"]
+                )
+              ];
+              normalPrevIndex = contact.processedIndex;
+              return node;
+          });
+        },
     _renderDrawer() {
       return this._menuIsMessages() && this.currentContactId ? (
         <div class="lemon-drawer" ref="drawer">
@@ -586,7 +655,7 @@ export default {
       nodes.push(
         <div
           class={cls}
-          style="flex: 1 1 0;width: 0;"
+          style="width: 412px;flex:none"
           v-show={this._menuIsMessages() && defIsShow && curact.id}
         >
           {useScopedSlot(this.$scopedSlots["message-extend"], null, curact)}
@@ -617,7 +686,7 @@ export default {
                       lastContent: "",
                     });
                   }
-                  this.changeContact(curactNew.conversationId, DEFAULT_MENU_LASTMESSAGES);
+                  this.changeContact(curactNew.conversationId,DEFAULT_MENU_LASTMESSAGES);
                   this.$emit("change-contact",curactNew, this);
                 }}
               >
@@ -851,6 +920,17 @@ export default {
       this.$emit("change-menu", name);
       this.activeSidebar = name;
     },
+    /**
+     展开群聊或联系列表
+     * @param {String} val 按钮 val
+     */
+    changeOpenGroup(val){
+      this.openGroup=val
+    },
+    changeOpenContact(val){
+      console.log(val,'cal')
+       this.openContact=val
+    },
     /**
      * 初始化编辑框的 Emoji 表情列表，是 Lemon-editor.initEmoji 的代理方法
      * @param {Array<Emoji,EmojiItem>} data emoji 数据
@@ -939,6 +1019,7 @@ export default {
       this.sortContacts();
       if(this.contacts.length>0){
           this.currentNewContactId=(this.contacts[0]).id;
+          //this.currentContactId=(this.contacts[0]).conversationId;
       }
     },
       /**

src/views/qw/qwChat/qq.vue

@@ -51,14 +51,24 @@
                                      :max="99"
                                      :hidden="getUnreadCount(item.appKey) < 1">
                                        <el-avatar shape="square" :src="item.avatar"></el-avatar>
-                                       <div class="name" :title="item.qwUserName">{{item.qwUserName}}</div>
-                                       <div class="text" :title="item.corpName">{{item.corpName}}</div>
+                                       <el-popover
+                                       popper-class="popover"
+                                           placement="right"
+                                           :title="'姓名：'+item.qwUserName"
+                                           trigger="hover"
+                                           :content="'所属公司：'+item.corpName">
+                                           <div slot="reference">
+                                             <div class="name" >{{item.qwUserName}}</div>
+                                             <div class="text" >{{item.corpName}}</div>
+                                           </div>
+                                         </el-popover>
+
                            </el-badge>
                          </div>
                       </div>
                     </template>
         <template #sidebar-message-top>
-          <div style="padding: 8px; display: flex; align-items: center;">
+          <div style="padding: 12px; display: flex; align-items: center;">
             <el-input
               v-model="searchKeyword"
               prefix-icon="el-icon-search"
@@ -96,6 +106,27 @@
             </el-popover>
           </div>
         </template>
+        <template #sidebar-contact-top>
+          <!-- 联系人顶部 -->
+        </template>
+       <template #group-top>
+           <div class="group-item" @click="toggleGroup" style="padding-top: 14px;">
+             <div class="left">
+               <i class="el-icon-arrow-right" :class="{ 'rotate': openGroup }"></i>
+               <div class="name">群聊</div>
+             </div>
+             <div class="num">{{qwGroupNum}}</div>
+           </div>
+        </template>
+        <template #contact-top>
+            <div class="group-item" @click="toggleContact">
+              <div class="left">
+                <i class="el-icon-arrow-right" :class="{ 'rotate': openContact }"></i>
+                <div class="name">联系人</div>
+              </div>
+              <div class="num">{{qwContactNum}}</div>
+            </div>
+         </template>
         <template #message-title="contact">
           <div class="user-name">
             {{contact.displayName}}
@@ -116,13 +147,14 @@
            <div class="close-box">
              <i class="el-icon-close" @click="handleClose" style="font-size: 22px;cursor: pointer;"/>
            </div>
-          <div v-if="contact.extId" style="width: 100%;height: 100%;overflow: auto">
+          <div v-if="contact.extId" style="width:100%;overflow: auto">
             <userDetail :ext-id="contact.extId" :conversation-id="contact.conversationId" :extend="true" ref="userDetail" />
-          </div>
+           </div>
             <!-- 课程管理 -->
             <div v-if="showCourseManage">
                 <course-manage :conversationId="contact.conversationId" :extend="true"/>
             </div>
+
         </template>
       </lemon-imui>
     </div>
@@ -185,6 +217,9 @@ export default {
   },
   data() {
     return {
+      activeNames: ['0'],
+     openContact:false,
+      openGroup:false,
       contactName:'',
       appKey:null,
       appId:null,
@@ -253,8 +288,10 @@ export default {
       qwUserUnreadCount: [],
       //联系人列表
       qwContactList:[],
+      qwContactNum:0,
       //群聊列表
-      qwGrouList:[],
+      qwGroupList:[],
+      qwGroupNum:0,
       //课程列表
       showCourseManage:false
     };
@@ -277,8 +314,12 @@ export default {
 
         // 初始化未读消息数
         this.initUnreadCount();
+        //群聊
+        this.initGroup(this.qwUser.id)
+        //this.toggleContact();
         //联系人
-        this.initContact(this.qwUser.id)
+        // this.initContact(this.qwUser.id)
+
       }else {
         this.qwUser={};
       }
@@ -511,27 +552,46 @@ export default {
       this.qwUser=this.qwUserList[index];
       // 清除当前账号的未读消息数
       this.clearUnreadCount(this.appKey);
-
       // 不需要重新创建WebSocket连接，只需更新当前账号信息
       this.setQwUserInfo();
       this.getConversation();   //获取会话信息
       this.initGroup(this.qwUser.id)
-      this.initContact(this.qwUser.id)
     },
     //联系人列表
     initContact(id){
       getContactList(id).then(response => {
-        this.qwContactList = response.rows;
-        this.$refs.IMUI.initContacts(response.rows);
+        this.qwContactList=response.rows;
+        this.qwContactNum=response.total
+        const mergedList = [...this.qwGroupList, ...this.qwContactList];
+        this.$refs.IMUI.initContacts(mergedList);
         // this.getConversationId(id)
       });
     },
     //群聊列表
     initGroup(id){
       getGroupList(id).then(response => {
-        this.qwGrouList = response.rows;
+        this.qwGroupList=response.rows
+        this.qwGroupNum = response.total
+        this.initContact(id)
+        //this.$refs.IMUI.initContacts(this.qwContactList);
       });
     },
+    // 切换分组展开/收起状态
+        toggleGroup() {
+          this.openGroup = !this.openGroup;
+          this.$refs.IMUI.changeOpenGroup(this.openGroup);
+        },
+ // 切换分组展开/收起状态
+        toggleContact() {
+          this.openContact = !this.openContact;
+          this.$refs.IMUI.changeOpenContact(this.openContact);
+        },
+    handleOpenGroup(val){
+      // console.log(val,'val')
+    },
+    handleChange(val) {
+           this.activeNames=val
+          },
     setQwUserInfo(){
       this.userData.id=this.qwUser.id;
       this.userData.displayName=this.qwUser.qwUserName;
@@ -597,6 +657,7 @@ export default {
       getMessageList(this.queryParams).then(response => {
         if(response.code==200){
           isEnd=response.data.isLastPage;
+          console.log(isEnd,'isEnd')
           next(response.data.list, isEnd);
           if(!isEnd){
             this.qwUserPages[contact.conversationId]++;
@@ -657,7 +718,7 @@ export default {
         getConversationId(data).then(response => {
           IMUI.appendConversation(response.data)
           IMUI.changeContact(contact.conversationId);
-          // IMUI.currentContactId=contact.conversationId;
+          IMUI.currentNewContactId=contact.id;
         });
       }
     },
@@ -1054,7 +1115,7 @@ export default {
 <style lang="scss" scoped>
   .close-box{
     width: 100%;
-    height: 49px;
+    height: 52px;
     padding: 12px;
     background: #FFFFFF;
     // border-bottom: 1px solid #EDEFF2;
@@ -1151,6 +1212,43 @@ border-radius: 0 6px 6px 0;
     //   border-top-right-radius: 0; /* 避免与选中元素顶部衔接处的多余圆角 */
     // }
   }
+    .group-item{
+      padding-left: 12px;
+      padding-right: 12px;
+      width: 100%;
+      height: 45px;
+      line-height: 45px;
+      // padding-bottom: 12px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      position: sticky;
+      position: -webkit-sticky;
+    top: 0px;
+        z-index: 9;
+        background-color: #fff;
+      /* 箭头旋转动画 */
+      .el-icon-arrow-right {
+        transition: transform 0.3s ease;
+        margin-right: 5px;
+      }
+      .el-icon-arrow-right.rotate {
+        transform: rotate(90deg); /* 展开时箭头向右旋转90度（指向下方） */
+      }
+      .left{
+        display: flex;
+        align-items: center;
+        font-weight: 400;
+        font-size: 14px;
+        color: #141F36;
+      }
+      .num{
+        font-weight: 400;
+        font-size: 12px;
+        color: #84868C;
+      }
+  }
+
   .user-name{
      font-weight: 500;
      font-size: 18px;
@@ -1210,6 +1308,10 @@ border-radius: 0 6px 6px 0;
 
 
 <style lang="stylus">
+  // .el-popover{
+  //       color: #409EFF !important;
+  //     }
+
   .q-item{
     .el-badge{
       display: flex;
@@ -1220,8 +1322,7 @@ border-radius: 0 6px 6px 0;
       background-color:#FC4B0E !important;
       border: none !important;;
     }
-  }
-
+}
 .lemon-container__title{
   padding:12px !important;
   background: #fff !important;
@@ -1284,14 +1385,16 @@ border-radius: 0 6px 6px 0;
   color:#84868C !important;
 }
 .lemon-sidebar{
+  width:228px !important;
   background: #fff !important;
 }
+.lemon-sidebar div::-webkit-scrollbar {
+  display: none;
+}
 .lemon-contact{
   background: #fff !important;
 }
-.lemon-sidebar__scroll{
 
-}
 .lemon-contact--active{
   background: #E9F1FE !important;
 }

src/views/qw/qwChat/userDetail/courseManage.vue

@@ -10,28 +10,27 @@
         <span style="font-weight: bold; font-size: 18px;color: #202124;">课程管理</span>
       </div>
        <div class="tab-box" v-if="courseList.length>0">
-      <!-- <div class="tab-container"> -->
-        <!-- <div :class="activeIndex==item.courseId?'tabs active':'tabs'" v-for="(item,index) in courseList" :key="index"
-           @click="tabsClick(item.courseId)">
-           {{item.courseName}}
-         </div> -->
-         <el-tabs v-model="activeIndex" @tab-click="tabsClick">
-             <el-tab-pane v-for="(item,index) in courseList" :key="item.id" :label="item.courseName" :name="item.courseName"></el-tab-pane>
+         <el-tabs :class="courseQueryParams.hasNextPage?'isShow':''" v-model="activeIndex" @tab-click="tabsClick" scrollable="true" ref="courseTabs">
+             <el-tab-pane v-for="(item,index) in courseList" :key="item.courseId" :label="item.courseName" :name="item.courseId.toString()" ></el-tab-pane>
            </el-tabs>
-       <!-- </div> -->
+         <!--  <div v-if="courseQueryParams.hasNextPage" class="xiangyou" @click="rightChange()">
+                                   <i class="el-icon-loading" v-if="courseQueryParams.loading"></i>
+                               </div> -->
 
-         <!-- <div class="filter-box">
+
+         <div class="filter-box">
            <el-popover
              placement="bottom"
              trigger="click"
              v-model="visible">
              <div class="tab-list">
-               <div class="tab-text" v-for="(item,index) in courseList" :key="index" @click="tabsClick(item.courseId)">
+               <div class="tab-text" v-for="(item,index) in courseList" :key="index" @click="tabsClick2(item.courseId)">
                  {{item.courseName}}
                </div>
                <div
                  v-if="courseQueryParams.hasNextPage"
                  class="load-more"
+                 @click="loadMore"
                  v-loading="courseQueryParams.loading"
                >
                  <span v-if="!courseQueryParams.loading">加载更多</span>
@@ -39,7 +38,7 @@
              </div>
              <div slot="reference" class="filter">筛选<img src="@/assets/image/filter_icon.png" width="16"/></div>
            </el-popover>
-         </div> -->
+         </div>
        </div>
 
           <!-- <el-select
@@ -140,11 +139,12 @@ export default {
   data() {
     return {
       courseId: null,
+      isChanging: false, // 切换状态（可选，用于加载动画）
       courseQueryParams: {
         //qwUserId: this.userId,
         sessionId:this.conversationId,
-        page: 1,
-        limit: 10,
+        pageNum: 1,
+        pageSize: 10,
         hasNextPage: false,
         loading: false,
       },
@@ -153,8 +153,8 @@ export default {
       videoQueryParams: {
         courseId: null,
         keyword: '',
-        page: 1,
-        limit: 10,
+        pageNum:1,
+        pageSize: 10,
         hasNextPage: false,
         loading: false,
       },
@@ -175,6 +175,11 @@ export default {
     handleBack() {
       this.$emit('back')
     },
+     // 导航栏左右箭头切换
+            rightChange(){
+              this.loadMore()
+
+            },
     tabsClick(tab,event) {
       this.visible=false
       let index= Number(tab.index)
@@ -182,21 +187,30 @@ export default {
           console.warn('无效的标签索引');
           return;
         }
-      this.activeIndex = this.courseList[index].courseName;
+      this.activeIndex = this.courseList[index].courseId.toString();
       this.courseId = this.courseList[index].courseId
       // this.activeIndex = id
       this.courseChange(this.courseId)
     },
+    tabsClick2(id) {
+      this.visible=false
+      this.activeIndex = id.toString();
+      this.courseChange(id)
+    },
     getFsCourseListBySidebar() {
       this.courseQueryParams.loading = true;
       getFsCourseListBySidebar(this.courseQueryParams).then(response => {
-        if (this.courseQueryParams.page === 1) {
+        if (this.courseQueryParams.pageNum === 1) {
           this.courseList = response.data.list;
-          this.activeIndex = response.data.list[0].courseName;
-           this.courseId = response.data.list[0].courseId;
+          this.activeIndex = response.data.list[0].courseId.toString();
+          this.courseId = response.data.list[0].courseId;
           this.courseChange(this.courseId)
+
         } else {
           this.courseList = [...this.courseList, ...response.data.list];
+          // this.activeIndex = this.courseList[0].courseId.toString();
+          // this.courseId = this.courseList[0].courseId;
+          // this.courseChange(this.courseId)
         }
         this.courseQueryParams.hasNextPage = response.data.hasNextPage;
         this.courseQueryParams.loading = false;
@@ -207,7 +221,7 @@ export default {
     loadMore() {
       if (!this.courseQueryParams.hasNextPage || this.courseQueryParams.loading) return;
 
-      this.courseQueryParams.page += 1;
+      this.courseQueryParams.pageNum += 1;
       this.getFsCourseListBySidebar();
     },
     handleSelectOpen(visible) {
@@ -257,27 +271,27 @@ export default {
       if (!this.videoQueryParams.courseId) {
         return
       }
-      this.videoQueryParams.page = 1;
+      this.videoQueryParams.pageNum = 1;
       this.getFsCourseVideoListBySidebar()
     },
     getFsCourseVideoListBySidebar() {
       this.videoQueryParams.loading = true;
       getFsCourseVideoListBySidebar(this.videoQueryParams).then(response => {
-        if (this.videoQueryParams.page === 1) {
+        if (this.videoQueryParams.pageNum === 1) {
           this.videoList = response.data.list;
         } else {
           this.videoList = [...this.videoList, ...response.data.list];
         }
         this.videoQueryParams.hasNextPage = response.data.hasNextPage;
         this.videoQueryParams.loading = false;
-        console.log(this.videoList)
+        //console.log(this.videoList)
       }).catch(() => {
         this.videoQueryParams.loading = false;
       })
     },
     loadMoreVideo() {
       if (!this.videoQueryParams.hasNextPage || this.videoQueryParams.loading) return;
-      this.videoQueryParams.page += 1;
+      this.videoQueryParams.pageNum += 1;
       this.getFsCourseVideoListBySidebar()
     },
     handleImgError(e) {
@@ -331,13 +345,42 @@ export default {
     font-size: 16px!important;
         font-weight: 600!important;
   }
+  .el-tabs__nav-wrap::after{
+    height: 0 !important;
+  }
+// .el-tabs__item{
+//   padding: 0 12px !important;
+// }
 </style>
 <style scoped lang="scss">
-
-
   .tab-box {
     width: 100%;
       background: #FFFFFF;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+.el-tabs{
+  width: 80%;
+  // &.isShow{
+  //   .el-tabs__nav-next{
+  //     display: none !important
+  //   }
+  // }
+}
+      .xiangyou{
+        width: 16px;
+        height: 24px;
+        font-size: 16px!important;
+            font-weight: 600!important;
+            position: absolute;
+            right: 0;
+
+      }
+      .xiangzuo{
+        font-size: 16px!important;
+            font-weight: 600!important;
+
+      }
       .tabs {
         // flex:1;
         padding: 0 10px;
@@ -384,6 +427,11 @@ export default {
       // line-height: 1.6;
       // text-align: center;
       // cursor: pointer;
+      height: 200px;
+      overflow-y: auto;
+      &::-webkit-scrollbar {
+        display: none; /* 隐藏滚动条 */
+      }
       .tab-text{
         line-height: 1.6;
         text-align: center;

src/views/qw/qwChat/userDetail/index.vue

@@ -7,7 +7,7 @@
         <div class="left">
           <img class="avatar-box" :src="qwUserInfo.avatar"/>
           <div class="left-box">
-            <div class="title">{{qwUserDetail.name || '未知'}}</div>
+            <div class="title2">{{qwUserDetail.name || '未知'}}</div>
             <div class="age-box">
               <img v-if="qwUserDetail.sex=='女'" src="@/assets/image/gender_female.png" width="12" height="12" />
               <img v-else src="@/assets/image/gender_male.png" width="12" height="12" />
@@ -24,7 +24,8 @@
       <div style="background-color: #fff;padding: 12px;border-radius: 6px 6px 6px 6px;">
         <div class="title-top">
           <div class="title">客户信息</div>
-            <div class="down-text" @click="handleDown">{{isExpanded?'收起':'展开'}}
+          <div class="down-text" >
+           <el-button type="text" @click="handleDown">{{isExpanded?'收起':'展开'}}</el-button>
             <img src="@/assets/image/sq_arrow_down.png" width="12" height="12" :class="{ 'rotate-90': !isExpanded }"/></div>
         </div>
         <!--  基本信息 -->
@@ -89,10 +90,10 @@
           <div class="title">
             用户看课记录
           </div>
-          <div class="more" @click="courseManage">
+          <!-- <div class="more" @click="courseManage">
             全部看课记录
             <i class="el-icon-arrow-right" style="font-size: 14px; color: #979B9E;"></i>
-          </div>
+          </div> -->
         </div>
         <userCourseWatchLog ref="userWatchLog" />
       </div>
@@ -410,7 +411,7 @@
         align-items: center;
         flex-direction: column;
 
-        .title {
+        .title2 {
           font-weight: 500;
           font-size: 16px;
           color: #141F36;
@@ -460,10 +461,14 @@
       .down-text {
         display: flex;
         align-items: center;
-        font-weight: 400;
-        font-size: 12px;
-        color: #84868C;
+        // font-weight: 400;
+        // font-size: 12px;
+
         cursor: pointer;
+        .el-button--text{
+          color: #84868C !important;
+          font-size: 12px !important;
+        }
         img {
           margin-left: 4px;
         }

src/views/qw/qwChat/userDetail/userBehavior.vue

@@ -20,10 +20,14 @@
         </el-select>
       </div>
     </div> -->
-    <div v-if="steps.length === 0" class="empty-tip">
+    <div v-if="steps.length === 0 && !loading" class="empty-tip">
       <img src="@/assets/image/no_page.png" width="280"/>
       <p>暂无记录</p>
     </div>
+    <div v-if="loading" class="loading-more">
+      <i class="el-icon-loading"></i>
+      <span>加载中...</span>
+    </div>
     <!-- 按日期分组展示（分页后的数据） -->
     <div v-if="steps.length != 0" v-for="(records, date) in groupedPaginatedSteps" :key="date" class="date-group">
       <!-- 日期标题（如果是今天，显示“今天”，否则显示具体日期） -->
@@ -478,7 +482,11 @@ export default {
   display: flex;
   align-items: center;
 }
-
+.loading-more {
+  text-align: center;
+  padding: 15px 0;
+  color: #909399;
+}
 .no-data {
   text-align: center;
   color: #999;

src/views/qw/qwChat/userDetail/userCourseWatchLog.vue

@@ -11,15 +11,26 @@
             <div class="text">记录编号：{{item.logId}}</div>
           </div>
         </div>
-        <div class="right">
+        <div class="right" :style="{'color':logTypeColors[item.logType]}">
          {{type(item.logType)}}
         </div>
       </div>
-      <div v-if="courseWatchLogList.length === 0" class="empty-tip">
+      <div v-if="courseWatchLogList.length === 0 && !loading" class="empty-tip">
         <!-- <i class="el-icon-video-camera"></i> -->
         <img src="@/assets/image/no_page.png" width="280"/>
         <p>暂无记录</p>
       </div>
+      <div v-if="loading" class="loading-more">
+        <i class="el-icon-loading"></i>
+        <span>加载中...</span>
+      </div>
+     <!-- <pagination
+        v-show="total>0"
+        :total="total"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getList"
+      /> -->
     </div>
   <!--  <el-table border v-loading="loading" :data="courseWatchLogList">
       <el-table-column label="记录编号" align="center" prop="logId" />
@@ -89,6 +100,14 @@ export default {
        qwExternalContactId:null,
         // logType: null,
       },
+      // 定义颜色常量
+      logTypeColors:[
+        '#D9E4FF', // 未看课
+         '#0bc6ff', // 看课中
+        '#67c23a', // 完课
+         '#f55a4f', // 待看课
+         '#ffd700' // 看课中断
+      ]
     };
   },
   computed: {
@@ -99,12 +118,8 @@ export default {
     type(){
        return (val) => { // 闭包函数，接收 val
              if (val) {
-               if(val==3){
-                 return '待看课';
-               }else{
                  let str=this.logTypeOptions.find(item => Number(item.dictValue) == val)
                  return str?str.dictLabel:'-';
-               }
              }else{
                return '-';
              }
@@ -181,9 +196,14 @@ export default {
       .right{
         font-weight: 400;
         font-size: 12px;
-        color: #FC4B0E;
+        // color: #FC4B0E;
       }
     }
+    .loading-more {
+      text-align: center;
+      padding: 15px 0;
+      color: #909399;
+    }
     .empty-tip {
       display: flex;
       flex-direction: column;
@@ -192,7 +212,11 @@ export default {
       padding: 40px 0;
       color: #909399;
     }
-
+.loading-more {
+  text-align: center;
+  padding: 15px 0;
+  color: #909399;
+}
     .empty-tip i {
       font-size: 48px;
       margin-bottom: 10px;

src/views/qw/qwChat/userDetail/userStorerDetails.vue

@@ -30,10 +30,14 @@
        </div>
       </div>
     </div>
-    <div v-if="orderList.length === 0" class="empty-tip">
+    <div v-if="orderList.length === 0 && !loading" class="empty-tip">
       <img src="@/assets/image/no_page.png" width="280"/>
       <p>暂无订单</p>
     </div>
+    <div v-if="loading" class="loading-more">
+      <i class="el-icon-loading"></i>
+      <span>加载中...</span>
+    </div>
  <!--   <el-table v-loading="loading" :data="orderList" border>
       <el-table-column label="订单号" align="center" prop="orderCode" width="180px"/>
       <el-table-column label="用户昵称" align="center" prop="nickName" show-overflow-tooltip width="100px"/>
@@ -92,7 +96,7 @@
       </el-table-column>
     </el-table> -->
 
-<!--    <pagination
+   <!-- <pagination
       v-show="total>0"
       :total="total"
       :page.sync="queryParams.pageNum"
@@ -236,7 +240,11 @@ export default {
     padding: 40px 0;
     color: #909399;
   }
-
+.loading-more {
+  text-align: center;
+  padding: 15px 0;
+  color: #909399;
+}
   .empty-tip i {
     font-size: 48px;
     margin-bottom: 10px;