Untitled
unknown
plain_text
a year ago
6.1 kB
6
Indexable
'use client' import { useEffect, useState } from 'react' import { useParams } from 'next/navigation'; import { Box, Button, Card, CardContent, Divider, FormControl, Icon, MenuItem, Select, Typography } from '@mui/material' import { BsQuestionCircle } from 'react-icons/bs' import { AiOutlineExclamationCircle } from "react-icons/ai"; import { FaRegCheckCircle } from 'react-icons/fa'; import { BaseModal } from '@/components/shared/BaseModal' import CustomTextField from '@/@core/components/mui/TextField' import CouponsCreated from '../../components/CouponsCreated'; const ManageCreateCupons = () => { const [alertcreateGroup, setAlertcreateGroup] = useState(false) const [openNewGroupModal, setOpenNewGroupModal] = useState(false) const [createGroup, setCreateGroup] = useState(false) const [groupNameValue, setGroupNameValue] = useState('') const [createGroupSuccess, setCreateGroupSuccess] = useState(false) const { eventHash } = useParams() useEffect(() => { const timer = setTimeout(() => { setCreateGroupSuccess(false) }, 1000); return () => clearTimeout(timer); }, [createGroupSuccess]); const handleSaveGroup = () => { if (!groupNameValue.length) { setAlertcreateGroup(true) } else { setCreateGroupSuccess(true) // redirect user setGroupNameValue('') } } const creategroup = () => { setOpenNewGroupModal(false) setCreateGroup(true) } return ( <> <Card sx={{ width: '100%' }}> <CardContent sx={{ position: 'relative' }}> <Typography variant='h5' fontWeight={700}> Selecione ou crie seu grupo </Typography> <Divider sx={{ marginTop: 4, marginBottom: 4 }} /> <FormControl fullWidth> <Typography fontWeight={700} style={{ fontSize: 13, marginBottom: 2 }}> Grupo </Typography> <Select labelId='demo-simple-select-label' id='demo-simple-select' style={{ maxHeight: 36 }}> <MenuItem value='actived' onClick={() => setOpenNewGroupModal(true)}>Criar um novo grupo ?</MenuItem> </Select> {createGroup ? <Box > <FormControl fullWidth style={{ fontSize: 13, margin: '32px 0px 16px 0px' }}> <Typography variant='h6' fontWeight={700}> Criar grupo </Typography> <Divider sx={{ marginTop: 4, marginBottom: 4 }} /> <CustomTextField style={{ fontSize: 13, marginTop: 4, }} fullWidth label='Nome do grupo' placeholder='Nome do grupo' value={groupNameValue} onChange={({ target }) => setGroupNameValue(target.value)} /> </FormControl> <Box sx={{ display: 'flex', justifyContent: 'flex-end', gap: 4, marginTop: 4 }}> <Button variant='outlined' style={{ minWidth: 132, color: 'aliceblue' }} onClick={() => setCreateGroup(false)}> Cancelar </Button> <Button variant='contained' style={{ minWidth: 132 }} onClick={handleSaveGroup}> Salvar Grupo </Button> </Box> </Box> : <Typography variant='h6' style={{ marginTop: 16 }}> * Para criar um novo grupo basta digitar o nome do grupo e escolher a opção criar novo </Typography> } </FormControl> </CardContent> </Card> <BaseModal isOpen={openNewGroupModal} nextBtnName='Sim' closeBtnName='Não' onClose={() => setOpenNewGroupModal(false)} onNext={creategroup} widthBtn={110} > <CardContent sx={{ display: 'flex', flexDirection: 'column', justifyContent: 'center', alignItems: 'center', gap: 8 }} > <Icon style={{ width: 80, height: 80 }}> <BsQuestionCircle style={{ width: 80, height: 80 }} /> </Icon> <Typography variant='h4' width={'500px'} align='center' fontWeight={700}> Você deseja criar um novo grupo ? </Typography> </CardContent> <Divider style={{ marginTop: 12, marginBottom: 36 }} /> </BaseModal> <BaseModal isOpen={alertcreateGroup} nextBtnName='Ok' onClose={() => setAlertcreateGroup(false)} onNext={() => setAlertcreateGroup(false)} widthBtn={110} > <CardContent sx={{ display: 'flex', flexDirection: 'column', justifyContent: 'center', alignItems: 'center', gap: 8 }} > <Icon style={{ width: 80, height: 80 }}> <AiOutlineExclamationCircle style={{ width: 80, height: 80 }} /> </Icon> <Typography variant='h4' width={'500px'} align='center' fontWeight={700}> Erro Interno </Typography> <Typography variant='h6' width={'500px'} align='center' > Ocorreu um erro interno, tente novamente mais tarde </Typography> </CardContent> <Divider style={{ marginTop: 12, marginBottom: 36 }} /> </BaseModal> <BaseModal isOpen={createGroupSuccess} widthBtn={110} > <CardContent sx={{ display: 'flex', flexDirection: 'column', justifyContent: 'center', alignItems: 'center', gap: 8 }} > <Icon style={{ width: 80, height: 80 }}> <FaRegCheckCircle style={{ width: 80, height: 80, color: '#00dc75' }} /> </Icon> <Typography variant='h4' width={'500px'} align='center' fontWeight={700}> Grupo Criado com Sucesso </Typography> </CardContent> </BaseModal> </> ) } export default ManageCreateCupons
Editor is loading...
Leave a Comment