feat: allow nested relationships for locations and items (#102)

Basic implementation that allows organizing Locations and Items within each other.
This commit is contained in:
Hayden 2022-10-23 20:54:39 -08:00 committed by GitHub
parent fe6cd431a6
commit a4b4fe3454
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
37 changed files with 2329 additions and 126 deletions

View file

@ -17,20 +17,18 @@
<Icon name="heroicons-map-pin" class="swap-off" />
</label>
{{ location.name }}
<span v-if="location.itemCount" class="badge badge-secondary badge-lg ml-auto text-secondary-content">
{{ location.itemCount }}</span
>
<span v-if="hasCount" class="badge badge-secondary badge-lg ml-auto text-secondary-content"> {{ count }}</span>
</h2>
</div>
</NuxtLink>
</template>
<script lang="ts" setup>
import { LocationOutCount } from "~~/lib/api/types/data-contracts";
import { LocationOut, LocationOutCount, LocationSummary } from "~~/lib/api/types/data-contracts";
defineProps({
const props = defineProps({
location: {
type: Object as () => LocationOutCount,
type: Object as () => LocationOutCount | LocationOut | LocationSummary,
required: true,
},
dense: {
@ -39,6 +37,16 @@
},
});
const hasCount = computed(() => {
return !!(props.location as LocationOutCount).itemCount;
});
const count = computed(() => {
if (hasCount.value) {
return (props.location as LocationOutCount).itemCount;
}
});
const card = ref(null);
const isHover = useElementHover(card);
const { focused } = useFocus(card);