mirror of
https://github.com/VueTorrent/VueTorrent.git
synced 2024-10-22 18:56:38 +03:00
Right-click context menu doesnt close when opening another #41
This commit is contained in:
parent
2117a5c46b
commit
faedfa7172
3 changed files with 78 additions and 81 deletions
112
package.json
112
package.json
|
@ -1,58 +1,58 @@
|
||||||
{
|
{
|
||||||
"name": "vuetorrent",
|
"name": "vuetorrent",
|
||||||
"version": "0.3.0",
|
"version": "0.3.1",
|
||||||
"private": true,
|
"private": true,
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"serve": "vue-cli-service serve",
|
"serve": "vue-cli-service serve",
|
||||||
"build": "vue-cli-service build",
|
"build": "vue-cli-service build",
|
||||||
"lint": "vue-cli-service lint",
|
"lint": "vue-cli-service lint",
|
||||||
"format": "pretty-quick"
|
"format": "pretty-quick"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@babel/polyfill": "^7.11.5",
|
"@babel/polyfill": "^7.11.5",
|
||||||
"apexcharts": "^3.20.2",
|
"apexcharts": "^3.20.2",
|
||||||
"axios": "^0.19.2",
|
"axios": "^0.19.2",
|
||||||
"core-js": "^3.6.4",
|
"core-js": "^3.6.4",
|
||||||
"dayjs": "^1.8.35",
|
"dayjs": "^1.8.35",
|
||||||
"fuse.js": "^6.4.1",
|
"fuse.js": "^6.4.1",
|
||||||
"lodash": "^4.17.20",
|
"lodash": "^4.17.20",
|
||||||
"register-service-worker": "^1.7.1",
|
"register-service-worker": "^1.7.1",
|
||||||
"uuid": "^8.3.0",
|
"uuid": "^8.3.0",
|
||||||
"vue": "^2.6.12",
|
"vue": "^2.6.12",
|
||||||
"vue-apexcharts": "^1.6.0",
|
"vue-apexcharts": "^1.6.0",
|
||||||
"vue-async-computed": "^3.9.0",
|
"vue-async-computed": "^3.9.0",
|
||||||
"vue-context": "^5.2.0",
|
"vue-context": "^5.2.0",
|
||||||
"vue-observe-visibility": "^0.4.6",
|
"vue-observe-visibility": "^0.4.6",
|
||||||
"vue-router": "^3.3.4",
|
"vue-router": "^3.3.4",
|
||||||
"vue-toastification": "^1.7.7",
|
"vue-toastification": "^1.7.7",
|
||||||
"vue2-perfect-scrollbar": "^1.5.0",
|
"vue2-perfect-scrollbar": "^1.5.0",
|
||||||
"vuetify": "^2.3.4",
|
"vuetify": "^2.3.4",
|
||||||
"vuex": "^3.5.1",
|
"vuex": "^3.5.1",
|
||||||
"vuex-persist": "^2.2.0"
|
"vuex-persist": "^2.2.0"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@vue/cli-plugin-babel": "~4.3.0",
|
"@vue/cli-plugin-babel": "~4.3.0",
|
||||||
"@vue/cli-plugin-eslint": "~4.3.0",
|
"@vue/cli-plugin-eslint": "~4.3.0",
|
||||||
"@vue/cli-plugin-pwa": "^4.5.6",
|
"@vue/cli-plugin-pwa": "^4.5.6",
|
||||||
"@vue/cli-service": "~4.3.0",
|
"@vue/cli-service": "~4.3.0",
|
||||||
"@vue/eslint-config-prettier": "^6.0.0",
|
"@vue/eslint-config-prettier": "^6.0.0",
|
||||||
"babel-eslint": "^10.1.0",
|
"babel-eslint": "^10.1.0",
|
||||||
"eslint": "^6.7.2",
|
"eslint": "^6.7.2",
|
||||||
"eslint-plugin-prettier": "^3.1.4",
|
"eslint-plugin-prettier": "^3.1.4",
|
||||||
"eslint-plugin-vue": "^6.2.2",
|
"eslint-plugin-vue": "^6.2.2",
|
||||||
"fibers": "^5.0.0",
|
"fibers": "^5.0.0",
|
||||||
"node-sass": "^4.14.1",
|
"node-sass": "^4.14.1",
|
||||||
"prettier": "^2.1.1",
|
"prettier": "^2.1.1",
|
||||||
"pretty-quick": "^2.0.2",
|
"pretty-quick": "^2.0.2",
|
||||||
"sass": "^1.26.10",
|
"sass": "^1.26.10",
|
||||||
"sass-loader": "^8.0.2",
|
"sass-loader": "^8.0.2",
|
||||||
"vue-cli-plugin-vuetify": "^2.0.7",
|
"vue-cli-plugin-vuetify": "^2.0.7",
|
||||||
"vue-template-compiler": "^2.6.12"
|
"vue-template-compiler": "^2.6.12"
|
||||||
},
|
},
|
||||||
"browserslist": [
|
"browserslist": [
|
||||||
"> 1%",
|
"> 1%",
|
||||||
"last 2 versions",
|
"last 2 versions",
|
||||||
"not dead",
|
"not dead",
|
||||||
"not ie <= 10"
|
"not ie <= 10"
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
|
@ -10,7 +10,6 @@
|
||||||
<v-tooltip top>
|
<v-tooltip top>
|
||||||
<template v-slot:activator="{ on }">
|
<template v-slot:activator="{ on }">
|
||||||
<v-layout
|
<v-layout
|
||||||
@contextmenu.prevent="$refs.menu.open"
|
|
||||||
v-on="on"
|
v-on="on"
|
||||||
row
|
row
|
||||||
wrap
|
wrap
|
||||||
|
@ -128,27 +127,16 @@
|
||||||
<span>{{ torrent.name }}</span>
|
<span>{{ torrent.name }}</span>
|
||||||
</v-tooltip>
|
</v-tooltip>
|
||||||
<v-divider></v-divider>
|
<v-divider></v-divider>
|
||||||
<vue-context ref="menu">
|
|
||||||
<TorrentRightClickMenu :hash="torrent.hash" />
|
|
||||||
</vue-context>
|
|
||||||
</v-card>
|
</v-card>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { VueContext } from 'vue-context'
|
|
||||||
import 'vue-context/src/sass/vue-context.scss'
|
|
||||||
import TorrentRightClickMenu from '@/components/Torrent/TorrentRightClickMenu.vue'
|
|
||||||
|
|
||||||
import { General } from '@/mixins'
|
import { General } from '@/mixins'
|
||||||
|
|
||||||
import { mapGetters } from 'vuex'
|
import { mapGetters } from 'vuex'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'Torrent',
|
name: 'Torrent',
|
||||||
components: {
|
|
||||||
VueContext,
|
|
||||||
TorrentRightClickMenu
|
|
||||||
},
|
|
||||||
mixins: [General],
|
mixins: [General],
|
||||||
|
|
||||||
props: {
|
props: {
|
||||||
|
@ -244,13 +232,3 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
.v-context {
|
|
||||||
&,
|
|
||||||
& ul {
|
|
||||||
border-radius: 0.3rem;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
|
@ -8,7 +8,6 @@
|
||||||
class="my-4 pt-5 pa-0"
|
class="my-4 pt-5 pa-0"
|
||||||
@click.self="resetSelected"
|
@click.self="resetSelected"
|
||||||
>
|
>
|
||||||
<!-- justify-center here in layout to center!! -->
|
|
||||||
<v-flex xs12 sm6 md3 @click.self="resetSelected">
|
<v-flex xs12 sm6 md3 @click.self="resetSelected">
|
||||||
<v-text-field
|
<v-text-field
|
||||||
flat
|
flat
|
||||||
|
@ -24,11 +23,18 @@
|
||||||
<p class="grey--text">No active Torrents!</p>
|
<p class="grey--text">No active Torrents!</p>
|
||||||
</div>
|
</div>
|
||||||
<div v-else>
|
<div v-else>
|
||||||
<div v-for="torrent in torrents" :key="torrent.hash">
|
<div
|
||||||
|
@contextmenu.prevent="$refs.menu.open($event, { torrent })"
|
||||||
|
v-for="torrent in torrents"
|
||||||
|
:key="torrent.hash"
|
||||||
|
>
|
||||||
<Torrent :torrent="torrent" />
|
<Torrent :torrent="torrent" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</v-container>
|
</v-container>
|
||||||
|
<vue-context ref="menu" v-slot="{ data }">
|
||||||
|
<TorrentRightClickMenu v-if="data" :hash="data.torrent.hash" />
|
||||||
|
</vue-context>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -36,10 +42,13 @@
|
||||||
import { mapState, mapGetters } from 'vuex'
|
import { mapState, mapGetters } from 'vuex'
|
||||||
import Torrent from '@/components/Torrent'
|
import Torrent from '@/components/Torrent'
|
||||||
import Fuse from 'fuse.js'
|
import Fuse from 'fuse.js'
|
||||||
|
import { VueContext } from 'vue-context'
|
||||||
|
import 'vue-context/src/sass/vue-context.scss'
|
||||||
|
import TorrentRightClickMenu from '@/components/Torrent/TorrentRightClickMenu.vue'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'Dashboard',
|
name: 'Dashboard',
|
||||||
components: { Torrent },
|
components: { Torrent, VueContext, TorrentRightClickMenu },
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
input: ''
|
input: ''
|
||||||
|
@ -81,3 +90,13 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.v-context {
|
||||||
|
&,
|
||||||
|
& ul {
|
||||||
|
border-radius: 0.3rem;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
Loading…
Reference in a new issue