/**
 * 徐立
 * 2019年9月29日
 * 该组件为按钮设计汇总，通过传入get值调取对应组件
 * btn+数字，为对应按钮方法，从左到右计算
 * 以下为样式类名说明
 * .btn_margin 按钮右边距
 * .btn 按钮通用样式
 * .btn_no 不通过专属样式
 * .btn_reject 驳回专属样式
 * 以下为自定义按钮数组说明
 * btnList 为传入数组，具体参数参考为以下
 * [
 * {
 *  type:primary, // 按钮基础样式 参考antd
 *  click:()=>{}, // 点击事件
 *  style:{}, // 自定义按钮样式,传入为对象
 *  content: '', // 自定义按钮内容
 *  margin: boolean, // 是否使用默认margin
 * }
 * ]
 */
import React from 'react';
import { Button } from 'antd';
import Item from 'antd-mobile/lib/popover/Item';
import styles from './styles.less';

export default function pagesBtn(props) {
	const {
		get,
		btnOne,
		disabled, // 按钮控制状态
		btnTwo,
		btnThree,
		btnList, // 自定义按钮时使用，传入数组进行按钮组装
		style, // 自定义单个按钮样式
		text, // 自定义按钮文本
		isSumbitLoading, // 提交状态
	} = props;
	switch (get) {
		/**
		 * 常用于发起流程底部按钮
		 */
		case '1':
			return (
				<div className={styles.btn_page}>
					<Button
						shape="round"
						className={[`${styles.btn_margin}`, `${styles.btn}`].join(' ')}
						disabled={disabled}
						onClick={btnOne}
						loading={isSumbitLoading}>
						暂存草稿
					</Button>
					<Button
						shape="round"
						loading={isSumbitLoading}
						className={styles.btn}
						onClick={btnTwo}
						disabled={disabled}
						type="primary">
						提交
					</Button>
				</div>
			);
		/**
		 * 常用于审核用底部按钮
		 */
		case '2':
			return (
				<div className={styles.btn_page}>
					<Button
						shape="round"
						disabled={disabled}
						className={[`${styles.btn_margin}`, `${styles.btn}`, `${styles.btn_no}`].join(' ')}
						onClick={btnOne}
						loading={isSumbitLoading && isSumbitLoading}>
						不通过
					</Button>
					<Button
						shape="round"
						disabled={disabled}
						loading={isSumbitLoading && isSumbitLoading}
						className={[`${styles.btn_margin}`, `${styles.btn}`, `${styles.btn_reject}`].join(' ')}
						onClick={btnTwo}>
						驳回
					</Button>
					<Button
						shape="round"
						disabled={disabled}
						className={styles.btn}
						type="primary"
						loading={isSumbitLoading && isSumbitLoading}
						onClick={btnThree}>
						通过
					</Button>
				</div>
			);
		/**
		 * 查询类底部按钮
		 */
		case '3':
			return (
				<div className={styles.btn_page}>
					<Button
						shape="round"
						disabled={disabled}
						className={styles.btn}
						type="primary"
						onClick={btnOne}
						loading={isSumbitLoading && isSumbitLoading}>
						查询
					</Button>
				</div>
			);
		/**
		 * 模态框常用底部按钮
		 */
		case '4':
			return (
				<div className={styles.btn_page}>
					<Button
						shape="round"
						disabled={disabled}
						className={[`${styles.btn_margin}`, `${styles.btn}`].join(' ')}
						onClick={btnOne}
						loading={isSumbitLoading && isSumbitLoading}>
						取消
					</Button>
					<Button
						shape="round"
						disabled={disabled}
						className={styles.btn}
						type="primary"
						onClick={btnTwo}
						loading={isSumbitLoading && isSumbitLoading}>
						确定
					</Button>
				</div>
			);
		/**
		 * 常用于审核底部按钮 驳回 通过
		 */
		case '5':
			return (
				<div className={styles.btn_page}>
					<Button
						shape="round"
						disabled={disabled}
						className={[`${styles.btn_margin}`, `${styles.btn}`, `${styles.btn_reject}`].join(' ')}
						onClick={btnOne}
						loading={isSumbitLoading && isSumbitLoading}>
						驳回
					</Button>
					<Button
						shape="round"
						disabled={disabled}
						className={styles.btn}
						loading={isSumbitLoading && isSumbitLoading}
						type="primary"
						onClick={btnTwo}>
						通过
					</Button>
				</div>
			);
		/**
		 * 常用于审核底部按钮 驳回 通过
		 */
		case '6':
			return (
				<div className={styles.btn_page}>
					<Button
						shape="round"
						disabled={disabled}
						className={[`${styles.btn_margin}`, `${styles.btn}`, `${styles.btn_no}`].join(' ')}
						onClick={btnOne}
						loading={isSumbitLoading && isSumbitLoading}>
						拒绝
					</Button>
					<Button
						shape="round"
						disabled={disabled}
						className={styles.btn}
						loading={isSumbitLoading && isSumbitLoading}
						type="primary"
						onClick={btnTwo}>
						通过
					</Button>
				</div>
			);
		/**
		 * 自定义按钮数量 样式 以及按钮内容
		 */
		case '7':
			return (
				<div className={styles.btn_page}>
					{btnList.length > 0
						? btnList.map((item, index) => {
								return (
									<Button
										shape="round"
										disabled={disabled}
										key={index}
										type={Item.type}
										style={item.style}
										onClick={item.click}
										loading={isSumbitLoading && isSumbitLoading}
										className={[`${item.margin ? styles.btn_margin : ''}`, `${styles.btn}`].join(
											' ',
										)}>
										{item.content}
									</Button>
								);
						  })
						: ''}
				</div>
			);
		/**
		 * 自定义单个组件按钮
		 */
		case '8':
			return (
				<Button
					shape="round"
					type={style === 'deafalut' ? 'primary' : ''}
					className={style !== 'deafalut' ? style : ''}
					style={{ minHeight: 32, minWidth: 90, marginLeft: style === 'deafalut' ? 16 : '' }}
					onClick={btnOne}
					loading={isSumbitLoading && isSumbitLoading}>
					{text}
				</Button>
			);
		default:
			return null;
	}
}
