开发: 对客户群聊分组显示

src/pages/ChatLogs/index.module.scss

@@ -22,9 +22,7 @@
   padding: 0 12px;
   border-bottom: 1px solid #ddd;
   cursor: pointer;
-  &:first-child {
-    margin-top: 1px;
-  }
+
   &:hover {
     background-color: #bae0ff;
   }
@@ -66,6 +64,7 @@
   justify-content: center;
   width: 40px;
   height: 40px;
+  overflow: hidden;
   line-height: 1;
   background-color: #69b1ff;
   border-radius: 4px;
@@ -77,13 +76,32 @@
   overflow: auto;
 }
 
+.groupMenu {
+  position: relative;
+  height: calc(100vh - 212px - 164px);
+
+  .groupListContent {
+    height: 0;
+    overflow: hidden;
+    transition: height 0.3s;
+  }
+
+  .groupListContentShow {
+    height: calc(100% - 34px * 3);
+  }
+
+  .groupListContentShowOver {
+    overflow: auto;
+  }
+}
+
 .delFollowList {
   position: absolute;
   top: calc(100% - 34px);
   z-index: 1;
   width: 100%;
   height: 34px;
-  background-color: #fff;
+  background-color: #f5f5f5;
   transition: top 0.3s, height 0.3s;
   .chatB {
     margin-top: 0;
@@ -94,6 +112,7 @@
   }
 }
 
+.groupNav,
 .delFollowListBar {
   z-index: 1;
   display: flex;
@@ -102,6 +121,7 @@
   height: 34px;
   padding: 0 12px;
   color: #1890ff;
+  background: #fff;
   cursor: pointer;
 
   &:hover {