mirror of
https://github.com/scinote-eln/scinote-web.git
synced 2024-11-15 21:56:12 +08:00
45 lines
1.8 KiB
Vue
45 lines
1.8 KiB
Vue
<template>
|
|
<div class="pl-6" v-if="storageLocationTrees.length" v-for="storageLocationTree in storageLocationTrees"
|
|
:key="storageLocationTree.storage_location.id">
|
|
<div class="flex items-center">
|
|
<i v-if="storageLocationTree.children.length > 0"
|
|
:class="{'sn-icon-up': opendedStorageLocations[storageLocationTree.storage_location.id],
|
|
'sn-icon-down': !opendedStorageLocations[storageLocationTree.storage_location.id]}"
|
|
@click="opendedStorageLocations[storageLocationTree.storage_location.id] = !opendedStorageLocations[storageLocationTree.storage_location.id]"
|
|
class="sn-icon p-2 pr-1 cursor-pointer"></i>
|
|
<i v-else class="sn-icon sn-icon-up p-2 pr-1 opacity-0"></i>
|
|
<div @click="$emit('selectStorageLocation', storageLocationTree.storage_location.id)"
|
|
class="cursor-pointer flex items-center pl-1 flex-1 gap-2
|
|
text-sn-blue hover:bg-sn-super-light-grey"
|
|
:class="{'!bg-sn-super-light-blue': storageLocationTree.storage_location.id == value}">
|
|
<i class="sn-icon sn-icon-folder"></i>
|
|
<div class="flex-1 truncate p-2 pl-0" :title="storageLocationTree.storage_location.name">
|
|
{{ storageLocationTree.storage_location.name }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<MoveTree v-if="opendedStorageLocations[storageLocationTree.storage_location.id]"
|
|
:storageLocationTrees="storageLocationTree.children"
|
|
:value="value"
|
|
@selectStorageLocation="$emit('selectStorageLocation', $event)" />
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'MoveTree',
|
|
emits: ['selectStorageLocation'],
|
|
props: {
|
|
storageLocationTrees: Array,
|
|
value: Number
|
|
},
|
|
components: {
|
|
MoveTree: () => import('./move_tree.vue')
|
|
},
|
|
data() {
|
|
return {
|
|
opendedStorageLocations: {}
|
|
};
|
|
}
|
|
};
|
|
</script>
|