From 5f58a1a2c41e50ed8fc9fe907b7a7203e9019ac3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B6=85=E7=BA=A7=E8=80=81=E7=99=BD=E5=85=94?=
 <fsmecx@gmail.com>
Date: Thu, 14 Aug 2025 17:05:36 +0800
Subject: [PATCH] =?UTF-8?q?FEAT=20=3D>=20=E6=9C=AC=E6=AC=A1=E6=9B=B4?=
 =?UTF-8?q?=E6=96=B0=E9=A1=B9=E7=9B=AE=E4=B8=BA=EF=BC=9A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../form/index.module.scss                    | 13 ++++
 .../traffic-distribution/form/index.tsx       | 66 +++++++++++--------
 2 files changed, 51 insertions(+), 28 deletions(-)

diff --git a/Cunkebao/src/pages/mobile/workspace/traffic-distribution/form/index.module.scss b/Cunkebao/src/pages/mobile/workspace/traffic-distribution/form/index.module.scss
index e3784a0e..212b42c7 100644
--- a/Cunkebao/src/pages/mobile/workspace/traffic-distribution/form/index.module.scss
+++ b/Cunkebao/src/pages/mobile/workspace/traffic-distribution/form/index.module.scss
@@ -191,6 +191,19 @@
   margin-top: 16px;
 }
 
+.formFooter {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 16px 20px;
+  background: #fff;
+  border-top: 1px solid #f0f0f0;
+}
+
+.footerBtn {
+  min-width: 80px;
+}
+
 // 步骤条美化
 .formSteps :global(.ant-steps-item-title) {
   font-size: 15px;
diff --git a/Cunkebao/src/pages/mobile/workspace/traffic-distribution/form/index.tsx b/Cunkebao/src/pages/mobile/workspace/traffic-distribution/form/index.tsx
index dcadca5c..04932ab9 100644
--- a/Cunkebao/src/pages/mobile/workspace/traffic-distribution/form/index.tsx
+++ b/Cunkebao/src/pages/mobile/workspace/traffic-distribution/form/index.tsx
@@ -184,7 +184,21 @@ const TrafficDistributionForm: React.FC = () => {
   };
 
   // 步骤切换
-  const next = () => setCurrent(cur => cur + 1);
+  const next = () => {
+    if (current === 0) {
+      // 第一步需要验证表单
+      form
+        .validateFields()
+        .then(() => {
+          setCurrent(cur => cur + 1);
+        })
+        .catch(() => {
+          // 验证失败，不进行下一步
+        });
+    } else {
+      setCurrent(cur => cur + 1);
+    }
+  };
   const prev = () => setCurrent(cur => cur - 1);
 
   // 过滤流量池
@@ -201,6 +215,29 @@ const TrafficDistributionForm: React.FC = () => {
         </>
       }
       loading={detailLoading}
+      footer={
+        <div className="footer-btn-group">
+          {current > 0 && (
+            <Button size="large" onClick={prev}>
+              上一步
+            </Button>
+          )}
+          {current < 2 ? (
+            <Button size="large" type="primary" onClick={next}>
+              下一步
+            </Button>
+          ) : (
+            <Button
+              type="primary"
+              size="large"
+              onClick={handleFinish}
+              loading={loading}
+            >
+              提交
+            </Button>
+          )}
+        </div>
+      }
     >
       <div className={style.formPage}>
         <div className={style.formBody}>
@@ -208,7 +245,6 @@ const TrafficDistributionForm: React.FC = () => {
             <Form
               form={form}
               layout="vertical"
-              onFinish={() => next()}
               initialValues={{
                 name: isEdit ? "" : generateDefaultName(),
                 distributeType: 1,
@@ -314,16 +350,6 @@ const TrafficDistributionForm: React.FC = () => {
                   </div>
                 </Form.Item>
               )}
-              <Form.Item>
-                <Button
-                  type="primary"
-                  htmlType="submit"
-                  loading={loading}
-                  block
-                >
-                  下一步
-                </Button>
-              </Form.Item>
             </Form>
           )}
           {current === 1 && (
@@ -361,14 +387,6 @@ const TrafficDistributionForm: React.FC = () => {
                   className={style.checkboxGroup}
                 />
               </div>
-              <div className={style.formStepBtns}>
-                <Button onClick={prev} style={{ marginRight: 12 }}>
-                  上一步
-                </Button>
-                <Button type="primary" onClick={next}>
-                  下一步
-                </Button>
-              </div>
             </div>
           )}
           {current === 2 && (
@@ -409,14 +427,6 @@ const TrafficDistributionForm: React.FC = () => {
                   已选流量池：<span>{selectedPools.length}</span> 个
                 </div>
               </div>
-              <div className={style.formStepBtns}>
-                <Button onClick={prev} style={{ marginRight: 12 }}>
-                  上一步
-                </Button>
-                <Button type="primary" onClick={handleFinish} loading={loading}>
-                  提交
-                </Button>
-              </div>
             </div>
           )}
         </div>