40 lines
1.4 KiB
TypeScript
40 lines
1.4 KiB
TypeScript
import { Button, Dialog, DialogContent, DialogTitle, FormControlLabel, TextField } from '@mui/material';
|
|
import { useState } from 'react';
|
|
import { useMetaStore } from './MetaForm';
|
|
export const DialogKey = ({ onAdd }: { onAdd: (key: string) => void }) => {
|
|
const { openPropertyModal, setOpenPropertyModal } = useMetaStore();
|
|
const [key, setKey] = useState('');
|
|
return (
|
|
<Dialog open={openPropertyModal} onClose={() => setOpenPropertyModal(false)}>
|
|
<DialogTitle>添加元数据key</DialogTitle>
|
|
<DialogContent>
|
|
<div className='flex flex-col items-center gap-3 px-4 pb-4'>
|
|
<FormControlLabel
|
|
label='key'
|
|
labelPlacement='top'
|
|
control={<TextField variant='outlined' size='small' name={key} value={key} onChange={(e) => setKey(e.target.value)} />}
|
|
sx={{
|
|
alignItems: 'flex-start',
|
|
'& .MuiFormControlLabel-label': {
|
|
textAlign: 'left',
|
|
width: '100%',
|
|
},
|
|
}}
|
|
/>
|
|
<Button
|
|
variant='contained'
|
|
color='primary'
|
|
style={{ color: 'white' }}
|
|
onClick={() => {
|
|
onAdd(key);
|
|
setKey('');
|
|
setOpenPropertyModal(false);
|
|
}}>
|
|
添加
|
|
</Button>
|
|
</div>
|
|
</DialogContent>
|
|
</Dialog>
|
|
);
|
|
};
|