From 4bfe25d8879c68a0bfceb757b4b59fe2ffe26e8f Mon Sep 17 00:00:00 2001
From: Konstantin Vinokurov <kostyav60@gmail.com>
Date: Thu, 2 Jun 2022 23:00:42 +0700
Subject: [PATCH 1/2] +Vue +edited backend

---
 frontend/src/assets/css/catalog.css         |  2 +-
 frontend/src/assets/css/offer.css           |  8 ++++++
 frontend/src/components/ProfileAddOffer.vue | 28 +++++++++++++++++----
 frontend/src/components/TheHeader.vue       | 10 ++++----
 frontend/src/views/OfferView.vue            |  6 ++---
 5 files changed, 40 insertions(+), 14 deletions(-)

diff --git a/frontend/src/assets/css/catalog.css b/frontend/src/assets/css/catalog.css
index 550f793..cccdc9c 100644
--- a/frontend/src/assets/css/catalog.css
+++ b/frontend/src/assets/css/catalog.css
@@ -37,7 +37,7 @@ h1, h2, h3, h4, h5, h6 {
 /* Intro */
 .intro {
     width: 100%;
-    height: 100vh;
+    min-height: 100vh;
     display: flex;
     flex-direction: column;
     justify-content:center;
diff --git a/frontend/src/assets/css/offer.css b/frontend/src/assets/css/offer.css
index a983465..6976f96 100644
--- a/frontend/src/assets/css/offer.css
+++ b/frontend/src/assets/css/offer.css
@@ -242,7 +242,15 @@ h1, h2, h3, h4, h5, h6 {
     margin: 1% 0;
 }
 
+.rewiew__comment{
+    padding-left: 10px;
+}
+
 .review__stars {
     display: flex;
     flex-direction: row;
+}
+
+.user__stat{
+    padding-right: 10px;
 }
\ No newline at end of file
diff --git a/frontend/src/components/ProfileAddOffer.vue b/frontend/src/components/ProfileAddOffer.vue
index e0baf0a..16e3b54 100644
--- a/frontend/src/components/ProfileAddOffer.vue
+++ b/frontend/src/components/ProfileAddOffer.vue
@@ -20,7 +20,7 @@
     <div class="about__describtions">
       <div class="descriptions__name">
         <h4>Название для объявления:</h4>
-        <input type="text" size="40" v-model.trim="offer.name">
+        <input type="text" size="40" placeholder="Пример: Просторная квартира на Елисеевке" v-model.trim="offer.name">
       </div>
       <div class="descriptions__name">
         <h4>Тип:</h4>
@@ -32,11 +32,11 @@
       </div>
       <div class="descriptions__address">
         <h4>Адрес:</h4>
-        <input type="text" size="40" v-model.trim="offer.location">
+        <input type="text" size="40" placeholder="Пример: Комарино 12, д. 3" v-model.trim="offer.location">
       </div>
       <div class="descriptions__price">
         <h4>Цена:</h4>
-        <input type="text" size="40" v-model.number="offer.price">
+        <input type="text" size="40" placeholder="Пример: '1200000'" v-model.number="offer.price">
       </div>
       <div class="descriptions__flats">
         <h4>Кол-во комнат:</h4>
@@ -49,11 +49,12 @@
       </div>
       <div class="descriptions__square">
         <h4>Площадь:</h4>
-        <input type="text" size="40" v-model.number="offer.space">
+        <input type="text" size="40" placeholder="Пример: '45'" v-model.number="offer.space">
       </div>
       <div class="descriptions__text">
         <h4>Описание:</h4>
-        <input type="text" size="40" v-model.trim="offer.description">
+<!--        <input type="text" size="40" v-model.trim="offer.description">-->
+        <textarea placeholder="Описание" class="descriptions__textarea" v-model.trim="offer.description"></textarea>
       </div>
     </div>
     <button @click="action">Отправить</button>
@@ -263,12 +264,28 @@ export default {
   margin-top: 1%;
 }
 
+.descriptions__textarea{
+  background-color: rgb(201, 233, 252);
+  border-radius: 5px;
+  border-color: white;
+  box-shadow: none;
+  border: 1px solid rgb(83, 110, 136);
+
+  width: 100%;
+  height: 100px;
+
+
+  font-size: 0.8em;
+}
+
 .about__describtions input {
   background-color: rgb(201, 233, 252);
   border-radius: 5px;
   border-color: white;
   box-shadow: none;
   border: 1px solid rgb(83, 110, 136);
+
+  font-size: 0.8em;
 }
 
 .about__describtions h4 {
@@ -278,5 +295,6 @@ export default {
 .descriptions__text input {
   width: 100%;
   height: 100px;
+
 }
 </style>
\ No newline at end of file
diff --git a/frontend/src/components/TheHeader.vue b/frontend/src/components/TheHeader.vue
index 2d3bbc0..f2bf2b3 100644
--- a/frontend/src/components/TheHeader.vue
+++ b/frontend/src/components/TheHeader.vue
@@ -30,10 +30,8 @@
         </div>
         <div class="header__search">
           <div class="search">
-            <div class="search__block">
-
-            </div>
-            <div class="search__img">
+            <input text="" class="search__block" placeholder="Поиск" v-model.trim="query" @keydown.enter="search">
+            <div class="search__img" @click.prevent="search">
               <a class="nav__link" href="#">
                 <img src="@/assets/images/search.jpg" alt="">
               </a>
@@ -63,6 +61,7 @@ export default {
 }
 </script>
 
+
 <style scoped>
 /* Container */
 .container {
@@ -137,7 +136,8 @@ export default {
   width: 300px;
   height: 40px;
   margin: 0;
-  padding-top: 20px;
+
+  font-size: 1em;
 
   background: white;
   border: 1px solid black;
diff --git a/frontend/src/views/OfferView.vue b/frontend/src/views/OfferView.vue
index b140019..1dabe90 100644
--- a/frontend/src/views/OfferView.vue
+++ b/frontend/src/views/OfferView.vue
@@ -75,9 +75,9 @@
         </div>
         <div class="reviews__blocks">
           <div v-if="offer?.user?.feedback" class="review" v-for="(review, i) in offer.user.feedback" :key="i">
-            <div class="review__avatar">
-              <img src="@/assets/images/forcomment.png" alt="">
-            </div>
+<!--            <div class="review__avatar">-->
+<!--              <img src="@/assets/images/forcomment.png" alt="">-->
+<!--            </div>-->
             <div class="rewiew__comment">
               <h5>{{ review.comment }}</h5>
             </div>

From d916977fc896b24d9980e6eeb9fae8e118f2c8cc Mon Sep 17 00:00:00 2001
From: Konstantin Vinokurov <kostyav60@gmail.com>
Date: Thu, 2 Jun 2022 23:00:58 +0700
Subject: [PATCH 2/2] Vue, back edited,added

---
 frontend/src/components/ProfileAbout.vue |  4 ++--
 frontend/src/components/TheHeader.vue    | 15 ++++++++++++++-
 frontend/src/views/CatalogView.vue       | 17 +++++++++++++++--
 3 files changed, 31 insertions(+), 5 deletions(-)

diff --git a/frontend/src/components/ProfileAbout.vue b/frontend/src/components/ProfileAbout.vue
index 46ee91a..2f053c2 100644
--- a/frontend/src/components/ProfileAbout.vue
+++ b/frontend/src/components/ProfileAbout.vue
@@ -22,8 +22,8 @@ export default {
   computed: {
     ...mapGetters({ user: 'user' }),
     name() {
-      return this.user.last_name && this.user.first_name && this.user.middle_name
-          ? `${this.user.last_name} ${this.user.first_name} ${this.user.middle_name}`
+      return this.user.last_name && this.user.first_name
+          ? `${this.user.last_name} ${this.user.first_name} ${this.user.middle_name ?? ''}`
           : 'Не указано';
     }
   }
diff --git a/frontend/src/components/TheHeader.vue b/frontend/src/components/TheHeader.vue
index f2bf2b3..1812f11 100644
--- a/frontend/src/components/TheHeader.vue
+++ b/frontend/src/components/TheHeader.vue
@@ -57,7 +57,20 @@
 
 <script>
 export default {
-  name: "TheHeader"
+  name: "TheHeader",
+  data() {
+    return {
+      query: '',
+    };
+  },
+  methods: {
+    search() {
+      this.$router.push({
+        path: '/catalog',
+        query: { q: this.query },
+      })
+    }
+  },
 }
 </script>
 
diff --git a/frontend/src/views/CatalogView.vue b/frontend/src/views/CatalogView.vue
index 5f18466..6985ac3 100644
--- a/frontend/src/views/CatalogView.vue
+++ b/frontend/src/views/CatalogView.vue
@@ -133,10 +133,23 @@ export default {
       const offers = await offerService.filter(this.sortParams);
       this.offers = offers.data.data;
     },
+    async addSearchParam(value) {
+      if (!value || !value.q) {
+        this.sortParams = this.sortParams.filter((e) => e.name !== 'search');
+        this.reloadOffers();
+        return;
+      }
+
+      await this.addSortParam('search', value.q);
+    }
   },
   async mounted() {
-    const offers = await offerService.all();
-    this.offers = offers.data.data;
+    await this.addSearchParam(this.$route.query);
+  },
+  watch: {
+    '$route.query'(value) {
+      this.addSearchParam(value);
+    }
   }
 }
 </script>