myems/admin/views/settings/meter/offline-meter.model.html

<div class="inmodal">
    <div class="modal-header">
        <h4 class="modal-title">{{operation | translate}}</h4>
    </div>
    <div class="modal-body">
        <form role="form" name="form_offlinemeter" novalidate class="form-horizontal">
            <div class="form-group"><label class="col-sm-4 control-label">{{'SETTING.NAME' | translate}}</label>

                <div class="col-sm-8"><input ng-model="offlinemeter.name" type="text" name="offlinemetername" class="form-control" required="">
                    <div class="m-t-xs" ng-show="form_offlinemeter.offlinemetername.$invalid && form_offlinemeter.offlinemetername.$dirty">
                        <small class="text-danger" ng-show="form_offlinemeter.offlinemetername.$error.required">{{'SETTING.INPUT_NAME' | translate}}</small>
                    </div>
                </div>
            </div>
            <div class="hr-line-dashed"></div>
            <div class="form-group"><label class="col-sm-4 control-label">{{'SETTING.CATEGORY' | translate}}</label>
                <div class="col-sm-8">
                    <ui-select ng-model="offlinemeter.energy_category.id" name="offlinemeter.energy_category_id" theme="bootstrap" required>
                        <ui-select-match placeholder="{{'COMMON.PLACEHOLDER' | translate}}">{{$select.selected.name}}</ui-select-match>
                        <ui-select-choices repeat="category.id as category in categories | filter: $select.search">
                            <div ng-bind-html="category.name | highlight: $select.search"></div>
                        </ui-select-choices>
                    </ui-select>
                    <div class="m-t-xs" ng-show="form_offlinemeter.offlinemeter.energy_category_id.$invalid && form_offlinemeter.offlinemeter.energy_category_id.$dirty">
                        <small class="text-danger" ng-show="form_offlinemeter.offlinemeter.energy_category_id.$error.required">{{'SETTING.SELECT_CATEGORY' | translate}}</small>
                    </div>
                </div>
            </div>
            <div class="hr-line-dashed"></div>
            <div class="form-group"><label class="col-sm-4 control-label">{{'SETTING.ENERGY_ITEM' | translate}}</label>
                <div class="col-sm-8">
                    <ui-select ng-model="offlinemeter.energy_item.id" name="offlinemeter.energy_item_id" theme="bootstrap">
                        <ui-select-match allow-clear="true" placeholder="{{'COMMON.PLACEHOLDER' | translate}}">{{$select.selected.name}}</ui-select-match>
                        <ui-select-choices repeat="energyitem.id as energyitem in energyitems | filter: $select.search">
                            <div ng-bind-html="energyitem.name | highlight: $select.search"></div>
                        </ui-select-choices>
                    </ui-select>
                    <div class="m-t-xs" ng-show="form_offlinemeter.offlinemeter.energy_item_id.$invalid && form_offlinemeter.offlinemeter.energy_item_id.$dirty">
                        <small class="text-danger" ng-show="form_offlinemeter.offlinemeter.energy_item_id.$error.required">{{'SETTING.SELECT_ENERGY_ITEM' | translate}}</small>
                    </div>
                </div>
            </div>
            <div class="hr-line-dashed"></div>
            <div class="form-group"><label class="col-sm-4 control-label">{{'SETTING.IS_INPUT_COUNTED' | translate}}</label>

                <div class="col-sm-8">
                    <div class="checkbox checkbox-success">
                        <input id="chk_offlinemeter_iscounted" type="checkbox" ng-model="offlinemeter.is_counted" ng-checked="offlinemeter.is_counted">
                        <label for="chk_offlinemeter_iscounted">{{'SETTING.IS_INPUT_COUNTED' | translate}}</label>
                    </div>

                </div>
            </div>
            <div class="hr-line-dashed"></div>
            <div class="form-group"><label class="col-sm-4 control-label">{{'METER.HOURLY_LOW_LIMIT' | translate}}</label>
                <div class="col-sm-8"><input ng-model="offlinemeter.hourly_low_limit" type="number" name="offlinemeterhourlylowlimit" class="form-control" required>
                    <div class="m-t-xs" ng-show="form_offlinemeter.offlinemeterhourlylowlimit.$invalid && form_offlinemeter.offlinemeterhourlylowlimit.$dirty">
                        <small class="text-danger" ng-show="form_offlinemeter.offlinemeterhourlylowlimit.$error.required">{{'METER.INPUT_HOURLY_LOW_LIMIT' | translate}}</small>
                        <small class="text-danger" ng-show="form_offlinemeter.offlinemeterhourlylowlimit.$error">{{'SETTING.INVALID_FORMAT' | translate}}</small>
                    </div>
                </div>
            </div>
            <div class="hr-line-dashed"></div>
            <div class="form-group"><label class="col-sm-4 control-label">{{'METER.HOURLY_HIGH_LIMIT' | translate}}</label>
                <div class="col-sm-8"><input ng-model="offlinemeter.hourly_high_limit" type="number" name="offlinemeterhourlyhighlimit" class="form-control" required>
                    <div class="m-t-xs" ng-show="form_offlinemeter.offlinemeterhourlyhighlimit.$invalid && form_offlinemeter.offlinemeterhourlyhighlimit.$dirty">
                        <small class="text-danger" ng-show="form_offlinemeter.offlinemeterhourlyhighlimit.$error.required">{{'METER.INPUT_HOURLY_HIGH_LIMIT' | translate}}</small>
                        <small class="text-danger" ng-show="form_offlinemeter.offlinemeterhourlyhighlimit.$error">{{'SETTING.INVALID_FORMAT' | translate}}</small>
                    </div>
                </div>
            </div>
            <div class="hr-line-dashed"></div>
            <div class="form-group"><label class="col-sm-4 control-label">{{'SETTING.COSTCENTER' | translate}}</label>
                <div class="col-sm-8">
                    <ui-select ng-model="offlinemeter.cost_center.id" theme="bootstrap" required>
                        <ui-select-match allow-clear="false" placeholder="{{'COMMON.PLACEHOLDER' | translate}}">{{$select.selected.name}}</ui-select-match>
                        <ui-select-choices repeat="costcenter.id as costcenter in costcenters | filter: $select.search">
                            <div ng-bind-html="costcenter.name | highlight: $select.search"></div>
                        </ui-select-choices>
                    </ui-select>
                </div>
            </div>
            <div class="hr-line-dashed"></div>
            <div class="form-group"><label class="col-sm-4 control-label">{{'METER.DESCRIPTION' | translate}} ({{'SETTING.OPTIONAL' | translate}})</label>
              <div class="col-sm-8">
                  <input ng-model="offlinemeter.description" type="text" name="offlinemeterdescription" class="form-control" >
                  <div class="m-t-xs" ng-show="form_offlinemeter.meterdescription.$invalid && form_offlinemeter.offlinemeterdescription.$dirty">
                      <small class="text-danger" ng-show="form_offlinemeter.offlinemeterdescription.$error.required">{{'METER.INPUT_DESCRIPTION' | translate}}</small>
                  </div>
              </div>
            </div>
        </form>
    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-white" ng-click="cancel()">{{'SETTING.CANCEL' | translate}}</button>
        <button type="button" ng-disabled="form_offlinemeter.$invalid" class="btn btn-primary" ng-click="ok()">{{'SETTING.SAVE' | translate}}</button>
    </div>
</div>