correccion registro
This commit is contained in:
Andres Alvarez
parent
bfa3be924a
commit
2018f925cc
|
|
@ -1,180 +1,148 @@
|
|||
import Typography from '@mui/material/Typography';
|
||||
import { Link } from 'react-router-dom';
|
||||
import AvatarGroup from '@mui/material/AvatarGroup';
|
||||
import Avatar from '@mui/material/Avatar';
|
||||
import Box from '@mui/material/Box';
|
||||
import Paper from '@mui/material/Paper';
|
||||
import Tabs from '@mui/material/Tabs';
|
||||
import Tab from '@mui/material/Tab';
|
||||
import { useState } from 'react';
|
||||
import _ from '../../../@lodash/@lodash';
|
||||
import JwtSignUpTab from './tabs/JwSignUpTab';
|
||||
import FirebaseSignUpTab from './tabs/FirebaseSignUpTab';
|
||||
import Typography from "@mui/material/Typography";
|
||||
import { Link } from "react-router-dom";
|
||||
import AvatarGroup from "@mui/material/AvatarGroup";
|
||||
import Avatar from "@mui/material/Avatar";
|
||||
import Box from "@mui/material/Box";
|
||||
import Paper from "@mui/material/Paper";
|
||||
import Tabs from "@mui/material/Tabs";
|
||||
import Tab from "@mui/material/Tab";
|
||||
import { useState } from "react";
|
||||
import _ from "../../../@lodash/@lodash";
|
||||
import JwtSignUpTab from "./tabs/JwSignUpTab";
|
||||
import FirebaseSignUpTab from "./tabs/FirebaseSignUpTab";
|
||||
|
||||
const tabs = [
|
||||
{
|
||||
id: 'jwt',
|
||||
title: 'JWT',
|
||||
logo: 'assets/images/logo/jwt.svg',
|
||||
logoClass: 'h-40 p-4 bg-black rounded-12'
|
||||
},
|
||||
{
|
||||
id: 'firebase',
|
||||
title: 'Firebase',
|
||||
logo: 'assets/images/logo/firebase.svg',
|
||||
logoClass: 'h-40'
|
||||
}
|
||||
{
|
||||
id: "jwt",
|
||||
title: "JWT",
|
||||
logo: "assets/images/logo/jwt.svg",
|
||||
logoClass: "h-40 p-4 bg-black rounded-12",
|
||||
},
|
||||
{
|
||||
id: "firebase",
|
||||
title: "Firebase",
|
||||
logo: "assets/images/logo/firebase.svg",
|
||||
logoClass: "h-40",
|
||||
},
|
||||
];
|
||||
|
||||
/**
|
||||
* The sign up page.
|
||||
*/
|
||||
function SignUpPage() {
|
||||
const [selectedTabId, setSelectedTabId] = useState(tabs[0].id);
|
||||
const [selectedTabId, setSelectedTabId] = useState(tabs[0].id);
|
||||
|
||||
function handleSelectTab(id: string) {
|
||||
setSelectedTabId(id);
|
||||
}
|
||||
function handleSelectTab(id: string) {
|
||||
setSelectedTabId(id);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="flex min-w-0 h-screen flex-auto flex-col justify-center items-center sm:justify-center md:p-32">
|
||||
<Paper className="flex min-h-full w-full overflow-hidden rounded-0 sm:min-h-auto sm:w-auto sm:rounded-2xl sm:shadow md:w-full md:max-w-6xl">
|
||||
<div className="w-full px-16 py-32 ltr:border-r-1 rtl:border-l-1 sm:w-auto sm:p-48 md:p-64">
|
||||
<div className="mx-auto w-full max-w-320 sm:mx-0 sm:w-320">
|
||||
<img
|
||||
className="w-48"
|
||||
src="assets/images/logo/logo1.svg"
|
||||
alt="logo"
|
||||
/>
|
||||
return (
|
||||
<div className="flex min-w-0 flex-1 flex-col items-center sm:flex-row sm:justify-center md:items-start md:justify-start">
|
||||
<Paper className="h-full w-full px-16 py-8 ltr:border-r-1 rtl:border-l-1 sm:h-auto sm:w-auto sm:rounded-2xl sm:p-48 sm:shadow md:flex md:h-full md:w-1/2 md:items-center md:justify-end md:rounded-none md:p-64 md:shadow-none">
|
||||
<div className="mx-auto w-full max-w-320 sm:mx-0 sm:w-320">
|
||||
<img className="w-48" src="assets/images/logo/logo1.svg" alt="logo" />
|
||||
|
||||
<Typography className="mt-32 text-4xl font-extrabold leading-tight tracking-tight">
|
||||
Registrarse
|
||||
</Typography>
|
||||
<div className="mt-2 flex items-baseline font-medium">
|
||||
<Typography>Ya tienes cuenta?</Typography>
|
||||
<Link
|
||||
className="ml-4"
|
||||
to="/sign-in"
|
||||
>
|
||||
Inicia sesión
|
||||
</Link>
|
||||
</div>
|
||||
{/*
|
||||
<Tabs
|
||||
value={_.findIndex(tabs, { id: selectedTabId })}
|
||||
variant="fullWidth"
|
||||
className="w-full mt-24 mb-32"
|
||||
indicatorColor="secondary"
|
||||
>
|
||||
{tabs.map((item) => (
|
||||
<Tab
|
||||
onClick={() => handleSelectTab(item.id)}
|
||||
key={item.id}
|
||||
icon={
|
||||
<img
|
||||
className={item.logoClass}
|
||||
src={item.logo}
|
||||
alt={item.title}
|
||||
/>
|
||||
}
|
||||
className="min-w-0"
|
||||
label={item.title}
|
||||
/>
|
||||
))}
|
||||
</Tabs>
|
||||
*/}
|
||||
<JwtSignUpTab />
|
||||
{/* {selectedTabId === 'firebase' && <FirebaseSignUpTab />}
|
||||
*/} </div>
|
||||
</div>
|
||||
<Typography className="mt-32 text-4xl font-extrabold leading-tight tracking-tight">
|
||||
Registrarse
|
||||
</Typography>
|
||||
<div className="mt-2 flex items-baseline font-medium">
|
||||
<Typography>Ya tienes cuenta?</Typography>
|
||||
<Link className="ml-4" to="/sign-in">
|
||||
Inicia sesión
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<Box
|
||||
className="relative hidden h-auto justify-center items-center flex-auto p-64 md:flex lg:px-112"
|
||||
sx={{ backgroundColor: 'primary.main' }}>
|
||||
<svg
|
||||
className="pointer-events-none absolute inset-0"
|
||||
viewBox="0 0 960 540"
|
||||
width="100%"
|
||||
height="100%"
|
||||
preserveAspectRatio="xMidYMax slice"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<Box
|
||||
component="g"
|
||||
sx={{ color: 'primary.light' }}
|
||||
className="opacity-20"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
strokeWidth="100"
|
||||
>
|
||||
<circle
|
||||
r="234"
|
||||
cx="796"
|
||||
cy="23"
|
||||
/>
|
||||
</Box>
|
||||
</svg>
|
||||
<Box
|
||||
component="svg"
|
||||
className="absolute -right-64 -top-64 opacity-20"
|
||||
sx={{ color: 'primary.light' }}
|
||||
viewBox="0 0 220 192"
|
||||
width="220px"
|
||||
height="192px"
|
||||
fill="none"
|
||||
>
|
||||
<defs>
|
||||
<pattern
|
||||
id="837c3e70-6c3a-44e6-8854-cc48c737b659"
|
||||
x="0"
|
||||
y="0"
|
||||
width="20"
|
||||
height="20"
|
||||
patternUnits="userSpaceOnUse"
|
||||
>
|
||||
<rect
|
||||
x="0"
|
||||
y="0"
|
||||
width="4"
|
||||
height="4"
|
||||
fill="currentColor"
|
||||
/>
|
||||
</pattern>
|
||||
</defs>
|
||||
<rect
|
||||
width="220"
|
||||
height="192"
|
||||
fill="url(#837c3e70-6c3a-44e6-8854-cc48c737b659)"
|
||||
/>
|
||||
</Box>
|
||||
<JwtSignUpTab />
|
||||
</div>
|
||||
|
||||
</Paper>
|
||||
|
||||
<div className="relative z-10 w-full max-w-2xl">
|
||||
<img
|
||||
className="w-216 "
|
||||
src="assets/images/empresa/logoAlphaWC.svg"
|
||||
alt="logo"
|
||||
/>
|
||||
<div className="text-3xl font-bold leading-loose text-gray-100">
|
||||
<div>Bienvenido al sistema que se encarga de tu facturación electrónica.</div>
|
||||
</div>
|
||||
<div className="flex items-center mt-14 text-md leading-none text-gray-400">
|
||||
<div>¿Necesitas ayuda? Comunícate con nosotros.</div>
|
||||
</div>
|
||||
<div className="flex overflow-hidden items-center mt-4 text-md leading-none text-gray-400">
|
||||
<div>Soporte técnico: 0967722226</div>
|
||||
<a aria-label="Chat WhatsApp" href="https://wa.me/967722226/?text=Hola!%20Necesito%20ayuda%20en%20el%20sistema%20de%20facturación">
|
||||
<img className='w-52' alt="Chat WhatsApp" src="assets/images/logo/WhatsApp-Logo.wine.svg" />
|
||||
</a>
|
||||
</div>
|
||||
<div className="flex overflow-hidden mt-2 text-md leading-none text-gray-400">
|
||||
<div>Correo eletrónico: info@qsoftec.com</div>
|
||||
</div>
|
||||
<Box
|
||||
className="relative hidden h-full flex-auto items-center justify-center overflow-hidden p-64 md:flex lg:px-112"
|
||||
sx={{ backgroundColor: "primary.main" }}
|
||||
>
|
||||
<svg
|
||||
className="pointer-events-none absolute inset-0"
|
||||
viewBox="0 0 960 540"
|
||||
width="100%"
|
||||
height="100%"
|
||||
preserveAspectRatio="xMidYMax slice"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<Box
|
||||
component="g"
|
||||
sx={{ color: "primary.light" }}
|
||||
className="opacity-20"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
strokeWidth="100"
|
||||
>
|
||||
<circle r="234" cx="796" cy="23" />
|
||||
</Box>
|
||||
</svg>
|
||||
<Box
|
||||
component="svg"
|
||||
className="absolute -right-64 -top-64 opacity-20"
|
||||
sx={{ color: "primary.light" }}
|
||||
viewBox="0 0 220 192"
|
||||
width="220px"
|
||||
height="192px"
|
||||
fill="none"
|
||||
>
|
||||
<defs>
|
||||
<pattern
|
||||
id="837c3e70-6c3a-44e6-8854-cc48c737b659"
|
||||
x="0"
|
||||
y="0"
|
||||
width="20"
|
||||
height="20"
|
||||
patternUnits="userSpaceOnUse"
|
||||
>
|
||||
<rect x="0" y="0" width="4" height="4" fill="currentColor" />
|
||||
</pattern>
|
||||
</defs>
|
||||
<rect
|
||||
width="220"
|
||||
height="192"
|
||||
fill="url(#837c3e70-6c3a-44e6-8854-cc48c737b659)"
|
||||
/>
|
||||
</Box>
|
||||
|
||||
</div>
|
||||
</Box>
|
||||
</Paper>
|
||||
</div>
|
||||
);
|
||||
<div className="relative z-10 w-full max-w-2xl">
|
||||
<img
|
||||
className="w-216 "
|
||||
src="assets/images/empresa/logoAlphaWC.svg"
|
||||
alt="logo"
|
||||
/>
|
||||
<div className="text-3xl font-bold leading-loose text-gray-100">
|
||||
<div>
|
||||
Bienvenido al sistema que se encarga de tu facturación
|
||||
electrónica.
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-center mt-14 text-md leading-none text-gray-400">
|
||||
<div>¿Necesitas ayuda? Comunícate con nosotros.</div>
|
||||
</div>
|
||||
<div className="flex overflow-hidden items-center mt-4 text-md leading-none text-gray-400">
|
||||
<div>Soporte técnico: 0967722226</div>
|
||||
<a
|
||||
aria-label="Chat WhatsApp"
|
||||
href="https://wa.me/967722226/?text=Hola!%20Necesito%20ayuda%20en%20el%20sistema%20de%20facturación"
|
||||
>
|
||||
<img
|
||||
className="w-52"
|
||||
alt="Chat WhatsApp"
|
||||
src="assets/images/logo/WhatsApp-Logo.wine.svg"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
<div className="flex overflow-hidden mt-2 text-md leading-none text-gray-400">
|
||||
<div>Correo eletrónico: info@qsoftec.com</div>
|
||||
</div>
|
||||
</div>
|
||||
</Box>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default SignUpPage;
|
||||
|
|
|
|||
|
|
@ -128,6 +128,42 @@ function JwtSignUpTab() {
|
|||
)}
|
||||
/>
|
||||
|
||||
<Controller
|
||||
name="password"
|
||||
control={control}
|
||||
render={({ field }) => (
|
||||
<TextField
|
||||
{...field}
|
||||
className="mb-24"
|
||||
label="Contraseña"
|
||||
type="password"
|
||||
error={!!errors.password}
|
||||
helperText={errors?.password?.message}
|
||||
variant="outlined"
|
||||
required
|
||||
fullWidth
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
|
||||
<Controller
|
||||
name="password"
|
||||
control={control}
|
||||
render={({ field }) => (
|
||||
<TextField
|
||||
{...field}
|
||||
className="mb-24"
|
||||
label="Contraseña"
|
||||
type="password"
|
||||
error={!!errors.password}
|
||||
helperText={errors?.password?.message}
|
||||
variant="outlined"
|
||||
required
|
||||
fullWidth
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
|
||||
<Controller
|
||||
name="passwordConfirm"
|
||||
control={control}
|
||||
|
|
|
|||
Loading…
Reference in New Issue