import React from 'react';
import { JumboTabs } from 'antd-mobile';
import {
  JumboTabProps,
  JumboTabsProps,
} from 'antd-mobile/es/components/jumbo-tabs/jumbo-tabs';
require('./index.less');

export type XJumboTabsProps = {
  JumboTabsProps?: JumboTabsProps;
  JumboTabArrayProps: JumboTabProps[];
};

/**
 * 说明：封装超长自动滚动选项卡组件
 * 创建人：JoeCdy
 * 创建时间：2022/7/6
 */
const XJumboTabs: React.FC<XJumboTabsProps> = (props) => {
  const { JumboTabsProps, JumboTabArrayProps } = props;

  return (
    <div id={'x-jumbo-tabs'} style={{ height: '100%' }}>
      <JumboTabs {...JumboTabsProps} style={{ height: '100%' }}>
        {JumboTabArrayProps.map((value, index) => {
          return <JumboTabs.Tab key={index} {...value} />;
        })}
      </JumboTabs>
    </div>
  );
};
export default XJumboTabs;