xclele/vue-material-kit
1
0
Fork 0
mirror of https://github.com/creativetimofficial/vue-material-kit.git synced 2025-05-24 05:24:21 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Edit added

Browse Source
This commit is contained in:
FEARmeR 2023-05-22 17:22:38 +01:00
parent d27d6f371d
commit 5ef1593173
3 changed files with 84 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
src/views/LandingPages/Profile/EditProfile.vue
View File

@ -12,6 +12,7 @@ const token = computed(() => sessionStorage.getItem('access_token'));
const profileData = ref([]); const profileData = ref([]);
const router = useRouter(); const router = useRouter();
const debugText = ref(''); const debugText = ref('');
const selectedImage = ref(null);
const getProfile = async () => { const getProfile = async () => {
const profileDataRecieved = await axios.get(`http://somebodyhire.me/api/profile/${userId.value}/`); const profileDataRecieved = await axios.get(`http://somebodyhire.me/api/profile/${userId.value}/`);
@ -47,17 +48,33 @@ axios.interceptors.response.use((response) => {
return Promise.reject(error); return Promise.reject(error);
}); });
const onFileChange = (event) => {
selectedImage.value = event.target.files[0];
debugText.value = `Selected image: ${selectedImage.value.name}`;
};
const updateProfile = async () => { const updateProfile = async () => {
try { try {
const token = computed(() => sessionStorage.getItem('access_token')); const tokenValue = token.value;
debugText.value = `Type of token: ${typeof token.value}, Value of token: ${token.value}`; const headers = { 'Authorization': `Bearer ${tokenValue}` };
const headers = { 'Authorization': `Bearer ${token.value}` };
await axios.patch(`http://somebodyhire.me/api/profile/${userId.value}/`, profileData.value, { headers }); // Create a new FormData object
router.push('/ViewMyProfile'); const formData = new FormData();
} catch (error) {
debugText.value = `Error: ${JSON.stringify(error, null, 2)}`; // Append the profile data
console.error(error); Object.entries(profileData.value).forEach(([key, value]) => {
} formData.append(key, value);
});
// Append the image file
formData.append('image', selectedImage.value);
await axios.patch(`http://somebodyhire.me/api/profile/${userId.value}/`, formData, { headers });
// router.push('/ViewMyProfile');
} catch (error) {
debugText.value = `Error: ${JSON.stringify(error, null, 2)}`;
console.error(error);
}
}; };
const cancelUpdate = () => { const cancelUpdate = () => {
@ -74,6 +91,7 @@ onMounted(async() => {
<div class="profile-container"> <div class="profile-container">
<h1>User Profile: {{ loggedUserName }}</h1> <h1>User Profile: {{ loggedUserName }}</h1>
<textarea readonly v-model="debugText"></textarea> <textarea readonly v-model="debugText"></textarea>
<input type="file" accept="image/*" @change="onFileChange">
<input type="text" v-model="profileData.username" placeholder="Username"> <input type="text" v-model="profileData.username" placeholder="Username">
<input type="email" v-model="profileData.email" placeholder="Email"> <input type="email" v-model="profileData.email" placeholder="Email">
<input type="text" v-model="profileData.name" placeholder="Name"> <input type="text" v-model="profileData.name" placeholder="Name">

91
src/views/LandingPages/Project/EditProject.vue
View File

@ -3,36 +3,25 @@ import axios from 'axios';
import { onMounted, ref, computed } from "vue"; import { onMounted, ref, computed } from "vue";
import NavbarDefault from "../../../examples/navbars/NavbarDefault.vue"; import NavbarDefault from "../../../examples/navbars/NavbarDefault.vue";
import { useRouter } from "vue-router"; import { useRouter } from "vue-router";
import { useRoute } from 'vue-router';
const isAuthenticated = computed(() => !!sessionStorage.getItem('access_token')); const isAuthenticated = computed(() => !!sessionStorage.getItem('access_token'));
const userId = computed(() => sessionStorage.getItem('user_id')); const userId = computed(() => sessionStorage.getItem('user_id'));
const loggedUserName = computed(() => sessionStorage.getItem('username')); const loggedUserName = computed(() => sessionStorage.getItem('username'));
const token = computed(() => sessionStorage.getItem('access_token')); const token = computed(() => sessionStorage.getItem('access_token'));
const profileData = ref([]); const projectData = ref([]);
const router = useRouter(); const router = useRouter();
const debugText = ref(''); const debugText = ref('');
const projectId = ref(null);
const route = useRoute();
const getProfile = async () => {
const profileDataRecieved = await axios.get(`http://somebodyhire.me/api/profile/${userId.value}/`);
profileData.value = processProfileData(profileDataRecieved.data);
};
const processProfileData = (data) => { // const getProfile = async () => {
return { // const profileDataRecieved = await axios.get(`http://somebodyhire.me/api/profile/${userId.value}/`);
name: data.name || '', // profileData.value = processProfileData(profileDataRecieved.data);
email: data.email || '', // };
username: data.username || '',
location: data.location || '',
short_intro: data.short_intro || '',
bio: data.bio || '',
social_github: data.social_github || '',
social_twitter: data.social_twitter || '',
social_vk: data.social_vk || '',
social_youtube: data.social_youtube || '',
social_website: data.social_website || '',
};
};
axios.interceptors.request.use((request) => { axios.interceptors.request.use((request) => {
debugText.value += '\n\nRequest:\n' + JSON.stringify(request, null, 2); debugText.value += '\n\nRequest:\n' + JSON.stringify(request, null, 2);
@ -47,13 +36,41 @@ axios.interceptors.response.use((response) => {
return Promise.reject(error); return Promise.reject(error);
}); });
const updateProfile = async () => { const getProject = async () => {
try {
const projectDataRecieved = await axios.get(`http://somebodyhire.me/api/projects/${projectId.value}/`);
projectData.value = projectDataRecieved.data;
} catch (error) {
console.error('There was an error fetching the project data', error);
}
};
// const updateProfile = async () => {
// try {
// const token = computed(() => sessionStorage.getItem('access_token'));
// debugText.value = `Type of token: ${typeof token.value}, Value of token: ${token.value}`;
// const headers = { 'Authorization': `Bearer ${token.value}` };
// await axios.patch(`http://somebodyhire.me/api/profile/${userId.value}/`, profileData.value, { headers });
// router.push('/ViewMyProfile');
// } catch (error) {
// debugText.value = `Error: ${JSON.stringify(error, null, 2)}`;
// console.error(error);
// }
// };
const updateProject = async () => {
try { try {
const token = computed(() => sessionStorage.getItem('access_token'));
debugText.value = `Type of token: ${typeof token.value}, Value of token: ${token.value}`;
const headers = { 'Authorization': `Bearer ${token.value}` }; const headers = { 'Authorization': `Bearer ${token.value}` };
await axios.patch(`http://somebodyhire.me/api/profile/${userId.value}/`, profileData.value, { headers }); const data = {
router.push('/ViewMyProfile'); title: projectData.value.title,
description: projectData.value.description,
demo_link: projectData.value.demo_link,
source_link: projectData.value.source_link,
tags: projectData.value.tags,
};
const response = await axios.patch(`http://somebodyhire.me/api/projects/${projectId.value}/`, data, { headers });
router.push(`/project/${response.data.id}`);
} catch (error) { } catch (error) {
debugText.value = `Error: ${JSON.stringify(error, null, 2)}`; debugText.value = `Error: ${JSON.stringify(error, null, 2)}`;
console.error(error); console.error(error);
@ -61,31 +78,29 @@ const updateProfile = async () => {
}; };
const cancelUpdate = () => { const cancelUpdate = () => {
router.push('/ViewMyProfile'); router.push('/myprojects');
}; };
onMounted(async() => { onMounted(async() => {
await getProfile(); projectId.value = route.params.id;
await getProject();
}); });
</script> </script>
<template> <template>
<NavbarDefault /> <NavbarDefault />
<div class="profile-container"> <div class="profile-container">
<H1> Страница Редактирования Проекта {{ projectId }}</H1>
<h1>User Profile: {{ loggedUserName }}</h1> <h1>User Profile: {{ loggedUserName }}</h1>
<textarea readonly v-model="debugText"></textarea> <textarea readonly v-model="debugText"></textarea>
<input type="text" v-model="profileData.username" placeholder="Username"> <input type="text" v-model="projectData.title" placeholder="Title">
<input type="email" v-model="profileData.email" placeholder="Email"> <input type="text" v-model="projectData.description" placeholder="Description">
<input type="text" v-model="profileData.name" placeholder="Name"> <textarea v-model="projectData.demo_link" placeholder="Demo link"></textarea>
<input type="text" v-model="profileData.short_intro" placeholder="Short Introduction"> <textarea v-model="projectData.source_link" placeholder="Source code link"></textarea>
<textarea v-model="profileData.bio" placeholder="Biography"></textarea> <textarea v-model="projectData.tags" placeholder="Tags"></textarea>
<textarea v-model="profileData.social_github" placeholder="GitHub Link"></textarea> <button @click="updateProject" class="btn-submit">Update</button>
<textarea v-model="profileData.social_twitter" placeholder="Twitter Link"></textarea>
<textarea v-model="profileData.social_vk" placeholder="VK Link"></textarea>
<textarea v-model="profileData.social_youtube" placeholder="YouTube Link"></textarea>
<textarea v-model="profileData.social_website" placeholder="Website Link"></textarea>
<button @click="updateProfile" class="btn-submit">Submit</button>
<button @click="cancelUpdate" class="btn-cancel">Cancel</button> <button @click="cancelUpdate" class="btn-cancel">Cancel</button>
</div> </div>
</template> </template>

4
src/views/LandingPages/SignIn/BasicView.vue
View File

@ -20,6 +20,7 @@ const isAuthenticated = computed(() => !!sessionStorage.getItem('access_token'))
const userId = computed(() => sessionStorage.getItem('user_id')); const userId = computed(() => sessionStorage.getItem('user_id'));
const loggedUserName = computed(() => sessionStorage.getItem('username')); const loggedUserName = computed(() => sessionStorage.getItem('username'));
const isStaff = computed(() => sessionStorage.getItem('is_staff')); const isStaff = computed(() => sessionStorage.getItem('is_staff'));
const token = computed(() => sessionStorage.getItem('token'));
const login = async () => { const login = async () => {
if (!username.value || !password.value) { if (!username.value || !password.value) {
@ -36,11 +37,11 @@ const login = async () => {
try { try {
const response = await axios.post(url, body, { headers }); const response = await axios.post(url, body, { headers });
// Removed debug information from output
sessionStorage.setItem('access_token', response.data.access); sessionStorage.setItem('access_token', response.data.access);
sessionStorage.setItem('username', username.value); sessionStorage.setItem('username', username.value);
sessionStorage.setItem('user_id', response.data.id); sessionStorage.setItem('user_id', response.data.id);
sessionStorage.setItem('is_staff', response.data.is_staff); sessionStorage.setItem('is_staff', response.data.is_staff);
sessionStorage.setItem('token', response.data.token);
location.reload(); // Refresh page location.reload(); // Refresh page
} catch (error) { } catch (error) {
if (error.response) { if (error.response) {
@ -59,6 +60,7 @@ const logout = () => {
sessionStorage.removeItem('username'); // Also clear the username from sessionStorage sessionStorage.removeItem('username'); // Also clear the username from sessionStorage
sessionStorage.removeItem('user_id'); sessionStorage.removeItem('user_id');
sessionStorage.setItem('is_staff', false); sessionStorage.setItem('is_staff', false);
sessionStorage.removeItem('token');
location.reload(); // Refresh page after logout location.reload(); // Refresh page after logout
}; };