mirror of
https://github.com/VueTorrent/VueTorrent.git
synced 2024-11-28 21:18:54 +03:00
logging out + available disk space + torrent download location
This commit is contained in:
Daan Wijns
parent
3456fa83bf
commit
bbbe89a290
7 changed files with 119 additions and 73 deletions
140
README.md
140
README.md
|
|
@ -1,71 +1,71 @@
|
||||||
# VueTorrent
|
# VueTorrent
|
||||||
|
|
||||||
The sleekest looking WEBUI for qBittorrent made with Vuejs!
|
The sleekest looking WEBUI for qBittorrent made with Vuejs!
|
||||||
|
|
||||||
> Vue, qBitorrent, Vuetify
|
> Vue, qBitorrent, Vuetify
|
||||||
|
|
||||||
## Screenshots
|
## Screenshots
|
||||||
|
|
||||||
<p align="center">
|
<p align="center">
|
||||||
|
|
||||||
<a href="https://i.imgur.com/vPBcrK4.png"><img src="https://i.imgur.com/vPBcrK4.png" title="Desktop" alt="Desktop Screenshot" ></a>
|
<a href="https://i.imgur.com/vPBcrK4.png"><img src="https://i.imgur.com/vPBcrK4.png" title="Desktop" alt="Desktop Screenshot" ></a>
|
||||||
|
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<p align="center">
|
<p align="center">
|
||||||
|
|
||||||
<a href="https://i.imgur.com/SUOEyy9.png"><img src="https://i.imgur.com/SUOEyy9.png" title="Mobile" alt="Mobile Screenshot" width="320" height="540"></a>
|
<a href="https://i.imgur.com/SUOEyy9.png"><img src="https://i.imgur.com/SUOEyy9.png" title="Mobile" alt="Mobile Screenshot" width="320" height="540"></a>
|
||||||
|
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
## Installation
|
## Installation
|
||||||
|
|
||||||
- Download & Unzip the latest release
|
- Download & Unzip the latest release
|
||||||
|
|
||||||
- Point your Alternate WEBUI location to it
|
- Point your Alternate WEBUI location to it
|
||||||
|
|
||||||
## Development
|
## Development
|
||||||
|
|
||||||
- clone the repo
|
- clone the repo
|
||||||
|
|
||||||
- npm install
|
- npm install
|
||||||
|
|
||||||
- npm run serve
|
- npm run serve
|
||||||
|
|
||||||
## Features
|
## Features
|
||||||
|
|
||||||
- viewing sessions stats ( down / upload speed, session uploaded / downloaded )
|
- viewing sessions stats ( down / upload speed, session uploaded / downloaded )
|
||||||
- adding / removing / pausing / resuming torrents
|
- adding / removing / pausing / resuming torrents
|
||||||
|
|
||||||
- sorting by every property shown!
|
- sorting by every property shown!
|
||||||
|
|
||||||
* mobile friendly! (maybe not for thousands of torrents...)
|
* mobile friendly! (maybe not for thousands of torrents...)
|
||||||
|
|
||||||
- works on QBittorrent V4.2 and later
|
- works on QBittorrent V4.2 and later
|
||||||
|
|
||||||
## Contributing
|
## Contributing
|
||||||
|
|
||||||
I'll gladly accept help/pull requests & advice! (this is my first project of this nature, pls be kind 😛 ).
|
I'll gladly accept help/pull requests & advice! (this is my first project of this nature, pls be kind 😛 ).
|
||||||
|
|
||||||
## FAQ
|
## FAQ
|
||||||
|
|
||||||
- **Why build this??**
|
- **Why build this??**
|
||||||
|
|
||||||
* Why not? Most WebUI's look very dated and now it's no longer necessary to search for a remote control app!
|
* Why not? Most WebUI's look very dated and now it's no longer necessary to search for a remote control app!
|
||||||
|
|
||||||
## Support
|
## Support
|
||||||
|
|
||||||
Reach out to me at one of the following places!
|
Reach out to me at one of the following places!
|
||||||
|
|
||||||
- <a href="https://m.me/WijnsDaan" target="_blank">`Facebook Messenger`</a>
|
- <a href="https://m.me/WijnsDaan" target="_blank">`Facebook Messenger`</a>
|
||||||
|
|
||||||
* Open up an issue 😛
|
* Open up an issue 😛
|
||||||
|
|
||||||
[<img src="https://cdn.buymeacoffee.com/buttons/lato-blue.png" alt="drawing" width="180"/>](https://www.buymeacoffee.com/wdaan 'Buy me a coffee')
|
[<img src="https://cdn.buymeacoffee.com/buttons/lato-blue.png" alt="drawing" width="180"/>](https://www.buymeacoffee.com/wdaan 'Buy me a coffee')
|
||||||
|
|
||||||
## Credits
|
## Credits
|
||||||
|
|
||||||
- Dashboard design heavily inspired by: '[Net Ninja - Vuetify](https://github.com/iamshaunjp/vuetify-playlist)'.
|
- Dashboard design heavily inspired by: '[Net Ninja - Vuetify](https://github.com/iamshaunjp/vuetify-playlist)'.
|
||||||
Also check out The Net Ninja's Youtube Channel.
|
Also check out The Net Ninja's Youtube Channel.
|
||||||
|
|
||||||
* This repo '[CzBiX qb-web ](https://github.com/CzBiX/qb-web)'
|
* This repo '[CzBiX qb-web ](https://github.com/CzBiX/qb-web)'
|
||||||
|
|
@ -57,6 +57,7 @@
|
||||||
|
|
||||||
<v-text-field
|
<v-text-field
|
||||||
v-model="directory"
|
v-model="directory"
|
||||||
|
:placeholder="savepath"
|
||||||
label="Download Directory"
|
label="Download Directory"
|
||||||
prepend-icon="folder"
|
prepend-icon="folder"
|
||||||
></v-text-field>
|
></v-text-field>
|
||||||
|
|
@ -83,6 +84,7 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import { mapGetters } from 'vuex'
|
||||||
import Modal from "@/mixins/Modal";
|
import Modal from "@/mixins/Modal";
|
||||||
import qbit from '@/services/qbit'
|
import qbit from '@/services/qbit'
|
||||||
export default {
|
export default {
|
||||||
|
|
@ -111,6 +113,7 @@ export default {
|
||||||
let params= { urls: null};
|
let params= { urls: null};
|
||||||
if(this.files.length) torrents.push(...this.files)
|
if(this.files.length) torrents.push(...this.files)
|
||||||
if(this.url) params.urls = this.url
|
if(this.url) params.urls = this.url
|
||||||
|
if(this.directory) params.savepath = this.directory
|
||||||
|
|
||||||
qbit.addTorrents(params, torrents)
|
qbit.addTorrents(params, torrents)
|
||||||
|
|
||||||
|
|
@ -121,12 +124,16 @@ export default {
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
...mapGetters(['getSettings']),
|
||||||
validFile() {
|
validFile() {
|
||||||
return this.Files.length > 0;
|
return this.Files.length > 0;
|
||||||
},
|
},
|
||||||
phoneLayout() {
|
phoneLayout() {
|
||||||
return this.$vuetify.breakpoint.xsOnly;
|
return this.$vuetify.breakpoint.xsOnly;
|
||||||
},
|
},
|
||||||
|
savepath(){
|
||||||
|
return this.getSettings().savePath
|
||||||
|
}
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -144,6 +144,29 @@
|
||||||
</v-flex>
|
</v-flex>
|
||||||
</v-layout>
|
</v-layout>
|
||||||
</v-card>
|
</v-card>
|
||||||
|
|
||||||
|
<v-card flat style="margin-top: 30px;" color="secondary" class="ml-2 mr-2">
|
||||||
|
<v-layout row wrap class="pa-3 project nav_upload mx-auto">
|
||||||
|
<v-flex md6>
|
||||||
|
<div style="font-size: 0.95em; margin-top: 6px;" class="upload--text">Diskspace</div>
|
||||||
|
</v-flex>
|
||||||
|
<v-flex md5 class="ml-4">
|
||||||
|
<span class="upload--text title">
|
||||||
|
{{
|
||||||
|
stats.freeDiskSpace.substring(
|
||||||
|
0,
|
||||||
|
stats.freeDiskSpace.indexOf(' ')
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
<span class="font-weight-light caption">{{
|
||||||
|
stats.freeDiskSpace.substring(
|
||||||
|
stats.freeDiskSpace.indexOf(' ')
|
||||||
|
)
|
||||||
|
}}</span>
|
||||||
|
</span>
|
||||||
|
</v-flex>
|
||||||
|
</v-layout>
|
||||||
|
</v-card>
|
||||||
</v-flex>
|
</v-flex>
|
||||||
<v-container>
|
<v-container>
|
||||||
<v-row justify="space-between" style="position:fixed; bottom: 0px; right: 15px;">
|
<v-row justify="space-between" style="position:fixed; bottom: 0px; right: 15px;">
|
||||||
|
|
|
||||||
|
|
@ -6,6 +6,7 @@ export default class Stat {
|
||||||
this.uploaded = this.formatBytes(data.up_info_data, 1)
|
this.uploaded = this.formatBytes(data.up_info_data, 1)
|
||||||
this.dlspeed = this.formatBytes(data.dl_info_speed, 1)
|
this.dlspeed = this.formatBytes(data.dl_info_speed, 1)
|
||||||
this.upspeed = this.formatBytes(data.up_info_speed, 1)
|
this.upspeed = this.formatBytes(data.up_info_speed, 1)
|
||||||
|
this.freeDiskSpace = this.formatBytes(data.free_space_on_disk)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -28,6 +28,10 @@ class Qbit {
|
||||||
return data
|
return data
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async logout(){
|
||||||
|
this.axios.post('/auth/logout')
|
||||||
|
}
|
||||||
|
|
||||||
getGlobalTransferInfo() {
|
getGlobalTransferInfo() {
|
||||||
return this.axios.get('/transfer/info')
|
return this.axios.get('/transfer/info')
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -34,13 +34,15 @@ export default new Vuex.Store({
|
||||||
addmodal: false,
|
addmodal: false,
|
||||||
deletemodal: false,
|
deletemodal: false,
|
||||||
settingsmodal: false
|
settingsmodal: false
|
||||||
}
|
},
|
||||||
|
settings : {}
|
||||||
},
|
},
|
||||||
getters: {
|
getters: {
|
||||||
containsTorrent: state => hash =>
|
containsTorrent: state => hash =>
|
||||||
state.selected_torrents.includes(hash),
|
state.selected_torrents.includes(hash),
|
||||||
getTheme: state => () => state.darkTheme,
|
getTheme: state => () => state.darkTheme,
|
||||||
getModalState: state => name => state.modals[name.toLowerCase()]
|
getModalState: state => name => state.modals[name.toLowerCase()],
|
||||||
|
getSettings: state => () => state.settings
|
||||||
},
|
},
|
||||||
|
|
||||||
mutations: {
|
mutations: {
|
||||||
|
|
@ -69,6 +71,7 @@ export default new Vuex.Store({
|
||||||
state.darkTheme = !state.darkTheme
|
state.darkTheme = !state.darkTheme
|
||||||
},
|
},
|
||||||
LOGOUT: state => {
|
LOGOUT: state => {
|
||||||
|
qbit.logout()
|
||||||
state.authenticated = false
|
state.authenticated = false
|
||||||
},
|
},
|
||||||
LOGIN: async (state, payload) => {
|
LOGIN: async (state, payload) => {
|
||||||
|
|
@ -118,7 +121,11 @@ export default new Vuex.Store({
|
||||||
)
|
)
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
|
SET_SETTINGS: async state => {
|
||||||
|
const {data} = await qbit.getAppPreferences()
|
||||||
|
state.settings.savePath = data.save_path;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
actions: {
|
actions: {
|
||||||
INIT_INTERVALS: async context => {
|
INIT_INTERVALS: async context => {
|
||||||
|
|
@ -133,9 +140,11 @@ export default new Vuex.Store({
|
||||||
Vue.$toast.success('Successfully logged in!')
|
Vue.$toast.success('Successfully logged in!')
|
||||||
context.commit('LOGIN', true)
|
context.commit('LOGIN', true)
|
||||||
context.commit('updateMainData')
|
context.commit('updateMainData')
|
||||||
|
context.commit('SET_SETTINGS')
|
||||||
return true;
|
return true;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
Vue.$toast.error('Log in failed 😕')
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -20,6 +20,7 @@
|
||||||
:rules="inputRules"
|
:rules="inputRules"
|
||||||
@keyup.enter.native="Login"
|
@keyup.enter.native="Login"
|
||||||
autocomplete="current email"
|
autocomplete="current email"
|
||||||
|
name="username"
|
||||||
></v-text-field>
|
></v-text-field>
|
||||||
<v-text-field
|
<v-text-field
|
||||||
flat
|
flat
|
||||||
|
|
@ -32,6 +33,7 @@
|
||||||
:rules="inputRules"
|
:rules="inputRules"
|
||||||
@keyup.enter.native="Login"
|
@keyup.enter.native="Login"
|
||||||
autocomplete="current password"
|
autocomplete="current password"
|
||||||
|
name="password"
|
||||||
></v-text-field>
|
></v-text-field>
|
||||||
<v-spacer></v-spacer>
|
<v-spacer></v-spacer>
|
||||||
<v-card-actions class="justify-center">
|
<v-card-actions class="justify-center">
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue