maestrano/mnoe-admin-panel

<div id="app-connect-modal">
  <div class="modal-header">
    <div class="close" type="button" aria-label="{{'mnoe_admin_panel.dashboard.customers.connect_app.xero.close' | translate}}" ng-click="vm.close()">×</div>
    <h3 class="modal-title" translate-values="{app_name: vm.app.name}" translate>mnoe_admin_panel.dashboard.customers.connect_app.xero.title</h3>
  </div>

  <div class="modal-body">
    <h4 class="text-center" translate>mnoe_admin_panel.dashboard.customers.connect_app.xero.description</h4>
    <div class="top-buffer-1"></div>

    <form>
      <input type="hidden" ng-model="vm.form.perform"/>
      <div class="top-buffer-2"></div>
      <div class="form-group text-center">
        <h5 translate>mnoe_admin_panel.dashboard.customers.connect_app.xero.payroll_description</h5>
        <label translate>mnoe_admin_panel.dashboard.customers.connect_app.xero.payroll</label>
        <input type="checkbox" ng-model="vm.payroll" name="extra_params[]"/>
      </div>
      <div class="form-group text-center" ng-if="vm.payroll" ng-cloak="true">
        <h5 translate>mnoe_admin_panel.dashboard.customers.connect_app.xero.country</h5>
        <select ng-model="vm.form.xero_country" name="xero_country"
                ng-options="country.value as country.label | translate for country in vm.countries"></select>
      </div>
    </form>
  </div>

  <div class="modal-footer">
    <button type="submit" class="btn btn-primary" ng-click="vm.connect(vm.form)" translate>mnoe_admin_panel.dashboard.customers.connect_app.xero.connect</button>
    <button class="btn btn-default" ng-click="vm.close()" translate>mnoe_admin_panel.dashboard.customers.connect_app.xero.cancel</button>
  </div>
</div>