[UI] Don't propagate click events in FileBrowser.

That could otherwise close the parent component when `FileBrowser` is
running in a `Modal`.
This commit is contained in:
Fabio Manganiello 2024-09-23 03:19:23 +02:00
parent d1da4803cf
commit 419c227ff8
Signed by untrusted user: blacklight
GPG key ID: D90FBA7F76362774

View file

@ -5,7 +5,7 @@
<div class="nav" ref="nav"> <div class="nav" ref="nav">
<div class="path-container"> <div class="path-container">
<span class="path" v-if="hasHomepage"> <span class="path" v-if="hasHomepage">
<span class="token" @click="path = null"> <span class="token" @click.stop="path = null">
<i class="fa fa-home" /> <i class="fa fa-home" />
</span> </span>
@ -17,7 +17,7 @@
<span class="path" <span class="path"
v-for="(token, i) in pathTokens" v-for="(token, i) in pathTokens"
:key="i" :key="i"
@click="path = pathTokens.slice(0, i + 1).join('/').slice(1)"> @click.stop="path = pathTokens.slice(0, i + 1).join('/').slice(1)">
<span class="token"> <span class="token">
{{ token }} {{ token }}
</span> </span>
@ -30,7 +30,7 @@
</div> </div>
<div class="btn-container"> <div class="btn-container">
<Dropdown :style="{'min-width': '11em'}"> <Dropdown :style="{'min-width': '11em'}" @click.prevent>
<DropdownItem icon-class="fa fa-plus" text="New Folder" @input="showCreateDirectory = true" /> <DropdownItem icon-class="fa fa-plus" text="New Folder" @input="showCreateDirectory = true" />
<DropdownItem icon-class="fa fa-file" text="Create File" @input="showCreateFile = true" /> <DropdownItem icon-class="fa fa-file" text="Create File" @input="showCreateFile = true" />
<DropdownItem icon-class="fa fa-upload" text="Upload" @input="showUpload = true" /> <DropdownItem icon-class="fa fa-upload" text="Upload" @input="showUpload = true" />
@ -49,7 +49,7 @@
<div class="items" ref="items" v-else> <div class="items" ref="items" v-else>
<div class="row item" <div class="row item"
@click="onBack" @click.stop="onBack"
v-if="(path?.length && path !== '/') || hasBack"> v-if="(path?.length && path !== '/') || hasBack">
<div class="col-10 left side"> <div class="col-10 left side">
<i class="icon fa fa-folder" /> <i class="icon fa fa-folder" />
@ -59,7 +59,7 @@
<div class="row item" <div class="row item"
ref="selectCurrent" ref="selectCurrent"
@click="onSelectCurrentDirectory" @click.stop="onSelectCurrentDirectory"
v-if="hasSelectCurrentDirectory"> v-if="hasSelectCurrentDirectory">
<div class="col-10 left side"> <div class="col-10 left side">
<i class="icon fa fa-hand-point-right" /> <i class="icon fa fa-hand-point-right" />
@ -67,7 +67,7 @@
</div> </div>
</div> </div>
<div class="row item" v-for="(file, i) in filteredFiles" :key="i" @click="onItemSelect(file)"> <div class="row item" v-for="(file, i) in filteredFiles" :key="i" @click.stop="onItemSelect(file)">
<div class="col-10"> <div class="col-10">
<i class="icon fa" :class="fileIcons[file.path]" /> <i class="icon fa" :class="fileIcons[file.path]" />
<span class="name"> <span class="name">
@ -76,7 +76,7 @@
</div> </div>
<div class="col-2 actions" v-if="Object.keys(fileActions[file.path] || {})?.length"> <div class="col-2 actions" v-if="Object.keys(fileActions[file.path] || {})?.length">
<Dropdown :style="{'min-width': '11em'}"> <Dropdown :style="{'min-width': '11em'}" @click.prevent>
<DropdownItem <DropdownItem
v-for="(action, key) in fileActions[file.path]" v-for="(action, key) in fileActions[file.path]"
:key="key" :key="key"