import { h, computed } from 'vue';
import { BasicColumn, FormProps } from '/@/components/Table';
import { Time } from '/@/components/Time';
import { useMessage } from '/@/hooks/web/useMessage';
import { useI18n } from '/@/hooks/web/useI18n';
import { useLocaleStore } from '/@/store/modules/locale';
const localeStore = useLocaleStore();
const { createMessage } = useMessage();
const { t } = useI18n();
const isJA = computed(() => localeStore.getLocale === 'en');

export const columns: BasicColumn[] = [
  {
    title: '场景标题',
    dataIndex: 'sceneName',
    width: 150,
    customRender: ({ record }) => {
      return (
        <a href={record.webSite || record.thumb} target="_blank">
          {record.sceneName}
        </a>
      );
    },
  },
  {
    title: '场景码',
    dataIndex: 'num',
    ellipsis: true,
    width: 80,
  },
  {
    title: '拍摄时间',
    dataIndex: 'createTime',
    width: 180,
    customRender: ({ record }) => {
      return (
        record.createTime &&
        h(Time, {
          value: record.createTime,
          mode: 'datetime',
        })
      );
    },
  },
  {
    title: '计算完成时间',
    dataIndex: 'amount',
    width: 180,
    customRender: ({ record }) => {
      return (
        (record.createTime &&
          h(Time, {
            value: record.createTime,
            mode: 'datetime',
          })) ||
        '-'
      );
    },
  },
  {
    title: 'SN码',
    dataIndex: 'snCode',
    width: 180,
  },
  {
    title: '场景大小',
    dataIndex: 'sceneSize',
    width: 80,
    customRender: ({ record }) => {
      return h('span', { class: 'sceneSize' }, Math.ceil(record.sceneSize / 1024 / 1024) + 'M');
    },
  },
  {
    title: '是否复制',
    dataIndex: 'isCopy',
    width: 80,
    customRender: ({ record }) => {
      return record.isCopy ? '是' : '否';
    },
  },
  {
    title: '复制时间',
    dataIndex: 'copyTime',
    width: 180,
    customRender: ({ record }) => {
      return record.copyTime
        ? h(Time, {
            value: record.copyTime,
            mode: 'datetime',
          })
        : '-';
    },
  },
  {
    title: '绑定账号',
    dataIndex: 'userName',
    width: 100,
  },
  {
    title: '浏览量',
    dataIndex: 'viewCount',
    width: 80,
  },
  {
    title: '状态',
    dataIndex: 'statusString',
    width: 80,
    // customRender: ({ record }) => {
    //   let str;
    //   switch (record.status - 0) {
    //     case 0:
    //       str = '计算中';
    //       break;
    //     case 1:
    //       str = '计算成功';
    //       break;
    //     case -2:
    //       str = '计算成功';
    //       break;
    //     case -1:
    //       str = '计算失败';
    //       break;
    //   }
    //   return record.payStatus == 1 ? '封存' : str;
    // },
  },
  {
    title: '操作',
    dataIndex: 'action',
    slots: { customRender: 'action' },
    ifShow: true,
    fixed: 'right',
    flag: 'ACTION',
    width: 330,
  },
];

export const searchForm: Partial<FormProps> = {
  labelWidth: 100,
  schemas: [
    {
      field: 'sceneName',
      label: '场景标题',
      component: 'Input',
      componentProps: {
        maxLength: 100,
      },
      colProps: {
        xl: 7,
        xxl: 7,
      },
    },
    {
      field: 'snCode',
      label: 'SN码',
      component: 'Input',
      componentProps: {
        maxLength: 100,
      },
      colProps: {
        xl: 6,
        xxl: 6,
      },
    },
  ],
};

export const cameraScene: BasicColumn[] = [
  {
    title: '作品标题',
    dataIndex: 'name',
    width: 150,
    customRender: ({ record }) => {
      return (
        <a href={record.webSite || record.thumb} target="_blank">
          {record.name}
        </a>
      );
      // return record.name ? h('span', record.name) : '-';
    },
  },
  {
    title: '作品码',
    dataIndex: 'sceneCodes',
    ellipsis: true,
    width: 180,
  },
  {
    title: '用户账号',
    dataIndex: 'userId',
    width: 100,
  },

  {
    title: '创建时间',
    dataIndex: 'createTime',
    width: 180,
    customRender: ({ record }) => {
      return record.createTime
        ? h(Time, {
            value: record.createTime,
            mode: 'datetime',
          })
        : '-';
    },
  },
  {
    title: '最新编辑时间',
    dataIndex: 'updateTime',
    width: 180,
    customRender: ({ record }) => {
      return record.updateTime
        ? h(Time, {
            value: record.updateTime,
            mode: 'datetime',
          })
        : '-';
    },
  },
  {
    title: '是否加密',
    dataIndex: 'status',
    width: 80,
    customRender: ({ record }) => {
      return record.isCopy ? '是' : '否';
    },
  },
  {
    title: '浏览量',
    dataIndex: 'visit',
    width: 80,
  },
  {
    title: '操作',
    dataIndex: 'action',
    slots: { customRender: 'action' },
    ifShow: true,
    fixed: 'right',
    flag: 'ACTION',
    width: 50,
  },
];

export const cameraSearchForm: Partial<FormProps> = {
  labelWidth: 100,
  schemas: [
    {
      field: 'sceneName',
      label: '场景标题',
      component: 'Input',
      componentProps: {
        maxLength: 100,
      },
      colProps: {
        xl: 7,
        xxl: 7,
      },
    },
    {
      field: 'snCode',
      label: 'SN码',
      component: 'Input',
      componentProps: {
        maxLength: 100,
      },
      colProps: {
        xl: 7,
        xxl: 7,
      },
    },
  ],
};

export const quanjSearchForm: Partial<FormProps> = {
  labelWidth: 100,
  schemas: [
    {
      field: 'sceneName',
      label: '作品标题',
      component: 'Input',
      componentProps: {
        maxLength: 100,
      },
      colProps: {
        xl: 7,
        xxl: 7,
      },
    },
    // {
    //   field: 'snCode',
    //   label: '作品码',
    //   component: 'Input',
    //   componentProps: {
    //     maxLength: 100,
    //   },
    //   colProps: {
    //     xl: 7,
    //     xxl: 7,
    //   },
    // },
  ],
};