import {ref} from "vue";
import {FormSchema} from "@/types/form";
import {ElTag} from "element-plus";
import {EmbedStoreApi} from "@/api/new-ai/embed-store";
import { useTable } from "@/hooks/web/useTable";
import { TableColumn } from "@/types/table";

export enum ProviderEnum {
  Redis = 'REDIS',
  PgVector = 'PGVECTOR',
  Milvus = 'MILVUS',
}

export const ProviderConst = [
  { label: 'Redis', value: ProviderEnum.Redis },
  { label: 'PgVector', value: ProviderEnum.PgVector },
  { label: 'Milvus', value: ProviderEnum.Milvus },
];

export default function () {
  const editRef = ref()
  const searchParams = ref({});
  const ProviderConst = [
    { label: 'Redis', value: ProviderEnum.Redis },
    { label: 'PgVector', value: ProviderEnum.PgVector },
    { label: 'Milvus', value: ProviderEnum.Milvus },
  ];

  function getProviderLabel(value: any) {
    const arr = ProviderConst.filter((i) => i.value === value);
    if (arr === undefined || arr.length === 0) {
      return value;
    }
    return arr[0].label;
  }

  const shema = ref<FormSchema[]>([
    {
      label: '数据库别名',
      field: 'name',
      component: 'Input',
      colProps: {
        span: 6
      },
    }
  ])

  const columns = ref<TableColumn[]>([
    {
      label: '数据库别名',
      field: 'name',
      align: 'center',
    },
    {
      label: '供应商',
      field: 'provider',
      align: 'center',
      width: '120',
      render(row) {
        return h(
          ElTag,
          {
            type: 'success',
          },
          {
            default: () => getProviderLabel(row.provider),
          }
        );
      },
    },
    {
      label: '向量纬度',
      field: 'dimension',
      align: 'center',
      width: '100',
      formatter(row) {
        return h(
          ElTag,
          {
            size: 'small',
          },
          {
            default: () => row.dimension,
          }
        );
      },
    },
    {
      label: '数据库地址',
      field: 'host',
      align: 'center',
      width: '110',
    },
    {
      label: '数据库端口',
      field: 'port',
      align: 'center',
      width: '100',
    },
    {
      label: '数据库用户名',
      field: 'username',
      align: 'center',
    },
    {
      label: '数据库密码',
      field: 'password',
      align: 'center',
    },
    {
      label: '数据库名',
      field: 'databaseName',
      align: 'center',
    },
    {
      label: '表名称',
      field: 'tableName',
      align: 'center',
    },
    {
      label: '操作',
      field: "action",
      width: 150
    }
  ]);

  const {register, tableObject, methods} = useTable({
    getListApi: EmbedStoreApi.getEmbedStorePage,
    defaultParams: searchParams.value,
    delListApi: EmbedStoreApi.deleteEmbedStore
  });

  // 打开编辑对话框
  const open = (data?: any) => {
    editRef.value.show(data);
  }

  // 处理搜索
  const handleSearch = (values: any) => {
    methods.setSearchParams(values)
  }

  const pagination = computed(() => {
    return {
      total: tableObject.total,
      pageSize: tableObject.pageSize,
      currentPage: tableObject.currentPage
    }
  })

  const handleDel = async (id: string | number) => {
    try {
      await methods.delList(id, false);
    } catch (error) {
      console.error('Failed to delete embed store:', error);
    }
  }

  return {
    shema,
    columns,
    register,
    open,
    handleSearch,
    ProviderConst,
    getProviderLabel,
    methods,
    tableObject,
    pagination,
    handleDel,
    editRef
  }
}
