interru/admin-fe
1
0
Fork 0
forked from AkkomaGang/admin-fe
Code Issues Pull requests Projects Releases Packages Wiki Activity

Show fetched reports

Browse source
This commit is contained in:
Angelina Filippova 2019-05-18 01:47:20 +03:00
parent 8774af3259
commit 180f02f7a2
7 changed files with 80 additions and 44 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
package.json
View file

@ -50,6 +50,7 @@
"jszip": "3.1.5",
"lodash": "^4.17.11",
"lodash.debounce": "^4.0.8",
"moment": "^2.24.0",
"normalize.css": "7.0.0",
"nprogress": "0.2.0",
"screenfull": "4.0.0",

30
src/api/reports.js
View file

@ -1,14 +1,22 @@
import { reports } from './reportsData'
import request from '@/utils/request'
import { getToken } from '@/utils/auth'
import { baseName } from './utils'
export function fetchReports(index, size) {
const response = reports.slice(index, index + size)
return response
export async function fetchReports(authHost, token) {
return await request({
baseURL: baseName(authHost),
url: `/api/pleroma/admin/reports`,
method: 'get',
headers: authHeaders(token)
})
}
export function deleteNote(reportId, noteId) {
const updatedNotes = reports
.find(report => report.id === reportId)
.notes
.filter(note => note.id !== noteId)
return updatedNotes
}
// export function deleteNote(reportId, noteId) {
// const updatedNotes = reports
// .find(report => report.id === reportId)
// .notes
// .filter(note => note.id !== noteId)
// return updatedNotes
// }
const authHeaders = (token) => token ? { 'Authorization': `Bearer ${getToken()}` } : {}

34
src/store/modules/reports.js
View file

@ -1,4 +1,4 @@
import { fetchReports, deleteNote } from '@/api/reports'
import { fetchReports } from '@/api/reports'
const reports = {
state: {
@ -22,27 +22,27 @@ const reports = {
}
},
actions: {
async FetchReports({ commit, state, getters }) {
async FetchReports({ commit, getters }) {
commit('SET_LOADING', true)
const response = fetchReports(state.indexOfLastShownReport, state.size)
const response = await fetchReports(getters.authHost, getters.token)
commit('SET_REPORTS', response)
commit('SET_REPORTS', response.data.reports)
commit('SET_INDEX')
commit('SET_LOADING', false)
},
async AddNote({ commit, state, getters }, { reportId, note }) {
const report = state.fetchedReports.find(report => report.id === reportId)
report.notes = [...report.notes, note]
const reportIndex = state.fetchedReports.findIndex(report => report.id === reportId)
commit('SET_REPORT', { reportIndex, report })
},
async DeleteNote({ commit, state }, { reportId, noteId }) {
const response = deleteNote(reportId, noteId)
const report = state.fetchedReports.find(report => report.id === reportId)
report.notes = response
const reportIndex = state.fetchedReports.findIndex(report => report.id === reportId)
commit('SET_REPORT', { reportIndex, report })
}
// async AddNote({ commit, state, getters }, { reportId, note }) {
// const report = state.fetchedReports.find(report => report.id === reportId)
// report.notes = [...report.notes, note]
// const reportIndex = state.fetchedReports.findIndex(report => report.id === reportId)
// commit('SET_REPORT', { reportIndex, report })
// },
// async DeleteNote({ commit, state }, { reportId, noteId }) {
// const response = deleteNote(reportId, noteId)
// const report = state.fetchedReports.find(report => report.id === reportId)
// report.notes = response
// const reportIndex = state.fetchedReports.findIndex(report => report.id === reportId)
// commit('SET_REPORT', { reportIndex, report })
// }
}
}

3
src/store/modules/users.js
View file

@ -72,9 +72,6 @@ const users = {
commit('SWAP_USER', updatedUser)
},
async FetchUsers({ commit, state, getters }, { page }) {
const filters = Object.keys(state.filters).filter(filter => state.filters[filter]).join()
const response = await fetchUsers(filters, getters.authHost, getters.token, page)
commit('SET_LOADING', true)
const filters = Object.keys(state.filters).filter(filter => state.filters[filter]).join()

49
src/views/reports/components/TimelineItem.vue
View file

@ -1,19 +1,23 @@
<template>
<el-timeline-item :timestamp="item.timestamp" placement="top" class="timeline-item-container">
<el-timeline-item :timestamp="parseTimestamp(report.created_at)" placement="top" class="timeline-item-container">
<el-card>
<div class="header-container">
<h4>{{ item.header }}</h4>
<el-button plain size="small" @click="toggleNoteInput">{{ $t('reports.reply') }}</el-button>
<h4>Report on {{ report.account.acct }}</h4>
<div>
<el-tag :type="getStateType(report.state)" size="large">{{ capitalizeFirstLetter(report.state) }}</el-tag>
<el-button plain size="small" @click="toggleNoteInput">{{ $t('reports.reply') }}</el-button>
</div>
</div>
<p>{{ item.content }}</p>
<h5 class="id">#{{ report.id }}</h5>
<p>{{ report.content }}</p>
<el-collapse v-model="showNotes">
<el-collapse-item :title="$t('reports.showNotes')" name="showNotes">
<div v-if="item.notes.length > 0">
<div v-for="note in item.notes" :key="note.id">
<div v-if="report.statuses.length > 0">
<div v-for="note in report.statuses" :key="note.id">
<el-card :body-style="{ padding: '6px 14px 0 14px' }" class="note">
<div class="header-container">
<h4>{{ $t('reports.from') }} {{ note.author }}</h4>
<i class="el-icon-close" @click="deleteNote(item.id, note.id)"/>
<i class="el-icon-close" @click="deleteNote(report.id, note.id)"/>
</div>
<p class="timestamp">{{ note.timestamp }}</p>
<p>{{ note.text }}</p>
@ -30,7 +34,7 @@
<i class="el-icon-close" @click="toggleNoteInput"/>
</div>
<el-input v-model="note" :rows="2" type="textarea" autofocus/>
<el-button class="submit-button" plain size="small" @click="addNewNote(item.id)">{{ $t('reports.submit') }}</el-button>
<el-button class="submit-button" plain size="small" @click="addNewNote(report.id)">{{ $t('reports.submit') }}</el-button>
</div>
</el-collapse>
</el-card>
@ -39,11 +43,12 @@
<script>
import i18n from '@/lang'
import * as moment from 'moment'
export default {
name: 'TimelineItem',
props: {
item: {
report: {
type: Object,
required: true
}
@ -56,9 +61,6 @@ export default {
}
},
methods: {
toggleNoteInput() {
this.$data.showNewNoteInput = !this.$data.showNewNoteInput
},
addNewNote(reportId) {
if (this.$data.note.length < 2) {
this.$message('Note must contain at least 2 characters')
@ -88,6 +90,25 @@ export default {
message: i18n.t('reports.deleteCanceled')
})
})
},
capitalizeFirstLetter(str) {
return str.charAt(0).toUpperCase() + str.slice(1)
},
getStateType(state) {
switch (state) {
case 'closed':
return 'info'
case 'resolved':
return 'success'
default:
return ''
}
},
parseTimestamp(timestamp) {
return moment(timestamp).format('YYYY-MM-DD HH:mm')
},
toggleNoteInput() {
this.$data.showNewNoteInput = !this.$data.showNewNoteInput
}
}
}
@ -122,6 +143,10 @@ export default {
justify-content: space-between;
align-items: baseline;
}
.id {
color: gray;
margin: 0;
}
.new-note {
p {
font-size: 13px;

2
src/views/reports/index.vue
View file

@ -3,7 +3,7 @@
<h1>{{ $t('reports.reports') }}</h1>
<div class="block">
<el-timeline class="timeline">
<timeline-item v-loading="loading" v-for="item in reports" :item="item" :key="item.id"/>
<timeline-item v-loading="loading" v-for="report in reports" :report="report" :key="report.id"/>
</el-timeline>
</div>
</div>

5
yarn.lock
View file

@ -6645,6 +6645,11 @@ mkdirp@0.5.1, mkdirp@0.5.x, mkdirp@0.x, "mkdirp@>=0.5 0", mkdirp@^0.5.0, mkdirp@
dependencies:
minimist "0.0.8"
moment@^2.24.0:
version "2.24.0"
resolved "https://registry.yarnpkg.com/moment/-/moment-2.24.0.tgz#0d055d53f5052aa653c9f6eb68bb5d12bf5c2b5b"
integrity sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg==
move-concurrently@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/move-concurrently/-/move-concurrently-1.0.1.tgz#be2c005fda32e0b29af1f05d7c4b33214c701f92"