fix details

components/calendar/NoteList.jsx

@@ -3,13 +3,13 @@ import {PREFIX_CLS} from './Constants';
 
 class NoteList extends Component {
   render() {
-    const {listdata, prefixCls} = this.props;
+    const {listData, prefixCls} = this.props;
 
-    if (!listdata || listdata === 0) return null;
+    if (!listData || listData === 0) return null;
 
     return (
       <ul className={prefixCls}>
-        { listdata.map(function (item, index) {
+        { listData.map(function (item, index) {
           return <li key={`list-${index}`}><span className={`${prefixCls}-node-${item.type}`}>●</span>{ item.content }</li>;
         }) }
       </ul>
@@ -17,7 +17,7 @@ class NoteList extends Component {
   }
 }
 NoteList.propTypes = {
-  listdata: PropTypes.array,
+  listData: PropTypes.array,
   prefixCls: PropTypes.string,
 };
 NoteList.defaultProps = {

components/calendar/Notes.jsx

@@ -5,15 +5,15 @@ import {PREFIX_CLS} from './Constants';
 
 class Notes extends Component {
   render() {
-    const {listdata, threshold, prefixCls} = this.props;
+    const {listData, threshold, prefixCls} = this.props;
 
     const classNames = [prefixCls];
     let items;
-    if (listdata.length > threshold) {
+    if (listData.length > threshold) {
       items = new Array(threshold).fill('gray');
       classNames.push(`${prefixCls}-overflow`);
     } else {
-      items = listdata.map(item => item.type);
+      items = listData.map(item => item.type);
     }
     const el = (<div className={classNames.join(' ')}>
       {
@@ -26,17 +26,17 @@ class Notes extends Component {
     </div>);
 
     return (
-      <Tooltip placement="right" trigger={['hover']} overlay={<NoteList listdata={listdata} />}>{el}</Tooltip>
+      <Tooltip placement="right" trigger={['hover']} overlay={<NoteList listData={listData} />}>{el}</Tooltip>
     );
   }
 }
 Notes.propTypes = {
-  listdata: PropTypes.array,
+  listData: PropTypes.array,
   threshold: PropTypes.number,
   prefixCls: PropTypes.string,
 };
 Notes.defaultProps = {
-  listdata: null,
+  listData: null,
   threshold: 3,
   prefixCls: `${PREFIX_CLS}-notes`,
 };

components/calendar/index.jsx

@@ -34,29 +34,28 @@ class NoticeCalendar extends Component {
         </a>
       );
     }
-
     return (
       <a className={`${prefixCls}-month-panel-month`}>{locale.format.shortMonths[month]}</a>
     );
   }
   fullscreenDateCellRender(value) {
     const prefixCls = this.props.prefixCls;
-    let listdata = this.props.getDateData(value);
+    let listData = this.props.getDateData(value);
     return (
       <span className={`${prefixCls}-date ${prefixCls}-notes-date-full`}>
         <span>{ zerofixed(value.getDayOfMonth()) }</span>
-        <NoteList listdata={listdata} />
+        <NoteList listData={listData} />
       </span>
     );
   }
   dateCellRender(value) {
     const prefixCls = this.props.prefixCls;
     const el = (<span className={`${prefixCls}-date ${prefixCls}-notes-date`}>{ zerofixed(value.getDayOfMonth()) }</span>);
-    const listdata = this.props.getDateData(value);
+    const listData = this.props.getDateData(value);
     return (
       <div style={{position: 'relative', height: 32}}>
         { el }
-        { (listdata && listdata.length > 0) ? <Notes listdata={listdata} /> : null }
+        { (listData && listData.length > 0) ? <Notes listData={listData} /> : null }
       </div>
     );
   }

package.json

@@ -38,7 +38,7 @@
     "gregorian-calendar-format": "~4.0.4",
     "object-assign": "~4.0.1",
     "rc-animate": "~2.0.0",
-    "rc-calendar": "~4.0.0-alpha15",
+    "rc-calendar": "4.0.0-alpha15",
     "rc-checkbox": "~1.1.1",
     "rc-collapse": "~1.4.0",
     "rc-dialog": "~5.2.0",

style/components/calendar/NoteList.less

@@ -4,33 +4,32 @@
     text-align: left;
     margin: 0;
     padding: 0;
-   
-
-    & * { vertical-align: middle; }
 
     > li {
-      color: #999;
+      color: @legend-color;
       overflow: hidden;
       text-overflow: ellipsis;
       white-space: nowrap;
 
+      > span { vertical-align: middle; }
+
       > span:first-child {
-      font-size: 9px;
-      margin-right: 4px;
-    } 
+        font-size: 9px;
+        margin-right: 4px;
+      } 
     }
 
     &-node-gray {
       color: #ccc;
     }
     &-node-warn {
-      color: #fac450;
+      color: @warning-color;
     }
     &-node-normal {
-      color: #2db7f5;
+      color: @primary-color;
     }
     &-node-error {
-      color: #f60;
+      color: @error-color;
     }
   }
 }

style/components/calendar/Notes.less

@@ -12,20 +12,20 @@
   cursor: pointer;
 
   &-overflow {
-    border: 1px solid #d9d9d9;
+    border: 1px solid @btn-default-border;
   }
 
   span&-node-gray {
     color: #ccc;
   }
   span&-node-warn {
-    color: #fac450;
+    color: @warning-color;
   }
   span&-node-normal {
-    color: #2db7f5;
+    color: @primary-color;
   }
   span&-node-error {
-    color: #f60;
+    color: @error-color;
   }
 
   &-date {

style/components/calendar/index.less

@@ -8,9 +8,9 @@
       float: left;
       height: 24px;
       line-height: 24px;
-      border: 1px solid #d9d9d9;
+      border: 1px solid @btn-default-border;
       padding: 0 10px;
-      color: #666;
+      color: @text-color;
       &:first-child {
         border-top-left-radius: 4px;
         border-bottom-left-radius: 4px;
@@ -22,13 +22,13 @@
         border-left: none;
       }
       &.normal:hover {
-        border-color: #23c0fa;
+        border-color: @primary-color;
         box-shadow: 0 0 2px rgba(45, 183, 245, 0.8);
         cursor: pointer;
       }
       &.focus {
-        border-color: #3fc7fa;
-        background-color: #3fc7fa;
+        border-color: @primary-color;
+        background-color: @link-hover-color;
         color: #fff;
       }
     }
@@ -67,22 +67,21 @@
       border-top: 2px solid #eee;
       text-align: right;
       padding-right: 8px;
-
-      &:hover { color: inherit; }
+      color: @text-color;
     }
     &-today .@{calendar-prefix-cls}-date,
     &-month-panel-selected-cell .@{calendar-prefix-cls}-month-panel-month {
-      border-top-color: #3FC7FA;
-      color: #3FC7FA;
+      border-top-color: @primary-color;
+      color: @primary-color;
       background: none;
     }
     &-selected-day .@{calendar-prefix-cls}-date,
     &-month-panel-selected-cell .@{calendar-prefix-cls}-month-panel-month {
-      background-color: #ebfaff; 
+      background-color: tint(@primary-color, 90%); 
     }
     &-notes-month-cell {
       text-align: center!important;
-      color: #666;
+      color: @text-color;
 
       > section {
         font-size: 24px;