Quellcode durchsuchen

feat: 账号设置增加管理员标识

lanjianrong vor 4 Jahren
Ursprung
Commit
c8aa2678d1

+ 1 - 0
src/assets/icons/svg/user-circle.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512"><path d="M248 8C111 8 0 119 0 256s111 248 248 248 248-111 248-248S385 8 248 8zm0 96c48.6 0 88 39.4 88 88s-39.4 88-88 88-88-39.4-88-88 39.4-88 88-88zm0 344c-58.7 0-111.3-26.6-146.5-68.2 18.8-35.4 55.6-59.8 98.5-59.8 2.4 0 4.8.4 7.1 1.1 13 4.2 26.6 6.9 40.9 6.9 14.3 0 28-2.7 40.9-6.9 2.3-.7 4.7-1.1 7.1-1.1 42.9 0 79.7 24.4 98.5 59.8C359.3 421.4 306.7 448 248 448z"/></svg>

+ 14 - 13
src/pages/Management/Setting/index.module.scss

@@ -1,4 +1,5 @@
 .SettingContent {
+  margin: 1px;
   :global(.ant-btn) {
     color: #007bff;
     border-color: #007bff;
@@ -7,17 +8,17 @@
     color: #28a745;
     border-color: #28a745;
   }
-  :global(.ant-table-thead .ant-table-cell) {
-    padding: 0.4rem;
-    text-align: center;
-    background-color: #e9ecef;
-    border-right: 1px solid #dee2e6;
-    border-bottom: 2px solid #dee2e6;
-  }
-  :global(.ant-table-tbody .ant-table-cell) {
-    padding: 0.4rem;
-  }
-  :global(.ant-table.ant-table-bordered > .ant-table-container > .ant-table-content > table > thead > tr > th) {
-    border-right: 1px solid #dee2e6;
-  }
+  // :global(.ant-table-thead .ant-table-cell) {
+  //   padding: 0.4rem;
+  //   text-align: center;
+  //   background-color: #e9ecef;
+  //   border-right: 1px solid #dee2e6;
+  //   border-bottom: 2px solid #dee2e6;
+  // }
+  // :global(.ant-table-tbody .ant-table-cell) {
+  //   padding: 0.4rem;
+  // }
+  // :global(.ant-table.ant-table-bordered > .ant-table-container > .ant-table-content > table > thead > tr > th) {
+  //   border-right: 1px solid #dee2e6;
+  // }
 }

+ 18 - 2
src/pages/Management/Setting/index.tsx

@@ -1,9 +1,10 @@
 import Header from '@/components/Header'
 import Slot from '@/components/Header/slot'
+import SvgIcon from '@/components/SvgIcon'
 import { userStore } from '@/store/mobx'
 import { iUserInfo } from '@/types/setting'
 import consts from '@/utils/consts'
-import { Button, Input, Table } from 'antd'
+import { Button, Input, Table, Tooltip } from 'antd'
 import { ColumnsType } from 'antd/lib/table'
 import React, { useEffect, useState } from 'react'
 import { apiAccountList } from './api'
@@ -38,7 +39,20 @@ export default function Info() {
   const columns: ColumnsType<iUserInfo> = [
     {
       title: '账号',
-      dataIndex: 'account'
+      dataIndex: 'account',
+      // eslint-disable-next-line react/display-name
+      render: (text:any, record: iUserInfo) => {
+        return (
+          <div>
+            <span>{text}</span>
+            {
+              record.isAdmin ?
+                <Tooltip title="管理员"><span><SvgIcon iconClass="user-circle" fontSize="13"></SvgIcon></span></Tooltip>
+              : ''
+            }
+          </div>
+        )
+      }
     },
     {
       title: '姓名',
@@ -62,6 +76,7 @@ export default function Info() {
     },
     {
       title: '操作',
+      align: 'center',
       // eslint-disable-next-line react/display-name
       render: (_: any, record: iUserInfo) => {
         return (
@@ -90,6 +105,7 @@ export default function Info() {
           dataSource={userList}
           columns={columns}
           bordered
+          rowClassName={(record: iUserInfo) => record.enable ? 'pi-red' : ''}
           rowKey={record => record.id}
         ></Table>
       </div>