fix: update form value trigger tips

This commit is contained in:
jialin
2025-04-30 11:01:14 +08:00
parent 52add26905
commit a3501e5417
15 changed files with 116 additions and 68 deletions
+1 -1
View File
@@ -13,7 +13,7 @@ import Wrapper from './wrapper';
import InputWrapper from './wrapper/input';
const LabelWrapper = styled.div`
background-color: var(--color-white-1);
background-color: var(--ant-color-bg-container);
`;
interface InputTextareaProps extends TextAreaProps {
@@ -193,7 +193,6 @@ const Wrapper: FC<WrapperProps> = ({
onClick
}) => {
const { token } = theme.useToken();
console.log('token=====', token);
const wrapperClass = classNames(
status ? `validate-status-${status}` : '',
className,
-5
View File
@@ -79,11 +79,6 @@ export default {
fontSize: 14,
motion: true,
colorFill: '#000',
// colorFillTertiary: '#1D1E20',
// colorBgContainer: '#141414',
colorBgBase: '#000'
// colorBorder: '#353535'
// colorSplit: '#262626',
// colorBorderSecondary: '#262626'
}
};
+4 -1
View File
@@ -239,5 +239,8 @@ export default {
'common.appearance.dark': 'Dark',
'common.appearance.light': 'Light',
'common.appearance.system': 'System Default',
'common.exception.404': 'Sorry, the page you visited does not exist.'
'common.exception.404': 'Sorry, the page you visited does not exist.',
'common.appearance.darkmode': 'Dark Mode',
'common.appearance.lightmode': 'Light Mode',
'common.appearance.tips': 'Default follows system preference.'
};
+2 -1
View File
@@ -17,5 +17,6 @@ export default {
'menu.users': 'Users',
'menu.profile': 'Profile',
'menu.login': 'Login',
'menu.usage': 'Usage'
'menu.usage': 'Usage',
'menu.404': '404'
};
+8 -2
View File
@@ -239,7 +239,10 @@ export default {
'common.appearance.dark': 'Dark',
'common.appearance.light': 'Light',
'common.appearance.system': 'System Default',
'common.exception.404': 'Sorry, the page you visited does not exist.'
'common.exception.404': 'Sorry, the page you visited does not exist.',
'common.appearance.darkmode': 'Dark Mode',
'common.appearance.lightmode': 'Light Mode',
'common.appearance.tips': 'Default follows system preference.'
};
// ========== To-Do: Translate Keys (Remove After Translation) ==========
@@ -247,5 +250,8 @@ export default {
// 2. 'common.appearance.light': 'Light',
// 3. 'common.appearance.system': 'System Default',
// 4. 'common.appearance': 'Appearance',
// 5. 'common.exception.404': 'Sorry, the page you visited does not exist.'
// 5. 'common.exception.404': 'Sorry, the page you visited does not exist.',
// 6. 'common.appearance.darkmode': 'Dark Mode',
// 7. 'common.appearance.lightmode': 'Light Mode',
// 8. 'common.appearance.tips': 'Default follows system preference.'
// ========== End of To-Do List ==========
+2 -1
View File
@@ -17,5 +17,6 @@ export default {
'menu.users': 'ユーザー',
'menu.profile': 'プロフィール',
'menu.login': 'ログイン',
'menu.usage': '使用状況'
'menu.usage': '使用状況',
'menu.404': '404'
};
+8 -2
View File
@@ -237,9 +237,15 @@ export default {
'common.appearance.dark': 'Темная',
'common.appearance.light': 'Светлая',
'common.appearance.system': 'Как в системе',
'common.exception.404': 'Sorry, the page you visited does not exist.'
'common.exception.404': 'Sorry, the page you visited does not exist.',
'common.appearance.darkmode': 'Dark Mode',
'common.appearance.lightmode': 'Light Mode',
'common.appearance.tips': 'Default follows system preference.'
};
// ========== To-Do: Translate Keys (Remove After Translation) ==========
// 1. 'common.exception.404': 'Sorry, the page you visited does not exist.'
// 1. 'common.exception.404': 'Sorry, the page you visited does not exist.',
// 2. 'common.appearance.darkmode': 'Dark Mode',
// 3. 'common.appearance.lightmode': 'Light Mode',
// 4. 'common.appearance.tips': 'Default follows system preference.'
// ========== End of To-Do List ==========
+2 -1
View File
@@ -17,5 +17,6 @@ export default {
'menu.users': 'Пользователи',
'menu.profile': 'Профиль',
'menu.login': 'Авторизация',
'menu.usage': 'Использование'
'menu.usage': 'Использование',
'menu.404': '404'
};
+4 -1
View File
@@ -234,5 +234,8 @@ export default {
'common.appearance.dark': '深色',
'common.appearance.light': '浅色',
'common.appearance.system': '跟随系统',
'common.exception.404': '抱歉,你访问的页面不存在'
'common.exception.404': '抱歉,你访问的页面不存在',
'common.appearance.darkmode': '深色模式',
'common.appearance.lightmode': '浅色模式',
'common.appearance.tips': '默认跟随系统设置'
};
+2 -1
View File
@@ -17,5 +17,6 @@ export default {
'menu.users': '用户',
'menu.profile': '个人信息',
'menu.login': '登录',
'menu.usage': '使用量'
'menu.usage': '使用量',
'menu.404': '404'
};
@@ -43,6 +43,34 @@ interface AdvanceConfigProps {
source: string;
}
const placementStrategyTips = [
{
title: 'Spread',
tips: 'resources.form.spread.tips'
},
{
title: 'Binpack',
tips: 'resources.form.binpack.tips'
}
];
const scheduleTypeTips = [
{
title: {
text: 'models.form.scheduletype.auto',
locale: true
},
tips: 'models.form.scheduletype.auto.tips'
},
{
title: {
text: 'models.form.scheduletype.manual',
locale: true
},
tips: 'models.form.scheduletype.manual.tips'
}
];
const CheckboxField: React.FC<{
title: string;
label: string;
@@ -78,40 +106,6 @@ const AdvanceConfig: React.FC<AdvanceConfigProps> = (props) => {
const worker_selector = Form.useWatch('worker_selector', form);
const { onValuesChange } = useFormContext();
const placementStrategyTips = [
{
title: 'Spread',
tips: intl.formatMessage({
id: 'resources.form.spread.tips'
})
},
{
title: 'Binpack',
tips: intl.formatMessage({
id: 'resources.form.binpack.tips'
})
}
];
const scheduleTypeTips = [
{
title: intl.formatMessage({
id: 'models.form.scheduletype.auto'
}),
tips: intl.formatMessage({
id: 'models.form.scheduletype.auto.tips'
})
},
{
title: intl.formatMessage({
id: 'models.form.scheduletype.manual'
}),
tips: intl.formatMessage({
id: 'models.form.scheduletype.manual.tips'
})
}
];
const paramsConfig = useMemo(() => {
if (backend === backendOptionsMap.llamaBox) {
return llamaConfig;
@@ -154,7 +154,6 @@ const AddModal: FC<AddModalProps> = (props) => {
const handleOnSelectModel = (item: any, evaluate?: boolean) => {
setSelectedModel(item);
console.log('item.isGGUF=========>', item.isGGUF);
if (!item.isGGUF) {
setIsGGUF(false);
form.current?.form?.resetFields(resetFields);
@@ -81,6 +81,13 @@ const UpdateModal: React.FC<AddModalProps> = (props) => {
}
};
const customizer = (val1: any, val2: any) => {
if ((val1 === null && val2 === '') || (val1 === '' && val2 === null)) {
return true;
}
return undefined;
};
const handleOnValuesChange = (data: any) => {
const formdata = form.getFieldsValue?.();
let alldata = {};
@@ -100,7 +107,7 @@ const UpdateModal: React.FC<AddModalProps> = (props) => {
worker_selector: originFormData.current?.worker_selector || null
};
}
const isEqual = _.isEqual(alldata, originFormData.current);
const isEqual = _.isEqualWith(alldata, originFormData.current, customizer);
if (isEqual) {
setWarningStatus({
show: false,
+47 -15
View File
@@ -1,8 +1,29 @@
import useUserSettings from '@/hooks/use-user-settings';
import { MoonOutlined, SunOutlined } from '@ant-design/icons';
import { useIntl } from '@umijs/max';
import { Radio } from 'antd';
import React from 'react';
import { Switch } from 'antd';
import React, { useMemo } from 'react';
import styled from 'styled-components';
const Wrapper = styled.div`
display: flex;
flex-direction: column;
gap: 16px;
padding: 16px 0;
.theme {
display: flex;
align-items: center;
justify-content: space-between;
max-width: 220px;
}
.theme-label {
font-size: 16px;
font-weight: var(--font-weight-500);
}
.tips {
color: var(--ant-color-text-secondary);
}
`;
const ThemeOptions = [
{
@@ -18,23 +39,34 @@ const ThemeOptions = [
];
const Appearance: React.FC = () => {
const { setTheme, userSettings } = useUserSettings();
const intl = useIntl();
const handleOnChange = (e: any) => {
setTheme(e.target.value);
const handleOnChange = (checked: boolean) => {
if (checked) {
setTheme('realDark');
} else {
setTheme('light');
}
};
const isDarkMode = useMemo(() => {
const darkMode = userSettings?.theme === 'realDark';
return darkMode;
}, [userSettings?.theme]);
return (
<Radio.Group
onChange={handleOnChange}
style={{ marginTop: 16 }}
value={userSettings.theme}
>
{ThemeOptions.map((item) => (
<Radio key={item.key} value={item.key}>
{intl.formatMessage({ id: item.label })}
</Radio>
))}
</Radio.Group>
<Wrapper>
<div className="theme">
<span className="theme-label">
{intl.formatMessage({ id: 'common.appearance.darkmode' })}
</span>
<Switch checked={isDarkMode} onChange={handleOnChange} />
</div>
<div className="tips">
{intl.formatMessage({ id: 'common.appearance.tips' })}
</div>
</Wrapper>
);
};