make poll form state local instead of vuex

This commit is contained in:
shpuld 2019-06-07 19:09:38 +03:00
parent 70ba232ce3
commit 88c3103755
4 changed files with 27 additions and 39 deletions

View file

@ -7,24 +7,24 @@
class="poll-option-input"
type="text"
:placeholder="$t('polls.option')"
@input="onUpdateOption($event, index)"
:value="option"
:maxlength="maxLength"
v-model="options[index]"
@change="updatePollToParent"
>
</div>
<div class="icon-container">
<i class="icon-cancel" @click="onDeleteOption(index)"></i>
<div class="icon-container" v-if="options.length > 2">
<i class="icon-cancel" @click="deleteOption(index)"></i>
</div>
</div>
<button
class="btn btn-default add-option"
type="button"
@click="onAddOption"
@click="addOption"
>{{ $t("polls.add_option") }}</button>
<div class="poll-type-expiry">
<div class="poll-type">
<label for="poll-type-selector" class="select">
<select id="poll-type-selector" v-model="pollType" @change="onTypeChange">
<select id="poll-type-selector" v-model="pollType" @change="updatePollToParent">
<option value="single">{{$t('polls.single_choice')}}</option>
<option value="multiple">{{$t('polls.multiple_choices')}}</option>
</select>
@ -33,7 +33,7 @@
</div>
<div class="poll-expiry">
<label for="poll-expiry-selector" class="select">
<select id="poll-expiry-selector" v-model="pollExpiry" @change="onExpiryChange">
<select id="poll-expiry-selector" v-model="pollExpiry" @change="updatePollToParent">
<option v-for="(value, key) in expiryOptions" :value="key" v-bind:key="key">
{{ value }}
</option>
@ -53,15 +53,10 @@ export default {
props: ['visible'],
data: () => ({
pollType: 'single',
pollExpiry: '86400'
pollExpiry: '86400',
options: ['', '']
}),
computed: {
optionsLength () {
return this.$store.state.poll.options.length
},
options () {
return this.$store.state.poll.options
},
pollLimits () {
return this.$store.state.instance.pollLimits
},
@ -88,29 +83,22 @@ export default {
}
},
methods: {
onAddOption () {
if (this.optionsLength < this.maxOptions) {
this.$store.dispatch('addPollOption', { option: '' })
addOption () {
if (this.options.length < this.maxOptions) {
this.options.push('')
}
},
onDeleteOption (index) {
if (this.optionsLength > 1) {
this.$store.dispatch('deletePollOption', { index })
deleteOption (index, event) {
if (this.options.length > 2) {
this.options.splice(index, 1)
}
},
onUpdateOption (e, index) {
this.$store.dispatch('updatePollOption', {
index,
option: e.target.value
updatePollToParent () {
this.$emit('update-poll', {
options: this.options,
expiresIn: this.pollExpiry,
multiple: this.pollType === 'multiple'
})
},
onTypeChange (e) {
const multiple = e.target.value === 'multiple'
this.$store.dispatch('setMultiple', { multiple })
},
onExpiryChange (e) {
this.$store.dispatch('setExpiresIn', { expiresIn: e.target.value })
}
}
}

View file

@ -41,7 +41,7 @@ export default {
methods: {
vote () {
this.loading = true
const choices = this.checks.map((entry, index) => index).filter(value => typeof value === 'number')
this.$store.dispatch('votePoll', { id: this.statusId, pollId: this.poll.id, choices }).then(poll => {
this.loading = false

View file

@ -66,8 +66,6 @@ const PostStatusForm = {
? this.$store.state.instance.postContentType
: this.$store.state.config.postContentType
const poll = this.$store.state.poll || {}
return {
dropFiles: [],
submitDisabled: false,
@ -79,7 +77,7 @@ const PostStatusForm = {
status: statusText,
nsfw: false,
files: [],
poll,
poll: {},
visibility: scope,
contentType
},
@ -280,9 +278,8 @@ const PostStatusForm = {
files: [],
visibility: newStatus.visibility,
contentType: newStatus.contentType,
poll: this.$store.state.poll
poll: {}
}
this.$store.dispatch('swapPollOptions', { options: ['', ''] })
this.pollFormVisible = false
this.$refs.mediaUpload.clearFile()
this.$emit('posted')
@ -358,6 +355,9 @@ const PostStatusForm = {
togglePollForm () {
this.pollFormVisible = !this.pollFormVisible
},
setPoll (poll) {
this.newStatus.poll = poll
},
dismissScopeNotice () {
this.$store.dispatch('setOption', { name: 'hideScopeNotice', value: true })
}

View file

@ -92,7 +92,7 @@
</div>
</div>
</div>
<poll-form v-if="pollsAvailable" :visible="pollFormVisible" />
<poll-form v-if="pollsAvailable" :visible="pollFormVisible" @update-poll="setPoll" />
<div class='form-bottom'>
<media-upload ref="mediaUpload" @uploading="disableSubmit" @uploaded="addMediaFile" @upload-failed="uploadFailed" :drop-files="dropFiles"></media-upload>
<div v-if="pollsAvailable" class="poll-icon">