admin-fe/src/views/settings/components/LinkFormatter.vue

76 lines
1.9 KiB
Vue

<template>
<div v-if="!loading" :class="isSidebarOpen" class="form-container">
<el-form :model="linkFormatterData" :label-position="labelPosition" :label-width="labelWidth">
<setting :setting-group="linkFormatter" :data="linkFormatterData"/>
</el-form>
<div class="submit-button-container">
<el-button class="submit-button" type="primary" @click="onSubmit">{{ $t('settings.submit') }}</el-button>
</div>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
import i18n from '@/lang'
import Setting from './Setting'
import _ from 'lodash'
export default {
name: 'LinkFormatter',
components: { Setting },
computed: {
...mapGetters([
'settings'
]),
linkFormatter() {
return this.settings.description.find(setting => setting.key === 'Pleroma.Formatter')
},
linkFormatterData() {
return _.get(this.settings.settings, [':pleroma', 'Pleroma.Formatter']) || {}
},
isMobile() {
return this.$store.state.app.device === 'mobile'
},
isSidebarOpen() {
return this.$store.state.app.sidebar.opened ? 'sidebar-opened' : 'sidebar-closed'
},
isTablet() {
return this.$store.state.app.device === 'tablet'
},
labelPosition() {
return this.isMobile ? 'top' : 'right'
},
labelWidth() {
if (this.isMobile) {
return '120px'
} else if (this.isTablet) {
return '200px'
} else {
return '280px'
}
},
loading() {
return this.settings.loading
}
},
methods: {
async onSubmit() {
try {
await this.$store.dispatch('SubmitChanges')
} catch (e) {
return
}
this.$message({
type: 'success',
message: i18n.t('settings.success')
})
}
}
}
</script>
<style rel='stylesheet/scss' lang='scss'>
@import '../styles/main';
@include settings
</style>