主题样式微调

src/components/chartDesigner/sections/style/theme/default.less

@@ -13,10 +13,10 @@
                 }
             }
             &:nth-child(odd) {
-                background: #3054AF;
+                background: #7284F7;
             }
             &:nth-child(even) {
-                background: #4F96E3;
+                background: #69B0FE;
             }
         }
     }

src/components/chartDesigner/sections/style/theme/theme2.less

@@ -116,18 +116,21 @@
         }
     }
 }
-.chartview.theme2 {
-    background: rgba(41,52,65,1);
-    &> .chartview-toolbar {
-        &> .chart-title {
-            color: #9fc8e6 !important;
-        }
-        > .chart-tools {
-            >.anticon {
-                color: #9fc8e6;
-                &:hover {
-                    color: @icon-color-hover;
-                  }
+.dashboard-viewcontent.theme2 {
+    background: #DBE5F2;
+    .chartview {
+        background: rgba(41,52,65,1);
+        &> .chartview-toolbar {
+            &> .chart-title {
+                color: #9fc8e6 !important;
+            }
+            > .chart-tools {
+                >.anticon {
+                    color: #9fc8e6;
+                    &:hover {
+                        color: @icon-color-hover;
+                      }
+                }
             }
         }
     }

src/components/dashboardDesigner/viewLayout.jsx

@@ -93,11 +93,11 @@ class ViewLayout extends React.PureComponent {
     render() {
         const { dashboardDesigner, contentSize, lastContentSize, dispatch } = this.props;
         const { editingKey } = this.state;
-        const { editMode, minLayoutHeight, layoutMargin } = dashboardDesigner;
+        const { editMode, minLayoutHeight, layoutMargin, theme: themeName } = dashboardDesigner;
         const { visiblePreviewBox, previewItem } = this.state;
         const children = dashboardDesigner.items.map((item) => this.createElement(item, false, !item.chartOption));
         
-        return (<div className='dashboard-viewcontent' ref={node => this.viewContentRef = node}>
+        return (<div className={`dashboard-viewcontent ${themeName}`} ref={node => this.viewContentRef = node}>
             <ReactGridLayout
                 width={ contentSize.width ? contentSize.width : lastContentSize.width }
                 autoSize={true}

src/components/dashboardDesigner/viewLayoutItem.jsx

@@ -21,12 +21,12 @@ class ViewLayoutItem extends React.Component {
         const { dispatch, main, dashboardDesigner, item, isPreview, reload } = this.props;
         const { editing, title } = this.state;
         const { currentUser } = main;
-        const { dashboardDesignerCode, editMode, minLayoutHeight, theme: themeName } = dashboardDesigner;
+        const { dashboardDesignerCode, editMode, minLayoutHeight } = dashboardDesigner;
         const { code, name, viewType, layout, chartCode, chartOption } = item;
         const iconCls = editMode ? 'visible-icon' : '';
 
         return (
-            <div className={`chartview${ isPreview ? ' chartview-preview' : (editMode ? ' chartview-edit' : '')} ${themeName}`} style={{ height: '100%' }}>
+            <div className={`chartview${ isPreview ? ' chartview-preview' : (editMode ? ' chartview-edit' : '')}`} style={{ height: '100%' }}>
                 <div className='chartview-toolbar mover'>
                     <div className='chart-title'>
                         {editing ? <Input width={200} ref={node => this['inputRef-' + code] = node} defaultValue={name}