开发: 修改群图标

src/pages/ChatLogs/ChatUtils.tsx

@@ -190,22 +190,37 @@ type IGroupIcon = {
  */
 export const GroupIcon: React.FC<IGroupIcon> = (props) => {
   const [list, setList] = useState<any>([[], [], []]);
+  const [size, setSize] = useState(12);
 
   useEffect(() => {
     let temp: any = [[], [], []];
     const { groupList } = props;
-    for (let index = 0; index < 9; index++) {
+    // groupList.reverse();
-      const element = groupList[index];
+    if (groupList.length <= 4) {
-      if (index < 3) {
+      setSize(18);
-        temp[0].push(element);
+      for (let index = 0; index < 9; index++) {
-      } else if (index < 6) {
+        const element = groupList[index];
-        temp[1].push(element);
+        if (index < 2) {
-      } else {
+          temp[0].push(element);
-        temp[2].push(element);
+        } else {
+          temp[1].push(element);
+        }
+      }
+    } else {
+      setSize(12);
+      for (let index = 0; index < 9; index++) {
+        const element = groupList[index];
+        if (index < 3) {
+          temp[0].push(element);
+        } else if (index < 6) {
+          temp[1].push(element);
+        } else if (index < 9) {
+          temp[2].push(element);
+        }
       }
     }
     temp.reverse();
-    setList(temp);
+    setList(JSON.parse(JSON.stringify(temp)));
   }, [props.groupList]);
 
   return (
@@ -217,7 +232,7 @@ export const GroupIcon: React.FC<IGroupIcon> = (props) => {
               return el ? (
                 <div
                   key={`${el.avatar}_${el.name}`}
-                  style={{ width: 12, height: 12, borderRadius: 2, overflow: 'hidden' }}
+                  style={{ width: size, height: size, borderRadius: 2, overflow: 'hidden' }}
                 >
                   {el.avatar ? (
                     <img

src/pages/ChatLogs/components/index.module.scss

@@ -18,7 +18,7 @@
   justify-content: center;
   width: 34px;
   height: 34px;
-  background-color: #69b1ff;
+  background-color: #cfd1d4;
   border-radius: 4px;
 
   img {

src/pages/ChatLogs/index.module.scss

@@ -66,7 +66,7 @@
   height: 40px;
   overflow: hidden;
   line-height: 1;
-  background-color: #69b1ff;
+  background-color: #cfd1d4;
   border-radius: 4px;
 }
 

src/pages/ChatLogs/index.tsx

@@ -242,12 +242,12 @@ const ChatLogs: React.FC = () => {
         if (Array.isArray(res.data) && res.data.length) {
           setSelectStaff(res.data[0]);
           selectStaffRef.current = res.data[0];
-          // res.data.forEach((element: IStaffsItem) => {
+          res.data.forEach((element: IStaffsItem) => {
-          //   if (element.user_id == 'yangxb') {
+            if (element.user_id == 'yangxb') {
-          //     setSelectStaff(element);
+              setSelectStaff(element);
-          //     selectStaffRef.current = element;
+              selectStaffRef.current = element;
-          //   }
+            }
-          // });
+          });
           setStaffsList(res.data);
           setInnerStaffsList(res.data);
           getCustFollowsList();