Make frontend credentials hidden by default and expandable.
This commit is contained in:
parent
0bab9de01c
commit
85e075282b
|
@ -328,7 +328,7 @@ import Avatar from '~/components/Common/Avatar';
|
|||
import PlayButton from "~/components/Common/PlayButton";
|
||||
import AlbumArt from "~/components/Common/AlbumArt";
|
||||
import {useAxios} from "~/vendor/axios";
|
||||
import {useAsyncState, useIntervalFn, useStorage} from "@vueuse/core";
|
||||
import {useAsyncState, useIntervalFn, useLocalStorage} from "@vueuse/core";
|
||||
import {useTranslate} from "~/vendor/gettext";
|
||||
import {computed} from "vue";
|
||||
import useRefreshableAsyncState from "~/functions/useRefreshableAsyncState";
|
||||
|
@ -376,7 +376,7 @@ const props = defineProps({
|
|||
}
|
||||
});
|
||||
|
||||
const chartsVisible = useStorage('dashboard_show_chart', true);
|
||||
const chartsVisible = useLocalStorage('dashboard_show_chart', true);
|
||||
|
||||
const {$gettext} = useTranslate();
|
||||
|
||||
|
|
|
@ -15,86 +15,98 @@
|
|||
</div>
|
||||
|
||||
<template v-if="userCanManageBroadcasting">
|
||||
<b-table-simple
|
||||
striped
|
||||
responsive
|
||||
<b-collapse
|
||||
id="frontendCredentials"
|
||||
v-model="credentialsVisible"
|
||||
>
|
||||
<tbody>
|
||||
<tr class="align-middle">
|
||||
<td>
|
||||
<a
|
||||
:href="frontendAdminUri"
|
||||
target="_blank"
|
||||
>
|
||||
{{ $gettext('Administration') }}
|
||||
</a>
|
||||
</td>
|
||||
<td class="px-0">
|
||||
<div>
|
||||
{{ $gettext('Username:') }}
|
||||
<span class="text-monospace">admin</span>
|
||||
</div>
|
||||
<div>
|
||||
{{ $gettext('Password:') }}
|
||||
<span class="text-monospace">{{ frontendAdminPassword }}</span>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-0">
|
||||
<copy-to-clipboard-button
|
||||
:text="frontendAdminPassword"
|
||||
hide-text
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="align-middle">
|
||||
<td>
|
||||
{{ $gettext('Source') }}
|
||||
</td>
|
||||
<td class="px-0">
|
||||
<div>
|
||||
{{ $gettext('Username:') }}
|
||||
<span class="text-monospace">source</span>
|
||||
</div>
|
||||
<div>
|
||||
{{ $gettext('Password:') }}
|
||||
<span class="text-monospace">{{ frontendSourcePassword }}</span>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-0">
|
||||
<copy-to-clipboard-button
|
||||
:text="frontendSourcePassword"
|
||||
hide-text
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="align-middle">
|
||||
<td>
|
||||
{{ $gettext('Relay') }}
|
||||
</td>
|
||||
<td class="px-0">
|
||||
<div>
|
||||
{{ $gettext('Username:') }}
|
||||
<span class="text-monospace">relay</span>
|
||||
</div>
|
||||
<div>
|
||||
{{ $gettext('Password:') }}
|
||||
<span class="text-monospace">{{ frontendRelayPassword }}</span>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-0">
|
||||
<copy-to-clipboard-button
|
||||
:text="frontendRelayPassword"
|
||||
hide-text
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</b-table-simple>
|
||||
<b-table-simple
|
||||
striped
|
||||
responsive
|
||||
>
|
||||
<tbody>
|
||||
<tr class="align-middle">
|
||||
<td>
|
||||
<a
|
||||
:href="frontendAdminUri"
|
||||
target="_blank"
|
||||
>
|
||||
{{ $gettext('Administration') }}
|
||||
</a>
|
||||
</td>
|
||||
<td class="px-0">
|
||||
<div>
|
||||
{{ $gettext('Username:') }}
|
||||
<span class="text-monospace">admin</span>
|
||||
</div>
|
||||
<div>
|
||||
{{ $gettext('Password:') }}
|
||||
<span class="text-monospace">{{ frontendAdminPassword }}</span>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-0">
|
||||
<copy-to-clipboard-button
|
||||
:text="frontendAdminPassword"
|
||||
hide-text
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="align-middle">
|
||||
<td>
|
||||
{{ $gettext('Source') }}
|
||||
</td>
|
||||
<td class="px-0">
|
||||
<div>
|
||||
{{ $gettext('Username:') }}
|
||||
<span class="text-monospace">source</span>
|
||||
</div>
|
||||
<div>
|
||||
{{ $gettext('Password:') }}
|
||||
<span class="text-monospace">{{ frontendSourcePassword }}</span>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-0">
|
||||
<copy-to-clipboard-button
|
||||
:text="frontendSourcePassword"
|
||||
hide-text
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="align-middle">
|
||||
<td>
|
||||
{{ $gettext('Relay') }}
|
||||
</td>
|
||||
<td class="px-0">
|
||||
<div>
|
||||
{{ $gettext('Username:') }}
|
||||
<span class="text-monospace">relay</span>
|
||||
</div>
|
||||
<div>
|
||||
{{ $gettext('Password:') }}
|
||||
<span class="text-monospace">{{ frontendRelayPassword }}</span>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-0">
|
||||
<copy-to-clipboard-button
|
||||
:text="frontendRelayPassword"
|
||||
hide-text
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</b-table-simple>
|
||||
</b-collapse>
|
||||
|
||||
<div
|
||||
v-if="hasStarted"
|
||||
class="card-actions"
|
||||
>
|
||||
<a
|
||||
class="btn btn-outline-primary"
|
||||
@click.prevent="credentialsVisible = !credentialsVisible"
|
||||
>
|
||||
<icon icon="unfold_more" />
|
||||
{{ langShowHideCredentials }}
|
||||
</a>
|
||||
<a
|
||||
class="api-call no-reload btn btn-outline-secondary"
|
||||
:href="frontendRestartUri"
|
||||
|
@ -130,6 +142,8 @@ import Icon from '~/components/Common/Icon';
|
|||
import RunningBadge from "~/components/Common/Badges/RunningBadge.vue";
|
||||
import {computed} from "vue";
|
||||
import frontendPanelProps from "~/components/Stations/Profile/frontendPanelProps";
|
||||
import {useLocalStorage} from "@vueuse/core";
|
||||
import {useTranslate} from "~/vendor/gettext";
|
||||
|
||||
const props = defineProps({
|
||||
...frontendPanelProps,
|
||||
|
@ -139,6 +153,16 @@ const props = defineProps({
|
|||
}
|
||||
});
|
||||
|
||||
const credentialsVisible = useLocalStorage('station_show_frontend_credentials', false);
|
||||
|
||||
const {$gettext} = useTranslate();
|
||||
|
||||
const langShowHideCredentials = computed(() => {
|
||||
return (credentialsVisible.value)
|
||||
? $gettext('Hide Credentials')
|
||||
: $gettext('Show Credentials')
|
||||
});
|
||||
|
||||
const frontendName = computed(() => {
|
||||
if (props.frontendType === FRONTEND_ICECAST) {
|
||||
return 'Icecast';
|
||||
|
|
Loading…
Reference in New Issue