/*
 * @Description:
 * @Author: jiass
 * @Date: 2022-01-26 10:46:27
 * @LastEditTime: 2022-04-08 16:17:09
 * @LastEditors: lanzhisheng
 */
import React, { FC } from "react";
import { View } from "@tarojs/components";

type LoadingButtonProps = {
  loading?: boolean;
  type: "primary" | "normal";
  onClick?: Function;
};

const LoadingButton: FC<LoadingButtonProps> = (props) => {
  const { loading, type, onClick } = props;
  const classnames =
    type === "primary" ? "meix_button meix_button_primary" : "meix_button";
  const clickHandler = () => {
    !loading && onClick && onClick();
  };
  return (
    <View
      hoverClass={onClick ? "meix_button_hover" : ""}
      className={loading ? `${classnames} meix_button_hover` : classnames}
      onClick={clickHandler}
    >
      {loading && <View className="meix_loading_icon"></View>}
      <View>{props.children}</View>
    </View>
  );
};

export default LoadingButton;