113 lines
3.0 KiB
Vue
113 lines
3.0 KiB
Vue
<template>
|
|
<div class="mb-2">
|
|
<v-expand-transition>
|
|
<div v-show="expand" class="">
|
|
<div v-for="(resource, index) in resources" :key="index">
|
|
<commit-info-resource
|
|
v-if="resource.type === 'commit'"
|
|
:resource="resource"
|
|
@remove="
|
|
(e) => {
|
|
$emit('remove', e)
|
|
removedResources.push(e)
|
|
}
|
|
"
|
|
></commit-info-resource>
|
|
<object-info-resource
|
|
v-if="resource.type === 'object'"
|
|
:resource="resource"
|
|
@remove="
|
|
(e) => {
|
|
$emit('remove', e)
|
|
removedResources.push(e)
|
|
}
|
|
"
|
|
></object-info-resource>
|
|
</div>
|
|
<div class="px-2 mb-2">
|
|
<v-btn
|
|
v-tooltip="'Overlay another commit or object'"
|
|
block
|
|
rounded
|
|
class="primary"
|
|
@click="$emit('show-add-overlay')"
|
|
>
|
|
add
|
|
</v-btn>
|
|
</div>
|
|
<!-- <resource
|
|
v-for="(resource, index) in resources"
|
|
:key="index"
|
|
:resource="resource"
|
|
:is-multiple="resources.length > 1"
|
|
:expand-initial="resources.length === 1 || true"
|
|
@remove="
|
|
(e) => {
|
|
$emit('remove', e)
|
|
removedResources.push(e)
|
|
}
|
|
"
|
|
/> -->
|
|
<div v-show="removedResources.length !== 0" class="px-3 caption pb-5">
|
|
Removed resources:
|
|
<span
|
|
v-for="(res, index) in removedResources"
|
|
:key="index"
|
|
v-tooltip="'Click to re-add'"
|
|
>
|
|
<a
|
|
@click="
|
|
$emit('add-resource', res.id)
|
|
removedResources.splice(
|
|
removedResources.findIndex((r) => r.id === res.id),
|
|
1
|
|
)
|
|
"
|
|
>
|
|
<span v-if="res.type === 'object'">Object</span>
|
|
<!-- eslint-disable-next-line prettier/prettier -->
|
|
<span v-else>
|
|
<v-icon x-small>mdi-source-commit</v-icon>
|
|
{{ res.id }}
|
|
</span>
|
|
</a>
|
|
<!-- eslint-disable-next-line prettier/prettier -->
|
|
<span
|
|
v-if="removedResources.length > 1 && index < removedResources.length - 1"
|
|
>
|
|
,
|
|
</span>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</v-expand-transition>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
export default {
|
|
components: {
|
|
CommitInfoResource: () => import('@/main/components/viewer/CommitInfoResource'),
|
|
ObjectInfoResource: () => import('@/main/components/viewer/ObjectInfoResource')
|
|
},
|
|
props: {
|
|
resources: { type: Array, default: () => [] }
|
|
},
|
|
data() {
|
|
return {
|
|
expand: true,
|
|
removedResources: []
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style scoped>
|
|
.list-overlay-dark {
|
|
background: rgba(40, 40, 40, 1);
|
|
z-index: 5;
|
|
}
|
|
.list-overlay-light {
|
|
background: rgba(235, 235, 235, 1);
|
|
z-index: 5;
|
|
}
|
|
</style>
|