Viewing file:  top-persons.blade.php (4.31 KB) -rw-rw-rw-
Select action/file-type:
 (+) |  (+) |  (+) | Code (+) | Session (+) |  (+) | SDB (+) |  (+) |  (+) |  (+) |  (+) |  (+) |
{!! view_render_event('admin.dashboard.index.top_persons.before') !!}
<!-- Top Selling Products Vue Component -->
<v-dashboard-top-persons>
<!-- Shimmer -->
<x-admin::shimmer.dashboard.index.top-persons />
</v-dashboard-top-persons>
{!! view_render_event('admin.dashboard.index.top_persons.after') !!}
@pushOnce('scripts')
<script
type="text/x-template"
id="v-dashboard-top-persons-template"
>
<!-- Shimmer -->
<template v-if="isLoading">
<x-admin::shimmer.dashboard.index.top-persons />
</template>
<!-- Total Sales Section -->
<template v-else>
<div class="w-full rounded-lg border border-gray-200 bg-white dark:border-gray-800 dark:bg-gray-900">
<div class="flex items-center justify-between p-4">
<p class="text-base font-semibold text-gray-600 dark:text-gray-300">
@lang('admin::app.dashboard.index.top-persons.title')
</p>
</div>
<!-- Top Selling Products Details -->
<div
class="flex flex-col"
v-if="report.statistics.length"
>
<a
:href="`{{route('admin.contacts.persons.view', '')}}/${item.id}`"
class="flex gap-2.5 border-b p-4 transition-all last:border-b-0 hover:bg-gray-50 dark:border-gray-800 dark:hover:bg-gray-950"
target="_blank"
v-for="item in report.statistics"
>
<!-- Person Initials -->
<x-admin::avatar ::name="item.name" />
<!-- Person Details -->
<div class="flex flex-col gap-1">
<p class="font-medium text-gray-800 dark:text-white">@{{ item.name }}</p>
<p class="font-normal text-gray-800 dark:text-white">@{{ item.emails.map(item => item.value).join(', ') }}</p>
</div>
</a>
</div>
<!-- Empty Product Design -->
<div
class="flex flex-col gap-8 p-4"
v-else
>
<div class="grid justify-center justify-items-center gap-3.5 py-2.5">
<!-- Placeholder Image -->
<img
src="{{ vite()->asset('images/empty-placeholders/users.svg') }}"
class="dark:mix-blend-exclusion dark:invert"
>
<!-- Add Variants Information -->
<div class="flex flex-col items-center">
<p class="text-base font-semibold text-gray-400">
@lang('admin::app.dashboard.index.top-persons.empty-title')
</p>
<p class="text-gray-400">
@lang('admin::app.dashboard.index.top-persons.empty-info')
</p>
</div>
</div>
</div>
</div>
</template>
</script>
<script type="module">
app.component('v-dashboard-top-persons', {
template: '#v-dashboard-top-persons-template',
data() {
return {
report: [],
isLoading: true,
}
},
mounted() {
this.getStats({});
this.$emitter.on('reporting-filter-updated', this.getStats);
},
methods: {
getStats(filters) {
this.isLoading = true;
var filters = Object.assign({}, filters);
filters.type = 'top-persons';
this.$axios.get("{{ route('admin.dashboard.stats') }}", {
params: filters
})
.then(response => {
this.report = response.data;
this.isLoading = false;
})
.catch(error => {});
}
}
});
</script>
@endPushOnce
|