j3d1/toolshed
2
1
Fork 0
Code Issues 9 Pull requests 1 Projects Releases Packages Wiki Activity

stash

Browse source
This commit is contained in:
j3d1 2026-08-23 15:55:08 +02:00
parent 54374abf86
commit 8f3236b5b4
8 changed files with 156 additions and 160 deletions
Download patch file Download diff file Expand all files Collapse all files

60
frontend/src/views/InventoryDetail.vue
View file

@ -6,6 +6,10 @@
<div class="card">
<div class="card-header">{{ item.name }}</div>
<div class="card-body">
<div class="mb-3">
<label for="owner" class="form-label">Owner</label>
{{ item.owner || item.owner_group }}
</div>
<div class="mb-3">
<label for="description" class="form-label">Description</label>
{{ item.description }}
@ -36,8 +40,8 @@
</div>
</div>
</div>
<div class="card">
<button class="btn btn-primary" @click="$router.push('/inventory/' + id + '/edit')">
<div class="card" v-if="canEdit">
<button class="btn btn-primary" @click="$router.push(`/inventory/${handle}/${id}/edit`)">
<b-icon-pencil-square></b-icon-pencil-square>
Edit
</button>
@ -46,8 +50,8 @@
<b-icon-trash></b-icon-trash>
Delete
</button>
<button class="btn btn-secondary"
@click="$router.push({path: '/print', query: {kind: 'item', userHandle: user, id}})">
<button v-if="canPrint" class="btn btn-secondary"
@click="$router.push({path: '/print', query: {kind: 'item', userHandle: decodedHandle, id}})">
<b-icon-printer></b-icon-printer>
Print label
</button>
@ -64,6 +68,7 @@ import * as BIcons from "bootstrap-icons-vue";
import BaseLayout from "@/components/BaseLayout.vue";
import {mapActions, mapGetters, mapState} from "vuex";
import AuthenticatedImage from "@/components/AuthenticatedImage.vue";
import {decodeHandleFromUrl} from "@/router";
export default {
name: "InventoryDetail",
@ -73,27 +78,52 @@ export default {
...BIcons
},
props: {
handle: {
type: String,
required: true
},
id: {
type: String,
required: true
}
},
data() {
return {
item: {}
}
},
computed: {
...mapGetters(["loaded_items", "getNameFromHandle"]),
...mapState(["storage_locations", "user"]),
item() {
return this.loaded_items.find(item => item.id === parseInt(this.id)) || {}
...mapGetters(["getNameFromHandle", "groupIdByHandle"]),
...mapState(["user"]),
decodedHandle() {
return decodeHandleFromUrl(this.handle)
},
location() {
return this.storage_locations.find(loc => loc.id === this.item.storage_location) || null
// Edit/Delete apply once the viewer is actually authorized to act on this item - their
// own item, or a group they belong to - not just anyone who can view it
// (get_shared_item's friends_or_self() also lets a friend view a shared item, but never
// act on it).
canEdit() {
return this.decodedHandle === this.user || this.decodedHandle in this.groupIdByHandle
},
// Printed labels only support a personal owner handle so far (see label.js's
// splitUserHandle/Inventory.vue's printLinkFor) - group items don't get a print link
// until that's supported too.
canPrint() {
return this.decodedHandle === this.user
}
},
methods: {
...mapActions(["fetchInventoryItems", "deleteInventoryItem", "fetchFilesByItem", "fetchStorageLocations"]),
...mapActions(["fetchItemByHandle", "deleteInventoryItem"]),
async loadItem() {
this.item = await this.fetchItemByHandle({handle: this.decodedHandle, id: this.id}) || {}
}
},
async mounted() {
await this.fetchInventoryItems()
await this.fetchStorageLocations()
watch: {
handle: 'loadItem',
id: 'loadItem'
},
mounted() {
this.loadItem()
}
}
</script>
@ -104,4 +134,4 @@ img {
height: 107px;
object-fit: contain;
}
</style>
</style>