import { ElButton } from 'element-plus'

import Switch from '#/components/Switch'
import filterDate from '#/hooks/filterDate'

export default (event: { [key: string]: any }): TableColumn[] => [
  { label: '角色名称', prop: 'name', 'min-width': 150 },
  { label: '角色描述', prop: 'remark', 'min-width': 300 },
  { label: '角色人数', prop: 'userCount', width: 100 },
  {
    label: '修改时间',
    prop: 'updateTime',
    'min-width': 160,
    'show-overflow-tooltip': true,
    render: (h, { row }) =>
      row.updateTime ? filterDate(row.updateTime) : filterDate(row.createTime),
  },
  {
    label: '创建时间',
    prop: 'createTime',
    'min-width': 160,
    'show-overflow-tooltip': true,
    render: (h, { row }) => filterDate(row.createTime),
  },
  {
    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}
        ></Switch>
      )
    },
  },
  {
    label: '操作',
    'min-width': 320,
    render: (h, scope) => {
      return (
        <div>
          <ElButton
            onClick={() => event.handleClick(0, scope.row)}
            type="primary"
          >
            授权
          </ElButton>
          <ElButton
            onClick={() => event.handleClick(1, scope.row)}
            type="primary"
          >
            编辑
          </ElButton>
          <ElButton onClick={() => event.handleClick(2, scope.row)}>
            删除
          </ElButton>
        </div>
      )
    },
  },
]
