Admin menu refactored

public/mix-manifest.json

@@ -2,7 +2,7 @@
     "/js/main.js": "/js/main.js",
     "/css/app.css": "/css/app.css",
     "/css/tailwind.css": "/css/tailwind.css",
-    "/chunks/admin.js": "/chunks/admin.js?id=c429b52ae033a73d8889",
+    "/chunks/admin.js": "/chunks/admin.js?id=7bbe7606c72cadb63541",
     "/chunks/admin-account.js": "/chunks/admin-account.js?id=c83a81863882b9478feb",
     "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~640155e3.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~640155e3.js?id=0da5779ae51439de762d",
     "/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/~5c92142b.js": "/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/~5c92142b.js?id=64515032580a7453047f",
@@ -18,20 +18,20 @@
     "/chunks/app-appearance.js": "/chunks/app-appearance.js?id=8c2056d19d6d40d79cb7",
     "/chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chunks/app-others~chunks~217928f6.js": "/chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chunks/app-others~chunks~217928f6.js?id=9c4d17d768dc543a0e4b",
     "/chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chunks/app-others~chunks~5acee76d.js": "/chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chunks/app-others~chunks~5acee76d.js?id=9dd101339ae6d85c6175",
-    "/chunks/app-billings.js": "/chunks/app-billings.js?id=0b9e00dadb7da594ac06",
+    "/chunks/app-billings.js": "/chunks/app-billings.js?id=64591dd92c7491cc0301",
     "/chunks/app-email.js": "/chunks/app-email.js?id=e03724a7c525acdc90ad",
     "/chunks/app-index.js": "/chunks/app-index.js?id=25af79d14fabd8f41c59",
     "/chunks/app-language.js": "/chunks/app-language.js?id=7c280e4c945a9650e6a4",
     "/chunks/app-language~chunks/dashboard~chunks/files~chunks/invoices~chunks/my-shared-items~chunks/page~8729b0a3.js": "/chunks/app-language~chunks/dashboard~chunks/files~chunks/invoices~chunks/my-shared-items~chunks/page~8729b0a3.js?id=50f7067283a882b798bd",
     "/chunks/app-language~chunks/dashboard~chunks/invoices~chunks/page-edit~chunks/pages~chunks/plan-creat~d6def0d7.js": "/chunks/app-language~chunks/dashboard~chunks/invoices~chunks/page-edit~chunks/pages~chunks/plan-creat~d6def0d7.js?id=a1836cdd057c0e63adc0",
     "/chunks/app-others.js": "/chunks/app-others.js?id=ed899e0c8ae8aa1c7741",
-    "/chunks/app-payments.js": "/chunks/app-payments.js?id=c4b0f4ff26c5cd71b496",
+    "/chunks/app-payments.js": "/chunks/app-payments.js?id=a5896a34397b241f5a0b",
-    "/chunks/app-settings.js": "/chunks/app-settings.js?id=5968eed91e41e99efd4c",
+    "/chunks/app-settings.js": "/chunks/app-settings.js?id=9f32e2eac79ad8bbb20d",
     "/chunks/app-setup.js": "/chunks/app-setup.js?id=c3a013b11ae7bde6f39d",
     "/chunks/app-setup~chunks/billings-detail~chunks/create-new-password~chunks/database~chunks/email-veri~2c1222b7.js": "/chunks/app-setup~chunks/billings-detail~chunks/create-new-password~chunks/database~chunks/email-veri~2c1222b7.js?id=5963f5d9fb4e759c600a",
     "/chunks/billing.js": "/chunks/billing.js?id=e347404996d654547aa1",
     "/chunks/billings-detail.js": "/chunks/billings-detail.js?id=ad632d6f7e088dab55a3",
-    "/chunks/billing~chunks/dashboard~chunks/invoices~chunks/pages~chunks/plan-subscribers~chunks/plans~ch~5d1c5841.js": "/chunks/billing~chunks/dashboard~chunks/invoices~chunks/pages~chunks/plan-subscribers~chunks/plans~ch~5d1c5841.js?id=9b836534302d97ac5c73",
+    "/chunks/billing~chunks/dashboard~chunks/invoices~chunks/pages~chunks/plan-subscribers~chunks/plans~ch~5d1c5841.js": "/chunks/billing~chunks/dashboard~chunks/invoices~chunks/pages~chunks/plan-subscribers~chunks/plans~ch~5d1c5841.js?id=7f4f6379b4262b4f9486",
     "/chunks/billing~chunks/settings-storage~chunks/user-storage~chunks/user-subscription.js": "/chunks/billing~chunks/settings-storage~chunks/user-storage~chunks/user-subscription.js?id=3f0a914bca8e3106d9ce",
     "/chunks/contact-us.js": "/chunks/contact-us.js?id=b3feaa361fc486e6a0b3",
     "/chunks/contact-us~chunks/dynamic-page~chunks/homepage.js": "/chunks/contact-us~chunks/dynamic-page~chunks/homepage.js?id=65ee559ca803555be568",
@@ -813,5 +813,64 @@
     "/chunks/plan.0c8d4a81a2aa99d4079f.hot-update.js": "/chunks/plan.0c8d4a81a2aa99d4079f.hot-update.js",
     "/chunks/plan.2b32d62cd4711a46f1bd.hot-update.js": "/chunks/plan.2b32d62cd4711a46f1bd.hot-update.js",
     "/chunks/plan.872c79d6415d66c43bde.hot-update.js": "/chunks/plan.872c79d6415d66c43bde.hot-update.js",
-    "/chunks/plan.74e9e37c0694609d6373.hot-update.js": "/chunks/plan.74e9e37c0694609d6373.hot-update.js"
+    "/chunks/plan.74e9e37c0694609d6373.hot-update.js": "/chunks/plan.74e9e37c0694609d6373.hot-update.js",
+    "/chunks/admin.dd0d8659080c3a20075b.hot-update.js": "/chunks/admin.dd0d8659080c3a20075b.hot-update.js",
+    "/chunks/admin.08881b4f4b6a00662557.hot-update.js": "/chunks/admin.08881b4f4b6a00662557.hot-update.js",
+    "/chunks/admin.b910126b0be9de885e22.hot-update.js": "/chunks/admin.b910126b0be9de885e22.hot-update.js",
+    "/chunks/admin.0eea77257eede5e9ffe0.hot-update.js": "/chunks/admin.0eea77257eede5e9ffe0.hot-update.js",
+    "/chunks/admin.61ffa7fc5fac4ae1ca18.hot-update.js": "/chunks/admin.61ffa7fc5fac4ae1ca18.hot-update.js",
+    "/chunks/admin.f472077d4df9c2042c7f.hot-update.js": "/chunks/admin.f472077d4df9c2042c7f.hot-update.js",
+    "/chunks/admin.af37bf7a3d344c6aa988.hot-update.js": "/chunks/admin.af37bf7a3d344c6aa988.hot-update.js",
+    "/chunks/admin.669daff5cd0709731340.hot-update.js": "/chunks/admin.669daff5cd0709731340.hot-update.js",
+    "/chunks/admin.4224301098c0f1f1b100.hot-update.js": "/chunks/admin.4224301098c0f1f1b100.hot-update.js",
+    "/chunks/admin.395d2c8051fee30a7ccc.hot-update.js": "/chunks/admin.395d2c8051fee30a7ccc.hot-update.js",
+    "/js/main.e5a1be664afb8af28d94.hot-update.js": "/js/main.e5a1be664afb8af28d94.hot-update.js",
+    "/chunks/app-settings.bf1e28d091a5695ed662.hot-update.js": "/chunks/app-settings.bf1e28d091a5695ed662.hot-update.js",
+    "/js/main.9481958978e17fd4b551.hot-update.js": "/js/main.9481958978e17fd4b551.hot-update.js",
+    "/chunks/payments.js": "/chunks/payments.js?id=6562296f56d88290c737",
+    "/chunks/admin.76a1c6f0c51d0331a666.hot-update.js": "/chunks/admin.76a1c6f0c51d0331a666.hot-update.js",
+    "/chunks/admin.d79c9eb3e119d6c9c4e7.hot-update.js": "/chunks/admin.d79c9eb3e119d6c9c4e7.hot-update.js",
+    "/chunks/admin.e401ff71e803d3268f32.hot-update.js": "/chunks/admin.e401ff71e803d3268f32.hot-update.js",
+    "/js/main.44386fa80b68e46c7491.hot-update.js": "/js/main.44386fa80b68e46c7491.hot-update.js",
+    "/js/main.9b8d0a907fffc75ce408.hot-update.js": "/js/main.9b8d0a907fffc75ce408.hot-update.js",
+    "/chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app-others~chunk~517ae05e.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app-others~chunk~517ae05e.js?id=0c7c7f68f71d14599378",
+    "/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app~a73f9995.js": "/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app~a73f9995.js?id=1d77095588fc9032b77c",
+    "/chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app-others~chunks/plan-subscribers~ch~4af4caab.js": "/chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app-others~chunks/plan-subscribers~ch~4af4caab.js?id=310cbce6b16a3c40219a",
+    "/chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app-others~chunks/user-delete~chunks/~fea8767e.js": "/chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app-others~chunks/user-delete~chunks/~fea8767e.js?id=9ea033a5839c27f81810",
+    "/chunks/app-billings.9b8d0a907fffc75ce408.hot-update.js": "/chunks/app-billings.9b8d0a907fffc75ce408.hot-update.js",
+    "/chunks/app-payments.9b8d0a907fffc75ce408.hot-update.js": "/chunks/app-payments.9b8d0a907fffc75ce408.hot-update.js",
+    "/chunks/billing.9b8d0a907fffc75ce408.hot-update.js": "/chunks/billing.9b8d0a907fffc75ce408.hot-update.js",
+    "/chunks/dashboard~chunks/invoices~chunks/pages~chunks/plans~chunks/subscriptions.9b8d0a907fffc75ce408.hot-update.js": "/chunks/dashboard~chunks/invoices~chunks/pages~chunks/plans~chunks/subscriptions.9b8d0a907fffc75ce408.hot-update.js",
+    "/chunks/plan-subscribers.9b8d0a907fffc75ce408.hot-update.js": "/chunks/plan-subscribers.9b8d0a907fffc75ce408.hot-update.js",
+    "/chunks/user-subscription.9b8d0a907fffc75ce408.hot-update.js": "/chunks/user-subscription.9b8d0a907fffc75ce408.hot-update.js",
+    "/chunks/users.9b8d0a907fffc75ce408.hot-update.js": "/chunks/users.9b8d0a907fffc75ce408.hot-update.js",
+    "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~ch~8ec948cb.js": "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~ch~8ec948cb.js?id=8d8849eb176546f5cafa",
+    "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~ch~cf66c720.js": "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~ch~cf66c720.js?id=82cbdca383089dbce121",
+    "/js/main.71865825db5c6a5d71c5.hot-update.js": "/js/main.71865825db5c6a5d71c5.hot-update.js",
+    "/chunks/app-billings.71865825db5c6a5d71c5.hot-update.js": "/chunks/app-billings.71865825db5c6a5d71c5.hot-update.js",
+    "/chunks/app-others.71865825db5c6a5d71c5.hot-update.js": "/chunks/app-others.71865825db5c6a5d71c5.hot-update.js",
+    "/chunks/app-payments.71865825db5c6a5d71c5.hot-update.js": "/chunks/app-payments.71865825db5c6a5d71c5.hot-update.js",
+    "/js/main.f122fb20dbdb28dd1c58.hot-update.js": "/js/main.f122fb20dbdb28dd1c58.hot-update.js",
+    "/chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app-others~chunk~dc6e8a00.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app-others~chunk~dc6e8a00.js?id=f049ad891b0e8f4cc341",
+    "/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app~94e76db9.js": "/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app~94e76db9.js?id=f56ffda4b0845d24937a",
+    "/chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app-others~chunks/payments/billings~c~2e3ef882.js": "/chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app-others~chunks/payments/billings~c~2e3ef882.js?id=1c078cc06918dc596021",
+    "/chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app-others~chunks/payments/billings~c~405655f2.js": "/chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app-others~chunks/payments/billings~c~405655f2.js?id=fd6b24257ae43fc6f714",
+    "/chunks/app-others~chunks/payments/payments.js": "/chunks/app-others~chunks/payments/payments.js?id=08c5d873856367974a69",
+    "/chunks/billing~chunks/dashboard~chunks/invoices~chunks/pages~chunks/payments/payments~chunks/plan-su~1a008bd0.js": "/chunks/billing~chunks/dashboard~chunks/invoices~chunks/pages~chunks/payments/payments~chunks/plan-su~1a008bd0.js?id=20d02195b7ae21b9e5be",
+    "/chunks/payments/billings.js": "/chunks/payments/billings.js?id=5d27194aaaeb808207a9",
+    "/chunks/payments/payments.js": "/chunks/payments/payments.js?id=ae9a762f515cb9bcc001",
+    "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~ch~9e3ca256.js": "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~ch~9e3ca256.js?id=31803b6edbad3d1eb1da",
+    "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~ch~f5cdcb60.js": "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~ch~f5cdcb60.js?id=b1823c7f82564c353243",
+    "/chunks/admin.17bb4eabe2863741cbbd.hot-update.js": "/chunks/admin.17bb4eabe2863741cbbd.hot-update.js",
+    "/chunks/admin.31788bec1b95c2fe638b.hot-update.js": "/chunks/admin.31788bec1b95c2fe638b.hot-update.js",
+    "/js/main.50cba0fda3961884afc1.hot-update.js": "/js/main.50cba0fda3961884afc1.hot-update.js",
+    "/chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app-others~chunk~9f5cf693.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app-others~chunk~9f5cf693.js?id=555f19ed636d261670e7",
+    "/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app~f4e3acb1.js": "/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app~f4e3acb1.js?id=08ee54ab4c19d49dc342",
+    "/chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app-others~chunks/payments/billings~c~45d16af9.js": "/chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app-others~chunks/payments/billings~c~45d16af9.js?id=a4b9a9a416c656f4d95d",
+    "/chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app-others~chunks/payments/billings~c~fdb7bddc.js": "/chunks/app-appearance~chunks/app-email~chunks/app-index~chunks/app-others~chunks/payments/billings~c~fdb7bddc.js?id=c5ac05de67d02437f154",
+    "/chunks/app-others~chunks/payments/settings.js": "/chunks/app-others~chunks/payments/settings.js?id=699b3df59133d2f56399",
+    "/chunks/billing~chunks/dashboard~chunks/invoices~chunks/pages~chunks/payments/settings~chunks/plan-su~cdf8788b.js": "/chunks/billing~chunks/dashboard~chunks/invoices~chunks/pages~chunks/payments/settings~chunks/plan-su~cdf8788b.js?id=d56f3c7df8d8dd9caaaf",
+    "/chunks/payments/settings.js": "/chunks/payments/settings.js?id=224245106718ef9d4128",
+    "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~ch~7523d900.js": "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~ch~7523d900.js?id=02104d6d78a8ffe97c12",
+    "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~ch~d86004d6.js": "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-email~chunks/app-index~ch~d86004d6.js?id=b40f5f673ec2ab7de20b"
 }

resources/js/routes/routesAdmin.js

@@ -254,6 +254,38 @@ const routesAdmin = [
 					},
 				]
 			},
+			{
+				name: 'PaymentSettings',
+				path: '/admin/payments',
+				component: () =>
+					import(/* webpackChunkName: "chunks/payments" */ '../views/Admin/PaymentSettings/PaymentSettings'),
+				meta: {
+					requiresAuth: true,
+					title: 'Payment Settings'
+				},
+				children: [
+					{
+						name: 'AppBillings',
+						path: '/admin/settings/billings',
+						component: () =>
+							import(/* webpackChunkName: "chunks/payments/billings" */ '../views/Admin/PaymentSettings/PaymentSettingsTab/Billings'),
+						meta: {
+							requiresAuth: true,
+							title: 'routes_title.billings'
+						},
+					},
+					{
+						name: 'AppPayments',
+						path: '/admin/settings/payments',
+						component: () =>
+							import(/* webpackChunkName: "chunks/payments/settings" */ '../views/Admin/PaymentSettings/PaymentSettingsTab/Payments'),
+						meta: {
+							requiresAuth: true,
+							title: 'routes_title.payments'
+						},
+					},
+				]
+			},
 			{
 				name: 'AppSettings',
 				path: '/admin/settings',
@@ -284,16 +316,6 @@ const routesAdmin = [
 							title: 'Index'
 						},
 					},
-					{
-						name: 'AppBillings',
-						path: '/admin/settings/billings',
-						component: () =>
-							import(/* webpackChunkName: "chunks/app-billings" */ '../views/Admin/AppSettings/AppSettingsTabs/Billings'),
-						meta: {
-							requiresAuth: true,
-							title: 'routes_title.billings'
-						},
-					},
 					{
 						name: 'AppEmail',
 						path: '/admin/settings/email',
@@ -304,16 +326,6 @@ const routesAdmin = [
 							title: 'routes_title.email'
 						},
 					},
-					{
-						name: 'AppPayments',
-						path: '/admin/settings/payments',
-						component: () =>
-							import(/* webpackChunkName: "chunks/app-payments" */ '../views/Admin/AppSettings/AppSettingsTabs/Payments'),
-						meta: {
-							requiresAuth: true,
-							title: 'routes_title.payments'
-						},
-					},
 					{
 						name: 'AppOthers',
 						path: '/admin/settings/others',

resources/js/views/Admin.vue

@@ -29,6 +29,14 @@
                             {{ $t('admin_menu.dashboard') }}
                         </div>
                     </router-link>
+                    <router-link :to="{name: 'Users'}" class="menu-list-item link">
+                        <div class="icon text-theme">
+                            <users-icon size="17" />
+                        </div>
+                        <div class="label text-theme">
+                            {{ $t('admin_menu.users') }}
+                        </div>
+                    </router-link>
                     <router-link :to="{name: 'AppOthers'}" class="menu-list-item link">
                         <div class="icon text-theme">
                             <settings-icon size="17" />
@@ -37,6 +45,12 @@
                             {{ $t('admin_menu.settings') }}
                         </div>
                     </router-link>
+                </div>
+            </ContentGroup>
+
+            <!--Content-->
+            <ContentGroup :title="$t('Content')" class="navigator">
+                <div class="menu-list-wrapper vertical">
                     <router-link :to="{name: 'Pages'}" class="menu-list-item link">
                         <div class="icon text-theme">
                             <monitor-icon size="17" />
@@ -57,11 +71,11 @@
             </ContentGroup>
 
             <!-- Assets -->
-            <ContentGroup :title="$t('Assets')" class="navigator">
+            <ContentGroup :title="$t('Subscription')" v-if="['fixed', 'metered'].includes(config.subscriptionType)" class="navigator">
                 <div class="menu-list-wrapper vertical">
 					<router-link v-for="(menu, i) in assetMenu" :key="i" :to="{name: menu.route}" class="menu-list-item link">
                         <div class="icon text-theme">
-                            <users-icon v-if="menu.icon === 'users'" size="17" />
+                            <credit-card-icon v-if="menu.icon === 'card'" size="17" />
                             <database-icon v-if="menu.icon === 'database'" size="17" />
                             <dollar-sign-icon v-if="menu.icon === 'dollar'" size="17" />
                             <file-text-icon v-if="menu.icon === 'file-text'" size="17" />
@@ -101,9 +115,9 @@
 				return {
 					metered: [
 						{
-							title: this.$t('admin_menu.users'),
+							title: this.$t('Payments'),
-							route: 'Users',
+							route: 'AppPayments',
-							icon: 'users',
+							icon: 'card',
 						},
 						{
 							title: this.$t('admin_menu.plans'),
@@ -118,9 +132,9 @@
 					],
 					fixed: [
 						{
-							title: this.$t('admin_menu.users'),
+							title: this.$t('Payments'),
-							route: 'Users',
+							route: 'AppPayments',
-							icon: 'users',
+							icon: 'card',
 						},
 						{
 							title: this.$t('Subscriptions'),
@@ -138,13 +152,6 @@
 							icon: 'file-text',
 						},
 					],
-					none: [
-						{
-							title: this.$t('admin_menu.users'),
-							route: 'Users',
-							icon: 'users',
-						},
-					],
 				}[this.config.subscriptionType]
 			}
         },

resources/js/views/Admin/AppSettings/AppSettings.vue

@@ -30,14 +30,6 @@
 						title: this.$t('admin_settings.tabs.appearance'),
 						route: 'AppAppearance',
 					},
-					{
-						title: this.$t('admin_settings.tabs.payments'),
-						route: 'AppPayments',
-					},
-					{
-						title: this.$t('admin_settings.tabs.billings'),
-						route: 'AppBillings',
-					},
 					{
 						title: this.$t('Homepage'),
 						route: 'AppIndex',

resources/js/views/Admin/PaymentSettings/PaymentSettings.vue

@@ -0,0 +1,36 @@
+<template>
+    <div>
+		<!--Page Tab links-->
+		<div class="card shadow-card py-0 sticky top-0 z-10">
+			<CardNavigation :pages="pages" class="-mx-1" />
+		</div>
+
+		<!--Page Content-->
+		<router-view />
+    </div>
+</template>
+
+<script>
+	import CardNavigation from "../../../components/Admin/CardNavigation";
+
+	export default {
+		name: 'PaymentSettings',
+		components: {
+			CardNavigation,
+		},
+		data() {
+			return {
+				pages: [
+					{
+						title: this.$t('admin_settings.tabs.payments'),
+						route: 'AppPayments',
+					},
+					{
+						title: this.$t('admin_settings.tabs.billings'),
+						route: 'AppBillings',
+					},
+				]
+			}
+		}
+	}
+</script>