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

import { computed, ref } from 'vue';

import dayjs from 'dayjs';

import { $t } from '#/locales';

import { getSelectResultList } from '#/api-client';

// 手动加载选项数据
const systemNameOptions = ref<Array<{ label: string; value: string }>>([]);

const loadSystemNameOptions = async () => {
  try {
    const { data } = await getSelectResultList({
      params: {
        query: {
          TypeName: 'BusinessSystemEnum',
        },
      },
    });
    console.log('API Response:', data);
    if (data?.items) {
      systemNameOptions.value = data.items.map((item: any) => ({
        label: item.secondValue || '',
        value: item.value || '',
      }));
      console.log('Processed Options:', systemNameOptions.value);
    }
  } catch (error) {
    console.error('Failed to load system name options:', error);
  }
};

// 立即加载数据
loadSystemNameOptions();

export const querySchema = computed(() => [
  {
    component: 'Input',
    fieldName: 'FocusAddress',
    label: $t('abp.focus.focusAddress'),
  },
  {
    component: 'Select',
    fieldName: 'SystemName',
    label: $t('abp.IoTDBBase.SystemName'),
    componentProps: computed(() => ({
      options: systemNameOptions.value,
      allowClear: true,
    })),
  },
]);
export const tableSchema: any = computed((): VxeGridProps['columns'] => [
  { title: $t('common.seq'), type: 'seq', width: 50 },
  { field: 'systemName', title: $t('abp.log.systemName'), minWidth: '150' },
  {
    field: 'projectId',
    title: $t('abp.log.projectId'),
    minWidth: '150',
  },
  {
    field: 'dataType',
    title: $t('abp.log.dataType'),
    minWidth: '150',
  },
  {
    field: 'deviceType',
    title: $t('abp.log.deviceType'),
    minWidth: '150',
  },
  {
    field: 'times',
    title: $t('abp.log.timestamps'),
    minWidth: '150',
    formatter: ({ cellValue }) => {
      return dayjs(cellValue).format('YYYY-MM-DD HH:mm:ss');
    },
  },
]);