1) Made adaptive styles

2) Api tour filter fix
Sgadmer · Jun 14, 2022 · 2cfeb0d · 2cfeb0d
1 parent 44922e7
commit 2cfeb0d
Show file tree

Hide file tree

Showing 42 changed files with 576 additions and 130 deletions.
diff --git a/backend/controllers/tour.ts b/backend/controllers/tour.ts
@@ -33,8 +33,6 @@ export const findByParams = async (req, res) => {
       touristId,
       excludeTouristId,
       agentId,
-      mainPhoto,
-      addPhotos,
       title,
       place,
       dateStart,
@@ -66,8 +64,6 @@ export const findByParams = async (req, res) => {
     res.status(200)
       .json((await getTourService.findByParams(_.omitBy({
         agentId,
-        mainPhoto,
-        addPhotos,
         title,
         price: priceFilter,
         place: placeFilter,

diff --git a/backend/services/tour/get.ts b/backend/services/tour/get.ts
@@ -1,10 +1,15 @@
 import { Tour } from '../../models/tour'
 
-const findAll = async () => Tour.find({}).populate(['agentId', 'tourists.touristId'])
+const findAll = async () => Tour.find({}).populate(['agentId', 'tourists.touristId']).sort({ dateStart: -1 })
 
 const findById = async (id) => Tour.findById(id).populate(['agentId', 'tourists.touristId'])
 
-const findByParams = async (params) => Tour.find(params).populate(['agentId', 'tourists.touristId'])
+const findByParams = async (params) => (
+  Tour
+    .find(params)
+    .sort({ dateStart: -1 })
+    .populate(['agentId', 'tourists.touristId'])
+)
 
 const findTouristsBooks = async (touristId) => Tour.find({ 'tourists.touristId': touristId }, {
   mainPhoto: 1,

diff --git a/frontend/assets/styles/common.scss b/frontend/assets/styles/common.scss
@@ -17,7 +17,7 @@ $colors: (
   'danger': #F82424,
   'danger-light': #FDB6B6,
   'danger-lightest': #FFF5F5,
-  'warning': #FFE30F,
+  'warning': #EFD300,
   'success': #99E62E,
   'success-light': #CEEED1,
   'success-lightest': #F9FDFA,
@@ -123,6 +123,13 @@ $spacers: (
   }
 }
 
+
+@mixin break-xl-up() {
+  @media (min-width: $xl) {
+    @content;
+  }
+}
+
 @mixin text($font-size, $line-height, $color: '', $font-weight: '',) {
   font-size: $font-size;
   line-height: $line-height;

diff --git a/frontend/assets/styles/main.scss b/frontend/assets/styles/main.scss
@@ -42,6 +42,14 @@ body {
   font-family: $primary-font-family, $fallback-font-family;
   background-color: cl('white');
   max-width: 1440px;
+
+  @include break-xl() {
+    padding: 20px;
+  }
+
+  @include break-sm(){
+    padding: 10px 8px 20px 8px;
+  }
 }
 
 #__nuxt {
@@ -64,7 +72,7 @@ h1, .h1 {
   font-size: 140px;
   line-height: 140px;
 
-  @include break-lg {
+  @include break-xl {
     font-size: 52px;
     line-height: 56px;
     letter-spacing: unset;
@@ -81,7 +89,7 @@ h2, .h2 {
     line-height: 88px;
   }
 
-  @include break-lg {
+  @include break-xl {
     font-size: 24px;
     line-height: 32px;
 
@@ -102,7 +110,7 @@ h3, .h3 {
     line-height: 48px;
   }
 
-  @include break-lg {
+  @include break-xl {
     font-size: 20px;
     line-height: 24px;
 

diff --git a/frontend/components/common/Admin/Admin.vue b/frontend/components/common/Admin/Admin.vue
@@ -10,7 +10,6 @@
 /**
  * IMPORTS
  */
-import $s from '../common.module.scss'
 import { useAdminStore } from '~@store/admin'
 
 

diff --git a/frontend/components/common/Admin/Lists/AgentsList.vue b/frontend/components/common/Admin/Lists/AgentsList.vue
@@ -5,13 +5,6 @@
     @onSubmit="handleFiltersChange"
   />
 
-<!--  <div :class="[$s.Common__Row, $s.Common__Row_Center]">-->
-<!--    <Tabs-->
-<!--      :tabs="tabs"-->
-<!--      @onTabChange="handleTabChange"-->
-<!--      class="ToursList__Tabs"-->
-<!--    />-->
-<!--  </div>-->
   <ScrollContainer>
     <ListCardUser
       v-for="(agent, i) in agents"
@@ -124,14 +117,4 @@ const handleFiltersChange = (formData: Record<string, any>) => {
 </script>
 
 <style scoped lang="scss">
-.ToursList {
-  &__Tabs {
-    width: auto;
-    margin-right: 35px;
-  }
-
-  &__CreateBtn {
-    margin-bottom: 4px;
-  }
-}
 </style>
diff --git a/frontend/components/common/Admin/Lists/TouristsList.vue b/frontend/components/common/Admin/Lists/TouristsList.vue
@@ -6,13 +6,6 @@
   />
 
 
-<!--  <div :class="[$s.Common__Row, $s.Common__Row_Center]">-->
-<!--    <Tabs-->
-<!--      :tabs="tabs"-->
-<!--      @onTabChange="handleTabChange"-->
-<!--      class="ToursList__Tabs"-->
-<!--    />-->
-<!--  </div>-->
   <ScrollContainer>
     <ListCardUser
       v-for="(tourist, i) in tourists"

diff --git a/frontend/components/common/Admin/Lists/ToursList.vue b/frontend/components/common/Admin/Lists/ToursList.vue
@@ -5,13 +5,10 @@
     @onSubmit="handleFiltersChange"
   />
 
-  <div :class="[$s.Common__Row, $s.Common__Row_Center]">
     <Tabs
       :tabs="tabs"
       @onTabChange="handleTabChange"
-      class="ToursList__Tabs"
     />
-  </div>
   <ScrollContainer>
     <TourCard
       v-for="card in $toursStore.getAccountTours"
@@ -150,14 +147,4 @@ const handleFiltersChange = (formData: Record<string, any>) => {
 </script>
 
 <style scoped lang="scss">
-.ToursList {
-  &__Tabs {
-    width: auto;
-    margin-right: 35px;
-  }
-
-  &__CreateBtn {
-    margin-bottom: 4px;
-  }
-}
 </style>
diff --git a/frontend/components/common/Agent/ToursList/ToursList.module.scss b/frontend/components/common/Agent/ToursList/ToursList.module.scss
@@ -0,0 +1,23 @@
+@import '@styles/common.scss';
+
+.ToursList {
+
+  &__AgentsTabs {
+    display: flex;
+    justify-content: center;
+
+    @include break-xl() {
+      flex-direction: column-reverse;
+    }
+  }
+
+  &__CreateBtn {
+    margin-bottom: 5px;
+
+    @include break-xl() {
+      max-width: fit-content;
+      margin-left: auto;
+      margin-bottom: 20px;
+    }
+  }
+}
diff --git a/frontend/components/common/Agent/ToursList/ToursList.vue b/frontend/components/common/Agent/ToursList/ToursList.vue
@@ -1,18 +1,17 @@
 <template>
   <FiltersForm
-    :class="$s.Common__FiltersForm"
+    :class="$sCommon.Common__FiltersForm"
     @onSubmit="handleFiltersChange"
   />
-  <div :class="[$s.Common__Row, $s.Common__Row_Center]">
+  <div :class="$s.ToursList__AgentsTabs">
     <Tabs
       :tabs="tabs"
       @onTabChange="handleTabChange"
-      class="ToursList__Tabs"
     />
     <Button
       kind="Main"
       corners="Md"
-      class="ToursList__CreateBtn"
+      :class="$s.ToursList__CreateBtn"
       @click="handleCreateTourModalOpen"
     >
       Создать&nbsp;&nbsp;&nbsp;+
@@ -34,7 +33,9 @@
 /**
  * IMPORTS
  */
-import $s from '../../common.module.scss'
+import $s from './ToursList.module.scss'
+import $sCommon from '../../common.module.scss'
+
 import { EModalsNames } from '~/constants/modals'
 import { useModalsStore } from '~@store/modals'
 import { useUserStore } from '~@store/user'
@@ -135,7 +136,6 @@ onBeforeMount((): void => {
 
 })
 
-
 /**
  * METHODS
  */
@@ -167,14 +167,4 @@ const handleFiltersChange = (formData: Record<string, any>) => {
 </script>
 
 <style scoped lang="scss">
-.ToursList {
-  &__Tabs {
-    width: auto;
-    margin-right: 35px;
-  }
-
-  &__CreateBtn {
-    margin-bottom: 4px;
-  }
-}
 </style>
diff --git a/frontend/components/common/Main/AllTours/AllTours.module.scss b/frontend/components/common/Main/AllTours/AllTours.module.scss
@@ -4,10 +4,18 @@
   width: 100%;
   margin-top: 95px;
 
+  @include break-xl() {
+    margin-top: 40px;
+  }
+
   &__TitleWrap {
     width: 100%;
     text-align: center;
     margin-bottom: 40px;
+
+    @include break-xl() {
+      margin-bottom: 20px;
+    }
   }
 
   &__Promo{

diff --git a/frontend/components/common/Main/PromoSlider/PromoSlider.module.scss b/frontend/components/common/Main/PromoSlider/PromoSlider.module.scss
@@ -8,6 +8,14 @@
   border-radius: 72px 72px 0 0;
   overflow: hidden;
 
+  @include break-xl() {
+    height: 305px;
+    border-radius: 25px 25px 0 0;
+  }
+
+  @include break-sm() {
+    height: 235px;
+  }
 
   &__Wrapper {
     position: relative;
@@ -28,6 +36,14 @@
     left: 0;
     background: cl('white');
     mix-blend-mode: lighten;
+
+    @include break-xl() {
+      font-size: 42px;
+    }
+
+    @include break-sm() {
+      font-size: 35px;
+    }
   }
 
   &__Video {
@@ -45,6 +61,14 @@
     left: 0;
     bottom: 0;
     right: 0;
+
+    @include break-xl() {
+      max-height: 235px;
+    }
+
+    @include break-sm() {
+      max-height: 170px;
+    }
   }
 }
 

diff --git a/frontend/components/common/Modals/Modals.module.scss b/frontend/components/common/Modals/Modals.module.scss
@@ -12,10 +12,19 @@
     font-weight: 500;
     font-size: 28px;
     line-height: 36px;
+
+    @include break-xl() {
+      flex-direction: column;
+      margin-bottom: 20px;
+    }
   }
 
   &__InfoList {
     margin-bottom: 200px;
+
+    @include break-xl() {
+      margin-bottom: 50px;
+    }
   }
 
   &__InfoTerm {
@@ -32,6 +41,10 @@
     width: 100%;
     display: flex;
     justify-content: center;
+
+    @include break-xl() {
+      margin-top: 60px;
+    }
   }
 
   &__ConfirmBtn {

diff --git a/frontend/components/common/Modals/ModalsModules/LoginModal/LoginModal.module.scss b/frontend/components/common/Modals/ModalsModules/LoginModal/LoginModal.module.scss
@@ -7,6 +7,10 @@
 
   &__FormFields {
     margin-bottom: 70px;
+
+    @include break-xl() {
+      margin-bottom: 40px;
+    }
   }
 
   &__PasswordInput {

diff --git a/frontend/components/common/Modals/ModalsModules/SignupModal/SignupModal.module.scss b/frontend/components/common/Modals/ModalsModules/SignupModal/SignupModal.module.scss
@@ -9,5 +9,9 @@
   &__FormFields {
     width: 100%;
     margin-bottom: 90px;
+
+    @include break-xl() {
+      margin-bottom: 40px;
+    }
   }
 }
-Original file line number
+Diff line change
@@ Expand Up / @@ -10,7 +10,6 @@ @@
     /**
      * IMPORTS
      */
-    import $s from '../common.module.scss'
     import { useAdminStore } from '~@store/admin'
@@ Expand Down @@