rework update ui

- this is not modal anymore
- can be canceled
This commit is contained in:
Girish Ramakrishnan
2018-11-30 16:06:37 -08:00
parent cbdb90d06b
commit d8dfa89f87
6 changed files with 65 additions and 193 deletions

View File

@@ -19,30 +19,17 @@
</div>
<div ng-show="installedApps | readyToUpdate">
<b ng-show="config.update.box.upgrade" class="text-danger">
This update upgrades the base system and will cause some application downtime.<br/>
</b>
<p>Changes:</p>
<ul>
<li ng-repeat="change in config.update.box.changelog" ng-bind-html="change | markdown2html"></li>
</ul>
<br/>
<p ng-show="update.error.generic" class="text-danger">{{ update.error.generic }}</p>
<div ng-hide="config.provider !== 'caas' && config.update.box.upgrade">
<fieldset>
<form name="update_form" role="form" ng-submit="update.submit()" autocomplete="off">
<input class="ng-hide" type="submit" ng-disabled="update_form.$invalid || update.busy"/>
</form>
</fieldset>
</div>
<div ng-show="config.provider !== 'caas' && config.update.box.upgrade">
<b>Please use the CLI tool to upgrade by following the instructions <a ng-href="{{ config.webServerOrigin + '/documentation/updates/' }}" target="_blank" >here</a>.</b>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-success" ng-click="update.submit()" ng-disabled="update_form.$invalid || update.busy" ng-show="(installedApps | readyToUpdate) && !(config.provider !== 'caas' && config.update.box.upgrade)"><i class="fa fa-circle-notch fa-spin" ng-show="update.busy"></i> Update</button>
<button type="button" class="btn btn-success" ng-click="update.startUpdate()" ng-disabled="update.busy" ng-show="(installedApps | readyToUpdate)"><i class="fa fa-circle-notch fa-spin" ng-show="update.busy"></i> Update</button>
</div>
</div>
</div>
@@ -185,10 +172,19 @@
<td colspan="2">&nbsp;</td>
</tr>
<tr>
<td class="text-muted" style="vertical-align: top;"></td>
<td class="text-muted" style="vertical-align: top;">
<div ng-show="update.busy" class="progress progress-striped active animateMe">
<div class="progress-bar progress-bar-success" role="progressbar" style="width: {{update.percent}}%"></div>
</div>
<div>
<div ng-show="update.busy">{{ update.message }}</div>
<div class="has-error" ng-show="!update.busy && update.errorMessage">{{ update.errorMessage }}</div>
</div>
</td>
<td class="text-right" style="vertical-align: bottom;">
<button class="btn btn-primary pull-right" ng-hide="config.update.box" ng-disabled="autoUpdate.busy" ng-click="autoUpdate.checkNow()"><i class="fa fa-circle-notch fa-spin" ng-show="autoUpdate.busy"></i> Check for Updates</button>
<button class="btn btn-success pull-right" ng-show="config.update.box" ng-click="update.show(update_form)">Update Available</button>
<button class="btn btn-primary pull-right" ng-show="!config.update.box && !update.busy" ng-disabled="autoUpdate.busy" ng-click="autoUpdate.checkNow()"><i class="fa fa-circle-notch fa-spin" ng-show="autoUpdate.busy"></i> Check for Updates</button>
<button class="btn btn-success pull-right" ng-show="config.update.box && !update.busy" ng-click="update.show()">Update Available</button>
<button class="btn btn-danger pull-right" ng-show="config.update.box && update.busy" ng-click="update.stopUpdate()">Stop Update</button>
</td>
</tr>
</table>