work on channel support - add new channel, select channel in menu
This commit is contained in:
parent
fd1e72e2f6
commit
bfd0795203
@ -20,6 +20,11 @@
|
||||
<b-nav-item to="/configure" exact-active-class="active-menu-item">
|
||||
Configure
|
||||
</b-nav-item>
|
||||
<b-nav-item-dropdown :text="configGui[configID].channel" right>
|
||||
<b-dropdown-item v-for="(channel, index) in configGui" :key="channel.key" @click="selectChannel(index)">
|
||||
{{ channel.channel }}
|
||||
</b-dropdown-item>
|
||||
</b-nav-item-dropdown>
|
||||
<b-nav-item to="/" @click="logout()">
|
||||
Logout
|
||||
</b-nav-item>
|
||||
@ -29,10 +34,13 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'Menu',
|
||||
|
||||
computed: {
|
||||
...mapState('config', ['configID', 'configGui'])
|
||||
},
|
||||
|
||||
methods: {
|
||||
@ -43,6 +51,10 @@ export default {
|
||||
} catch (e) {
|
||||
this.formError = e.message
|
||||
}
|
||||
},
|
||||
|
||||
selectChannel (index) {
|
||||
this.$store.commit('config/UPDATE_CONFIG_ID', index)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -13,7 +13,14 @@
|
||||
label-class="font-weight-bold pt-0"
|
||||
class="config-group"
|
||||
>
|
||||
<div v-for="(prop, name, idx) in configGui" :key="idx">
|
||||
<div style="width: 100%; height: 43px;">
|
||||
<div class="float-right">
|
||||
<b-button size="sm" variant="primary" class="m-md-2" @click="addChannel()">
|
||||
Add new Channel
|
||||
</b-button>
|
||||
</div>
|
||||
</div>
|
||||
<div v-for="(prop, name, idx) in configGui[configID]" :key="idx">
|
||||
<b-form-group
|
||||
v-if="idx >= 1"
|
||||
label-cols-sm="2"
|
||||
@ -23,7 +30,7 @@
|
||||
>
|
||||
<b-form-tags
|
||||
v-if="name === 'extra_extensions'"
|
||||
v-model="configGui[name]"
|
||||
v-model="configGui[configID][name]"
|
||||
:input-id="name"
|
||||
separator=" ,;"
|
||||
:placeholder="`add ${name}...`"
|
||||
@ -32,8 +39,8 @@
|
||||
<b-form-text v-if="name === 'extra_extensions'">
|
||||
Visible extensions only for the GUI and not the playout
|
||||
</b-form-text>
|
||||
<b-form-select v-else-if="name === 'net_interface'" :id="name" v-model="configGui[name]" :options="netChoices" :value="prop" />
|
||||
<b-form-input v-else :id="name" v-model="configGui[name]" :value="prop" />
|
||||
<b-form-select v-else-if="name === 'net_interface'" :id="name" v-model="configGui[configID][name]" :options="netChoices" :value="prop" />
|
||||
<b-form-input v-else :id="name" v-model="configGui[configID][name]" :value="prop" />
|
||||
</b-form-group>
|
||||
</div>
|
||||
</b-form-group>
|
||||
@ -237,7 +244,7 @@ export default {
|
||||
},
|
||||
|
||||
computed: {
|
||||
...mapState('config', ['netChoices']),
|
||||
...mapState('config', ['configID', 'netChoices']),
|
||||
configGui: {
|
||||
get () {
|
||||
return this.$store.state.config.configGui
|
||||
@ -265,12 +272,23 @@ export default {
|
||||
},
|
||||
|
||||
methods: {
|
||||
addChannel () {
|
||||
const config = JSON.parse(JSON.stringify(this.configGui))
|
||||
const newConf = JSON.parse(JSON.stringify(this.configGui[this.configGui.length - 1]))
|
||||
newConf.id = config.length + 1
|
||||
newConf.channel = `New Channel - ${Math.random().toString(36).substring(7)}`
|
||||
|
||||
config.push(newConf)
|
||||
|
||||
this.$store.commit('config/UPDATE_GUI_CONFIG', config)
|
||||
this.$store.commit('config/UPDATE_CONFIG_ID', this.configGui.length - 1)
|
||||
},
|
||||
async onSubmitGui (evt) {
|
||||
evt.preventDefault()
|
||||
await this.$store.dispatch('auth/inspectToken')
|
||||
const update = await this.$store.dispatch('config/setGuiConfig', this.configGui)
|
||||
|
||||
if (update.status === 200) {
|
||||
if (update.status === 200 || update.status === 201) {
|
||||
this.alertVariant = 'success'
|
||||
this.alertMsg = 'Update GUI config success!'
|
||||
} else {
|
||||
|
@ -1,4 +1,6 @@
|
||||
export const state = () => ({
|
||||
configID: 0,
|
||||
configCount: 0,
|
||||
configGui: null,
|
||||
netChoices: [],
|
||||
configPlayout: [],
|
||||
@ -7,6 +9,12 @@ export const state = () => ({
|
||||
})
|
||||
|
||||
export const mutations = {
|
||||
UPDATE_CONFIG_ID (state, id) {
|
||||
state.configID = id
|
||||
},
|
||||
UPDATE_CONFIG_COUNT (state, count) {
|
||||
state.configCount = count
|
||||
},
|
||||
UPDATE_GUI_CONFIG (state, config) {
|
||||
state.configGui = config
|
||||
},
|
||||
@ -46,35 +54,40 @@ export const actions = {
|
||||
})
|
||||
commit('UPDATE_NET_CHOICES', choices)
|
||||
}
|
||||
|
||||
if (response.data && response.data[0]) {
|
||||
if (response.data[0].extra_extensions) {
|
||||
response.data[0].extra_extensions = response.data[0].extra_extensions.split(',')
|
||||
for (const data of response.data) {
|
||||
if (data.extra_extensions) {
|
||||
data.extra_extensions = data.extra_extensions.split(',')
|
||||
} else {
|
||||
response.data[0].extra_extensions = []
|
||||
data.extra_extensions = []
|
||||
}
|
||||
commit('UPDATE_GUI_CONFIG', response.data[0])
|
||||
}
|
||||
|
||||
commit('UPDATE_GUI_CONFIG', response.data)
|
||||
commit('UPDATE_CONFIG_COUNT', response.data.length)
|
||||
} else {
|
||||
commit('UPDATE_GUI_CONFIG', {
|
||||
id: 0,
|
||||
commit('UPDATE_GUI_CONFIG', [{
|
||||
id: 1,
|
||||
channel: '',
|
||||
player_url: '',
|
||||
playout_config: '',
|
||||
net_interface: '',
|
||||
media_disk: '',
|
||||
extra_extensions: []
|
||||
})
|
||||
}])
|
||||
}
|
||||
},
|
||||
|
||||
async setGuiConfig ({ commit, state }, obj) {
|
||||
const stringObj = JSON.parse(JSON.stringify(obj))
|
||||
stringObj.extra_extensions = obj.extra_extensions.join(',')
|
||||
const stringObj = JSON.parse(JSON.stringify(obj[state.configID]))
|
||||
stringObj.extra_extensions = stringObj.extra_extensions.join(',')
|
||||
let response
|
||||
|
||||
if (state.configPlayout.length === 0) {
|
||||
if (state.configPlayout.length === 0 || state.configCount !== stringObj.length) {
|
||||
response = await this.$axios.post('api/player/guisettings/', stringObj)
|
||||
} else {
|
||||
response = await this.$axios.put(`api/player/guisettings/${obj.id}/`, stringObj)
|
||||
response = await this.$axios.put(`api/player/guisettings/${obj[state.configID].id}/`, stringObj)
|
||||
}
|
||||
|
||||
return response
|
||||
|
Loading…
x
Reference in New Issue
Block a user