<div class="modal-header">
    <h3>
        <ng-switch on="editMode">
            <span ng-switch-when="true" translate>common.editPerson.title</span>
            <span ng-switch-default translate>common.addPerson.title</span>
        </ng-switch>
    </h3>
</div>
<div class="modal-body">
    <form name="addPersonForm">
        <div class="row">
            <div class="col-sm-6 form-group">
                <label>&nbsp;</label>
                <button type="button" class="btn btn-primary" ng-show="addNewEnabled" ng-click="addNewPerson()" translate>
                    common.addPerson.addNew.label
                </button>
            </div>
            <div class="col-sm-6 form-group" ng-show="showSetPrimary">
                <label translate>common.addPerson.setPrimary.label</label><span class="required-asterisk">*</span>
                <label>
                    <input type="radio" ng-model="isDefault" name="'{{common.addPerson.radioName}}'" ng-value="true">
                    <translate>common.addPerson.radioYes.text</translate>
                </label>
                <label ng-hide="hideNoField">
                    <input type="radio" ng-model="isDefault" name="'{{common.addPerson.radioName}}'" ng-value="false">
                    <translate>common.addPerson.radioNo.text</translate>
                </label>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-6 form-group">
                <div>
                    <label for="person" translate>common.addPerson.person.label</label>
                    <span class="required-asterisk">*</span>
                </div>
                <input id="person" class="form-control" type="text" ng-model="personName" readonly ng-disabled="!selectExistingEnabled"
                        ng-click="pickPerson()" placeholder="{{'common.addPerson.selectExisting.label' | translate}}" required>
            </div>
            <div class="col-sm-6 form-group" ng-if="!hideAssociationTypes">
                <div>
                    <label for="types">{{assocTypeLabel}}</label>
                    <span class="required-asterisk">*</span>
                </div>
                <select class="input-md form-control" id="types" ng-model="$parent.type" ng-options="o.value | translate for o in types"
                        ng-disabled="!$parent.pickerTypeEnabled" required></select>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-12">
                <span class="text-danger" ng-if="duplicatePersonRoleError">
                    <span translate>
                        common.addPerson.duplicatePersonRoleErrorMessage
                    </span>
                </span>
            </div>
        </div>
        <div class="row" ng-show="showDescription">
            <div class="col-sm-12">
                <textarea id="description" class="form-control" ng-model="description"></textarea>
            </div>
        </div>
    </form>
</div>
<div class="modal-footer">
    <button class="btn btn-secondary" ng-click="onClickCancel()">
        <span translate>common.addPerson.btnCancel.text</span>
    </button>
    <button class="btn btn-primary" ng-click="onClickOk()" ng-disabled="addPersonForm.$invalid || isInvalid()">
        <span translate>common.addPerson.btnOk.text</span>
    </button>
</div>