import { ref } from 'vue';
import { cloneDeep } from 'lodash-es';
import { FormSchema } from '@/components/Form';
import { defRangeShortcuts } from '@/utils/dateUtil';

export class State {
  public id = 0;
  public eventId = '';
  public tenantCode = '';
  public eventType = '';
  public bizType = '';
  public bizId = '';
  public actorType = '';
  public actorId = '';
  public action = '';
  public resource = '';
  public resourceId = '';
  public result = '';
  public reason = '';
  public payload = '';
  public envelope = '';
  public occurredAt = '';
  public receivedAt = '';

  constructor(state?: Partial<State>) {
    if (state) Object.assign(this, state);
  }
}

export function newState(state: State | Record<string, any> | null): State {
  if (state !== null) {
    if (state instanceof State) return cloneDeep(state);
    return new State(state);
  }
  return new State();
}

export const schemas = ref<FormSchema[]>([
  {
    field: 'tenantCode',
    component: 'NInput',
    label: '商户编码',
    componentProps: { placeholder: '请输入商户编码' },
  },
  {
    field: 'eventId',
    component: 'NInput',
    label: '事件ID',
    componentProps: { placeholder: '请输入事件ID' },
  },
  {
    field: 'eventType',
    component: 'NInput',
    label: '事件类型',
    componentProps: { placeholder: '请输入事件类型' },
  },
  {
    field: 'action',
    component: 'NInput',
    label: '动作',
    componentProps: { placeholder: '请输入动作' },
  },
  {
    field: 'resource',
    component: 'NInput',
    label: '资源',
    componentProps: { placeholder: '请输入资源' },
  },
  {
    field: 'resourceId',
    component: 'NInput',
    label: '资源ID',
    componentProps: { placeholder: '请输入资源ID' },
  },
  {
    field: 'result',
    component: 'NInput',
    label: '结果',
    componentProps: { placeholder: '请输入结果' },
  },
  {
    field: 'createdAt',
    component: 'NDatePicker',
    label: '接收时间',
    componentProps: {
      type: 'datetimerange',
      clearable: true,
      shortcuts: defRangeShortcuts(),
    },
  },
]);

export const columns = [
  { title: 'ID', key: 'id', align: 'left', width: 90 },
  { title: '商户', key: 'tenantCode', align: 'left', width: 120 },
  { title: '事件ID', key: 'eventId', align: 'left', width: 220 },
  { title: '事件类型', key: 'eventType', align: 'left', width: 190 },
  { title: '动作', key: 'action', align: 'left', width: 170 },
  { title: '资源', key: 'resource', align: 'left', width: 120 },
  { title: '资源ID', key: 'resourceId', align: 'left', width: 170 },
  { title: '操作者', key: 'actorId', align: 'left', width: 140 },
  { title: '结果', key: 'result', align: 'left', width: 100 },
  { title: '原因', key: 'reason', align: 'left', width: 160 },
  { title: '发生时间', key: 'occurredAt', align: 'left', width: 180 },
  { title: '接收时间', key: 'receivedAt', align: 'left', width: 180 },
];