feat: re-design home page in admin panel

Author: alexandrdrvn

plugin.php

@@ -97,6 +97,7 @@ function VFA_vuefront_admin_action_vf_information()
 {
     $plugin_data = get_plugin_data(__FILE__);
     $woocommerce_data = get_plugin_data(WP_PLUGIN_DIR . '/woocommerce/woocommerce.php');
+    $brand_data = get_plugin_data(WP_PLUGIN_DIR . '/perfect-woocommerce-brands/perfect-woocommerce-brands.php');
     $plugin_version = $plugin_data['Version'];
     $extensions = array();
     $extensions[] = array(
@@ -105,6 +106,12 @@ function VFA_vuefront_admin_action_vf_information()
         'status' => is_plugin_active('woocommerce/woocommerce.php')
     );
 
+    $extensions[] = array(
+        'name' => "Perfect Brands for WooCommerce",
+        'version' => $brand_data['Version'],
+        'status' => is_plugin_active('perfect-woocommerce-brands/perfect-woocommerce-brands.php')
+    );
+
     $status = file_exists(__DIR__ . '/.htaccess.txt');
 
     echo json_encode(

view/javascript/d_pax/components/access.vue

@@ -34,7 +34,6 @@
 <script>
 import {mapGetters} from 'vuex'
 export default {
-  layout: 'auth',
   middleware: ['alien'],
   data() {
     return {
@@ -49,13 +48,13 @@ export default {
   methods: {
     handleLogout() {
       this.$store.dispatch('auth/logout')
-      this.$router.push('/check')
+      this.$store.commit('auth/toggleShowLogin')
     },
     async handleRefresh() {
       this.refreshLoading = true
       await this.$store.dispatch('account/load')
       if(this.account.banneded) {
-        this.$router.push('/')
+        this.$store.commit('auth/toggleShowLogin')
       }
       this.refreshLoading = false
     },
@@ -75,7 +74,11 @@ export default {
 </i18n>
 <style lang="scss">
 .alient-page {
-  margin-top: 60px;
+  border-radius: 3px;
+  border: 1px solid #d9d9d9;
+  background-color: #ffffff;
+  padding: 50px 55px;
+  margin-bottom: 60px;
   &__button_logout {
     display: block;
     cursor: pointer;
@@ -90,8 +93,6 @@ export default {
     text-align: center;
   }
   &__banner {
-    background-color: #f9f9f9;
-    padding: 50px;
     margin-bottom: 40px;
     &_image {
       padding: 0 40px;

view/javascript/d_pax/pages/alien.vue renamed to view/javascript/d_pax/components/alien.vue

@@ -210,6 +210,7 @@ export default {
       padding: 10px;
       background: #efeff1 !important;
       border: none;
+      margin: 0;
       height: 54px !important;
       background-color: #efeff1 !important;
       padding: 12px 24px !important;

view/javascript/d_pax/components/apps.vue

@@ -34,7 +34,6 @@
 <script>
 import {mapGetters} from 'vuex'
 export default {
-  layout: 'auth',
   middleware: ['banned'],
   data() {
     return {
@@ -49,13 +48,13 @@ export default {
   methods: {
     handleLogout() {
       this.$store.dispatch('auth/logout')
-      this.$router.push('/check')
+      this.$store.commit('auth/toggleShowLogin')
     },
     async handleRefresh() {
       this.refreshLoading = true
       await this.$store.dispatch('account/load')
       if(this.account.banneded) {
-        this.$router.push('/')
+        this.$store.commit('auth/toggleShowLogin')
       }
       this.refreshLoading = false
     },
@@ -75,7 +74,11 @@ export default {
 </i18n>
 <style lang="scss">
   .banned-page {
-    margin-top: 60px;
+    border-radius: 3px;
+    border: 1px solid #d9d9d9;
+    background-color: #ffffff;
+    padding: 50px 55px;
+    margin-bottom: 60px;
     &__button_logout {
       display: block;
       cursor: pointer;
@@ -90,8 +93,6 @@ export default {
       text-align: center;
     }
     &__banner {
-      background-color: #f9f9f9;
-      padding: 50px;
       margin-bottom: 40px;
       &_image {
         padding: 0 40px;

view/javascript/d_pax/pages/banned.vue renamed to view/javascript/d_pax/components/banned.vue

@@ -50,8 +50,6 @@
 <script>
 import { mapGetters } from "vuex";
 export default {
-  layout: 'auth',
-  middleware: ['notAuthenticated'],
   data() {
     return {
       form: {
@@ -67,6 +65,9 @@ export default {
       existingEmail: "auth/existingEmail"
     })
   },
+  mounted() {
+    this.$store.commit('account/setBanned', false)
+  },
   methods: {
     async onSubmit (valid) {
       if (!valid) {
@@ -77,9 +78,9 @@ export default {
       await this.$store.dispatch('auth/checkEmail', {email: this.form.email})
 
       if(!this.existingEmail) {
-        this.$router.push('/register')
+        this.$emit('register')
       } else {
-        this.$router.push('/login')
+        this.$emit('login')
       }
 
       this.loading = false

view/javascript/d_pax/pages/check.vue renamed to view/javascript/d_pax/components/check.vue

@@ -56,7 +56,6 @@
 <script>
 import {mapGetters} from 'vuex'
 export default {
-  layout: 'auth',
   middleware: ['authenticated', 'notConfirmed'],
   data() {
     return {
@@ -71,14 +70,12 @@ export default {
   methods: {
     handleLogout() {
       this.$store.dispatch('auth/logout')
-      this.$router.push('/check')
+      this.$store.commit('auth/toggleShowLogin')
     },
     async handleRefresh() {
       this.refreshLoading = true
       await this.$store.dispatch('account/load')
-      if(this.account.confirmed) {
-        this.$router.push('/')
-      }
+
       this.refreshLoading = false
     },
     async handleResend() {
@@ -98,7 +95,11 @@ export default {
 </i18n>
 <style lang="scss">
   .confirm-page {
-    margin-top: 60px;
+    border-radius: 3px;
+    border: 1px solid #d9d9d9;
+    background-color: #ffffff;
+    padding: 50px 55px;
+    margin-bottom: 60px;
     &__button_logout {
       display: block;
       cursor: pointer;
@@ -125,12 +126,11 @@ export default {
       text-align: center;
     }
     &__banner {
-      background-color: #f9f9f9;
-      padding: 50px;
       margin-bottom: 40px;
       &_image {
         padding: 0 40px;
         margin-bottom: 20px;
+        text-align: center;
         img {
           width: 100;
           max-width: 100%;

view/javascript/d_pax/pages/confirm.vue renamed to view/javascript/d_pax/components/confirm.vue

@@ -53,7 +53,6 @@ export default {
       this.$store.commit('apps/setEdit', false)
     },
     async onSubmit(valid) {
-      console.log(valid)
       if (valid) {
         await this.$store.dispatch('apps/edit', {key: this.id, app: {
           eventUrl: this.form.eventUrl,

view/javascript/d_pax/components/editApp.vue

@@ -11,9 +11,9 @@
           </b-col>
           <b-col>
             <b-navbar-nav class="align-items-center vf-header__right_nav">
-              <header-activation v-if="cms.builds.length > 0 && information.apache" />
+              <header-activation v-if="isLogged && cms.builds.length > 0 && information.apache" />
               <b-button
-                v-if="cms.builds.length > 0 && !information.apache"
+                v-if="isLogged && cms.builds.length > 0 && !information.apache"
                 class="vf-header__button_activate"
                 variant="success"
                 @click="$scrollTo('#vf-nginx-configure')"
@@ -42,6 +42,7 @@ export default {
 
   computed: {
     ...mapGetters({
+      isLogged: "auth/isLogged",
       cms: 'cms/get',
       information: 'information/get'
     })

view/javascript/d_pax/components/header.vue

@@ -1,9 +1,11 @@
 <template>
   <div
+    v-if="isLogged"
     id="vf-header-account"
     class="header-account"
   >
     <b-nav-item-dropdown
+
       toggle-class="text-decoration-none text-1 m-0 font-weight-semibold"
       no-caret
       text
@@ -69,7 +71,8 @@ export default {
   },
   computed: {
     ...mapGetters({
-      account: 'account/get'
+      account: 'account/get',
+      isLogged: "auth/isLogged"
     }),
     faAngleDown () {
       return faAngleDown
@@ -85,7 +88,6 @@ export default {
   methods: {
     async logout () {
       await this.$store.dispatch('auth/logout')
-      this.$router.push('/check')
     }
   }
 }
@@ -99,7 +101,13 @@ export default {
     border: solid 1px $white-five;
     background-color: $white;
     padding: 13px 17px;
-
+    .header-account__sign-in {
+      list-style: none;
+      a {
+        font-weight: 600;
+        color: black;
+      }
+    }
     .header-account__separator {
       border-top: 1px solid $white-eight;
       margin-top: 0;