<template>
  <SKDeptManagement
    :items="deptItems"
    :loading="loading"
    :status-options="statusOptions"
    @add-sub="onAddSub"
    @create="onCreate"
    @delete="onDelete"
    @edit="onEdit"
  />
</template>

<script setup lang="ts">
import type { DeptItem } from '@/components/SKDeptManagement.vue'
import { ref } from 'vue'
import SKDeptManagement from '@/components/SKDeptManagement.vue'

const loading = ref(false)

const statusOptions = [
  { title: '已啟用', value: 1 },
  { title: '已禁用', value: 0 },
]

const deptItems = ref([
  {
    id: 1,
    name: '校長室',
    status: 1,
    createTime: '2023/08/01 09:00:00',
    note: '負責統籌全校校務發展',
    children: [],
  },
  {
    id: 2,
    name: '教務處',
    status: 1,
    createTime: '2023/08/01 09:00:00',
    note: '負責課程教學與學籍管理',
    children: [
      {
        id: 21,
        name: '教學組',
        status: 1,
        createTime: '2023/08/01 09:00:00',
        note: '課程編排、教師授課與教學評鑑',
        children: [],
      },
      {
        id: 22,
        name: '註冊組',
        status: 1,
        createTime: '2023/08/01 09:00:00',
        note: '學生學籍管理、成績處理與升學輔導',
        children: [],
      },
      {
        id: 23,
        name: '設備組',
        status: 1,
        createTime: '2023/08/01 09:00:00',
        note: '教學設備採購與維護',
        children: [],
      },
    ],
  },
  {
    id: 3,
    name: '學務處',
    status: 1,
    createTime: '2023/08/01 09:00:00',
    note: '負責學生生活輔導與活動規劃',
    children: [
      {
        id: 31,
        name: '訓育組',
        status: 1,
        createTime: '2023/08/01 09:00:00',
        note: '學生自治活動、社團活動與校慶規劃',
        children: [],
      },
      {
        id: 32,
        name: '生輔組',
        status: 1,
        createTime: '2023/08/01 09:00:00',
        note: '學生生活常規、出缺席管理與校園安全',
        children: [],
      },
      {
        id: 33,
        name: '衛生組',
        status: 1,
        createTime: '2023/08/01 09:00:00',
        note: '校園環境衛生、傳染病防治與健康促進',
        children: [],
      },
    ],
  },
  {
    id: 4,
    name: '總務處',
    status: 1,
    createTime: '2023/08/01 09:00:00',
    note: '負責校園營繕、財產管理與經費出納',
    children: [
      {
        id: 41,
        name: '庶務組',
        status: 1,
        createTime: '2023/08/01 09:00:00',
        note: '校舍修繕、物品採購與工友管理',
        children: [],
      },
      {
        id: 42,
        name: '出納組',
        status: 1,
        createTime: '2023/08/01 09:00:00',
        note: '現金出納、薪津發放與學費收繳',
        children: [],
      },
    ],
  },
  {
    id: 5,
    name: '輔導室',
    status: 1,
    createTime: '2023/08/01 09:00:00',
    note: '負責學生心理輔導與生涯規劃',
    children: [],
  },
])

function addChildById (items: DeptItem[], parentId: string | number, child: DeptItem): boolean {
  for (const current of items) {
    if (!current) continue

    if (current.id === parentId) {
      if (!current.children) current.children = []
      current.children.push(child)
      return true
    }

    if (current.children && current.children.length > 0) {
      const found = addChildById(current.children, parentId, child)
      if (found) return true
    }
  }
  return false
}

function updateTreeItemById (items: DeptItem[], updated: DeptItem): boolean {
  for (let i = 0; i < items.length; i += 1) {
    const current = items[i]
    if (!current) continue

    if (current.id === updated.id) {
      items[i] = {
        ...current,
        name: updated.name,
        note: updated.note,
        status: updated.status,
      }
      return true
    }

    if (current.children && current.children.length > 0) {
      const found = updateTreeItemById(current.children, updated)
      if (found) return true
    }
  }
  return false
}

const onCreate = () => alert('Create Dept')
function onAddSub (parent: DeptItem, newItem: DeptItem) {
  addChildById(deptItems.value, parent.id, newItem)
}
function onEdit (item: DeptItem) {
  updateTreeItemById(deptItems.value, item)
}
function onDelete (item: DeptItem) {
  if (confirm(`Delete ${item.name}?`)) {
    alert('Deleted')
  }
}
</script>
