mirror of
https://github.com/ant-design/ant-design.git
synced 2024-11-25 03:29:59 +08:00
remove selected cell style
This commit is contained in:
parent
541b72c9d7
commit
522c3fb0e7
@ -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'));
|
||||||
````
|
````
|
||||||
|
@ -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',
|
||||||
};
|
};
|
||||||
|
@ -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 | 无 |
|
|
||||||
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user