From bc1fce8ae36b7c3e2d9f514d62e4a58fc28bdf5f Mon Sep 17 00:00:00 2001
From: valitovgaziz <a-c-v-a-l@mail.ru>
Date: Sun, 8 Dec 2024 04:37:28 +0500
Subject: [PATCH] Add about page

---
 spa/src/components/AboutC.vue | 39 +++++++++++++++++++++++++++++++++++
 spa/src/components/Header.vue | 13 ++++++------
 spa/src/router/index.js       |  6 ++++++
 spa/src/views/AboutV.vue      |  8 +++++++
 4 files changed, 60 insertions(+), 6 deletions(-)
 create mode 100644 spa/src/components/AboutC.vue
 create mode 100644 spa/src/views/AboutV.vue

diff --git a/spa/src/components/AboutC.vue b/spa/src/components/AboutC.vue
new file mode 100644
index 0000000..3317755
--- /dev/null
+++ b/spa/src/components/AboutC.vue
@@ -0,0 +1,39 @@
+<template>
+    <section class="about">
+      <h1>О нас</h1>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eu mi ut erat rhoncus sollicitudin. Sed vel nunc quis ante malesuada finibus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec tincidunt sapien vitae risus placerat, eget blandit lectus dignissim. Suspendisse potenti. Maecenas ultricies purus non dui volutpat pharetra. Nulla facilisi. Etiam at justo sed augue rutrum sodales.
+      </p>
+      
+      <h2>Наши сотрудники</h2>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam convallis arcu non quam bibendum, nec mollis magna feugiat. Phasellus porttitor felis at neque commodo, in tempus tellus aliquet. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Aenean laoreet enim ut massa viverra dictum. Aliquam cursus lacinia lorem, non scelerisque nisl fringilla ut. Fusce varius libero ut odio mattis fermentum. Ut pretium diam ac metus semper, sit amet porta leo vulputate.
+      </p>
+      
+      <h2>Чем мы занимаемся</h2>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ornare nulla eget ex pellentesque, at congue est accumsan. Duis gravida pulvinar hendrerit. Mauris maximus eros ut tempor lobortis. Morbi euismod interdum nisi, eu condimentum mauris molestie vitae. Praesent venenatis consequat tortor, eu iaculis nunc suscipit id. Curabitur in nibh in odio imperdiet ultrices. Vivamus ut vestibulum nisi. Integer quis augue a ligula porta vehicula. In hac habitasse platea dictumst.
+      </p>
+    </section>
+  </template>
+  
+  <script>
+  export default {
+    name: 'About'
+  };
+  </script>
+  
+  <style scoped>
+  .about {
+    padding: 20px;
+    text-align: justify;
+  }
+  
+  h1, h2 {
+    margin-top: 30px;
+  }
+  
+  p {
+    line-height: 1.6;
+  }
+  </style>
\ No newline at end of file
diff --git a/spa/src/components/Header.vue b/spa/src/components/Header.vue
index 8b359af..fbe52e8 100644
--- a/spa/src/components/Header.vue
+++ b/spa/src/components/Header.vue
@@ -11,7 +11,7 @@
         
         <ul v-show="isOpen" class="menu-list">
           <li v-for="item in menuItems" :key="item.id">
-            <a href="#">{{ item.title }}</a>
+            <router-link :to="item.tooo">{{ item.id }} - {{ item.title }}</router-link>
           </li>
         </ul>
       </div>
@@ -25,11 +25,12 @@
       return {
         isOpen: false,
         menuItems: [
-          { id: 1, title: 'Главная' },
-          { id: 2, title: 'О нас' },
-          { id: 3, title: 'Услуги' },
-          { id: 4, title: 'Контакты' },
-          { id: 5, title: 'Блог' }
+          { id: 1, title: 'Главная', tooo: 'home' },
+          { id: 2, title: 'О нас', tooo: 'about' },
+          { id: 3, title: 'Услуги', tooo: 'home' },
+          { id: 4, title: 'Контакты', tooo: 'home' },
+          { id: 5, title: 'Блог', tooo: 'home' },
+          { id: 6, title: 'SignUp', tooo: 'signup' }
         ]
       };
     }
diff --git a/spa/src/router/index.js b/spa/src/router/index.js
index 8231f94..7f93731 100644
--- a/spa/src/router/index.js
+++ b/spa/src/router/index.js
@@ -1,6 +1,7 @@
 import { createRouter, createWebHistory } from 'vue-router'
 import HomeView from '../views/HomeView.vue'
 import SignUpView from '../views/SingUpV.vue'
+import About from '../views/AboutV.vue'
 
 const router = createRouter({
   history: createWebHistory(import.meta.env.BASE_URL),
@@ -15,6 +16,11 @@ const router = createRouter({
       name: 'home',
       component: HomeView,
     },
+    {
+      path: '/about',
+      name: 'about',
+      component: About
+    },
   ],
 });
 
diff --git a/spa/src/views/AboutV.vue b/spa/src/views/AboutV.vue
new file mode 100644
index 0000000..9824b79
--- /dev/null
+++ b/spa/src/views/AboutV.vue
@@ -0,0 +1,8 @@
+<script setup>
+import About from '../components/AboutC.vue'
+</script>
+
+<template>
+  <About />
+</template>
+  
\ No newline at end of file