PolyPaw/habitica-sync
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

add ui for create、modify、delete for tasks

Browse source
This commit is contained in:
kkzzhizhou 2021-11-22 17:12:08 +08:00
parent 1b468b8454
commit f350875d90
14 changed files with 138 additions and 36 deletions
Download patch file Download diff file Expand all files Collapse all files

9
src/view/Components/Taskview/Dailiesview/DailyItem.tsx
View file

@ -6,10 +6,17 @@ function DailyItem(props: any) {
return (
<div className="todo-item" id={props.id}>
<input type="checkbox" className="checkbox" id={props.id} onChange={props.onChange} checked={props.completed} />
<div>
<div className="todo-content">
<p><Emoji text={props.daily_text}></Emoji></p>
<ReactMarkdown children={props.daily_notes} />
</div>
<button className="modify-todo" id={props.id}>
<span className="material-icons md-24">create</span>
</button>
<button className="delete-todo" id={props.id}>
<span className="material-icons md-24">clear</span>
</button>
</div>
)

6
src/view/Components/Taskview/Dailiesview/index.tsx
View file

@ -22,6 +22,11 @@ export default function Index(props: any){
<Tab><Trans>Active</Trans></Tab>
<Tab><Trans>Completed</Trans></Tab>
</TabList>
<div className="add-task-input">
<input type="text">
</input>
<button className="submit-button"><Trans>submit</Trans></button>
</div>
<TabPanel>
<ul>{incompleteDailies}</ul>
</TabPanel>
@ -29,6 +34,7 @@ export default function Index(props: any){
<ul>{completedDailies}</ul>
</TabPanel>
</Tabs>
</div>
return(display);
}