chore(webui): Migrate to Quasar 2.x and Vue.js 3.x

This commit is contained in:
Andi Sardina Ramos 2024-02-26 16:02:04 +02:00 committed by GitHub
parent 153765f99f
commit f7edb394f2
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
65 changed files with 4374 additions and 7999 deletions

View file

@ -1,29 +1,52 @@
<template>
<q-card flat bordered v-bind:class="['panel-services', {'panel-services-dense':isDense}]">
<q-scroll-area :thumb-style="appThumbStyle" style="height:100%;">
<q-card
flat
bordered
:class="['panel-services', {'panel-services-dense':isDense}]"
>
<q-scroll-area
:thumb-style="appThumbStyle"
style="height:100%;"
>
<q-card-section>
<div class="row items-start no-wrap">
<div class="col-6">
<div class="text-subtitle2 text-table">Name</div>
<div class="text-subtitle2 text-table">
Name
</div>
</div>
<div class="col-3">
<div class="text-subtitle2 text-table" style="text-align: right">Percent</div>
<div
class="text-subtitle2 text-table"
style="text-align: right"
>
Percent
</div>
</div>
<div class="col-3">
<div class="text-subtitle2 text-table" style="text-align: right">Provider</div>
<div
class="text-subtitle2 text-table"
style="text-align: right"
>
Provider
</div>
</div>
</div>
</q-card-section>
<q-separator />
<div v-for="(service, index) in data.mirroring.mirrors" :key="index">
<div
v-for="(service, index) in data.mirroring.mirrors"
:key="index"
>
<q-card-section>
<div class="row items-center no-wrap">
<div class="col-6">
<q-chip
dense
class="app-chip app-chip-rule app-chip-overflow">
class="app-chip app-chip-rule app-chip-overflow"
>
{{ service.name }}
<q-tooltip>{{service.name}}</q-tooltip>
<q-tooltip>{{ service.name }}</q-tooltip>
</q-chip>
</div>
<div class="col-3 text-right">
@ -46,8 +69,10 @@
export default {
name: 'PanelMirroringServices',
props: ['data', 'dense'],
components: {},
props: {
data: Object,
dense: Boolean
},
computed: {
isDense () {
return this.dense !== undefined
@ -70,13 +95,13 @@ export default {
return 'providers/plugin.svg'
}
if (name.startsWith('consul-')) {
return `providers/consul.svg`
return 'providers/consul.svg'
}
if (name.startsWith('consulcatalog-')) {
return `providers/consulcatalog.svg`
return 'providers/consulcatalog.svg'
}
if (name.startsWith('nomad-')) {
return `providers/nomad.svg`
return 'providers/nomad.svg'
}
return `providers/${name}.svg`