import { ElButton, ElPopconfirm } from 'element-plus'

import Switch from '#/components/Switch'
import dayjs from '#/plugins/dayjs'

export default (
  event: { [key: string]: any },
  pageData: any,
): TableColumn[] => [
  // {
  //     label: '序号',
  //     width: 80,
  //     align: 'center',
  //     render: (h, scope) => {
  //         return <span>{(pageData.current - 1) * pageData.size + scope.$index}</span>;
  //     },
  // },
  // {
  //     label: '所属代理商',
  //     align: 'center',
  //     'show-overflow-tooltip': true,

  //     prop: 'agentName',
  // },
  {
    label: '用户姓名',
    prop: 'name',
  },

  {
    label: '用户账号',
    'show-overflow-tooltip': true,

    prop: 'account',
  },
  {
    label: '学校',
    'show-overflow-tooltip': true,

    prop: 'schoolName',
  },

  // {
  //     label: '班级',
  //     prop: 'classInSchool',
  // },
  {
    label: '会员时长',
    align: 'center',

    prop: 'vipLength',
  },
  {
    label: '活跃状态',
    prop: 'lastLoginTime',
    render: (h, scope) => {
      return (
        <span>
          {dayjs(scope.row.lastLoginTime ?? scope.row.createTime).fromNow()}
        </span>
      )
    },
  },
  {
    label: '状态',
    prop: '_status',
    width: 120,
    render: (h, scope) => {
      return (
        <Switch
          active-value={0}
          before-change={() => event.updateState(scope.row)}
          inactive-value={1}
          loading={scope.row.loading}
          v-model={scope.row.status}
        />
      )
    },
  },
  {
    label: '注册时间',
    prop: 'createTime',
    'show-overflow-tooltip': true,
    render: (h, scope) => {
      return dayjs(scope.row.createTime).format('YYYY/MM/DD HH:mm')
    },
  },
  {
    label: '操作',
    width: 380,
    align: 'center',
    fixed: 'right',
    render: (h, scope) => {
      return (
        <div>
          <ElButton
            onClick={() => event.handleClick(scope.row, 3)}
            type="primary"
          >
            编辑
          </ElButton>
          <ElButton
            onClick={() => event.handleClick(scope.row, 0)}
            type="primary"
          >
            延期
          </ElButton>
          <ElPopconfirm
            onConfirm={() => event.handleClick(scope.row, 1)}
            persistent
            title="确定恢复密码吗？"
            width="220"
          >
            {{
              reference: () => <ElButton type="primary">恢复密码</ElButton>,
            }}
          </ElPopconfirm>
          <ElButton
            onClick={() => event.handleClick(scope.row, 2)}
            type="primary"
          >
            详情
          </ElButton>
        </div>
      )
    },
  },
]
