From 7e5a619dc066068309e583f65f68d22b45b86755 Mon Sep 17 00:00:00 2001 From: Guilherme Baufaker Date: Mon, 13 May 2024 12:04:06 -0300 Subject: [PATCH] created frontend for prescriber signup --- README.md | 8 +- actions/uploadFile.ts | 2 +- components/ui/AssociationAdmin.tsx | 2 +- components/ui/MyInfo.tsx | 1 + components/ui/SignUpFormPrescriber.tsx | 239 ++++++++++++++++++++ components/ui/SignUpPrescriber.tsx | 12 + fresh.gen.ts | 2 + islands/SignUpFormPrescriber.tsx | 8 + manifest.gen.ts | 79 +++---- sections/Miscellaneous/SignUpPrescriber.tsx | 1 + 10 files changed, 310 insertions(+), 44 deletions(-) create mode 100644 components/ui/SignUpFormPrescriber.tsx create mode 100644 components/ui/SignUpPrescriber.tsx create mode 100644 islands/SignUpFormPrescriber.tsx create mode 100644 sections/Miscellaneous/SignUpPrescriber.tsx diff --git a/README.md b/README.md index 02ee548..8120642 100644 --- a/README.md +++ b/README.md @@ -72,10 +72,10 @@ Starting live middleware: siteId=538 site=std The manifest has been generated for 6 routes, 5 islands, 17 sections and 16 functions. Githooks setup successfully: pre-commit Starting live middleware: siteId=239 site=fashion -Listening on http://localhost:8000/ +Listening on https://service.ecanna.com.br/ ``` -Now, open [http://localhost:8000/](http://localhost:8000/). You should see the +Now, open [https://service.ecanna.com.br/](https://service.ecanna.com.br/). You should see the fashion starter running on your machine! To continue from here, you can [perform initial setup](#initial-setup), @@ -145,11 +145,11 @@ Open `static` folder and replace `favicon.ico`, `robots.txt` and 1. Run the store (with `deno task start`). 2. Open the - [design system section](http://localhost:8000/_live/workbench/sections/DesignSystem.story.tsx?key=.%2Fsections%2FDesignSystem.story.tsx) + [design system section](https://service.ecanna.com.br/_live/workbench/sections/DesignSystem.story.tsx?key=.%2Fsections%2FDesignSystem.story.tsx) 3. Now, on your text editor, open `tailwind.config.ts` 4. Change the default, header, badge, etc colors, text colors and border colors to better fit your desired design and check how the - [design system section](http://localhost:8000/_live/workbench/sections/DesignSystem.story.tsx?key=.%2Fsections%2FDesignSystem.story.tsx) + [design system section](https://service.ecanna.com.br/_live/workbench/sections/DesignSystem.story.tsx?key=.%2Fsections%2FDesignSystem.story.tsx) changes. ## Customize the store diff --git a/actions/uploadFile.ts b/actions/uploadFile.ts index f35281c..db34a0b 100644 --- a/actions/uploadFile.ts +++ b/actions/uploadFile.ts @@ -19,7 +19,7 @@ const uploadFile = async ( ): Promise => { console.log({ dataBody: data }); try { - const response = await fetch("https://service.ecanna.com.br/files", { + const response = await fetch("http://localhost/files", { method: "POST", body: JSON.stringify(data), headers: { diff --git a/components/ui/AssociationAdmin.tsx b/components/ui/AssociationAdmin.tsx index 76844b0..04eff24 100644 --- a/components/ui/AssociationAdmin.tsx +++ b/components/ui/AssociationAdmin.tsx @@ -562,7 +562,7 @@ function MyAccount() {
  • diff --git a/components/ui/MyInfo.tsx b/components/ui/MyInfo.tsx index 0d02a2a..e1d43bc 100644 --- a/components/ui/MyInfo.tsx +++ b/components/ui/MyInfo.tsx @@ -308,6 +308,7 @@ function MyInfo() { id="selfieInput" type="file" class="hidden" + accept="image/png, image/jpeg, image/jpg" onChange={(e) => handleUploadSelfie(e)} /> {changedSelfie && ( diff --git a/components/ui/SignUpFormPrescriber.tsx b/components/ui/SignUpFormPrescriber.tsx new file mode 100644 index 0000000..16b2eca --- /dev/null +++ b/components/ui/SignUpFormPrescriber.tsx @@ -0,0 +1,239 @@ +import { invoke } from "../../runtime.ts"; +import { useState } from "preact/hooks"; +import StepTimeline from "./StepTimeline.tsx"; +import { IS_BROWSER } from "$fresh/runtime.ts"; + +export interface Props { + formTitle?: string; +} + +function SignUpFormPrescriber({ formTitle }: Props) { + const [password, setPassword] = useState(""); + const [email, setEmail] = useState(""); + const [name, setName] = useState(""); + const [cpf, setCpf] = useState(""); + const [registryType, setRegistryType] = useState(""); + const [registry, setRegistry] = useState(""); + const [loading, setLoading] = useState(false); + const [termsAgree, setTermsAgree] = useState(false); + const [cpfError, setCpfError] = useState(""); + + const handleSubmit = async (e: Event) => { + e.preventDefault(); + if (name == "" || cpf == "" || email == "" || password == "") { + alert("Preencha todos os campos"); + return null; + } + if (cpfError != "") { + alert("Digite um cpf válido"); + return null; + } + if (termsAgree) { + setLoading(true); + try { + const dataSignup = await invoke["deco-sites/ecannadeco"].actions + .cognitoSignUp( + { email, password, name, cpf }, + ); + + const dataS = dataSignup as { + errors?: Array; + data?: { association?: { "_id": string } }; + }; + + const association = dataS.data?.association; + + console.log({ dataSignup, dataS }); + + if (dataS.errors && dataS.errors.length > 0) { + alert( + "Não foi possível fazer signup. Verifique as informações fornecidas e tente novamente.", + ); + setLoading(false); + } else { + if (IS_BROWSER) { + localStorage.setItem("emailConfirm", email); + localStorage.setItem("cpfUserAsaas", cpf); + localStorage.setItem("nameUserAsaas", name); + if (association) { + localStorage.setItem("associationSignup", association._id); + localStorage.setItem("nameUserAssociationSignup", name); + } + } + + setLoading(false); + window.location.href = "/confirmar-cadastro"; + } + } catch (e) { + alert( + "Não foi possível fazer signup. Verifique as informações fornecidas e tente novamente.", + ); + console.log({ e }); + setLoading(false); + } + } else { + alert( + "Você deve concordar com os Termos de Uso e Políticas de Privacidade para continuar seu cadastro", + ); + } + }; + + const validarCPF = (cpf: string) => { + cpf = cpf.replace(/[^\d]/g, ""); // Remove caracteres não numéricos + + if (cpf.length !== 11 || /^(.)\1+$/.test(cpf)) return false; // Verifica se o CPF tem 11 dígitos e não é uma sequência repetida + + // Calcula o primeiro dígito verificador + let soma = 0; + for (let i = 0; i < 9; i++) { + soma += parseInt(cpf.charAt(i)) * (10 - i); + } + let resto = 11 - (soma % 11); + const dv1 = resto >= 10 ? 0 : resto; + + // Verifica se o primeiro dígito verificador é válido + if (parseInt(cpf.charAt(9)) !== dv1) return false; + + // Calcula o segundo dígito verificador + soma = 0; + for (let i = 0; i < 10; i++) { + soma += parseInt(cpf.charAt(i)) * (11 - i); + } + resto = 11 - (soma % 11); + const dv2 = resto >= 10 ? 0 : resto; + + // Verifica se o segundo dígito verificador é válido + if (parseInt(cpf.charAt(10)) !== dv2) return false; + + return true; // CPF válido + }; + + const handleCPFInputChange = (event: Event) => { + const inputValue = (event.target as HTMLInputElement).value; + setCpf(inputValue); + setCpfError(validarCPF(inputValue) ? "" : "CPF inválido"); + }; + + return ( +
    + +
    handleSubmit(e)} + > + + Prescritor - Criar Conta + + + + + + + + + Termos de Uso e + {" "} + Políticas de Privacidade + + + +
    +
    + ); +} + +export default SignUpFormPrescriber; diff --git a/components/ui/SignUpPrescriber.tsx b/components/ui/SignUpPrescriber.tsx new file mode 100644 index 0000000..d64703c --- /dev/null +++ b/components/ui/SignUpPrescriber.tsx @@ -0,0 +1,12 @@ +import SignUpFormPrescriber from "deco-sites/ecannadeco/islands/SignUpFormPrescriber.tsx"; +import FormWrap from "./FormWrap.tsx"; + +function SignUp() { + return ( + + + + ); +} + +export default SignUp; diff --git a/fresh.gen.ts b/fresh.gen.ts index 1c57811..0144435 100644 --- a/fresh.gen.ts +++ b/fresh.gen.ts @@ -46,6 +46,7 @@ import * as $ShowMore from "./islands/ShowMore.tsx"; import * as $SignInForm from "./islands/SignInForm.tsx"; import * as $SignInFormAdmin from "./islands/SignInFormAdmin.tsx"; import * as $SignUpForm from "./islands/SignUpForm.tsx"; +import * as $SignUpFormPrescriber from "./islands/SignUpFormPrescriber.tsx"; import * as $Signout from "./islands/Signout.tsx"; import * as $SliderJS from "./islands/SliderJS.tsx"; import * as $UserAlerts from "./islands/UserAlerts.tsx"; @@ -102,6 +103,7 @@ const manifest = { "./islands/SignInForm.tsx": $SignInForm, "./islands/SignInFormAdmin.tsx": $SignInFormAdmin, "./islands/SignUpForm.tsx": $SignUpForm, + "./islands/SignUpFormPrescriber.tsx": $SignUpFormPrescriber, "./islands/Signout.tsx": $Signout, "./islands/SliderJS.tsx": $SliderJS, "./islands/UserAlerts.tsx": $UserAlerts, diff --git a/islands/SignUpFormPrescriber.tsx b/islands/SignUpFormPrescriber.tsx new file mode 100644 index 0000000..62c66b4 --- /dev/null +++ b/islands/SignUpFormPrescriber.tsx @@ -0,0 +1,8 @@ +import Component from "deco-sites/ecannadeco/components/ui/SignUpFormPrescriber.tsx"; +import type { Props } from "deco-sites/ecannadeco/components/ui/SignUpFormPrescriber.tsx"; + +function Island(props: Props) { + return ; +} + +export default Island; diff --git a/manifest.gen.ts b/manifest.gen.ts index 91447f5..6ec324a 100644 --- a/manifest.gen.ts +++ b/manifest.gen.ts @@ -98,26 +98,27 @@ import * as $$$$$$53 from "./sections/Miscellaneous/PublicPageControl.tsx"; import * as $$$$$$54 from "./sections/Miscellaneous/PublicProfile.tsx"; import * as $$$$$$55 from "./sections/Miscellaneous/SignIn.tsx"; import * as $$$$$$56 from "./sections/Miscellaneous/SignInAdmin.tsx"; -import * as $$$$$$58 from "./sections/Miscellaneous/Signout.tsx"; +import * as $$$$$$59 from "./sections/Miscellaneous/Signout.tsx"; import * as $$$$$$57 from "./sections/Miscellaneous/SignUp.tsx"; -import * as $$$$$$59 from "./sections/Miscellaneous/Slide.tsx"; -import * as $$$$$$60 from "./sections/Miscellaneous/UserAlerts.tsx"; -import * as $$$$$$61 from "./sections/Miscellaneous/UserAssociatedSignup.tsx"; -import * as $$$$$$62 from "./sections/Newsletter/Newsletter.tsx"; -import * as $$$$$$63 from "./sections/Product/ImageGalleryFrontBack.tsx"; -import * as $$$$$$64 from "./sections/Product/ImageGallerySlider.tsx"; -import * as $$$$$$65 from "./sections/Product/NotFound.tsx"; -import * as $$$$$$66 from "./sections/Product/NotFoundChallenge.tsx"; -import * as $$$$$$67 from "./sections/Product/ProductDetails.tsx"; -import * as $$$$$$68 from "./sections/Product/ProductInfo.tsx"; -import * as $$$$$$69 from "./sections/Product/ProductShelf.tsx"; -import * as $$$$$$70 from "./sections/Product/ProductShelfTabbed.tsx"; -import * as $$$$$$71 from "./sections/Product/SearchResult.tsx"; -import * as $$$$$$72 from "./sections/Product/ShelfWithImage.tsx"; -import * as $$$$$$73 from "./sections/Product/Wishlist.tsx"; -import * as $$$$$$74 from "./sections/Social/InstagramPosts.tsx"; -import * as $$$$$$75 from "./sections/Social/WhatsApp.tsx"; -import * as $$$$$$76 from "./sections/Theme/Theme.tsx"; +import * as $$$$$$58 from "./sections/Miscellaneous/SignUpPrescriber.tsx"; +import * as $$$$$$60 from "./sections/Miscellaneous/Slide.tsx"; +import * as $$$$$$61 from "./sections/Miscellaneous/UserAlerts.tsx"; +import * as $$$$$$62 from "./sections/Miscellaneous/UserAssociatedSignup.tsx"; +import * as $$$$$$63 from "./sections/Newsletter/Newsletter.tsx"; +import * as $$$$$$64 from "./sections/Product/ImageGalleryFrontBack.tsx"; +import * as $$$$$$65 from "./sections/Product/ImageGallerySlider.tsx"; +import * as $$$$$$66 from "./sections/Product/NotFound.tsx"; +import * as $$$$$$67 from "./sections/Product/NotFoundChallenge.tsx"; +import * as $$$$$$68 from "./sections/Product/ProductDetails.tsx"; +import * as $$$$$$69 from "./sections/Product/ProductInfo.tsx"; +import * as $$$$$$70 from "./sections/Product/ProductShelf.tsx"; +import * as $$$$$$71 from "./sections/Product/ProductShelfTabbed.tsx"; +import * as $$$$$$72 from "./sections/Product/SearchResult.tsx"; +import * as $$$$$$73 from "./sections/Product/ShelfWithImage.tsx"; +import * as $$$$$$74 from "./sections/Product/Wishlist.tsx"; +import * as $$$$$$75 from "./sections/Social/InstagramPosts.tsx"; +import * as $$$$$$76 from "./sections/Social/WhatsApp.tsx"; +import * as $$$$$$77 from "./sections/Theme/Theme.tsx"; const manifest = { "loaders": { @@ -193,28 +194,30 @@ const manifest = { "deco-sites/ecannadeco/sections/Miscellaneous/PublicProfile.tsx": $$$$$$54, "deco-sites/ecannadeco/sections/Miscellaneous/SignIn.tsx": $$$$$$55, "deco-sites/ecannadeco/sections/Miscellaneous/SignInAdmin.tsx": $$$$$$56, - "deco-sites/ecannadeco/sections/Miscellaneous/Signout.tsx": $$$$$$58, + "deco-sites/ecannadeco/sections/Miscellaneous/Signout.tsx": $$$$$$59, "deco-sites/ecannadeco/sections/Miscellaneous/SignUp.tsx": $$$$$$57, - "deco-sites/ecannadeco/sections/Miscellaneous/Slide.tsx": $$$$$$59, - "deco-sites/ecannadeco/sections/Miscellaneous/UserAlerts.tsx": $$$$$$60, + "deco-sites/ecannadeco/sections/Miscellaneous/SignUpPrescriber.tsx": + $$$$$$58, + "deco-sites/ecannadeco/sections/Miscellaneous/Slide.tsx": $$$$$$60, + "deco-sites/ecannadeco/sections/Miscellaneous/UserAlerts.tsx": $$$$$$61, "deco-sites/ecannadeco/sections/Miscellaneous/UserAssociatedSignup.tsx": - $$$$$$61, - "deco-sites/ecannadeco/sections/Newsletter/Newsletter.tsx": $$$$$$62, + $$$$$$62, + "deco-sites/ecannadeco/sections/Newsletter/Newsletter.tsx": $$$$$$63, "deco-sites/ecannadeco/sections/Product/ImageGalleryFrontBack.tsx": - $$$$$$63, - "deco-sites/ecannadeco/sections/Product/ImageGallerySlider.tsx": $$$$$$64, - "deco-sites/ecannadeco/sections/Product/NotFound.tsx": $$$$$$65, - "deco-sites/ecannadeco/sections/Product/NotFoundChallenge.tsx": $$$$$$66, - "deco-sites/ecannadeco/sections/Product/ProductDetails.tsx": $$$$$$67, - "deco-sites/ecannadeco/sections/Product/ProductInfo.tsx": $$$$$$68, - "deco-sites/ecannadeco/sections/Product/ProductShelf.tsx": $$$$$$69, - "deco-sites/ecannadeco/sections/Product/ProductShelfTabbed.tsx": $$$$$$70, - "deco-sites/ecannadeco/sections/Product/SearchResult.tsx": $$$$$$71, - "deco-sites/ecannadeco/sections/Product/ShelfWithImage.tsx": $$$$$$72, - "deco-sites/ecannadeco/sections/Product/Wishlist.tsx": $$$$$$73, - "deco-sites/ecannadeco/sections/Social/InstagramPosts.tsx": $$$$$$74, - "deco-sites/ecannadeco/sections/Social/WhatsApp.tsx": $$$$$$75, - "deco-sites/ecannadeco/sections/Theme/Theme.tsx": $$$$$$76, + $$$$$$64, + "deco-sites/ecannadeco/sections/Product/ImageGallerySlider.tsx": $$$$$$65, + "deco-sites/ecannadeco/sections/Product/NotFound.tsx": $$$$$$66, + "deco-sites/ecannadeco/sections/Product/NotFoundChallenge.tsx": $$$$$$67, + "deco-sites/ecannadeco/sections/Product/ProductDetails.tsx": $$$$$$68, + "deco-sites/ecannadeco/sections/Product/ProductInfo.tsx": $$$$$$69, + "deco-sites/ecannadeco/sections/Product/ProductShelf.tsx": $$$$$$70, + "deco-sites/ecannadeco/sections/Product/ProductShelfTabbed.tsx": $$$$$$71, + "deco-sites/ecannadeco/sections/Product/SearchResult.tsx": $$$$$$72, + "deco-sites/ecannadeco/sections/Product/ShelfWithImage.tsx": $$$$$$73, + "deco-sites/ecannadeco/sections/Product/Wishlist.tsx": $$$$$$74, + "deco-sites/ecannadeco/sections/Social/InstagramPosts.tsx": $$$$$$75, + "deco-sites/ecannadeco/sections/Social/WhatsApp.tsx": $$$$$$76, + "deco-sites/ecannadeco/sections/Theme/Theme.tsx": $$$$$$77, }, "actions": { "deco-sites/ecannadeco/actions/adminGetAssociation.ts": $$$$$$$$$0, diff --git a/sections/Miscellaneous/SignUpPrescriber.tsx b/sections/Miscellaneous/SignUpPrescriber.tsx new file mode 100644 index 0000000..d25ca64 --- /dev/null +++ b/sections/Miscellaneous/SignUpPrescriber.tsx @@ -0,0 +1 @@ +export { default } from "../../components/ui/SignUpPrescriber.tsx";