nexus/vuefilemanager
2
0
Fork 0
mirror of https://github.com/VueFileManager/vuefilemanager.git synced 2026-04-29 03:10:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

invoice admin page

Browse Source
This commit is contained in:
Čarodej
2021-11-24 16:57:03 +01:00
parent b447d2ea83
commit 8ff3b408cc
2 changed files with 112 additions and 184 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/mix-manifest.json
+23 -2
View File
@@ -49,7 +49,7 @@
"/chunks/homepage.js": "/chunks/homepage.js?id=b89dd81804b8a0bd3f0b",
"/chunks/installation-disclaimer.js": "/chunks/installation-disclaimer.js?id=1579259e826aa89fb00a",
"/chunks/invitation.js": "/chunks/invitation.js?id=c9cd3541ee362ae8d5f7",
"/chunks/invoices.js": "/chunks/invoices.js?id=2ab21de500ba46c3b968",
"/chunks/invoices.js": "/chunks/invoices.js?id=88e23f3ae68d1f756585",
"/chunks/my-shared-items.js": "/chunks/my-shared-items.js?id=ea129760157c8e44f324",
"/chunks/not-found.js": "/chunks/not-found.js?id=034287ee0ecb036320d3",
"/chunks/page-edit.js": "/chunks/page-edit.js?id=b0235e76cbd41a62a331",
@@ -306,5 +306,26 @@
"/chunks/settings-subscription.2d2377ef6c3afe3b2372.hot-update.js": "/chunks/settings-subscription.2d2377ef6c3afe3b2372.hot-update.js",
"/chunks/settings-subscription.fbdb601f69743346e1ac.hot-update.js": "/chunks/settings-subscription.fbdb601f69743346e1ac.hot-update.js",
"/chunks/settings-subscription.1b49f84be4621400e601.hot-update.js": "/chunks/settings-subscription.1b49f84be4621400e601.hot-update.js",
"/chunks/settings-subscription.b1058a810eac3ba8b2ff.hot-update.js": "/chunks/settings-subscription.b1058a810eac3ba8b2ff.hot-update.js"
"/chunks/settings-subscription.b1058a810eac3ba8b2ff.hot-update.js": "/chunks/settings-subscription.b1058a810eac3ba8b2ff.hot-update.js",
"/chunks/invoices.8584909f48b11f747374.hot-update.js": "/chunks/invoices.8584909f48b11f747374.hot-update.js",
"/chunks/invoices.96249a9564968485c7f6.hot-update.js": "/chunks/invoices.96249a9564968485c7f6.hot-update.js",
"/chunks/invoices.9fefd00f92997da11f24.hot-update.js": "/chunks/invoices.9fefd00f92997da11f24.hot-update.js",
"/chunks/invoices.fc99c14e7610d4715b8f.hot-update.js": "/chunks/invoices.fc99c14e7610d4715b8f.hot-update.js",
"/chunks/invoices.3169b9632902986f09da.hot-update.js": "/chunks/invoices.3169b9632902986f09da.hot-update.js",
"/chunks/invoices.3de0314ff9475547d344.hot-update.js": "/chunks/invoices.3de0314ff9475547d344.hot-update.js",
"/chunks/invoices.958f04e69981622f0233.hot-update.js": "/chunks/invoices.958f04e69981622f0233.hot-update.js",
"/chunks/invoices.3a2bb159fdc2919f33cb.hot-update.js": "/chunks/invoices.3a2bb159fdc2919f33cb.hot-update.js",
"/chunks/invoices.73f8b8dee70a4de5e2fb.hot-update.js": "/chunks/invoices.73f8b8dee70a4de5e2fb.hot-update.js",
"/chunks/invoices.0112adf4ef24586459bd.hot-update.js": "/chunks/invoices.0112adf4ef24586459bd.hot-update.js",
"/chunks/invoices.19b522815008e530d2dd.hot-update.js": "/chunks/invoices.19b522815008e530d2dd.hot-update.js",
"/chunks/invoices.6d4742a629d92e91126f.hot-update.js": "/chunks/invoices.6d4742a629d92e91126f.hot-update.js",
"/chunks/invoices.9f85192f0aaf7cd85094.hot-update.js": "/chunks/invoices.9f85192f0aaf7cd85094.hot-update.js",
"/chunks/invoices.d90604b775fff866759c.hot-update.js": "/chunks/invoices.d90604b775fff866759c.hot-update.js",
"/chunks/invoices.86952467d22ce34c864e.hot-update.js": "/chunks/invoices.86952467d22ce34c864e.hot-update.js",
"/chunks/invoices.171fb27bd240e5944022.hot-update.js": "/chunks/invoices.171fb27bd240e5944022.hot-update.js",
"/chunks/invoices.e0dc1f84c48c96190c8a.hot-update.js": "/chunks/invoices.e0dc1f84c48c96190c8a.hot-update.js",
"/chunks/invoices.5a782be7f767491658c3.hot-update.js": "/chunks/invoices.5a782be7f767491658c3.hot-update.js",
"/chunks/invoices.62eab272a85c044f88a6.hot-update.js": "/chunks/invoices.62eab272a85c044f88a6.hot-update.js",
"/chunks/invoices.3fdc85dd2dc704e90d41.hot-update.js": "/chunks/invoices.3fdc85dd2dc704e90d41.hot-update.js",
"/chunks/invoices.39ee24d1936c51f6cae1.hot-update.js": "/chunks/invoices.39ee24d1936c51f6cae1.hot-update.js"
}
resources/js/views/Admin/Invoices.vue
+89 -182
View File
@@ -1,71 +1,65 @@
<template>
<div id="single-page">
<!--Page Content-->
<div id="page-content" v-show="! isLoading && config.stripe_public_key">
<MobileHeader :title="$t($router.currentRoute.meta.title)"/>
<PageHeader :title="$t($router.currentRoute.meta.title)"/>
<div class="content-page" v-if="config.stripe_public_key">
<DatatableWrapper @data="invoices = $event" @init="isLoading = false" api="/api/admin/invoices" :paginator="false" :columns="columns" class="table">
<template slot-scope="{ row }">
<tr>
<td>
<a :href="$getInvoiceLink(row.data.attributes.customer, row.data.id)" target="_blank" class="cell-item">
{{ row.data.attributes.order }}
</a>
</td>
<td>
<span class="cell-item">
{{ row.data.attributes.total }}
</span>
</td>
<td>
<span class="cell-item">
{{ row.data.attributes.bag.description }}
</span>
</td>
<td>
<span class="cell-item">
{{ row.data.attributes.created_at_formatted }}
</span>
</td>
<td>
<router-link v-if="row.relationships" :to="{name: 'UserInvoices', params: {id: row.relationships.user.data.id}}">
<DatatableCellImage
image-size="small"
:image="row.relationships.user.data.attributes.avatar.sm"
:title="row.relationships.user.data.attributes.name"
/>
</router-link>
<span v-else class="cell-item">
-
</span>
</td>
<td>
<div class="action-icons">
<a :href="$getInvoiceLink(row.data.attributes.customer, row.data.id)" target="_blank">
<external-link-icon size="15" class="icon"></external-link-icon>
</a>
</div>
</td>
</tr>
</template>
</DatatableWrapper>
</div>
</div>
<div>
<PageTab :is-loading="isLoading">
<div class="card shadow-card">
<DatatableWrapper
@init="isLoading = false"
api="/api/subscription/transactions"
:paginator="true"
:columns="columns"
>
<template slot-scope="{ row }">
<tr style="border-bottom: 1px dashed #f3f3f3;">
<td class="py-3">
<!--Todo: refactor this component-->
<DatatableCellImage
:member="row.data.relationships.user"
:title="row.data.relationships.user.data.attributes.name"
:description="row.data.relationships.user.data.attributes.email"
/>
</td>
<td class="py-4">
<span class="text-sm font-bold">
{{ row.data.attributes.plan_name }}
</span>
</td>
<td>
<ColorLabel color="purple">
{{ row.data.attributes.status }}
</ColorLabel>
</td>
<td>
<span class="text-sm font-bold">
{{ row.data.attributes.price }}
</span>
</td>
<td>
<span class="text-sm font-bold">
{{ row.data.attributes.created_at }}
</span>
</td>
<td class="text-right">
<span class="text-sm font-bold w-full">
{{ row.data.attributes.driver }}
</span>
</td>
</tr>
</template>
</DatatableWrapper>
</div>
</PageTab>
<!--Empty invoices-->
<EmptyPageContent
<!--<EmptyPageContent
v-if="! isLoading && invoices.length === 0 && config.stripe_public_key"
icon="file-text"
:title="$t('admin_page_invoices.empty.title')"
:description="$t('admin_page_invoices.empty.description')"
>
</EmptyPageContent>
</EmptyPageContent>-->
<!--Stripe Not Configured-->
<EmptyPageContent
<!--<EmptyPageContent
v-if="! config.stripe_public_key"
icon="settings"
:title="$t('activation.stripe.title')"
@@ -74,7 +68,7 @@
<router-link :to="{name: 'AppPayments'}">
<ButtonBase button-style="theme">{{ $t('activation.stripe.button') }}</ButtonBase>
</router-link>
</EmptyPageContent>
</EmptyPageContent>-->
<!--Spinner-->
<div id="loader" v-if="isLoading">
@@ -84,6 +78,7 @@
</template>
<script>
import PageTab from "../../components/Others/Layout/PageTab";
import DatatableCellImage from '/resources/js/components/Others/Tables/DatatableCellImage'
import DatatableWrapper from '/resources/js/components/Others/Tables/DatatableWrapper'
import MobileActionButton from '/resources/js/components/FilesView/MobileActionButton'
@@ -113,46 +108,49 @@
PageHeader,
ButtonBase,
ColorLabel,
PageTab,
Spinner,
},
computed: {
...mapGetters(['config']),
...mapGetters([
'config'
]),
},
data() {
return {
isLoading: true,
invoices: [],
columns: [
{
label: this.$t('admin_page_invoices.table.number'),
field: 'data.attributes.order',
sortable: false
},
{
label: this.$t('admin_page_invoices.table.total'),
field: 'data.attributes.bag.amount',
sortable: false
},
{
label: this.$t('admin_page_invoices.table.plan'),
field: 'data.attributes.bag.amount',
sortable: false
},
{
label: this.$t('admin_page_invoices.table.payed'),
field: 'data.attributes.created_at',
sortable: false
},
{
label: this.$t('admin_page_invoices.table.user'),
field: 'relationships.user.data.attributes.name',
sortable: false
},
{
label: this.$t('admin_page_user.table.action'),
sortable: false
},
],
columns: [
{
label: this.$t('User'),
field: 'user',
sortable: true
},
{
label: this.$t('Plan'),
field: 'plan_name',
sortable: true
},
{
label: this.$t('Status'),
field: 'status',
sortable: true
},
{
label: this.$t('admin_page_invoices.table.total'),
field: 'amount',
sortable: true
},
{
label: this.$t('Payed At'),
field: 'created_at',
sortable: true
},
{
label: this.$t('Service'),
sortable: true
},
],
}
},
created() {
@@ -166,95 +164,4 @@
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.user-thumbnail {
display: flex;
align-items: center;
cursor: pointer;
.avatar {
margin-right: 20px;
line-height: 0;
img {
line-height: 0;
width: 48px;
height: 48px;
border-radius: 8px;
}
}
.info {
.name {
max-width: 150px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
display: block;
}
.name {
@include font-size(15);
line-height: 1;
}
}
}
.table-tools {
background: white;
display: flex;
justify-content: space-between;
padding: 15px 0 10px;
position: sticky;
top: 40px;
z-index: 9;
}
.table {
.cell-item {
@include font-size(15);
white-space: nowrap;
}
.name {
font-weight: 700;
cursor: pointer;
}
}
@media only screen and (max-width: 690px) {
.table-tools {
padding: 0 0 5px;
}
}
.dark {
.table-tools {
background: $dark_mode_background;
}
.action-icons {
.icon {
cursor: pointer;
circle, path, line, polyline {
stroke: $dark_mode_text_primary;
}
}
}
.user-thumbnail {
.info {
.email {
color: $dark_mode_text_secondary;
}
}
}
}
</style>