import { Card } from 'antd';
import React from 'react';
import CancelCrud from '../../../components/crud/CancelCrud';
import useCrud from '../../../components/crud/useCrud';
import usePageTable from '../../../components/crud/usePageTable';
import { PageResult, Role } from '../../../service/def';
import { demoDate } from '../../../utils/utils';
import DataForm from './DataForm';
import DataTable from './DataTable';

async function demofind(): Promise<PageResult<Role>> {
  return {
    list: [
      {
        name: '管理员',
        desc: '全部权限',
      },
      {
        name: '查看用户',
        desc: 'xxxxxxxxxxxx',
      },
      {
        name: '财务',
        desc: 'xxxxxxxxxxxx',
      },
      {
        name: '项目经理',
        desc: 'xxxxxxxxxxxx',
      },
    ],
    totalRow: 4
  };
}

const RolePage: React.FC = () => {

  const crud = useCrud();

  const pager = usePageTable<Role>(demofind);

  return (
    <div className="content-root">
      {
        crud.mode === 'new' ? (
          <Card key="new" title="新增角色" extra={<CancelCrud crudCtx={crud} confirm />} >
            <DataForm />
          </Card>
        ) : null
      }
      {
        !crud.mode ? <DataTable crudCtx={crud} pagerCtx={pager} /> : null
      }
    </div>
  )
}

export default RolePage