mirror of
https://github.com/notherealmarco/WASAPhoto.git
synced 2025-05-05 12:22:35 +02:00
Fix user profile view not always showing the right user
This commit is contained in:
parent
c0ba5011b5
commit
811a5190eb
3 changed files with 35 additions and 23 deletions
|
@ -1,6 +1,7 @@
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
props: ["user_data"],
|
props: ["user_data"],
|
||||||
|
|
||||||
data: function () {
|
data: function () {
|
||||||
return {
|
return {
|
||||||
modal_data: [],
|
modal_data: [],
|
||||||
|
@ -19,7 +20,6 @@ export default {
|
||||||
// Visit the profile of the user with the given id
|
// Visit the profile of the user with the given id
|
||||||
visit(user_id) {
|
visit(user_id) {
|
||||||
this.$router.push({ path: "/profile/" + user_id })
|
this.$router.push({ path: "/profile/" + user_id })
|
||||||
location.reload()
|
|
||||||
},
|
},
|
||||||
|
|
||||||
// Reset the current data and fetch the first batch of users
|
// Reset the current data and fetch the first batch of users
|
||||||
|
@ -75,7 +75,7 @@ export default {
|
||||||
<Modal ref="mymodal" id="userModal" :title="data_type">
|
<Modal ref="mymodal" id="userModal" :title="data_type">
|
||||||
<ul>
|
<ul>
|
||||||
<li v-for="item in modal_data" :key="item.user_id" class="mb-2" style="cursor: pointer"
|
<li v-for="item in modal_data" :key="item.user_id" class="mb-2" style="cursor: pointer"
|
||||||
@click="visit(item.user_id)">
|
@click="visit(item.user_id)" data-bs-dismiss="modal">
|
||||||
<h5>{{ item.name }}</h5>
|
<h5>{{ item.name }}</h5>
|
||||||
</li>
|
</li>
|
||||||
<IntersectionObserver sentinal-name="load-more-users" @on-intersection-element="loadMore" />
|
<IntersectionObserver sentinal-name="load-more-users" @on-intersection-element="loadMore" />
|
||||||
|
|
|
@ -11,6 +11,9 @@ export default {
|
||||||
followed: function (new_val, old_val) {
|
followed: function (new_val, old_val) {
|
||||||
this.user_followed = new_val
|
this.user_followed = new_val
|
||||||
},
|
},
|
||||||
|
user_id: function (new_val, old_val) {
|
||||||
|
this.myself = this.$currentSession() == new_val
|
||||||
|
},
|
||||||
},
|
},
|
||||||
data: function () {
|
data: function () {
|
||||||
return {
|
return {
|
||||||
|
|
|
@ -23,23 +23,41 @@ export default {
|
||||||
limit: 1,
|
limit: 1,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
watch: {
|
||||||
|
'$route.params.user_id': {
|
||||||
|
handler: function (user_id) {
|
||||||
|
this.refresh()
|
||||||
|
},
|
||||||
|
deep: true,
|
||||||
|
immediate: true
|
||||||
|
}
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
async refresh() {
|
async refresh() {
|
||||||
|
if (this.$route.params.user_id == "me") {
|
||||||
|
// If the id is "me", show the current user's profile
|
||||||
|
this.requestedProfile = this.$currentSession()
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
// Otherwise, show "id"'s profile
|
||||||
|
this.requestedProfile = this.$route.params.user_id
|
||||||
|
}
|
||||||
|
|
||||||
// Fetch profile info from the server
|
// Fetch profile info from the server
|
||||||
this.getMainData();
|
this.getMainData()
|
||||||
|
|
||||||
// Limits the number of posts to load based on the window height
|
// Limits the number of posts to load based on the window height
|
||||||
// to avoid loading too many posts at once
|
// to avoid loading too many posts at once
|
||||||
// 450px is (a bit more) of the height of a single post
|
// 450px is (a bit more) of the height of a single post
|
||||||
this.limit = Math.max(Math.round(window.innerHeight / 450), 1);
|
this.limit = Math.max(Math.round(window.innerHeight / 450), 1)
|
||||||
|
|
||||||
// Reset the parameters and the data
|
// Reset the parameters and the data
|
||||||
this.start_idx = 0;
|
this.start_idx = 0
|
||||||
this.data_ended = false;
|
this.data_ended = false
|
||||||
this.stream_data = [];
|
this.stream_data = []
|
||||||
|
|
||||||
// Fetch the first batch of posts
|
// Fetch the first batch of posts
|
||||||
this.loadContent();
|
this.loadContent()
|
||||||
},
|
},
|
||||||
|
|
||||||
// Fetch profile info from the server
|
// Fetch profile info from the server
|
||||||
|
@ -47,17 +65,17 @@ export default {
|
||||||
let response = await this.$axios.get("/users/" + this.requestedProfile);
|
let response = await this.$axios.get("/users/" + this.requestedProfile);
|
||||||
if (response == null) {
|
if (response == null) {
|
||||||
// An error occurred, set the error flag
|
// An error occurred, set the error flag
|
||||||
this.loading = false;
|
this.loading = false
|
||||||
this.loadingError = true;
|
this.loadingError = true
|
||||||
return;
|
return
|
||||||
}
|
}
|
||||||
this.user_data = response.data;
|
this.user_data = response.data
|
||||||
},
|
},
|
||||||
|
|
||||||
// Fetch photos from the server
|
// Fetch photos from the server
|
||||||
async loadContent() {
|
async loadContent() {
|
||||||
this.loading = true;
|
this.loading = true;
|
||||||
let response = await this.$axios.get("/users/" + this.requestedProfile + "/photos" + "?start_index=" + this.start_idx + "&limit=" + this.limit);
|
let response = await this.$axios.get("/users/" + this.requestedProfile + "/photos" + "?start_index=" + this.start_idx + "&limit=" + this.limit)
|
||||||
if (response == null) return // An error occurred. The interceptor will show a modal
|
if (response == null) return // An error occurred. The interceptor will show a modal
|
||||||
|
|
||||||
// If the server returned less elements than requested,
|
// If the server returned less elements than requested,
|
||||||
|
@ -83,17 +101,8 @@ export default {
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
if (this.$route.params.user_id == "me") {
|
|
||||||
// If the id is "me", show the current user's profile
|
|
||||||
this.requestedProfile = this.$currentSession();
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
// Otherwise, show "id"'s profile
|
|
||||||
this.requestedProfile = this.$route.params.user_id;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Fetch the profile info and the first batch of photos
|
// Fetch the profile info and the first batch of photos
|
||||||
this.refresh();
|
this.refresh()
|
||||||
},
|
},
|
||||||
components: { IntersectionObserver }
|
components: { IntersectionObserver }
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue