mirror of
https://github.com/YunoHost/yunohost-admin.git
synced 2024-09-03 20:06:15 +02:00
add AppInfo view/route
This commit is contained in:
Axolotle
parent
fd13c58250
commit
2d262cae3b
3 changed files with 257 additions and 2 deletions
|
|
@ -11,7 +11,7 @@
|
|||
"app_change_url": "Change URL",
|
||||
"app_info_access_desc": "Groups / users currently allowed to access this app:",
|
||||
"app_info_changelabel_desc": "Change app label in the portal.",
|
||||
"app_info_default_desc": "Redirect domain root to this application (%s).",
|
||||
"app_info_default_desc": "Redirect domain root to this application ({domain}).",
|
||||
"app_info_changeurl_desc": "Change the access URL of this application (domain and/or path).",
|
||||
"app_info_change_url_disabled_tooltip": "This feature hasn't been implemented in this app yet",
|
||||
"app_info_uninstall_desc": "Remove this application.",
|
||||
|
|
@ -69,7 +69,7 @@
|
|||
"confirm_service_restart": "Are you sure you want to restart {name}?",
|
||||
"confirm_service_start": "Are you sure you want to start {name}?",
|
||||
"confirm_service_stop": "Are you sure you want to stop {name}?",
|
||||
"confirm_uninstall": "Are you sure you want to uninstall %s?",
|
||||
"confirm_uninstall": "Are you sure you want to uninstall {name}?",
|
||||
"confirm_update_apps": "Are you sure you want to update all applications?",
|
||||
"confirm_update_system": "Are you sure you want to update all system packages?",
|
||||
"confirm_update_specific_app": "Are you sure you want to update {app}?",
|
||||
|
|
|
|||
|
|
@ -165,6 +165,18 @@ const routes = [
|
|||
component: () => import(/* webpackChunkName: "views/apps" */ '@/views/app/AppList'),
|
||||
meta: { breadcrumb: [{ name: 'app-list', trad: 'applications' }] }
|
||||
},
|
||||
{
|
||||
name: 'app-info',
|
||||
path: '/apps/:id',
|
||||
component: () => import(/* webpackChunkName: "views/apps" */ '@/views/app/AppInfo'),
|
||||
props: true,
|
||||
meta: {
|
||||
breadcrumb: [
|
||||
{ name: 'app-list', trad: 'applications' },
|
||||
{ name: 'app-info', param: 'id' }
|
||||
]
|
||||
}
|
||||
},
|
||||
|
||||
/* ────────────────╮
|
||||
│ SYSTEM UPDATE │
|
||||
|
|
|
|||
243
app/src/views/app/AppInfo.vue
Normal file
243
app/src/views/app/AppInfo.vue
Normal file
|
|
@ -0,0 +1,243 @@
|
|||
<template>
|
||||
<div class="app-info" v-if="info">
|
||||
<!-- BASIC INFOS -->
|
||||
<b-card>
|
||||
<template v-slot:header>
|
||||
<h2><icon iname="info-circle" /> {{ $t('infos') }} — {{ info.label }}</h2>
|
||||
</template>
|
||||
|
||||
<b-row
|
||||
v-for="(value, prop) in info" :key="prop"
|
||||
no-gutters class="row-line"
|
||||
>
|
||||
<b-col cols="5" md="3" xl="3">
|
||||
<strong>{{ $t(prop) }}</strong>
|
||||
<span class="sep" />
|
||||
</b-col>
|
||||
<b-col>
|
||||
<a v-if="prop === 'url'" :href="value" target="_blank">{{ value }}</a>
|
||||
<span v-else>{{ value }}</span>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<hr>
|
||||
|
||||
<!-- MANAGE USER/GROUP -->
|
||||
<p class="mb-2">
|
||||
<strong>{{ $t('app_info_access_desc') }}</strong>
|
||||
<br>
|
||||
{{ app.permissions.length > 0 ? app.permissions.join(', ') + '.' : $t('nobody') }}
|
||||
</p>
|
||||
<b-button size="sm" :to="{ name: 'group-list'}" variant="info">
|
||||
<icon iname="key-modern" /> {{ $t('groups_and_permissions_manage') }}
|
||||
</b-button>
|
||||
</b-card>
|
||||
|
||||
<!-- OPERATIONS -->
|
||||
<b-card>
|
||||
<template v-slot:header>
|
||||
<h2><icon iname="wrench" /> {{ $t('operations') }}</h2>
|
||||
</template>
|
||||
|
||||
<!-- CHANGE LABEL -->
|
||||
<b-form-group
|
||||
:label="$t('app_info_changelabel_desc')" label-for="input-label"
|
||||
label-cols-md="4"
|
||||
>
|
||||
<b-input-group>
|
||||
<b-input id="input-label" v-model="form.label" />
|
||||
<template v-slot:append>
|
||||
<b-button variant="info" @click="changeLabel">
|
||||
<icon iname="tag" /> {{ $t('app_change_label') }}
|
||||
</b-button>
|
||||
</template>
|
||||
</b-input-group>
|
||||
</b-form-group>
|
||||
<hr>
|
||||
|
||||
<!-- CHANGE URL -->
|
||||
<b-form-group
|
||||
:label="$t('app_info_changeurl_desc')" label-for="input-url"
|
||||
:label-cols-lg="app.supports_change_url ? 4 : 0"
|
||||
>
|
||||
<b-input-group v-if="app.supports_change_url">
|
||||
<b-input-group-prepend>
|
||||
<b-input-group-text>https://</b-input-group-text>
|
||||
</b-input-group-prepend>
|
||||
|
||||
<b-input-group-prepend class="flex-grow-1">
|
||||
<b-select v-model="form.url.domain" :options="domains" />
|
||||
</b-input-group-prepend>
|
||||
|
||||
<b-input-group-prepend>
|
||||
<b-input-group-text>/</b-input-group-text>
|
||||
</b-input-group-prepend>
|
||||
|
||||
<b-input id="input-url" v-model="form.url.path" class="flex-grow-3" />
|
||||
|
||||
<b-input-group-append>
|
||||
<b-button variant="info" @click="action = 'changeUrl'" v-b-modal.modal>
|
||||
<icon iname="exchange" /> {{ $t('app_change_url') }}
|
||||
</b-button>
|
||||
</b-input-group-append>
|
||||
</b-input-group>
|
||||
|
||||
<b-alert v-else variant="warning" show>
|
||||
<icon iname="exclamation" /> {{ $t('app_info_change_url_disabled_tooltip') }}
|
||||
</b-alert>
|
||||
</b-form-group>
|
||||
<hr>
|
||||
|
||||
<!-- CHANGE DOMAIN -->
|
||||
<b-form-group label-cols-md="4" :label="$t('app_info_default_desc', { domain: app.domain })" label-for="main-domain">
|
||||
<b-input-group>
|
||||
<b-button
|
||||
id="main-domain" variant="success" v-b-modal.modal
|
||||
@click="action = 'setAsDefaultDomain'"
|
||||
>
|
||||
<icon iname="star" /> {{ $t('app_make_default') }}
|
||||
</b-button>
|
||||
</b-input-group>
|
||||
</b-form-group>
|
||||
<hr>
|
||||
|
||||
<!-- UNINSTALL -->
|
||||
<b-form-group label-cols-md="4" :label="$t('app_info_uninstall_desc')" label-for="uninstall">
|
||||
<b-input-group>
|
||||
<b-button
|
||||
id="uninstall" variant="danger" v-b-modal.modal
|
||||
@click="action = 'uninstall'"
|
||||
>
|
||||
<icon iname="trash-o" /> {{ $t('uninstall') }}
|
||||
</b-button>
|
||||
</b-input-group>
|
||||
</b-form-group>
|
||||
</b-card>
|
||||
|
||||
<!-- MODAL -->
|
||||
<b-modal
|
||||
v-if="action"
|
||||
id="modal" centered
|
||||
body-bg-variant="danger" body-text-variant="light"
|
||||
@ok="actions[action].method" hide-header
|
||||
>
|
||||
{{ $t(actions[action].text, actions[action].name ? { name: actions[action].name } : {}) }}
|
||||
</b-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import api from '@/helpers/api'
|
||||
import { readableDate } from '@/filters/date'
|
||||
|
||||
export default {
|
||||
name: 'AppInfo',
|
||||
|
||||
props: {
|
||||
id: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
|
||||
data () {
|
||||
return {
|
||||
info: undefined,
|
||||
app: undefined,
|
||||
form: {
|
||||
label: '',
|
||||
url: ''
|
||||
},
|
||||
actions: {
|
||||
changeUrl: { method: this.changeUrl, text: 'confirm_app_change_url' },
|
||||
setAsDefaultDomain: { method: this.setAsDefaultDomain, text: 'confirm_app_default' },
|
||||
uninstall: { method: this.uninstall, text: 'confirm_uninstall', name: this.id }
|
||||
},
|
||||
action: undefined
|
||||
}
|
||||
},
|
||||
|
||||
filters: {
|
||||
readableDate
|
||||
},
|
||||
|
||||
computed: {
|
||||
domains () {
|
||||
return this.$store.state.data.domains
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
fetchData () {
|
||||
api.getAll([
|
||||
`apps/${this.id}?full`,
|
||||
'users/permissions'
|
||||
]).then(([app, { permissions }]) => {
|
||||
this.info = {
|
||||
id: this.id,
|
||||
label: app.settings.label,
|
||||
description: app.description,
|
||||
version: app.version,
|
||||
multi_instance: this.$i18n.t(app.manifest.multi_instance ? 'yes' : 'no'),
|
||||
install_time: readableDate(app.settings.install_time, true, true)
|
||||
}
|
||||
// FIXME is domain really optional ?
|
||||
if (app.settings.domain) {
|
||||
this.info.url = 'https://' + app.settings.domain + app.settings.path
|
||||
this.form.url = {
|
||||
domain: app.settings.domain,
|
||||
path: app.settings.path.slice(1)
|
||||
}
|
||||
}
|
||||
this.form.label = app.settings.label
|
||||
this.app = {
|
||||
domain: app.settings.domain,
|
||||
supports_change_url: app.supports_change_url,
|
||||
permissions: permissions[this.id + '.main'].allowed
|
||||
}
|
||||
})
|
||||
|
||||
this.$store.dispatch('FETCH', { uri: 'domains' })
|
||||
},
|
||||
|
||||
changeLabel () {
|
||||
api.put(
|
||||
`apps/${this.id}/label`,
|
||||
{ new_label: this.form.label }
|
||||
).then(this.fetchData)
|
||||
},
|
||||
|
||||
changeUrl () {
|
||||
const { domain, path } = this.form.url
|
||||
api.put(
|
||||
`apps/${this.id}/changeurl`,
|
||||
{ domain, path: '/' + path }
|
||||
).then(this.fetchData)
|
||||
},
|
||||
|
||||
setAsDefaultDomain () {
|
||||
api.put(`apps/${this.id}/default`).then(this.fetchData)
|
||||
},
|
||||
|
||||
uninstall () {
|
||||
api.delete('apps/' + this.id).then(() => {
|
||||
this.$router.push({ name: 'app-list' })
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
created () {
|
||||
this.fetchData()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
select {
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
||||
.input-group input {
|
||||
min-width: 5rem;
|
||||
}
|
||||
</style>
|
||||
Loading…
Add table
Reference in a new issue