FEAT => 本次更新项目为:
This commit is contained in:
@@ -191,6 +191,19 @@
|
|||||||
margin-top: 16px;
|
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) {
|
.formSteps :global(.ant-steps-item-title) {
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
|
|||||||
@@ -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);
|
const prev = () => setCurrent(cur => cur - 1);
|
||||||
|
|
||||||
// 过滤流量池
|
// 过滤流量池
|
||||||
@@ -201,6 +215,29 @@ const TrafficDistributionForm: React.FC = () => {
|
|||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
loading={detailLoading}
|
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.formPage}>
|
||||||
<div className={style.formBody}>
|
<div className={style.formBody}>
|
||||||
@@ -208,7 +245,6 @@ const TrafficDistributionForm: React.FC = () => {
|
|||||||
<Form
|
<Form
|
||||||
form={form}
|
form={form}
|
||||||
layout="vertical"
|
layout="vertical"
|
||||||
onFinish={() => next()}
|
|
||||||
initialValues={{
|
initialValues={{
|
||||||
name: isEdit ? "" : generateDefaultName(),
|
name: isEdit ? "" : generateDefaultName(),
|
||||||
distributeType: 1,
|
distributeType: 1,
|
||||||
@@ -314,16 +350,6 @@ const TrafficDistributionForm: React.FC = () => {
|
|||||||
</div>
|
</div>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
)}
|
)}
|
||||||
<Form.Item>
|
|
||||||
<Button
|
|
||||||
type="primary"
|
|
||||||
htmlType="submit"
|
|
||||||
loading={loading}
|
|
||||||
block
|
|
||||||
>
|
|
||||||
下一步
|
|
||||||
</Button>
|
|
||||||
</Form.Item>
|
|
||||||
</Form>
|
</Form>
|
||||||
)}
|
)}
|
||||||
{current === 1 && (
|
{current === 1 && (
|
||||||
@@ -361,14 +387,6 @@ const TrafficDistributionForm: React.FC = () => {
|
|||||||
className={style.checkboxGroup}
|
className={style.checkboxGroup}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className={style.formStepBtns}>
|
|
||||||
<Button onClick={prev} style={{ marginRight: 12 }}>
|
|
||||||
上一步
|
|
||||||
</Button>
|
|
||||||
<Button type="primary" onClick={next}>
|
|
||||||
下一步
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{current === 2 && (
|
{current === 2 && (
|
||||||
@@ -409,14 +427,6 @@ const TrafficDistributionForm: React.FC = () => {
|
|||||||
已选流量池:<span>{selectedPools.length}</span> 个
|
已选流量池:<span>{selectedPools.length}</span> 个
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className={style.formStepBtns}>
|
|
||||||
<Button onClick={prev} style={{ marginRight: 12 }}>
|
|
||||||
上一步
|
|
||||||
</Button>
|
|
||||||
<Button type="primary" onClick={handleFinish} loading={loading}>
|
|
||||||
提交
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user