refactor: resource table columns

src/components/card-wrapper/index.less

@@ -2,6 +2,6 @@
   border-radius: var(--border-radius-small);
   background-color: var(--color-white-1);
   box-shadow: none;
-  padding: 10px;
+  padding: 10px 16px;
   border: 1px solid var(--ant-color-border);
 }

src/components/echarts/config.ts

@@ -67,6 +67,7 @@ export default function useChartConfig() {
   const legend = {
     itemWidth: 8,
     itemHeight: 8,
+    itemGap: 12,
     textStyle: {
       color: chartColorMap.axislabelColor
     }

src/components/echarts/line-chart.tsx

@@ -16,7 +16,10 @@ const LineChart: React.FC<ChartProps> = (props) => {
     tooltipValueFormatter = null,
     legendData = [],
     smooth,
-    title
+    title,
+    legendOptions,
+    gridOptions,
+    titleOptions
   } = props;
   const {
     grid,
@@ -42,7 +45,10 @@ const LineChart: React.FC<ChartProps> = (props) => {
     title: {
       text: ''
     },
-    grid,
+    grid: {
+      ...grid,
+      ...gridOptions
+    },
     tooltip: {
       ...tooltip,
       formatter(params: any) {
@@ -61,6 +67,7 @@ const LineChart: React.FC<ChartProps> = (props) => {
     yAxis,
     legend: {
       ...legend,
+      ...legendOptions,
       data: legendData.map((item: any) => {
         return {
           name: item,
@@ -93,6 +100,7 @@ const LineChart: React.FC<ChartProps> = (props) => {
       animation: false,
       title: {
         ...titleConfig,
+        ...titleOptions,
         text: title
       },
       yAxis: {
@@ -109,7 +117,16 @@ const LineChart: React.FC<ChartProps> = (props) => {
       },
       series: data
     };
-  }, [seriesData, xAxisData, yAxisName, title, smooth, legendData, options]);
+  }, [
+    seriesData,
+    xAxisData,
+    yAxisName,
+    title,
+    smooth,
+    titleOptions,
+    legendData,
+    options
+  ]);
 
   return (
     <>

src/components/echarts/types.ts

@@ -1,14 +1,29 @@
-import type { LegendComponentOption } from 'echarts/components';
+import type {
+  LegendComponentOption,
+  TitleComponentOption
+} from 'echarts/components';
 export interface ChartProps {
   seriesData: any[];
   showEmpty?: boolean;
   xAxisData: string[];
   legendData?: LegendComponentOption['data'];
+  legendOptions?: {
+    [K in keyof LegendComponentOption]?: LegendComponentOption[K];
+  };
+  gridOptions?: {
+    left?: string | number;
+    right?: string | number;
+    top?: string | number;
+    bottom?: string | number;
+  };
   labelFormatter?: (val?: any, index?: number) => string;
   tooltipValueFormatter?: (val: any) => string;
   height: string | number;
   width?: string | number;
   title?: string;
+  titleOptions?: {
+    [K in keyof TitleComponentOption]?: TitleComponentOption[K];
+  };
   value?: number;
   smooth?: boolean;
   color?: string;

src/components/page-tools/index.tsx

@@ -93,8 +93,8 @@ export const FilterBar: React.FC<FilterBarProps> = (props) => {
     actionType = 'button',
     marginBottom = 10,
     marginTop = 10,
-    inputHolder = 'common.filter.name',
-    selectHolder = '',
+    inputHolder,
+    selectHolder,
     showPrimaryButton = true,
     showDeleteButton = true,
     width
@@ -165,9 +165,12 @@ export const FilterBar: React.FC<FilterBarProps> = (props) => {
       left={
         <Space>
           <Input
-            placeholder={intl.formatMessage({
-              id: inputHolder
-            })}
+            placeholder={
+              inputHolder ||
+              intl.formatMessage({
+                id: 'common.filter.name'
+              })
+            }
             style={{ width: width?.input || 230 }}
             allowClear
             onChange={handleInputChange}
@@ -176,9 +179,7 @@ export const FilterBar: React.FC<FilterBarProps> = (props) => {
             <Select
               allowClear
               showSearch={false}
-              placeholder={intl.formatMessage({
-                id: selectHolder
-              })}
+              placeholder={selectHolder}
               style={{ width: width?.select || 230 }}
               size="large"
               onChange={handleSelectChange}

src/components/seal-form/components/label-info.tsx

@@ -41,11 +41,7 @@ const NoteInfo: React.FC<NoteInfoProps> = (props) => {
 
   return (
     <span className="label-text">
-      {description ? (
-        <Tooltip title={description}>{labelContent}</Tooltip>
-      ) : (
-        labelContent
-      )}
+      <Tooltip title={description || false}>{labelContent}</Tooltip>
       {labelExtra}
     </span>
   );