Render links for reports on mod log page
This commit is contained in:
parent
7cac1c7159
commit
c9e9775eb1
3 changed files with 32 additions and 15 deletions
|
@ -1,22 +1,15 @@
|
||||||
<template>
|
<template>
|
||||||
<span>
|
<span>
|
||||||
<component :is="processedHtml"/>
|
<component :is="processedHtml"/>
|
||||||
<!-- <span v-if="subject.type === 'report' && propertyExists(subject, 'id')">
|
|
||||||
{{ logEntryMessageWithoutId[0] }}
|
|
||||||
<router-link
|
|
||||||
:to="{ name: 'ReportsShow', params: { id: subject.id }}"
|
|
||||||
class="router-link">
|
|
||||||
<span style="font-weight: 600">#{{ subject.id }}</span>
|
|
||||||
</router-link>
|
|
||||||
{{ logEntryMessageWithoutId[1] }}
|
|
||||||
</span> -->
|
|
||||||
</span>
|
</span>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import ReportLink from './ReportLink'
|
||||||
import UserLink from './UserLink'
|
import UserLink from './UserLink'
|
||||||
import Vue from 'vue'
|
import Vue from 'vue'
|
||||||
Vue.component('user-link', UserLink)
|
Vue.component('user-link', UserLink)
|
||||||
|
Vue.component('report-link', ReportLink)
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'LogEntryMessage',
|
name: 'LogEntryMessage',
|
||||||
|
@ -38,14 +31,20 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
// logEntryMessageWithoutId() {
|
|
||||||
// return this.logEntryMessage.split(`#${this.subject.id}`)
|
|
||||||
// },
|
|
||||||
processedHtml() {
|
processedHtml() {
|
||||||
const html = [...this.message.matchAll(/\@(?<nickname>([\w-]+))/g)].map(res => res.groups.nickname)
|
const html = [...this.message.matchAll(/\@(?<nickname>([\w-]+))/g)].map(res => res.groups.nickname)
|
||||||
.reduce((acc, nickname) => {
|
.reduce((acc, nickname) => {
|
||||||
return acc.replace(`@${nickname}`, `<user-link actor="${nickname}"/>`)
|
return acc.replace(`@${nickname}`, `<user-link actor="${nickname}"/>`)
|
||||||
}, this.message)
|
}, this.message)
|
||||||
|
if (this.subject.type === 'report' && this.subject.id) {
|
||||||
|
const updatedHtml = [...html.matchAll(/\#(?<reportId>([\w]+))/g)].map(res => res.groups.reportId)
|
||||||
|
.reduce((acc, id) => {
|
||||||
|
return acc.replace(`#${id}`, `<report-link id="${id}"/>`)
|
||||||
|
}, html)
|
||||||
|
return {
|
||||||
|
template: '<div>' + updatedHtml + '</div>'
|
||||||
|
}
|
||||||
|
}
|
||||||
return {
|
return {
|
||||||
template: '<div>' + html + '</div>'
|
template: '<div>' + html + '</div>'
|
||||||
}
|
}
|
||||||
|
|
20
src/views/moderation_log/ReportLink.vue
Normal file
20
src/views/moderation_log/ReportLink.vue
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
<template>
|
||||||
|
<router-link
|
||||||
|
:to="{ name: 'ReportsShow', params: { id }}"
|
||||||
|
class="router-link">
|
||||||
|
<span style="font-weight: 600">#{{ id }}</span>
|
||||||
|
</router-link>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'UserLink',
|
||||||
|
props: {
|
||||||
|
id: {
|
||||||
|
type: String,
|
||||||
|
required: true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
|
@ -2,9 +2,7 @@
|
||||||
<router-link
|
<router-link
|
||||||
:to="{ name: 'UsersShow', params: { id: actor }}"
|
:to="{ name: 'UsersShow', params: { id: actor }}"
|
||||||
class="router-link">
|
class="router-link">
|
||||||
<span style="font-weight: 600;margin-right: -3px;">
|
<span style="font-weight: 600">@{{ actor }}</span>
|
||||||
@{{ actor }}
|
|
||||||
</span>
|
|
||||||
</router-link>
|
</router-link>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue