优化

src/components/InvitingPersonnelModal/index.tsx

@@ -4,7 +4,7 @@ import { useState, useImperativeHandle, forwardRef, useEffect } from "react";
 import { SearchOutlined } from '@ant-design/icons';
 import { GetUserList } from '@/api/Home/User';
 import { useLocation } from 'react-router-dom';
-import { PostRoomInvite } from '@/api/Meeting';
+import { GetRoomUser, PostRoomInvite } from '@/api/Meeting';
 import { storage } from '@/utils';
 import Avatar from '@/components/Avatar';
 const InvitingPersonnelModal = forwardRef((props: any, ref: any) => {
@@ -28,7 +28,7 @@ const InvitingPersonnelModal = forwardRef((props: any, ref: any) => {
       { label: '在线', value: 1 },
       { label: '不在线', value: 2 },
     ],
-    optionsValue: [1, 2]
+    optionsValue: [1]
   });
   const [list, setList] = useState<any>({
     data: [],
@@ -71,20 +71,24 @@ const InvitingPersonnelModal = forwardRef((props: any, ref: any) => {
   };
   // 获取用户列表
   const getUserList = async (): Promise<void> => {
-    await GetUserList({
+    Promise.all([
-      pageIndex: list.pageIndex,
+      GetRoomUser(state.channelId),
-      pageSize: list.pageSize,
+      GetUserList({
-      searchKeywod: list.searchKeywod,
+        pageIndex: list.pageIndex,
-      isOnline: operation.optionsValue.length === 1 ? operation.optionsValue[0] === 1 ? true : false : '',
+        pageSize: list.pageSize,
-    }).then(res => {
+        searchKeywod: list.searchKeywod,
-      if (res.code === 200) {
+        isOnline: operation.optionsValue.length === 1 ? operation.optionsValue[0] === 1 ? true : false : '',
+      })
+    ]).then(res => {
+      if (res[0].code === 200 && res[1].code === 200) {
         setList({
           ...list,
-          total: res.data.total,
+          total: res[1].data.total,
-          data: res.data.items.map((item: any) => {
+          data: res[1].data.items.map((item: any) => {
             return {
               ...item,
               checked: checkedList.find((checkedItem: any) => checkedItem.id === item.id) ? true : false,
+              disabled: res[0].data.find((row: any) => row.account === item.account) ? true : false
             }
           }),
         })
@@ -130,7 +134,9 @@ const InvitingPersonnelModal = forwardRef((props: any, ref: any) => {
                 style={{ flexShrink: 0, margin: '10px 0' }}
                 options={operation.options}
                 value={operation.optionsValue}
-                onChange={changeOptionsValue}
+                onChange={(e)=>{
+                  changeOptionsValue(e)
+                }}
               />
               <div className={styles.invitingPersonnelModalContentLeftUserList}>
                 {list.data.length ? list.data.map((item: any, index: number) => <div key={item.id}>
@@ -150,7 +156,7 @@ const InvitingPersonnelModal = forwardRef((props: any, ref: any) => {
                           return checkedList
                         }
                       })
-                    }} defaultChecked={item.checked} disabled={!item.isOnline || item.account === user.account}></Checkbox>
+                    }} defaultChecked={item.checked} disabled={!item.isOnline || item.account === user.account || item.disabled}></Checkbox>
                     <div><Avatar name={item.userName} /></div>
                     <span>{item.userName}</span>
                   </div>
@@ -162,7 +168,7 @@ const InvitingPersonnelModal = forwardRef((props: any, ref: any) => {
                   ...list,
                   pageIndex: e
                 })
-              }} pageSize={list.pageSize} current={list.pageIndex} hideOnSinglePage={true} showLessItems={true}/>
+              }} pageSize={list.pageSize} current={list.pageIndex} hideOnSinglePage={true} showLessItems={true} />
             </div>
             <div className={styles.invitingPersonnelModalContentRight}>
               <span>已选成员</span>

src/components/Operation/index.tsx

@@ -137,7 +137,7 @@ const Operation: React.FC = () => {
             <Checkbox onChange={(e) => {
               setIsTips(e.target.checked)
               storage.setItem('isTips', e.target.checked)
-            }} defaultChecked={isTips}>不在提示</Checkbox>
+            }} defaultChecked={isTips}>不再提示</Checkbox>
             <div>
               <Button type="primary" className='m-ant-btn' onClick={() => {
                 setIsCloseModal(false)

src/page/Login/index.tsx

@@ -82,6 +82,7 @@ const Login: React.FC = () => {
     if (!operation.account) {
       return message.error('请输入账号！')
     }
+    operation.password = "";
     GetCheckUser(operation.account).then(res => {
       if (res.code === 200) {
         res.data ? setAccountPasswordStatus(true) : message.error('账号不存在!')
@@ -109,6 +110,10 @@ const Login: React.FC = () => {
 
   // 登录
   const loginClick = (): void => {
+    if (operation.password === '') {
+      message.error('请输入密码');
+      return;
+    }
     PostLogin({
       account: operation.account,
       pwd: CryptoJS.MD5(operation.password).toString(CryptoJS.enc.Hex)
@@ -162,6 +167,7 @@ const Login: React.FC = () => {
                     account: e.target.value
                   })
                 }}
+                disabled={accountPasswordStatus}
                 className={`${styles.loginInputIcon} drag`}
                 style={{ marginBottom: '12px' }}
                 placeholder="请输入账号"

src/page/Meeting/index.module.scss

@@ -66,7 +66,7 @@
 .meeting {
   width: 100%;
   height: 100%;
-  background-color: rgba(16, 19, 23);
+  background-color: #1F2022;
   display: flex;
   flex-direction: column;
 
@@ -245,7 +245,7 @@
           box-sizing: border-box;
 
           .active {
-            border: 1px solid rgb(106, 106, 106);
+            // border: 1px solid rgb(106, 106, 106);
             box-sizing: border-box;
           }
 
@@ -540,6 +540,7 @@
           align-items: center;
           margin-right: 30px;
           cursor: pointer;
+          position: relative;
 
           &:last-child {
             margin: 0;
@@ -554,6 +555,14 @@
             font-size: 14px;
           }
 
+          >div {
+            position: absolute;
+            color: white;
+            font-size: 14px;
+            right: -20px;
+            width: 30px;
+          }
+
           &:hover {
             >span {
               color: #4096ff;
@@ -563,7 +572,6 @@
           &:active {
             >span {
               color: darken(#4096ff, 10%) !important;
-              ;
             }
           }
         }
@@ -686,7 +694,7 @@
 
     .active {
       >div {
-        border: 1px solid #EBEBEB;
+        // border: 1px solid #EBEBEB;
       }
     }
   }

src/page/Meeting/index.tsx

@@ -791,6 +791,7 @@ const Meeting: React.FC = () => {
                         <div className='drag' onClick={() => changeStatusList(row, itemIndex, rowIndex)} key={rowIndex}>
                           <img src={row.active ? row.iconActive : row.icon} alt="" />
                           <span>{row.title}</span>
+                          {row.title === '成员列表' ? <div>{roomUserList.length}</div> : null}
                         </div>
                     )
                   })}

src/utils/styles/App.scss

@@ -40,8 +40,8 @@ $pagination-hover-background-color: #5575F2;
   }
 }
 
-.ant-input-data-count {
+.ant-input-disabled {
-  color: white !important;
+  background-color: lighten($input-background-color, 10%) !important;
 }
 
 .ant-input-affix-wrapper {
@@ -62,6 +62,10 @@ $pagination-hover-background-color: #5575F2;
   }
 }
 
+.ant-input-disabled {
+  background-color: lighten($input-background-color, 10%) !important;
+}
+
 // button
 .m-ant-btn.ant-btn {
   background-color: $btn-background-color;
@@ -105,6 +109,21 @@ $pagination-hover-background-color: #5575F2;
   }
 }
 
+.ant-checkbox-wrapper-disabled {
+  .ant-checkbox {
+    .ant-checkbox-inner {
+      background-color: lighten($input-background-color, 20%) !important;
+
+    }
+  }
+
+  .ant-checkbox-checked {
+    .ant-checkbox-inner {
+      background-color: lighten($input-background-color, 20%) !important;
+    }
+  }
+}
+
 // table
 .ant-table {
   background-color: $table-header-background-color !important;