Browse Source

chore: 首页柱状图调整

xyh 2 years ago
parent
commit
e875144cc8
2 changed files with 26 additions and 1 deletions
  1. 12 1
      packages/app/src/pages/main/raw/index.tsx
  2. 14 0
      packages/app/src/styles/index.css

+ 12 - 1
packages/app/src/pages/main/raw/index.tsx

@@ -82,12 +82,23 @@ const RawChart: FC = function() {
             }}
           />
           <Tooltip
+            labelClassName='123'
+            contentStyle={{
+              background: 'rgba(0,0,0,.4)',
+              color: 'white !important',
+              borderRadius: '12px',
+              border: 'unset',
+              padding: '12px 24px',
+            }}
             formatter={function(value: string, name: string) {
               return [value, name === 'value' ? '入库' : '出库'];
             }}
             itemSorter={payload => payload.name === 'value' ? 1 : -1}
           />
-          <Bar dataKey='value' fill='#00a6ca' />
+          <Bar
+            dataKey='value'
+            fill='#00a6ca'
+          />
           <Bar dataKey='data' fill='#FAC858' />
         </BarChart>
       </ResponsiveContainer>

+ 14 - 0
packages/app/src/styles/index.css

@@ -145,3 +145,17 @@ img {
 .grey-icon {
   color: #bbb;
 }
+
+.recharts-tooltip-cursor {
+  fill: #eee !important;
+}
+
+.recharts-tooltip-item-list {
+  & li {
+    color: white !important;
+  }
+}
+
+.recharts-default-tooltip {
+  color: white;
+}