// 是否顯示添加頁面
@State displayAddPage: boolean = false
// 任務(wù)列表
@State @Watch('saveTaskList') taskList: Array<TaskModel> = []
// 總?cè)蝿?wù)數(shù)量
@State totalTask: number = 0
// 己完成任務(wù)數(shù)量
@State finishTask: number = 0

// 是否顯示添加頁面
@State displayAddPage: boolean = false
build() {
    if (this.displayAddPage) {
      AddPage({
        displayAddPage: $displayAddPage,
        taskList: $taskList,
        totalTask: $totalTask,
        finishTask: $finishTask
      })
    } else {
      ListPage({
        displayAddPage: $displayAddPage,
        taskList: $taskList,
        totalTask: $totalTask,
        finishTask: $finishTask
      })
    }
  }

// 任務(wù)列表
@State @Watch('saveTaskList') taskList: Array<TaskModel> = []
saveTaskList() {
    TaskHelper.saveTaskList(this.taskList)
}
aboutToAppear() {
    this.taskList = TaskHelper.readTaskList()
}

// 是否顯示添加任務(wù)頁面
@Link displayAddPage: boolean
// 用戶輸入的任務(wù)內(nèi)容
@State taskContent: string = ''
// 任務(wù)列表
@Link taskList: [TaskModel]
//總?cè)蝿?wù)數(shù)量
@Link totalTask: number
//已完成任務(wù)數(shù)量
@Link finishTask: number

build() {
  Column({ space: 20 }) {
    Stack() {
      // 返回按鈕
      Column() {
        Image($r('app.media.ic_public_back'))
          .width(30)
          .fillColor(Color.Black)
          .onClick(() => {
            this.displayAddPage = false;
          })
      }
      .width('100%')
      .alignItems(HorizontalAlign.Start)
      // 標(biāo)題
      Text($r('app.string.Add_task'))
        .fontSize(20)
        .fontWeight(FontWeight.Bold)
    }
    //用戶自定義任務(wù)名
    TextArea({ text: this.taskContent, placeholder: $r('app.string.enter_task_content') })
      .backgroundColor(Color.White)
      .width(315)
      .height(201)
      .borderRadius(9)
      .borderColor(Color.Gray)
      .onChange((value) => {
        this.taskContent = value;
      })
    //提交按鈕
    Button({
      stateEffect: true,
      type: ButtonType.Normal
    }) {
      Text($r('app.string.submit'))
        .fontColor(Color.White)
    }
    .width(315)
    .height(50)
    .borderRadius(5)
    .borderColor($r('app.color.button_background'))
    // 當(dāng)輸入框內(nèi)容發(fā)生變化時(shí)觸發(fā)該函數(shù)
    .onClick(() => {
      // 判斷輸入框內(nèi)容是否為空
      if (this.taskContent.length === 0) {
        try {
          // 顯示提示信息
          promptAction.showToast({
            message: $r('app.string.not_empty'),
            duration: 2000,
          })
        } catch (error) {
          console.error(`showToast args error code is ${error.code}, message is ${error.message}`);
        }
        return
      }
      // 獲取當(dāng)前時(shí)間
      systemDateTime.getCurrentTime(true).then((currentTime) => {
        // 創(chuàng)建一個(gè)新的任務(wù)模型
        let task = new TaskModel({
          // 任務(wù)ID為當(dāng)前時(shí)間
          taskId: currentTime,
          // 任務(wù)內(nèi)容為輸入框內(nèi)容
          taskContent: this.taskContent,
          // 任務(wù)狀態(tài)初始化為未完成
          isCompleted: false
        })
        // 將新任務(wù)添加到任務(wù)列表中
        this.taskList.push(task)
        // 更新任務(wù)總數(shù)量
        this.totalTask = this.taskList.length
        // 隱藏添加任務(wù)頁面
        this.displayAddPage = false
      })
    })
  }
  .width('100%')
  .height('100%')
  .backgroundColor($r('app.color.background'))
  .padding({ top: 30, left: 20, right: 20, bottom: 20 })
}

//顯示添加頁面的布爾值
@Link displayAddPage: boolean
//任務(wù)列表
@Link taskList: Array<TaskModel>
//任務(wù)類型 默認(rèn)為全部
@State taskType: string = 'all'
//總?cè)蝿?wù)數(shù)量
@Link totalTask: number
//己完成任務(wù)數(shù)量
@Link finishTask: number

//刪除彈窗提示函數(shù)
deleteTask(taskId: number) {
  // 彈出提示框
  AlertDialog.show({
    title: $r('app.string.delete'),
    message: $r('app.string.sure_delete'),
    autoCancel: true,
    alignment: DialogAlignment.Bottom,
    // 偏移量
    offset: { dx: 0, dy: -20 },
    // 主要按鈕
    primaryButton: {
      value: $r('app.string.no'),
      action: () => {
      }
    },
    // 次要按鈕
    secondaryButton: {
      value: $r('app.string.yes'),
      action: () => {
        // 根據(jù)任務(wù)id獲取任務(wù)索引
        let taskIndex = TaskHelper.getIndexByTaskId(this.taskList, taskId)
        // 從任務(wù)列表中刪除任務(wù)
        this.taskList.splice(taskIndex, 1)
        this.handleTaskChange()
      }
    }
  })
}

@Builder
deleteButton(taskId: number) {
  //刪除按鈕
  Button() {
    Image($r('app.media.ic_public_delete_filled'))
      .fillColor(Color.White)
      .width(20)
  }
  .width(40)
  .height(40)
  .type(ButtonType.Circle)
  .backgroundColor(Color.Red)
  .margin(5)
  .onClick(() => {
    this.deleteTask(taskId)
  })
}

//獲取任務(wù)列表
getTaskList(): Array<TaskModel> {
  // 如果任務(wù)類型為all，則返回任務(wù)列表
  if (this.taskType == 'all') {
    return this.taskList
    // 如果任務(wù)類型為todo，則返回未完成的任務(wù)列表
  } else if (this.taskType == 'todo') {
    return this.taskList.filter((item) => {
      // 如果任務(wù)未完成，則返回true
      if (!item.isCompleted) {
        return true
      }
    })
    // 如果任務(wù)類型為finish，則返回已完成的任務(wù)列表
  } else if (this.taskType == 'finish') {
    return this.taskList.filter((item) => {
      // 如果任務(wù)已完成，則返回true
      if (item.isCompleted) {
        return true
      }
    })
  }
}

//標(biāo)題
Text($r('app.string.my_task'))
	.fontSize(20)
	.fontWeight(FontWeight.Bold)
//三個(gè)按鈕可選項(xiàng)
Row() {
  Column() {
   Text($r('app.string.all'))
    // 單選框，組為taskType
    Radio({ value: 'all', group: 'taskType' })
      .onChange((isSelect) => {
         if (isSelect) {
           // 任務(wù)類型設(shè)置為all
           this.taskType = 'all'
         }
       })// 設(shè)置是否被選中
       .checked(this.taskType == 'all' ? true : false)
      }
    Column() {
      Text($r('app.string.todo'))
      Radio({ value: 'todo', group: 'taskType' })
        .onChange((isSelect) => {
          if (isSelect) {
            this.taskType = 'todo'
          }
        })
        .checked(this.taskType == 'todo' ? true : false)
    }

    Column() {
      Text($r('app.string.finish'))
      Radio({ value: 'finish', group: 'taskType' })
        .onChange((isSelect) => {
          if (isSelect) {
            this.taskType = 'finish'
          }
        })
        .checked(this.taskType == 'finish' ? true : false)
    }
  }
  .width('100%')
  .justifyContent(FlexAlign.SpaceAround)

// 任務(wù)進(jìn)度卡片
Row() {
  Text('任務(wù)進(jìn)度:')
    .fontSize(24)
    .fontWeight(FontWeight.Bold)

  Stack() {
    Progress({
      value: this.finishTask,
      total: this.totalTask,
      type: ProgressType.Ring
    })
      .width(70)

    Row() {
      Text(this.finishTask.toString())
        .fontSize(18)
        .fontColor($r('app.color.button_background'))
      Text('/ ' + this.totalTask.toString())
        .fontSize(18)
    }
  }

}
.card()
.margin({ top: 10 })
.justifyContent(FlexAlign.SpaceEvenly)

//顯示任務(wù)(可滑動)
Column({ space: 10 }) {
List({ space: 10 }) {
  ForEach(
    this.getTaskList(),
    (item: TaskModel, index) => {
      ListItem() {
	Row() {
	  //完成待辦后的樣式
	  Text(item.taskContent)// 設(shè)置左邊距
	    .margin({ left: 10 })// 根據(jù)任務(wù)是否完成，設(shè)置文本的樣式
	    .decoration({
	      type: item.isCompleted ? TextDecorationType.LineThrough : TextDecorationType.None
	    })// 設(shè)置寬度
	    .width('70%')// 設(shè)置行數(shù)
	    .maxLines(1)// 設(shè)置文本溢出時(shí)的樣式
	    .textOverflow({ overflow: TextOverflow.Ellipsis })

	  // 添加一個(gè)空行
	  Blank()

	  // 創(chuàng)建復(fù)選框
	  Checkbox()// 設(shè)置復(fù)選框的值
	    .select(item.isCompleted)// 當(dāng)復(fù)選框的值發(fā)生變化時(shí)，執(zhí)行回調(diào)函數(shù)
	    .onChange((value) => {
	      // 獲取任務(wù)id在任務(wù)列表中的索引
	      let taskIndex = TaskHelper.getIndexByTaskId(this.taskList, item.taskId)
	      // 獲取任務(wù)列表中對應(yīng)任務(wù)id的任務(wù)
	      let oldTask = this.taskList[taskIndex]
	      // 創(chuàng)建新的任務(wù)模型
	      let newTask = new TaskModel({
		taskId: item.taskId,
		taskContent: oldTask.taskContent,
		isCompleted: value
	      })
	      // 將新的任務(wù)模型替換任務(wù)列表中對應(yīng)任務(wù)id的任務(wù)
	      this.taskList[taskIndex] = newTask

	      // 更新任務(wù)狀態(tài)
	      item.isCompleted = value
	      // 更新任務(wù)數(shù)量
	      this.handleTaskChange()
	    })
	}
	.card()
	.justifyContent(FlexAlign.SpaceBetween)
      }
      // @ts-ignore
      .swipeAction({ end: this.deleteButton(item.taskId) })
    }
  )
}
.width('100%')
.height('53%')
.alignListItem(ListItemAlign.Center)
}
.margin({ top: 5, bottom: 5 })

//新增任務(wù)按鈕
Column() {
Button({
  // 設(shè)置按鈕類型
  type: ButtonType.Circle,
  // 設(shè)置按鈕狀態(tài)
  stateEffect: true
}) {
  Text('+')
    .fontSize(50)
    .fontColor(Color.White)
}
.width(60)
.height(60)
.borderColor($r('app.color.button_background'))
.onClick(() => {
  // 顯示添加頁面
  this.displayAddPage = true
  this.handleTaskChange()
})
}
.width('100%')
.alignItems(HorizontalAlign.End)

export class TaskModel {
  // 任務(wù)id
  taskId: number = 0
  // 任務(wù)內(nèi)容
  taskContent: string = ''
  // 任務(wù)是否完成
  isCompleted: boolean = false

  constructor({ taskId:taskId, taskContent:taskContent, isCompleted:isCompleted}) {
    this.taskId = taskId
    this.taskContent = taskContent
    this.isCompleted = isCompleted
  }
}

// 保存Json數(shù)據(jù)
static saveJsonData(jsonObj: any, fileName: string) {
    // 獲取應(yīng)用文件路徑
    let context = getContext(this) as common.UIAbilityContext
    let filesDir = context.filesDir // 獲取應(yīng)用的文件夾路徑
    let filePath = `${filesDir}/${fileName}` // 將文件名與文件夾路徑連接起來，得到完整的文件路徑
    // 新建并打開文件
    // 嘗試打開文件
    try {
        // 以寫入模式打開文件，并設(shè)置為只讀、清空內(nèi)容、創(chuàng)建模式
        let file = fs.openSync(filePath, fs.OpenMode.WRITE_ONLY | fs.OpenMode.TRUNC | fs.OpenMode.CREATE)
        // 將 JSON 對象轉(zhuǎn)換為字符串
        let jsonStr = JSON.stringify(jsonObj)
        // 輸出 JSON 字符串
        console.log("HMOS:" + jsonStr)
        // 將 JSON 字符串寫入文件
        fs.writeSync(file.fd, jsonStr)
        // 關(guān)閉文件
        fs.closeSync(file)
    } catch (e) {
        // 輸出文件寫入錯(cuò)誤信息
        console.log(`write file error ${e}`);
    }
}

// 讀取Json數(shù)據(jù)
static readJsonData(fileName: string): any {
    // 獲取應(yīng)用文件路徑
    let context = getContext(this) as common.UIAbilityContext
    let filesDir = context.filesDir // 獲取應(yīng)用的文件夾路徑
    let filePath = `${filesDir}/${fileName}` // 將文件名與文件夾路徑連接起來，得到完整的文件路徑
    var userStr = ""
    try {
        // 從文件路徑中讀取內(nèi)容并將其存儲在userStr變量中
        userStr = fs.readTextSync(filePath)
    } catch (e) {
        console.log(`read file error ${e}`);
    }
    if (userStr.length > 0) {
        console.log(userStr); // 輸出userStr
        return JSON.parse(userStr); // 將userStr解析為JSON對象并返回
    }
    return {}
}

// 按任務(wù)id獲取索引
static getIndexByTaskId(taskList: Array<TaskModel>, taskId: number) {
    // 遍歷任務(wù)列表
    for (let i = 0; i < taskList.length; i++) {
        // 如果任務(wù)id相等
        if (taskList[i].taskId == taskId) {
            // 返回索引
            return i
        }
    }
    // 如果沒有找到，返回-1
    return -1
}

// 保存任務(wù)列表
static saveTaskList(taskList: Array<TaskModel>) {
    // 使用FileHelper類的saveJsonData方法，將任務(wù)列表數(shù)據(jù)保存到task.data文件中
    FileHelper.saveJsonData(taskList, 'task.data')
}

// 讀取任務(wù)列表
static readTaskList(): Array<TaskModel> {
    // 讀取任務(wù)數(shù)據(jù)
    let jsonData = FileHelper.readJsonData('task.data')
    // 創(chuàng)建任務(wù)列表
    let taskList: Array<TaskModel> = []
// 將json數(shù)據(jù)賦值給任務(wù)列表
Object.assign(taskList, jsonData)
// 返回任務(wù)列表
return taskList
}