Verified Commit 43dfab9a authored by Eliot Berriot's avatar Eliot Berriot
Browse files

See #890: Collapse report on resolution instead of reloading the page

parent fb0dcf45
<template>
<a role="button" class="collapse link" @click.prevent="$emit('input', !value)">
<translate v-if="isCollapsed" key="1" translate-context="*/*/Button,Label">Expand</translate>
<translate v-else key="2" translate-context="*/*/Button,Label">Collapse</translate>
<i :class="[{down: !isCollapsed}, {right: isCollapsed}, 'angle', 'icon']"></i>
</a>
</template>
<script>
export default {
props: {
value: {type: Boolean, required: true},
},
computed: {
isCollapsed () {
return this.value
}
}
}
</script>
......@@ -51,4 +51,9 @@ Vue.component('empty-state', EmptyState)
import ExpandableDiv from '@/components/common/ExpandableDiv'
Vue.component('expandable-div', ExpandableDiv)
import CollapseLink from '@/components/common/CollapseLink'
Vue.component('collapse-link', CollapseLink)
export default {}
......@@ -5,8 +5,10 @@
<router-link :to="{name: 'manage.moderation.reports.detail', params: {id: obj.uuid}}">
<translate translate-context="Content/Moderation/Card/Short" :translate-params="{id: obj.uuid.substring(0, 8)}">Report %{ id }</translate>
</router-link>
<collapse-link class="right floated" v-model="isCollapsed"></collapse-link>
</div>
<div class="content">
<div class="ui hidden divider"></div>
<div class="ui stackable two column grid">
<div class="column">
<table class="ui very basic unstackable table">
......@@ -99,7 +101,7 @@
</div>
</div>
</div>
<div class="main content">
<div class="main content" v-if="!isCollapsed">
<div class="ui stackable two column grid">
<div class="column">
<h3>
......@@ -247,6 +249,7 @@ export default {
return {
markdown: new showdown.Converter(),
isLoading: false,
isCollapsed: false,
}
},
computed: {
......@@ -354,8 +357,10 @@ export default {
axios.patch(url, {is_handled: v}).then((response) => {
self.$emit('handled', v)
self.isLoading = false
self.obj.is_handled = v
let increment
if (v) {
self.isCollapsed = true
increment = -1
} else {
increment = 1
......
......@@ -55,7 +55,7 @@
<empty-state @refresh="fetchData()" :refresh="true"></empty-state>
</div>
<div v-else-if="mode === 'card'">
<report-card :obj="obj" v-for="obj in result.results" :key="obj.uuid" @handled="fetchData()" @deleted="fetchData()" />
<report-card :obj="obj" v-for="obj in result.results" :key="obj.uuid" />
</div>
<action-table
v-else-if="mode === 'table'"
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment