66 lines
1.6 KiB
Vue
66 lines
1.6 KiB
Vue
<template>
|
|
<div v-if="!loading">
|
|
<el-form-item v-if="settingsGroup.description && settingsGroup.group !== ':esshd'" class="options-paragraph-container">
|
|
<p class="options-paragraph">{{ settingsGroup.description }}</p>
|
|
</el-form-item>
|
|
<div v-for="setting in settingsGroup.children" :key="setting.key">
|
|
<div v-if="!compound(setting.type)">
|
|
<inputs :settings-group="settingsGroup" :setting="setting" :data="data"/>
|
|
</div>
|
|
<div v-if="compound(setting.type)">
|
|
<el-form-item :label="`${setting.label}:`"/>
|
|
<div v-for="subSetting in setting.children" :key="subSetting.key">
|
|
<inputs :settings-group="setting" :setting="subSetting" :data="data[setting]"/>
|
|
</div>
|
|
<div class="line"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import AceEditor from 'vue2-ace-editor'
|
|
import Inputs from './Inputs'
|
|
import 'brace/mode/elixir'
|
|
import 'default-passive-events'
|
|
|
|
export default {
|
|
name: 'Setting',
|
|
components: {
|
|
editor: AceEditor,
|
|
Inputs
|
|
},
|
|
props: {
|
|
settingsGroup: {
|
|
type: Object,
|
|
default: function() {
|
|
return {}
|
|
}
|
|
},
|
|
data: {
|
|
type: Object,
|
|
default: function() {
|
|
return {}
|
|
}
|
|
}
|
|
},
|
|
computed: {
|
|
loading() {
|
|
return this.$store.state.settings.loading
|
|
}
|
|
},
|
|
methods: {
|
|
compound(type) {
|
|
return ['map', 'keyword'].includes(type)
|
|
},
|
|
updateSetting(value, tab, input) {
|
|
this.$store.dispatch('UpdateSettings', { tab, data: { [input]: value }})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style rel='stylesheet/scss' lang='scss'>
|
|
@import '../styles/main';
|
|
@include settings
|
|
</style>
|