74 lines
4.8 KiB
HTML
74 lines
4.8 KiB
HTML
![]() |
<div class="dialog-container date-picker-container mdl-shadow--8dp" style="max-height: 100%;">
|
||
|
<div>
|
||
|
<div style="width:100%;text-align: center; overflow: hidden;border-radius: 8px">
|
||
|
<div class="mdl-datepicker-title" ng-click="dialog.datePacker.gotoToday();">
|
||
|
<div style="color:rgba(0 ,0,0);font-size: 14px; margin-right: 8px;">{{dialog.datePacker.pickDate | date : 'yyyy/MM/dd HH:mm:ss'}}</div>
|
||
|
<div style="font-size: 14px;" ng-bind="dialog.datePacker.displayPickDate();"></div>
|
||
|
</div>
|
||
|
<div style="display: flex;">
|
||
|
<div class="mdl-datepicker-month" ng-hide="dialog.datePacker.isYearList">
|
||
|
<button class="mdl-button mdl-js-button mdl-button--icon"
|
||
|
style="position: absolute;left:60px;top:15px;"
|
||
|
ng-click="dialog.datePacker.prevMonth();">
|
||
|
<i class="material-icons"></i>
|
||
|
</button>
|
||
|
<span ng-click="dialog.datePacker.showYearList();" ng-bind="dialog.datePacker.displayMonth();" style="font-size: 18px;"></span>
|
||
|
<button class="mdl-button mdl-js-button mdl-button--icon"
|
||
|
style="position: absolute; right:60px;top:15px;"
|
||
|
ng-click="dialog.datePacker.nextMonth();">
|
||
|
<i class="material-icons"></i>
|
||
|
</button>
|
||
|
</div>
|
||
|
<div class="mdl-datepicker-hour">
|
||
|
<span ng-bind="dialog.datePacker.showHourAndMin();" style="font-size: 18px;font-weight: 500;"></span>
|
||
|
</div>
|
||
|
</div>
|
||
|
<div style="display: flex;">
|
||
|
<div style="text-align: left;height:277px;width: 294px; margin:16px 32px;" ng-hide="dialog.datePacker.isYearList">
|
||
|
<div ng-repeat="week in dialog.datePacker.weekdays" class="mdl-datepicker-week">
|
||
|
{{week}}
|
||
|
</div><br />
|
||
|
<div ng-repeat-start="day in dialog.datePacker.dayArray track by $index"
|
||
|
class="mdl-datepicker-date" ng-disabled="day.isDisabled"
|
||
|
ng-class="dialog.datePacker.dayClass(day);"
|
||
|
ng-click="dialog.datePacker.pick(day);">
|
||
|
{{day.value}}
|
||
|
</div><br ng-if="($index+1)%7==0" ng-repeat-end />
|
||
|
</div>
|
||
|
<div class="Time-box" style="flex:1">
|
||
|
<div class="hour-outter-box">
|
||
|
<div class="hour-inner-box">
|
||
|
<div class="hour-box" ng-click="dialog.datePacker.hourpick(hour)" ng-repeat="hour in dialog.datePacker.hourArray track by $index">
|
||
|
<div class="mdl-datepicker-hourminute" ng-class="dialog.datePacker.hourClass(hour);">{{hour.value}}</div>
|
||
|
<div class="kmi-can-click"></div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="minute-outter-box">
|
||
|
<div class="minute-inner-box">
|
||
|
<div class="minute-box" ng-click="dialog.datePacker.minpick(minute)" ng-repeat="minute in dialog.datePacker.minArray track by $index">
|
||
|
<div class="mdl-datepicker-hourminute" ng-class="dialog.datePacker.minClass(minute);">{{minute.value}}</div>
|
||
|
<div class="kmi-can-click"></div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
<div ng-show="dialog.datePacker.isYearList" style="height: 265px;overflow: auto;">
|
||
|
<div ng-repeat="month in dialog.datePacker.monthArray track by $index"
|
||
|
class="mdl-datepicker-list-month">
|
||
|
{{month.year +' '+month.month}}
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
<div style="display:flex; justify-content : space-between; border-top: 1px solid rgb(235, 238, 241);">
|
||
|
<button type="button" class="mdl-button date-picker-cancel-button" ng-click="dialog.cancel(dialog);" ng-bind="'dialog.cancel' | translate" style="font-size: 14px;font-weight: 500;color: rgb(96,96,96);"></button>
|
||
|
<!-- <button type="button" class="mdl-button mdl-js-button mdl-button--primary date-picker-confirm-button" ng-click="dialog.confirm(dialog);" ng-bind="'dialog.confirm' | translate"></button> -->
|
||
|
<div class="mdl-button mdl-js-button mdl-button--primary date-picker-confirm-button" ng-click="dialog.confirm(dialog);">
|
||
|
<div class="button-confirm-icon"></div>
|
||
|
<label ng-bind="'dialog.confirm' | translate"></label>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|