import { Space } from 'antd'
import React from 'react';
import picActive from '@/assets/images/event/picActive.png'
import pic from '@/assets/images/event/pic.png'
import listActive from '@/assets/images/event/listActive.png'
import list from '@/assets/images/event/list.png'


/**
 * 
 * @description 切换视图 列表&卡片
 */

interface ToggleViewProps {
  type: string;
  setType: (type: 'list' | 'pic') => void;
}

const ToggleView: React.FC<ToggleViewProps> = (props) => {

  const { type, setType } = props;

  return (
    <Space size={10}>
      <img
        src={type === 'pic' ? picActive : pic}
        onClick={() => setType('pic')}
        style={{ cursor: 'pointer' }}
      />
      <img
        src={type === 'list' ? listActive : list}
        onClick={() => setType('list')}
        style={{ cursor: 'pointer' }}
      />
    </Space>
  )
}

export default ToggleView;