import type { ExtendedFormApi, VbenFormSchema } from "#/adapter/form";
import type { VxeTableGridOptions } from "#/adapter/vxe-table";
import type { MesMdItemApi } from "#/api/mes/md/item";
import type { MesPdProjectApi } from "#/api/mes/pd/project";

import { h, markRaw } from "vue";

import {
  DICT_TYPE,
  MesAutoCodeRuleCode,
  MesPdDocumentTypeEnum,
} from "#/packages/constants/src";
import { getDictOptions } from "#/packages/effects/hooks/src";

import { Button } from "ant-design-vue";

import { generateAutoCode } from "#/api/mes/md/autocode/record";

import { MdItemSelect } from "#/views/mes/md/item/components";
import PdUserSelect from "../project/modules/user-select.vue";

export type FormType = "create" | "detail" | "update";

/** 弹窗内 DatePicker：挂载到 dialog 内，避免 focus-outside 拦截日历点击 */
function useModalDatePickerProps(options?: {
  disabled?: boolean;
  placeholder?: string;
}) {
  return {
    allowClear: true,
    class: "!w-full",
    disabled: options?.disabled,
    format: "YYYY-MM-DD",
    getPopupContainer: (node: HTMLElement) =>
      (node.closest('[data-slot="dialog-content"]') as HTMLElement) ??
      document.body,
    inputReadOnly: true,
    placeholder: options?.placeholder ?? "请选择日期",
    valueFormat: "x",
  };
}

async function generateTaskCode(formApi?: ExtendedFormApi) {
  const code = await generateAutoCode(MesAutoCodeRuleCode.PD_PROJECT_CODE);
  await formApi?.setFieldValue("taskCode", code);
}

async function syncTaskNameFromProduct(
  formApi: ExtendedFormApi | undefined,
  productName?: string
) {
  const values = await formApi?.getValues();
  const version = values?.version as string | undefined;
  const name = productName?.trim();
  if (name && version?.trim()) {
    await formApi?.setFieldValue("taskName", `${name} ${version.trim()} 设计`);
  }
}

/** 产品选择：选择后自动带出产品编码 */
function useProductSelectSchema(
  formApi: ExtendedFormApi | undefined,
  readonly: boolean
): VbenFormSchema[] {
  if (readonly) {
    return [
      {
        fieldName: "productCode",
        label: "产品编码",
        component: "Input",
        componentProps: { disabled: true },
      },
      {
        fieldName: "productName",
        label: "产品名称",
        component: "Input",
        componentProps: { disabled: true },
      },
    ];
  }
  return [
    {
      fieldName: "productId",
      label: "产品",
      component: markRaw(MdItemSelect),
      componentProps: {
        placeholder: "请选择产品",
        onChange: async (item: MesMdItemApi.Item | undefined) => {
          await formApi?.setFieldValue("productCode", item?.code ?? "");
          await formApi?.setFieldValue("productName", item?.name ?? "");
          await syncTaskNameFromProduct(formApi, item?.name);
        },
      },
      rules: "selectRequired",
    },
    {
      fieldName: "productCode",
      label: "产品编码",
      component: "Input",
      componentProps: {
        disabled: true,
        placeholder: "选择产品后自动带出",
      },
      rules: "required",
    },
    {
      fieldName: "productName",
      component: "Input",
      dependencies: { triggerFields: [""], show: () => false },
    },
  ];
}

/** 发起设计任务 / 创建表单 */
export function useCreateFormSchema(
  formApi?: ExtendedFormApi
): VbenFormSchema[] {
  return [
    {
      fieldName: "id",
      component: "Input",
      dependencies: { triggerFields: [""], show: () => false },
    },
    {
      fieldName: "taskCode",
      label: "任务编码",
      component: "Input",
      componentProps: { placeholder: "请点击生成任务编码" },
      rules: "required",
      suffix: () =>
        h(
          Button,
          { type: "default", onClick: () => generateTaskCode(formApi) },
          { default: () => "生成" }
        ),
    },
    ...useProductSelectSchema(formApi, false),
    {
      fieldName: "version",
      label: "版本号",
      component: "Input",
      componentProps: { placeholder: "如 V1.0、V2.1" },
      rules: "required",
    },
    {
      fieldName: "taskName",
      label: "任务名称",
      component: "Input",
      componentProps: { placeholder: "将根据产品与版本自动生成，可修改" },
      rules: "required",
      dependencies: {
        triggerFields: ["productName", "version"],
        trigger(values: Record<string, string>, form) {
          const productName = values.productName?.trim();
          const version = values.version?.trim();
          if (productName && version) {
            form.setFieldValue("taskName", `${productName} ${version} 设计`);
          }
        },
      },
    },
    {
      fieldName: "chiefDesigner",
      label: "主设计师",
      component: markRaw(PdUserSelect),
      componentProps: { placeholder: "请选择主设计师" },
      rules: "selectRequired",
    },
    {
      fieldName: "reviewer",
      label: "审核人",
      component: markRaw(PdUserSelect),
      componentProps: { placeholder: "请选择审核人" },
      rules: "selectRequired",
    },
    {
      fieldName: "planFinishTime",
      label: "计划完成时间",
      component: "DatePicker",
      componentProps: useModalDatePickerProps({
        placeholder: "请选择计划完成时间",
      }),
    },
    {
      fieldName: "remark",
      label: "备注",
      component: "Textarea",
      componentProps: {
        placeholder: "简述本次设计目标、变更背景等",
        rows: 3,
      },
      formItemClass: "col-span-2",
    },
  ];
}

/** 网格搜索表单 */
export function useGridFormSchema(): VbenFormSchema[] {
  return [
    {
      fieldName: "taskCode",
      label: "任务编码",
      component: "Input",
      componentProps: { placeholder: "请输入任务编码" },
    },
    {
      fieldName: "taskName",
      label: "任务名称",
      component: "Input",
      componentProps: { placeholder: "请输入任务名称" },
    },
    {
      fieldName: "productCode",
      label: "产品编码",
      component: "Input",
      componentProps: { placeholder: "请输入产品编码" },
    },
    {
      fieldName: "productName",
      label: "产品名称",
      component: "Input",
      componentProps: { placeholder: "请输入产品名称" },
    },
    {
      fieldName: "status",
      label: "任务状态",
      component: "Select",
      componentProps: {
        allowClear: true,
        options: getDictOptions(DICT_TYPE.MES_PD_PROJECT_STATUS, "number"),
        placeholder: "请选择项目状态",
      },
    },
  ];
}

/** 网格列定义 */
export function useGridColumns(): VxeTableGridOptions["columns"] {
  return [
    {
      field: "taskCode",
      title: "任务编码",
      minWidth: 140,
      slots: { default: "taskCode" },
    },
    { field: "taskName", title: "任务名称", minWidth: 160 },
    { field: "productCode", title: "产品编码", minWidth: 120 },
    { field: "productName", title: "产品名称", minWidth: 140 },
    { field: "version", title: "版本号", minWidth: 90 },
    {
      field: "status",
      title: "状态",
      minWidth: 100,
      cellRender: {
        name: "CellDict",
        props: { type: DICT_TYPE.MES_PD_PROJECT_STATUS },
      },
    },
    { field: "chiefDesignerNickname", title: "主设计师", minWidth: 100 },
    { field: "reviewerNickname", title: "审核人", minWidth: 100 },
    {
      field: "planFinishTime",
      title: "计划完成",
      minWidth: 120,
      formatter: "formatDate",
    },
    {
      field: "createTime",
      title: "创建时间",
      minWidth: 160,
      formatter: "formatDateTime",
    },
    {
      field: "action",
      title: "操作",
      width: 260,
      fixed: "right",
      slots: { default: "actions" },
    },
  ];
}

/** 编辑/详情表单 */
export function useFormSchema(
  formType: FormType,
  formApi?: ExtendedFormApi
): VbenFormSchema[] {
  const readonly = formType === "detail";
  return [
    {
      fieldName: "id",
      component: "Input",
      dependencies: { triggerFields: [""], show: () => false },
    },
    {
      fieldName: "taskCode",
      label: "任务编码",
      component: "Input",
      componentProps: { disabled: readonly, placeholder: "请输入任务编码" },
      rules: "required",
      suffix:
        formType === "detail"
          ? undefined
          : () =>
              h(
                Button,
                {
                  type: "default",
                  onClick: async () => {
                    const code = await generateAutoCode(
                      MesAutoCodeRuleCode.PD_PROJECT_CODE
                    );
                    await formApi?.setFieldValue("taskCode", code);
                  },
                },
                { default: () => "生成" }
              ),
    },
    ...useProductSelectSchema(formApi, readonly),
    {
      fieldName: "version",
      label: "版本号",
      component: "Input",
      componentProps: { disabled: readonly, placeholder: "如 V1.0" },
      rules: "required",
    },
    {
      fieldName: "taskName",
      label: "任务名称",
      component: "Input",
      componentProps: {
        disabled: readonly,
        placeholder: "如：智能温控模组 V1.0 设计",
      },
      rules: "required",
      dependencies: {
        triggerFields: ["productName", "version"],
        trigger(values: Record<string, string>, form) {
          if (readonly) {
            return;
          }
          const productName = values.productName?.trim();
          const version = values.version?.trim();
          if (productName && version) {
            form.setFieldValue("taskName", `${productName} ${version} 设计`);
          }
        },
      },
    },
    {
      fieldName: "status",
      label: "任务状态",
      component: "Select",
      componentProps: {
        disabled: true,
        options: getDictOptions(DICT_TYPE.MES_PD_PROJECT_STATUS, "number"),
      },
      dependencies: { triggerFields: [""], show: () => formType !== "create" },
    },
    {
      fieldName: "chiefDesigner",
      label: "主设计师",
      component: markRaw(PdUserSelect),
      componentProps: { disabled: readonly, placeholder: "请选择主设计师" },
    },
    {
      fieldName: "reviewer",
      label: "审核人",
      component: markRaw(PdUserSelect),
      componentProps: { disabled: readonly, placeholder: "请选择审核人" },
    },
    {
      fieldName: "planFinishTime",
      label: "计划完成时间",
      component: "DatePicker",
      componentProps: useModalDatePickerProps({
        disabled: readonly,
        placeholder: "请选择计划完成时间",
      }),
    },
    {
      fieldName: "remark",
      label: "备注",
      component: "Textarea",
      componentProps: {
        disabled: readonly,
        placeholder: "请输入备注",
        rows: 3,
      },
      formItemClass: "col-span-3",
    },
  ];
}

/** 设计资料类型选项 */
export function getPdDocumentTypeOptions() {
  return [
    { label: "设计方案", value: MesPdDocumentTypeEnum.SCHEME },
    { label: "设计图纸", value: MesPdDocumentTypeEnum.DRAWING },
    { label: "设计模型", value: MesPdDocumentTypeEnum.MODEL },
    { label: "产品设计", value: MesPdDocumentTypeEnum.PRODUCT_DESIGN },
    { label: "BOM 清单", value: MesPdDocumentTypeEnum.BOM },
    { label: "其他附件", value: MesPdDocumentTypeEnum.OTHER },
  ];
}

/** 资料列表搜索表单 */
export function useMaterialListGridFormSchema(): VbenFormSchema[] {
  return [
    {
      fieldName: "documentName",
      label: "资料名称",
      component: "Input",
      componentProps: { placeholder: "请输入资料名称" },
    },
    {
      fieldName: "documentType",
      label: "资料类型",
      component: "Select",
      componentProps: {
        allowClear: true,
        options: getPdDocumentTypeOptions(),
        placeholder: "请选择资料类型",
      },
    },
  ];
}

/** 资料列表列定义 */
export function useMaterialListGridColumns(): VxeTableGridOptions["columns"] {
  return [
    {
      field: "documentType",
      title: "资料类型",
      minWidth: 110,
      formatter: ({ cellValue }: { cellValue: string }) => {
        const option = getPdDocumentTypeOptions().find(
          (item) => item.value === cellValue
        );
        return option?.label ?? String(cellValue ?? "");
      },
    },
    { field: "documentName", title: "资料名称", minWidth: 180 },
    { field: "documentVersion", title: "版本", minWidth: 90 },
    {
      field: "fileUrl",
      title: "文件",
      minWidth: 140,
      slots: { default: "file" },
    },
    { field: "fileName", title: "文件名", minWidth: 160 },
    { field: "uploadUserNickname", title: "上传人", minWidth: 100 },
    {
      field: "uploadTime",
      title: "上传时间",
      minWidth: 160,
      formatter: "formatDateTime",
    },
    {
      field: "action",
      title: "操作",
      width: 140,
      fixed: "right",
      slots: { default: "actions" },
    },
  ];
}

/** BOM 表格列 */
export function useBomGridColumns(): VxeTableGridOptions["columns"] {
  return [
    { field: "itemCode", title: "物料编码", minWidth: 120 },
    { field: "itemName", title: "物料名称", minWidth: 160 },
    { field: "specification", title: "规格型号", minWidth: 140 },
    { field: "unitMeasureName", title: "单位", minWidth: 80 },
    { field: "quantity", title: "用量", minWidth: 90 },
    { field: "remark", title: "备注", minWidth: 140 },
    {
      field: "action",
      title: "操作",
      width: 140,
      slots: { default: "actions" },
    },
  ];
}

export type { MesPdProjectApi };