zettapi_client/lib/directives/calendar/calendar.html

Admin panel and client-side CRUD operations in angular to use with zettapi_server rest api to get started quickly in any CMS project.

<div class="row">
	<div class="col-sm-12 calendarhelp">
		<ul>
			<li ng-repeat="eventType in eventTypes">
				<a style="cursor: pointer;" ng-click="toggleEventType(eventType.type)">
					<span class="label event-{{eventType.type}}"><i class="fa fa-eye{{eventType.visible ? '' : '-slash'}}"></i> &nbsp;{{eventType.count}}</span>&nbsp;{{eventType.label}}
				</a>
			</li>
		</ul>
	</div>
</div>
<div class="row">
	<div class="col-sm-12">
		<h2>{{calendarTitle}}</h2>
	</div>
	<div class="col-md-6 text-left">

		<div class="btn-group btn-group-md">
			<button class="btn btn-primary" mwl-date-modifier date="viewDate" decrement="calendarView"><span class="fa fa-caret-left"></span></button>
			<button class="btn btn-primary active" mwl-date-modifier date="viewDate" set-to-today><span class="fa fa-calendar"></span></button>
			<button class="btn btn-primary" mwl-date-modifier date="viewDate" increment="calendarView"><span class="fa fa-caret-right"></span></button>
		</div>
	</div>
	<div class="col-md-6 text-center">
		<div class="btn-group btn-group-md">
			<label class="btn btn-primary" ng-model="calendarView" uib-btn-radio="'year'">Ano</label>
			<label class="btn btn-primary" ng-model="calendarView" uib-btn-radio="'month'">Mês</label>
			<label class="btn btn-primary" ng-model="calendarView" uib-btn-radio="'week'">Semana</label>
			<label class="btn btn-primary" ng-model="calendarView" uib-btn-radio="'day'">Dia</label>
		</div>
	</div>
</div>
<br>
<div class="row">
	<div class="col-sm-12">
		<mwl-calendar events="events" view="calendarView" view-title="calendarTitle" view-date="viewDate" cell-is-open="isCellOpen" day-view-start="06:00" day-view-end="22:00" day-view-split="30" cell-modifier="groupEvents(calendarCell)" class="col-sm-12">
		</mwl-calendar>
	</div>
</div>
<script id="groupedMonthEvents.html" type="text/ng-template">
<div class="cal-month-day {{ day.cssClass }}">
	<span class="pull-right" data-cal-date ng-click="calendarCtrl.dateClicked(day.date)" ng-bind="day.label"></span>
	<div style="position: relative; top: 35px; left: 5px">
		<span ng-repeat="(type, events) in day.groups track by type">
			<span class="label event-{{ type }}">{{ events.length }}</span>&nbsp;
	</span>
	</div>
	<div class="cal-day-tick" ng-show="dayIndex === openDayIndex && view[openDayIndex].events.length > 0 && !slideBoxDisabled">
		<i class="glyphicon glyphicon-chevron-up"></i>
		<i class="fa fa-chevron-up"></i>
	</div>
	</div>
</script>