salix/modules/zone/front/events/index.html

<vn-zone-calendar
    id="calendar"
    vn-id="calendar"
    data="data"
    on-selection="$ctrl.onSelection($days, $type, $weekday, $events, $exclusions)"
    on-step="$ctrl.refresh()"
    class="vn-w-md">
</vn-zone-calendar>
<vn-side-menu side="right">
    <div class="vn-pa-md">
        <h6
            class="text-secondary"
            style="font-weight: normal;"
            translate>
            Edit mode
        </h6>
        <vn-vertical>
            <vn-radio
                label="Include"
                val="include"
                ng-model="$ctrl.editMode">
            </vn-radio>
            <vn-radio
                label="Exclude"
                val="exclude"
                ng-model="$ctrl.editMode">
            </vn-radio>
        </vn-vertical>
    </div>
    <h6
        class="text-secondary vn-px-md"
        style="font-weight: normal;"
        translate>
        Events
    </h6>
    <vn-data-viewer
        data="data.events"
        is-loading="!data.events">
        <div class="vn-list separated">
        <a
            ng-repeat="row in data.events"
            translate-attr="{title: 'Edit'}"
            ng-click="$ctrl.onEditClick(row, $event)"
            class="vn-item">
            <vn-item-section>
                <div
                    ng-if="::row.type == 'day'"
                    class="vn-mb-sm">
                    {{::row.dated | date:'dd/MM/yy'}}
                </div>
                <div
                    ng-if="::row.type != 'day'"
                    class="vn-mb-sm ellipsize">
                    <span ng-if="row.weekDays">
                        {{::$ctrl.formatWdays(row.weekDays)}}
                    </span>
                    <span ng-if="row.type == 'range'">
                        ({{::row.started | date:'dd/MM/yy'}} - {{::row.ended | date:'dd/MM/yy'}})
                    </span>
                </div>
                <vn-label-value
                    label="Closing" 
                    value="{{::row.hour | date:'HH:mm'}}">
                </vn-label-value>
                <vn-label-value
                    label="Traveling days" 
                    value="{{::row.travelingDays}}">
                </vn-label-value>
                <vn-label-value
                    label="Price" 
                    value="{{::row.price | currency:'EUR':2}}">
                </vn-label-value>
                <vn-label-value
                    label="Bonus" 
                    value="{{::row.bonus | currency:'EUR':2}}">
                </vn-label-value>
                <vn-label-value
                    label="Max m³" 
                    value="{{::row.m3Max}}">
                </vn-label-value>
            </vn-item-section>
            <vn-item-section side>
                <vn-icon-button
                    icon="delete"
                    translate-attr="{title: 'Delete'}"
                    ng-click="$ctrl.onDeleteClick(row.id, $event)">
                </vn-icon-button>
            </vn-item-section>
        </a>
        </div>
    </vn-data-viewer>
</vn-side-menu>
<vn-float-button
    ng-click="$ctrl.create('weekday')"
    icon="add"
    vn-tooltip="Add event"
    vn-bind="+"
    fixed-bottom-right>
</vn-float-button>
<vn-dialog 
    vn-id="includeDialog"
    on-response="$ctrl.onIncludeResponse($response)"
    message="{{$ctrl.isNew ? 'Add event' : 'Edit event'}}">
    <tpl-body>
        <vn-vertical>
            <vn-vertical class="vn-pb-md">
                <vn-radio
                    ng-model="$ctrl.selected.type"
                    label="One day"
                    val="day">
                </vn-radio>
                <vn-radio
                    ng-model="$ctrl.selected.type"
                    label="Indefinitely"
                    val="indefinitely">
                </vn-radio>
                <vn-radio
                    ng-model="$ctrl.selected.type"
                    label="Range of dates"
                    val="range">
                </vn-radio>
            </vn-vertical>
            <vn-wday-picker
                ng-if="$ctrl.selected.type != 'day'"
                ng-model="$ctrl.selected.wdays"
                class="vn-mt-sm vn-mb-md">
            </vn-wday-picker>
            <vn-date-picker
                ng-if="$ctrl.selected.type == 'day'"
                label="Day"
                ng-model="$ctrl.selected.dated">
            </vn-date-picker>
            <vn-horizontal
                ng-if="$ctrl.selected.type == 'range'">
                <vn-date-picker
                    label="From"
                    ng-model="$ctrl.selected.started">
                </vn-date-picker>
                <vn-date-picker
                    label="To"
                    ng-model="$ctrl.selected.ended">
                </vn-date-picker>
            </vn-horizontal>
            <vn-horizontal>
                <vn-input-time
                    label="Closing"
                    ng-model="$ctrl.selected.hour">
                </vn-input-time>
                <vn-input-number
                    label="Traveling days"
                    ng-model="$ctrl.selected.travelingDays"
                    min="0"
                    step="1">
                </vn-input-number>
            </vn-horizontal>
            <vn-horizontal>
                <vn-input-number
                    label="Price"
                    ng-model="$ctrl.selected.price"
                    min="0"
                    step="0.01">
                </vn-input-number>
                <vn-input-number
                    label="Bonus"
                    ng-model="$ctrl.selected.bonus"
                    min="0"
                    step="0.01">
                </vn-input-number>
            </vn-horizontal>
            <vn-input-number
                label="Max m³"
                ng-model="$ctrl.selected.m3Max"
                min="0"
                step="0.01">
            </vn-input-number>
        </vn-vertical>
    </tpl-body>
    <tpl-buttons>
        <input
            type="button"
            response="cancel"
            translate-attr="{value: 'Cancel'}">
        </input>
        <input
            type="button"
            ng-if="!$ctrl.isNew"
            response="delete"
            translate-attr="{value: 'Delete'}">
        </input>
        <button response="accept">
            <span ng-if="$ctrl.isNew" translate>Add</span>
            <span ng-if="!$ctrl.isNew" translate>Save</span>
        </button>
    </tpl-buttons>
</vn-dialog>
<vn-confirm 
    vn-id="confirm"
    message="This item will be deleted"
    question="Are you sure you want to continue?">
</vn-confirm>
<vn-dialog 
    vn-id="excludeDialog"
    on-response="$ctrl.onExcludeResponse($response)"
    message="Exclusion">
    <tpl-body>
        <vn-date-picker
            label="Day"
            ng-model="$ctrl.selected.dated">
        </vn-date-picker>
        <vn-vertical style="width: 600px;">
            <vn-vertical class="vn-pb-md">
                <vn-radio
                    ng-model="$ctrl.excludeType"
                    label="All"
                    on-change="$ctrl.test()"
                    val="all">
                </vn-radio>
                <vn-radio
                    ng-model="$ctrl.excludeType"
                    label="Specific locations"
                    on-change="$ctrl.onSearch($params)" 
                    val="specificLocations">
                </vn-radio>
            </vn-vertical>
            <vn-crud-model
                vn-id="model"
                url="Zones/{{$ctrl.$params.id}}/getLeaves"
                filter="$ctrl.filter">
            </vn-crud-model>
            <div ng-if="$ctrl.excludeType == 'specificLocations'">
                <vn-textfield
                    label="Search"
                    ng-keydown="$ctrl.onKeyDown($event)"
                    ng-model="$ctrl.excludeSearch">
                </vn-textfield>
                <div style="max-height: 300px; overflow: auto;">
                    <vn-treeview
                        vn-id="treeview"
                        root-label="Locations where it is not distributed"
                        fetch-func="$ctrl.onFetch($item)"
                        sort-func="$ctrl.onSort($a, $b)">
                        <vn-check
                            ng-model="geo.checked"
                            on-change="$ctrl.onSelection2(value, item)" 
                            ng-click="$event.preventDefault()"
                            label="{{::item.name}}"> 
                        </vn-check>
                    </vn-treeview>
                </div>
            </div>
        </vn-vertical>
    </tpl-body>
    <tpl-buttons>
        <input
            type="button"
            response="cancel"
            translate-attr="{value: 'Cancel'}">
        </input>
        <input
            type="button"
            ng-if="!$ctrl.isNew"
            response="delete"
            translate-attr="{value: 'Delete'}">
        </input>
        <button response="accept">
            <span ng-if="$ctrl.isNew" translate>Add</span>
            <span ng-if="!$ctrl.isNew" translate>Save</span>
        </button>
    </tpl-buttons>
</vn-dialog>