151 lines
5.5 KiB
HTML
151 lines
5.5 KiB
HTML
<vn-crud-model
|
|
vn-id="model"
|
|
url="WorkerTimeControls/filter"
|
|
filter="::$ctrl.filter"
|
|
data="$ctrl.hours">
|
|
</vn-crud-model>
|
|
<vn-card class="vn-pa-lg vn-w-lg">
|
|
<vn-table model="model" auto-load="false">
|
|
<vn-thead>
|
|
<vn-tr>
|
|
<vn-td ng-repeat="weekday in $ctrl.weekDays" center>
|
|
<div class="weekday" translate>{{::$ctrl.weekdayNames[$index].name}}</div>
|
|
<div>
|
|
<span>{{::weekday.dated | date: 'dd'}}</span>
|
|
<span title="{{::weekday.dated | date: 'MMMM' | translate}}" translate>
|
|
{{::weekday.dated | date: 'MMMM'}}
|
|
</span>
|
|
</div>
|
|
<vn-chip
|
|
title="{{::weekday.event.name}}"
|
|
ng-class="{invisible: !weekday.event}">
|
|
<vn-avatar
|
|
ng-style="::{backgroundColor: weekday.event.color}">
|
|
</vn-avatar>
|
|
<div>
|
|
{{::weekday.event.name}}
|
|
</div>
|
|
</vn-chip>
|
|
</vn-td>
|
|
</vn-tr>
|
|
</vn-thead>
|
|
<vn-tbody>
|
|
<vn-tr>
|
|
<vn-td ng-repeat="weekday in $ctrl.weekDays" class="hours vn-pa-none" expand>
|
|
<section ng-repeat="hour in weekday.hours">
|
|
<vn-icon
|
|
icon="{{
|
|
::hour.direction == 'in' ? 'arrow_forward' : 'arrow_back'
|
|
}}"
|
|
title="{{
|
|
::(hour.direction == 'in' ? 'In' : 'Out') | translate
|
|
}}"
|
|
ng-class="::{'invisible': hour.direction == 'middle'}">
|
|
</vn-icon>
|
|
<vn-chip
|
|
ng-class="::{'colored': hour.manual, 'clickable': true}"
|
|
removable="::hour.manual"
|
|
on-remove="$ctrl.showDeleteDialog($event, hour)"
|
|
ng-click="$ctrl.edit($event, hour)"
|
|
>
|
|
<prepend>
|
|
<vn-icon icon="edit"
|
|
vn-tooltip="Edit">
|
|
</vn-icon>
|
|
</prepend>
|
|
{{::hour.timed | date: 'HH:mm'}}
|
|
</vn-chip>
|
|
</section>
|
|
</vn-td>
|
|
</vn-tr>
|
|
</vn-tbody>
|
|
<vn-tfoot>
|
|
<vn-tr>
|
|
<vn-td ng-repeat="weekday in $ctrl.weekDays" center>
|
|
{{$ctrl.formatHours(weekday.workedHours)}} h.
|
|
</vn-td>
|
|
</vn-tr>
|
|
<vn-tr>
|
|
<vn-td center ng-repeat="weekday in $ctrl.weekDays">
|
|
<vn-icon-button
|
|
icon="add_circle"
|
|
vn-tooltip="Add time"
|
|
ng-click="$ctrl.showAddTimeDialog(weekday)">
|
|
</vn-icon-button>
|
|
</vn-td>
|
|
</vn-tr>
|
|
</vn-tfoot>
|
|
</vn-table>
|
|
</vn-card>
|
|
<vn-side-menu side="right">
|
|
<div class="vn-pa-md">
|
|
<div class="totalBox" style="text-align: center;">
|
|
<h6 translate>Hours</h6>
|
|
<vn-label-value
|
|
label="Week total"
|
|
value="{{$ctrl.weekTotalHours}} h.">
|
|
</vn-label-value>
|
|
<vn-label-value
|
|
label="Finish at"
|
|
value="{{$ctrl.getFinishTime()}}">
|
|
</vn-label-value>
|
|
</div>
|
|
<vn-calendar
|
|
vn-id="calendar"
|
|
class="vn-pt-md"
|
|
ng-model="$ctrl.date"
|
|
has-events="$ctrl.hasEvents($day)">
|
|
</vn-calendar>
|
|
</div>
|
|
</vn-side-menu>
|
|
<vn-dialog
|
|
vn-id="addTimeDialog"
|
|
on-accept="$ctrl.addTime()"
|
|
message="Add time">
|
|
<tpl-body>
|
|
<vn-input-time
|
|
vn-one
|
|
vn-focus
|
|
ng-model="$ctrl.newTimeEntry.timed"
|
|
label="Hour"
|
|
required="true">
|
|
</vn-input-time>
|
|
<vn-autocomplete
|
|
label="Type"
|
|
ng-model="$ctrl.newTimeEntry.direction"
|
|
data="$ctrl.entryDirections"
|
|
select-fields="['code','description']"
|
|
show-field="description"
|
|
value-field="code"
|
|
required="true">
|
|
</vn-autocomplete>
|
|
</tpl-body>
|
|
<tpl-buttons>
|
|
<input type="button" response="cancel" translate-attr="{value: 'Cancel'}"/>
|
|
<button response="accept" translate>Save</button>
|
|
</tpl-buttons>
|
|
</vn-dialog>
|
|
<vn-confirm
|
|
vn-id="delete-entry-dialog"
|
|
on-accept="$ctrl.deleteTimeEntry()"
|
|
message="This time entry will be deleted"
|
|
question="Are you sure you want to delete this entry?">
|
|
</vn-confirm>
|
|
|
|
<!-- Edit entry Popover -->
|
|
<vn-popover vn-id="editEntry">
|
|
<vn-horizontal class="vn-pa-sm edit-time-entry">
|
|
<vn-autocomplete class="dense"
|
|
ng-model="$ctrl.selectedRow.direction"
|
|
data="$ctrl.entryDirections"
|
|
select-fields="['code','description']"
|
|
show-field="description"
|
|
value-field="code">
|
|
</vn-autocomplete>
|
|
<vn-icon-button vn-none
|
|
icon="check"
|
|
vn-tooltip="Save"
|
|
ng-click="$ctrl.save()">
|
|
</vn-icon-button>
|
|
</vn-horizontal>
|
|
</vn-popover> |