import React from 'react';
import { Button, Table, notification, Popconfirm } from 'antd';
import request from '@/utils/request';
import apis from '@/services/apis';
import { getImgURL } from '@/utils/image';
import AuthButton from '@/components/AuthButton'

export default props => {
  const { data,loading } = props;

  const columns = [
    {
      title: '封面图',
      dataIndex: 'coverImg',
      key: 'coverImg',
      render: (x, record) => (
        <img
          style={{ width: '150px', height: '120px', borderRadius: '4px' }}
          src={getImgURL(x)}
          alt=""
        />
      ),
    },
    {
      title: '类型',
      dataIndex: 'panoramaType',
      key: 'panoramaType',
      render: (x, record) => <span>{x === 'apartment' ? '户型' : '项目'}</span>,
    },
    {
      title: '内容',
      dataIndex: 'content',
      key: 'content',
    },
    {
      title: '链接地址',
      dataIndex: 'panoramaLink',
      key: 'panoramaLink',
    },
    {
      title: '操作',
      dataIndex: 'apartmentId',
      key: 'apartmentId',
      render: (_, record) => (
        <AuthButton name="building.panorama.delete">
          <Popconfirm title="确定要进行删除操作 ?" onConfirm={() => props.onDelete(record)}>
            <Button type="link" style={{ color: 'red' }}>
              删除
            </Button>
          </Popconfirm>
        </AuthButton>
      ),
    },
  ];

  return (
    <Table
      columns={columns}
      loading={loading}
      dataSource={data}
      style={{ marginTop: '1em', width: '100%' }}
      rowKey="apartmentId"
    />
  );
};
