Add field item transfers from sort form to grocery list form
This commit is contained in:
parent
88ea058b7d
commit
da05198eb3
60
src/App.js
60
src/App.js
@ -113,7 +113,10 @@ function DarkInput(p){
|
||||
return <input type="text" className="bg-dark text-white" {...p}></input>
|
||||
}
|
||||
|
||||
function SorterApp(){
|
||||
function SorterApp(p){
|
||||
|
||||
const { setTransferItems } = p
|
||||
const { transferItems } = p
|
||||
|
||||
function submitForm(){
|
||||
if (item1.length>0&&item2.length>0&&item3.length>0&&item4.length>0&&item5.length>0&&
|
||||
@ -217,19 +220,40 @@ function SorterApp(){
|
||||
|
||||
const [checking,setChecking] = useState(false)
|
||||
|
||||
useEffect(()=>{
|
||||
if (result1===SUCCESS&&result2===SUCCESS&&result3===SUCCESS&&result4===SUCCESS&&result5===SUCCESS){
|
||||
setTransferItems([item1,item1_2,item2,item2_2,item3,item3_2,item4,item4_2,item5,item5_2])
|
||||
}
|
||||
},[result1,result2,result3,result4,result5])
|
||||
|
||||
useEffect(()=>{
|
||||
if (transferItems.length===10){
|
||||
setItem1(transferItems[0])
|
||||
setItem1_2(transferItems[1])
|
||||
setItem2(transferItems[2])
|
||||
setItem2_2(transferItems[3])
|
||||
setItem3(transferItems[4])
|
||||
setItem3_2(transferItems[5])
|
||||
setItem4(transferItems[6])
|
||||
setItem4_2(transferItems[7])
|
||||
setItem5(transferItems[8])
|
||||
setItem5_2(transferItems[9])
|
||||
}
|
||||
},[JSON.stringify(transferItems)])
|
||||
|
||||
return <>
|
||||
<Row className="text-white" style={{background:result1===NONE?"":result1===SUCCESS?"#003300":result1===NOTFOUND?"#333300":"#330000"}}>
|
||||
<Col>
|
||||
Ending {retainerNames[0]} Item 1:
|
||||
</Col>
|
||||
<Col>
|
||||
<DarkInput onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item1} onChange={(f)=>{setItem1(f.currentTarget.value);}}></DarkInput>
|
||||
<DarkInput name="item1" onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item1} onChange={(f)=>{setItem1(f.currentTarget.value);}}></DarkInput>
|
||||
</Col>
|
||||
<Col>
|
||||
Beginning {retainerNames[1]} Item 1:
|
||||
</Col>
|
||||
<Col>
|
||||
<DarkInput onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item1_2} onChange={(f)=>{setItem1_2(f.currentTarget.value);}}></DarkInput>
|
||||
<DarkInput name="item1_2" onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item1_2} onChange={(f)=>{setItem1_2(f.currentTarget.value);}}></DarkInput>
|
||||
</Col>
|
||||
<Col>
|
||||
{result1===NONE?<></>
|
||||
@ -243,13 +267,13 @@ function SorterApp(){
|
||||
Ending {retainerNames[1]} Item 2:
|
||||
</Col>
|
||||
<Col>
|
||||
<DarkInput onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item2} onChange={(f)=>{setItem2(f.currentTarget.value);}}></DarkInput>
|
||||
<DarkInput name="item2" onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item2} onChange={(f)=>{setItem2(f.currentTarget.value);}}></DarkInput>
|
||||
</Col>
|
||||
<Col>
|
||||
Beginning {retainerNames[2]} Item 2:
|
||||
</Col>
|
||||
<Col>
|
||||
<DarkInput onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item2_2} onChange={(f)=>{setItem2_2(f.currentTarget.value);}}></DarkInput>
|
||||
<DarkInput name="item2_2" onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item2_2} onChange={(f)=>{setItem2_2(f.currentTarget.value);}}></DarkInput>
|
||||
</Col>
|
||||
<Col>
|
||||
{result2===NONE?<></>
|
||||
@ -263,13 +287,13 @@ function SorterApp(){
|
||||
Ending {retainerNames[2]} Item 3:
|
||||
</Col>
|
||||
<Col>
|
||||
<DarkInput onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item3} onChange={(f)=>{setItem3(f.currentTarget.value);}}></DarkInput>
|
||||
<DarkInput name="item3" onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item3} onChange={(f)=>{setItem3(f.currentTarget.value);}}></DarkInput>
|
||||
</Col>
|
||||
<Col>
|
||||
Beginning {retainerNames[3]} Item 3:
|
||||
</Col>
|
||||
<Col>
|
||||
<DarkInput onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item3_2} onChange={(f)=>{setItem3_2(f.currentTarget.value);}}></DarkInput>
|
||||
<DarkInput name="item3_2" onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item3_2} onChange={(f)=>{setItem3_2(f.currentTarget.value);}}></DarkInput>
|
||||
</Col>
|
||||
<Col>
|
||||
{result3===NONE?<></>
|
||||
@ -283,13 +307,13 @@ function SorterApp(){
|
||||
Ending {retainerNames[3]} Item 4:
|
||||
</Col>
|
||||
<Col>
|
||||
<DarkInput onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item4} onChange={(f)=>{setItem4(f.currentTarget.value);}}></DarkInput>
|
||||
<DarkInput name="item4" onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item4} onChange={(f)=>{setItem4(f.currentTarget.value);}}></DarkInput>
|
||||
</Col>
|
||||
<Col>
|
||||
Beginning {retainerNames[4]} Item 4:
|
||||
</Col>
|
||||
<Col>
|
||||
<DarkInput onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item4_2} onChange={(f)=>{setItem4_2(f.currentTarget.value);}}></DarkInput>
|
||||
<DarkInput name="item4_2" onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item4_2} onChange={(f)=>{setItem4_2(f.currentTarget.value);}}></DarkInput>
|
||||
</Col>
|
||||
<Col>
|
||||
{result4===NONE?<></>
|
||||
@ -303,13 +327,13 @@ function SorterApp(){
|
||||
Ending {retainerNames[4]} Item 5:
|
||||
</Col>
|
||||
<Col>
|
||||
<DarkInput onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item5} onChange={(f)=>{setItem5(f.currentTarget.value);}}></DarkInput>
|
||||
<DarkInput name="item5" onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item5} onChange={(f)=>{setItem5(f.currentTarget.value);}}></DarkInput>
|
||||
</Col>
|
||||
<Col>
|
||||
Beginning {retainerNames[5]} Item 5:
|
||||
</Col>
|
||||
<Col>
|
||||
<DarkInput onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item5_2} onChange={(f)=>{setItem5_2(f.currentTarget.value);}}></DarkInput>
|
||||
<DarkInput name="item5_2" onKeyDown={(k)=>{if (k.key==='Enter') {submitForm()}}} value={item5_2} onChange={(f)=>{setItem5_2(f.currentTarget.value);}}></DarkInput>
|
||||
</Col>
|
||||
<Col>
|
||||
{result5===NONE?<></>
|
||||
@ -327,9 +351,15 @@ function SorterApp(){
|
||||
</>
|
||||
}
|
||||
|
||||
function ListApp(){
|
||||
function ListApp(p){
|
||||
|
||||
const {transferItems} = p
|
||||
|
||||
return <>
|
||||
<h1>List App!</h1>
|
||||
<ul>
|
||||
{transferItems.map((item)=><li style={{color:"white"}}>{item}</li>)}
|
||||
</ul>
|
||||
</>
|
||||
}
|
||||
|
||||
@ -351,6 +381,8 @@ function App() {
|
||||
|
||||
const [nav,setNav] = useState("main")
|
||||
|
||||
const [transferItems,setTransferItems] = useState([])
|
||||
|
||||
function LZ(digits,numb) {
|
||||
return "0".repeat(digits-String(numb).length)+numb
|
||||
}
|
||||
@ -548,8 +580,8 @@ function App() {
|
||||
</Col>
|
||||
</Row>
|
||||
:
|
||||
nav==="sort"?<SorterApp></SorterApp>:
|
||||
nav==="list"?<ListApp></ListApp>:
|
||||
nav==="sort"?<SorterApp transferItems={transferItems} setTransferItems={setTransferItems}></SorterApp>:
|
||||
nav==="list"?<ListApp transferItems={transferItems}></ListApp>:
|
||||
<></>
|
||||
}
|
||||
<div style={{pointerEvents:"none",position:"fixed",top:"0px",left:"0px",width:"100%",height:"100%"}}>
|
||||
|
Loading…
x
Reference in New Issue
Block a user