数据质量页面样式调整

src/pages/assets/style.less

@@ -5,6 +5,12 @@
   font-size: 14px;
 }
 
+.asset-list {
+  height: calc(100vh - 270px) !important;
+  overflow: auto;
+  margin-bottom: 10px;
+}
+
 .asset-table:global(.ant-card) {
   height: calc(100vh - 176px);
   overflow: auto;

src/pages/data/dataquality/index.tsx

@@ -15,6 +15,11 @@ import {
   queryErrorOrGoodJobAction,
   queryNeverJobAction,
 } from './model';
+import styles from '../style.less';
+import classNames from 'classnames';
+import success from '@/assets/manage/success.png';
+import error from '@/assets/manage/error.png';
+import unexecute from '@/assets/manage/unexecute.png';
 
 const tableColResponsiveProps = {
   xs: 24,
@@ -317,44 +322,53 @@ class DataQuality extends React.Component<Props, State> {
         </Form.Item>
       </Form>
     );
+
+    const Title = (img: any, text: string) => {
+      return ( 
+        <div style={{display:'flex',alignItems:'center'}}>
+          <img src={img} width={15} />
+          <span style={{marginLeft:'5px',color:'#333'}}>{text}</span>
+        </div>
+      );
+    }
     return (
       <PageHeaderWrapper extra={extraContent}>
         <Row gutter={16} type="flex">
           <Col {...tableColResponsiveProps}>
             <Card
               bordered={false}
-              title="错误任务"
+              title={Title(error,"错误任务")}
               extra={<Tag color="gold">计数</Tag>}
               bodyStyle={{ padding: '20px 24px 8px 24px' }}
               loading={loadingTotal}
             >
-              <Statistic value={totalData ? totalData.badJobCount : 0} />
+              <Statistic className={classNames(styles.errorCount,'text-center')} value={totalData ? totalData.badJobCount : 0} />
             </Card>
           </Col>
           <Col {...tableColResponsiveProps}>
             <Card
               bordered={false}
-              title="成功任务"
+              title={Title(success,"成功任务")}
               extra={<Tag color="#108ee9">计数</Tag>}
               bodyStyle={{ padding: '20px 24px 8px 24px' }}
               loading={loadingTotal}
             >
-              <Statistic value={totalData ? totalData.goodJobCount : 0} />
+              <Statistic className={classNames(styles.successCount,'text-center')} value={totalData ? totalData.goodJobCount : 0} />
             </Card>
           </Col>
           <Col {...tableColResponsiveProps}>
             <Card
               bordered={false}
-              title="未执行任务"
+              title={Title(unexecute,"未执行任务")}
               extra={<Tag>计数</Tag>}
               bodyStyle={{ padding: '20px 24px 8px 24px' }}
               loading={loadingTotal}
             >
-              <Statistic value={totalData ? totalData.neverRunJobCount : 0} />
+              <Statistic className={classNames(styles.unexecuteCount,'text-center')} value={totalData ? totalData.neverRunJobCount : 0} />
             </Card>
           </Col>
         </Row>
-        <Row gutter={16} type="flex">
+        <Row gutter={16} type="flex" className={styles.taskDetail}>
           <Col {...tableColResponsiveProps}>
             <Card
               bordered={false}

src/pages/data/style.less

@@ -16,6 +16,12 @@
   font-size: 14px;
 }
 
+.asset-list {
+  height: calc(100vh - 270px) !important;
+  overflow: auto;
+  margin-bottom: 10px;
+}
+
 .extraContentSearch {
   width: 272px;
   margin-left: 16px;
@@ -24,3 +30,38 @@
 .tableHeight {
   height: calc(100vh - 180px);
 }
+
+.errorCount :global(.ant-statistic-content) {
+  font-weight: bold !important;
+  color: #C90000 !important;
+  font-size: 38px !important;
+}
+
+.successCount :global(.ant-statistic-content) {
+  font-weight: bold !important;
+  color: #02C90F !important;
+  font-size: 38px !important;
+}
+
+.unexecuteCount :global(.ant-statistic-content) {
+  font-weight: bold !important;
+  color: #999999 !important;
+  font-size: 38px !important;
+}
+
+.taskDetail {
+  :global(.ant-table-title) {
+    color: #333 !important;
+  }
+
+  :global(.ant-table-column-title) {
+    color: #333 !important;
+    font-weight: normal;
+    font-size: 13px;
+  }
+
+  :global(.ant-table-tbody) {
+    color: #666 !important;
+    font-size: 12px;
+  }
+}