mirror of https://gitee.com/answerdev/answer.git
Merge branch 'feat/ui-v0.4' into 'test'
Feat/ui v0.4 See merge request opensource/answer!266
This commit is contained in:
commit
ce5bf43948
|
@ -109,6 +109,17 @@ const SchemaForm: FC<IProps> = ({
|
|||
}
|
||||
};
|
||||
|
||||
const handleSelectChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
|
||||
const { name, value } = e.target;
|
||||
const data = {
|
||||
...formData,
|
||||
[name]: { ...formData[name], value, isInvalid: false },
|
||||
};
|
||||
if (onChange instanceof Function) {
|
||||
onChange(data);
|
||||
}
|
||||
};
|
||||
|
||||
const handleSwitchChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||
const { name, checked } = e.target;
|
||||
const data = {
|
||||
|
@ -238,6 +249,9 @@ const SchemaForm: FC<IProps> = ({
|
|||
<Form.Label>{title}</Form.Label>
|
||||
<Form.Select
|
||||
aria-label={description}
|
||||
name={key}
|
||||
value={formData[key]?.value}
|
||||
onChange={handleSelectChange}
|
||||
isInvalid={formData[key].isInvalid}>
|
||||
{properties[key].enum?.map((item, index) => {
|
||||
return (
|
||||
|
@ -314,7 +328,8 @@ const SchemaForm: FC<IProps> = ({
|
|||
<Form.Label>{title}</Form.Label>
|
||||
<TimeZonePicker
|
||||
value={formData[key]?.value}
|
||||
onChange={handleInputChange}
|
||||
name={key}
|
||||
onChange={handleSelectChange}
|
||||
/>
|
||||
<Form.Control
|
||||
name={key}
|
||||
|
|
|
@ -75,19 +75,6 @@ const Interface: FC = () => {
|
|||
},
|
||||
});
|
||||
|
||||
// const onChange = (fieldName, fieldValue) => {
|
||||
// if (!formData[fieldName]) {
|
||||
// return;
|
||||
// }
|
||||
// const fieldData: FormDataType = {
|
||||
// [fieldName]: {
|
||||
// value: fieldValue,
|
||||
// isInvalid: false,
|
||||
// errorMsg: '',
|
||||
// },
|
||||
// };
|
||||
// setFormData({ ...formData, ...fieldData });
|
||||
// };
|
||||
const uiSchema: UISchema = {
|
||||
theme: {
|
||||
'ui:widget': 'select',
|
||||
|
@ -211,119 +198,6 @@ const Interface: FC = () => {
|
|||
onSubmit={onSubmit}
|
||||
onChange={handleOnChange}
|
||||
/>
|
||||
{/* <Form noValidate onSubmit={onSubmit}>
|
||||
<Form.Group controlId="logo" className="mb-3">
|
||||
<Form.Label>{t('logo.label')}</Form.Label>
|
||||
<Stack gap={2}>
|
||||
<div
|
||||
className="bg-light overflow-hidden"
|
||||
style={{ width: '288px', height: '96px' }}>
|
||||
{formData.logo.value ? (
|
||||
<Image
|
||||
width="288"
|
||||
height="96"
|
||||
className="object-fit-contain"
|
||||
src={formData.logo.value}
|
||||
/>
|
||||
) : null}
|
||||
</div>
|
||||
<div className="d-inline-flex">
|
||||
<UploadImg type="logo" upload={imgUpload} className="mb-2" />
|
||||
</div>
|
||||
</Stack>
|
||||
<Form.Text as="div" className="text-muted">
|
||||
<Trans i18nKey="admin.interface.logo.text">
|
||||
You can upload your image or
|
||||
<Button
|
||||
variant="link"
|
||||
size="sm"
|
||||
className="p-0 mx-1"
|
||||
onClick={(evt) => {
|
||||
evt.preventDefault();
|
||||
onChange('logo', '');
|
||||
}}>
|
||||
reset it
|
||||
</Button>
|
||||
to the site title text.
|
||||
</Trans>
|
||||
</Form.Text>
|
||||
<Form.Control.Feedback type="invalid">
|
||||
{formData.logo.errorMsg}
|
||||
</Form.Control.Feedback>
|
||||
</Form.Group>
|
||||
<Form.Group controlId="theme" className="mb-3">
|
||||
<Form.Label>{t('theme.label')}</Form.Label>
|
||||
<Form.Select
|
||||
value={formData.theme.value}
|
||||
isInvalid={formData.theme.isInvalid}
|
||||
onChange={(evt) => {
|
||||
onChange('theme', evt.target.value);
|
||||
}}>
|
||||
{themes?.map((item) => {
|
||||
return (
|
||||
<option value={item.value} key={item.value}>
|
||||
{item.label}
|
||||
</option>
|
||||
);
|
||||
})}
|
||||
</Form.Select>
|
||||
<Form.Text as="div">{t('theme.text')}</Form.Text>
|
||||
<Form.Control.Feedback type="invalid">
|
||||
{formData.theme.errorMsg}
|
||||
</Form.Control.Feedback>
|
||||
</Form.Group>
|
||||
<Form.Group controlId="language" className="mb-3">
|
||||
<Form.Label>{t('language.label')}</Form.Label>
|
||||
<Form.Select
|
||||
value={formData.language.value}
|
||||
isInvalid={formData.language.isInvalid}
|
||||
onChange={(evt) => {
|
||||
onChange('language', evt.target.value);
|
||||
}}>
|
||||
{langs?.map((item) => {
|
||||
return (
|
||||
<option value={item.value} key={item.value}>
|
||||
{item.label}
|
||||
</option>
|
||||
);
|
||||
})}
|
||||
</Form.Select>
|
||||
<Form.Text as="div">{t('language.text')}</Form.Text>
|
||||
<Form.Control.Feedback type="invalid">
|
||||
{formData.language.errorMsg}
|
||||
</Form.Control.Feedback>
|
||||
</Form.Group>
|
||||
<Form.Group controlId="time-zone" className="mb-3">
|
||||
<Form.Label>{t('time_zone.label')}</Form.Label>
|
||||
<Form.Select
|
||||
value={formData.time_zone.value}
|
||||
isInvalid={formData.time_zone.isInvalid}
|
||||
onChange={(evt) => {
|
||||
onChange('time_zone', evt.target.value);
|
||||
}}>
|
||||
{TIMEZONES?.map((item) => {
|
||||
return (
|
||||
<optgroup label={item.label} key={item.label}>
|
||||
{item.options.map((option) => {
|
||||
return (
|
||||
<option value={option.value} key={option.value}>
|
||||
{option.label}
|
||||
</option>
|
||||
);
|
||||
})}
|
||||
</optgroup>
|
||||
);
|
||||
})}
|
||||
</Form.Select>
|
||||
<Form.Text as="div">{t('time_zone.text')}</Form.Text>
|
||||
<Form.Control.Feedback type="invalid">
|
||||
{formData.time_zone.errorMsg}
|
||||
</Form.Control.Feedback>
|
||||
</Form.Group>
|
||||
<Button variant="primary" type="submit">
|
||||
{t('save', { keyPrefix: 'btns' })}
|
||||
</Button>
|
||||
</Form> */}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue