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

import { computed, h } from 'vue';

import { z } from '@vben/common-ui';

import dayjs from 'dayjs';

import { postOneNetAccountListAsync } from '#/api-client';
import { $t } from '#/locales';

export const querySchema = computed(() => [
  {
    component: 'Input',
    fieldName: 'productName',
    label: $t('abp.OneNETManagement.ProductName'),
  },
]);

export const tableSchema: any = computed((): VxeGridProps['columns'] => [
  { title: $t('common.seq'), type: 'seq', width: 50 },
  {
    field: 'oneNETAccountName',
    title: $t('common.BelongingAccountName'),
    minWidth: '150',
  },
  {
    field: 'ioTPlatformProductId',
    title: $t('abp.OneNETManagement.OneNETProductId'),
    minWidth: '150',
  },
  {
    field: 'productName',
    title: $t('abp.OneNETManagement.ProductName'),
    minWidth: '150',
  },
  {
    field: 'productAccesskey',
    title: $t('abp.OneNETManagement.ProductAccesskey'),
    minWidth: '150',
  },
  {
    field: 'communicationAddress',
    title: $t('abp.OneNETManagement.CommunicationAddress'),
    minWidth: '150',
  },
  {
    field: 'communicationAddressTLS',
    title: $t('abp.OneNETManagement.CommunicationAddressTLS'),
    minWidth: '150',
  },
  {
    field: 'isEnabled',
    title: $t('common.isEnable'),
    minWidth: '130',
    slots: { default: 'isEnable' },
  },
  {
    field: 'isNeedPushData',
    title: $t('abp.OneNETManagement.IsNeedPushData'),
    minWidth: '150',
    slots: { default: 'isNeedPushData' },
  },
  {
    field: 'thingModelFileName',
    title: $t('abp.OneNETManagement.ThingModelFileName'),
    minWidth: '150',
    slots: { default: 'thingModelFileName' },
  },
  {
    field: 'productCreateTime',
    title: $t('abp.OneNETManagement.IoTPlatformProductCreateTime'),
    minWidth: '150',
    formatter: ({ cellValue }) => {
      return cellValue ? dayjs(cellValue).format('YYYY-MM-DD HH:mm:ss') : '';
    },
  },
  {
    field: 'productUpdateTime',
    title: $t('abp.OneNETManagement.IoTPlatformProductUpdateTime'),
    minWidth: '150',
    formatter: ({ cellValue }) => {
      return cellValue ? dayjs(cellValue).format('YYYY-MM-DD HH:mm:ss') : '';
    },
  },
  {
    field: 'creationTime',
    title: $t('abp.OneNETManagement.CreationTime'),
    minWidth: '150',
    formatter: ({ cellValue }) => {
      return cellValue ? dayjs(cellValue).format('YYYY-MM-DD HH:mm:ss') : '';
    },
  },
  {
    field: 'lastModificationTime',
    title: $t('abp.OneNETManagement.LastModificationTime'),
    minWidth: '150',
    formatter: ({ cellValue }) => {
      return cellValue ? dayjs(cellValue).format('YYYY-MM-DD HH:mm:ss') : '';
    },
  },
  {
    title: $t('common.action'),
    field: 'action',
    fixed: 'right',
    width: '380',
    slots: { default: 'action' },
  },
]);

// 全局变量存储选择的文件
export let selectedFile: File | null = null;

// 文件选择回调函数
let _onFileSelected: ((file: File) => void) | null = null;

export function setFileSelectedCallback(callback: (file: File) => void) {
  _onFileSelected = callback;
}

export const addProductFormSchema: any = computed(() => [
  {
    component: 'ApiSelect',
    fieldName: 'oneNETAccountId',
    label: $t('common.BelongingAccountName'),
    componentProps: {
      api: postOneNetAccountListAsync,
      params: {
        body: {
          pageIndex: 1,
          pageSize: 1000,
        },
      },
      // 下拉展示手机号（而非账户名），与设备管理侧账号选择保持一致
      labelField: 'phoneNumber',
      valueField: 'oneNETAccountId',
      immediate: true,
      afterFetch: (res: any) => {
        // 如果是 Axios 响应对象，提取 data
        if (res && res.data) {
          const data = res.data;

          // 确保返回的是数组格式
          if (Array.isArray(data)) {
            return data;
          }
          // 如果是包装在 items 中的，提取出来
          if (data && Array.isArray(data.items)) {
            return data.items;
          }
          // 如果是包装在 data 中的，提取出来
          if (data && Array.isArray(data.data)) {
            return data.data;
          }
        }

        // 如果都不是，返回空数组
        return [];
      },
      placeholder: `${$t('common.pleaseSelect')}${$t('common.BelongingAccountName')}`,
    },
    rules: z.string().min(1, {
      message: `${$t('common.pleaseSelect')}${$t('common.BelongingAccountName')}`,
    }),
  },
  {
    component: 'Input',
    fieldName: 'ioTPlatformProductId',
    label: $t('abp.OneNETManagement.OneNETProductId'),
    rules: z.string().min(1, {
      message: `${$t('common.pleaseInput')}${$t('common.info')}${$t('abp.OneNETManagement.OneNETProductId')}`,
    }),
  },
  {
    component: 'Input',
    fieldName: 'productAccesskey',
    label: $t('abp.OneNETManagement.ProductAccesskey'),
    rules: z.string().min(1, {
      message: `${$t('common.pleaseInput')}${$t('common.info')}${$t('abp.OneNETManagement.ProductAccesskey')}`,
    }),
  },
  {
    component: 'Input',
    fieldName: 'communicationAddress',
    label: $t('abp.OneNETManagement.CommunicationAddress'),
  },
  {
    component: 'Input',
    fieldName: 'communicationAddressTLS',
    label: $t('abp.OneNETManagement.CommunicationAddressTLS'),
  },
  {
    component: 'Input',
    fieldName: 'thingModelFileName',
    label: $t('abp.OneNETManagement.ThingModelFileName'),
    componentProps: {
      placeholder: '请选择文件',
      readonly: true,
      addonAfter: h(
        'button',
        {
          type: 'button',
          style:
            'border: none; background: #1890ff; color: white; padding: 4px 8px; border-radius: 4px; cursor: pointer;',
          onClick: () => {
            const input = document.createElement('input');
            input.type = 'file';
            input.accept = '.json,.xlsx,.xls';
            input.addEventListener('change', (e: any) => {
              const file = e.target.files[0];
              if (file) {
                // 只显示文件名，不上传
                const currentInput = document.querySelector(
                  'input[placeholder="请选择文件"]',
                ) as HTMLInputElement;
                if (currentInput) {
                  currentInput.value = file.name;
                  // 触发change事件
                  currentInput.dispatchEvent(
                    new Event('input', { bubbles: true }),
                  );
                  currentInput.dispatchEvent(
                    new Event('change', { bubbles: true }),
                  );

                  // 存储文件对象到全局变量，用于后续上传
                  selectedFile = file;
                  // 调用回调函数
                  if (_onFileSelected) {
                    _onFileSelected(file);
                  }
                }
                console.log(
                  '文件已选择:',
                  file.name,
                  '大小:',
                  file.size,
                  '字节',
                );
              }
            });
            input.click();
          },
        },
        '选择文件',
      ),
    },
    rules: z.string().min(1, {
      message: `${$t('common.pleaseSelect')}${$t('abp.OneNETManagement.ThingModelFileName')}`,
    }),
  },
  {
    component: 'Input',
    fieldName: 'thingModelFileId',
    label: '',
    componentProps: {
      type: 'hidden',
    },
  },
]);

export const editProductFormSchemaEdit: any = computed(() => [
  {
    component: 'ApiSelect',
    fieldName: 'oneNETAccountId',
    label: $t('common.BelongingAccountName'),
    componentProps: {
      api: postOneNetAccountListAsync,
      params: {
        body: {
          pageIndex: 1,
          pageSize: 1000,
        },
      },
      // 下拉展示手机号（而非账户名），与设备管理侧账号选择保持一致
      labelField: 'phoneNumber',
      valueField: 'oneNETAccountId',
      immediate: true,
      disabled: true, // 编辑时禁用
      afterFetch: (res: any) => {
        // 如果是 Axios 响应对象，提取 data
        if (res && res.data) {
          const data = res.data;

          // 确保返回的是数组格式
          if (Array.isArray(data)) {
            return data;
          }
          // 如果是包装在 items 中的，提取出来
          if (data && Array.isArray(data.items)) {
            return data.items;
          }
          // 如果是包装在 data 中的，提取出来
          if (data && Array.isArray(data.data)) {
            return data.data;
          }
        }

        // 如果都不是，返回空数组
        return [];
      },
      placeholder: `${$t('common.pleaseSelect')}${$t('abp.OneNETManagement.BelongingAccountName')}`,
    },
    rules: z.string().min(1, {
      message: `${$t('common.pleaseSelect')}${$t('abp.OneNETManagement.BelongingAccountName')}`,
    }),
  },
  {
    component: 'Input',
    fieldName: 'ioTPlatformProductId',
    label: $t('abp.OneNETManagement.OneNETProductId'),
    disabled: true,
    componentProps: {
      readonly: true, // 编辑时只读
    },
    rules: z.string().min(1, {
      message: `${$t('common.pleaseInput')}${$t('common.info')}${$t('abp.OneNETManagement.OneNETProductId')}`,
    }),
  },
  {
    component: 'Input',
    fieldName: 'productAccesskey',
    label: $t('abp.OneNETManagement.ProductAccesskey'),
    disabled: true,
    componentProps: {
      readonly: true, // 编辑时只读
    },
    rules: z.string().min(1, {
      message: `${$t('common.pleaseInput')}${$t('common.info')}${$t('abp.OneNETManagement.ProductAccesskey')}`,
    }),
  },
  {
    component: 'Input',
    fieldName: 'communicationAddress',
    label: $t('abp.OneNETManagement.CommunicationAddress'),
  },
  {
    component: 'Input',
    fieldName: 'communicationAddressTLS',
    label: $t('abp.OneNETManagement.CommunicationAddressTLS'),
  },
  {
    component: 'Input',
    fieldName: 'thingModelFileName',
    label: $t('abp.OneNETManagement.ThingModelFileName'),
    componentProps: {
      placeholder: '请选择文件',
      readonly: true,
      addonAfter: h(
        'button',
        {
          type: 'button',
          style:
            'border: none; background: #1890ff; color: white; padding: 4px 8px; border-radius: 4px; cursor: pointer;',
          onClick: () => {
            const input = document.createElement('input');
            input.type = 'file';
            input.accept = '.json,.xlsx,.xls';
            input.addEventListener('change', (e: any) => {
              const file = e.target.files[0];
              if (file) {
                // 只显示文件名，不上传
                const currentInput = document.querySelector(
                  'input[placeholder="请选择文件"]',
                ) as HTMLInputElement;
                if (currentInput) {
                  currentInput.value = file.name;
                  // 触发change事件
                  currentInput.dispatchEvent(
                    new Event('input', { bubbles: true }),
                  );
                  currentInput.dispatchEvent(
                    new Event('change', { bubbles: true }),
                  );

                  // 存储文件对象到全局变量，用于后续上传
                  selectedFile = file;
                  // 调用回调函数
                  if (_onFileSelected) {
                    _onFileSelected(file);
                  }
                }
                console.log(
                  '文件已选择:',
                  file.name,
                  '大小:',
                  file.size,
                  '字节',
                );
              }
            });
            input.click();
          },
        },
        '选择文件',
      ),
    },
    rules: z.string().min(1, {
      message: `${$t('common.pleaseSelect')}${$t('abp.OneNETManagement.ThingModelFileName')}`,
    }),
  },
  {
    component: 'Input',
    fieldName: 'thingModelFileId',
    label: '',
    componentProps: {
      type: 'hidden',
    },
  },
]);
