/**
 * @file 日期选择框组件
 * @author Brian Li
 * @email lbxxlht@163.com
 * @version 0.0.1
 */
define(function (require) {


    var React = require('react');
    var MouseWidgetBase = require('./mixins/MouseWidgetBase');
    var LayerContainerBase = require('./mixins/LayerContainerBase');
    var InputWidgetBase = require('./mixins/InputWidgetBase');
    var InputWidgetInForm = require('./mixins/InputWidgetInForm');
    var tools = require('./core/calendarTools');
    var util = require('./core/util');


    return React.createClass({
        // @override
        mixins: [MouseWidgetBase, LayerContainerBase, InputWidgetBase, InputWidgetInForm],
        // @override
        getDefaultProps: function () {
            return {
                className: '',
                minWidth: 100,
                width: NaN,
                placeholder: 'please select',
                min: '0-1-1',
                max: '9999-12-31',
                disabled: false,
                valueTemplate: '',
                // 以下为LayerContainerBase中需要的配置
                layerContent: require('./Calendar.jsx'),
                layerProps: {},
                layerInterface: 'onChange'
            };
        },
        // @override
        getInitialState: function () {
            return {};
        },
        layerAction: function (e) {
            var value = this.___getValue___();
            if (this.props.disabled || value === e.target.value) return;
            this.___dispatchChange___(e);
            this.layerHide();
        },
        mouseEnterHandler: function (e) {
            this.___mouseenterHandler___();
            if (this.props.disabled) return;
            this.layerShow({
                value: this.___getValue___(),
                min: this.props.min,
                max: this.props.max
            });
        },
        render: function () {
            var me = this;
            var containerProp = {
                className: 'fcui2-dropdownlist ' + this.props.className,
                style: {
                    minWidth: this.props.minWidth,
                    borderColor: this.state.isValid === false ? '#F00' : undefined 
                },
                onMouseEnter: this.mouseEnterHandler,
                onMouseLeave: this.___mouseleaveHandler___,
                ref: 'container'
            };
            if (this.props.disabled) {
                containerProp.className += ' fcui2-dropdownlist-disabled';
            }
            if (!isNaN(this.props.width)) {
                delete containerProp.style.minWidth;
                containerProp.style.width = this.props.width;
            }
            var label = this.___getValue___() || this.props.placeholder;
            return (
                <div {...containerProp}>
                    <div className="icon-right font-icon font-icon-calendar"></div>
                    <div className="label-container">{label}</div>
                </div>
            );
        }
    });
});

@@ -150,140 +150,8 @@
 ');%0A
-    var MouseWidgetBase = require('./mixins/MouseWidgetBase');%0A    var LayerContainerBase = require('./mixins/LayerContainerBase');%0A
     
@@ -272,24 +272,112 @@
 etInForm');%0A
+    var Layer = require('./Layer.jsx');%0A    var Calendar = require('./Calendar.jsx');%0A%0A%0A
     var tool
@@ -527,45 +527,8 @@
 s: %5B
-MouseWidgetBase, LayerContainerBase, 
 Inpu
@@ -912,188 +912,8 @@
 : ''
-,%0A                // %E4%BB%A5%E4%B8%8B%E4%B8%BALayerContainerBase%E4%B8%AD%E9%9C%80%E8%A6%81%E7%9A%84%E9%85%8D%E7%BD%AE%0A                layerContent: require('./Calendar.jsx'),%0A                layerProps: %7B%7D,%0A                layerInterface: 'onChange'
 %0A   
@@ -1015,16 +1015,62 @@
 return %7B
+%0A                layerOpen: false%0A            
 %7D;%0A     
@@ -1087,19 +1087,21 @@
     
-layerAction
+changeHandler
 : fu
@@ -1296,18 +1296,35 @@
 his.
-layerHide(
+setState(%7BlayerOpen: false%7D
 );%0A 
@@ -1379,52 +1379,8 @@
 ) %7B%0A
-            this.___mouseenterHandler___();%0A
     
@@ -1441,19 +1441,36 @@
 his.
-layerShow(%7B
+setState(%7BlayerOpen: true%7D);
 %0A   
@@ -1470,32 +1470,35 @@
 %7D);%0A        
+%7D,%0A
         
 value: this.
@@ -1489,110 +1489,251 @@
     
-value: this.___getValue___(),%0A                min: this.props.min,%0A                max: this.props.max
+mouseLeaveHandler: function (e) %7B%0A            var me = this;%0A            // %E5%BB%B6%E8%BF%9F%E5%85%B3%E9%97%AD%0A            setTimeout(function () %7B%0A                if (me.refs.layer && me.refs.layer.state.mouseenter) return;%0A                me.setState(%7BlayerOpen: false%7D);
 %0A   
@@ -1742,16 +1742,21 @@
        %7D
+, 200
 );%0A     
@@ -2197,17 +2197,14 @@
 his.
-___
 mouse
-l
+L
 eave
@@ -2210,19 +2210,16 @@
 eHandler
-___
 ,%0A      
@@ -2634,16 +2634,472 @@
 holder;%0A
+            var layerProp = %7B%0A                isOpen: this.state.layerOpen && !this.props.disabled,%0A                anchor: this.refs.container,%0A                onMouseLeave: this.mouseLeaveHandler,%0A                ref: 'layer'%0A            %7D;%0A            var calendarProp = %7B%0A                min: this.props.min,%0A                max: this.props.max,%0A                value: this.___getValue___(),%0A                onChange: this.changeHandler%0A            %7D;%0A
         
@@ -3299,24 +3299,151 @@
 abel%7D%3C/div%3E%0A
+                    %3CLayer %7B...layerProp%7D%3E%0A                        %3CCalendar %7B...calendarProp%7D /%3E%0A                    %3C/Layer%3E%0A
             

rewrite DropDownCalendar