import { h } from 'vue';
import type { BasicColumn } from '@/components/Table';
import { protocalTypeSelect } from './constant';
import useSceneInfos from '@/hooks/useSceneInfos';

// export const columns: BasicColumn[] = [
//   {
//     label: '序号',
//     minWidth: 60,
//     type: 'index',
//     fixed: 'left',
//   },
//   {
//     label: 'IP地址',
//     prop: 'cameraIp',
//     minWidth: 140,
//   },
//   {
//     label: '协议类型',
//     prop: 'cameraType',
//     minWidth: 120,
//     render(record) {
//       return h(
//         'span',
//         {},
//         {
//           default: () => {
//             return protocalTypeSelect.find((item) => item.value === record.row.cameraType)?.label;
//           },
//         },
//       );
//     },
//   },
//   {
//     label: '端口地址',
//     prop: 'cameraPort',
//     minWidth: 120,
//   },
//   {
//     label: '企业账号',
//     prop: 'tenantCode',
//     minWidth: 140,
//   },
//   {
//     label: '企业名称',
//     prop: 'tenantName',
//     minWidth: 140,
//   },
//   {
//     label: '设备ID',
//     prop: 'cameraCode',
//     minWidth: 150,
//   },
//   {
//     label: '车间场景',
//     prop: 'workspaceName',
//     minWidth: 140,
//   },
//   {
//     label: '工位场景',
//     prop: 'cameraWorkspace',
//     minWidth: 140,
//     render(record) {
//       const sceneInfos = useSceneInfos();
//       const { flattendWorkspaces } = sceneInfos;
//       return h(
//         'span',
//         {},
//         {
//           default: () => {
//             const code = flattendWorkspaces.value.find(
//               (item) => item.code === record.row.cameraWorkspace,
//             );
//             console.log('flattendWorkspaces', flattendWorkspaces.value);

//             console.log('record.row.cameraWorkspace', code);
//             return record.row.cameraWorkspace;
//             return flattendWorkspaces.value.find((item) => item.code === record.row.cameraWorkspace)
//               ?.id;

//             // return protocalTypeSelect.find((item) => item.value === record.row.cameraType)?.label;
//           },
//         },
//       );
//     },
//   },
// ];

export const getColumns = (flattendWorkspaces): BasicColumn[] => {
  return [
    {
      label: '序号',
      minWidth: 60,
      type: 'index',
      fixed: 'left',
    },
    {
      label: 'IP地址',
      prop: 'cameraIp',
      minWidth: 140,
    },
    {
      label: '协议类型',
      prop: 'cameraType',
      minWidth: 120,
      render(record) {
        return h(
          'span',
          {},
          {
            default: () => {
              return protocalTypeSelect.find((item) => item.value === record.row.cameraType)?.label;
            },
          },
        );
      },
    },
    {
      label: '端口地址',
      prop: 'cameraPort',
      minWidth: 120,
    },
    {
      label: '企业账号',
      prop: 'tenantCode',
      minWidth: 140,
    },
    {
      label: '企业名称',
      prop: 'tenantName',
      minWidth: 140,
    },
    {
      label: '设备ID',
      prop: 'code',
      minWidth: 150,
    },
    {
      label: '车间场景',
      prop: 'workspaceName',
      minWidth: 140,
    },
    {
      label: '工位场景',
      prop: 'cameraWorkspace',
      minWidth: 140,
      render(record) {
        // const sceneInfos = useSceneInfos();
        // const { flattendWorkspaces } = sceneInfos;
        return h(
          'span',
          {},
          {
            default: () => {
              return flattendWorkspaces?.find(
                (item) => item.id === Number(record.row.cameraWorkspace),
              )?.name;

              // return protocalTypeSelect.find((item) => item.value === record.row.cameraType)?.label;
            },
          },
        );
      },
    },
  ];
};
