update styles

src/components/Template/Header/AdminPanelHeader.vue

@@ -227,6 +227,7 @@ export default {
 </style>
 <style lang="scss">
 .header-inside {
+  height: 100%;
   .admin-top-menu {
     display: flex;
     flex-flow: row;

src/components/Template/SideBard/UserPanelSideBar.vue

@@ -48,7 +48,7 @@ export default {
       userProfileMenuItems: [
         {
           title: 'پیشخوان',
-          // routeName: 'Admin.User.Index',
+          routeName: 'Public.AllClassrooms',
           scrollTo: '#introSection',
           show: true,
           active: false

src/components/Widgets/Other/AllClassrooms/AllClassrooms.vue

@@ -72,7 +72,7 @@
                 class="classroom-item"
                 :class="{'isRegistered' : isClassroomRegistered(classroom.id) }">
           <q-card-section class="thumbnail">
-            <router-link :to="{name: 'UserPanel.ShowClassroomInfo', params: {id: classroom.id}}">
+            <router-link :to="{name: 'Public.ShowClassroomInfo', params: {id: classroom.id}}">
               <div class="RegisteredSign">
                 <svg class="ribbon"
                      xmlns="http://www.w3.org/2000/svg"
@@ -123,7 +123,7 @@
             </router-link>
           </q-card-section>
           <q-card-section class="title">
-            <router-link :to="{name: 'UserPanel.ShowClassroomInfo', params: {id: classroom.id}}">
+            <router-link :to="{name: 'Public.ShowClassroomInfo', params: {id: classroom.id}}">
               {{classroom.title}}
             </router-link>
           </q-card-section>
@@ -191,7 +191,7 @@
           <q-card-actions class="action-section">
             <q-btn color="primary"
                    class="btn-show-classroom"
-                   :to="{name: 'UserPanel.ShowClassroomInfo', params: {id: classroom.id}}">
+                   :to="{name: 'Public.ShowClassroomInfo', params: {id: classroom.id}}">
               مشاهده و ثبت نام
               <svg xmlns="http://www.w3.org/2000/svg"
                    width="18.387"
@@ -403,7 +403,7 @@ export default {
       this.userRegistrations.loading = true
       APIGateway.classroomRegistration.index()
         .then((classroomRegistrationList) => {
-          this.userRegistrations = new ClassroomRegistrationList(classroomRegistrationList)
+          this.userRegistrations = new ClassroomRegistrationList(classroomRegistrationList.list)
           this.classroomsKey = Date.now()
           this.userRegistrations.loading = false
         })
@@ -462,7 +462,7 @@ export default {
       this.classrooms.loading = true
       APIGateway.classroom.index({ per_page: 9999 })
         .then(classroomList => {
-          this.classrooms = new ClassroomList(classroomList)
+          this.classrooms = new ClassroomList(classroomList.list)
           this.classrooms.loading = false
         })
         .catch(() => {
@@ -474,7 +474,7 @@ export default {
       APIGateway.unitCategory.index()
         .then(unitCategoryList => {
           this.categories.loading = false
-          this.categories = new UnitCategoryList(unitCategoryList)
+          this.categories = new UnitCategoryList(unitCategoryList.list)
         })
         .catch(() => {
           this.categories.loading = false
@@ -489,7 +489,7 @@ export default {
       APIGateway.unit.index({ category: categoryId })
         .then(unitList => {
           this.units.loading = false
-          this.units = new UnitList(unitList)
+          this.units = new UnitList(unitList.list)
         })
         .catch(() => {
           this.units.loading = false

src/components/Widgets/Other/ClassroomCarousel/ClassroomCarousel.vue

@@ -8,7 +8,7 @@
       </div>
       <div>
         <q-btn flat
-               :to="{name: 'UserPanel.AllClassrooms'}">
+               :to="{name: 'Public.AllClassrooms'}">
           مشاهده همه
           <svg xmlns="http://www.w3.org/2000/svg"
                width="18.387"
@@ -33,7 +33,7 @@
                 class="classroomCarousel-item"
                 :class="{'isRegistered' : isClassroomRegistered(classroom.id) }">
           <q-card-section class="thumbnail">
-            <router-link :to="{name: 'UserPanel.ShowClassroomInfo', params: {id: classroom.id}}">
+            <router-link :to="{name: 'Public.ShowClassroomInfo', params: {id: classroom.id}}">
               <div class="RegisteredSign">
                 <svg class="ribbon"
                      xmlns="http://www.w3.org/2000/svg"
@@ -84,7 +84,7 @@
             </router-link>
           </q-card-section>
           <q-card-section class="title">
-            <router-link :to="{name: 'UserPanel.ShowClassroomInfo', params: {id: classroom.id}}">
+            <router-link :to="{name: 'Public.ShowClassroomInfo', params: {id: classroom.id}}">
               {{classroom.title}}
             </router-link>
           </q-card-section>
@@ -152,7 +152,7 @@
           <q-card-actions class="action-section">
             <q-btn color="primary"
                    class="btn-show-classroom"
-                   :to="{name: 'UserPanel.ShowClassroomInfo', params: {id: classroom.id}}">
+                   :to="{name: 'Public.ShowClassroomInfo', params: {id: classroom.id}}">
               جزییات دوره
               <svg xmlns="http://www.w3.org/2000/svg"
                    width="18.387"
@@ -251,7 +251,7 @@ export default {
       this.userRegistrations.loading = true
       APIGateway.classroomRegistration.index()
         .then((classroomRegistrationList) => {
-          this.userRegistrations = new ClassroomRegistrationList(classroomRegistrationList)
+          this.userRegistrations = new ClassroomRegistrationList(classroomRegistrationList.list)
           this.classroomsKey = Date.now()
           this.userRegistrations.loading = false
         })
@@ -263,7 +263,7 @@ export default {
       this.classrooms.loading = true
       APIGateway.classroom.index()
         .then(classroomList => {
-          this.classrooms = new ClassroomList(classroomList)
+          this.classrooms = new ClassroomList(classroomList.list)
           this.classrooms.loading = false
         })
         .catch(() => {

src/components/Widgets/Other/Shop/ShopPaymentFromWallet/ShopPaymentFromWallet.vue

@@ -237,7 +237,7 @@ export default {
   },
   created () {
     if (this.classroom === null || typeof this.classroom.id === 'undefined' || this.classroom.id === null) {
-      this.$router.push({ name: 'UserPanel.AllClassrooms' })
+      this.$router.push({ name: 'Public.AllClassrooms' })
     }
   },
   methods: {

src/css/Theme/Controls/button.scss

@@ -1,32 +1,5 @@
-  .q-btn {
-    font-style: normal;
-    font-weight: 500;
-    line-height: 24px;
-    padding: 0;
-    align-items: center;
-    text-align: center;
-    &.q-btn--outline::before {
-      border: 2px solid currentColor;
-      box-sizing: border-box;
-      filter: drop-shadow(-2px -4px 10px rgba(255, 255, 255, 0.6)) drop-shadow(2px 4px 10px rgba(112, 108, 162, 0.05));
-    }
-    .q-btn__content {
-      margin: 8px;
-    }
-  }
-  .q-btn:not(.q-btn--rounded) {
-    border-radius: 10px;
-  }
-  .btn-sm {
-    padding: 0 5px 0 7px;
-    font-size: 14px;
-
-  }
-  .btn-md {
-    padding: 0 30px;
-    font-size: 14px;
-  }
-  .btn-lg {
-    padding: 2px 73px 2px 73px;
-    font-size: 16px;
-  }
+.q-btn {
+  border-radius: 8px;
+  padding-top: 7px;
+  padding-bottom: 7px;
+}

src/css/Theme/Controls/checkBox.scss

@@ -1,12 +0,0 @@
-.q-checkbox{
-  margin-right: 8px;
-    .q-checkbox__inner{
-      &.q-checkbox__inner--falsy{
-        color: var(--alaa-TextSecondary) !important;
-      }
-      .q-checkbox__bg{
-        border-radius: 5px;
-        border: 1px solid;
-      }
-    }
-}

src/css/Theme/Controls/controles.scss

@@ -1,7 +1,5 @@
-@import 'src/css/Theme/Controls/table';
-@import 'src/css/Theme/Controls/input';
-@import 'src/css/Theme/Controls/button';
-@import 'src/css/Theme/Controls/toggle';
-@import 'src/css/Theme/Controls/checkBox';
-@import 'src/css/Theme/Controls/heartBtn';
-@import 'src/css/Theme/Controls/radioButton';
+@import 'input';
+@import 'checkBox';
+@import 'radioButton';
+@import 'button';
+@import 'toggle';

src/css/Theme/Controls/radioButton.scss

@@ -1,6 +0,0 @@
-.q-radio {
-  .q-radio__inner {
-    .q-radio__icon-container {
-    }
-  }
-}

src/css/Theme/Controls/toggle.scss

@@ -1,30 +0,0 @@
-.q-toggle{
-  .q-toggle__inner{
-    .q-toggle__track{
-      width: 40px;
-      height: 24px;
-      border-radius: 15px;
-    }
-    .q-toggle__thumb{
-      color: var(--alaa-Neutral3);
-      top: 15px;
-      &:after{
-        box-shadow: 1px 2px 2px rgba(0, 0, 0, 0.15), -1px -1px 5px rgba(255, 255, 255, 0.2);
-      ;
-      }
-    }
-    &.q-toggle__inner--truthy{
-      .q-toggle__thumb{
-        left: 14px;
-      }
-    }
-    &.q-toggle__inner--falsy{
-      .q-toggle__track{
-        background-color: #C4C4C4;
-      }
-      .q-toggle__thumb{
-        left: 28px;
-      }
-    }
-  }
-}

src/css/Theme/drawer.scss

@@ -0,0 +1,3 @@
+.main-layout-left-drawer {
+  border-right: solid 1px #DFE1EC;
+}

src/css/Theme/header.scss

@@ -0,0 +1,28 @@
+.main-layout {
+  .q-layout__section--marginal {
+    background-color: white;
+    height: 70px;
+    color: inherit;
+    //border-bottom: solid 1px #DFE1EC;
+  }
+  &.isNotAdminPage:not(.isProfilePage) {
+    .q-layout__section--marginal {
+      background-color: #FBF4EA;
+      height: 120px;
+      color: #212121;
+      border-bottom: solid 1px #DFE1EC;
+    }
+  }
+  &.isHomePage {
+    .q-layout__section--marginal {
+      height: 120px;
+      background-color: transparent !important;
+      border: none !important;
+    }
+  }
+  &.isPublicPage {
+    .q-layout__section--marginal {
+      height: 120px;
+    }
+  }
+}

src/css/Theme/quasar-crud/dateTimeInput.scss

@@ -0,0 +1,41 @@
+.form-builder-date-time-col {
+  .q-field {
+    .q-field__prepend {
+      padding-left: 12px;
+      padding-right: 12px;
+      height: 48px;
+    }
+  }
+  .dateTime-input {
+    .q-field {
+      .q-field__append {
+        padding-right: 12px;
+        height: 48px;
+      }
+      &:first-child {
+        .q-field__control {
+          border-top-right-radius: 0;
+          border-bottom-right-radius: 0;
+          border-right: none;
+          &:before {
+            border-top-right-radius: 0;
+            border-bottom-right-radius: 0;
+            border-right: none;
+          }
+        }
+      }
+      &:nth-child(2) {
+        .q-field__control {
+          border-top-left-radius: 0;
+          border-bottom-left-radius: 0;
+          border-left: none;
+          &:before {
+            border-top-left-radius: 0;
+            border-bottom-left-radius: 0;
+            border-left: none;
+          }
+        }
+      }
+    }
+  }
+}

src/css/Theme/quasar-crud/index.scss

@@ -0,0 +1,29 @@
+.quasar-crud-index-table {
+  margin-right: -32px;
+  margin-left: -32px;
+  //margin-top: -16px;
+  padding-top: 0;
+  .q-table__card {
+    background-color: transparent;
+    box-shadow: none;
+    .q-table__top {
+      display: none;
+    }
+    .q-table {
+      thead {
+        background: #F0EFEE;
+        color: #8588A3;
+      }
+    }
+  }
+}
+
+.action-column-entity-index {
+  display: flex;
+  flex-flow: row;
+  justify-content: flex-start;
+  align-items: center;
+  svg {
+    margin-left: 20px;
+  }
+}

src/css/Theme/quasar-crud/input.scss

@@ -0,0 +1,25 @@
+.q-field {
+  .q-field__inner {
+    .q-field__control {
+      height: 48px;
+      &:before {
+        background: #FFFFFF 0 0 no-repeat padding-box;
+        border: 1px solid #DFE1EC;
+        border-radius: 8px;
+      }
+      .q-field__control-container {
+        .q-field__label {
+          font-size: 15px;
+          letter-spacing: 0;
+          color: #B4B1B1;
+          margin-left: 23px;
+          top: 14px;
+        }
+        input {
+          padding-left: 23px;
+          padding-right: 23px;
+        }
+      }
+    }
+  }
+}

src/css/Theme/quasar-crud/quasar-crud.scss

@@ -0,0 +1,18 @@
+.q-card {
+  .q-toolbar {
+    .doc-card-title {
+      background: transparent;
+      color: #616161;
+      &:after {
+        border-top-color: transparent;
+      }
+    }
+  }
+}
+
+
+@import 'index';
+@import 'input';
+@import 'select';
+@import 'dateTimeInput';
+@import 'tiptapEditor';

src/css/Theme/quasar-crud/select.scss

@@ -0,0 +1,15 @@
+.form-builder-select-col {
+  .q-field {
+    .q-field__native {
+      padding-left: 23px;
+    }
+  }
+}
+
+.q-menu.q-position-engine {
+  .q-item.q-item--active {
+    background-color: #c6c6c6;
+    color: white;
+    border-bottom: solid 1px #a2a2a2;
+  }
+}

src/css/Theme/quasar-crud/tiptapEditor.scss

@@ -0,0 +1,3 @@
+.tiptap-plus-container {
+  border: solid 1px #DFE1EC;
+}

src/css/Theme/theme.scss

@@ -1,3 +1,12 @@
+@import 'Controls/controles';
+@import 'Widgets/widgets.scss';
+
+
+@import 'header';
+@import 'drawer';
+@import 'quasar-crud/quasar-crud';
+
+
 @import 'src/css/fonts.scss';
 @import 'src/css/Theme/sizes.scss';
 @import 'src/css/Theme/colors.scss';
@@ -10,10 +19,16 @@
   font-family: IRANSans, 'Arial', '-apple-system', 'Helvetica Neue', Helvetica, sans-serif;
 }
 
-body.body--light {
-  background: #F6F7FB;
+.main-layout {
+  &:not(.isHomePage) > .q-layout {
+    background: #FFFFFF;
+  }
+  & > .q-layout {
+    background: #F5F5F5;
+  }
 }
 
+
 .default-notify-class {
   font-size: 18px;
   text-align: center;

src/layouts/MainLayout.vue

@@ -1,5 +1,6 @@
 <template>
-  <div class="main-layout">
+  <div class="main-layout"
+       :class="{'isNotAdminPage': !isAdminPage, 'isHomePage': isHomePage, 'isProfilePage': isProfilePage, 'isPublicPage': isPublicPage}">
     <quasar-template-builder @onResize="resize">
       <template #header>
         <template-header :type="getTemplateHeaderType" />
@@ -83,6 +84,18 @@ export default {
     }
   },
   computed: {
+    isPublicPage () {
+      return this.$route.name && this.$route.name.includes('Public.')
+    },
+    isAdminPage () {
+      return this.$route.name && this.$route.name.includes('Admin.')
+    },
+    isProfilePage () {
+      return this.$route.name && this.$route.name.includes('UserPanel.')
+    },
+    isHomePage () {
+      return this.$route.name && this.$route.name === 'Public.Home'
+    },
     canShowFloatingActionBtn () {
       return true
       // return this.user.hasPermission('editSiteSetting') && (this.hasDynamicSetting || this.hasDynamicSettingWithParams)

src/pages/Public/classrooms.vue

@@ -7,7 +7,7 @@
 
 <script>
 export default {
-  name: 'UserPanel.AllClassrooms',
+  name: 'Public.AllClassrooms',
   data () {
     return {
       pageConfig: {},

src/router/routes.js

@@ -83,8 +83,8 @@ const routes = [
           // },
 
           { name: 'Public.Home', path: '', component: () => import('src/pages/Public/index.vue') },
-          { name: 'UserPanel.AllClassrooms', path: 'all-classrooms', component: () => import('src/pages/Public/classrooms.vue') },
-          { name: 'UserPanel.ShowClassroomInfo', path: 'classroom/:id', component: () => import('src/pages/Public/ShowClassroomInfo.vue') }
+          { name: 'Public.AllClassrooms', path: 'all-classrooms', component: () => import('src/pages/Public/classrooms.vue') },
+          { name: 'Public.ShowClassroomInfo', path: 'classroom/:id', component: () => import('src/pages/Public/ShowClassroomInfo.vue') }
 
         ]
       },
@@ -108,6 +108,17 @@ const routes = [
           {
             name: 'UserPanel.ShopCompleteInfo',
             path: 'shop/completeInfo',
+            layoutConfig: {
+              layoutView: 'hHh LpR fFf',
+              layoutHeaderType: 'admin',
+              layoutHeaderBordered: true,
+              layoutLeftDrawer: false,
+              layoutLeftDrawerVisible: false,
+              layoutLeftSideBarType: 'admin',
+              layoutLeftDrawerBordered: true,
+              layoutLeftDrawerWidth: 240,
+              layoutFooter: false
+            },
             meta: { middlewares: [Authenticated] },
             component: () => import('src/pages/User/Shop/completeInfo.vue')
           },