add Rewardview Panel

This commit is contained in:
kkzzhizhou 2021-11-20 13:49:24 +08:00
parent bc97bcfc3f
commit 9b15bb1236
4 changed files with 37 additions and 0 deletions

3
.gitignore vendored
View file

@ -6,6 +6,9 @@
node_modules node_modules
package-lock.json package-lock.json
# yarn
yarn.lock
*.js.map *.js.map

0
.hotreload Normal file
View file

View file

@ -0,0 +1,13 @@
import Emoji from "react-emoji-render";
import * as React from "react";
function RewardItem(props: any) {
return (
<div className="reward-item" id={props.id}>
<button className="reward-click" id={props.id} onClick={props.onChange}>-{props.reward_value}</button>
<p className="reward-text"><Emoji text={props.reward_text}></Emoji></p>
</div>
)
}
export default RewardItem

View file

@ -0,0 +1,21 @@
import * as React from "react";
import RewardItem from "./RewardItem"
export default function Index(props: any){
if(props.rewards == undefined) {
return (<div id="classDisplay">
No Rewards present.
</div>)
}
else {
const allRewards = props.rewards.map((reward: any) => {
return <RewardItem key={reward.id} id={reward.id} reward_text={reward.text} reward_value={reward.value} onChange={props.onChange}/>
})
const display = <div id="classDisplay">
<ul>{allRewards}</ul>
</div>
return(display);
}
}