feat(web): extract and replace Switch Form components

This commit is contained in:
zhaoying
2026-01-19 14:08:31 +08:00
parent 21ae3cdd15
commit 9353053a23
7 changed files with 106 additions and 66 deletions

View File

@@ -1,5 +1,5 @@
import React, { useState, useEffect } from 'react';
import { Row, Col, Form, Slider, Button, Alert, message, Switch, Space } from 'antd';
import { Row, Col, Form, Slider, Button, Alert, message, Space } from 'antd';
import { useParams } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
import RbCard from '@/components/RbCard/Card';
@@ -9,6 +9,7 @@ import type { ConfigForm } from './types'
import CustomSelect from '@/components/CustomSelect';
import { getModelListUrl } from '@/api/models'
import Tag from '@/components/Tag'
import SwitchFormItem from '@/components/FormItem/SwitchFormItem'
const configList = [
{
@@ -158,23 +159,17 @@ const EmotionEngine: React.FC = () => {
</div>
)
}
return (
<div className="rb:flex rb:items-center rb:justify-between rb:mb-6">
<div>
<span className="rb:text-[14px] rb:font-medium rb:leading-5">{t(`emotionEngine.${config.key}`)}</span>
<SwitchFormItem
title={t(`emotionEngine.${config.key}`)}
name={config.key}
desc={<>
{config.hasSubTitle && <div className="rb:mt-1 rb:text-[12px] rb:text-[#5B6167] rb:font-regular rb:leading-4">{t(`emotionEngine.${config.key}_subTitle`)}</div>}
<div className="rb:mt-1 rb:text-[12px] rb:text-[#5B6167] rb:font-regular rb:leading-4">{t(`emotionEngine.${config.key}_desc`)}</div>
</div>
<Form.Item
name={config.key}
valuePropName="checked"
className="rb:ml-2 rb:mb-0!"
>
<Switch
disabled={!values?.emotion_enabled && config.key !== 'emotion_enabled'} />
</Form.Item>
</div>
</>}
className="rb:mb-6"
disabled={!values?.emotion_enabled && config.key !== 'emotion_enabled'}
/>
)
})}
<Row gutter={16} className="rb:mt-3">

View File

@@ -1,5 +1,5 @@
import React, { useState, useEffect } from 'react';
import { Row, Col, Form, Slider, Button, Space, message, Switch } from 'antd';
import { Row, Col, Form, Slider, Button, Space, message } from 'antd';
import { useParams } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
import RbCard from '@/components/RbCard/Card';
@@ -7,6 +7,7 @@ import strategyImpactSimulator from '@/assets/images/memory/strategyImpactSimula
import LineChart from './components/LineChart'
import { getMemoryForgetConfig, updateMemoryForgetConfig } from '@/api/memory'
import type { ConfigForm } from './types'
import SwitchFormItem from '@/components/FormItem/SwitchFormItem'
const configList = [
{
@@ -155,26 +156,12 @@ const ForgettingEngine: React.FC = () => {
{configList.map(config => {
if (config.type === 'button') {
return (
<div key={config.key} className="rb:mb-2">
<div className="rb:flex rb:items-center rb:justify-between">
<div>
<span className="rb:text-[14px] rb:font-medium rb:leading-5">{t(`forgettingEngine.${config.key}`)}</span>
</div>
<Form.Item
name={config.name}
valuePropName="checked"
className="rb:ml-2 rb:mb-0!"
>
<Switch />
</Form.Item>
</div>
<div className="rb:flex rb:text-[12px] rb:items-center rb:justify-between rb:text-[#5B6167] rb:leading-5">
<Space size={4}>
{config.range && <span>{t(`forgettingEngine.range`)}: {config.range?.join('-')}</span>}
{config.type && <span>{t(`forgettingEngine.type`)}: {config.type}</span>}
</Space>
</div>
</div>
<SwitchFormItem
title={t(`forgettingEngine.${config.key}`)}
name={config.name}
desc={config.type && <span>{t(`forgettingEngine.type`)}: {config.type}</span>}
className="rb:mb-2"
/>
)
}
return (
@@ -191,8 +178,6 @@ const ForgettingEngine: React.FC = () => {
>
{config.type === 'decimal'
? <Slider tooltip={{ open: false }} max={config.range?.[1] || 1} min={config.range?.[0] || 0} step={config.step ?? 0.01} style={{ margin: '0' }} />
: config.type === 'button'
? <Switch />
: null
}
</Form.Item>

View File

@@ -11,6 +11,7 @@ import { getModelList } from '@/api/models';
import type { Model } from '@/views/ModelManagement/types'
import { configList } from './constant'
import Result from './components/Result'
import SwitchFormItem from '@/components/FormItem/SwitchFormItem'
const keys = [
// 'example',
@@ -173,25 +174,18 @@ const MemoryExtractionEngine: FC = () => {
}
)}
>
<div className="rb:text-[16px] rb:font-medium rb:leading-[22px]">{t(`memoryExtractionEngine.${vo.title}`)}</div>
<div className="rb:text-[16px] rb:font-medium rb:leading-5.5">{t(`memoryExtractionEngine.${vo.title}`)}</div>
<div className="rb:mt-1 rb:text-[12px] rb:text-[#5B6167] rb:font-regular rb:leading-4">{t(`memoryExtractionEngine.${vo.title}SubTitle`)}</div>
{vo.list.map(config => (
<div key={config.label}>
{config.control === 'button' &&
<div className="rb:flex rb:items-center rb:justify-between rb:mt-6">
<div>
<span className="rb:text-[14px] rb:font-medium rb:leading-5">-{t(`memoryExtractionEngine.${config.label}`)}</span>
<ConfigDesc config={config} className="rb:ml-2" />
</div>
<Form.Item
name={config.variableName}
valuePropName="checked"
className="rb:ml-2 rb:mb-0!"
>
<Switch />
</Form.Item>
</div>
<SwitchFormItem
title={<>-{t(`memoryExtractionEngine.${config.label}`)}</>}
name={config.variableName}
desc={<ConfigDesc config={config} className="rb:ml-2" />}
className="rb:mt-6"
/>
}
{config.control === 'select' &&
<>

View File

@@ -1,5 +1,5 @@
import React, { useState, useEffect } from 'react';
import { Row, Col, Form, App, Button, Switch, Space, Select } from 'antd';
import { Row, Col, Form, App, Button, Space, Select } from 'antd';
import { useParams } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
@@ -11,6 +11,7 @@ import CustomSelect from '@/components/CustomSelect';
import { getModelListUrl } from '@/api/models'
import Tag from '@/components/Tag'
import { useI18n } from '@/store/locale';
import SwitchFormItem from '@/components/FormItem/SwitchFormItem'
const configList = [
// 启用反思引擎
@@ -219,21 +220,16 @@ const SelfReflectionEngine: React.FC = () => {
}
return (
<div className="rb:flex rb:items-center rb:justify-between rb:mb-6">
<div>
<span className="rb:text-[14px] rb:font-medium rb:leading-5">{t(`reflectionEngine.${config.key}`)}</span>
<SwitchFormItem
title={t(`reflectionEngine.${config.key}`)}
name={config.key}
desc={<>
{(config as any).hasSubTitle && <div className="rb:mt-1 rb:text-[12px] rb:text-[#5B6167] rb:font-regular rb:leading-4">{t(`reflectionEngine.${config.key}_subTitle`)}</div>}
<div className="rb:mt-1 rb:text-[12px] rb:text-[#5B6167] rb:font-regular rb:leading-4">{t(`reflectionEngine.${config.key}_desc`)}</div>
</div>
<Form.Item
name={config.key}
valuePropName="checked"
className="rb:ml-2 rb:mb-0!"
>
<Switch
disabled={!values?.reflection_enabled && config.key !== 'reflection_enabled'} />
</Form.Item>
</div>
</>}
className="rb:mb-6"
disabled={!values?.reflection_enabled && config.key !== 'reflection_enabled'}
/>
)
})}
<Row gutter={16} className="rb:mt-3">