270 lines
9.6 KiB
PHP
270 lines
9.6 KiB
PHP
<style>
|
|
.uk-modal-details .uk-modal-dialog, .uk-modal-logs .uk-modal-dialog {
|
|
height: 85%;
|
|
}
|
|
|
|
.uk-modal-logs pre {
|
|
color: #d3d3d3;
|
|
background-color: #333;
|
|
}
|
|
|
|
.black { color: #000; }
|
|
.red { color: #FF0000; }
|
|
.green { color: #008000; }
|
|
.brown { color: #A52A2A; }
|
|
.blue { color: #0000FF; }
|
|
.purple { color: #800080; }
|
|
.cyan { color: #00FFFF; }
|
|
.light-gray { color: #D3D3D3; }
|
|
.dark-gray { color: #A9A9A9; }
|
|
.light-red { color: #f55; }
|
|
.light-green { color: #90EE90; }
|
|
.yellow { color: #FFFF00; }
|
|
.light-blue { color: #ADD8E6; }
|
|
.light-purple { color: #9370DB; }
|
|
.light-cyan { color: #E0FFFF; }
|
|
.white { color: #fff; }
|
|
|
|
pre {
|
|
border-radius: 5px;
|
|
}
|
|
|
|
pre h2 {
|
|
color: black;
|
|
display: inline-block;
|
|
border-radius: 5px;
|
|
padding: 5px;
|
|
font-size: 1.5em;
|
|
background-color: #d3d3d3;
|
|
}
|
|
pre h2.success {
|
|
background-color: #60cc60;
|
|
}
|
|
|
|
pre h2.failure {
|
|
background-color: #ff3333;
|
|
}
|
|
|
|
.stagename, .timetext {
|
|
float: right;
|
|
font-size: 0.8em;
|
|
}
|
|
|
|
</style>
|
|
|
|
<div>
|
|
<ul class="uk-breadcrumb">
|
|
<li class="uk-active"><span>@lang('Drone Deploys')</span></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="uk-margin-top" riot-view>
|
|
|
|
@if($app->module('cockpit')->hasaccess('drone', 'manage.view'))
|
|
<div class="uk-form uk-clearfix" show="{!loading}">
|
|
@if($app->module('cockpit')->hasaccess('drone', 'manage.deploy'))
|
|
<div class="uk-float-right">
|
|
<a class="uk-button uk-button-primary uk-button-large" onclick="{createDeploy}">
|
|
<i class="uk-icon-plus uk-icon-justify"></i> @lang('Deploy')
|
|
</a>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
|
|
<div class="uk-text-xlarge uk-text-center uk-text-primary uk-margin-large-top" show="{ loading }">
|
|
<i class="uk-icon-spinner uk-icon-spin"></i>
|
|
</div>
|
|
|
|
<div class="uk-text-large uk-text-center uk-margin-large-top uk-text-muted" show="{ !loading && !deploys.length }">
|
|
<img class="uk-svg-adjust" src="@url('drone:icon.svg')" width="100" height="100" alt="@lang('Drone Deploys')" data-uk-svg />
|
|
<p>@lang('No deploys found')</p>
|
|
</div>
|
|
|
|
<div class="uk-modal uk-modal-details uk-height-viewport">
|
|
<div class="uk-modal-dialog uk-modal-dialog-large">
|
|
<a href="" class="uk-modal-close uk-close"></a>
|
|
<h3>{ deploy && deploy.title }</h3>
|
|
<div class="uk-margin uk-flex uk-flex-middle" if="{deploy}">
|
|
<codemirror ref="codemirror" syntax="json"></codemirror>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="uk-modal uk-modal-logs uk-height-viewport">
|
|
<div class="uk-modal-dialog uk-modal-dialog-large">
|
|
<a href="" class="uk-modal-close uk-close"></a>
|
|
<h3>{ deploy && deploy.title }</h3>
|
|
<div class="uk-margin uk-flex uk-flex-middle" if="{deploy}">
|
|
<pre style="display: inline-block;"></pre>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="uk-form uk-clearfix" show="{!loading}">
|
|
<table class="uk-table uk-table-tabbed uk-table-striped uk-margin-top" if="{ !loading && deploys.length }">
|
|
<thead>
|
|
<tr>
|
|
<th class="uk-text-small uk-link-muted uk-noselect" width="70">
|
|
@lang('State')
|
|
</th>
|
|
<th class="uk-text-small uk-link-muted uk-noselect" width="50">
|
|
@lang('Build') #
|
|
</th>
|
|
@if($app->module('cockpit')->hasaccess('drone', 'manage.extended_view'))
|
|
<th class="uk-text-small uk-link-muted uk-noselect" width="50">
|
|
@lang('Event')
|
|
</th>
|
|
<th class="uk-text-small uk-link-muted uk-noselect" width="450">
|
|
@lang('Title')
|
|
</th>
|
|
@endif
|
|
<th class="uk-text-small uk-link-muted uk-noselect" width="120">
|
|
@lang('Created')
|
|
</th>
|
|
<th class="uk-text-small uk-link-muted uk-noselect" width="120">
|
|
@lang('Updated')
|
|
</th>
|
|
<th class="uk-text-small uk-link-muted uk-noselect" width="90">
|
|
@lang('Deploy time')
|
|
</th>
|
|
@if($app->module('cockpit')->hasaccess('drone', 'manage.extended_view'))
|
|
<th class="uk-text-small uk-link-muted uk-noselect" width="50">
|
|
@lang('Log')
|
|
</th>
|
|
@endif
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr each="{deploy, $index in deploys}" class="{ deploy.state == 'error' ? 'uk-text-danger' : ''}">
|
|
<td>
|
|
<a onclick="{ showdeployDetails }" class="extrafields-indicator uk-text-nowrap">
|
|
<span class="uk-badge uk-text-small" if="{!deploy.building && deploy.status !== 'failure' && deploy.status !== 'success' }"><i class="uk-icon-eye uk-icon-justify"></i>{ App.i18n.get(deploy.status) }</span>
|
|
<span class="uk-badge uk-text-small uk-badge-success" if="{deploy.status === 'success'}"><i class="uk-icon-eye uk-icon-justify"></i>{ App.i18n.get(deploy.status) }</span>
|
|
<span class="uk-badge uk-text-small uk-badge-danger" if="{deploy.status === 'failure'}"><i class="uk-icon-eye uk-icon-justify"></i>{ App.i18n.get(deploy.status) }</span>
|
|
<span class="uk-badge uk-text-small uk-badge-warning" if="{deploy.building}"><i class="uk-icon-spinner uk-icon-spin"></i>{ App.i18n.get(deploy.status) }</span>
|
|
</a>
|
|
</td>
|
|
<td>{ deploy.number }</td>
|
|
@if($app->module('cockpit')->hasaccess('drone', 'manage.extended_view'))
|
|
<td>{ deploy.event }</td>
|
|
<td>{ deploy.message }</td>
|
|
@endif
|
|
<td><span class="uk-badge uk-badge-outline uk-text-muted">{ deploy.created_at }</span></td>
|
|
<td><span class="uk-badge uk-badge-outline uk-text-muted">{ deploy.updated_at }</span></td>
|
|
<td><span if="{deploy.deploy_time}">{ deploy.deploy_time }s</span></td>
|
|
@if($app->module('cockpit')->hasaccess('drone', 'manage.extended_view'))
|
|
<td><a onclick="{ showdeployLog }"><img src="@url('assets:app/media/icons/text.svg')" style="height: 25px;"></a></td>
|
|
@endif
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
@endif
|
|
|
|
<script type="view/script">
|
|
|
|
var $this = this;
|
|
$this.deploy = {};
|
|
$this.loading = true;
|
|
$this.deploys = {{ json_encode($deploys) }};
|
|
$this.building = {{ json_encode($building) }};
|
|
$this.build = {{ json_encode($build) }};
|
|
|
|
this.on('mount', function() {
|
|
$this.loading = false;
|
|
$this.modal = UIkit.modal(App.$('.uk-modal-details', this.root), {modal:true});
|
|
$this.modalLogs = UIkit.modal(App.$('.uk-modal-logs', this.root), {modal:true});
|
|
if ($this.building) {
|
|
setTimeout(function() {
|
|
$this.fetchData();
|
|
}, 5000);
|
|
}
|
|
$this.update();
|
|
});
|
|
|
|
showdeployDetails(e) {
|
|
$this.deploy = e.item.deploy;
|
|
$this.modal.show();
|
|
editor = $this.refs.codemirror.editor;
|
|
editor.setValue(JSON.stringify($this.deploy, null, 2), true);
|
|
editor.setOption("readOnly", true);
|
|
editor.setOption("mode", "javascript");
|
|
editor.setSize($this.modal.dialog[0].clientWidth - 50, $this.modal.dialog[0].clientHeight - 70);
|
|
editor.refresh();
|
|
$this.trigger('ready');
|
|
}
|
|
|
|
showdeployLog(e) {
|
|
$this.deploy = e.item.deploy;
|
|
App.callmodule('drone:fetchLogs', $this.deploy['number'], 'manage.view').then(function(data) {
|
|
if (data && data.result && data.result.out) {
|
|
area = App.$('.uk-modal-logs pre');
|
|
area.html(data.result.out);
|
|
$this.modalLogs.show();
|
|
area.css('width', $this.modalLogs.dialog[0].clientWidth - 50);
|
|
area.css('height', $this.modalLogs.dialog[0].clientHeight - 70);
|
|
$this.trigger('ready');
|
|
} else {
|
|
App.ui.notify(App.i18n.get("Cannot fetch logs from Drone! Try again later."), "danger");
|
|
}
|
|
$this.update();
|
|
});
|
|
}
|
|
|
|
createDeploy() {
|
|
if ($this.building) {
|
|
App.ui.notify(App.i18n.get("A deploy is already in progress, please wait until finishes."), "warning");
|
|
} else {
|
|
UIkit.modal.confirm(App.i18n.get("Triggering a new Drone deploy. Are you sure?<br><br>Using build: #") + $this.build, function() {
|
|
App.callmodule('drone:createDeploy', $this.build, 'manage.deploy').then(function(data) {
|
|
if (!data || !data.result || data.result.error) {
|
|
if (data && data.result && data.result.error) {
|
|
App.ui.notify(App.i18n.get(data.result.error), "danger");
|
|
} else {
|
|
App.ui.notify("unknown error", "danger");
|
|
}
|
|
if (data) {
|
|
$this.modal.show();
|
|
editor = $this.refs.codemirror.editor;
|
|
editor.setValue(JSON.stringify(data, null, 2), true);
|
|
editor.setOption("readOnly", true);
|
|
editor.setOption("mode", "javascript");
|
|
editor.setSize($this.modal.dialog[0].clientWidth - 50, $this.modal.dialog[0].clientHeight - 70);
|
|
editor.refresh();
|
|
}
|
|
return;
|
|
}
|
|
App.ui.notify(App.i18n.get("A new deploy was requested."), "success");
|
|
setTimeout(function() {
|
|
App.ui.notify(App.i18n.get("Fetching deploy status..."), "success");
|
|
$this.building = true;
|
|
$this.fetchData();
|
|
}, 2000)
|
|
});
|
|
});
|
|
}
|
|
}
|
|
|
|
fetchData() {
|
|
if (!this.building) {
|
|
return;
|
|
}
|
|
App.callmodule('drone:fetchDeploys', null, 'manage.view').then(function(data) {
|
|
if (data && data.result && data.result.deploys) {
|
|
$this.deploys = data.result.deploys;
|
|
$this.building = data.result.building;
|
|
$this.build = data.result.build;
|
|
setTimeout(function() {
|
|
$this.fetchData();
|
|
}, 5000);
|
|
} else {
|
|
App.ui.notify(App.i18n.get("Cannot fetch deploys from Drone! Try again later."), "danger");
|
|
}
|
|
$this.update();
|
|
});
|
|
}
|
|
|
|
</script>
|
|
|
|
</div>
|