Browse Source

用户管理样式微调

zhuth 6 years ago
parent
commit
eb9054228e

+ 5 - 4
src/components/admin/admin.jsx

@@ -24,16 +24,17 @@ class Admin extends React.Component {
 
     render() {
         return (      
-            <Tabs 
+            <Tabs
+                type='card'
                 className='admin-tabs'
-                tabPosition='left'
+                tabPosition='top'
                 defaultActiveKey="userGroup"
                 onChange={this.changeTab}
             >
-                <TabPane tab="用户组" key="userGroup" >
+                <TabPane tab="用户组" key="userGroup" >
                     <UserGroupManagement />
                 </TabPane>
-                <TabPane tab="用户管理" key="user" >
+                <TabPane tab="用户" key="user" >
                     <UserManagement/>
                 </TabPane>
             </Tabs>

+ 6 - 1
src/components/admin/admin.less

@@ -1,10 +1,15 @@
 .admin-tabs {
     height: 100%;
+    display: flex;
+    flex-direction: column;
+    background: #fff;
+    padding: 12px;
     .ant-tabs-bar {
         margin: 0;
     }
     .ant-tabs-content {
-        height: 100%;
+        flex: auto;
+        overflow: hidden;
         border: none !important;
         .ant-tabs-tabpane {
             height: 100%;

+ 21 - 19
src/components/admin/userGroupManagement.jsx

@@ -140,27 +140,29 @@ class UserGroupManagement extends React.Component {
                 <Content>
                     <div className='groupname'>
                         <span>{selectedGroup ? selectedGroup.name : ''}</span>
-                        {selectedGroup && <Button className='delete-btn' onClick={() => {
-                            this.setState({
-                                visibleDeleteBox: true
-                            })
-                        }}>
-                            <Icon type="delete" />删除用户组
-                        </Button>}
-                        {visibleDeleteBox && <DeleteBox
-                            visibleBox={visibleDeleteBox}
-                            text={`确定要删除用户组【${selectedGroup.name}】吗?`}
-                            hideBox={() => {
+                        <div className='buttons'>
+                            {selectedGroup && <Button className='button delete-button' onClick={() => {
                                 this.setState({
-                                    visibleDeleteBox: false
+                                    visibleDeleteBox: true
                                 })
-                            }}
-                            okHandler={() =>{
-                                dispatch({ type: 'userGroup/remoteDelete', group: selectedGroup });
-                        }} />}
-                        {selectedGroup && <Button className='edit-btn' onClick={() => {this.showDetailBox('modify')}}>
-                            <Icon type="edit" />编辑用户组
-                        </Button>}
+                            }}>
+                                <Icon type="delete" />删除用户组
+                            </Button>}
+                            {visibleDeleteBox && <DeleteBox
+                                visibleBox={visibleDeleteBox}
+                                text={`确定要删除用户组【${selectedGroup.name}】吗?`}
+                                hideBox={() => {
+                                    this.setState({
+                                        visibleDeleteBox: false
+                                    })
+                                }}
+                                okHandler={() =>{
+                                    dispatch({ type: 'userGroup/remoteDelete', group: selectedGroup });
+                            }} />}
+                            {selectedGroup && <Button className='button edit-button' onClick={() => {this.showDetailBox('modify')}}>
+                                <Icon type="edit" />编辑用户组
+                            </Button>}
+                        </div>
                     </div>
                     <Table
                         className='member-table'

+ 13 - 13
src/components/admin/userGroupManagement.less

@@ -1,15 +1,14 @@
 .group-layout {
     height: 100%;
     background: white;
-    padding: 5px;
-    border: 1px solid #e8e8e8;
+    border: 1px solid #ccc;
     flex-direction: row;
     .ant-layout-sider {
         height: 100%;
         background: white;
         .ant-layout-sider-children {
             height: 100%;
-            border-right: 1px solid #e8e8e8;
+            border-right: 1px solid #ccc;
             padding: 37px 5px;
             .search-area {
                 margin-top: -32px;
@@ -23,18 +22,19 @@
         }
     }
     .ant-layout-content {
-        padding: 40px 5px 37px 5px;
+        padding: 56px 5px 37px 5px;
         overflow: hidden;
         .groupname {
-            height: 40px;
-            margin-top: -40px;
-            line-height: 35px;
-            padding-left: 20px;
-            .edit-btn {
-                float: right;
-            }
-            .delete-btn {
-                float: right;
+            height: 56px;
+            display: flex;
+            justify-content: space-between;
+            margin-top: -56px;
+            line-height: 40px;
+            padding: 8px 8px 8px 5px;
+            .buttons {
+                .button {
+                    margin-left: 8px;
+                }
             }
         }
         .member-table {

+ 0 - 1
src/components/chart/thumbnail.jsx

@@ -4,7 +4,6 @@ import resolveChartOption from './resolveChartOption'
 
 const Thumbnail = ({ style, type, code, option }) => {
     const newOption = resolveChartOption(option, true, true);
-    console.log(newOption);
     const viewType = ['bar', 'line', 'pie', 'scatter'].indexOf(type) !== -1 ? 'echarts' :
         (['aggregateTable', 'dataView'].indexOf(type) !== -1 ? 'table' : 'default');
         

+ 5 - 3
src/components/common/selectUserBox/selectUserBox.jsx

@@ -20,10 +20,13 @@ class AddGroupMemberBox extends React.Component {
 
     fetchUserData = (keyword) => {
         this.setState({ userData: [], fetching: true }, () => {
-            const body = keyword || '';
+            let condition = keyword || '';
             service.fetch({
                 url: URLS.USER_QUERY,
-                body: body,
+                method: 'GET',
+                body: {
+                    condition
+                },
             }).then(r => {
                 if(!r.err && r.data.code > 0) {
                     return r;
@@ -32,7 +35,6 @@ class AddGroupMemberBox extends React.Component {
                     throw obj;
                 }
             }).then(r => {
-                console.log('获得用户数据', body, r);
                 const resData = r.data.data || [];
                 this.setState({
                     userData: resData.map(d => ({

+ 12 - 14
src/components/dashboardDesigner/configSider.jsx

@@ -15,7 +15,7 @@ class ConfigSider extends React.Component {
             visibleChooseChartBox: false,
             visibleCusFilterBox: false,
             copyDisabled: false,
-            copyText: '生成链接'
+            copyText: '复制'
         };
     }
 
@@ -98,19 +98,17 @@ class ConfigSider extends React.Component {
                         if(copyDisabled || !dashboardDesigner.shareCode) {
                             return;
                         }
-                        dispatch({ type: 'dashboardDesigner/encryptCode', shareCode: dashboardDesigner.shareCode }).then(key => {
-                            copy(window.location.origin + '/#/dashboard/share/' + key);
-                            this.setState({
-                                copyDisabled: true,
-                                copyText: '已复制到剪贴板'
-                            }, () => {
-                                setTimeout(() => {
-                                    this.setState({
-                                        copyDisabled: false,
-                                        copyText: '生成链接'
-                                    });
-                                }, 3000)
-                            });
+                        copy(dashboardDesigner.shareCode);
+                        this.setState({
+                            copyDisabled: true,
+                            copyText: '已复制'
+                        }, () => {
+                            setTimeout(() => {
+                                this.setState({
+                                    copyDisabled: false,
+                                    copyText: '复制'
+                                });
+                            }, 3000)
                         });
                     }}>{copyText}</span>}
                 />

+ 4 - 0
src/components/setting/index.less

@@ -1,9 +1,13 @@
 .layout-setting {
     .sider-setting {
         padding: 12px;
+        border: 1px solid #ccc;
         button {
             padding: 0 8px;
             margin: 0 0 12px 0;
         }
     }
+    .content-setting {
+        // padding: 12px;
+    }
 }