remove selected cell style

This commit is contained in:
血诺 2015-11-13 14:56:16 +08:00
parent 541b72c9d7
commit 522c3fb0e7
4 changed files with 8 additions and 23 deletions

View File

@ -39,11 +39,9 @@ function getDateData(value) {
function onChange(value) { function onChange(value) {
console.log('change'); console.log('change');
} }
function onSelect(value) {
console.log('select');
}
ReactDOM.render( ReactDOM.render(
<div style={{ width: 290, border: '1px solid #d9d9d9', borderRadius: 4 }}><Calendar getDateData={getDateData} onChange={onChange} onSelect={onSelect} type="date" /></div> <div style={{ width: 290, border: '1px solid #d9d9d9', borderRadius: 4 }}><Calendar getDateData={getDateData} onChange={onChange} type="date" /></div>
, document.getElementById('components-calendar-demo-basic')); , document.getElementById('components-calendar-demo-basic'));
```` ````

View File

@ -82,12 +82,11 @@ class NoticeCalendar extends Component {
setType(type) { setType(type) {
this.setState({ type }); this.setState({ type });
} }
onSelect(value) { onPanelChange(value) {
this.setState({ value });
if (this.state.type === 'month') { if (this.state.type === 'month') {
this.setState({ type: 'date' }); this.setType('date');
} }
this.props.onSelect(value); this.setValue(value);
} }
render() { render() {
const props = this.props; const props = this.props;
@ -97,7 +96,6 @@ class NoticeCalendar extends Component {
const _monthCellRender = monthCellRender ? monthCellRender : this.monthCellRender; const _monthCellRender = monthCellRender ? monthCellRender : this.monthCellRender;
const _dateCellRender = dateCellRender ? dateCellRender : this.dateCellRender; const _dateCellRender = dateCellRender ? dateCellRender : this.dateCellRender;
const _fullscreenDateCellRender = fullscreenDateCellRender ? fullscreenDateCellRender : this.fullscreenDateCellRender; const _fullscreenDateCellRender = fullscreenDateCellRender ? fullscreenDateCellRender : this.fullscreenDateCellRender;
return ( return (
<div className={prefixCls + '-wrapper' + (className ? ' ' + className : '') + (fullscreen ? ' ' + prefixCls + '-wrapper-fullscreen' : '' )} style={style}> <div className={prefixCls + '-wrapper' + (className ? ' ' + className : '') + (fullscreen ? ' ' + prefixCls + '-wrapper-fullscreen' : '' )} style={style}>
<Header <Header
@ -114,7 +112,7 @@ class NoticeCalendar extends Component {
prefixCls={`${prefixCls}`} prefixCls={`${prefixCls}`}
showHeader={false} showHeader={false}
value={value} value={value}
onSelect={this.onSelect.bind(this)} onChange={this.onPanelChange.bind(this)}
monthCellRender={ fullscreen ? _monthCellRender.bind(this) : null } monthCellRender={ fullscreen ? _monthCellRender.bind(this) : null }
dateCellRender={ fullscreen ? _fullscreenDateCellRender.bind(this) : _dateCellRender.bind(this) }/> dateCellRender={ fullscreen ? _fullscreenDateCellRender.bind(this) : _dateCellRender.bind(this) }/>
</div> </div>
@ -132,7 +130,6 @@ NoticeCalendar.propTypes = {
prefixCls: PropTypes.string, prefixCls: PropTypes.string,
className: PropTypes.string, className: PropTypes.string,
style: PropTypes.object, style: PropTypes.object,
onSelect: PropTypes.func,
onChange: PropTypes.func, onChange: PropTypes.func,
}; };
NoticeCalendar.defaultProps = { NoticeCalendar.defaultProps = {
@ -141,7 +138,6 @@ NoticeCalendar.defaultProps = {
getDateData: noop, getDateData: noop,
fullscreen: false, fullscreen: false,
prefixCls: PREFIX_CLS, prefixCls: PREFIX_CLS,
onSelect: noop,
onChange: noop, onChange: noop,
type: 'date', type: 'date',
}; };

View File

@ -29,4 +29,3 @@
| monthCellRendar | 自定义渲染月单元格 | function | 无 | | monthCellRendar | 自定义渲染月单元格 | function | 无 |
| locale | 国际化配置 | object | [默认配置](https://github.com/ant-design/ant-design/issues/424) | | locale | 国际化配置 | object | [默认配置](https://github.com/ant-design/ant-design/issues/424) |
| onChange | 日期改变 | bool | 无 | | onChange | 日期改变 | bool | 无 |
| onSelect | 选择日期 | bool | 无 |

View File

@ -95,17 +95,9 @@
} }
} }
&-today .@{notice-calendar-prefix-cls}-date { &-today .@{notice-calendar-prefix-cls}-date {
color: @primary-color;
}
&-selected-day .@{notice-calendar-prefix-cls}-date {
background: @primary-color; background: @primary-color;
color: #fff; color: #fff;
&:hover {
background: @primary-color;
}
} }
&-disabled-cell &-date { &-disabled-cell &-date {
cursor: not-allowed; cursor: not-allowed;
color: #bcbcbc; color: #bcbcbc;
@ -228,14 +220,14 @@
&-cell { &-cell {
padding: 0; padding: 0;
} }
&-month-panel-selected-cell .@{notice-calendar-prefix-cls}-fullscreen-month, &-month-panel-selected-cell .@{notice-calendar-prefix-cls}-fullscreen-month {
&-selected-day .@{notice-calendar-prefix-cls}-fullscreen-date {
background-color: tint(@primary-color, 90%); background-color: tint(@primary-color, 90%);
color: @text-color; color: @text-color;
} }
&-month-panel-selected-cell .@{notice-calendar-prefix-cls}-fullscreen-month, &-month-panel-selected-cell .@{notice-calendar-prefix-cls}-fullscreen-month,
&-today .@{notice-calendar-prefix-cls}-fullscreen-date { &-today .@{notice-calendar-prefix-cls}-fullscreen-date {
border-top-color: @primary-color; border-top-color: @primary-color;
background-color: tint(@primary-color, 90%);
color: @primary-color; color: @primary-color;
} }