(js) Make events clickable in month view
parent
8ab591a1b6
commit
ce8a4b6d8a
|
@ -55,10 +55,12 @@
|
|||
var:day-number="currentDayNumber"
|
||||
var:id="currentDayId">
|
||||
<div layout="column" layout-fill="true">
|
||||
<div class="sg-calendar-tile-header"><var:string value="dayHeaderNumber"/></div>
|
||||
<sg-calendar-month-day
|
||||
sg-blocks="calendar.blocks"
|
||||
var:sg-day="currentTableDay.shortDateString"><!-- day's events --></sg-calendar-month-day></div>
|
||||
<div class="sg-calendar-tile-header"><var:string value="dayHeaderNumber"/></div>
|
||||
<sg-calendar-month-day
|
||||
sg-blocks="calendar.blocks"
|
||||
sg-click="list.openEvent(event, component)"
|
||||
var:sg-day="currentTableDay.shortDateString"><!-- day's events --></sg-calendar-month-day>
|
||||
</div>
|
||||
</md-grid-tile>
|
||||
</var:foreach>
|
||||
</var:foreach>
|
||||
|
|
|
@ -28,7 +28,7 @@
|
|||
},
|
||||
replace: true,
|
||||
template: [
|
||||
'<div class="event draggable">',
|
||||
'<div class="sg-event sg-draggable">',
|
||||
' <div class="eventInside" ng-click="clickBlock({clickEvent: $event, clickComponent: block.component})">',
|
||||
' <div class="gradient">',
|
||||
' </div>',
|
||||
|
|
|
@ -29,10 +29,10 @@
|
|||
clickBlock: '&sgClick'
|
||||
},
|
||||
template: [
|
||||
'<sg-calendar-day-block class="event draggable"',
|
||||
' ng-repeat="block in blocks[day]"',
|
||||
' sg-block="block"',
|
||||
' sg-click="clickBlock({event: clickEvent, component: clickComponent})"/>'
|
||||
'<sg-calendar-day-block class="sg-event draggable"',
|
||||
' ng-repeat="block in blocks[day]"',
|
||||
' sg-block="block"',
|
||||
' sg-click="clickBlock({event: clickEvent, component: clickComponent})"/>'
|
||||
].join('')
|
||||
};
|
||||
}
|
||||
|
|
|
@ -14,20 +14,22 @@
|
|||
|
||||
<sg-calendar-monh-day
|
||||
sg-blocks="calendar.blocks"
|
||||
sg-day="20150408" />
|
||||
sg-day="20150408"
|
||||
sg-click="open({ event: clickEvent, component: clickComponent })"/>
|
||||
*/
|
||||
function sgCalendarMonthDay() {
|
||||
return {
|
||||
restrict: 'E',
|
||||
scope: {
|
||||
blocks: '=sgBlocks',
|
||||
day: '@sgDay'
|
||||
day: '@sgDay',
|
||||
clickBlock: '&sgClick'
|
||||
},
|
||||
replace: true,
|
||||
template: [
|
||||
'<sg-calendar-month-event',
|
||||
' ng-repeat="block in blocks[day]"',
|
||||
' sg-block="block"/>'
|
||||
' sg-block="block"',
|
||||
' sg-click="clickBlock({event: clickEvent, component: clickComponent})"/>'
|
||||
].join('')
|
||||
};
|
||||
}
|
||||
|
|
|
@ -19,21 +19,21 @@
|
|||
return {
|
||||
restrict: 'E',
|
||||
scope: {
|
||||
block: '=sgBlock'
|
||||
block: '=sgBlock',
|
||||
clickBlock: '&sgClick'
|
||||
},
|
||||
replace: true,
|
||||
template: [
|
||||
'<div class="sg-event">',
|
||||
' <span ng-if="!block.component.c_isallday">{{ block.starthour }} - </span>',
|
||||
' {{ block.component.c_title }}',
|
||||
' <span class="icons">',
|
||||
' <i ng-if="block.component.c_nextalarm" class="md-icon-alarm"></i>',
|
||||
' <i ng-if="block.component.c_classification == 1" class="md-icon-visibility-off"></i>',
|
||||
' <i ng-if="block.component.c_classification == 2" class="md-icon-vpn-key"></i>',
|
||||
' </span>',
|
||||
'<div class="sg-event sg-draggable" ng-click="clickBlock({clickEvent: $event, clickComponent: block.component})">',
|
||||
' <span ng-if="!block.component.c_isallday">{{ block.starthour }} - </span>',
|
||||
' {{ block.component.c_title }}',
|
||||
' <span class="icons">',
|
||||
' <i ng-if="block.component.c_nextalarm" class="md-icon-alarm"></i>',
|
||||
' <i ng-if="block.component.c_classification == 1" class="md-icon-visibility-off"></i>',
|
||||
' <i ng-if="block.component.c_classification == 2" class="md-icon-vpn-key"></i>',
|
||||
' </span>',
|
||||
' <div class="leftDragGrip"></div>',
|
||||
' <div class="rightDragGrip"></div>',
|
||||
' </div>',
|
||||
'</div>'
|
||||
].join(''),
|
||||
link: link
|
||||
|
|
|
@ -1,6 +1,10 @@
|
|||
/// SchedulerUI.scss -*- Mode: scss; indent-tabs-mode: nil; basic-offset: 2 -*-
|
||||
$hours_margin: 50px;
|
||||
|
||||
.sg-draggable {
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
.dayLabels {
|
||||
color: sg-color($sogoBlue, 700);
|
||||
height: 35px;
|
||||
|
@ -32,6 +36,7 @@ $hours_margin: 50px;
|
|||
|
||||
.daysViewFor1Days {
|
||||
.day {
|
||||
left: $hours_margin;
|
||||
width: 100%;
|
||||
}
|
||||
.days {
|
||||
|
@ -87,8 +92,8 @@ $hours_margin: 50px;
|
|||
top: 0;
|
||||
}
|
||||
}
|
||||
.event {
|
||||
cursor: default;
|
||||
.sg-event {
|
||||
border-radius: 10px;
|
||||
margin-right: 1px;
|
||||
position: absolute;
|
||||
left: 0%;
|
||||
|
@ -106,9 +111,6 @@ $hours_margin: 50px;
|
|||
bottom: 0px;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
-webkit-border-radius: 2px;
|
||||
border-radius: 2px;
|
||||
cursor:move;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue