<div ng-controller="Complaints.InfoController">
    <div class="clearfix">
        <div class="row">
            <div class="col-xs-6">
                <h4>
                    <a href="#" editable-text="objectInfo.complaintTitle" onaftersave="saveComplaint()" permission="editComplaint"
                            permission-object-type="COMPLAINT" permission-properties="objectInfo" permission-action="disable" e-required>
                        {{objectInfo.complaintTitle || 'common.value.unknown' | translate }}
                    </a>
                    <a ng-href="#" editable-select="objectInfo.status" onaftersave="saveComplaint()" permission="editComplaintStatus"
                            permission-object-type="COMPLAINT" permission-properties="objectInfo" permission-action="disable"
                            e-ng-options="c.key as (c.value | translate) for c in complaintStatuses">
                        ({{ (objectInfo.status | translateData: 'core.lookups.complaints.statuses' : lang) || ('common.value.unknown' |
                        translate) }})
                    </a>
                </h4></div>
            <div class="col-xs-6  text-right">
                <h4>{{objectInfo.complaintNumber}}</h4>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-12 col-md-4">
                <div class="h4 font-bold">
                    <a href="#" editable-select="objectInfo.complaintType" onaftersave="saveComplaint()" permission="editComplaint"
                            permission-object-type="COMPLAINT" permission-properties="objectInfo" permission-action="disable"
                            e-ng-options="c.key as (c.value | translate) for c in complaintTypes">
                        {{ (objectInfo.complaintType | translateData: 'core.lookups.categories' : lang) || ('common.value.unknown' |
                        translate) }}</a>
                </div>
                <small class="text-muted"><span translate>complaints.comp.info.type.label</span></small>
            </div>
            <div class="col-xs-12 col-md-4">
                <div class="h4 font-bold">{{objectInfo.created | date: ('common.defaultDateTimeUIFormat' | translate) }}
                </div>
                <small class="text-muted"><span translate>complaints.comp.info.created.label</span></small>
            </div>
            <div class="col-xs-12 col-md-4">
                <div class="h4 font-bold">
                    <a href="#" editable-select="objectInfo.priority" onaftersave="saveComplaint()" permission="editComplaint"
                            permission-object-type="COMPLAINT" permission-properties="objectInfo" permission-action="disable"
                            e-ng-options="p.key as (p.key | translateData: 'core.lookups.priorities' : lang) for p in priorities">
                        {{ (objectInfo.priority | translateData: 'core.lookups.priorities' : lang) || ('common.value.unknown' | translate)
                        }}</a>
                </div>
                <small class="text-muted"><span translate>complaints.comp.info.priority.label</span></small>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-12 col-md-4">
                <div class="h4 font-bold">
                    <a href="javascript:;" class="editable-click no-outline" ng-click="userOrGroupSearch()"
                            permission="editComplaintOwningGroup" permission-object-type="COMPLAINT" permission-properties="objectInfo"
                            permission-action="disable">
                        <user-full-name userId="assignee" fallback="{{'common.value.none' | translate}}" />
                    </a>
                </div>
                <small class="text-muted"><span translate>complaints.comp.info.assignee.label</span></small>
            </div>
            <div class="col-xs-12 col-md-4">
                <div class="h4 font-bold">
                    <a href="javascript:;" class="editable-click no-outline" ng-click="userOrGroupSearch()"
                            permission="editComplaintOwningGroup" permission-object-type="COMPLAINT" permission-properties="objectInfo"
                            permission-action="disable">
                        {{owningGroup || 'common.value.none' | translate}}</a>
                </div>
                <small class="text-muted"><span translate>complaints.comp.info.owningGroup.label</span></small>
            </div>
            <div class="col-xs-12 col-md-4">
                <div class="h4 font-bold popup-move-on-left">
                    <a href="javascript:;"
                       ng-click="registerWatcher()"
                       moment-picker="dueDate.dueDateInfoUIPicker"
                       ng-model="dueDate.dueDateInfo"
                       format="MM/DD/YYYY h:mmA"
                       min-date="minDate"
                       start-view="month"
                       auto-close="true"
                       is-open="dueDate.isOpen"
                       permission="editComplaint" permission-object-type="COMPLAINT" permission-properties="objectInfo" permission-action="disable">
                        {{ (dateInfo.dueDate | date: ('common.defaultDateTimeUIFormat' | translate) ) || ('common.value.unknown' | translate) }}
                    </a>
                </div>
                <small class="text-muted"><span translate>complaints.comp.info.dueDate.label</span></small>
            </div>
        </div>
    </div>
</div>
