Commit 7731d5c1 authored by Maxim Filippov's avatar Maxim Filippov 🌚

Merge branch 'feature/moderate-users-on-status-page' into 'develop'

Ability to moderate users on the statuses page

See merge request !72
parents 85980b62 55d64539
......@@ -24,6 +24,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
- Grouped reports: now you can view reports, which are grouped by status (pagination is not implemented yet, though)
- Ability to confirm users' emails and resend confirmation emails
- Report notes
- Ability to moderate users on the statuses page
### Fixed
......
......@@ -5,8 +5,10 @@
<div class="status-header">
<div class="status-account-container">
<div class="status-account">
<img :src="status.account.avatar" class="status-avatar-img">
<h3 class="status-account-name">{{ status.account.display_name }}</h3>
<el-checkbox @change="handleStatusSelection(status.account)">
<img :src="status.account.avatar" class="status-avatar-img">
<h3 class="status-account-name">{{ status.account.display_name }}</h3>
</el-checkbox>
</div>
<a :href="status.account.url" target="_blank" class="account">
@{{ status.account.acct }}
......@@ -179,6 +181,9 @@ export default {
},
parseTimestamp(timestamp) {
return moment(timestamp).format('YYYY-MM-DD HH:mm')
},
handleStatusSelection(account) {
this.$emit('status-selection', account)
}
}
}
......@@ -205,11 +210,13 @@ export default {
align-items: center;
}
.status-avatar-img {
display: inline-block;
width: 15px;
height: 15px;
margin-right: 5px;
}
.status-account-name {
display: inline-block;
margin: 0;
height: 22px;
}
......
......@@ -47,6 +47,10 @@ const users = {
return acc.filter(u => u.id !== user.id)
}, state.fetchedUsers)
if (state.fetchedUsers.length === 0) {
return
}
state.fetchedUsers = [...usersWithoutSwapped, ...users].sort((a, b) =>
a.nickname.localeCompare(b.nickname)
)
......
......@@ -15,8 +15,13 @@
:label="instance"
:value="instance"/>
</el-select>
<multiple-users-menu
:selected-users="selectedUsers"
@apply-action="clearSelection"/>
</div>
<div v-for="status in statuses" :key="status.id" class="status-container">
<status :status="status" @status-selection="handleStatusSelection" />
</div>
<status v-for="status in statuses" :key="status.id" :status="status" />
<div v-if="statuses.length > 0" class="statuses-pagination">
<el-button @click="handleLoadMore">{{ $t('statuses.loadMore') }}</el-button>
</div>
......@@ -25,16 +30,19 @@
<script>
import { mapGetters } from 'vuex'
import MultipleUsersMenu from '@/views/users/components/MultipleUsersMenu'
import Status from '@/components/Status'
export default {
name: 'Statuses',
components: {
MultipleUsersMenu,
Status
},
data() {
return {
selectedInstance: '',
selectedUsers: [],
page: 1,
pageSize: 30
}
......@@ -67,6 +75,16 @@ export default {
page: this.page,
pageSize: this.pageSize
})
},
clearSelection() {
// TODO
},
handleStatusSelection(user) {
if (this.selectedUsers.find(selectedUser => user.id === selectedUser.id) !== undefined) {
return
}
this.selectedUsers = [...this.selectedUsers, user]
}
}
}
......@@ -75,6 +93,9 @@ export default {
<style rel='stylesheet/scss' lang='scss'>
.statuses-container {
padding: 0 15px;
.status-container {
margin: 0 0 10px;
}
}
.filter-container {
margin: 22px 15px 15px 0;
......
Markdown is supported
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