import TransForm from '../src/TransForm.vue';
import '../src/styles/trans-form.css';

export default {
  title: 'TransForm/Basic',
  component: TransForm,
};

const schema = [
  {
    row: 6,
    logic: 'AND',
    'value-component': 'input',
    field: 'name',
    'field-name': '名称',
    'query-option': [
      { value: 'EQ', label: '=', 'desc-cn': '等于' },
      { value: 'LIKE', label: '~', 'desc-cn': '包含' },
    ],
  },
  {
    row: 6,
    logic: 'OR',
    'value-component': 'select',
    field: 'status',
    'field-name': '状态',
    options: [
      { value: 'active', label: '启用' },
      { value: 'inactive', label: '停用' },
    ],
    'query-option': [
      { value: 'EQ', label: '=', 'desc-cn': '等于' },
      { value: 'NE', label: '≠', 'desc-cn': '不等于' },
    ],
  },
  {
    row: 4,
    logic: 'AND',
    'value-component': 'tags',
    field: 'tags',
    'field-name': '标签',
    'in-ui': 'tags',
    'query-option': [{ value: 'IN', label: '∈', 'desc-cn': '包含任一' }],
  },
  {
    row: 4,
    logic: 'AND',
    'value-component': 'between',
    field: 'created',
    'field-name': '创建时间',
    'between-ui': 'between',
    'query-option': [{ value: 'BETWEEN', label: '↔', 'desc-cn': '区间' }],
  },
  {
    row: 4,
    logic: 'AND',
    'value-component': 'number',
    field: 'age',
    'field-name': '年龄',
    'query-option': [
      { value: 'GT', label: '>', 'desc-cn': '大于' },
      { value: 'LT', label: '<', 'desc-cn': '小于' },
    ],
  },
  {
    row: 6,
    logic: 'AND',
    'value-component': 'date',
    field: 'birthday',
    'field-name': '生日',
    'query-option': [{ value: 'EQ', label: '=', 'desc-cn': '等于' }],
  },
  {
    row: 6,
    logic: 'AND',
    'value-component': 'textarea',
    field: 'remark',
    'field-name': '备注',
    'query-option': [{ value: 'LIKE', label: '~', 'desc-cn': '包含' }],
  },
];

export const Default = {
  args: {
    schema,
    showReset: true,
  },
};