# src/Star.js File

    import React, {PropTypes} from 'react';
    import Component from './utils/Component';
    import classnames from 'classnames';
    import {setPhoenixPrefix} from './utils/Tool';

    /**
     * <h5>基础组件，主要包括:</h5>
     * <strong><a href='../classes/Star.html'>Star 星级</a></strong><br/>
     * <strong><a href='../classes/Button.html'>Button 按钮</a></strong><br>
     *  <strong><a href='../classes/ButtonGroup.html'>ButtonGroup 按钮组</a></strong><br>
     * <h6>点击以上链接或者左侧导航栏的组件名称链接进行查看</h6>
     * @module 基础组件
     * @main 基础组件
     * @static
     */
    /**
     * 星级评价组件<br />
     * - 通过Rate设置星级评价的分数, 最低0, 最高50, 5的倍数。
     * - 通过phSize设置大小, 可选sm、md、lg。
     *
     * 主要属性和接口：
     * - phSize(v1.1.2以下用size):星星的大小。分别为sm、md、lg, 默认sm。 <br/>
     * 如：`<Star phSize="lg" />`
     * - Rate:星级评价的分数。最低0, 最高50, 5的倍数递增, 默认0。 <br/>
     * 如：`<Star Rate={10} />`
     *
     * @class Star
     * @module 基础组件
     * @extends Component
     * @constructor
     * @since 0.1.0
     * @demo star|star.js {展示}
     * @show true
     * */

    export default class Star extends Component{
        static propTypes = {
            /**
             * 星级评价分数
             * @property Rate
             * @type number
             * @default 默认为0，最高50
             * */
            Rate:PropTypes.number,
            /**
             * 星星大小
             * @property phSize
             * @type String
             * @default 'sm'
             * */
            phSize:PropTypes.string,
            /**
             * 样式前缀
             * @property classPrefix
             * @type String
             * @default 'star'
             * */
            classPrefix: PropTypes.string,
        };

        static defaultProps = {
            phSize: 'sm',
            classPrefix: 'star',
            Rate: 0,
            classMapping: {}
        };

        constructor(props,context){
            super(props,context);
        }

        render(){
            let {Rate,className} = this.props;
            let rateCls = 'star-'+ Math.round((Rate*2)/10)*5;
            // let sizeCls = size && 'star-'+size;

            return (
                <div className={classnames(
                    this.getProperty(true),
                    setPhoenixPrefix(rateCls),
                    className
                )}>
                    <div className={setPhoenixPrefix("star-grey")}></div>
                </div>
            )
        }
    }