From 0416a4de8c4c0e0ba836b919f16b024db3db1128 Mon Sep 17 00:00:00 2001
From: kkzzhizhou <806508401@qq.com>
Date: Thu, 25 Nov 2021 16:49:05 +0800
Subject: [PATCH] new feature: add task(daily,hatit,todo,reward)

---
 src/view/App.tsx                              | 131 ++++++++++--------
 src/view/Components/Taskview/AddTask.tsx      |  31 -----
 .../Taskview/Dailiesview/DailyItem.tsx        |   1 +
 .../Components/Taskview/Dailiesview/index.tsx |  61 ++++----
 .../Components/Taskview/Habitsview/index.tsx  |   9 +-
 .../Components/Taskview/Rewardview/index.tsx  |   9 +-
 .../Components/Taskview/Todoview/index.tsx    |  13 +-
 src/view/Components/Taskview/Todoview/tabs.ts |   1 -
 src/view/Components/Taskview/index.tsx        |   1 -
 src/view/habiticaAPI.ts                       |   2 +-
 10 files changed, 130 insertions(+), 129 deletions(-)
 delete mode 100644 src/view/Components/Taskview/AddTask.tsx
 delete mode 100644 src/view/Components/Taskview/Todoview/tabs.ts

diff --git a/src/view/App.tsx b/src/view/App.tsx
index 5fde03a..1e97d80 100644
--- a/src/view/App.tsx
+++ b/src/view/App.tsx
@@ -40,6 +40,7 @@ class App extends React.Component<any, any> {
             todos: [],
             dailys: [],
             habits: [],
+            input_task: "",
         }
         this.handleChangeTodos = this.handleChangeTodos.bind(this);
         this.handleChangeDailys = this.handleChangeDailys.bind(this);
@@ -59,7 +60,7 @@ class App extends React.Component<any, any> {
             );
         }
         else {
-            return null
+            return <div className="cron"></div>
         };
     }
     async runCron() {
@@ -132,7 +133,7 @@ class App extends React.Component<any, any> {
         }
     }
 
-    async sendDaily(type: string, title: string, message: string) {
+    async sendAddTask(type: string, title: string, message: string) {
         try {
             let response = await addTask(this.username, this.credentials, title, type);
             let result = await response.json();
@@ -163,87 +164,100 @@ class App extends React.Component<any, any> {
         } catch (e) {
             console.log(e);
             new Notice("API Error: Please check credentials")
-        }        
+        }
     }
 
     handleChangeTodos(event: any) {
-        this.state.tasks.todos.forEach((element: any) => {
-            if (element.id == event.target.id) {
-                if ( event.type == "click" ) {
-                    console.log(event)
-                    if ( event.target.innerText == 'clear' ) {
-                        this.sendDeleteTask(event.target.id, "Deleted!")
-                    }
-                } else {
-                    if (!element.completed) {
-                        this.sendScore(event.target.id, "up", "Checked!")
+        if (event.target.id == "add-todo") {
+            const title = event.target.name
+            this.sendAddTask("todo", title, "Add!")
+        } else {
+            this.state.tasks.todos.forEach((element: any) => {
+                if (element.id == event.target.id) {
+                    if (event.type == "click") {
+                        console.log(event)
+                        if (event.target.innerText == 'clear') {
+                            this.sendDeleteTask(event.target.id, "Deleted!")
+                        }
                     } else {
-                        this.sendScore(event.target.id, "down", "Un-Checked!")
+                        if (!element.completed) {
+                            this.sendScore(event.target.id, "up", "Checked!")
+                        } else {
+                            this.sendScore(event.target.id, "down", "Un-Checked!")
+                        }
                     }
                 }
-            }
-        })
-        
+            })
+        }
     }
 
 
     handleChangeDailys(event: any) {
-        this.state.tasks.dailys.forEach((element: any) => {
-            if (element.id == event.target.id) {
+        if (event.target.id == "add-daily") {
+            const title = event.target.name
+            this.sendAddTask("daily", title, "Add!")
+        } else {
+            this.state.tasks.dailys.forEach((element: any) => {
                 if (element.id == event.target.id) {
-                    if (!element.completed && event.target.innerText != 'clear') {
-                        this.sendScore(event.target.id, "up", "Checked!")
-                    }
-                    else if (event.target.innerText == 'clear'){
-                        this.sendDeleteTask(event.target.id, "Deleted!")
-                    } else {
-                        this.sendScore(event.target.id, "down", "Un-Checked!")
+                    if (element.id == event.target.id) {
+                        if (!element.completed && event.target.innerText != 'clear') {
+                            this.sendScore(event.target.id, "up", "Checked!")
+                        }
+                        else if (event.target.innerText == 'clear') {
+                            this.sendDeleteTask(event.target.id, "Deleted!")
+                        } else {
+                            this.sendScore(event.target.id, "down", "Un-Checked!")
+                        }
                     }
                 }
-            }
-        })
+            })
+        }
     }
 
-
-
     handleChangeHabits(event: any) {
-        if ( event.type == "click" ) {
-            if ( event.target.innerText == 'clear' ) {
-                this.sendDeleteTask(event.target.id, "Deleted!")
-            }
+        if (event.target.id == "add-habit") {
+            const title = event.target.name
+            this.sendAddTask("habit", title, "Add!")
         } else {
-            const target_id = event.target.id.slice(4)
-            if (event.target.id.slice(0, 4) == "plus") {
-                this.state.tasks.habits.forEach((element: any) => {
-                    if (element.id == target_id) {
-                        this.sendScore(target_id, "up", "Plus!")
-                    }
-                })
-            }
-            else {
-                this.state.tasks.habits.forEach((element: any) => {
-                    if (element.id == target_id) {
-                        this.sendScore(target_id, "down", "Minus :(")
-                    }
-                })
+            if (event.target.innerText == 'clear') {
+                this.sendDeleteTask(event.target.id, "Deleted!")
+            } else {
+                const target_id = event.target.id.slice(4)
+                if (event.target.id.slice(0, 4) == "plus") {
+                    this.state.tasks.habits.forEach((element: any) => {
+                        if (element.id == target_id) {
+                            this.sendScore(target_id, "up", "Plus!")
+                        }
+                    })
+                }
+                else {
+                    this.state.tasks.habits.forEach((element: any) => {
+                        if (element.id == target_id) {
+                            this.sendScore(target_id, "down", "Minus :(")
+                        }
+                    })
+                }
             }
         }
     }
+
     handleChangeRewards(event: any) {
-        const target_id = event.target.id
-        this.state.tasks.rewards.forEach((element: any) => {
-            if (element.id == event.target.id) {
-                if ( event.type == "click" ) {
-                    if ( event.target.innerText == 'clear' ) {
+        if (event.target.id == "add-reward") {
+            const title = event.target.name
+            this.sendAddTask("reward", title, "Add!")
+        } else {
+            const target_id = event.target.id
+            this.state.tasks.rewards.forEach((element: any) => {
+                if (element.id == target_id) {
+                    if (event.target.innerText == 'clear') {
                         this.sendDeleteTask(event.target.id, "Deleted!")
                     }
-                } else {
-                    if (element.id == target_id) {
+                    else {
                         this.sendReward(target_id, "down", "Cost!")
                     }
-               }
-            }
-        })
+                }
+            })
+        }
     }
     render() {
         let content = this.CheckCron(this.state.user_data.lastCron);
@@ -256,7 +270,6 @@ class App extends React.Component<any, any> {
                 <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
                 <Taskview data={this.state.tasks} handleChangeTodos={this.handleChangeTodos} handleChangeDailys={this.handleChangeDailys} handleChangeHabits={this.handleChangeHabits} handleChangeRewards={this.handleChangeRewards} />
                 {content}
-                <div></div>
                 <Statsview user_data={this.state.user_data} />
             </div>
             );
diff --git a/src/view/Components/Taskview/AddTask.tsx b/src/view/Components/Taskview/AddTask.tsx
deleted file mode 100644
index 338a343..0000000
--- a/src/view/Components/Taskview/AddTask.tsx
+++ /dev/null
@@ -1,31 +0,0 @@
-import * as React from "react";
-import { useForm } from "react-hook-form";
-import { Trans } from 'react-i18next';
-
-type FormData = {
-  title: string;
-};
-
-export default function Index(props: any) {
-  console.log(props)
-  const { register, setValue, handleSubmit, formState: { errors } } = useForm<FormData>();
-  const onSubmit = handleSubmit(data => {
-    const url = "https://habitica.com/api/v4/tasks/user"
-    const response = fetch(url, {
-      method: 'POST',
-      headers: {
-        "Content-Type": "application/json",
-        "x-client": "278e719e-5f9c-43b1-9dba-8b73343dc062-HabiticaSync",
-        "x-api-user": this.app.plugins.plugins["obsidian-habitica-integration"].settings.userID,
-        "x-api-key": this.app.plugins.plugins["obsidian-habitica-integration"].settings.apiToken,
-      },
-      body: JSON.stringify({ type: props.type, text: data.title })
-    })
-  })
-  return (
-    <form className="add-task-input" onSubmit={onSubmit}>
-      <input type="text" defaultValue="" {...register("title")}></input>
-      <button className="submit-button" type="submit" ><Trans>submit</Trans></button>
-    </form>
-  );
-}
\ No newline at end of file
diff --git a/src/view/Components/Taskview/Dailiesview/DailyItem.tsx b/src/view/Components/Taskview/Dailiesview/DailyItem.tsx
index 98d8340..f15b068 100644
--- a/src/view/Components/Taskview/Dailiesview/DailyItem.tsx
+++ b/src/view/Components/Taskview/Dailiesview/DailyItem.tsx
@@ -11,6 +11,7 @@ function DailyItem(props: any) {
                     <p><Emoji text={props.daily_text}></Emoji></p>
                     <ReactMarkdown children={props.daily_notes} />
                 </div>
+                
                 <button className="task-operation" >
                     <span className="material-icons md-24" id={props.id} onClick={props.onChange}>create</span>
                 </button>
diff --git a/src/view/Components/Taskview/Dailiesview/index.tsx b/src/view/Components/Taskview/Dailiesview/index.tsx
index 3d707b9..b0f1866 100644
--- a/src/view/Components/Taskview/Dailiesview/index.tsx
+++ b/src/view/Components/Taskview/Dailiesview/index.tsx
@@ -1,42 +1,49 @@
 import * as React from "react";
 import DailyItem from "./DailyItem"
 import { Tab, Tabs, TabList, TabPanel } from "react-tabs";
-import { useTranslation, Trans, Translation } from 'react-i18next';
-import { useForm, SubmitHandler } from "react-hook-form";
-import AddTask from "../AddTask";
+import { Trans } from 'react-i18next';
 
-export default function Index(props: any){
-    if(props.dailys == undefined) {
-        return <div id="classDisplay"><Trans>No Dailies Present</Trans></div>
+export default function Index(props: any) {
+    const [title, setTitle] = React.useState('')
+    if (props.dailys == undefined) {
+        return <div id="classDisplay">
+            <input type="text" placeholder="添加每日任务" onChange={event => setTitle(event.target.value)} />
+            <button className="submit-button" id="add-daily" onClick={props.onChange} name={title}><Trans>submit</Trans></button>
+            <Trans>No Dailies Present</Trans>
+            </div>
     }
     else {
         const incompleteDailies = props.dailys.map((daily: any) => {
-                if(!daily.completed)
-                    return <DailyItem key={daily.id} id={daily.id} daily_text={daily.text} daily_notes={daily.notes} onChange={props.onChange} completed={daily.completed}/>
+            if (!daily.completed)
+                return (
+                    <DailyItem key={daily.id} id={daily.id} daily_text={daily.text} daily_notes={daily.notes} 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} daily_notes={daily.notes} onChange={props.onChange} completed={daily.completed}/>
+            if (daily.completed)
+                return <DailyItem key={daily.id} id={daily.id} daily_text={daily.text} daily_notes={daily.notes} onChange={props.onChange} completed={daily.completed} />
         })
         
+
         const display = <div id="classDisplay">
-                            <Tabs>
-                            <TabList>
-                                <Tab><Trans>Active</Trans></Tab>
-                                <Tab><Trans>Completed</Trans></Tab>
-                            </TabList>
-                            <AddTask type="daily" onChange={props.onChange}></AddTask>
-                            <TabPanel>
-                                <ul>{incompleteDailies}</ul>
-                            </TabPanel>
-                            <TabPanel>
-                                <ul>{completedDailies}</ul>
-                            </TabPanel>
-                            </Tabs>
-                            
-                        </div>
-        return(display);
+            <Tabs>
+                <TabList>
+                    <Tab><Trans>Active</Trans></Tab>
+                    <Tab><Trans>Completed</Trans></Tab>
+                </TabList>
+                <TabPanel>
+                    <input type="text" placeholder="添加每日任务" onChange={event => setTitle(event.target.value)} />
+                    <button className="submit-button" id="add-daily" onClick={props.onChange} name={title}><Trans>submit</Trans></button>
+                    <ul>{incompleteDailies}</ul>
+                </TabPanel>
+                <TabPanel>
+                    <ul>{completedDailies}</ul>
+                </TabPanel>
+            </Tabs>
+
+        </div>
+        return (display);
     }
-        
+
 }
 
diff --git a/src/view/Components/Taskview/Habitsview/index.tsx b/src/view/Components/Taskview/Habitsview/index.tsx
index c71ee31..42ae42c 100644
--- a/src/view/Components/Taskview/Habitsview/index.tsx
+++ b/src/view/Components/Taskview/Habitsview/index.tsx
@@ -1,11 +1,13 @@
 import * as React from "react";
 import HabitItem from "./HabitItem"
 import { useTranslation, Trans, Translation } from 'react-i18next'
-import AddTask from "../AddTask";
 
 export default function Index(props: any){
+    const [title, setTitle] = React.useState('')
     if(props.habits == undefined) {
         return (<div id="classDisplay">
+                    <input type="text" placeholder="添加习惯" onChange={event => setTitle(event.target.value)} />
+                    <button className="submit-button" id="add-habit" onClick={props.onChange} name={title}><Trans>submit</Trans></button>
                     <Trans>No habits present.</Trans>
                 </div>)
     }
@@ -13,8 +15,11 @@ export default function Index(props: any){
         const allHabits = props.habits.map((habit: any) => {
             return <HabitItem key={habit.id} id={habit.id} habit_text={habit.text} habit_notes={habit.notes} upCount={habit.counterUp} downCount={habit.counterDown} onChange={props.onChange}/>
         })
+        
+
         const display = <div id="classDisplay">
-                        <AddTask type="habit"></AddTask>
+                            <input type="text" placeholder="添加习惯" onChange={event => setTitle(event.target.value)} />
+                            <button className="submit-button" id="add-habit" onClick={props.onChange} name={title}><Trans>submit</Trans></button>
                             <ul>{allHabits}</ul>
                         </div>
 
diff --git a/src/view/Components/Taskview/Rewardview/index.tsx b/src/view/Components/Taskview/Rewardview/index.tsx
index 409b5fa..182726e 100644
--- a/src/view/Components/Taskview/Rewardview/index.tsx
+++ b/src/view/Components/Taskview/Rewardview/index.tsx
@@ -1,11 +1,13 @@
 import * as React from "react";
 import RewardItem from "./RewardItem"
-import { useTranslation, Trans, Translation } from 'react-i18next'
-import AddTask from "../AddTask";
+import { Trans } from 'react-i18next'
 
 export default function Index(props: any){
+    const [title, setTitle] = React.useState('')
     if(props.rewards == undefined) {
         return (<div id="classDisplay">
+                    <input type="text" placeholder="添加奖励" onChange={event => setTitle(event.target.value)} />
+                    <button className="submit-button" id="add-reward" onClick={props.onChange} name={title}><Trans>submit</Trans></button>
                     <Trans>No Rewards present.</Trans>
                 </div>)
     }
@@ -14,7 +16,8 @@ export default function Index(props: any){
             return <RewardItem key={reward.id} id={reward.id} reward_text={reward.text} reward_notes={reward.notes} reward_value={reward.value} onChange={props.onChange}/>
         })
         const display = <div id="classDisplay">
-                        <AddTask type="reward"></AddTask>
+                            <input type="text" placeholder="添加奖励" onChange={event => setTitle(event.target.value)} />
+                            <button className="submit-button" id="add-reward" onClick={props.onChange} name={title}><Trans>submit</Trans></button>
                             <ul>{allRewards}</ul>
                         </div>
 
diff --git a/src/view/Components/Taskview/Todoview/index.tsx b/src/view/Components/Taskview/Todoview/index.tsx
index 08bb67b..2db970f 100644
--- a/src/view/Components/Taskview/Todoview/index.tsx
+++ b/src/view/Components/Taskview/Todoview/index.tsx
@@ -1,12 +1,16 @@
 import * as React from "react";
 import TodoItem from "./TodoItem"
 import { Tab, Tabs, TabList, TabPanel } from "react-tabs";
-import { useTranslation, Trans, Translation } from 'react-i18next'
-import AddTask from "../AddTask";
+import { Trans } from 'react-i18next'
 
 export default function Index(props: any){
+    const [title, setTitle] = React.useState('')
     if(props.todos == undefined) {
-        return <div id="classDisplay">No Todos present.</div>
+        return <div id="classDisplay">
+            <input type="text" placeholder="添加待办事项" onChange={event => setTitle(event.target.value)} />
+            <button className="submit-button" id="add-todo" onClick={props.onChange} name={title}><Trans>submit</Trans></button>
+            No Todos present.
+            </div>
     }
     else {
         const incompleteTodos = props.todos.map((todo: any) => {
@@ -23,8 +27,9 @@ export default function Index(props: any){
                                 <Tab><Trans>Active</Trans></Tab>
                                 <Tab><Trans>Completed</Trans></Tab>
                             </TabList>
-                            <AddTask type="todo"></AddTask>
                             <TabPanel>
+                                <input type="text" placeholder="添加待办事项" onChange={event => setTitle(event.target.value)} />
+                                <button className="submit-button" id="add-todo" onClick={props.onChange} name={title}><Trans>submit</Trans></button>
                                 <ul>{incompleteTodos}</ul>
                             </TabPanel>
                             <TabPanel>
diff --git a/src/view/Components/Taskview/Todoview/tabs.ts b/src/view/Components/Taskview/Todoview/tabs.ts
deleted file mode 100644
index 55153e7..0000000
--- a/src/view/Components/Taskview/Todoview/tabs.ts
+++ /dev/null
@@ -1 +0,0 @@
-import * as React from "react"
diff --git a/src/view/Components/Taskview/index.tsx b/src/view/Components/Taskview/index.tsx
index 45146cc..7185574 100644
--- a/src/view/Components/Taskview/index.tsx
+++ b/src/view/Components/Taskview/index.tsx
@@ -4,7 +4,6 @@ import Habitsview from "./Habitsview"
 import Todoview from "./Todoview"
 import Rewardview from "./Rewardview"
 import { Tab, Tabs, TabList, TabPanel } from "react-tabs";
-import { useTranslation, Trans, Translation } from 'react-i18next'
 
 export default function Index(props: any){
     const display = <div className="task-view">
diff --git a/src/view/habiticaAPI.ts b/src/view/habiticaAPI.ts
index 8cdce8e..c5da108 100644
--- a/src/view/habiticaAPI.ts
+++ b/src/view/habiticaAPI.ts
@@ -57,7 +57,7 @@ export async function costReward(username: string, credentials: string, taskID:
 
 
 export async function addTask(username: string, credentials: string, title: string, type: string) {
-    const url = "https://habitica.com/api/v4/tasks/user".concat(title)
+    const url = "https://habitica.com/api/v4/tasks/user"
     const response = fetch(url, {
         method: 'POST',
         headers: {