<div class="col-md-12" ng-controller="DataTableEntryController">
    <ul class="breadcrumb">
        <li ng-show="client"><a
                ng-href="#/viewclient/{{entityId}}">{{clientName}}</a></li>
        <li ng-show="group"><a
                ng-href="#/viewgroup/{{entityId}}">{{groupName}}</a></li>
        <li ng-show="center"><a
                ng-href="#/viewcenter/{{entityId}}">{{centerName}}</a></li>
        <li ng-show="loanproduct"><a
                ng-href="#/viewclient/{{clientId}}">{{LoanHolderclientName}}</a></li>
        <li ng-show="loanproduct"><a
                ng-href="#/viewloanaccount/{{entityId}}">{{loanproductName}}</a></li>
        <li ng-show="office"><a
                ng-href="#/viewoffice/{{entityId}}">{{officeName}}</a></li>
        <li ng-show="savingsaccount"><a
                ng-href="#/viewclient/{{clientId}}">{{savingsaccountholderclientName}}</a></li>
        <li ng-show="savingsaccount"><a
                ng-href="#/viewsavingaccount/{{entityId}}">{{savingsAccount}}</a></li>
    </ul>
<form class="form-horizontal well" ng-submit="submit()">
    <div ng-show="isViewMode">
        <h2>{{ 'label.heading.viewdatatableentry' | translate }}</h2>

        <div class="row pull-right btn-group">
            <a ng-click="editDatatableEntry()" class="btn btn-primary" has-permission='UPDATE_{{tableName}}'><i class="icon-edit icon-white"></i>{{
                'label.button.edit' | translate }}</a>
            <button type="button" ng-click="deleteDatatableEntry()" class="btn btn-danger" has-permission='DELETE_{{tableName}}'><i
                    class="icon-trash icon-white"></i> {{ 'label.button.delete' | translate }}
            </button>
        </div>
        <script type="text/ng-template" id="deletedatatable.html">
            <div class="modal-header silver">
                <h3 class="bolder">{{'label.heading.delete' | translate}}</h3>
            </div>
            <div class="modal-body">
                <api-validate></api-validate>
                <br>
                <button class="btn btn-warning" ng-click="cancel()">{{'label.button.cancel' | translate}}</button>
                <button class="btn btn-primary" ng-click="delete()">{{'label.button.confirm' | translate}}</button>
            </div>
        </script>
        <h3>{{ 'label.heading.datatablename' | translate }}-<strong>{{tableName}}</strong></h3>
        <hr>
        <table class="width100">
            <tr ng-repeat="column in columnHeaders">
                <td class="width30">{{column.columnName | prettifyDataTableColumn}}:</td>
                <td class="width60" valign="top">{{column.value}}</td>
            </tr>
        </table>
    </div>
    <div class="well" ng-hide="isViewMode">
        <h2>{{ 'label.heading.editdatatableentry' | translate }}</h2>
        <api-validate></api-validate>
        <fieldset>
            <legend>{{ 'label.heading.datatablename' | translate }}-<strong>{{tableName}}</strong></legend>
        </fieldset>
        <div class="form-group" ng-repeat="columnHeader in columnHeaders">
            <label class="control-label col-sm-3">{{ columnHeader.columnName | prettifyDataTableColumn}}
                <span ng-show="!columnHeader.isColumnNullable" class="required">*</span>
            </label>

            <div class="col-sm-3">
                <input ng-show="fieldType(columnHeader.columnDisplayType) == 'TEXT'" type="text"
                       ng-model="formData[columnHeader.columnName]" class="form-control"/>
                <input ng-show="fieldType(columnHeader.columnDisplayType) == 'DATE'" type="text"
                       datepicker-pop="dd MMMM yyyy" ng-model="formDat[columnHeader.columnName]"
                       is-open="opened{{$index}}" class="form-control"/>
                <div ng-show="fieldType(columnHeader.columnDisplayType) == 'DATETIME'" class="form-inline">
                    <div class="form-group">
                        <input type="text" datepicker-pop="dd MMMM yyyy"
                               ng-model="formDat[columnHeader.columnName].date"
                               is-open="opened{{$index}}" class="form-control"/>
                    </div>
                    <div class="form-group">
                        <input type="time" placeholder="HH:MM:SS"
                               ng-model="formDat[columnHeader.columnName].time" class="form-control"/>
                    </div>
                </div>
                <div ng-show="fieldType(columnHeader.columnDisplayType) == 'BOOLEAN'">
                    <label class="radio-inline">
                        <input type="radio" ng-model="formData[columnHeader.columnName]"
                           value="true"/>
                        {{'label.input.true' | translate}}
                    </label>
                    <label class="radio-inline">
                        <input type="radio" ng-model="formData[columnHeader.columnName]"
                               value="false"/>
                        {{'label.input.false' | translate}}
                    </label>
                </div>
                <span data-ng-switch on="columnHeader.columnDisplayType">
                    <select ng-show="fieldType(columnHeader.columnDisplayType) == 'SELECT'"
                            data-ng-switch-when="CODELOOKUP"
                            ng-model="formData[columnHeader.columnName]"
                            ng-options="columnValue.id as columnValue.value for columnValue in columnHeader.columnValues"
                            value="{{columnValue.id}}" class="form-control">
                        <option value="">{{'label.selectone' | translate}}</option>
                    </select>
                    <div  ng-show="showSelect==true">
                        <select ng-show="fieldType(columnHeader.columnDisplayType) == 'SELECT'"
                                data-ng-switch-when="CODEVALUE"
                                ng-model="formData[columnHeader.columnName]"
                                ng-options="columnValue.value as columnValue.value for columnValue in columnHeader.columnValues"
                                value="{{columnValue.id}}" class="form-control">
                            <option value="">{{'label.selectone' | translate}}</option>
                        </select>
                    </div>
                    <div ng-show="showSelect==false">
                        <select ng-show="fieldType(columnHeader.columnDisplayType) == 'SELECT'"
                                data-ng-switch-when="CODEVALUE"
                                chosen="columnHeader.columnValues"
                                ng-model="formData[columnHeader.columnName]"
                                ng-options="columnValue as columnValue.value for columnValue in columnHeader.columnValues "
                                value="{{columnValue.id}}" class="form-control"
                                ng-change="changeVillage(formData[columnHeader.columnName])">
                            <option value=""> {{'label.selectone' | translate}}</option>
                        </select>
                    </div>
                </span>
            </div>

        </div>
        <div class="col-md-offset-3">
            <a id="cancel" class="btn btn-default" ng-click="cancel()">{{ 'label.button.cancel' | translate }}</a>
            <button id="save" type="submit" has-permission='UPDATE_{{tableName}}' class="btn btn-primary">{{ 'label.button.save' | translate }}</button>
        </div>
    </div>
</form>
    </div>
