/
ConfirmDeleteModal.vue
89 lines (88 loc) · 2 KB
/
ConfirmDeleteModal.vue
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
<template>
<v-dialog
v-model="dialog"
scrollable
content-class="rounded-form"
max-width="550px"
>
<v-card>
<v-card-title class="pa-0">
<v-toolbar-title class="ma-4">
<h3>Confirm Removal</h3>
</v-toolbar-title>
</v-card-title>
<v-card-text>
<v-list flat>
<v-list-item
v-for="t in torrents"
:key="t.hash"
else
>
<v-list-item-content>
<v-list-item-title
class="text-wrap"
v-text="t.name"
/>
</v-list-item-content>
</v-list-item>
</v-list>
</v-card-text>
<v-divider />
<v-card-actions class="justify-end">
<v-checkbox
v-model="withFiles"
class="ma-0 pa-0"
label="Also delete the files on the storage"
hide-details
/>
<v-spacer />
<v-btn
class="white--text elevation-0 px-4"
:class="withFiles ? 'error' : 'info'"
@click="deleteTorrent()"
>
Delete
</v-btn>
<v-btn
class="grey white--text elevation-0 px-4"
@click="close()"
>
Cancel
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
</template>
<script>
import { mapState, mapGetters } from 'vuex'
import Modal from '@/mixins/Modal'
import qbit from '@/services/qbit'
export default {
name: 'ConfirmDeleteModal',
mixins: [Modal],
data() {
return {
withFiles: false
}
},
computed: {
...mapState(['selected_torrents']),
...mapGetters(['getTorrents']),
torrents() {
return this.getTorrents().filter(t => this.selected_torrents.includes(t.hash))
}
},
beforeDestroy() {
this.$store.state.selected_torrents = []
},
methods: {
close() {
this.dialog = false
},
deleteTorrent() {
qbit.deleteTorrents(this.selected_torrents, this.withFiles)
this.close()
}
}
}
</script>