import type { VbenFormProps } from '#/adapter/form';
import type { VxeGridProps } from '#/adapter/vxe-table';

import { EnumApi, TenantApi } from '#/api';
import { dbTypeOptions, formatterStatus } from '#/api/model';

export const searchFormOptions: VbenFormProps = {
  schema: [
    {
      component: 'Input',
      fieldName: 'name',
      label: '租户名称',
    },
    {
      component: 'Input',
      fieldName: 'phone',
      label: '联系人',
    },
  ],
};

export const gridOptions: VxeGridProps<TenantApi.RecordItem> = {
  checkboxConfig: {
    highlight: true,
    labelField: 'name',
  },
  toolbarConfig: {
    refresh: true,
    print: false,
    export: false,
    zoom: true,
    custom: true,
  },
  columns: [
    { title: '序号', type: 'seq', width: 50 },
    {
      align: 'left',
      field: 'name',
      title: '租户名称',
      // type: 'checkbox',
      width: 200,
    },
    { align: 'left', field: 'adminAccount', title: '联系人', width: 120 },
    { align: 'left', field: 'phone', title: '联系电话', width: 120 },
    { field: 'tenantTypeName', title: '租户类型', width: 80 },
    {
      field: 'status',
      title: '状态',
      width: 60,
      formatter: formatterStatus,
    },
    { field: 'sort', title: '排序', width: 50 },
    { align: 'left', field: 'remark', title: '备注' },
    {
      field: 'action',
      fixed: 'right',
      slots: { default: 'action' },
      title: '操作',
      width: 150,
    },
  ],
  height: 'auto',
  keepSource: true,
  proxyConfig: {
    ajax: {
      query: async ({ page }, formValues) => {
        return await TenantApi.getPage({
          pageIndex: page.currentPage,
          pageSize: page.pageSize,
          ...formValues,
        });
      },
    },
  },
};

export const formOptions: VbenFormProps = {
  commonConfig: {
    componentProps: {
      class: 'w-full',
    },
  },
  schema: [
    {
      component: 'ApiRadio',
      componentProps: {
        api: {
          type: 'enum',
          params: EnumApi.EnumType.TenantType,
        },
      },
      fieldName: 'tenantType',
      label: '租户类型',
      rules: 'required',
    },
    {
      component: 'Input',
      componentProps: {
        placeholder: '请输入',
      },
      fieldName: 'name',
      label: '租户名称',
      rules: 'required',
    },
    {
      component: 'Input',
      componentProps: {
        placeholder: '请输入',
      },
      fieldName: 'adminAccount',
      label: '管理员',
      rules: 'required',
    },
    {
      component: 'Input',
      componentProps: {
        placeholder: '请输入',
      },
      fieldName: 'phone',
      label: '联系电话',
      rules: 'required',
    },
    {
      component: 'Input',
      componentProps: {
        placeholder: '请输入',
      },
      fieldName: 'email',
      label: '电子邮箱',
      rules: 'required',
    },
    {
      component: 'InputNumber',
      componentProps: {
        placeholder: '请输入',
      },
      fieldName: 'sort',
      label: '排序',
      rules: 'required',
    },
    {
      component: 'Select',
      componentProps: {
        placeholder: '请输入',
        options: dbTypeOptions,
      },
      dependencies: {
        show(values) {
          return values.tenantType === 1;
        },
        triggerFields: ['tenantType'],
      },
      fieldName: 'dbType',
      label: '数据库类型',
      rules: 'required',
      formItemClass: 'col-span-2 items-baseline',
    },
    {
      component: 'Textarea',
      componentProps: {
        placeholder: '请输入',
      },
      dependencies: {
        show(values) {
          return values.tenantType === 1;
        },
        triggerFields: ['tenantType'],
      },
      fieldName: 'connection',
      label: '连接字符串',
      rules: 'required',
      formItemClass: 'col-span-2 items-baseline',
    },
    {
      component: 'Input',
      componentProps: {
        placeholder: '请输入',
      },
      fieldName: 'remark',
      label: '备注',
      formItemClass: 'col-span-2 items-baseline',
    },
  ],
  wrapperClass: 'grid-cols-2',
};