diff options
| -rw-r--r-- | src/boot/after_store.js | 2 | ||||
| -rw-r--r-- | src/components/settings_modal/tabs/profile_tab.js | 21 | ||||
| -rw-r--r-- | src/components/settings_modal/tabs/profile_tab.scss | 17 | ||||
| -rw-r--r-- | src/components/settings_modal/tabs/profile_tab.vue | 46 |
4 files changed, 86 insertions, 0 deletions
diff --git a/src/boot/after_store.js b/src/boot/after_store.js index 0db03547..87c92a8a 100644 --- a/src/boot/after_store.js +++ b/src/boot/after_store.js @@ -207,6 +207,8 @@ const getNodeInfo = async ({ store }) => { store.dispatch('setInstanceOption', { name: 'pollLimits', value: metadata.pollLimits }) store.dispatch('setInstanceOption', { name: 'mailerEnabled', value: metadata.mailerEnabled }) + store.dispatch('setInstanceOption', { name: 'fieldsLimits', value: metadata.fieldsLimits }) + store.dispatch('setInstanceOption', { name: 'restrictedNicknames', value: metadata.restrictedNicknames }) store.dispatch('setInstanceOption', { name: 'postFormats', value: metadata.postFormats }) diff --git a/src/components/settings_modal/tabs/profile_tab.js b/src/components/settings_modal/tabs/profile_tab.js index 8658b097..896ff508 100644 --- a/src/components/settings_modal/tabs/profile_tab.js +++ b/src/components/settings_modal/tabs/profile_tab.js @@ -1,4 +1,5 @@ import unescape from 'lodash/unescape' +import merge from 'lodash/merge' import ImageCropper from 'src/components/image_cropper/image_cropper.vue' import ScopeSelector from 'src/components/scope_selector/scope_selector.vue' import fileSizeFormatService from 'src/components/../services/file_size_format/file_size_format.js' @@ -16,6 +17,7 @@ const ProfileTab = { newLocked: this.$store.state.users.currentUser.locked, newNoRichText: this.$store.state.users.currentUser.no_rich_text, newDefaultScope: this.$store.state.users.currentUser.default_scope, + newFields: this.$store.state.users.currentUser.fields.map(field => ({ name: field.name, value: field.value })), hideFollows: this.$store.state.users.currentUser.hide_follows, hideFollowers: this.$store.state.users.currentUser.hide_followers, hideFollowsCount: this.$store.state.users.currentUser.hide_follows_count, @@ -62,6 +64,12 @@ const ProfileTab = { ...this.$store.state.instance.emoji, ...this.$store.state.instance.customEmoji ] }) + }, + fieldsLimits () { + return this.$store.state.instance.fieldsLimits + }, + maxFields () { + return this.fieldsLimits ? this.fieldsLimits.maxFields : 0 } }, methods: { @@ -74,6 +82,7 @@ const ProfileTab = { // Backend notation. /* eslint-disable camelcase */ display_name: this.newName, + fields_attributes: this.newFields.filter(el => el != null), default_scope: this.newDefaultScope, no_rich_text: this.newNoRichText, hide_follows: this.hideFollows, @@ -85,6 +94,8 @@ const ProfileTab = { show_role: this.showRole /* eslint-enable camelcase */ } }).then((user) => { + this.newFields.splice(user.fields.length) + merge(this.newFields, user.fields) this.$store.commit('addNewUsers', [user]) this.$store.commit('setCurrentUser', user) }) @@ -92,6 +103,16 @@ const ProfileTab = { changeVis (visibility) { this.newDefaultScope = visibility }, + addField () { + if (this.newFields.length < this.maxFields) { + this.newFields.push({ name: '', value: '' }) + return true + } + return false + }, + deleteField (index, event) { + this.$delete(this.newFields, index) + }, uploadFile (slot, e) { const file = e.target.files[0] if (!file) { return } diff --git a/src/components/settings_modal/tabs/profile_tab.scss b/src/components/settings_modal/tabs/profile_tab.scss index 4aab81eb..b3dcf42c 100644 --- a/src/components/settings_modal/tabs/profile_tab.scss +++ b/src/components/settings_modal/tabs/profile_tab.scss @@ -79,4 +79,21 @@ .setting-subitem { margin-left: 1.75em; } + + .profile-fields { + display: flex; + + &>.emoji-input { + flex: 1 1 auto; + margin: 0 .2em .5em; + } + + &>.icon-container { + width: 20px; + + &>.icon-cancel { + vertical-align: sub; + } + } + } } diff --git a/src/components/settings_modal/tabs/profile_tab.vue b/src/components/settings_modal/tabs/profile_tab.vue index fff4f970..2fa3021e 100644 --- a/src/components/settings_modal/tabs/profile_tab.vue +++ b/src/components/settings_modal/tabs/profile_tab.vue @@ -95,6 +95,52 @@ {{ $t('settings.discoverable') }} </Checkbox> </p> + <div v-if="maxFields > 0"> + <p>{{ $t('settings.profile_fields.label') }}</p> + <div + v-for="(_, i) in newFields" + :key="i" + class="profile-fields" + > + <EmojiInput + v-model="newFields[i].name" + :suggest="emojiSuggestor" + hide-emoji-button + > + <input + v-model="newFields[i].name" + :placeholder="$t('settings.profile_fields.name')" + > + </EmojiInput> + <EmojiInput + v-model="newFields[i].value" + :suggest="emojiSuggestor" + hide-emoji-button + > + <input + v-model="newFields[i].value" + :placeholder="$t('settings.profile_fields.value')" + > + </EmojiInput> + <div + class="icon-container" + > + <i + v-show="newFields.length > 1" + class="icon-cancel" + @click="deleteField(i)" + /> + </div> + </div> + <a + v-if="newFields.length < maxFields" + class="add-field faint" + @click="addField" + > + <i class="icon-plus" /> + {{ $t("settings.profile_fields.add_field") }} + </a> + </div> <button :disabled="newName && newName.length === 0" class="btn btn-default" |