cloudron-box/src/views/support.html

<div class="content">

  <div class="text-left">
    <h1>{{ 'support.title' | tr }}</h1>
  </div>

  <div class="text-left">
    <h3>{{ 'support.ticket.title' | tr }}</h3>
  </div>

  <div class="card">
    <div class="grid-item-top">
      <div class="row" ng-hide="ready">
        <h2 class="text-center"><i class="fa fa-circle-notch fa-spin"></i></h2>
      </div>
      <div class="row" ng-show="ready">
        <div class="col-lg-12">
          <div ng-show="subscription && !subscription.emailVerified" style="margin-bottom: 30px;">
            <p class="text-bold">
              {{ 'support.ticket.emailNotVerified' | tr:{ email: subscription.email } }}
              <br/>
              <center>
                <a ng-href="{{ config.consoleServerOrigin }}" target="_blank" class="btn btn-success">{{ 'support.ticket.emailVerifyAction' | tr }}</a>
              </center>
            </p>
          </div>

          <div ng-bind-html="supportConfig.ticketFormBody | markdown2html"></div>

          <form ng-show="supportConfig.submitTickets" name="feedbackForm" ng-submit="submitFeedback()">
            <div class="form-group">
              <label>{{ 'support.ticket.type' | tr }}</label>
              <select class="form-control" name="type" style="width: 50%;" ng-model="feedback.type" required ng-disabled="!subscription.emailVerified">
                <option value="app_error">{{ 'support.ticket.typeApp' | tr }}</option>
                <option value="ticket">{{ 'support.ticket.typeBug' | tr }}</option>
                <option value="email_error">{{ 'support.ticket.typeEmail' | tr }}</option>
              </select>
            </div>
            <div class="form-group" ng-show="feedback.type === 'app_error'">
              <label>{{ 'support.ticket.selectApp' | tr }}</label>
              <select class="form-control" name="type" style="width: 50%;" ng-model="feedback.appId" ng-required="feedback.type === 'app_error'" ng-disabled="!subscription.emailVerified">
                <option ng-repeat="app in apps" value="{{ app.id }}">{{ app.fqdn }}</option>
              </select>
            </div>
            <div class="form-group" ng-class="{ 'has-error': (feedbackForm.subject.$dirty && feedbackForm.subject.$invalid) }">
              <label>{{ 'support.ticket.topic' | tr }}</label>
              <input type="text" class="form-control" name="subject" ng-model="feedback.subject" ng-maxlength="512" ng-minlength="1" required ng-disabled="!subscription.emailVerified">
            </div>
            <div class="form-group" ng-class="{ 'has-error': (feedbackForm.description.$dirty && feedbackForm.description.$invalid) }">
              <label>{{ 'support.ticket.report' | tr }}</label>
              <textarea class="form-control" name="description" rows="3" placeholder="{{ 'support.ticket.reportPlaceholder' | tr }}" ng-model="feedback.description" ng-minlength="1" required ng-disabled="!subscription.emailVerified"></textarea>
            </div>
            <div class="form-group" ng-class="{ 'has-error': feedbackForm.email.$invalid }">
              <label>{{ 'support.ticket.email' | tr }}</label> <small>{{ 'support.ticket.emailInfo' | tr:{ email: subscription.email } }}</small>
              <input type="email" class="form-control" name="email" placeholder="{{ 'support.ticket.emailPlaceholder' | tr }}" ng-model="feedback.altEmail" ng-required="feedback.type === 'email_error'" ng-disabled="!subscription.emailVerified">
            </div>
            <div class="form-group">
              <label class="control-label">
                <input type="checkbox" ng-model="feedback.enableSshSupport" ng-disabled="!subscription.emailVerified"> {{ 'support.ticket.sshCheckbox' | tr }}
              </label>
            </div>
            <button type="submit" class="btn btn-primary pull-right" ng-disabled="!subscription.emailVerified || feedbackForm.$invalid || feedback.busy"><i class="fa fa-circle-notch fa-spin" ng-show="feedback.busy"></i> {{ 'support.ticket.submitAction' | tr }}</button>
            <span ng-show="feedback.error" class="text-danger text-bold">{{feedback.error}}</span>
            <span ng-show="feedback.result" class="text-success text-bold">{{feedback.result.message}}</span>
          </form>
        </div>
      </div>
    </div>
  </div>

  <div class="text-left">
    <h3>{{ 'support.remoteSupport.title' | tr }}</h3>
  </div>

  <div class="card">
    <div class="grid-item-top">
      <div class="row" ng-hide="ready">
        <h2 class="text-center"><i class="fa fa-circle-notch fa-spin"></i></h2>
      </div>
      <div class="row" ng-show="ready">
        <div class="col-lg-12">
          <p>{{ 'support.remoteSupport.description' | tr }}</p>
          <div>
            <b>{{ 'support.remoteSupport.warning' | tr }}</b>
            <br/>
            <br/>
            <b class="pull-left text-danger text-bold" ng-show="toggleSshSupportError">{{ toggleSshSupportError }}</b>
            <button class="btn pull-right" ng-class="!sshSupportEnabled ? 'btn-danger' : 'btn-primary'" ng-click="toggleSshSupport()">{{ sshSupportEnabled ? ('support.remoteSupport.disableAction' | tr) : ('support.remoteSupport.enableAction' | tr) }}</button>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>