mirror of
https://github.com/Lissy93/dashy.git
synced 2024-12-25 01:42:00 +03:00
Alicia Sykes
GitHub
commit
a91a283f1b
@ -58,6 +58,7 @@ Dashy has support for displaying dynamic content in the form of widgets. There a
|
||||
- [Nextcloud PHP OPcache](#nextcloud-php-opcache-stats)
|
||||
- [Sabnzbd](#sabnzbd)
|
||||
- [Gluetun VPN Info](#gluetun-vpn-info)
|
||||
- [Drone CI Build](#drone-ci-builds)
|
||||
- **[System Resource Monitoring](#system-resource-monitoring)**
|
||||
- [CPU Usage Current](#current-cpu-usage)
|
||||
- [CPU Usage Per Core](#cpu-usage-per-core)
|
||||
@ -1947,6 +1948,42 @@ Display info from the Gluetun VPN container public IP API. This can show the IP
|
||||
|
||||
---
|
||||
|
||||
### Drone CI Builds
|
||||
|
||||
Display the last builds from a [Drone CI](https://www.drone.ci) instance. A self-hosted CI system that uses docker.
|
||||
|
||||
<p align="center"><img width="380" src="https://i.ibb.co/nQM3BXj/Bildschirm-foto-2023-01-07-um-01-31-45.png" /></p>
|
||||
|
||||
#### Options
|
||||
|
||||
**Field** | **Type** | **Required** | **Description**
|
||||
--- | --- | --- | ---
|
||||
**`host`** | `string` | Required | The histname of the Drone CI instance.
|
||||
**`apiKey`** | `string` | Required | The API key (https://<your-drone-instance>/account).
|
||||
**`limit`** | `integer` | _Optional_ | Limit the amounts of listed builds.
|
||||
**`repo`** | `string` | _Optional_ | Show only builds of the specified repo
|
||||
|
||||
#### Example
|
||||
|
||||
```yaml
|
||||
- type: drone-io
|
||||
updateInterval: 30
|
||||
options:
|
||||
host: https://drone.somedomain.com
|
||||
apiKey: my-very-secret-api-key
|
||||
limit: 10
|
||||
```
|
||||
|
||||
#### Info
|
||||
|
||||
- **CORS**: 🟢 Enabled
|
||||
- **Auth**: 🟢 Required
|
||||
- **Price**: 🟢 Free
|
||||
- **Host**: Self-Hosted (see [Drone](https://www.drone.io))
|
||||
- **Privacy**: _See [Drone](https://www.drone.io)_
|
||||
|
||||
---
|
||||
|
||||
## System Resource Monitoring
|
||||
|
||||
### Glances
|
||||
|
||||
238
src/components/Widgets/DroneCi.vue
Normal file
238
src/components/Widgets/DroneCi.vue
Normal file
@ -0,0 +1,238 @@
|
||||
<template>
|
||||
<div class="droneci-builds-wrapper" v-if="builds">
|
||||
<div
|
||||
class="build-row"
|
||||
v-for="build in builds" :key="build.id"
|
||||
v-tooltip="infoTooltip(build)"
|
||||
>
|
||||
<div class="status">
|
||||
<p :class="build.build.status">{{ build.build.status | formatStatus }}</p>
|
||||
<span v-if="build.build.status == 'running'">
|
||||
{{ build.build.started*1000 | formatTimeAgo }} ago
|
||||
</span>
|
||||
<span v-else-if="build.build.status != 'pending' ">
|
||||
{{ formatBuildDuration(build) }}
|
||||
</span>
|
||||
<span v-else>
|
||||
{{ build.build.created*1000 | formatTimeAgo }} ago
|
||||
</span>
|
||||
</div>
|
||||
<div class="info">
|
||||
<div class="build-name">
|
||||
{{ build.name }}
|
||||
<a
|
||||
class="droneci-build-number"
|
||||
:href="build.baseurl + '/' + build.slug + '/' +build.build.number"
|
||||
target="_blank"
|
||||
>{{ build.build.number }}</a>
|
||||
</div>
|
||||
<div class="build-desc">
|
||||
<span class="droneci-extra">
|
||||
<template v-if="build.build.event == 'pull_request'">
|
||||
<a
|
||||
:href="build.build.link"
|
||||
target="_blank"
|
||||
class="droneci-extra-info"
|
||||
>#{{ formatPrId(build.build.link) }}</a> to
|
||||
</template>
|
||||
<template v-else-if="build.build.event == 'push'">
|
||||
<a
|
||||
:href="build.build.link"
|
||||
target="_blank"
|
||||
class="droneci-extra-info"
|
||||
>push</a> to
|
||||
</template>
|
||||
<a
|
||||
:href="build.git_http_url"
|
||||
target="_blank"
|
||||
class="droneci-extra-info"
|
||||
>
|
||||
{{ build.build.target }}
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import WidgetMixin from '@/mixins/WidgetMixin';
|
||||
import { getTimeAgo, getTimeDifference, timestampToDateTime } from '@/utils/MiscHelpers';
|
||||
|
||||
export default {
|
||||
mixins: [WidgetMixin],
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
builds: null,
|
||||
};
|
||||
},
|
||||
filters: {
|
||||
formatStatus(status) {
|
||||
let symbol = '';
|
||||
if (status === 'success') symbol = '✔';
|
||||
if (status === 'failure' || status === 'error' || status === 'killed') symbol = '✘';
|
||||
if (status === 'running') symbol = '❖';
|
||||
if (status === 'skipped') symbol = '↠';
|
||||
return `${symbol}`;
|
||||
},
|
||||
formatDate(timestamp) {
|
||||
return timestampToDateTime(timestamp);
|
||||
},
|
||||
formatTimeAgo(timestamp) {
|
||||
return getTimeAgo(timestamp);
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
/* API endpoint, either for self-hosted or managed instance */
|
||||
endpointBuilds() {
|
||||
if (!this.options.host) this.error('drone.ci Host is required');
|
||||
return `${this.options.host}/api/user/builds`;
|
||||
},
|
||||
endpointRepoInfo() {
|
||||
if (!this.options.host) this.error('drone.ci Host is required');
|
||||
return `${this.options.host}/api/repos/${this.options.repo}`;
|
||||
},
|
||||
endpointRepoBuilds() {
|
||||
if (!this.options.host) this.error('drone.ci Host is required');
|
||||
return `${this.options.host}/api/repos/${this.options.repo}/builds`;
|
||||
},
|
||||
repo() {
|
||||
if (this.options.repo) return this.options.repo;
|
||||
return false;
|
||||
},
|
||||
apiKey() {
|
||||
if (!this.options.apiKey) {
|
||||
this.error('An API key is required, please see the docs for more info');
|
||||
}
|
||||
return this.options.apiKey;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
/* Fetch new data, configured by updateInterval */
|
||||
update() {
|
||||
this.startLoading();
|
||||
this.fetchData();
|
||||
this.finishLoading();
|
||||
},
|
||||
/* Make GET request to Drone CI API endpoint */
|
||||
fetchData() {
|
||||
const authHeaders = { Authorization: `Bearer ${this.apiKey}` };
|
||||
if (this.repo !== false) {
|
||||
this.makeRequest(this.endpointRepoInfo, authHeaders).then(
|
||||
(repoInfo) => {
|
||||
this.makeRequest(this.endpointRepoBuilds, authHeaders).then(
|
||||
(buildInfo) => {
|
||||
this.processRepoBuilds(repoInfo, buildInfo);
|
||||
},
|
||||
);
|
||||
},
|
||||
);
|
||||
} else {
|
||||
this.makeRequest(this.endpointBuilds, authHeaders).then(
|
||||
(response) => { this.processBuilds(response); },
|
||||
);
|
||||
}
|
||||
},
|
||||
/* Assign data variables to the returned data */
|
||||
processBuilds(data) {
|
||||
const results = data.slice(0, this.options.limit)
|
||||
.map((obj) => ({ ...obj, baseurl: this.options.host }));
|
||||
this.builds = results;
|
||||
},
|
||||
processRepoBuilds(repo, builds) {
|
||||
const results = builds.slice(0, this.options.limit)
|
||||
.map((obj) => ({ build: { ...obj }, baseurl: this.options.host, ...repo }));
|
||||
this.builds = results;
|
||||
},
|
||||
infoTooltip(build) {
|
||||
const content = `<b>Trigger:</b> ${build.build.event} by ${build.build.trigger}<br>`
|
||||
+ `<b>Repo:</b> ${build.slug}<br>`
|
||||
+ `<b>Branch:</b> ${build.build.target}<br>`;
|
||||
return {
|
||||
content, html: true, trigger: 'hover focus', delay: 250, classes: 'build-info-tt',
|
||||
};
|
||||
},
|
||||
formatPrId(link) {
|
||||
return link.split('/').pop();
|
||||
},
|
||||
formatBuildDuration(build) {
|
||||
return getTimeDifference(build.build.started * 1000, build.build.finished * 1000);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.droneci-builds-wrapper {
|
||||
color: var(--widget-text-color);
|
||||
.build-row {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 2.5fr;
|
||||
justify-content: left;
|
||||
align-items: center;
|
||||
padding: 0.25rem 0;
|
||||
.status {
|
||||
font-size: 1rem;
|
||||
font-weight: bold;
|
||||
p {
|
||||
margin: 0;
|
||||
color: var(--info);
|
||||
&.success { color: var(--success); }
|
||||
&.failure { color: var(--danger); }
|
||||
&.error { color: var(--danger); }
|
||||
&.running { color: var(--neutral); }
|
||||
}
|
||||
span {
|
||||
font-size: 0.75rem;
|
||||
color: var(--secondary);
|
||||
}
|
||||
}
|
||||
.info {
|
||||
div.build-name {
|
||||
margin: 0.25rem 0;
|
||||
font-weight: bold;
|
||||
color: var(--widget-text-color);
|
||||
a, a:hover, a:visited, a:active {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
.droneci-build-number::before {
|
||||
content: "#";
|
||||
}
|
||||
}
|
||||
div.build-desc {
|
||||
margin: 0;
|
||||
font-size: 0.85rem;
|
||||
color: var(--widget-text-color);
|
||||
opacity: var(--dimming-factor);
|
||||
a, a:hover, a:visited, a:active {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
.droneci-extra {
|
||||
.droneci-extra-info {
|
||||
margin: 0.25em;
|
||||
padding: 0em 0.25em;
|
||||
background: var(--item-background);
|
||||
border: 1px solid var(--primary);
|
||||
border-radius: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
&:not(:last-child) {
|
||||
border-bottom: 1px dashed var(--widget-text-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<style lang="scss">
|
||||
.build-info-tt {
|
||||
min-width: 20rem;
|
||||
}
|
||||
</style>
|
||||
@ -56,6 +56,7 @@ const COMPAT = {
|
||||
'domain-monitor': 'DomainMonitor',
|
||||
'code-stats': 'CodeStats',
|
||||
'covid-stats': 'CovidStats',
|
||||
'drone-ci': 'DroneCi',
|
||||
embed: 'EmbedWidget',
|
||||
'eth-gas-prices': 'EthGasPrices',
|
||||
'exchange-rates': 'ExchangeRates',
|
||||
|
||||
Loading…
Reference in New Issue
Block a user