🐞 fix(): 修改采购报价新增没填写红标提醒

src/pages/transaction/purchaseAbility/offter/addOffter/add.tsx

 import React, { useEffect, useState, useRef, useCallback } from 'react';
-import { Tabs, Button, Card } from 'antd';
+import { Tabs, Button, Card, Badge } from 'antd';
 import { history } from 'umi';
 import { PageHeaderWrapper } from '@ant-design/pro-layout';
 import ReutrnEle from '@/components/ReturnEle';
@@ -28,6 +28,24 @@ const AddForm = () => {
   const [offer, setoffer] = useState<any>({});
   /** 报价说明 */
   const [explain, setexplain] = useState<any>({});
+  const [badge, setbadge] = useState<any>([0, 0, 0, 0]);
+  const TabFormErrors = (props) => {
+    return (
+      <Badge size="small" count={props.dot} offset={[6, -5]}>
+        {props.children}
+      </Badge>
+    )
+  }
+
+  /**必填没填写出现角标 */
+  const getError = (num: number, idx: number) => {
+    const data = [...badge];
+    data[idx] = num;
+    setbadge(data);
+    if (num !== 0) {
+      setLoading(false);
+    }
+  }
 
   /** 获取各模块的数据 */
   const currentBasic = useRef<any>({});
@@ -173,26 +191,29 @@ const AddForm = () => {
     >
       <Card>
         <Tabs type='card'>
-          <TabPane key='1' tab='基本信息' forceRender>
+          <TabPane key='1' tab={<TabFormErrors dot={badge[0]}>基本信息</TabFormErrors>} forceRender>
             <Basic
               fetchdata={basic}
               currentRef={currentBasic}
+              onBadge={getError}
             />
           </TabPane>
-          <TabPane key='2' tab='报价信息' forceRender>
+          <TabPane key='2' tab={<TabFormErrors dot={badge[1]}>报价信息</TabFormErrors>} forceRender>
             <Offer
               getKey={handleGetKey}
               fetchdata={offer}
               currentRef={currentOffer}
               name={path}
+              onBadge={getError}
             />
           </TabPane>
-          <TabPane key='3' tab='报价说明' forceRender>
+          <TabPane key='3' tab={<TabFormErrors dot={badge[2]}>报价说明</TabFormErrors>} forceRender>
             <Explain
               round={round}
               checkRound={checkRound}
               fetchdata={explain}
               currentRef={currentExplain}
+              onBadge={getError}
             />
           </TabPane>
           <TabPane key='4' tab='附件' forceRender>

src/pages/transaction/purchaseAbility/offter/addOffter/components/basic.tsx

@@ -32,6 +32,7 @@ const layout: any = {
 export interface IProps {
   fetchdata: any,
   currentRef: any,
+  onBadge?: Function
 }
 
 const BasicInfo: React.FC<IProps> = (props: any) => {
@@ -41,7 +42,8 @@ const BasicInfo: React.FC<IProps> = (props: any) => {
   const [form] = Form.useForm();
   const {
     fetchdata,
-    currentRef
+    currentRef,
+    onBadge
   } = props;
   const [telCode, setTelCode] = useState<any>([])
 
@@ -71,9 +73,10 @@ const BasicInfo: React.FC<IProps> = (props: any) => {
             name: 'basic',
             data: res,
           })
+          onBadge(0, 0)
         }).catch(error => {
           if (error && error.errorFields) {
-
+            onBadge(error.errorFields.length, 0)
           }
         })
       })

src/pages/transaction/purchaseAbility/offter/addOffter/components/explain.tsx

@@ -17,11 +17,12 @@ export interface IProps {
   round: number,
   /** 点击报价信息切换的轮次 */
   checkRound: number,
+  onBadge?: Function
 }
 
 const OfferExplain: React.FC<IProps> = (props: any) => {
   const [form] = Form.useForm();
-  const { fetchdata, currentRef, round, checkRound } = props;
+  const { fetchdata, currentRef, round, checkRound, onBadge } = props;
 
   useEffect(() => {
     if (fetchdata && (checkRound === round)) {
@@ -39,9 +40,10 @@ const OfferExplain: React.FC<IProps> = (props: any) => {
             name: 'explain',
             data: res,
           })
+          onBadge(0, 0)
         }).catch(error => {
           if (error && error.errorFields) {
-
+            onBadge(error.errorFields.length, 0)
           }
         })
       })

src/pages/transaction/purchaseAbility/offter/addOffter/components/offer.tsx

@@ -24,6 +24,7 @@ export interface IProps {
   name: string,
   /** 获取报价轮次 */
   getKey?: (e) => void,
+  onBadge?: Function
 }
 
 const OfferInfo: React.FC<IProps> = (props: any) => {
@@ -32,7 +33,8 @@ const OfferInfo: React.FC<IProps> = (props: any) => {
     fetchdata,
     currentRef,
     name,
-    getKey
+    getKey,
+    onBadge
   } = props;
   const [tabs, setTabs] = useState<number[]>([]);
   const [visible, setVisible] = useState<boolean>(false);
@@ -316,9 +318,10 @@ const OfferInfo: React.FC<IProps> = (props: any) => {
             name: 'offer',
             data: detailss,
           })
+          onBadge(0, 0)
         }).catch(error => {
           if (error && error.errorFields) {
-
+            onBadge(error.errorFields.length, 0)
           }
         })
       })