Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update audit logs tags #156

Merged
merged 3 commits into from
Feb 19, 2025
Merged

Update audit logs tags #156

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
cbe911b
update-en.json
juanbroder24 Feb 17, 2025
92bb6c8
fix comments
juanbroder24 Feb 18, 2025
69ade98
Update auditLog.vue
juanbroder24 Feb 19, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
252 changes: 146 additions & 106 deletions resources/assets/js/pages/content/auditLog.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,65 +2,63 @@
<b-container fluid>
<page-banner>
<b-col>
<h1 class="sec-title">{{ $t('content.audit_log.my_audit_log') }}</h1>
<h1>{{ $t('content.audit_log.audit_log') }}</h1>
</b-col>
<b-col>
<b-button class="float-right rtl-float-left mr-2 rtl-ml-2 btn-outline-primary" prop='link' href="/api/organisations/instructions/export" v-if="can(user, permissions.USERS_CREATE)" @click="$fireGTEvent($gtagEvents.DownloadAuditLogReport)">
<b-button size="lg" variant="dark" class="float-right rtl-float-left mr-2 rtl-ml-2" prop='link' href="/api/organisations/instructions/export" v-if="can(user, permissions.USERS_CREATE)" @click="$fireGTEvent($gtagEvents.DownloadAuditLogReport)">
{{ $t('users.list.download_report') }}
</b-button>
</b-col>
</page-banner>

<b-row class="pb-2 px-4 pt-4 bg-white" align-v="center">
<b-col cols="3">
<p class="select-header" v-if="!apiUsers"> {{ $t('content.audit_log.select_hazard') }}</p>
<SelectHazardType class="bg-white" v-model="hazardTypeFilter" :hazardTypeList="filteredHazardsList"></SelectHazardType>
</b-col>
<b-col cols="3">
<p class="select-header" v-if="!apiUsers"> {{ $t('content.audit_log.select_language') }}</p>
<v-select
:dir="isLangRTL(locale) ? 'rtl' : 'ltr'"
v-model="languageFilter"
class="w-100 v-select-custom"
:options="filteredLanguages"
label="text" :disabled="filteredLanguages.length === 0"
:placeholder="$t('content.whatnow.select_language')">
<template slot="option" slot-scope="option">
<div class="ml-2 rtl-mr-2 dropdown-option">
{{ option.text }}
</div>
</template>
<template slot="selected-option" slot-scope="option">
<div class="ml-2 rtl-mr-2 dropdown-option">
{{ option.text }}
</div>
</template>
</v-select>
</b-col>
<b-col cols="3">
<p class="select-header" v-if="!apiUsers"> {{ $t('content.audit_log.select_soc') }}</p>
<selectSociety
:selected.sync="selectedSoc"
:staynull="true" />
</b-col>
<b-col cols="3">
<b-button @click="clearFilters" :disabled="noFilters" class="float-right rtl-float-left btn-outline-primary">
{{ $t('users.list.clear_filters') }}
</b-button>
</b-col>
</b-row>
<b-row class="pb-2 px-4 pt-4 bg-white" align-v="center">
<b-col cols="3">
<SelectHazardType class="bg-white" v-model="hazardTypeFilter" :hazardTypeList="filteredHazardsList"></SelectHazardType>
</b-col>
<b-col cols="3">
<v-select
:dir="isLangRTL(locale) ? 'rtl' : 'ltr'"
v-model="languageFilter"
class="w-100 styled-select"
:options="filteredLanguages"
label="text" :disabled="filteredLanguages.length === 0"
:placeholder="$t('content.whatnow.select_language')">
<template slot="option" slot-scope="option">
<div class="ml-2 rtl-mr-2 dropdown-option">
{{ option.text }}
</div>
</template>
<template slot="selected-option" slot-scope="option">
<div class="ml-2 rtl-mr-2 dropdown-option">
{{ option.text }}
</div>
</template>
</v-select>
</b-col>
<b-col cols="3">
<selectSociety
:selected.sync="selectedSoc"
:staynull="true" />
</b-col>
<b-col cols="3">
<b-button size="sm" variant="dark" @click="clearFilters" :disabled="noFilters" class="float-right rtl-float-left">
{{ $t('users.list.clear_filters') }}
</b-button>
</b-col>
</b-row>

<b-row class="pl-4 pr-4 pb-4 pt-4 bg-white">
<b-col v-if="auditsAvailable">
<table-loading :loading="fetchingAudits"></table-loading>
<b-table hover
:items="audits.data"
:fields="fields"
:perPage="audits.meta.per_page"
:show-empty="false"
no-local-sorting
:sort-by.sync="orderBy"
:sort-desc.sync="sortDesc">
:items="audits.data"
:fields="fields"
:perPage="audits.meta.per_page"
:show-empty="false"
no-local-sorting
:sort-by.sync="orderBy"
:sort-desc.sync="sortDesc"
@sort-changed="onSortChanged">
<template #cell(user)="data">
<div v-if="data.item.user">
<b-img v-if="data.item.user.user_profile.photo_url" :src="data.item.user.user_profile.photo_url" width="20" height="20" rounded="circle" alt="" role="presentation"></b-img>
Expand All @@ -75,15 +73,36 @@
<template #cell(country_code)="data">
{{ getSocietyByCode(data.item.country_code) }}
</template>
<template #cell(created_at)="data">
{{ data.item.created_at | moment("MM/DD/YY HH:mm:ss") }}
<template #cell(language_code)="data">
{{ data.item.language_code }}
</template>
<template #cell(content)="data">
{{ data.item.content }}
</template>
<template #cell(actions)="data">
<b-button v-if="data.item.entity_id" class="mb-1 new-btn" @click="viewChanges(data.item)" :to="{ name: '', params: {} }"> {{ $t('common.view_content') }} </b-button>
<template #cell(action)="data">
<div class="d-flex justify-content-between align-items-center">
<b-badge v-if="data.item.action === 'Created content'" class="custom-badge custom-badge-hazard-create">
<span>{{ $t('badges.hazardCreate') }}</span>
<span>{{ data.item.created_at | moment("MM/DD/YY HH:mm") }}</span>
</b-badge>
<b-badge v-else-if="data.item.action === 'Published a content translation'" class="custom-badge custom-badge-published">
<span>{{ $t('badges.published') }}</span>
<span>{{ data.item.created_at | moment("MM/DD/YY HH:mm") }}</span>
</b-badge>
<b-badge v-else-if="data.item.action === 'Updated content'" class="custom-badge custom-badge-draft">
<span>{{ $t('badges.draft') }}</span>
<span>{{ data.item.created_at | moment("MM/DD/YY HH:mm") }}</span>
</b-badge>
<b-badge v-else-if="data.item.action === 'Bulk upload draft'" class="custom-badge custom-badge-bulk-upload-draft">
<span>{{ $t('badges.bulkUploadDraft') }}</span>
<span>{{ data.item.created_at | moment("MM/DD/YY HH:mm") }}</span>
</b-badge>
<span v-else>{{ data.item.action }}</span>
</div>
<span class="d-none">{{ data.item.created_at }}</span>
</template>
</b-table>
<b-pagination

v-if="audits.meta.total > audits.meta.per_page"
size="md"
:total-rows="audits.meta.total"
Expand All @@ -97,7 +116,6 @@
</b-col>
<b-col v-else>
{{ $t('common.loading')}}
<!-- Throw in a spooky boi here -->
</b-col>
</b-row>
</b-container>
Expand All @@ -113,6 +131,7 @@ import Avatar from 'vue-avatar'
import SelectSociety from '~/pages/content/selectSociety'
import SelectHazardType from '~/pages/content/simpleHazardTypePicker'


const fetchHandler = {
handler (val, oldVal) {
if (val !== oldVal) {
Expand All @@ -135,15 +154,13 @@ export default {
data () {
return {
permissions: permissionsList,
test: 'sgdfg',
fields: [
{ key: 'user', sortable: true, tdClass: 'align-middle' },
{ key: 'action', sortable: true },
{ key: 'content', sortable: true },
{ key: 'language_code', sortable: true },
{ key: 'country_code', sortable: true, label: this.$t('content.audit_log.soc_label') },
{ key: 'created_at', sortable: true },
{ key: 'actions', sortable: false }
{ key: 'user', sortable: true, tdClass: 'align-middle' },
{ key: 'country_code', sortable: true, label: this.$t('content.audit_log.soc_label') },
{ key: 'language_code', sortable: true },
{ key: 'content', sortable: true },
{ key: 'action', sortable: true },

],
currentPage: 1,
fetchingAudits: false,
Expand Down Expand Up @@ -200,44 +217,33 @@ export default {
this.$noty.error(this.$t('error_alert_text'))
}
},
async fetchAudits () {
this.fetchingAudits = true
if (this.userId) {
try {
await this.$store.dispatch('audit/fetchUserAudits',
{
page: this.currentPage,
filters: {
content: this.hazardTypeFilter,
country_code: this.selectedSoc ? this.selectedSoc.countryCode : null,
language_code: this.languageFilter
},
orderBy: this.orderBy,
sort: this.sortDesc ? 'desc' : 'asc',
userId: this.userId
})
} catch (e) {
this.$noty.error(this.$t('error_alert_text'))
}
} else {
try {
await this.$store.dispatch('audit/fetchAudits',
{
page: this.currentPage,
filters: {
content: this.hazardTypeFilter,
country_code: this.selectedSoc ? this.selectedSoc.countryCode : null,
language_code: this.languageFilter
},
orderBy: this.orderBy,
sort: this.sortDesc ? 'desc' : 'asc'
})
} catch (e) {
this.$noty.error(this.$t('error_alert_text'))
async fetchAudits() {
this.fetchingAudits = true;
const filters = {
content: this.hazardTypeFilter,
country_code: this.selectedSoc ? this.selectedSoc.countryCode : null,
language_code: this.languageFilter
};
const params = {
page: this.currentPage,
filters,
orderBy: this.orderBy,
sort: this.sortDesc ? 'desc' : 'asc'
};
try {
if (this.userId) {
await this.$store.dispatch('audit/fetchUserAudits', { ...params, userId: this.userId });
} else {
await this.$store.dispatch('audit/fetchAudits', params);
}
} catch (e) {
this.$noty.error(this.$t('error_alert_text'));
} finally {
this.fetchingAudits = false;
}
this.fetchingAudits = false
},

async fetchOrganisations () {
try {
await this.$store.dispatch('content/fetchOrganisations')
Expand All @@ -258,6 +264,16 @@ export default {
const soc = this.societies.find(soc => soc.countryCode === code)
return soc ? soc.name : code
},
onSortChanged(ctx) {
if (ctx.sortBy === 'action') {
this.orderBy = 'created_at';
this.sortDesc = ctx.sortDesc;
} else {
this.orderBy = ctx.sortBy;
this.sortDesc = ctx.sortDesc;
}
this.fetchAudits();
},
setLocalStorage () {
if (this.selectedSoc) {
localStorage.setItem('soc', this.selectedSoc.countryCode)
Expand All @@ -266,6 +282,7 @@ export default {
}
}
},

computed: {
filteredHazardsList () {
const alphabeticalHazardList = [...this.hazardsList].sort((a, b) => a.name.localeCompare(b.name))
Expand Down Expand Up @@ -303,19 +320,42 @@ export default {
societies: 'content/organisations'
})
}

}
</script>
<style>
td {
div {
div {
background: #F6333F;
color: white;
}
}
<style scoped>
.custom-badge {
width: 100%;
height: 30px;
border-radius: 15px;
font: 500 16px/30px 'Poppins', sans-serif;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 8px;
border: 2px solid;
}

.custom-badge-published {
background: #E6FEDF;
border-color: #21A656;
color: #21A656;
}

.custom-badge-hazard-create {
background: #FEDEEC;
border-color: #F6333F;
color: #F6333F;
}

.custom-badge-bulk-upload-draft {
background: #C8E4F7;
border: 3px solid #4288B8;
color: #4288B8;
}
.select-header {
font-size: 1rem;

.custom-badge-draft {
background: #FFF8CA;
border-color: #E56A2D;
color: #E56A2D;
}
</style>
6 changes: 6 additions & 0 deletions resources/lang/en.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -868,5 +868,11 @@
"terms_conditions": {
"title": "Terms and Conditions",
"accept": "Accept"
},
"badges": {
"hazardCreate": "Hazard Created",
"published": "Published",
"draft": "Draft",
"bulkUploadDraft": "Bulk Upload Draft"
}
}