hope/dog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

phpapi not ready

Browse Source
This commit is contained in:
Peter Hoppe
2023-01-18 16:58:10 +01:00
parent da15265766
commit 3cee42fd50
9 changed files with 215 additions and 209 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
src/components/Profil.tsx
View File

@ -1,20 +1,22 @@
import React, { useContext, useState } from 'react'
import { Link } from 'react-router-dom';
import { Axios, ResponseT, UserCtx, UserCtxT } from '../context/UserContext';
import { ResponseT, UserCtx, UserCtxT } from '../context/UserContext';
import {Axios, updateDog} from '../services/PhpApi';
import CreateQr from '../services/CreateQr';
import Img from './Img';
import './Profil.css';
function Profil()
{
const { user, updateDog, wait } = useContext<UserCtxT | null>(UserCtx) as UserCtxT;
const { user, wait } = useContext<UserCtxT | null>(UserCtx) as UserCtxT;
const [dog, setDog] = useState<ResponseT | any>({}); // local dog not the dog in UserContext
const [errMsg, setErrMsg] = useState("false");
const [successMsg, setSuccessMsg] = useState("false");
const [formData, setFormData] = useState({
email:'',
name:'',
phone:''
phone:'',
qr_code: null
});
if(user && (dog === undefined || dog.success === undefined))
@ -30,7 +32,8 @@ function Profil()
{
email: resDog.data.data.email,
name: resDog.data.data.name,
phone: resDog.data.data.phone
phone: resDog.data.data.phone,
qr_code: resDog.data.data.qr_code
});
if(resDog.data.data.qr_code === null)
{
@ -50,23 +53,18 @@ function Profil()
})
}
const submitForm = async (e: React.FormEvent<HTMLFormElement>) =>
function showData(data: any/*, e: React.FormEvent<HTMLFormElement> | React.MouseEvent<HTMLButtonElement>*/)
{
e.preventDefault();
if(!Object.values(formData).every(val => val.trim() !== '')){
setSuccessMsg("false");
setErrMsg('Bitte alle Felder ausfüllen!');
return;
}
const data = await updateDog(formData);
if(data.success)
{
setSuccessMsg('Daten geändert!');
setErrMsg("false");
e.currentTarget?.reset();
// setSuccessMsg and setErrMsg force rendering
// if(e as React.FormEvent<HTMLFormElement> !== null)
// (e as React.FormEvent<HTMLFormElement>).currentTarget.reset();
// if(e as React.MouseEvent<HTMLButtonElement> !== null)
// (e as React.MouseEvent<HTMLButtonElement>).currentTarget.onre();
}
else if(!data.success && data.message)
{
@ -75,13 +73,40 @@ function Profil()
}
}
const submitForm = async (e: React.FormEvent<HTMLFormElement>) =>
{
e.preventDefault();
if(!Object.values(formData).every(val => val?.trim() !== '')){
setSuccessMsg("false");
setErrMsg('Bitte alle Felder ausfüllen!');
return;
}
const data = await updateDog(formData);
showData(data/*, e*/);
}
const qr_refresh = async (e: React.MouseEvent<HTMLButtonElement>) =>
{
e.preventDefault();
formData.qr_code = null;
const data = await updateDog(formData);
showData(data/*, e*/);
}
return (
<div className='Profil'>
<h2>Profil</h2>
<div>
{dog.data && <Img pth={dog.data.picture} className=''/>}
<Link to={'/upload'}>Bild ändern</Link>
{dog.data && <Img pth={dog.data.qr_code} className=''/>}
<div className='neben'>
<div className='margin'>
{dog.data && <Img pth={dog.data.picture} className=''/>}
<Link to={'/upload'}>Bild ändern</Link>
</div>
<div className='margin'>
{dog.data && <Img pth={dog.data.qr_code} className=''/>}
<button onClick={qr_refresh}>QR aktualisieren</button>
</div>
<div id="canvas"></div>
</div>
<form onSubmit={submitForm}>