import React, { forwardRef } from 'react';
import PropTypes from 'prop-types';
import VtxBaseModal from '../vtx-base-modal';
import BaseContent from './base';
import ThrowContent from './throw';
import DeviceContent from './device';
import CollectContent from './collect';
import './style';
const TABS_BASE = 'delivery-point-base';
const TABS_THROW = 'delivery-point-throw';
const TABS_DEVICE = 'delivery-point-device';
const TABS_COLLECT = 'delivery-point-collect';

const VtxCommunityModal = forwardRef(props => {
    const { id, visible, title, subTitle, onCancel } = props;
    return (
        <VtxBaseModal
            title={title}
            subTitle={subTitle}
            visible={visible}
            onCancel={onCancel}
            tabs={[
                { key: TABS_BASE, value: '基础信息' },
                { key: TABS_DEVICE, value: '设备信息' },
                { key: TABS_THROW, value: '投放信息' },
                { key: TABS_COLLECT, value: '收运信息' },
            ]}
            contents={[
                { key: TABS_BASE, content: <BaseContent id={id} /> },
                { key: TABS_DEVICE, content: <DeviceContent id={id} /> },
                { key: TABS_THROW, content: <ThrowContent id={id} /> },
                { key: TABS_COLLECT, content: <CollectContent id={id} /> },
            ]}
        />
    );
});

VtxCommunityModal.propTypes = {
    id: PropTypes.string,
    visible: PropTypes.bool,
    onCancel: PropTypes.func,
    subTitle: PropTypes.string,
    title: PropTypes.string,
};
export default VtxCommunityModal;