SQuiz/frontPanel
2
0
Fork 0
Code Issues 10 Pull Requests Actions Packages Projects Releases Wiki Activity

свитч для типов

Browse Source
This commit is contained in:
krokodilka 2022-07-14 20:11:00 +03:00
parent 609ee76e36
commit a273f1a88e
5 changed files with 68 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
src/create/createQuestion.tsx
View File

@ -6,6 +6,7 @@ import {
import 'suneditor/dist/css/suneditor.min.css'; // Import Sun Editor's CSS File
import Description from "./description";
import Settings from "./settings";
import Types from "./types";
//Значения, собираемые для отправки на бэк
interface Values {
@ -30,8 +31,7 @@ const types = [
{desc:"кнопка", value:"button"},
{desc:"ничего", value:"none"}
]
const TextField = (props: any) => {
export const TextField = (props: any) => {
const [field, meta, helpers] = useField(props);
@ -217,45 +217,11 @@ export default () => {
<VStack>
<TextField placeholder="Заголовок" name="title" type="text" />
<Description name="description"/>
{
type === 0 ? //Тип вопроса - текст?
<TextField name="text" placeholder="текст" type="text" />
:
type === 3 ? //Тип вопроса - файл?
<input type="file"/>
:
stockroom.length === 0 ? //В поле для юзерских данных есть что-то?
null //Ничего не внесено
:
type === 1 ? //Тип вопроса - селект?
<Select
>
{
stockroom.map((e: any, i: number) => {
return <option key={i}>{e.text}</option>
})
}
</Select>
:
type === 2 ? //Тип вопроса - чекбокс?
stockroom.map((e:any, i:number) => {
return <Checkbox key={i}>{e.text}</Checkbox>
})
:
type === 4 ? //Тип вопроса - кнопка?
stockroom.map((e:any, i:number) => {
return <Button
backgroundColor={e.color}
key={i}
onClick={(event: any) => {
changeFocus(e.id)
event.target.blur()
}}
>{e.text}</Button>
})
:
null //Тип вопроса - ничего
}
<Types
type={type}
stockroom={stockroom}
changeFocus={changeFocus}
/>
</VStack>
<Settings

3
src/create/settings.tsx
View File

@ -1,7 +1,6 @@
import React from 'react';
import {Box, Button, Checkbox, Container, Select, Textarea} from "@chakra-ui/react";
import {Box, Button, Checkbox, Container, Select} from "@chakra-ui/react";
import Buttons from "./tools/buttons"
import List from "./tools/list"
export default (props: any) => {

37
src/create/tools/list.tsx
View File

@ -1,37 +0,0 @@
import React from 'react';
import {Button, VStack, HStack, Textarea, Container, Text, CloseButton} from "@chakra-ui/react";
export default ({stockroom}: {stockroom: any,}) => {
const [color, setColor] = React.useState("#fff")
return(
<HStack>
<Button
>Добавить</Button>
<Textarea
placeholder="описание"
/>
<VStack
border="1px solid gray"
height="100px"
minWidth="30%"
overflow="auto"
>
{
stockroom.map((e:any, i:number) => {
return(
<Container border="1px solid lightgray" key={i} display="inline-flex" alignItems="center">
<Text>{e.text}</Text><CloseButton/>
</Container>
)
})
}
</VStack>
</HStack>
)
}

58
src/create/types.tsx Normal file
View File

@ -0,0 +1,58 @@
import React from 'react';
import {
Select, Checkbox, Button,
} from '@chakra-ui/react'
import {TextField} from "./createQuestion";
export default (props:any) => {
switch(props.type) {
case 0://Тип вопроса - текст?
return (<TextField name="text" placeholder="текст" type="text" />)
break;
case 1://Тип вопроса - селект?
return (
<Select>
{
props.stockroom.map((e: any, i: number) => {
return <option key={i}>{e.text}</option>
})
}
</Select>
)
break;
case 2://Тип вопроса - чекбокс?
return(
<>
{
props.stockroom.map((e:any, i:number) => {
return <Checkbox key={i}>{e.text}</Checkbox>
})
}
</>
)
break;
case 3://Тип вопроса - файл?
return (<input type="file"/>)
break;
case 4://Тип вопроса - кнопка?
return(
<>
{
props.stockroom.map((e:any, i:number) => {
return <Button
backgroundColor={e.color}
key={i}
onClick={(event: any) => {
props.changeFocus(e.id)
event.target.blur()
}}
>{e.text}</Button>
})
}
</>
)
break;
default:
return <></>
}
}

4
src/index.tsx
View File

@ -13,7 +13,7 @@ const root = ReactDOM.createRoot(
);
root.render(
// <React.StrictMode>
<React.StrictMode>
<ChakraProvider>
<SnackbarProvider maxSnack={3}>
<BrowserRouter>
@ -26,5 +26,5 @@ root.render(
</BrowserRouter>
</SnackbarProvider>
</ChakraProvider>
// </React.StrictMode>
</React.StrictMode>
);