sam/admin-fe
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Add tag with report state and ability to change it to Report Card

Browse source
This commit is contained in:
Angelina Filippova 2019-09-28 23:50:57 +03:00
parent b87945c42f
commit 4dd550a0cf
3 changed files with 53 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/lang/en.js
View file

@ -262,7 +262,8 @@ export default {
deleteCompleted: 'Delete comleted',
deleteCanceled: 'Delete canceled',
noNotes: 'No notes to display',
changeState: 'Change report state',
changeState: "Change report's state",
changeAllReports: 'Change all reports',
changeScope: 'Change scope',
moderateUser: 'Moderate user',
resolve: 'Resolve',

12
src/views/reports/components/GroupedReport.vue
View file

@ -5,6 +5,14 @@
<h3 class="report-title">{{ $t('reports.reportsOn') }} {{ group.account.display_name }}</h3>
</div>
<div>
<el-dropdown trigger="click">
<el-button plain size="small" icon="el-icon-edit">{{ $t('reports.changeAllReports') }}<i class="el-icon-arrow-down el-icon--right"/></el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item @click.native="changeAllReports('resolved', group.reports)">{{ $t('reports.resolveAll') }}</el-dropdown-item>
<el-dropdown-item @click.native="changeAllReports('open', group.reports)">{{ $t('reports.reopenAll') }}</el-dropdown-item>
<el-dropdown-item @click.native="changeAllReports('closed', group.reports)">{{ $t('reports.closeAll') }}</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<moderate-user-dropdown :account="group.account"/>
</div>
</div>
@ -59,8 +67,8 @@ export default {
}
},
methods: {
changeMultipleReportsState(reportState, groupOfReports) {
// this.$store.dispatch('ChangeReportState', { reportState, reportId })
changeAllReports(reportState, groupOfReports) {
console.log(groupOfReports)
}
}
}

41
src/views/reports/components/ReportCard.vue
View file

@ -12,6 +12,17 @@
@{{ report.actor.acct }}
</a>
</div>
<div>
<el-tag :type="getStateType(report.state)" size="large">{{ capitalizeFirstLetter(report.state) }}</el-tag>
<el-dropdown trigger="click">
<el-button plain size="small" icon="el-icon-edit">{{ $t('reports.changeState') }}<i class="el-icon-arrow-down el-icon--right"/></el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item v-if="report.state !== 'resolved'" @click.native="changeReportState('resolved', report.id)">{{ $t('reports.resolve') }}</el-dropdown-item>
<el-dropdown-item v-if="report.state !== 'open'" @click.native="changeReportState('open', report.id)">{{ $t('reports.reopen') }}</el-dropdown-item>
<el-dropdown-item v-if="report.state !== 'closed'" @click.native="changeReportState('closed', report.id)">{{ $t('reports.close') }}</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
</div>
</div>
<div class="report-body">
@ -34,6 +45,22 @@ export default {
}
},
methods: {
capitalizeFirstLetter(str) {
return str.charAt(0).toUpperCase() + str.slice(1)
},
changeReportState(reportState, reportId) {
this.$store.dispatch('ChangeReportState', { reportState, reportId })
},
getStateType(state) {
switch (state) {
case 'closed':
return 'info'
case 'resolved':
return 'success'
default:
return 'primary'
}
},
parseTimestamp(timestamp) {
return moment(timestamp).format('YYYY-MM-DD HH:mm')
}
@ -45,6 +72,15 @@ export default {
a {
text-decoration: underline;
}
.el-icon-arrow-right {
margin-right: 6px;
}
.report-header {
display: flex;
justify-content: space-between;
align-items: baseline;
height: 40px;
}
.report-actor {
display: flex;
align-items: center;
@ -78,6 +114,11 @@ export default {
.el-card__header {
padding: 10px 17px;
}
.report-header {
display: flex;
flex-direction: column;
height: 80px;
}
.report-actor-container {
margin-bottom: 5px;
}