add proper state switcher

This commit is contained in:
Shpuld Shpuldson 2021-01-27 13:13:10 +02:00
parent e73553dca7
commit 06f795d1d6
5 changed files with 39 additions and 37 deletions

View File

@ -13,14 +13,19 @@ const Report = {
computed: { computed: {
report () { report () {
return this.$store.state.reports.reports[this.reportId] || {} return this.$store.state.reports.reports[this.reportId] || {}
},
state: {
get: function () { return this.report.state },
set: function (val) { this.setReportState(val) }
} }
}, },
methods: { methods: {
generateUserProfileLink (user) { generateUserProfileLink (user) {
return generateProfileLink(user.id, user.screen_name, this.$store.state.instance.restrictedNicknames) return generateProfileLink(user.id, user.screen_name, this.$store.state.instance.restrictedNicknames)
}, },
setReportState (id, state) { setReportState (state) {
return this.$store.dispatch('setReportState', { id, state }) console.log('setting state', state)
return this.$store.dispatch('setReportState', { id: this.report.id, state })
} }
} }
} }

View File

@ -2,7 +2,11 @@
.Report { .Report {
.report-content { .report-content {
margin: 0.5em 0; margin: 0.5em 0 1em;
}
.report-state {
margin: 0.5em 0 1em;
} }
.reported-status { .reported-status {

View File

@ -1,29 +1,5 @@
<template> <template>
<div class="Report"> <div class="Report">
<div class="report-state">
<label
for="report-state"
class="select"
>
<select
id="report-state"
v-model="report.state"
class="form-control"
>
<option
v-for="state in ['open', 'closed', 'resolved']"
:key="state"
:value="report.state"
>
{{ $t('report.state_' + state) }}
</option>
</select>
<FAIcon
class="select-down-icon"
icon="chevron-down"
/>
</label>
</div>
<div class="reported-user"> <div class="reported-user">
<span>{{ $t('report.reported_user') }}</span> <span>{{ $t('report.reported_user') }}</span>
<router-link :to="generateUserProfileLink(report.acct)"> <router-link :to="generateUserProfileLink(report.acct)">
@ -38,7 +14,28 @@
</div> </div>
<div class="report-state"> <div class="report-state">
<span>{{ $t('report.state') }}</span> <span>{{ $t('report.state') }}</span>
<b>{{ $t('report.state_' + report.state) }}</b> <label
for="report-state"
class="select"
>
<select
id="report-state"
v-model="state"
class="form-control"
>
<option
v-for="state in ['open', 'closed', 'resolved']"
:key="state"
:value="state"
>
{{ $t('report.state_' + state) }}
</option>
</select>
<FAIcon
class="select-down-icon"
icon="chevron-down"
/>
</label>
</div> </div>
<!-- eslint-disable vue/no-v-html --> <!-- eslint-disable vue/no-v-html -->
<div <div

View File

@ -1,4 +1,3 @@
import backendInteractorService from '../services/backend_interactor_service/backend_interactor_service.js'
import filter from 'lodash/filter' import filter from 'lodash/filter'
const reports = { const reports = {
@ -44,12 +43,14 @@ const reports = {
}, },
setReportState ({ commit, rootState }, { id, state }) { setReportState ({ commit, rootState }, { id, state }) {
const oldState = rootState.reports.reports[id].state const oldState = rootState.reports.reports[id].state
console.log(oldState, state)
commit('setReportState', { id, state }) commit('setReportState', { id, state })
backendInteractorService.setReportState({ id, state }).then(report => { rootState.api.backendInteractor.setReportState({ id, state }).then(report => {
console.log(report) console.log(report)
}).catch(e => { }).catch(e => {
console.error('Failed to set report state', e) console.error('Failed to set report state', e)
commit('setReportState', { id, oldState }) commit('setReportState', { id, state: oldState })
console.log(oldState)
}) })
}, },
addReport ({ commit }, report) { addReport ({ commit }, report) {

File diff suppressed because one or more lines are too long