动态更新面包屑导航

src/pages/supplierEvaluateManage/supplierTaskManage/supplierTaskManageAdd.tsx

@@ -10,6 +10,7 @@ import DivisionStep from './components/DivisionStep';
 import styles from './supplierTaskManageAdd.less';
 import { TaskNotifyLowerUnits } from '@/dicts/supplierTaskDict';
 import type { SupplierTaskModelState } from '@/models/supplierTaskManage';
+import type { BreadcrumbState } from '@/models/breadcrumb';
 
 const { Step } = Steps;
 
@@ -40,7 +41,11 @@ interface PageProps extends ConnectProps {
  * 供应商任务管理添加/编辑组件
  * 使用步骤式表单引导用户完成添加或编辑任务的流程
  */
-const SupplierTaskManageAdd: React.FC<PageProps> = ({ supplierTaskManage, dispatch }) => {
+const SupplierTaskManageAdd: React.FC<PageProps> = ({
+  supplierTaskManage,
+  dispatch,
+  breadcrumb,
+}) => {
   const intl = useIntl();
   // 获取dva model中的状态
   const { currentStep, loading, detailLoading } = supplierTaskManage;
@@ -70,6 +75,11 @@ const SupplierTaskManageAdd: React.FC<PageProps> = ({ supplierTaskManage, dispat
         type: 'supplierTaskManage/saveMode',
         payload: 'edit',
       });
+      // 更新面包屑
+      dispatch({
+        type: 'breadcrumb/updateBreadcrumbName',
+        payload: intl.formatMessage({ id: 'supplierTaskManage.title.edit' }),
+      });
       // 编辑模式，获取任务详情
       dispatch({
         type: 'supplierTaskManage/fetchTaskDetail',
@@ -106,6 +116,9 @@ const SupplierTaskManageAdd: React.FC<PageProps> = ({ supplierTaskManage, dispat
         dispatch({
           type: 'supplierTaskManage/resetState',
         });
+        dispatch({
+          type: 'breadcrumb/resetBreadcrumb',
+        });
       }
     };
   }, [dispatch]);
@@ -124,7 +137,9 @@ const SupplierTaskManageAdd: React.FC<PageProps> = ({ supplierTaskManage, dispat
     },
     {
       title: intl.formatMessage({ id: 'supplierTaskManage.step.selectEvaluator.title' }),
-      description: intl.formatMessage({ id: 'supplierTaskManage.step.selectEvaluator.description' }),
+      description: intl.formatMessage({
+        id: 'supplierTaskManage.step.selectEvaluator.description',
+      }),
       content: <EvaluatorSelectStep ref={evaluatorFormRef} />,
     },
     {
@@ -177,7 +192,9 @@ const SupplierTaskManageAdd: React.FC<PageProps> = ({ supplierTaskManage, dispat
       if (typeof errorInfo === 'string') {
         message.error(errorInfo);
       } else if (errorInfo && errorInfo.errorFields) {
-        message.error(intl.formatMessage({ id: 'supplierTaskManage.message.formValidationFailed' }));
+        message.error(
+          intl.formatMessage({ id: 'supplierTaskManage.message.formValidationFailed' }),
+        );
       }
     }
   };
@@ -357,7 +374,14 @@ const SupplierTaskManageAdd: React.FC<PageProps> = ({ supplierTaskManage, dispat
 
 // 将dva model中的状态映射到组件props
 export default connect(
-  ({ supplierTaskManage }: { supplierTaskManage: SupplierTaskModelState }) => ({
+  ({
     supplierTaskManage,
+    breadcrumb,
+  }: {
+    supplierTaskManage: SupplierTaskModelState;
+    breadcrumb: BreadcrumbState;
+  }) => ({
+    supplierTaskManage,
+    breadcrumb,
   }),
 )(SupplierTaskManageAdd);

src/pages/supplierEvaluateManage/supplierTemplateManage/supplierTemplateManageAdd.tsx

@@ -16,7 +16,9 @@ import {
   Spin,
   Modal,
 } from 'antd';
-import { history, useLocation, useIntl } from 'umi';
+import { history, useLocation, useIntl, connect } from 'umi';
+import type { Dispatch,ConnectProps } from 'umi';
+import type { BreadcrumbState } from '@/models/breadcrumb';
 import { ArrowLeftOutlined, SaveOutlined, ExclamationCircleOutlined } from '@ant-design/icons';
 import EvaluateTemplateTable from '@/components/EvaluateTemplateTable';
 import CategorySelector from '@/components/CategorySelector';
@@ -50,6 +52,11 @@ interface FormValues {
   [key: string]: any;
 }
 
+interface PageProps extends ConnectProps {
+  breadcrumb: BreadcrumbState; // dva model状态
+  dispatch: Dispatch; // dva dispatch方法
+}
+
 interface LocationState {
   isEdit?: boolean;
   editData?: SupplierTemplateManage.TemplateItem;
@@ -57,7 +64,7 @@ interface LocationState {
 
 const { Title } = Typography;
 
-const SupplierTemplateManageAdd: React.FC = () => {
+const SupplierTemplateManageAdd: React.FC<PageProps> = ({ breadcrumb, dispatch }) => {
   const intl = useIntl();
   const [form] = Form.useForm<FormValues>();
   const [loading, setLoading] = useState<boolean>(false);
@@ -79,7 +86,12 @@ const SupplierTemplateManageAdd: React.FC = () => {
     try {
       const res = await getAllTemplates();
       if (res.success && res.data) {
-        setTemplateList(res.data);
+        // 如果是修改,需要过滤掉自己
+        if (location.state?.editData) {
+          setTemplateList(res.data.filter((template: SupplierTemplateManage.TemplateItem) => template.id !== location.state.editData?.id));
+        } else {
+          setTemplateList(res.data);
+        }
       } else {
         message.error(intl.formatMessage({ id: 'supplierTemplateManage.message.getTemplateListFailed' }) || res.message);
       }
@@ -122,6 +134,19 @@ const SupplierTemplateManageAdd: React.FC = () => {
       setLoading(false);
     }
   };
+  useEffect(() => {
+    if (location.state?.editData?.id && dispatch) {
+      dispatch({
+        type: 'breadcrumb/updateBreadcrumbName',
+        payload: intl.formatMessage({ id: "supplierTemplateManage.edit.title" }),
+      });
+    }
+    return () => {
+      dispatch({
+        type: 'breadcrumb/resetBreadcrumb',
+      });
+    };
+  }, [dispatch, intl, location]);
   // 初始化编辑数据
   useEffect(() => {
     // 获取所有模板列表
@@ -450,4 +475,9 @@ const SupplierTemplateManageAdd: React.FC = () => {
   );
 };
 
-export default SupplierTemplateManageAdd;
+
+// export default SupplierTemplateManageAdd;
+// 将dva model中的状态映射到组件props
+export default connect(({ breadcrumb }: { breadcrumb: BreadcrumbState }) => ({
+  breadcrumb,
+}))(SupplierTemplateManageAdd);