misc

2022-08-04 12:33:15 -06:00
parent 339bda72ea
commit 7eaf1855ac
11 changed files with 227 additions and 76 deletions
@@ -0,0 +1,84 @@
+<template>
+  <div class="d-flex justify-content-between align-items-end">
+
+    <div class="d-flex align-items-end">
+
+      <div class="btn-group me-5" role="group">
+        <button id="addToVaultGroup" class="btn btn-outline-primary dropdown-toggle" data-bs-toggle="dropdown"
+          aria-expanded="false">Add to Vault</button>
+        <ul class="dropdown-menu" aria-labelledby="addToVaultGroup">
+          <!-- <li v-for="v in userVaults"><a @click="addToVault(v.id)" class="dropdown-item">{{v.name}}</a></li> -->
+        </ul>
+      </div>
+
+      <!-- account is empty... -->
+
+      <i v-show="account.id == keep.creatorId" class="mdi mdi-delete-outline text-secondary" title="Delete"></i>
+
+    </div>
+
+    <div @click="viewProfile(keep?.creator)" class="d-flex align-items-end">
+      <img :src="keep?.creator?.picture" :alt="keep?.creator?.name" class="profile-pic rounded-3 me-2">
+      <p class="mb-0 profile-text">{{ keep?.creator?.name }}</p>
+    </div>
+  </div>
+</template>
+
+
+<script>
+import { AppState } from '../AppState'
+import { computed } from 'vue'
+import { Modal } from 'bootstrap'
+import { logger } from '../utils/Logger.js'
+import { useRouter } from 'vue-router'
+export default {
+  props: {
+    keep: {
+      id: Number,
+      creatorId: String,
+      name: String,
+      description: String,
+      img: String,
+      views: Number,
+      kept: Number,
+      creator: {
+        id: String,
+        name: String,
+        picture: String
+      }
+    }
+  },
+  setup(props) {
+    const router = useRouter()
+    return {
+      account: computed(() => AppState.account ),
+      viewProfile() {
+        // console.log(user.name)
+        // AppState.activeProfile = props.keep.creator
+        Modal.getOrCreateInstance(document.getElementById("keepModal")).hide();
+        // logger.log(props.keep.creator.id)
+        router.push({ name: "Profile", params: { id: props.keep.creator.id } });
+      }
+    }
+  }
+}
+</script>
+
+
+<style lang="scss" scoped>
+.profile-pic {
+  height: 36px;
+  width: 36px;
+  object-fit: contain;
+}
+
+.profile-text {
+  font-size: 18px;
+  font-weight: 300;
+}
+
+.mdi-delete-outline {
+  font-size: 36px;
+  line-height: 36px;
+}
+</style>