import { PageContainer, ProList } from '@ant-design/pro-components';
import { Card, Space, Tag } from 'antd';
import moment from 'moment';
import request from 'umi-request';
import { ConclusionItem } from './conclusionItem';
import transShift from '@/utils/common';

const Logs: React.FC = () => {
  return (
    <PageContainer>
      <Card>
        <ProList<ConclusionItem>
          search={{
            filterType: 'light',
          }}
          rowKey="op"
          headerTitle="值班总结列表"
          request={async (params = {} as Record<string, any>) =>
            request<{
              data: ConclusionItem[];
            }>('/leader/conclusionlist', {
              params,
            })
          }
          pagination={{
            pageSize: 10,
          }}
          metas={{
            title: {
              dataIndex: 'op',
              title: '用户',
            },
            avatar: {
              dataIndex: 'avatar',
              search: false,
            },
            subTitle: {
              dataIndex: ['week', 'shift'],
              render: (_, row) => {
                return (
                  <Space size={0}>
                    <Tag color="blue" key={row.op}>
                      {transShift(row.week, row.shift)}
                    </Tag>
                  </Space>
                );
              },
              title: '值班时间',
              search: false,
            },
            description: {
              dataIndex: 'detail',
              search: false,
              render: (_, row) => {
                return (
                  <div>
                    {row.detail}
                  </div>
                );
              },
            },
            extra: {
              dataIndex: 'time',
              render: (_: React.ReactNode, row: ConclusionItem) => {
                return (
                  <div style={{ marginLeft: '3vh' }}>
                    {moment(row.time).format('YYYY-M-D HH:mm:ss')}
                  </div>
                );
              },
              search: false,
            },
            actions: {
              render: () => [
                <a href="" target="_blank" rel="noopener noreferrer" key="view">
                  查看
                </a>,
              ],
              search: false,
            },
            week: {
              // 自己扩展的字段，主要用于筛选，不在列表中显示
              title: '星期',
              valueType: 'select',
              valueEnum: {
                all: { text: '全部', status: 'Default' },
                mon: {
                  text: '周一',
                },
                tue: {
                  text: '周二',
                },
                wed: {
                  text: '周三',
                },
                thu: {
                  text: '周四',
                },
                fri: {
                  text: '周五',
                },
                sat: {
                  text: '周六',
                },
                sun: {
                  text: '周日',
                },
              },
            },
            shift: {
              // 自己扩展的字段，主要用于筛选，不在列表中显示
              title: '值班',
              valueType: 'select',
              valueEnum: {
                all: { text: '全部', status: 'Default' },
                first: {
                  text: '第一班',
                },
                second: {
                  text: '第二班',
                },
                third: {
                  text: '第三班',
                },
              },
            },
          }}
        />
      </Card>
    </PageContainer>
  );
};
export default Logs;
