book-picker
Version:
<p align="center"> <img width="409" height="331" src="https://raw.githubusercontent.com/ymxk/book-picker/master/book-picker.gif"> </p>
66 lines • 5.61 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { Component, EventEmitter, Output } from '@angular/core';
import moment from 'moment';
export class DatePickerComponent {
constructor() {
this.days = [];
this.selectedDate = moment();
this.endDayForMonth = moment().add(15, 'd');
this.selected = new EventEmitter();
}
/**
* @return {?}
*/
ngOnInit() {
this.getDaysForMonth();
}
/**
* @param {?} value
* @return {?}
*/
onSelected(value) {
this.selectedDate = value;
this.selected.emit(value);
}
/**
* @param {?} value
* @return {?}
*/
isSameDay(value) {
return this.selectedDate.isSame(value, 'day') ? 'date-selected' : '';
}
/**
* @return {?}
*/
getDaysForMonth() {
for (let item = moment(); item.isBefore(this.endDayForMonth); item.add(1, 'd')) {
this.days.push(item.clone());
}
}
}
DatePickerComponent.decorators = [
{ type: Component, args: [{
selector: 'app-date-picker',
template: "<div class=\"date-title\">{{selectedDate | amDateFormat: 'YYYY'}}</div>\n<section class=\"card\">\n\t<div class=\"card--content\" *ngFor=\"let day of days\" [ngClass]=\"isSameDay(day)\" (click)=\"onSelected(day)\">\n\t\t<div>{{day | weekdays}}</div>\n\t\t<div>{{day | amDateFormat: 'M/D'}}</div>\n\t</div>\n</section>",
styles: [".card{display:-webkit-flex;display:flex;min-width:100%;min-height:86px;overflow-x:auto}.card::-webkit-scrollbar{display:none}.card--content{min-width:55px;height:86px;background-color:#fff;text-align:center}.card--content div:first-child{height:18px;font-size:13px;font-family:PingFangSC-Regular;font-weight:400;color:#999;line-height:18px;margin:19px 0 10px}.card--content div:last-child{height:21px;line-height:21px;font-size:15px;font-family:PingFangSC-Medium;font-weight:500;color:#242424}.date-title{width:100%;height:46px;line-height:46px;background:#f8f8f8;font-size:17px;font-family:PingFangSC-Medium;font-weight:1000;color:#242424;text-align:center}.date-selected div{color:#007aff!important}"]
}] }
];
/** @nocollapse */
DatePickerComponent.ctorParameters = () => [];
DatePickerComponent.propDecorators = {
selected: [{ type: Output }]
};
if (false) {
/** @type {?} */
DatePickerComponent.prototype.days;
/** @type {?} */
DatePickerComponent.prototype.selectedDate;
/** @type {?} */
DatePickerComponent.prototype.endDayForMonth;
/** @type {?} */
DatePickerComponent.prototype.selected;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGF0ZS1waWNrZXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vYm9vay1waWNrZXIvIiwic291cmNlcyI6WyJkYXRlLXBpY2tlci9kYXRlLXBpY2tlci5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7OztBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQVUsWUFBWSxFQUFTLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUMvRSxPQUFPLE1BQU0sTUFBTSxRQUFRLENBQUM7QUFPNUIsTUFBTSxPQUFPLG1CQUFtQjtJQU05QjtRQUxBLFNBQUksR0FBb0IsRUFBRSxDQUFDO1FBQzNCLGlCQUFZLEdBQWtCLE1BQU0sRUFBRSxDQUFDO1FBQ3ZDLG1CQUFjLEdBQWtCLE1BQU0sRUFBRSxDQUFDLEdBQUcsQ0FBQyxFQUFFLEVBQUUsR0FBRyxDQUFDLENBQUM7UUFDNUMsYUFBUSxHQUFHLElBQUksWUFBWSxFQUFpQixDQUFDO0lBRXZDLENBQUM7Ozs7SUFFakIsUUFBUTtRQUNOLElBQUksQ0FBQyxlQUFlLEVBQUUsQ0FBQztJQUN6QixDQUFDOzs7OztJQUVELFVBQVUsQ0FBQyxLQUFvQjtRQUM3QixJQUFJLENBQUMsWUFBWSxHQUFHLEtBQUssQ0FBQztRQUMxQixJQUFJLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUM1QixDQUFDOzs7OztJQUVELFNBQVMsQ0FBQyxLQUFvQjtRQUM1QixPQUFPLElBQUksQ0FBQyxZQUFZLENBQUMsTUFBTSxDQUFDLEtBQUssRUFBRSxLQUFLLENBQUMsQ0FBQyxDQUFDLENBQUMsZUFBZSxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUM7SUFDdkUsQ0FBQzs7OztJQUVELGVBQWU7UUFDYixLQUFLLElBQUksSUFBSSxHQUFHLE1BQU0sRUFBRSxFQUFFLElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLGNBQWMsQ0FBQyxFQUFFLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQyxFQUFFLEdBQUcsQ0FBQyxFQUFFO1lBQzlFLElBQUksQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQyxDQUFDO1NBQzlCO0lBQ0gsQ0FBQzs7O1lBOUJGLFNBQVMsU0FBQztnQkFDVCxRQUFRLEVBQUUsaUJBQWlCO2dCQUMzQix5VUFBMkM7O2FBRTVDOzs7Ozt1QkFLRSxNQUFNOzs7O0lBSFAsbUNBQTJCOztJQUMzQiwyQ0FBdUM7O0lBQ3ZDLDZDQUFzRDs7SUFDdEQsdUNBQXVEIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBPbkluaXQsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE91dHB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IG1vbWVudCBmcm9tICdtb21lbnQnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdhcHAtZGF0ZS1waWNrZXInLFxuICB0ZW1wbGF0ZVVybDogJy4vZGF0ZS1waWNrZXIuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9kYXRlLXBpY2tlci5jb21wb25lbnQuc2NzcyddXG59KVxuZXhwb3J0IGNsYXNzIERhdGVQaWNrZXJDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuICBkYXlzOiBtb21lbnQuTW9tZW50W10gPSBbXTtcbiAgc2VsZWN0ZWREYXRlOiBtb21lbnQuTW9tZW50ID0gbW9tZW50KCk7XG4gIGVuZERheUZvck1vbnRoOiBtb21lbnQuTW9tZW50ID0gbW9tZW50KCkuYWRkKDE1LCAnZCcpO1xuICBAT3V0cHV0KCkgc2VsZWN0ZWQgPSBuZXcgRXZlbnRFbWl0dGVyPG1vbWVudC5Nb21lbnQ+KCk7XG5cbiAgY29uc3RydWN0b3IoKSB7IH1cblxuICBuZ09uSW5pdCgpIHtcbiAgICB0aGlzLmdldERheXNGb3JNb250aCgpO1xuICB9XG5cbiAgb25TZWxlY3RlZCh2YWx1ZTogbW9tZW50Lk1vbWVudCkge1xuICAgIHRoaXMuc2VsZWN0ZWREYXRlID0gdmFsdWU7XG4gICAgdGhpcy5zZWxlY3RlZC5lbWl0KHZhbHVlKTtcbiAgfVxuXG4gIGlzU2FtZURheSh2YWx1ZTogbW9tZW50Lk1vbWVudCkge1xuICAgIHJldHVybiB0aGlzLnNlbGVjdGVkRGF0ZS5pc1NhbWUodmFsdWUsICdkYXknKSA/ICdkYXRlLXNlbGVjdGVkJyA6ICcnO1xuICB9XG5cbiAgZ2V0RGF5c0Zvck1vbnRoKCkge1xuICAgIGZvciAobGV0IGl0ZW0gPSBtb21lbnQoKTsgaXRlbS5pc0JlZm9yZSh0aGlzLmVuZERheUZvck1vbnRoKTsgaXRlbS5hZGQoMSwgJ2QnKSkge1xuICAgICAgdGhpcy5kYXlzLnB1c2goaXRlbS5jbG9uZSgpKTtcbiAgICB9XG4gIH1cblxufSJdfQ==