import { FormSchema } from '@/components/Form';
import { BasicColumn } from '@/components/Table';
import { functionLoadFormSort } from '@/api/demo/formScheme';
import { h } from 'vue';
import { Tag } from 'ant-design-vue';

const colProps = {
  span: 24,
};

// 步骤一：基本配置 info 部分
export const getStep1_Info: FormSchema[] = [
  {
    field: 'name',
    component: 'Input',
    label: '名称',
    required: true,
    colProps,
  },
  {
    field: 'category',
    label: '分类',
    component: 'ApiSelect',
    required: true,
    colProps,
    componentProps: () => {
      return {
        api: functionLoadFormSort,
        // 接口返回数据
        resultField: 'result',
        labelField: 'itemName',
        valueField: 'itemValue',
      };
    },
  },
  {
    field: 'dbCode',
    label: '数据库',
    component: 'Select',
    required: true,
    componentProps: {
      options: [
        {
          label: '常用数据库',
          value: '1',
          key: '1',
          disabled: true,
        },
        {
          label: '系统数据库',
          value: 'lrsystemdb',
          key: 'lrsystemdb',
        },
      ],
    },
    colProps,
  },
  {
    field: 'enabledMark',
    label: '状态',
    component: 'Switch',
    defaultValue: true,
    colProps,
  },
  {
    field: 'formType',
    label: '类型',
    component: 'RadioGroup',
    componentProps: {
      options: [
        { label: '常规表单', value: 0 },
        { label: '视图表单', value: 1 },
      ],
    },
    defaultValue: '0',
    colProps,
  },
  {
    field: 'description',
    component: 'InputTextArea',
    label: '描述',
    colProps,
    componentProps: {
      rows: 2,
    },
  },
  {
    field: 'type',
    label: 'type',
    ifShow: false,
    slot: 'default',
  },
  {
    field: 'id',
    label: 'id',
    ifShow: false,
    slot: 'default',
  },
  {
    field: 'schemeId',
    label: 'schemeId',
    ifShow: false,
    slot: 'default',
  },
  {
    field: 'createUserName',
    label: 'createUserName',
    ifShow: false,
    slot: 'default',
  },
  {
    field: 'createUserId',
    label: 'createUserId',
    ifShow: false,
    slot: 'default',
  },
  {
    field: 'createDate',
    label: 'createDate',
    ifShow: false,
    slot: 'default',
  },
  {
    field: 'tenantId',
    label: 'tenantId',
    ifShow: false,
    slot: 'default',
  },
];

// 步骤一：基本配置 scheme 部分 添加数据库表（请先选择数据库）
export function getScheme_table_1(): BasicColumn[] {
  return [
    {
      dataIndex: 'id',
      ifShow: false,
    },
    {
      title: '类别',
      dataIndex: 'type',
      fixed: 'left',
      width: 150,
    },
    {
      dataIndex: 'description',
      ifShow: false,
    },
    {
      title: '表名',
      dataIndex: 'tableName',
      width: 150,
    },
    {
      title: '外键',
      dataIndex: 'field',
      width: 150,
    },
    {
      title: '关联表',
      dataIndex: 'relationName',
      width: 150,
    },
    {
      title: '关联主键',
      width: 150,
      dataIndex: 'relationField',
    },
    {
      title: '操作',
      width: 50,
      dataIndex: 'action',
    },
  ];
}

// 步骤一：基本配置 scheme 部分 添加数据库关联表，只用来做数据权限设置（请先选择数据库）
export function getScheme_table_2(): BasicColumn[] {
  return [
    {
      dataIndex: 'id',
      ifShow: false,
    },
    {
      title: '名称',
      dataIndex: 'fname',
      fixed: 'left',
      width: 150,
      editRow: true,
    },
    {
      dataIndex: 'comment',
      ifShow: false,
    },
    {
      title: '表名',
      dataIndex: 'tableName',
      width: 150,
    },
    {
      title: '比较字段',
      dataIndex: 'cfield',
      width: 150,
    },
    {
      title: '外键',
      dataIndex: 'field',
      width: 150,
    },
    {
      title: '关联表',
      dataIndex: 'relationName',
      width: 150,
    },
    {
      title: '关联主键',
      dataIndex: 'relationField',
      width: 150,
    },
    {
      title: '操作',
      width: 50,
      dataIndex: 'action',
    },
  ];
}

// 步骤一：基本配置 scheme 部分 添加数据视图（请先选择数据库）
export function getScheme_table_3(): BasicColumn[] {
  return [
    {
      title: 'type',
      dataIndex: 'type',
      fixed: 'left',
      width: 100,
    },
    {
      title: '表名',
      dataIndex: 'name',
      fixed: 'left',
      width: 200,
    },
    {
      title: 'sql',
      dataIndex: 'sql',
      ifShow: false,
    },
    {
      title: 'columns',
      dataIndex: 'columns',
      ifShow: false,
    },
    {
      title: 'id',
      dataIndex: 'id',
      ifShow: false,
    },
    {
      title: '关联字段',
      dataIndex: 'relationField',
      width: 400,
    },
    {
      title: '操作',
      dataIndex: 'action',
      width: 50,
    },
  ];
}

// 步骤一：基本配置 scheme 部分 新增-数据对象选择弹窗
export function getTableChooseColumns(): BasicColumn[] {
  return [
    {
      title: '表名',
      dataIndex: 'tableName',
      fixed: 'left',
      width: 300,
    },
    {
      title: '备注',
      dataIndex: 'description',
      width: 300,
    },
    {
      title: '状态',
      dataIndex: 'state',
      width: 50,
      customRender: () => {
        const color = 'green';
        const text = '同步';
        return h(Tag, { color: color }, () => text);
      },
    },
    {
      dataIndex: 'className',
      ifShow: false,
    },
    {
      dataIndex: 'dbId',
      ifShow: false,
    },
    {
      dataIndex: 'id',
      ifShow: false,
    },
    {
      dataIndex: 'deleteMark',
      ifShow: false,
    },
    {
      dataIndex: 'isLock',
      ifShow: false,
    },
    {
      dataIndex: 'tenantId',
      ifShow: false,
    },
  ];
}

// 步骤一：基本配置 scheme 部分 导入-数据表选择弹窗
export function getTableImportColumns(): BasicColumn[] {
  return [
    {
      title: '表名',
      dataIndex: 'name',
      fixed: 'left',
      width: 300,
    },
    {
      title: '说明',
      dataIndex: 'description',
      width: 300,
    },
    {
      title: '',
      dataIndex: 'dbObjectType',
      ifShow: false,
    },
  ];
}

// 步骤一：基本配置 scheme 部分 视图弹窗
export const getStep1_View: FormSchema[] = [
  {
    field: 'dbcode',
    component: 'Input',
    label: '名称',
    required: true,
    colProps,
  },
  {
    field: 'sql',
    label: 'SQL',
    component: 'InputTextArea',
    required: true,
    colProps,
  },
];

export const step2Schemas: FormSchema[] = [
  {
    field: 'pwd',
    component: 'InputPassword',
    label: '支付密码',
    required: true,
    defaultValue: '123456',
    colProps: {
      span: 24,
    },
  },
];
