"use client"

import {
  addDailyWorkData,
  editDailyWorkData,
} from "@/components/label/api/daily"
import { Daily } from "@/components/label/api/daily/typing"
import {
  useAllUserStore,
  usePermissionStore,
} from "@/components/label/store/auth"
import {
  Button,
  Group,
  Modal,
  NumberInput,
  Paper,
  Select,
  SimpleGrid,
  Stack,
  Text,
  TextInput,
} from "@mantine/core"
import { useForm } from "@mantine/form"
import { notifications } from "@mantine/notifications"
import { useEffect, useMemo } from "react"
import classes from "./DailyReportModal.module.css"
import {
  accountTypeOpts,
  actualTypeOpts,
  objTypeOpts,
  performanceOpts,
  setTypeOpts,
  workTypeOpts,
} from "../config"

function normalizeTimeValue(value?: string | null) {
  if (!value) return ""
  return value.length >= 5 ? value.slice(0, 5) : value
}

function toTimeWithSeconds(value?: string) {
  if (!value) return undefined
  return value.length === 5 ? `${value}:00` : value
}

type LeaderTreeNode = {
  title?: string
  value?: string | number
  children?: LeaderTreeNode[]
}

function flattenLeaderTree(
  nodes: LeaderTreeNode[],
  prefixTitle: string[] = []
): Array<{ label: string; value: string }> {
  const result: Array<{ label: string; value: string }> = []

  nodes.forEach((node) => {
    const title = node.title ?? ""
    const nextPrefix = title ? [...prefixTitle, title] : prefixTitle
    const children = node.children ?? []
    const hasChildren = children.length > 0
    const valueRaw = node.value

    if (hasChildren) {
      result.push(...flattenLeaderTree(children, nextPrefix))
      return
    }

    if (valueRaw === undefined || valueRaw === null) return
    if (typeof valueRaw === "string" && valueRaw.includes("-")) return

    result.push({
      label: nextPrefix.join(" / "),
      value: String(valueRaw),
    })
  })

  return result
}

function HourRightSection() {
  return (
    <Text size="xs" c="dimmed">
      小时(H)
    </Text>
  )
}

export default function DailyReportModal(props: {
  opened: boolean
  record: Daily.DailyWorkList | null
  projectOptions: Array<{ label: string; value: string }>
  onCloseAction: (refresh?: boolean) => void
}) {
  const { opened, record, onCloseAction, projectOptions } = props

  const user_id = usePermissionStore((s) => s.user_id)
  const user_name = usePermissionStore((s) => s.user_name)
  const treeData = useAllUserStore((s) => s.treeData)

  const leaderOptions = useMemo(() => {
    return flattenLeaderTree(treeData ?? [])
  }, [treeData])

  const form = useForm({
    initialValues: {
      user_name: user_name ?? "",
      date: "",
      start_time: "",
      end_time: "",
      set_type: "",
      actual_type: "",
      project_id: "",
      leader_uid: "",
      work_type: "",
      accounting_type: "",
      performance_accounting: "",
      obj_type: "",
      work_time: undefined as number | undefined,
      rate: undefined as number | undefined,
      standard_size: undefined as number | undefined,
      completed_size: undefined as number | undefined,
      residual_size: undefined as number | undefined,
      residual_work_time: undefined as number | undefined,
      residual_pm: "",
      remarks: "",
    },
    validate: {
      date: (v) => (v ? null : "请输入日期"),
      //   set_type: (v) => (v ? null : "请选择规定类型"),
      actual_type: (v) => (v ? null : "请选择出勤类型"),
    },
    validateInputOnChange: true,
    validateInputOnBlur: true,
    clearInputErrorOnChange: true,
  })

  useEffect(() => {
    if (!opened) return

    if (!record) {
      form.setValues({
        user_name: user_name ?? "",
        date: new Date().toISOString().slice(0, 10),
        start_time: "",
        end_time: "",
        set_type: "",
        actual_type: "",
        project_id: "",
        leader_uid: "",
        work_type: "",
        accounting_type: "",
        performance_accounting: "",
        obj_type: "",
        work_time: undefined,
        rate: undefined,
        standard_size: undefined,
        completed_size: undefined,
        residual_size: undefined,
        residual_work_time: undefined,
        residual_pm: "",
        remarks: "",
      })
      form.resetDirty()
      return
    }

    form.setValues({
      user_name: user_name ?? "",
      date: record.date ?? "",
      start_time: normalizeTimeValue(record.start_time),
      end_time: normalizeTimeValue(record.end_time),
      set_type: record.set_type ?? "",
      actual_type: record.actual_type ?? "",
      project_id:
        record.project_id === undefined || record.project_id === null
          ? ""
          : String(record.project_id),
      leader_uid:
        record.leader_uid === undefined || record.leader_uid === null
          ? ""
          : String(record.leader_uid),
      work_type: record.work_type ?? "",
      accounting_type: record.accounting_type ?? "",
      performance_accounting:
        record.performance_accounting === true
          ? "true"
          : record.performance_accounting === false
            ? "false"
            : "",
      obj_type:
        record.obj_type === undefined || record.obj_type === null
          ? ""
          : String(record.obj_type),
      work_time: record.work_time ?? undefined,
      rate: record.rate ?? undefined,
      standard_size: record.standard_size ?? undefined,
      completed_size: record.completed_size ?? undefined,
      residual_size: record.residual_size ?? undefined,
      residual_work_time: record.residual_work_time ?? undefined,
      residual_pm:
        record.residual_pm === true
          ? "正"
          : record.residual_pm === false
            ? "负"
            : "",
      remarks: record.remarks ?? "",
    })
    form.resetDirty()
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [opened, record, user_name])

  useEffect(() => {
    const workTime = form.values.work_time
    const rate = form.values.rate
    if (workTime !== undefined && rate !== undefined) {
      form.setFieldValue("standard_size", Number((workTime * rate).toFixed(1)))
    } else {
      form.setFieldValue("standard_size", undefined)
    }
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [form.values.work_time, form.values.rate])

  useEffect(() => {
    const standardSize = form.values.standard_size
    const completedSize = form.values.completed_size
    const workTime = form.values.work_time

    if (
      standardSize !== undefined &&
      completedSize !== undefined &&
      workTime !== undefined &&
      standardSize !== 0
    ) {
      const residualSize = completedSize - standardSize
      const residualWorkTime = Number(
        ((residualSize / standardSize) * workTime).toFixed(1)
      )
      form.setFieldValue("residual_size", Number(residualSize.toFixed(1)))
      form.setFieldValue("residual_work_time", residualWorkTime)
      form.setFieldValue("residual_pm", residualSize >= 0 ? "正" : "负")
    } else {
      form.setFieldValue("residual_size", undefined)
      form.setFieldValue("residual_work_time", undefined)
      form.setFieldValue("residual_pm", "")
    }
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [
    form.values.standard_size,
    form.values.completed_size,
    form.values.work_time,
  ])

  const handleSubmit = form.onSubmit(async (values) => {
    const uid = typeof user_id === "number" ? user_id : Number(user_id ?? 0)
    if (!uid) {
      notifications.show({
        color: "red",
        title: "提交失败",
        message: "未获取到用户信息",
      })
      return
    }

    const params: Daily.CreateProps = {
      uid,
      date: values.date,
      start_time: toTimeWithSeconds(values.start_time),
      end_time: toTimeWithSeconds(values.end_time),
      set_type: values.set_type,
      actual_type: values.actual_type,
      project_id: values.project_id ? Number(values.project_id) : undefined,
      leader_uid: values.leader_uid ? Number(values.leader_uid) : undefined,
      work_type: values.work_type || undefined,
      accounting_type: values.accounting_type || undefined,
      performance_accounting:
        values.performance_accounting === "true"
          ? true
          : values.performance_accounting === "false"
            ? false
            : undefined,
      obj_type: values.obj_type ? Number(values.obj_type) : undefined,
      work_time: values.work_time,
      rate: values.rate,
      standard_size: values.standard_size,
      completed_size: values.completed_size,
      residual_size: values.residual_size,
      residual_work_time: values.residual_work_time,
      residual_pm:
        values.residual_pm === "正"
          ? true
          : values.residual_pm === "负"
            ? false
            : undefined,
      remarks: values.remarks || undefined,
    }

    try {
      if (record?.id) {
        await editDailyWorkData(params, record.id)
        notifications.show({
          color: "green",
          title: "操作成功",
          message: "已更新日报",
        })
      } else {
        await addDailyWorkData(params)
        notifications.show({
          color: "green",
          title: "操作成功",
          message: "已提交日报",
        })
      }
      onCloseAction(true)
      form.reset()
    } catch (e) {
      notifications.show({
        color: "red",
        title: "操作失败",
        message: e instanceof Error ? e.message : "请求失败",
      })
    }
  })

  return (
    <Modal
      opened={opened}
      onClose={() => {
        form.reset()
        onCloseAction()
      }}
      title={record ? "编辑日报" : "填写日报"}
      size={840}
      centered
      classNames={{
        content: classes.modalContent,
        header: classes.modalHeader,
        title: classes.modalTitle,
        body: classes.modalBody,
      }}
      overlayProps={{ backgroundOpacity: 0.22 }}
      transitionProps={{
        transition: "fade",
        duration: 100,
        timingFunction: "ease",
      }}
      closeOnClickOutside={false}>
      <form onSubmit={handleSubmit}>
        <Paper
          withBorder
          radius="lg"
          p="md"
          shadow="xs"
          className={classes.formSurface}>
          <Stack gap="md" className={classes.formPanel}>
            <SimpleGrid cols={{ base: 1, sm: 3 }} spacing="sm">
              <TextInput label="姓名" value={form.values.user_name} readOnly />
              <TextInput
                label="日期"
                type="date"
                withAsterisk
                {...form.getInputProps("date")}
              />
              <div />

              <TextInput
                label="开始时间"
                type="time"
                {...form.getInputProps("start_time")}
              />
              <TextInput
                label="结束时间"
                type="time"
                {...form.getInputProps("end_time")}
              />
              <div />

              <Select
                label="规定类型"
                withAsterisk
                data={setTypeOpts}
                searchable
                clearable
                {...form.getInputProps("set_type")}
              />
              <Select
                label="出勤类型"
                withAsterisk
                data={actualTypeOpts}
                searchable
                clearable
                {...form.getInputProps("actual_type")}
              />
              <div />

              <Select
                label="项目名称"
                data={projectOptions}
                searchable
                clearable
                {...form.getInputProps("project_id")}
              />
              <Select
                label="任务组长"
                data={leaderOptions}
                searchable
                clearable
                {...form.getInputProps("leader_uid")}
              />
              <Select
                label="工作类别"
                data={workTypeOpts}
                searchable
                clearable
                {...form.getInputProps("work_type")}
              />

              <Select
                label="对象类型"
                data={objTypeOpts}
                searchable
                clearable
                {...form.getInputProps("obj_type")}
              />
              <Select
                label="绩效核算"
                data={performanceOpts}
                searchable
                clearable
                {...form.getInputProps("performance_accounting")}
              />
              <Select
                label="核算方式"
                data={accountTypeOpts}
                searchable
                clearable
                {...form.getInputProps("accounting_type")}
              />

              <NumberInput
                label="工时"
                min={0}
                decimalScale={1}
                allowNegative={false}
                hideControls
                rightSection={<HourRightSection />}
                rightSectionWidth={78}
                {...form.getInputProps("work_time")}
              />
              <NumberInput
                label="额定倍速"
                min={0}
                allowNegative={false}
                hideControls
                {...form.getInputProps("rate")}
              />
              <div />

              <NumberInput
                label="标准量"
                value={form.values.standard_size}
                readOnly
                hideControls
              />
              <NumberInput
                label="完成量"
                min={0}
                allowNegative={false}
                hideControls
                {...form.getInputProps("completed_size")}
              />
              <div />

              <NumberInput
                label="余量"
                value={form.values.residual_size}
                readOnly
                hideControls
              />
              <NumberInput
                label="余量工时"
                value={form.values.residual_work_time}
                readOnly
                hideControls
                rightSection={<HourRightSection />}
                rightSectionWidth={78}
              />
              <TextInput
                label="余量正负"
                value={form.values.residual_pm}
                readOnly
              />
            </SimpleGrid>

            <TextInput label="备注" {...form.getInputProps("remarks")} />

            <Group justify="flex-end" gap="sm">
              <Button
                variant="default"
                onClick={() => {
                  form.reset()
                  onCloseAction()
                }}>
                取消
              </Button>
              <Button type="submit">提交</Button>
            </Group>
          </Stack>
        </Paper>
      </form>
    </Modal>
  )
}