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

Qr

Browse Source
This commit is contained in:
Peter Hoppe
2023-02-03 16:33:35 +01:00
parent 3b4ea00378
commit a55bdfc775
9 changed files with 371 additions and 355 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/Dog.tsx
View File

@ -1,5 +1,5 @@
import { ResponseT, DogT} from '../context/UserContext'; import { ResponseT, DogT} from '../context/UserContext';
import { ReactNode, useState } from 'react' import { ReactNode } from 'react'
import { useParams } from "react-router-dom"; import { useParams } from "react-router-dom";
import Img from './Img'; import Img from './Img';
import DogNameTxt from './DogNameTxt'; import DogNameTxt from './DogNameTxt';

1
src/components/FileUpload.tsx
View File

@ -1,7 +1,6 @@
import { useState } from "react"; import { useState } from "react";
import { Link } from "react-router-dom"; import { Link } from "react-router-dom";
import {upload as ApiUpload} from "../services/PhpApi"; import {upload as ApiUpload} from "../services/PhpApi";
import IFile from "../types/File";
import PreviewUpload from "./PreviewUpload"; import PreviewUpload from "./PreviewUpload";
const FileUpload: React.FC = () => const FileUpload: React.FC = () =>

2
src/components/Header.tsx
View File

@ -1,6 +1,6 @@
import './Header.css'; import './Header.css';
import '../App.css'; import '../App.css';
import {Axios, logOut} from '../services/PhpApi' import {logOut} from '../services/PhpApi'
import { toast, Toaster } from 'react-hot-toast'; import { toast, Toaster } from 'react-hot-toast';

4
src/components/Login.tsx
View File

@ -1,5 +1,5 @@
import {useState} from 'react'; import {useState} from 'react';
import { Link, useNavigate } from 'react-router-dom'; import { Link/*, useNavigate*/ } from 'react-router-dom';
import './Login.css'; import './Login.css';
import {getUser, loginUser} from '../services/PhpApi' import {getUser, loginUser} from '../services/PhpApi'
import { toast, Toaster } from 'react-hot-toast'; import { toast, Toaster } from 'react-hot-toast';
@ -13,7 +13,7 @@ const Login = () =>
}); });
// only for redirect // only for redirect
const {data, error, isLoading, mutate} = useSWR("/login", getUser); const {data, error, isLoading, mutate} = useSWR("/login", getUser);
const navigate = useNavigate(); //const navigate = useNavigate();
console.log('Login getUser'); console.log('Login getUser');
console.log(data); console.log(data);

10
src/components/PreviewUpload.tsx
View File

@ -1,6 +1,5 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { ResponseT } from '../context/UserContext'; import {getDog} from '../services/PhpApi';
import {Axios, getDog} from '../services/PhpApi';
import useSWR from 'swr'; import useSWR from 'swr';
function PreviewUpload({chgFile}:{chgFile: any}) function PreviewUpload({chgFile}:{chgFile: any})
@ -11,19 +10,14 @@ function PreviewUpload({chgFile}:{chgFile: any})
// const [dog, setDog] = useState<ResponseT | any>({}); // local dog not the dog in UserContext // const [dog, setDog] = useState<ResponseT | any>({}); // local dog not the dog in UserContext
const { data, error, isLoading, mutate } = useSWR(['PreviewUpload', 'SESS'], getDog ); const { data, error, isLoading } = useSWR(['PreviewUpload', 'SESS'], getDog );
if (error) return (<div>failed to load</div>); if (error) return (<div>failed to load</div>);
if (isLoading) return (<div>loading...</div>); if (isLoading) return (<div>loading...</div>);
console.log('PreviewUpload getDog'); console.log('PreviewUpload getDog');
console.log(data); console.log(data);
const dog: ResponseT | any = data.data;
let file_loc: string | undefined = "./uploads"+ data.data.picture; let file_loc: string | undefined = "./uploads"+ data.data.picture;
// setDog(data.data);
// setFile("./uploads"+ data.data.picture);
const handleChange = async ( const handleChange = async (
event: React.ChangeEvent<HTMLInputElement> event: React.ChangeEvent<HTMLInputElement>
): Promise<any> => ): Promise<any> =>

2
src/components/Profil.tsx
View File

@ -2,7 +2,7 @@ import React, { useState } from 'react';
import useSWR from 'swr'; import useSWR from 'swr';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import toast, { Toaster } from 'react-hot-toast'; import toast, { Toaster } from 'react-hot-toast';
import { ResponseT, TUser} from '../context/UserContext'; import {TUser} from '../context/UserContext';
import {getProfilData, updateDog} from '../services/PhpApi'; import {getProfilData, updateDog} from '../services/PhpApi';
import CreateQr from '../services/CreateQr'; import CreateQr from '../services/CreateQr';
import Img from './Img'; import Img from './Img';

693
src/components/Qr.tsx
View File

@ -1,352 +1,369 @@
// import React, { ChangeEvent, MouseEventHandler, useContext, useState } from 'react' import React, { ChangeEvent, MouseEventHandler, useState } from 'react'
// import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
// import { UserCtx, UserCtxT, DogT, ResponseT, TUser } from '../context/UserContext'; import { DogT } from '../context/UserContext';
// import {Axios, updateQR} from '../services/PhpApi'; import {getDog, updateQR} from '../services/PhpApi';
// import Checkbox from './Checkbox'; import Checkbox from './Checkbox';
// import Img from './Img'; import Img from './Img';
// import './Qr.css'; import './Qr.css';
import useSWR from 'swr';
// type ListItemT = type ListItemT =
// { {
// name: string; id: string;
// ordernum: number; name: string;
// } ordernum: number;
}
export default function Qr() export default function Qr()
{ {
// const { user } = useContext<UserCtxT | null>(UserCtx) as UserCtxT; const { data, error, isLoading, mutate } = useSWR( ['Qr', 'SESS'], getDog);
// const [dog, setDog] = useState<ResponseT | any>({}); // local dog not the dog in UserContext // data ist dogdata, logindata holt sich getDog.php aus $_SESSION
// const [width, setWidth] = useState(2.4);
// const [height, setHeight] = useState(3.7);
// const [fontSize, setFontSize] = useState(100);
// const [visibleItem, setVisibleItem] = useState(0b111); // 100 name, 10 phone, 1 email
// const [itemOrder, setItemOrder] = useState(123); // name first, phone second, email third
// const [errMsg, setErrMsg] = useState("false");
// const [successMsg, setSuccessMsg] = useState("false");
// const [itemList, setItemList] = useState([
// {id: '0', name:'Name', ordernum: 1},
// {id: '1', name:'Telefon', ordernum: 2},
// {id: '2', name:'Email', ordernum: 3}
// ]);
// //save reference for dragItem and dragOverItem
// const dragItem = React.useRef<any>(null);
// const dragOverItem = React.useRef<any>(null);
// // const incrementFontSize = ((event: React.MouseEvent<HTMLButtonElement>): MouseEventHandler<HTMLButtonElement> | undefined =>
// // {
// // event.preventDefault();
// // if(fontSize < 200)
// // {
// // setFontSize(fontSize + 1);
// // }
// // console.log("\nincrementFontSize " + fontSize);
// // return;
// // });
// // const decrementFontSize = ((event: React.MouseEvent<HTMLButtonElement>): MouseEventHandler<HTMLButtonElement> | undefined =>
// // {
// // event.preventDefault();
// // if(fontSize > 1)
// // {
// // setFontSize(fontSize -1);
// // }
// // console.log("\ndecrementFontSize " + fontSize);
// // return;
// // });
// function setBitField(val: number, checked: boolean, bit: number) : number
// {
// if(checked)
// {
// val |= bit;
// }
// else
// {
// val ^= bit;
// }
// return val;
// }
// function checkBoxChange(id: string, checked: boolean) : void
// {
// let value = visibleItem;
// if(id==="name")
// {
// value = setBitField(value, checked, 0b100);
// }
// if(id==="phone")
// {
// value = setBitField(value, checked, 0b010);
// }
// if(id==="email")
// {
// value = setBitField(value, checked, 0b001);
// }
// setVisibleItem(value);
// }
// function getItemOrderNumber(digit: number)
// {
// let ordernum = itemOrder; // 123
// ordernum = ordernum % (digit*10); // 123
// ordernum = Math.trunc(ordernum / digit);
// return ordernum;
// }
// function getItemOrderNumber_(order: number, digit: number)
// {
// let ordernum = order; // 123
// ordernum = ordernum % (digit*10); // 123
// ordernum = Math.trunc(ordernum / digit);
// return ordernum;
// }
// //const handle drag sorting
// function handleSort()
// {
// // console.log('handleSort current:' + dragItem.current);
// //duplicate items
// let _itemList = [...itemList];
// //remove and save the dragged item content
// const draggedItemContent = _itemList.splice(dragItem.current, 1)[0];
// //switch the position
// _itemList.splice(dragOverItem.current, 0, draggedItemContent);
// //reset the position ref
// dragItem.current = null;
// dragOverItem.current = null;
// //update the actual array
// setItemList(_itemList);
// // set new itemorder
// let newItemOrder = 0;
// let digit = 100;
// // name 1
// // telefon 2
// // email 3
// // email
// // name
// // telefon
// // email is first 1 -> 3
// // name is second 2 -> 1
// // telefon third 3 -> 2
// // 231
// // console.log('handleSort itemList:');
// // console.log(_itemList);
// _itemList.map((item, index) =>
// {
// digit = 10**(3-item.ordernum);
// newItemOrder += (index+1) * digit;
// });
// setItemOrder(newItemOrder);
// // console.log('handleSort newItemOrder:' + newItemOrder);
// }
// function oneQrBlock() const [dogRender, setDogRender] = useState<DogT>(
// { {
// return( id: 0,
// <div className='qrCodeBackFront'> qr_id: '',
// <div className='qrCode frame' style={{height : height + 'cm', width : width + 'cm'}}> email: '',
// <div className='qrCode__'>SCAN ME</div> name: '',
// <Img pth={dog.data.qr_code} className='qrCodeImg'/> phone: '',
// </div> qr_width_cm: 0,
// <div className='qrCode vert frame' style={{ height : height + 'cm', width : width + 'cm', fontSize: fontSize + '%' }}> qr_height_cm: 0,
// {((visibleItem & 0b100) > 0) && <div className={`vertFont order${getItemOrderNumber(100)}`}>{dog.data.name}</div>} qr_fontsize: 0,
// {((visibleItem & 0b010) > 0) && <div className={`vertFont order${getItemOrderNumber(10)}`}>{dog.data.phone}</div>} qr_visible_items: 0,
// {((visibleItem & 0b001) > 0) && <div className={`vertFont order${getItemOrderNumber(1)}`}>{dog.data.email}</div>} qr_item_sequence: 0,
// </div> qr_code: '',
// </div>); picture: ''
// } });
const [errMsg, setErrMsg] = useState("false");
const [successMsg, setSuccessMsg] = useState("false");
//save reference for dragItem and dragOverItem
const dragItem = React.useRef<any>(null);
const dragOverItem = React.useRef<any>(null);
const itemListInit: ListItemT[] =
[
{id: '0', name:'Name', ordernum: 1},
{id: '1', name:'Telefon', ordernum: 2},
{id: '2', name:'Email', ordernum: 3}
];
// const saveHandler = (event: React.MouseEvent<HTMLButtonElement>): MouseEventHandler<HTMLButtonElement> | undefined => const itemList = React.useRef<ListItemT[]>(itemListInit);
// {
// event.preventDefault(); if (error) return (<div>failed to load</div>);
// console.log("saveHandler \n"); if (isLoading) return (<div>loading...</div>);
// console.log(event);
// updateQR( // local dog
// { let dog: DogT =
// qr_width_cm: width, {
// qr_height_cm: height, id: 0,
// qr_fontsize: fontSize, qr_id: '',
// qr_visible_items: visibleItem, email: '',
// qr_item_sequence: itemOrder name: '',
// } phone: '',
// ).then((resQR) => qr_width_cm: 0,
// { qr_height_cm: 0,
// if(resQR.success) qr_fontsize: 0,
// { qr_visible_items: 0,
// setSuccessMsg('Daten gesichert!'); qr_item_sequence: 0,
// setErrMsg("false"); qr_code: '',
// } picture: ''
// else if(!resQR.success && resQR.message) };
// {
// setSuccessMsg("false");
// setErrMsg(resQR.message);
// }
// })
// .catch((err) => console.error(err));
// return;
// }
// const printHandler = (event: React.MouseEvent<HTMLButtonElement>): MouseEventHandler<HTMLButtonElement> | undefined => function setBitField(val: number, checked: boolean, bit: number) : number
// { {
// event.preventDefault(); if(checked)
// console.log("printHandler \n"); {
// console.log(event); val |= bit;
// window.print(); }
// return; else
// } {
val ^= bit;
}
return val;
}
// function OrderItemList(order: number) function checkBoxChange(id: string, checked: boolean) : void
// { {
// let _itemList: {id: string; name: string; ordernum: number}[] = []; let value = dog.qr_visible_items;
// let oNum = getItemOrderNumber_(order, 100); console.log(value);
// let item = itemList.find( x => x.ordernum === oNum); if(id==="name")
// _itemList.push(item!); {
// oNum = getItemOrderNumber_(order, 10); value = setBitField(value, checked, 0b100);
// item = itemList.find( x => x.ordernum === oNum); }
// _itemList.push(item!); if(id==="phone")
// oNum = getItemOrderNumber_(order, 1); {
// item = itemList.find( x => x.ordernum === oNum); value = setBitField(value, checked, 0b010);
// _itemList.push(item!); }
// setItemList(_itemList); if(id==="email")
// } {
// const onChangeWidth = (e: ChangeEvent<HTMLInputElement> ) => value = setBitField(value, checked, 0b001);
// { }
// setWidth(parseInt(e.target.value)/10 ? parseInt(e.target.value)/10 : 0); console.log(value);
// } dog.qr_visible_items = value;
setDogRender(dog);
}
// const onChangeHeight = (e: ChangeEvent<HTMLInputElement> ) => function getItemOrderNumber(digit: number)
// { {
// setHeight(parseInt(e.target.value)/10 ? parseInt(e.target.value)/10 : 0); let ordernum = dog.qr_item_sequence; // 123
// } ordernum = ordernum % (digit*10); // 123
ordernum = Math.trunc(ordernum / digit);
// const onChangeFontSize = (e: ChangeEvent<HTMLInputElement> ) => return ordernum;
// { }
// setFontSize(parseInt(e.target.value) ? parseInt(e.target.value) : 0);
// }
// if(user && dog.success === undefined) //const handle drag sorting
// { function handleSort()
// Axios.post<ResponseT>('getDog.php', {
// { //duplicate items
// qr_id: user.qr_id let _itemList = [...itemList.current];
// })
// .then((resDog) =>
// {
// let locDog: DogT = resDog.data.data;
// setDog(resDog.data); // ResponseT
// setWidth(locDog.qr_width_cm);
// setHeight(locDog.qr_height_cm);
// setFontSize(locDog.qr_fontsize);
// setVisibleItem(locDog.qr_visible_items);
// setItemOrder(locDog.qr_item_sequence);
// OrderItemList(locDog.qr_item_sequence);
// })
// .catch((err) => console.error(err));
// }
return ( //remove and save the dragged item content
<> const draggedItemContent = _itemList.splice(dragItem.current, 1)[0];
{/* {user && dog.data &&
<div> //switch the position
<h1>Qr-Code Druck</h1> _itemList.splice(dragOverItem.current, 0, draggedItemContent);
<Link to={"/profil"}>Zurück zum Profil</Link>
<div className='qrSettings____'> //reset the position ref
<div className='qrSettings'> dragItem.current = null;
<div> dragOverItem.current = null;
<div>Anhänger</div>
<label htmlFor='width'>Breite [mm] </label> //update the actual array
<input className='qr-input' type='number' id='width' name='width' itemList.current = _itemList;
min="1" max="100"
onChange={onChangeWidth} value={width*10}/> // set new itemorder
<label htmlFor='height'>Höhe [mm] </label> let newItemOrder = 0;
<input className='qr-input' type='number' id='height' name='height' let digit = 100;
min="1" max="100"
onChange={onChangeHeight} value={height*10}/> // name 1
</div> // telefon 2
<div> // email 3
<label htmlFor='fontSize'>Schriftgröße </label>
<input className='qr-input' type='number' id='fontSize' name='fontSize' // email
min="1" max="200" // name
onChange={onChangeFontSize} value={fontSize} /> // telefon
</div>
<div> // email is first 1 -> 3
<div>Sichtbare Elemente</div> // name is second 2 -> 1
<Checkbox // telefon third 3 -> 2
id='name'
label={'Name'} // name telefon email
checked={(visibleItem & 0b100) > 0} // 2 3 1 ordernum
changeEvent={checkBoxChange}
/> _itemList.map((item, index) =>
<Checkbox {
id='phone' digit = 10**(3-item.ordernum);
label={'Telefon'} newItemOrder += (index+1) * digit;
checked={(visibleItem & 0b010) > 0} });
changeEvent={checkBoxChange}
/> dog.qr_item_sequence = newItemOrder;
<Checkbox setDogRender(dog);
id='email' }
label={'Email'}
checked={(visibleItem & 0b001) > 0} function oneQrBlock()
changeEvent={checkBoxChange} {
/> return(
</div> <div className='qrCodeBackFront'>
<div> <div className='qrCode frame' style={{height : dog.qr_height_cm + 'cm', width : dog.qr_width_cm + 'cm'}}>
<div>Reihenfolge</div> <div className='qrCode__'>SCAN ME</div>
<div className='beschreibung'>Ändern durch Drag'n Drop</div> <Img pth={dog.qr_code} className='qrCodeImg'/>
<div className="list-container"> </div>
{itemList.map((item, index) => ( <div className='qrCode vert frame' style={{ height : dog.qr_height_cm + 'cm', width : dog.qr_width_cm + 'cm', fontSize: dog.qr_fontsize + '%' }}>
<div {((dog.qr_visible_items & 0b100) > 0) && <div className={`vertFont order${getItemOrderNumber(100)}`}>{dog.name}</div>}
key={index} {((dog.qr_visible_items & 0b010) > 0) && <div className={`vertFont order${getItemOrderNumber(10)}`}>{dog.phone}</div>}
className="list-item" {((dog.qr_visible_items & 0b001) > 0) && <div className={`vertFont order${getItemOrderNumber(1)}`}>{dog.email}</div>}
draggable </div>
onDragStart={(e) => {dragItem.current = index; }} </div>);
onDragEnter={(e) => {dragOverItem.current = index; }} }
onDragEnd={handleSort}
onDragOver={(e) => {e.preventDefault(); }} const saveHandler = (event: React.MouseEvent<HTMLButtonElement>): MouseEventHandler<HTMLButtonElement> | undefined =>
> {
<li>{item.name}</li> event.preventDefault();
</div> console.log("saveHandler \n");
))} console.log(event);
</div> updateQR(
</div> {
</div> qr_width_cm: dog.qr_width_cm,
<div className='column'> qr_height_cm: dog.qr_height_cm,
<button id="saveButton" className='saveButton' onClick={saveHandler} >Werte sichern</button> qr_fontsize: dog.qr_fontsize,
<button id="printButton" className='printButton' onClick={printHandler} >QR-Code drucken</button> qr_visible_items: dog.qr_visible_items,
{successMsg !== "false" && <div className="success-msg">{successMsg}</div>} qr_item_sequence: dog.qr_item_sequence
{errMsg !== "false" && <div className="err-msg">{errMsg}</div>} }
</div> ).then((resQR) =>
</div> {
<div className='blockRepeat'> if(resQR.success)
{oneQrBlock()} {
{oneQrBlock()} setSuccessMsg('Daten gesichert!');
{oneQrBlock()} mutate();
{oneQrBlock()} }
{oneQrBlock()} else if(!resQR.success && resQR.message)
{oneQrBlock()} {
</div> setSuccessMsg("false");
</div> } setErrMsg(resQR.message);
{ !dog.data && !user && }
<> })
<h1>Qr-Code Druck</h1> .catch((err) => console.error(err));
<div>nothing</div> return;
</> }
} */}
</> const printHandler = (event: React.MouseEvent<HTMLButtonElement>): MouseEventHandler<HTMLButtonElement> | undefined =>
{
event.preventDefault();
console.log("printHandler \n");
console.log(event);
window.print();
return;
}
function getItemOrderNumber_(order: number, digit: number)
{
let ordernum = order; // 123
ordernum = ordernum % (digit*10); // 123
ordernum = Math.trunc(ordernum / digit);
return ordernum;
}
/**
* order the list from order
*
* @param order
* normal order is 123 mean name phone email
* 231 mean name get ordernumber 2
* phone get ordernumber 3
* email get ordernumber 1
* new order is email name phone
*
*
*
*/
function OrderItemList(order: number)
{
let _itemList: ListItemT[] = [];
let oNum = getItemOrderNumber_(order, 100);
_itemList[oNum-1] = itemListInit[0];
oNum = getItemOrderNumber_(order, 10);
_itemList[oNum-1] = itemListInit[1];
oNum = getItemOrderNumber_(order, 1);
_itemList[oNum-1] = itemListInit[2];
itemList.current = _itemList;
}
const onChangeWidth = (e: ChangeEvent<HTMLInputElement> ) =>
{
dog.qr_width_cm = parseInt(e.target.value)/10 ? parseInt(e.target.value)/10 : 0;
setDogRender(dog);
}
const onChangeHeight = (e: ChangeEvent<HTMLInputElement> ) =>
{
dog.qr_height_cm = parseInt(e.target.value)/10 ? parseInt(e.target.value)/10 : 0;
setDogRender(dog);
}
const onChangeFontSize = (e: ChangeEvent<HTMLInputElement> ) =>
{
dog.qr_fontsize = parseInt(e.target.value) ? parseInt(e.target.value) : 0;
setDogRender(dog);
}
console.log('dogRender');
console.log(dogRender);
console.log('data');
console.log(data);
if (dogRender.email)
{
Object.assign(dog, dogRender);
}
else
{
Object.assign(dog, data.data);
}
OrderItemList(dog.qr_item_sequence);
console.log(dog);
return (
<div>
<h1>Qr-Code Druck</h1>
<Link to={"/profil"}>Zurück zum Profil</Link>
<div className='qrSettings____'>
<div className='qrSettings'>
<div>
<div>Anhänger</div>
<label htmlFor='width'>Breite [mm] </label>
<input className='qr-input' type='number' id='width' name='width'
min="1" max="100"
onChange={onChangeWidth} value={dog.qr_width_cm*10}/>
<label htmlFor='height'>Höhe [mm] </label>
<input className='qr-input' type='number' id='height' name='height'
min="1" max="100"
onChange={onChangeHeight} value={dog.qr_height_cm*10}/>
</div>
<div>
<label htmlFor='fontSize'>Schriftgröße </label>
<input className='qr-input' type='number' id='fontSize' name='fontSize'
min="1" max="200"
onChange={onChangeFontSize} value={dog.qr_fontsize} />
</div>
<div>
<div>Sichtbare Elemente</div>
<Checkbox
id='name'
label={'Name'}
checked={(dog.qr_visible_items & 0b100) > 0}
changeEvent={checkBoxChange}
/>
<Checkbox
id='phone'
label={'Telefon'}
checked={(dog.qr_visible_items & 0b010) > 0}
changeEvent={checkBoxChange}
/>
<Checkbox
id='email'
label={'Email'}
checked={(dog.qr_visible_items & 0b001) > 0}
changeEvent={checkBoxChange}
/>
</div>
<div>
<div>Reihenfolge</div>
<div className='beschreibung'>Ändern durch Drag'n Drop</div>
<div className="list-container">
{itemList.current.map((item, index) => (
<div
key={index}
className="list-item"
draggable
onDragStart={(e) => {dragItem.current = index; }}
onDragEnter={(e) => {dragOverItem.current = index; }}
onDragEnd={handleSort}
onDragOver={(e) => {e.preventDefault(); }}
>
<li>{item.name}</li>
</div>
))}
</div>
</div>
</div>
<div className='column'>
<button id="saveButton" className='saveButton' onClick={saveHandler} >Werte sichern</button>
<button id="printButton" className='printButton' onClick={printHandler} >QR-Code drucken</button>
{successMsg !== "false" && <div className="success-msg">{successMsg}</div>}
{errMsg !== "false" && <div className="err-msg">{errMsg}</div>}
</div>
</div>
<div className='blockRepeat'>
{oneQrBlock()}
{oneQrBlock()}
{oneQrBlock()}
{oneQrBlock()}
{oneQrBlock()}
{oneQrBlock()}
</div>
</div>
); );
} }

2
src/services/CreateQr.ts
View File

@ -1,6 +1,4 @@
import { upload } from './PhpApi'; import { upload } from './PhpApi';
import React from 'react'
import QRCodeStyling from 'qr-code-styling'; import QRCodeStyling from 'qr-code-styling';
export default async function CreateQr({qr_id}:{qr_id: string | undefined}) export default async function CreateQr({qr_id}:{qr_id: string | undefined})

10
src/services/PhpApi.ts
View File

@ -35,7 +35,7 @@ export const getDog = async ( params: string[] | undefined) : Promise<ResponseT>
{ {
qrid = params[1]; qrid = params[1];
} }
if(params !== undefined && params.length == 1) if(params !== undefined && params.length === 1)
{ {
qrid = params[0]; qrid = params[0];
} }
@ -88,6 +88,14 @@ export const registerUser = async ({email,password}:
export const updateQR = async ({qr_width_cm, qr_height_cm, qr_fontsize, qr_visible_items, qr_item_sequence}: export const updateQR = async ({qr_width_cm, qr_height_cm, qr_fontsize, qr_visible_items, qr_item_sequence}:
{qr_width_cm: number, qr_height_cm: number, qr_fontsize: number, qr_visible_items: number, qr_item_sequence: number}) => {qr_width_cm: number, qr_height_cm: number, qr_fontsize: number, qr_visible_items: number, qr_item_sequence: number}) =>
{ {
console.log('Api updateQR input');
console.log('qr_width_cm: ' + qr_width_cm);
console.log('qr_height_cm: ' + qr_height_cm);
console.log('qr_fontsize: ' + qr_fontsize);
console.log('qr_visible_items: ' + qr_visible_items);
console.log('qr_item_sequence: ' + qr_item_sequence);
try try
{ {
const {data} = await Axios.post('updateQR.php', const {data} = await Axios.post('updateQR.php',