Multiple Changes
This commit is contained in:
parent
a4ebd7aab3
commit
30dd6590ec
19 changed files with 330 additions and 278 deletions
|
|
@ -1,31 +0,0 @@
|
|||
import * as React from "react";
|
||||
import DailyItem from "./DailyItem"
|
||||
import { Tab, Tabs, TabList, TabPanel } from "react-tabs";
|
||||
|
||||
export default function Index(props: any){
|
||||
const incompleteDailies = props.dailys.map((daily: any) => {
|
||||
if(!daily.completed)
|
||||
return <DailyItem key={daily.id} id={daily.id}daily_text={daily.text} onChange={props.onChange} completed={daily.completed}/>
|
||||
})
|
||||
const completedDailies = props.dailys.map((daily: any) => {
|
||||
if(daily.completed)
|
||||
return <DailyItem key={daily.id} id={daily.id}daily_text={daily.text} onChange={props.onChange} completed={daily.completed}/>
|
||||
})
|
||||
const display = <div id="classDisplay">
|
||||
<Tabs>
|
||||
<TabList>
|
||||
<Tab>Active</Tab>
|
||||
<Tab>Completed</Tab>
|
||||
</TabList>
|
||||
<TabPanel>
|
||||
<ul>{incompleteDailies}</ul>
|
||||
</TabPanel>
|
||||
<TabPanel>
|
||||
<ul>{completedDailies}</ul>
|
||||
</TabPanel>
|
||||
</Tabs>
|
||||
</div>
|
||||
|
||||
return(display);
|
||||
}
|
||||
|
||||
|
|
@ -1,18 +0,0 @@
|
|||
import * as React from "react";
|
||||
|
||||
function HabitItem(props: any) {
|
||||
console.log(props);
|
||||
return (
|
||||
<div className="habit-item" id={props.id}>
|
||||
<button className="habit-plus" onClick={() => this.handleClick()}>
|
||||
+
|
||||
</button>
|
||||
<p>{props.habit_text}</p>
|
||||
<button className="habit-minus" onClick={() => this.handleClick()}>
|
||||
-
|
||||
</button>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default HabitItem
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import * as React from "react";
|
||||
import HabitItem from "./HabitItem"
|
||||
|
||||
export default function Index(props: any){
|
||||
console.log("habits = " + props.habits);
|
||||
const allHabits = props.habits.map((habit: any) => {
|
||||
return <HabitItem key={habit.id} id={habit.id}habit_text={habit.text} onChange={props.onChange}/>
|
||||
})
|
||||
const display = <div id="classDisplay">
|
||||
<ul>{allHabits}</ul>
|
||||
</div>
|
||||
|
||||
return(display);
|
||||
}
|
||||
|
||||
|
|
@ -1,7 +1,6 @@
|
|||
import * as React from "react";
|
||||
|
||||
function DailyItem(props: any) {
|
||||
console.log(props);
|
||||
return (
|
||||
<div className="todo-item" id={props.id}>
|
||||
<input type="checkbox" className="checkbox" id={props.id} onChange={props.onChange} checked={props.completed}/>
|
||||
36
src/view/Components/Taskview/Dailiesview/index.tsx
Normal file
36
src/view/Components/Taskview/Dailiesview/index.tsx
Normal file
|
|
@ -0,0 +1,36 @@
|
|||
import * as React from "react";
|
||||
import DailyItem from "./DailyItem"
|
||||
import { Tab, Tabs, TabList, TabPanel } from "react-tabs";
|
||||
|
||||
export default function Index(props: any){
|
||||
if(props.dailys == undefined) {
|
||||
return <div id="classDisplay">No Dailies Present</div>
|
||||
}
|
||||
else {
|
||||
const incompleteDailies = props.dailys.map((daily: any) => {
|
||||
if(!daily.completed)
|
||||
return <DailyItem key={daily.id} id={daily.id}daily_text={daily.text} onChange={props.onChange} completed={daily.completed}/>
|
||||
})
|
||||
const completedDailies = props.dailys.map((daily: any) => {
|
||||
if(daily.completed)
|
||||
return <DailyItem key={daily.id} id={daily.id}daily_text={daily.text} onChange={props.onChange} completed={daily.completed}/>
|
||||
})
|
||||
const display = <div id="classDisplay">
|
||||
<Tabs>
|
||||
<TabList>
|
||||
<Tab>Active</Tab>
|
||||
<Tab>Completed</Tab>
|
||||
</TabList>
|
||||
<TabPanel>
|
||||
<ul>{incompleteDailies}</ul>
|
||||
</TabPanel>
|
||||
<TabPanel>
|
||||
<ul>{completedDailies}</ul>
|
||||
</TabPanel>
|
||||
</Tabs>
|
||||
</div>
|
||||
return(display);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
18
src/view/Components/Taskview/Habitsview/HabitItem.tsx
Normal file
18
src/view/Components/Taskview/Habitsview/HabitItem.tsx
Normal file
|
|
@ -0,0 +1,18 @@
|
|||
import * as React from "react";
|
||||
|
||||
function HabitItem(props: any) {
|
||||
console.log("plus"+props.id)
|
||||
return (
|
||||
<div className="habit-item" id={props.id}>
|
||||
<button className="habit-plus" id={"plus"+props.id} onClick={props.onChange}>
|
||||
+{props.upCount}
|
||||
</button>
|
||||
<p>{props.habit_text}</p>
|
||||
<button className="habit-minus" id={"mins"+props.id} onClick={props.onChange}>
|
||||
-{props.downCount}
|
||||
</button>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default HabitItem
|
||||
22
src/view/Components/Taskview/Habitsview/index.tsx
Normal file
22
src/view/Components/Taskview/Habitsview/index.tsx
Normal file
|
|
@ -0,0 +1,22 @@
|
|||
import * as React from "react";
|
||||
import HabitItem from "./HabitItem"
|
||||
|
||||
export default function Index(props: any){
|
||||
if(props.habits == undefined) {
|
||||
return (<div id="classDisplay">
|
||||
No habits present.
|
||||
</div>)
|
||||
}
|
||||
else {
|
||||
console.log("habits = " + props.habits);
|
||||
const allHabits = props.habits.map((habit: any) => {
|
||||
return <HabitItem key={habit.id} id={habit.id} habit_text={habit.text} upCount={habit.counterUp} downCount={habit.counterDown} onChange={props.onChange}/>
|
||||
})
|
||||
const display = <div id="classDisplay">
|
||||
<ul>{allHabits}</ul>
|
||||
</div>
|
||||
|
||||
return(display);
|
||||
}
|
||||
}
|
||||
|
||||
36
src/view/Components/Taskview/Todoview/index.tsx
Normal file
36
src/view/Components/Taskview/Todoview/index.tsx
Normal file
|
|
@ -0,0 +1,36 @@
|
|||
import * as React from "react";
|
||||
import TodoItem from "./TodoItem"
|
||||
import { Tab, Tabs, TabList, TabPanel } from "react-tabs";
|
||||
|
||||
export default function Index(props: any){
|
||||
if(props.todos == undefined) {
|
||||
return <div id="classDisplay">No Todos present.</div>
|
||||
}
|
||||
else {
|
||||
const incompleteTodos = props.todos.map((todo: any) => {
|
||||
if(!todo.completed)
|
||||
return <TodoItem key={todo.id} id={todo.id} todo_text={todo.text} onChange={props.onChange} completed={todo.completed}/>
|
||||
})
|
||||
const completedTodos = props.todos.map((todo: any) => {
|
||||
if(todo.completed)
|
||||
return <TodoItem key={todo.id} id={todo.id} todo_text={todo.text} onChange={props.onChange} completed={todo.completed}/>
|
||||
})
|
||||
const display = <div id="classDisplay">
|
||||
<Tabs>
|
||||
<TabList>
|
||||
<Tab>Active</Tab>
|
||||
<Tab>Completed</Tab>
|
||||
</TabList>
|
||||
<TabPanel>
|
||||
<ul>{incompleteTodos}</ul>
|
||||
</TabPanel>
|
||||
<TabPanel>
|
||||
<ul>{completedTodos}</ul>
|
||||
</TabPanel>
|
||||
</Tabs>
|
||||
</div>
|
||||
|
||||
|
||||
return(display);
|
||||
}
|
||||
}
|
||||
|
|
@ -1,9 +1,7 @@
|
|||
import * as React from "react";
|
||||
import TodoItem from "./TodoItem"
|
||||
import Taskview from "../Taskview"
|
||||
import Dailiesview from "../Dailiesview"
|
||||
import Habitsview from "../Habitsview"
|
||||
import Todoview from "../Todoview"
|
||||
import Dailiesview from "./Dailiesview"
|
||||
import Habitsview from "./Habitsview"
|
||||
import Todoview from "./Todoview"
|
||||
import { Tab, Tabs, TabList, TabPanel } from "react-tabs";
|
||||
|
||||
export default function Index(props: any){
|
||||
|
|
@ -21,16 +19,16 @@ export default function Index(props: any){
|
|||
</Tab>
|
||||
</TabList>
|
||||
<TabPanel>
|
||||
<Habitsview habits={props.state.habits} onChange={props.handleChange} />
|
||||
<Habitsview habits={props.data.habits} onChange={props.handleChangeHabits}/>
|
||||
</TabPanel>
|
||||
<TabPanel>
|
||||
<Dailiesview dailys={props.state.dailys} onChange={props.handleChange} />
|
||||
<Dailiesview dailys={props.data.dailys} onChange={props.handleChangeDailys} />
|
||||
</TabPanel>
|
||||
<TabPanel>
|
||||
<Todoview todos={props.state.todos} onChange={props.handleChange} />
|
||||
<Todoview todos={props.data.todos} onChange={props.handleChangeTodos} />
|
||||
</TabPanel>
|
||||
</Tabs>
|
||||
</div>
|
||||
return(display);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,31 +0,0 @@
|
|||
import * as React from "react";
|
||||
import TodoItem from "./TodoItem"
|
||||
import { Tab, Tabs, TabList, TabPanel } from "react-tabs";
|
||||
|
||||
export default function Index(props: any){
|
||||
const incompleteTodos = props.todos.map((todo: any) => {
|
||||
if(!todo.completed)
|
||||
return <TodoItem key={todo.id} id={todo.id} todo_text={todo.text} onChange={props.onChange} completed={todo.completed}/>
|
||||
})
|
||||
const completedTodos = props.todos.map((todo: any) => {
|
||||
if(todo.completed)
|
||||
return <TodoItem key={todo.id} id={todo.id} todo_text={todo.text} onChange={props.onChange} completed={todo.completed}/>
|
||||
})
|
||||
const display = <div id="classDisplay">
|
||||
<Tabs>
|
||||
<TabList>
|
||||
<Tab>Active</Tab>
|
||||
<Tab>Completed</Tab>
|
||||
</TabList>
|
||||
<TabPanel>
|
||||
<ul>{incompleteTodos}</ul>
|
||||
</TabPanel>
|
||||
<TabPanel>
|
||||
<ul>{completedTodos}</ul>
|
||||
</TabPanel>
|
||||
</Tabs>
|
||||
</div>
|
||||
|
||||
|
||||
return(display);
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue