图表展开折叠按钮样式调整

src/components/chartDesigner/content.jsx

@@ -67,16 +67,8 @@ class ChartDesignerContent extends React.Component {
         console.log(autoRefresh);
         return (
             <Layout className='chartdesigner'>
-                <Sider 
-                    className={`sider-left${this.state.collapsed ? ' sider-left-collapsed' : ''}`}>
-                    <Icon type= {`${this.state.collapsed?'right':'left'}`}
-                        style={{
-                            position: 'absolute',
-                            right: this.state.collapsed?'-20px':'5px',
-                            top: '10px',
-                            zIndex: 100
-                        }} 
-                        onClick={this.onCollapse}/>
+                <Sider className={`sider-left${this.state.collapsed ? ' sider-left-collapsed' : ''}`}>
+                    <Button className='collapse-toggle' shape='circle' size='small' icon={`${this.state.collapsed?'right':'left'}`} onClick={this.onCollapse} />
                     <Tabs className='sider-tabs'>
                         <TabPane className='chartconfig' tab='图表设置' key='1'>
                             <BaseConfigForm formItemLayout={formItemLayout}/>

src/components/chartDesigner/content.less

@@ -4,6 +4,12 @@
         max-width: 300px !important;
         min-width: 300px !important;
         width: 300px !important;
+        .collapse-toggle {
+            position: absolute;
+            right: -13px;
+            top: 6px;
+            z-index: 100;
+        }
         .sider-tabs {
             .ant-tabs-nav .ant-tabs-tab {
                 height: 37px;
@@ -33,6 +39,10 @@
         max-width: 0px !important;
         min-width: 0px !important;
         width: 0px !important;
+        .collapse-toggle {
+            background: #1890ff;
+            color: white;
+        }
     }
     .ant-cascader-picker {
         .anticon {