<vn-descriptor-content
    module="zone"
    description="$ctrl.zone.name"
    summary="$ctrl.$.summary">
    <slot-menu>
        <vn-item class="vn-item"
            ng-click="$ctrl.onDelete()"
            translate>
            Delete
        </vn-item>
        <vn-item
            ng-click="clone.show()"
            name="cloneZone"
            translate>
            Clone
        </vn-item>
    </slot-menu>
    <slot-body>
        <div class="attributes">
            <vn-label-value
                label="Agency"
                value="{{$ctrl.zone.agencyMode.name}}">
            </vn-label-value>
            <vn-label-value
                label="Closing hour"
                value="{{$ctrl.zone.hour | date: 'HH:mm'}}">
            </vn-label-value>
            <vn-label-value
                label="Traveling days"
                value="{{$ctrl.zone.travelingDays}}">
            </vn-label-value>
            <vn-label-value
                label="Price"
                value="{{$ctrl.zone.price | currency: 'EUR': 2}}">
            </vn-label-value>
            <vn-label-value
                label="Bonus"
                value="{{$ctrl.zone.bonus | currency: 'EUR': 2}}">
            </vn-label-value>
        </div>
    </slot-body>
</vn-descriptor-content>
<vn-popup vn-id="summary">
    <vn-zone-summary zone="$ctrl.zone"></vn-zone-summary>
</vn-popup>

<vn-confirm
    vn-id="deleteZone"
    on-accept="$ctrl.deleteZone()"
    message="This zone will be removed">
</vn-confirm>
<vn-confirm
    vn-id="clone"
    on-accept="$ctrl.onCloneAccept()"
    question="Do you want to clone this zone?"
    message="All it's properties will be copied">
</vn-confirm>