From e118c2861aac2d5257e6f0bd8f69f82d61fdc6f0 Mon Sep 17 00:00:00 2001
From: kkzzhizhou <806508401@qq.com>
Date: Sun, 5 Dec 2021 18:34:21 +0800
Subject: [PATCH] add multiline edit support

---
 src/i18n/zh-cn.json                                    |  1 +
 src/view/Components/Taskview/Dailiesview/DailyItem.tsx |  7 +++++--
 src/view/Components/Taskview/Habitsview/HabitItem.tsx  |  7 +++++--
 src/view/Components/Taskview/Rewardview/RewardItem.tsx |  9 +++++++--
 src/view/Components/Taskview/Todoview/TodoItem.tsx     | 10 ++++++----
 5 files changed, 24 insertions(+), 10 deletions(-)

diff --git a/src/i18n/zh-cn.json b/src/i18n/zh-cn.json
index 4906fc7..91dabe0 100644
--- a/src/i18n/zh-cn.json
+++ b/src/i18n/zh-cn.json
@@ -7,6 +7,7 @@
     "title": "标题",
     "notes": "备注",
     "type": "类型",
+    "cost": "花费",
     "Daily": "每日任务",
     "submit": "添加",
     "No Dailies Present": "目前每日任务为空",
diff --git a/src/view/Components/Taskview/Dailiesview/DailyItem.tsx b/src/view/Components/Taskview/Dailiesview/DailyItem.tsx
index 91498ae..81b44c3 100644
--- a/src/view/Components/Taskview/Dailiesview/DailyItem.tsx
+++ b/src/view/Components/Taskview/Dailiesview/DailyItem.tsx
@@ -1,5 +1,6 @@
 import * as React from "react";
 import ReactMarkdown from "react-markdown";
+import { Trans } from 'react-i18next'
 
 function DailyItem(props: any) {
     const [state, setState] = React.useState('view')
@@ -24,8 +25,10 @@ function DailyItem(props: any) {
     } else {
         return (
             <div className="edit-daily-item edit-item">
-                <input type="text" onChange={event => setTitle(event.target.value)} defaultValue={props.daily_text}></input>
-                <input type="text" onChange={event => setNotes(event.target.value)} defaultValue={props.daily_notes}></input>
+                <label><Trans>title</Trans>:</label>
+                <textarea onChange={event => setTitle(event.target.value)} defaultValue={props.daily_text}></textarea>
+                <label><Trans>notes</Trans>:</label>
+                <textarea onChange={event => setNotes(event.target.value)} defaultValue={props.daily_notes}></textarea>
                 <div className="edit-daily-button edit-button">
                     <button className="task-operation"><span className="material-icons md-24" id={props.id} onClick={function (e) { props.onChange(e); setState('view') }} title="submit" data-title={title} data-notes={notes}>check</span></button>
                     <button className="task-operation"><span className="material-icons md-24" id={props.id} onClick={() => setState('view')} title="cancel">clear</span></button>
diff --git a/src/view/Components/Taskview/Habitsview/HabitItem.tsx b/src/view/Components/Taskview/Habitsview/HabitItem.tsx
index 0cebbe5..ab70774 100644
--- a/src/view/Components/Taskview/Habitsview/HabitItem.tsx
+++ b/src/view/Components/Taskview/Habitsview/HabitItem.tsx
@@ -1,6 +1,7 @@
 import Emoji from "react-emoji-render";
 import * as React from "react";
 import ReactMarkdown from "react-markdown";
+import { Trans } from 'react-i18next'
 
 function HabitItem(props: any) {
     const [state, setState] = React.useState('view')
@@ -30,8 +31,10 @@ function HabitItem(props: any) {
     } else {
         return (
             <div className="edit-habit-item edit-item">
-                <input type="text" onChange={event => setTitle(event.target.value)} defaultValue={props.habit_text}></input>
-                <input type="text" onChange={event => setNotes(event.target.value)} defaultValue={props.habit_notes}></input>
+                <label><Trans>title</Trans>:</label>
+                <textarea onChange={event => setTitle(event.target.value)} defaultValue={props.habit_text}></textarea>
+                <label><Trans>notes</Trans>:</label>
+                <textarea onChange={event => setNotes(event.target.value)} defaultValue={props.habit_notes}></textarea>
                 <div className="edit-habit-button edit-button">
                     <button className="task-operation"><span className="material-icons md-24" id={props.id} onClick={function (e) { props.onChange(e); setState('view') }} title="submit" data-title={title} data-notes={notes}>check</span></button>
                     <button className="task-operation"><span className="material-icons md-24" id={props.id} onClick={() => setState('view')} title="cancel">clear</span></button>
diff --git a/src/view/Components/Taskview/Rewardview/RewardItem.tsx b/src/view/Components/Taskview/Rewardview/RewardItem.tsx
index 162a20f..403bd11 100644
--- a/src/view/Components/Taskview/Rewardview/RewardItem.tsx
+++ b/src/view/Components/Taskview/Rewardview/RewardItem.tsx
@@ -1,6 +1,8 @@
 import Emoji from "react-emoji-render";
 import * as React from "react";
 import ReactMarkdown from "react-markdown";
+import { Trans } from 'react-i18next'
+
 function RewardItem(props: any) {
     const [state, setState] = React.useState('view')
     const [title, setTitle] = React.useState('')
@@ -25,8 +27,11 @@ function RewardItem(props: any) {
     } else {
         return (
             <div className="edit-reward-item edit-item">
-                <input type="text" onChange={event => setTitle(event.target.value)} defaultValue={props.reward_text}></input>
-                <input type="text" onChange={event => setNotes(event.target.value)} defaultValue={props.reward_notes}></input>
+                <label><Trans>title</Trans>:</label>
+                <textarea onChange={event => setTitle(event.target.value)} defaultValue={props.reward_text}></textarea>
+                <label><Trans>notes</Trans>:</label>
+                <textarea onChange={event => setNotes(event.target.value)} defaultValue={props.reward_notes}></textarea>
+                <label><Trans>cost</Trans>:</label>
                 <input type="text" onChange={event => setCoin(event.target.value)} defaultValue={props.reward_value}></input>
                 <div className="edit-reward-button edit-button">
                     <button className="task-operation"  ><span className="material-icons md-24" id={props.id} onClick={function (e) { props.onChange(e); setState('view') }} title="submit" data-title={title} data-notes={notes} data-coin={coin}>check</span></button>
diff --git a/src/view/Components/Taskview/Todoview/TodoItem.tsx b/src/view/Components/Taskview/Todoview/TodoItem.tsx
index db7cdb7..d7ca8e3 100644
--- a/src/view/Components/Taskview/Todoview/TodoItem.tsx
+++ b/src/view/Components/Taskview/Todoview/TodoItem.tsx
@@ -1,6 +1,6 @@
-import Emoji from "react-emoji-render";
 import * as React from "react";
 import ReactMarkdown from "react-markdown";
+import { Trans } from 'react-i18next'
 
 function TodoItem(props: any) {
     const [state, setState] = React.useState('view')
@@ -11,7 +11,7 @@ function TodoItem(props: any) {
             <div className="todo-item" id={props.id}>
                 <input type="checkbox" className="checkbox" id={props.id} onChange={props.onChange} checked={props.completed} />
                 <div className="todo-content">
-                    <p><Emoji text={props.todo_text}></Emoji></p>
+                    <ReactMarkdown children={props.todo_text} />
                     <ReactMarkdown children={props.todo_notes} />
                 </div>
                 <button className="task-operation" >
@@ -25,8 +25,10 @@ function TodoItem(props: any) {
     } else {
         return (
             <div className="edit-todo-item edit-item">
-                <input type="text" onChange={event => setTitle(event.target.value)} defaultValue={props.todo_text}></input>
-                <input type="text" onChange={event => setNotes(event.target.value)} defaultValue={props.todo_notes}></input>
+                <label><Trans>title</Trans>:</label>
+                <textarea onChange={event => setTitle(event.target.value)} defaultValue={props.todo_text}></textarea>
+                <label><Trans>notes</Trans>:</label>
+                <textarea onChange={event => setNotes(event.target.value)} defaultValue={props.todo_notes}></textarea>
                 <div className="edit-todo-button edit-button">
                     <button className="task-operation"><span className="material-icons md-24" id={props.id} onClick={function (e) { props.onChange(e); setState('view') }} title="submit" data-title={title} data-notes={notes}>check</span></button>
                     <button className="task-operation"><span className="material-icons md-24" id={props.id} onClick={() => setState('view')} title="cancel">clear</span></button>