diff --git a/src/assets/img/ufo.jpg b/src/assets/img/ufo.jpg
new file mode 100644
index 0000000..ad603fc
Binary files /dev/null and b/src/assets/img/ufo.jpg differ
diff --git a/src/router/index.js b/src/router/index.js
index 51cb27e..09881e8 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -24,6 +24,8 @@ import ElProgressBars from "../layouts/sections/elements/progress-bars/ProgressB
import ElToggles from "../layouts/sections/elements/toggles/TogglesView.vue";
import ElTypography from "../layouts/sections/elements/typography/TypographyView.vue";
import Project from "../views/LandingPages/Project/Project.vue";
+import Profile from "../views/LandingPages/Profile/Profile.vue";
+import TopSecretProject from "../views/LandingPages/Project/TopSecretProject.vue";
const router = createRouter({
@@ -34,12 +36,25 @@ const router = createRouter({
name: "presentation",
component: PresentationView,
},
+
{
path: '/project/:id',
name: 'project',
component: Project
},
+ {
+ path: '/TopSecret',
+ name: 'topsecretproject',
+ component: TopSecretProject
+ },
+
+ {
+ path: '/profile/:id',
+ name: 'profile',
+ component: Profile
+ },
+
{
path: "/pages/landing-pages/about-us",
name: "about",
diff --git a/src/views/LandingPages/Profile/Profile.vue b/src/views/LandingPages/Profile/Profile.vue
new file mode 100644
index 0000000..bd4abc6
--- /dev/null
+++ b/src/views/LandingPages/Profile/Profile.vue
@@ -0,0 +1,43 @@
+<script setup>
+import axios from 'axios';
+import { onMounted, ref } from "vue";
+import { useRoute } from "vue-router";
+
+
+const profileId = ref(null);
+const route = useRoute();
+const profileData = ref([]);
+
+onMounted(async() => {
+ profileId.value = route.params.id;
+ await getProfile();
+});
+
+
+const getProfile = async () => {
+ const profileDataRecieved = await axios.get(`http://somebodyhire.me/api/profile/${profileId.value}/`);
+ profileData.value = profileDataRecieved.data;
+
+};
+
+
+
+
+</script>
+
+
+<template>
+ <div>
+ <h1>Профиль пользователя номер: {{ profileData.id }}</h1>
+ <h2>{{ profileData.username }}</h2>
+ <p>{{ profileData.email }}</p>
+
+
+ </div>
+ </template>
+
+
+
+<style scoped>
+</style>
+
\ No newline at end of file
diff --git a/src/views/LandingPages/Project/TopSecretProject.vue b/src/views/LandingPages/Project/TopSecretProject.vue
new file mode 100644
index 0000000..029c067
--- /dev/null
+++ b/src/views/LandingPages/Project/TopSecretProject.vue
@@ -0,0 +1,30 @@
+<!-- Шаблон для страницы, содержимое которой видно только зарегистрированным пользователям -->
+
+<script setup>
+
+import { computed } from "vue";
+
+// example components
+import DefaultNavbar from "@/examples/navbars/NavbarDefault.vue";
+import Header from "@/examples/Header.vue";
+
+
+const isAuthenticated = computed(() => !!sessionStorage.getItem('access_token')); // Computed property to check if the user is authenticated
+
+</script>
+
+
+
+
+<template>
+ <DefaultNavbar />
+
+ <Header>
+ <div v-if="isAuthenticated">
+ <p>Наш главный секрет</p>
+ </div>
+ <div v-else>
+ <p>здесь ничего нет</p>
+ </div>
+ </Header>
+</template>
\ No newline at end of file
diff --git a/src/views/LandingPages/SignIn/BasicView Old.vue b/src/views/LandingPages/SignIn/BasicView Old.vue
new file mode 100644
index 0000000..868347b
--- /dev/null
+++ b/src/views/LandingPages/SignIn/BasicView Old.vue
@@ -0,0 +1,171 @@
+<script setup>
+import { onMounted } from "vue";
+
+// example components
+import DefaultNavbar from "@/examples/navbars/NavbarDefault.vue";
+import Header from "@/examples/Header.vue";
+
+//Vue Material Kit 2 components
+import MaterialInput from "@/components/MaterialInput.vue";
+import MaterialSwitch from "@/components/MaterialSwitch.vue";
+import MaterialButton from "@/components/MaterialButton.vue";
+
+// material-input
+import setMaterialInput from "@/assets/js/material-input";
+onMounted(() => {
+ setMaterialInput();
+});
+</script>
+<template>
+ <DefaultNavbar transparent />
+ <Header>
+ <div
+ class="page-header align-items-start min-vh-100"
+ :style="{
+ backgroundImage:
+ 'url(https://images.unsplash.com/photo-1497294815431-9365093b7331?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1950&q=80)'
+ }"
+ loading="lazy"
+ >
+ <span class="mask bg-gradient-dark opacity-6"></span>
+ <div class="container my-auto">
+ <div class="row">
+ <div class="col-lg-4 col-md-8 col-12 mx-auto">
+ <div class="card z-index-0 fadeIn3 fadeInBottom">
+ <div
+ class="card-header p-0 position-relative mt-n4 mx-3 z-index-2"
+ >
+ <div
+ class="bg-gradient-success shadow-success border-radius-lg py-3 pe-1"
+ >
+ <h4
+ class="text-white font-weight-bolder text-center mt-2 mb-0"
+ >
+ Sign in
+ </h4>
+ <div class="row mt-3">
+ <div class="col-2 text-center ms-auto">
+ <a class="btn btn-link px-3" href="javascript:;">
+ <i class="fa fa-facebook text-white text-lg"></i>
+ </a>
+ </div>
+ <div class="col-2 text-center px-1">
+ <a class="btn btn-link px-3" href="javascript:;">
+ <i class="fa fa-github text-white text-lg"></i>
+ </a>
+ </div>
+ <div class="col-2 text-center me-auto">
+ <a class="btn btn-link px-3" href="javascript:;">
+ <i class="fa fa-google text-white text-lg"></i>
+ </a>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="card-body">
+ <form role="form" class="text-start">
+ <MaterialInput
+ id="email"
+ class="input-group-outline my-3"
+ :label="{ text: 'Email', class: 'form-label' }"
+ type="email"
+ />
+ <MaterialInput
+ id="password"
+ class="input-group-outline mb-3"
+ :label="{ text: 'Password', class: 'form-label' }"
+ type="password"
+ />
+ <MaterialSwitch
+ class="d-flex align-items-center mb-3"
+ id="rememberMe"
+ labelClass="mb-0 ms-3"
+ checked
+ >Remember me</MaterialSwitch
+ >
+
+ <div class="text-center">
+ <MaterialButton
+ class="my-4 mb-2"
+ variant="gradient"
+ color="success"
+ fullWidth
+ >Sign in</MaterialButton
+ >
+ </div>
+ <p class="mt-4 text-sm text-center">
+ Don't have an account?
+ <a
+ href="#"
+ class="text-success text-gradient font-weight-bold"
+ >Sign up</a
+ >
+ </p>
+ </form>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <footer class="footer position-absolute bottom-2 py-2 w-100">
+ <div class="container">
+ <div class="row align-items-center justify-content-lg-between">
+ <div class="col-12 col-md-6 my-auto">
+ <div
+ class="copyright text-center text-sm text-white text-lg-start"
+ >
+ © {{ new Date().getFullYear() }}, made with
+ <i class="fa fa-heart" aria-hidden="true"></i> by
+ <a
+ href="https://www.creative-tim.com"
+ class="font-weight-bold text-white"
+ target="_blank"
+ >Creative Tim</a
+ >
+ for a better web.
+ </div>
+ </div>
+ <div class="col-12 col-md-6">
+ <ul
+ class="nav nav-footer justify-content-center justify-content-lg-end"
+ >
+ <li class="nav-item">
+ <a
+ href="https://www.creative-tim.com"
+ class="nav-link text-white"
+ target="_blank"
+ >Creative Tim</a
+ >
+ </li>
+ <li class="nav-item">
+ <a
+ href="https://www.creative-tim.com/presentation"
+ class="nav-link text-white"
+ target="_blank"
+ >About Us</a
+ >
+ </li>
+ <li class="nav-item">
+ <a
+ href="https://www.creative-tim.com/blog"
+ class="nav-link text-white"
+ target="_blank"
+ >Blog</a
+ >
+ </li>
+ <li class="nav-item">
+ <a
+ href="https://www.creative-tim.com/license"
+ class="nav-link pe-0 text-white"
+ target="_blank"
+ >License</a
+ >
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+ </footer>
+ </div>
+ </Header>
+</template>
diff --git a/src/views/LandingPages/SignIn/BasicView.vue b/src/views/LandingPages/SignIn/BasicView.vue
index 868347b..9b85c21 100644
--- a/src/views/LandingPages/SignIn/BasicView.vue
+++ b/src/views/LandingPages/SignIn/BasicView.vue
@@ -1,21 +1,88 @@
<script setup>
import { onMounted } from "vue";
+import { ref } from "vue";
+import axios from 'axios';
+import { computed } from "vue";
// example components
import DefaultNavbar from "@/examples/navbars/NavbarDefault.vue";
import Header from "@/examples/Header.vue";
-//Vue Material Kit 2 components
-import MaterialInput from "@/components/MaterialInput.vue";
-import MaterialSwitch from "@/components/MaterialSwitch.vue";
-import MaterialButton from "@/components/MaterialButton.vue";
-
// material-input
import setMaterialInput from "@/assets/js/material-input";
+
+const username = ref('');
+const password = ref('');
+const errorMessage = ref('');
+
+const isAuthenticated = computed(() => !!sessionStorage.getItem('access_token')); // Computed property to check if the user is authenticated
+
+
+const login = async () => {
+ if (!username.value || !password.value) {
+ errorMessage.value = "Please fill in both fields.";
+ } else {
+ const url = 'http://somebodyhire.me/api/token/';
+ const headers = {
+ 'Content-Type': 'application/json',
+ };
+ const body = {
+ username: username.value,
+ password: password.value,
+ };
+
+ try {
+ const response = await axios.post(url, body, { headers });
+ errorMessage.value = `Request:\nPOST ${url}\nHeaders: ${JSON.stringify(headers)}\nBody: ${JSON.stringify(body)}\n\nResponse:\nStatus: ${response.status}\nHeaders: ${JSON.stringify(response.headers)}\nBody: ${JSON.stringify(response.data)}`;
+ sessionStorage.setItem('access_token', response.data.access); // Save the access token in sessionStorage (new line)
+ } catch (error) {
+ if (error.response) {
+ // The request was made and the server responded with a status code that falls out of the range of 2xx
+ errorMessage.value = `Request:\nPOST ${url}\nHeaders: ${JSON.stringify(headers)}\nBody: ${JSON.stringify(body)}\n\nResponse:\nStatus: ${error.response.status}\nHeaders: ${JSON.stringify(error.response.headers)}\nBody: ${JSON.stringify(error.response.data)}`;
+ } else if (error.request) {
+ // The request was made but no response was received
+ errorMessage.value = `Request:\nPOST ${url}\nHeaders: ${JSON.stringify(headers)}\nBody: ${JSON.stringify(body)}\n\nError: No response received from server. Please try again later.`;
+ } else {
+ // Something happened in setting up the request that triggered an error
+ errorMessage.value = `Request:\nPOST ${url}\nHeaders: ${JSON.stringify(headers)}\nBody: ${JSON.stringify(body)}\n\nError: ${error.message}`;
+ }
+ }
+ }
+};
+
+const logout = () => { // Method to logout the user by clearing the session storage (new function)
+ sessionStorage.removeItem('access_token');
+};
+
+
onMounted(() => {
setMaterialInput();
});
</script>
+
+<script>
+export default {
+ data() {
+ return {
+ username: '',
+ password: '',
+ errorMessage: '',
+ };
+ },
+ methods: {
+ login() {
+ if (!this.username || !this.password) {
+ this.errorMessage = "Please fill in both fields.";
+ } else {
+ // Implement login logic here
+ this.errorMessage = `Can't login now, you are trying to sign in with login: ${this.username} and password: ${this.password}`;
+ }
+ },
+ },
+};
+</script>
+
+
<template>
<DefaultNavbar transparent />
<Header>
@@ -41,64 +108,61 @@ onMounted(() => {
<h4
class="text-white font-weight-bolder text-center mt-2 mb-0"
>
- Sign in
+ Вход
</h4>
- <div class="row mt-3">
- <div class="col-2 text-center ms-auto">
- <a class="btn btn-link px-3" href="javascript:;">
- <i class="fa fa-facebook text-white text-lg"></i>
- </a>
- </div>
- <div class="col-2 text-center px-1">
- <a class="btn btn-link px-3" href="javascript:;">
- <i class="fa fa-github text-white text-lg"></i>
- </a>
- </div>
- <div class="col-2 text-center me-auto">
- <a class="btn btn-link px-3" href="javascript:;">
- <i class="fa fa-google text-white text-lg"></i>
- </a>
- </div>
- </div>
</div>
</div>
<div class="card-body">
<form role="form" class="text-start">
- <MaterialInput
- id="email"
- class="input-group-outline my-3"
- :label="{ text: 'Email', class: 'form-label' }"
- type="email"
- />
- <MaterialInput
- id="password"
- class="input-group-outline mb-3"
- :label="{ text: 'Password', class: 'form-label' }"
- type="password"
- />
- <MaterialSwitch
- class="d-flex align-items-center mb-3"
- id="rememberMe"
- labelClass="mb-0 ms-3"
- checked
- >Remember me</MaterialSwitch
- >
+ <div>
+ <div v-if="isAuthenticated">
+ <!-- This will only be displayed if the user is authenticated -->
+ <p>Опять Ты!</p>
+ <button @click="logout">Выход</button>
+ </div>
+
+ <div v-else>
+ <!-- This will be displayed if the user is not authenticated -->
+ <p>Ты с какого района?</p>
+
+
+
+
+ <div>
+ <input v-model="username" type="text" placeholder="Имя пользователя" />
+ </div>
+
+ <div>
+ <input v-model="password" type="password" placeholder="Пароль" />
+ </div>
+
+
+ <div class="text-center">
+ <button
+ type="button"
+ class="btn bg-gradient-dark w-100 my-4 mb-2"
+ @click="login"
+ >
+ Войти
+ </button>
+
+ </div>
+
+ </div>
+
+
+ <div v-if="errorMessage">
+ <p>{{ errorMessage }}</p>
+ </div>
+ </div>
+
- <div class="text-center">
- <MaterialButton
- class="my-4 mb-2"
- variant="gradient"
- color="success"
- fullWidth
- >Sign in</MaterialButton
- >
- </div>
<p class="mt-4 text-sm text-center">
- Don't have an account?
+ Нет аккаунта?
<a
href="#"
class="text-success text-gradient font-weight-bold"
- >Sign up</a
+ >Пока что нахер идите</a
>
</p>
</form>
@@ -107,65 +171,6 @@ onMounted(() => {
</div>
</div>
</div>
- <footer class="footer position-absolute bottom-2 py-2 w-100">
- <div class="container">
- <div class="row align-items-center justify-content-lg-between">
- <div class="col-12 col-md-6 my-auto">
- <div
- class="copyright text-center text-sm text-white text-lg-start"
- >
- © {{ new Date().getFullYear() }}, made with
- <i class="fa fa-heart" aria-hidden="true"></i> by
- <a
- href="https://www.creative-tim.com"
- class="font-weight-bold text-white"
- target="_blank"
- >Creative Tim</a
- >
- for a better web.
- </div>
- </div>
- <div class="col-12 col-md-6">
- <ul
- class="nav nav-footer justify-content-center justify-content-lg-end"
- >
- <li class="nav-item">
- <a
- href="https://www.creative-tim.com"
- class="nav-link text-white"
- target="_blank"
- >Creative Tim</a
- >
- </li>
- <li class="nav-item">
- <a
- href="https://www.creative-tim.com/presentation"
- class="nav-link text-white"
- target="_blank"
- >About Us</a
- >
- </li>
- <li class="nav-item">
- <a
- href="https://www.creative-tim.com/blog"
- class="nav-link text-white"
- target="_blank"
- >Blog</a
- >
- </li>
- <li class="nav-item">
- <a
- href="https://www.creative-tim.com/license"
- class="nav-link pe-0 text-white"
- target="_blank"
- >License</a
- >
- </li>
- </ul>
- </div>
- </div>
- </div>
- </footer>
</div>
</Header>
</template>
diff --git a/src/views/Presentation/PresentationView.vue b/src/views/Presentation/PresentationView.vue
index fdaca58..c8c55d4 100644
--- a/src/views/Presentation/PresentationView.vue
+++ b/src/views/Presentation/PresentationView.vue
@@ -14,7 +14,7 @@
</style>
<script setup>
-import { onMounted, onUnmounted } from "vue";
+import { onMounted, onUnmounted, computed, } from "vue";
//example components
import NavbarDefault from "../..//examples/navbars/NavbarDefault.vue";
@@ -29,6 +29,9 @@ import PresentationSearch from "./Sections/PresentationSearch.vue";
//images
import vueMkHeader from "@/assets/img/space-background.jpg";
+//authentification
+const isAuthenticated = computed(() => !!sessionStorage.getItem('access_token'));
+
//hooks
const body = document.getElementsByTagName("body")[0];
onMounted(() => {
@@ -86,6 +89,18 @@ export default {
>
LinkedMin
</h1>
+ <div v-if="isAuthenticated">
+ <h1
+ class="text-white pt-3 mt-n5 me-2"
+ :style="{ display: 'inline-block ', fontFamily: 'PressStart2P, sans-serif' }"
+ >
+ Тариф Премиум</h1>
+ </div>
+
+ <div v-else>
+ <p>Тариф Бесплатный</p>
+ </div>
+
<p class="lead text-white px-5 mt-3" :style="{ fontWeight: '500', fontFamily: 'PressStart2P, sans-serif' }">
Показывай себя и свои проекты.
Находи вдохновение, коллег и новые знания.
diff --git a/src/views/Presentation/Sections/PresentationSearch.vue b/src/views/Presentation/Sections/PresentationSearch.vue
index e31b42c..012ada6 100644
--- a/src/views/Presentation/Sections/PresentationSearch.vue
+++ b/src/views/Presentation/Sections/PresentationSearch.vue
@@ -34,13 +34,16 @@ const search = async () => {
<div>
<h2>Найдено проектов: {{ searchResultProjects.length}} </h2>
<div v-for = "project in searchResultProjects" :key="project.id">
- <h3>{{ project.title }}</h3>
+ <h3>{{ project.title }} with ID {{ project.id }}</h3>
<p>{{ project.description }}</p>
+ <a :href="`http://somebodyhire.me/project/${project.id}`">Страница проекта</a>
+
</div>
<h2>Найдено людей: {{ searchResultUsers.length}} </h2>
<div v-for = "user in searchResultUsers" :key="user.id">
- <h3>{{ user.username }}</h3>
+ <h3>{{ user.username }} with id {{ user.id }}</h3>
<p>{{ user.email }}</p>
+ <a :href="`http://somebodyhire.me/profile/${user.id}`">Страница пользователя</a>
</div>