djsundog/ffplayout
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add advanced config

Browse Source
This commit is contained in:
jb-alvarado 2024-06-17 18:05:56 +02:00
parent 61202346f7
commit 18c5b3c742
10 changed files with 555 additions and 806 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

103
components/ConfigAdvanced.vue Normal file
View File

@ -0,0 +1,103 @@
<template>
<div class="min-w-[200px] pe-8 w-[768px]">
<h2 class="pt-3 text-3xl">{{ $t('advanced.title') }}</h2>
<form
v-if="configStore.advanced"
class="mt-10 grid md:grid-cols-[180px_auto] gap-5"
@submit.prevent="onSubmitAdvanced"
>
<template v-for="(item, key) in configStore.advanced" :key="key">
<div class="text-xl pt-3 text-right">{{ setTitle(key.toString()) }}:</div>
<div class="md:pt-4">
<label
v-for="(_, name) in (item as Record<string, any>)"
:key="name"
class="form-control w-full"
>
<div class="label">
<span class="label-text !text-md font-bold">{{ name }}</span>
</div>
<input
:id="name"
v-model="item[name]"
type="text"
class="input input-sm input-bordered w-full"
/>
</label>
</div>
</template>
<div class="mt-5 mb-10">
<button class="btn btn-primary" type="submit">{{ $t('config.save') }}</button>
</div>
</form>
</div>
<GenericModal
:title="$t('config.restartTile')"
:text="$t('config.restartText')"
:show="showModal"
:modal-action="restart"
/>
</template>
<script setup lang="ts">
const { t } = useI18n()
const authStore = useAuth()
const configStore = useConfig()
const indexStore = useIndex()
const showModal = ref(false)
function setTitle(input: string): string {
switch (input) {
case 'decoder':
return t('advanced.decoder')
case 'encoder':
return t('advanced.encoder')
case 'filter':
return t('advanced.filter')
case 'ingest':
return t('advanced.ingest')
default:
return input
}
}
async function onSubmitAdvanced() {
const update = await configStore.setPlayoutConfig(configStore.playout)
configStore.onetimeInfo = true
if (update.status === 200) {
indexStore.msgAlert('success', t('config.updatePlayoutSuccess'), 2)
const channel = configStore.configChannel[configStore.configID].id
await $fetch(`/api/control/${channel}/process/`, {
method: 'POST',
headers: { ...configStore.contentType, ...authStore.authHeader },
body: JSON.stringify({ command: 'status' }),
}).then((response: any) => {
if (response === 'active') {
showModal.value = true
}
})
} else {
indexStore.msgAlert('error', t('config.updatePlayoutFailed'), 2)
}
}
async function restart(res: boolean) {
if (res) {
const channel = configStore.configChannel[configStore.configID].id
await $fetch(`/api/control/${channel}/process/`, {
method: 'POST',
headers: { ...configStore.contentType, ...authStore.authHeader },
body: JSON.stringify({ command: 'restart' }),
})
}
showModal.value = false
}
</script>

2
components/ConfigChannel.vue
View File

@ -81,7 +81,7 @@ async function onSubmitGui() {
/*
Save GUI settings.
*/
const update = await configStore.setGuiConfig(configStore.configChannel[configStore.configID])
const update = await configStore.setChannelConfig(configStore.configChannel[configStore.configID])
if (update.status) {
indexStore.msgAlert('success', t('config.updateChannelSuccess'), 2)

7
lang/de-DE.js
View File

@ -137,6 +137,13 @@ export default {
log: {
download: 'Protokoll herunterladen',
},
advanced: {
title: 'Advanced Configuration',
decoder: 'Decoder',
encoder: 'Encoder',
filter: 'Filter',
ingest: 'Ingest',
},
config: {
channel: 'Kanal',
user: 'Benutzer',

7
lang/en-US.js
View File

@ -137,6 +137,13 @@ export default {
log: {
download: 'Download log file',
},
advanced: {
title: 'Advanced Configuration',
decoder: 'Decoder',
encoder: 'Encoder',
filter: 'Filter',
ingest: 'Ingest',
},
config: {
channel: 'Channel',
user: 'User',

7
lang/pt-BR.js
View File

@ -137,6 +137,13 @@ export default {
log: {
download: 'Baixar arquivo de registro',
},
advanced: {
title: 'Advanced Configuration',
decoder: 'Decoder',
encoder: 'Encoder',
filter: 'Filter',
ingest: 'Ingest',
},
config: {
channel: 'Canal',
user: 'Usuário',

7
lang/ru-RU.js
View File

@ -137,6 +137,13 @@ export default {
log: {
download: 'Скачать лог файл',
},
advanced: {
title: 'Advanced Configuration',
decoder: 'Decoder',
encoder: 'Encoder',
filter: 'Filter',
ingest: 'Ingest',
},
config: {
channel: 'Канал',
user: 'Юзер',

1169
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

6
package.json
View File

@ -16,13 +16,13 @@
"@nuxtjs/color-mode": "^3.4.1",
"@pinia/nuxt": "^0.5.1",
"@vuepic/vue-datepicker": "^8.8.0",
"@vueuse/nuxt": "^10.10.1",
"@vueuse/nuxt": "^10.11.0",
"bootstrap-icons": "^1.11.3",
"dayjs": "^1.11.11",
"jwt-decode": "^4.0.0",
"lodash": "^4.17.21",
"mpegts.js": "^1.7.3",
"nuxt": "3.12.1",
"nuxt": "3.12.2",
"pinia": "^2.1.7",
"sortablejs-vue3": "^1.2.11",
"splitpanes": "^3.1.5",
@ -39,7 +39,7 @@
"postcss-loader": "^8.1.1",
"sass": "^1.77.5",
"sass-loader": "^14.2.1",
"vue": "^3.4.27",
"vue": "^3.4.29",
"vue-router": "^4.3.3"
}
}

23
pages/configure.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="flex w-full h-full">
<div class="flex-none w-[70px] join join-vertical me-3 px-1 pt-7">
<div class="flex w-full h-full ps-1">
<div class="flex-none w-[70px] join join-vertical me-3 pt-7">
<button
class="join-item w-full btn btn-sm btn-primary duration-500"
:class="activeConf === 1 && 'btn-secondary'"
@ -9,16 +9,23 @@
{{ $t('config.channel') }}
</button>
<button
class="join-item w-full btn btn-sm btn-primary mt-1 duration-500"
class="join-item w-full btn btn-sm btn-primary duration-500"
:class="activeConf === 2 && 'btn-secondary'"
@click="activeConf = 2"
>
Playout
Advanced
</button>
<button
class="join-item w-full btn btn-sm btn-primary mt-1 duration-500"
:class="activeConf === 3 && 'btn-secondary'"
@click="activeConf = 3"
>
Playout
</button>
<button
class="join-item w-full btn btn-sm btn-primary mt-1 duration-500"
:class="activeConf === 4 && 'btn-secondary'"
@click="activeConf = 4"
>
{{ $t('config.user') }}
</button>
@ -28,11 +35,15 @@
<ConfigChannel />
</div>
<div v-else-if="activeConf === 2" class="w-full flex justify-center">
<ConfigPlayout />
<div v-if="activeConf === 2" class="w-full flex justify-center">
<ConfigAdvanced />
</div>
<div v-else-if="activeConf === 3" class="w-full flex justify-center">
<ConfigPlayout />
</div>
<div v-else-if="activeConf === 4" class="w-full flex justify-center">
<ConfigUser />
</div>
</div>

30
stores/config.ts
View File

@ -9,6 +9,7 @@ export const useConfig = defineStore('config', {
configChannel: [] as GuiConfig[],
configChannelRaw: [] as GuiConfig[],
playlistLength: 86400.0,
advanced: {} as any,
playout: {} as any,
currentUser: 0,
configUser: {} as User,
@ -25,13 +26,18 @@ export const useConfig = defineStore('config', {
if (authStore.isLogin) {
await authStore.obtainUuid()
await this.getGuiConfig()
await this.getChannelConfig()
await this.getPlayoutConfig()
await this.getUserConfig()
if (this.configUser.id === 1) {
await this.getAdvancedConfig()
}
}
},
async getGuiConfig() {
async getChannelConfig() {
const authStore = useAuth()
const indexStore = useIndex()
@ -75,7 +81,7 @@ export const useConfig = defineStore('config', {
})
},
async setGuiConfig(obj: GuiConfig): Promise<any> {
async setChannelConfig(obj: GuiConfig): Promise<any> {
const authStore = useAuth()
const stringObj = _.cloneDeep(obj)
let response
@ -141,6 +147,24 @@ export const useConfig = defineStore('config', {
})
},
async getAdvancedConfig() {
const { $i18n } = useNuxtApp()
const authStore = useAuth()
const indexStore = useIndex()
const channel = this.configChannel[this.configID].id
await $fetch(`/api/playout/advanced/${channel}`, {
method: 'GET',
headers: authStore.authHeader,
})
.then((data) => {
this.advanced = data
})
.catch(() => {
indexStore.msgAlert('error', $i18n.t('config.noAdvancedConfig'), 3)
})
},
async setPlayoutConfig(obj: any) {
const { timeToSeconds } = stringFormatter()
const authStore = useAuth()