import { DialogTitle } from '@mui/material'; import React, { useState, useEffect } from 'react'; import Dialog from '@mui/material/Dialog'; import DialogContent from '@mui/material/DialogContent'; import TextField from '@mui/material/TextField'; import Stack from '@mui/material/Stack'; import Button from '@mui/material/Button'; import './komponent_modyfkuj_kontrahenta.css' import Komunikaty from '../../komunikaty'; import InputAdornment from '@mui/material/InputAdornment'; import Popover from '@mui/material/Popover'; import Typography from '@mui/material/Typography'; import HelpIcon from '@mui/icons-material/Help'; export default function KomponentModyfikujKontrahentaSub(props) { const [imie, setimie] = React.useState(props.imie); const [nazwisko, setnazwisko] = React.useState(props.nazwisko); const [numertelefonu, setnumertelefonu] = React.useState(props.telefon); const [pokaz, setpokaz] = React.useState(false); const [pokaz_ostrzezenie, setpokaz_ostrzezenie] = React.useState(false); const [komunikat_pokaz_error, setkomunikat_pokaz_error] = React.useState(false); const [komunikat, setkomunikat] = React.useState(''); const [tekst_bledu_numer_telefonu, settekst_bledu_numer_telefonu] = React.useState(""); const [tekst_bledu_imie, settekst_bledu_imie] = React.useState(""); const [tekst_bledu_nazwisko, settekst_bledu_nazwisko] = React.useState(""); const [blad_imie, setbladimie] = React.useState(true); const [blad_nazwisko, setbladnaziwsko] = React.useState(true); const [blad_numeru_telefonu, setblad_numeru_telefonu] = React.useState(true); const wzor_numeru_telefonu = /^\d{9}$/; const wzor_imie = /^[AĄBCĆDEĘFGHIJKLŁMNŃOÓPRSŚTUWYZŹŻ][aąbcćdeęfghijklłmnńoóprsśtuwyzźż]+$/g; const wzor_nazwisko = /^[AĄBCĆDEĘFGHIJKLŁMNŃOÓPRSŚTUWYZŹŻ][aąbcćdeęfghijklłmnńoóprsśtuwyzźż]+$/g; const [podpowiedzimie, setpodpowiedzimie] = React.useState(null); const [podpowiedznaziwsko, setpodpowiedznaziwsko] = React.useState(null); const [podpowiedznumertelefonu, setpodpowiedznumertelefonu] = React.useState(null); const otworzpodpowiedzimie = Boolean(podpowiedzimie); const otworzpodpowiedznazwisko = Boolean(podpowiedznaziwsko); const otworzpodpowiedznumertelefonu = Boolean(podpowiedznumertelefonu); //wzor z +48 const wzor_numeru_telefonu = /^\+48\d{9}$/ const Przypisz_Imie = (event) => { setimie(event.target.value); if (event.target.value.match(wzor_imie)) { setbladimie(false); settekst_bledu_imie(""); setimie(event.target.value); } else { setbladimie(true); settekst_bledu_imie("Imię zaczynamy od wielkiej litery i nie używamy w nim cyfr!"); } } function Przypisz_Nazwisko(event) { if (event.target.value.match(wzor_nazwisko)) { setbladnaziwsko(false); settekst_bledu_nazwisko(""); setnazwisko(event.target.value); } else { setbladnaziwsko(true); settekst_bledu_nazwisko("Nazwisko zaczynamy od wielkiej litery i nie używamy w nim cyfr!"); setnazwisko(event.target.value); } } function Przypisz_Numer_Telefonu(event) { if (event.target.value.match(wzor_numeru_telefonu)) { setblad_numeru_telefonu(false); settekst_bledu_numer_telefonu(""); setnumertelefonu(event.target.value); } else { setblad_numeru_telefonu(true); settekst_bledu_numer_telefonu("Błedny numer telefonu!. Prawidłowy format to: +48XXXXXXXXX"); setnumertelefonu(event.target.value); } } const przycisk_dodaj_kontrahenta = (event) => { if ((blad_imie === true) || (blad_nazwisko === true) || (blad_numeru_telefonu === true)) { setpokaz_ostrzezenie(true); return; } fetch('http://192.168.1.4:3333/dodaj_uzytkownika', { method: 'POST', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify({ imie, nazwisko, numertelefonu }), }) .then(response => { return response.text(); }) .then(data => { if (data === 'wykonano') { setkomunikat('Kontrahent dodany poprawnie!'); setpokaz(true); setbladimie(true); setbladnaziwsko(true); setblad_numeru_telefonu(true); props.anuluj(); } }) .catch((error) => { setkomunikat_pokaz_error(true); }); // axios.post('http://192.168.1.4:3333/dodaj_uzytkownika', {imie: 'Lukasz', nazwisko: 'Maslinski', telefon: '508 245 345'}); } const komunikat_ukryj = () => { alert(imie); setpokaz(false); setpokaz_ostrzezenie(false); setkomunikat_pokaz_error(false); } const PokazPodpowiedzImie = (event) => { setpodpowiedzimie(event.target); } const PokazPodpowiedzNazwisko = (event) => { setpodpowiedznaziwsko(event.target); } const PokazPodpowiedzNumerTelefonu = (event) => { setpodpowiedznumertelefonu(event.target); } const UkryjPodpowiedzNumerTelefonu = () => { setpodpowiedznumertelefonu(null); } const UkryjhPodpowiedzImie = () => { setpodpowiedzimie(null); } const UkryjhPodpowiedzNazwisko = () => { setpodpowiedznaziwsko(null); } const PrzyciskAnuluj = () => { setimie(''); props.anuluj(); } return ( <>
{imie}
{(() => { switch (props.tryb_pracy) { case 1: return DODAWANIE KONTRAHENTA: default: return DODAWANIE KONTRAHENTA: } })()} Przykład prawidłowej formy imienia: Jan . Przykład prawidłowej formy nazwiska: Kowalski. +48, }} style={{ width: 420 }} > Długość wymaganego numeru telefonu to 9 cyfr. {(() => { switch (props.tryb_pracy) { case 1: return ; default: return ; } })()} ) }