2019-11-03 17:37:56 +00:00
|
|
|
<template>
|
2019-11-15 13:42:44 +00:00
|
|
|
<el-form-item :label="setting.label" :label-width="customLabelWidth">
|
2019-11-03 17:37:56 +00:00
|
|
|
<el-input
|
|
|
|
v-if="setting.type === 'string'"
|
2019-11-19 10:49:36 +00:00
|
|
|
:value="inputValue"
|
2019-11-15 13:42:44 +00:00
|
|
|
:placeholder="setting.suggestions ? setting.suggestions[0] : null"
|
2019-12-03 13:35:38 +00:00
|
|
|
@input="update($event, settingGroup.group, settingGroup.key, settingParent, setting.key, setting.type, nested)"/>
|
2019-11-03 17:37:56 +00:00
|
|
|
<el-switch
|
|
|
|
v-if="setting.type === 'boolean'"
|
2019-11-19 10:49:36 +00:00
|
|
|
:value="inputValue"
|
2019-12-03 13:35:38 +00:00
|
|
|
@change="update($event, settingGroup.group, settingGroup.key, settingParent, setting.key, setting.type, nested)"/>
|
2019-11-03 17:37:56 +00:00
|
|
|
<el-input-number
|
|
|
|
v-if="setting.type === 'integer'"
|
2019-12-18 14:36:40 +00:00
|
|
|
:value="inputValue === null ? 0 : inputValue"
|
2019-11-15 13:42:44 +00:00
|
|
|
:placeholder="setting.suggestions ? setting.suggestions[0].toString() : null"
|
2019-11-03 17:37:56 +00:00
|
|
|
:min="0"
|
|
|
|
size="large"
|
|
|
|
class="top-margin"
|
2019-12-03 13:35:38 +00:00
|
|
|
@change="update($event, settingGroup.group, settingGroup.key, settingParent, setting.key, setting.type, nested)"/>
|
2019-11-03 17:37:56 +00:00
|
|
|
<el-select
|
2019-11-11 02:36:10 +00:00
|
|
|
v-if="setting.type === 'module' || (setting.type.includes('atom') && setting.type.includes(false))"
|
2019-11-21 14:07:13 +00:00
|
|
|
:value="inputValue"
|
2019-11-03 17:37:56 +00:00
|
|
|
clearable
|
2019-12-03 13:35:38 +00:00
|
|
|
@change="update($event, settingGroup.group, settingGroup.key, settingParent, setting.key, setting.type, nested)">
|
2019-11-03 17:37:56 +00:00
|
|
|
<el-option
|
2019-11-11 02:36:10 +00:00
|
|
|
v-for="(option, index) in setting.suggestions"
|
2019-11-03 17:37:56 +00:00
|
|
|
:value="option"
|
2019-11-11 02:36:10 +00:00
|
|
|
:key="index"/>
|
2019-11-03 17:37:56 +00:00
|
|
|
</el-select>
|
|
|
|
<el-select
|
2019-11-12 10:39:38 +00:00
|
|
|
v-if="renderMultipleSelect(setting.type)"
|
2019-11-20 02:12:08 +00:00
|
|
|
:value="setting.key === ':rewrite_policy' ? rewritePolicyValue : inputValue"
|
2019-11-03 17:37:56 +00:00
|
|
|
multiple
|
|
|
|
filterable
|
|
|
|
allow-create
|
2019-12-03 13:35:38 +00:00
|
|
|
@change="update($event, settingGroup.group, settingGroup.key, settingParent, setting.key, setting.type, nested)">
|
2019-11-11 02:36:10 +00:00
|
|
|
<el-option v-for="(option, index) in setting.suggestions" :key="index" :value="option"/>
|
2019-11-03 17:37:56 +00:00
|
|
|
</el-select>
|
|
|
|
<editor
|
2019-12-12 13:05:20 +00:00
|
|
|
v-if="setting.key === ':dispatch'"
|
2019-11-03 19:44:55 +00:00
|
|
|
v-model="editorContent"
|
2019-11-03 17:37:56 +00:00
|
|
|
height="150"
|
|
|
|
width="100%"
|
|
|
|
lang="elixir"
|
|
|
|
theme="chrome"/>
|
2019-11-03 19:44:55 +00:00
|
|
|
<el-input
|
2019-12-06 06:50:23 +00:00
|
|
|
v-if="setting.key === ':ip'"
|
|
|
|
:value="inputValue"
|
|
|
|
placeholder="xxx.xxx.xxx.xx"
|
|
|
|
@input="update($event, settingGroup.group, settingGroup.key, settingParent, setting.key, setting.type, nested)"/>
|
2019-11-08 12:33:39 +00:00
|
|
|
<el-input
|
|
|
|
v-if="setting.type === 'atom'"
|
2019-12-03 13:35:38 +00:00
|
|
|
:value="inputValue"
|
|
|
|
:placeholder="setting.suggestions[0] ? setting.suggestions[0].substr(1) : ''"
|
|
|
|
@input="update($event, settingGroup.group, settingGroup.key, settingParent, setting.key, setting.type, nested)">
|
2019-11-08 12:33:39 +00:00
|
|
|
<template slot="prepend">:</template>
|
|
|
|
</el-input>
|
2019-12-09 08:30:53 +00:00
|
|
|
<!-- special inputs -->
|
2019-12-13 19:11:29 +00:00
|
|
|
<auto-linker-input v-if="settingGroup.group === ':auto_linker'" :data="data" :setting-group="settingGroup" :setting="setting"/>
|
|
|
|
<mascots-input v-if="setting.key === ':mascots'" :data="data" :setting-group="settingGroup" :setting="setting"/>
|
2019-12-14 18:53:46 +00:00
|
|
|
<editable-keyword-input v-if="editableKeyword(setting.key, setting.type)" :data="data" :setting-group="settingGroup" :setting="setting"/>
|
2019-12-15 18:37:55 +00:00
|
|
|
<icons-input v-if="setting.key === ':icons'" :data="data[':icons']" :setting-group="settingGroup" :setting="setting"/>
|
2019-12-17 19:43:40 +00:00
|
|
|
<proxy-url-input v-if="setting.key === ':proxy_url'" :data="data[setting.key]" :setting-group="settingGroup" :setting="setting"/>
|
2019-12-18 14:36:40 +00:00
|
|
|
<ssl-options-input v-if="setting.key === ':ssl_options'" :setting-group="settingGroup" :setting-parent="settingParent" :setting="setting" :data="data" :nested="true" :custom-label-width="'100px'"/>
|
2019-12-21 15:02:16 +00:00
|
|
|
<backends-logger-input v-if="setting.key === ':backends'" :data="data" :setting-group="settingGroup" :setting="setting"/>
|
2019-12-21 21:52:42 +00:00
|
|
|
<prune-input v-if="setting.key === ':prune'" :data="data[setting.key]" :setting-group="settingGroup" :setting="setting"/>
|
2019-12-25 23:02:30 +00:00
|
|
|
<rate-limit-input v-if="settingGroup.key === ':rate_limit'" :data="data" :setting-group="settingGroup" :setting="setting"/>
|
2019-12-09 08:30:53 +00:00
|
|
|
<!-------------------->
|
2019-11-03 17:37:56 +00:00
|
|
|
<p class="expl">{{ setting.description }}</p>
|
|
|
|
</el-form-item>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
|
|
import AceEditor from 'vue2-ace-editor'
|
|
|
|
import 'brace/mode/elixir'
|
|
|
|
import 'default-passive-events'
|
2019-12-25 23:02:30 +00:00
|
|
|
import { AutoLinkerInput, BackendsLoggerInput, EditableKeywordInput, IconsInput, MascotsInput, ProxyUrlInput, PruneInput, RateLimitInput, SslOptionsInput } from './inputComponents'
|
2019-11-03 17:37:56 +00:00
|
|
|
|
|
|
|
export default {
|
|
|
|
name: 'Inputs',
|
|
|
|
components: {
|
2019-12-05 11:11:41 +00:00
|
|
|
editor: AceEditor,
|
2019-12-09 08:30:53 +00:00
|
|
|
AutoLinkerInput,
|
2019-12-21 15:02:16 +00:00
|
|
|
BackendsLoggerInput,
|
2019-12-14 18:53:46 +00:00
|
|
|
EditableKeywordInput,
|
2019-12-15 18:37:55 +00:00
|
|
|
IconsInput,
|
2019-12-17 19:43:40 +00:00
|
|
|
MascotsInput,
|
2019-12-18 14:36:40 +00:00
|
|
|
ProxyUrlInput,
|
2019-12-21 21:52:42 +00:00
|
|
|
PruneInput,
|
2019-12-25 23:02:30 +00:00
|
|
|
RateLimitInput,
|
2019-12-18 14:36:40 +00:00
|
|
|
SslOptionsInput
|
2019-11-03 17:37:56 +00:00
|
|
|
},
|
|
|
|
props: {
|
2019-11-15 13:42:44 +00:00
|
|
|
customLabelWidth: {
|
|
|
|
type: String,
|
|
|
|
default: function() {
|
|
|
|
return this.labelWidth
|
|
|
|
},
|
|
|
|
required: false
|
|
|
|
},
|
2019-11-14 15:49:35 +00:00
|
|
|
data: {
|
2019-12-13 19:11:29 +00:00
|
|
|
type: [Object, Array],
|
2019-11-03 17:37:56 +00:00
|
|
|
default: function() {
|
|
|
|
return {}
|
|
|
|
}
|
|
|
|
},
|
2019-12-03 13:35:38 +00:00
|
|
|
nested: {
|
|
|
|
type: Boolean,
|
|
|
|
default: function() {
|
|
|
|
return false
|
|
|
|
}
|
|
|
|
},
|
2019-11-14 15:49:35 +00:00
|
|
|
setting: {
|
|
|
|
type: Object,
|
2019-11-03 17:37:56 +00:00
|
|
|
default: function() {
|
|
|
|
return {}
|
|
|
|
}
|
|
|
|
},
|
2019-11-14 15:49:35 +00:00
|
|
|
settingGroup: {
|
2019-11-03 17:37:56 +00:00
|
|
|
type: Object,
|
|
|
|
default: function() {
|
|
|
|
return {}
|
|
|
|
}
|
2019-11-14 15:49:35 +00:00
|
|
|
},
|
|
|
|
settingParent: {
|
|
|
|
type: Object,
|
|
|
|
default: function() {
|
|
|
|
return {}
|
|
|
|
},
|
|
|
|
required: false
|
2019-11-03 17:37:56 +00:00
|
|
|
}
|
|
|
|
},
|
|
|
|
computed: {
|
2019-11-03 19:44:55 +00:00
|
|
|
editorContent: {
|
|
|
|
get: function() {
|
2019-11-10 01:17:57 +00:00
|
|
|
return this.data[this.setting.key] ? this.data[this.setting.key][0] : ''
|
2019-11-03 19:44:55 +00:00
|
|
|
},
|
|
|
|
set: function(value) {
|
2019-12-12 13:05:20 +00:00
|
|
|
this.processNestedData([value], this.settingGroup.group, this.settingGroup.key, this.settingParent.key, this.settingParent.type, this.setting.key, this.setting.type)
|
2019-11-03 19:44:55 +00:00
|
|
|
}
|
2019-11-11 13:47:54 +00:00
|
|
|
},
|
2019-11-19 10:49:36 +00:00
|
|
|
inputValue() {
|
2019-12-03 13:35:38 +00:00
|
|
|
if ([':esshd', ':cors_plug', ':quack', ':http_signatures'].includes(this.settingGroup.group) &&
|
|
|
|
this.data[this.setting.key]) {
|
2019-12-18 19:56:18 +00:00
|
|
|
return this.setting.type === 'atom' && this.data[this.setting.key].value[0] === ':'
|
|
|
|
? this.data[this.setting.key].value.substr(1)
|
|
|
|
: this.data[this.setting.key].value
|
2019-12-03 13:35:38 +00:00
|
|
|
} else if ((this.settingGroup.group === ':logger' && this.setting.key === ':backends') ||
|
2019-12-15 18:37:55 +00:00
|
|
|
this.setting.key === 'Pleroma.Web.Auth.Authenticator' ||
|
|
|
|
this.setting.key === ':admin_token') {
|
2019-11-20 03:01:19 +00:00
|
|
|
return this.data.value
|
2019-12-04 14:17:05 +00:00
|
|
|
} else if (this.setting.type === 'atom') {
|
|
|
|
return this.data[this.setting.key] && this.data[this.setting.key][0] === ':' ? this.data[this.setting.key].substr(1) : this.data[this.setting.key]
|
2019-11-20 03:01:19 +00:00
|
|
|
} else {
|
|
|
|
return this.data[this.setting.key]
|
|
|
|
}
|
2019-11-19 10:49:36 +00:00
|
|
|
},
|
2019-11-15 13:42:44 +00:00
|
|
|
labelWidth() {
|
|
|
|
return this.isMobile ? '100px' : '240px'
|
|
|
|
},
|
2019-11-20 02:12:08 +00:00
|
|
|
rewritePolicyValue() {
|
|
|
|
return typeof this.data[this.setting.key] === 'string' ? [this.data[this.setting.key]] : this.data[this.setting.key]
|
2019-12-04 14:17:05 +00:00
|
|
|
},
|
|
|
|
settings() {
|
|
|
|
return this.$store.state.settings.settings
|
|
|
|
},
|
|
|
|
updatedSettings() {
|
|
|
|
return this.$store.state.settings.updatedSettings
|
2019-11-03 19:44:55 +00:00
|
|
|
}
|
2019-11-03 17:37:56 +00:00
|
|
|
},
|
|
|
|
methods: {
|
2019-12-13 19:11:29 +00:00
|
|
|
editableKeyword(key, type) {
|
|
|
|
return key === ':replace' ||
|
|
|
|
(Array.isArray(type) && type.includes('keyword') && type.includes('integer')) ||
|
|
|
|
type === 'map' ||
|
|
|
|
(Array.isArray(type) && type.includes('keyword') && type.findIndex(el => el.includes('list') && el.includes('string')) !== -1)
|
2019-11-10 11:05:34 +00:00
|
|
|
},
|
2019-12-03 13:35:38 +00:00
|
|
|
processNestedData(value, group, key, parentInput, parentType, childInput, childType) {
|
2019-12-04 14:17:05 +00:00
|
|
|
const valueExists = value => value[group] && value[group][key] && value[group][key][parentInput]
|
|
|
|
const updatedValueForState = valueExists(this.settings)
|
|
|
|
? { ...this.settings[group][key][parentInput], ...{ [childInput]: value }}
|
|
|
|
: { [childInput]: value }
|
|
|
|
const updatedValue = valueExists(this.updatedSettings)
|
|
|
|
? { ...this.updatedSettings[group][key][parentInput][1], ...{ [childInput]: [childType, value] }}
|
2019-12-03 13:35:38 +00:00
|
|
|
: { [childInput]: [childType, value] }
|
|
|
|
this.$store.dispatch('UpdateSettings', { group, key, input: parentInput, value: updatedValue, type: parentType })
|
|
|
|
this.$store.dispatch('UpdateState', { group, key, input: parentInput, value: updatedValueForState })
|
2019-11-03 19:44:55 +00:00
|
|
|
},
|
2019-11-12 10:39:38 +00:00
|
|
|
renderMultipleSelect(type) {
|
2019-12-21 15:02:16 +00:00
|
|
|
return Array.isArray(type) && this.setting.key !== ':backends' && (
|
2019-11-20 02:12:08 +00:00
|
|
|
type.includes('module') ||
|
2019-11-12 10:39:38 +00:00
|
|
|
(type.includes('list') && type.includes('string')) ||
|
|
|
|
(type.includes('list') && type.includes('atom')) ||
|
2019-11-17 13:37:22 +00:00
|
|
|
(type.includes('regex') && type.includes('string')) ||
|
2019-11-15 13:42:44 +00:00
|
|
|
this.setting.key === ':args'
|
2019-11-12 10:39:38 +00:00
|
|
|
)
|
|
|
|
},
|
2019-12-03 13:35:38 +00:00
|
|
|
update(value, group, key, parent, input, type, nested) {
|
|
|
|
nested
|
|
|
|
? this.processNestedData(value, group, key, parent.key, parent.type, input, type)
|
|
|
|
: this.updateSetting(value, group, key, input, type)
|
|
|
|
},
|
2019-11-30 15:00:18 +00:00
|
|
|
updateSetting(value, group, key, input, type) {
|
|
|
|
this.$store.dispatch('UpdateSettings', { group, key, input, value, type })
|
2019-12-03 13:35:38 +00:00
|
|
|
this.$store.dispatch('UpdateState', { group, key, input, value })
|
2019-11-03 17:37:56 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<style rel='stylesheet/scss' lang='scss'>
|
|
|
|
@import '../styles/main';
|
|
|
|
@include settings
|
|
|
|
</style>
|