<template>
    <view class="container">
        <task-tree :showAuxiliaryLine="true" :border="false" labelKey="name" valueKey="task_id" ref="treeRef" funcMode="edit" pageTop="45px"
            :treeData="tasks" uiMode="page" titleColor="#5d5959">
        <template #empty>暂无计划</template>
        <template #topBar>
            <view>

            </view>
        </template>
        <template #fixedBottomBar>
            <custom-button width="100%" type="filled" color="#007aff" >添加任务</custom-button>
        </template>
        </task-tree>
    </view>
</template>
<script setup lang="ts">
import { getPlanTaskList } from '@/api/project-center/plan-task';
import taskTree from '@/components/task-tree/index.vue'
import { TaskListReqParams, UiStatus } from '@/types/plan-task';
import { OverviewProjectResParams } from '@/types/project';

interface Tasks {
  task_id: string
  name?: string
  pid?: string
  progress?: number
  status?: number
  handler_id?: string
  handler_name?: string
  begin_at?: string
  end_at?: string
  children?: Tasks[]
  sub_tasks?: Tasks[]
  isLeaf?: boolean
  layer?: number
}

const props = defineProps({
    prj: {
        type: Object as PropType<OverviewProjectResParams>,
        required: true
    },
    accountList: {
        type: Array as PropType<{ id: string; name: string }[]>,
    }
})

const uiShow = reactive<{ ui_status?: UiStatus }>({
  ui_status: {
    alter: true
  }
}) // 客户详情
const draft = ref(false)
const regionTreeData = ref<any[]>([]) // 区域树
const tasks = ref<Tasks[]>()
const works = ref<{ id: string; name: string }[]>([])


/**
 * 递归获取tree需要的结构体
 * @param task 接口返回的树状数组
 * @param layer 层级
 */
 const getNodesTree = (task: Tasks, layer?: number): Tasks => {
  task.layer = (layer || 0) + 1 // 添加layer参数
  task.children = task.sub_tasks // 添加children参数
  if (task.children && task.children.length > 0) {
    task.children.map(res => getNodesTree(res, task.layer))
  } else {
    task.children = []
    task.isLeaf = true
  }
  return task
}

const getTaskTree = async () => {
    const params: TaskListReqParams = {
        prj_id: props.prj.id,
        draft: draft.value
    }
    const {
        tasks: list,
        ui_status: uiStatus,
        works: tWorks
    } = await getPlanTaskList(params)
    tasks.value = list.map(task => {
        return getNodesTree(task)
    })
    uiShow.ui_status = uiStatus
    works.value = tWorks || []
}

onMounted(async () => {
    console.log('plan')
    await getTaskTree()
    // unref(treeRef).showTree = true
})

</script>