<div class="content-container" ng-controller="HoldSavingsAccountController">
    <ul class="breadcrumb">
        <li><a href="#/viewsavingaccount/{{savingsId}}">{{'label.anchor.viewsavingsaccount' | translate}}</a></li>
        <li class="active">{{'label.anchor.holdaccount' | translate}}</li>
    </ul>
    <div class="card">
        <div class="content">
            <div class="toolbar">
                <h4>{{ 'label.heading.hold' | translate }}</h4>
            </div>
            <br/>
            <form class="form-horizontal" name="holdaccountform" novalidate="" ng-submit="submit()">
                <api-validate></api-validate>
                <fieldset>
                    <div class="form-group">
                        <label class="control-label col-sm-2" for="holdOption">{{ 'label.input.hold' | translate }}<span
                                class="required">*</span></label>

                        <div class="col-sm-3">
                            <select id="holdOption" ng-model="holdOption" name="holdOption" class="form-control"  ng-change="holdChange(holdOption)">
                                <option class="displaynone" value="">{{'label.selectone' | translate}}</option>
                                <option value="savingsAccountBlock">{{'label.savingsaccountblock' | translate}}</option>
                                <option value="savingsAccountUnBlock">{{'label.savingsaccountunblock' | translate}}</option>

                                <option value="debitTransactionFreeze">{{'label.debittransactionfreeze' | translate}}</option>
                                <option value="debitTransactionUnFreeze">{{'label.debittransactionunfreeze' | translate}}</option>

                                <option value="creditTransactionFreeze">{{'label.credittransactionfreeze' | translate}}</option>
                                <option value="creditTransactionUnFreeze">{{'label.credittransactionunfreeze' | translate}}</option>

                                <option value="savingsTransactionFreeze">{{'label.savingsTransactionfreeze' | translate}}</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-group" ng-show="showHoldAccount">
                        <label class="control-label col-sm-2" for="transactionAmount">{{'label.input.transactionamount' | translate}}<span
                                class="required">*</span></label>

                        <div class="col-sm-3">
                            <input id="transactionAmount" type="text" name="transactionAmount" ng-model="formData.transactionAmount"
                                   required="required" class="form-control" required late-Validate/>
                        </div>

                            <label class="control-label col-sm-1" for="lien">{{'label.input.Lein' | translate}}  <i class="fa fa-question-circle"
                                                                                                        uib-tooltip="{{'label.tooltip.hold.lein' | translate}}"
                                                                                                        tooltip-append-to-body="true"></i> </label>
                            <div class="col-sm-2">
                                <label class="checkbox">
                                    <input id="lien" type="checkbox" ng-model="formData.lien">
                                </label>
                            </div>
                    </div>
                    <div class="form-group" ng-show="showHoldAccount">
                        <label class="control-label col-sm-2">{{ 'label.input.transactiondate' | translate }}<span
                                class="required">*</span></label>

                        <div class="col-sm-3">
                            <input id="transactiondate" sort type="text" datepicker-pop="dd MMMM" ng-model="formData.transactionDate"
                                   is-open="opened" class="form-control"/>
                        </div>
                    </div>
                    <div class="form-group" ng-show="showHoldReasons">
                        <label class="control-label col-sm-2" for="reasons">{{'label.input.reasons' | translate}}<span
                                class="required">*</span></label>

                        <div class="col-sm-3">
                            <select id="reasons" ng-model="formData.reasonForBlock"
                                    ng-options="reason.name as reason.name for reason in reasons"
                                    value="{{reason.name}}" required="required"
                                    class="form-control">
                                <option style="display:none" value="">{{'label.menu.selectone' | translate}}
                            </select>
                        </div>

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