/**
 * @author 挽枫
 * @description 项目中高级、尊享图标抽离
 */
import classNames from 'classnames';
import React from 'react';
import styles from './style.less';

interface Props {
  type: 'saas_basic' | 'saas_advanced' | 'saas_vip' | 'renew_advanced' | 'renew_vip'; // 产品类型+组件类型
  className?: string;
  style?: React.CSSProperties;
  renderText?: string; //自定义渲染的文字内容
  renderType?: 'layout' | 'card'; //渲染类型，平台分为两种一种是菜单栏的icon、一种是应用卡片上的图标
  isRenew?: boolean; //当前账户是否是renew账户
  isFullName?: boolean; //是否展示全称
}

const getEditionText = (isFullName: Props['isFullName'], type: Props['type']) => {
  const editionList = {
    saas_basic: '基础',
    saas_advanced: '高级',
    saas_vip: '尊享',
    renew_advanced: '企业',
    renew_vip: '开发'
  };
  return isFullName ? `${editionList[type]}版` : editionList[type];
};

const getType = (measureType, isRenew) => {
  if (measureType === 3) {
    return isRenew ? 'renew_vip' : 'saas_vip';
  }
  return isRenew ? 'renew_advanced' : 'saas_advanced';
};

const IconButton = (props: Props) => {
  const { className, style = { color: '#fff', marginLeft: '4px' }, renderText, renderType = 'layout', isFullName = false, type } = props;
  return (
    <span
      style={style}
      className={classNames(
        { [styles.iconAdvanced]: ['saas_advanced', 'renew_advanced'].includes(type) },
        { [styles.iconVip]: ['saas_vip', 'renew_vip'].includes(type) },
        { [styles.iconLayout]: renderType === 'layout' },
        { [styles.iconCard]: renderType === 'card' },
        className
      )}>
      {renderText ? renderText : getEditionText(isFullName, type)}
    </span>
  );
};

type ComponentIconType = {
  isRenew: boolean;
  measureType: number;
  className?: string;
  style?: React.CSSProperties;
  renderType?: 'layout' | 'card';
  renderText?: string; //自定义渲染的文字内容
  isFullName?: boolean; //是否显示全称
};
/**
 * @description 组件权限icon图标抽离，每个组件信息都有一个edition字段，2对应的是saas高级版和renew企业版，3对应的是saa尊享版和renew开发版
 * 独立部署版本不允许出现icon
 */
export const ComponentIcon = (props: ComponentIconType) => {
  const { isRenew = false, measureType, className, style, renderType = 'card', renderText, isFullName = false } = props;
  return !window.appConfig.LOCAL && [3, 2].includes(measureType) ? (
    <IconButton
      isFullName={isFullName}
      className={className}
      style={style}
      type={getType(measureType, isRenew)}
      renderType={renderType}
      renderText={renderText}
    />
  ) : null;
};

export default IconButton;
