diff options
-rw-r--r-- | components/ModelBoxCard.vue | 2 | ||||
-rw-r--r-- | pages/models/_id/index.vue | 2 | ||||
-rw-r--r-- | pages/user/_id.vue | 74 |
3 files changed, 76 insertions, 2 deletions
diff --git a/components/ModelBoxCard.vue b/components/ModelBoxCard.vue index a6085b7..110c234 100644 --- a/components/ModelBoxCard.vue +++ b/components/ModelBoxCard.vue @@ -17,7 +17,7 @@ .mr-3.float-left user-avatar(:data="model.author") p.leading-8 - a.text-green-800(class="hover:text-green-700" :href="'/users/'+model.author.username") + a.text-green-800(class="hover:text-green-700" :href="'/user/'+model.author_id") | @ span.underline {{ model.author.username }} diff --git a/pages/models/_id/index.vue b/pages/models/_id/index.vue index 238aea7..cfa11b2 100644 --- a/pages/models/_id/index.vue +++ b/pages/models/_id/index.vue @@ -43,7 +43,7 @@ .mr-3.float-left user-avatar(:data="model.author") p.leading-8 - a.text-green-800(class="hover:text-green-700" :href="'/users/'+model.author.username") + a.text-green-800(class="hover:text-green-700" :href="'/user/'+model.author_id") | @ span.underline {{ model.author.username }} .description.mt-3 diff --git a/pages/user/_id.vue b/pages/user/_id.vue new file mode 100644 index 0000000..be282af --- /dev/null +++ b/pages/user/_id.vue @@ -0,0 +1,74 @@ +<template lang="pug"> + .mx-auto.w-90p.py-6#modelpage(class="sm:px-6 lg:px-8 md:max-w-7xl") + .flex.mb-10(v-if="user.username") + user-avatar(:data="user" big="1") + .grid.pl-7 + h1.text-2xl.font-bold.self-end.flex(:title="user.username+' is an admin'") {{ user.name }} + svg(v-if="user.is_staff" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#dc2626" class="ml-2 mt-1 w-6 h-6") + path(fill-rule="evenodd" d="M12.516 2.17a.75.75 0 00-1.032 0 11.209 11.209 0 01-7.877 3.08.75.75 0 00-.722.515A12.74 12.74 0 002.25 9.75c0 5.942 4.064 10.933 9.563 12.348a.749.749 0 00.374 0c5.499-1.415 9.563-6.406 9.563-12.348 0-1.39-.223-2.73-.635-3.985a.75.75 0 00-.722-.516l-.143.001c-2.996 0-5.717-1.17-7.734-3.08zm3.094 8.016a.75.75 0 10-1.22-.872l-3.236 4.53L9.53 12.22a.75.75 0 00-1.06 1.06l2.25 2.25a.75.75 0 001.14-.094l3.75-5.25z" clip-rule="evenodd") + + h2.text-md.text-gray-500 @{{ user.username }} + + model-loading(v-if="isLoading") + section(v-else) + div(v-if="models.length > 0") + h4.mb-1.text-lg My models + .grid.grid-cols-1.gap-4(class="md:grid-cols-4") + model-box-card( + v-for="model in models" + :key="model.id" + :model="model" + ) + h4.text-lg(v-else) No models found + +</template> + +<script> +import UserAvatar from "@/components/UserAvatar.vue"; +import FilePreview from "@/components/FilePreview.vue"; +import ModelLoading from "@/components/ModelLoading.vue"; +import ModelBoxCard from "@/components/ModelBoxCard.vue"; + +import { mapGetters } from "vuex"; + +export default { + name: "UserPageView", + layout: "default", + data() { + return { + id: 0, + user: {}, + models: [], + }; + }, + head() { + return { + title: this.user.username + " ยท Verden", + }; + }, + components: { + "user-avatar": UserAvatar, + "file-preview": FilePreview, + "model-loading": ModelLoading, + "model-box-card": ModelBoxCard, + }, + computed: { + ...mapGetters(["isLoading"]), + }, + created() { + this.id = this.$route.params.id; + + this.$store.dispatch("users/findById", this.id).then((response) => { + if (response.status != 200) { + window.location.href = "/"; + } else { + this.user = response.data; + } + }); + + this.$store.dispatch("users/findModels", this.id).then((response) => { + if (response.status == 200) this.models = response.data.results; + }); + }, +}; +</script> |