2017-06-23 21:00:42 +00:00
|
|
|
<template>
|
2017-06-29 21:26:57 +00:00
|
|
|
<div class="main library pusher">
|
2017-06-23 21:00:42 +00:00
|
|
|
<div class="ui secondary pointing menu">
|
2017-06-29 21:26:57 +00:00
|
|
|
<router-link class="ui item" to="/library" exact>Browse</router-link>
|
2017-12-12 22:41:47 +00:00
|
|
|
<router-link class="ui item" to="/library/artists" exact>Artists</router-link>
|
2018-01-07 21:13:44 +00:00
|
|
|
<router-link class="ui item" to="/library/radios" exact>Radios</router-link>
|
2017-12-12 22:41:47 +00:00
|
|
|
<div class="ui secondary right menu">
|
2018-02-22 22:35:56 +00:00
|
|
|
<router-link class="ui item" to="/library/requests/" exact>
|
|
|
|
Requests
|
|
|
|
<div class="ui teal label">{{ requestsCount }}</div>
|
|
|
|
</router-link>
|
2017-12-23 16:47:13 +00:00
|
|
|
<router-link v-if="$store.state.auth.availablePermissions['import.launch']" class="ui item" to="/library/import/launch" exact>Import</router-link>
|
2018-02-22 22:35:56 +00:00
|
|
|
<router-link v-if="$store.state.auth.availablePermissions['import.launch']" class="ui item" to="/library/import/batches">Import batches
|
|
|
|
</router-link>
|
2017-12-12 22:41:47 +00:00
|
|
|
</div>
|
2017-06-23 21:00:42 +00:00
|
|
|
</div>
|
2017-12-17 18:42:58 +00:00
|
|
|
<router-view :key="$route.fullPath"></router-view>
|
2017-06-23 21:00:42 +00:00
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
2018-02-22 22:35:56 +00:00
|
|
|
import axios from 'axios'
|
2017-06-23 21:00:42 +00:00
|
|
|
export default {
|
2018-02-22 22:35:56 +00:00
|
|
|
name: 'library',
|
|
|
|
data () {
|
|
|
|
return {
|
|
|
|
requestsCount: 0
|
|
|
|
}
|
|
|
|
},
|
|
|
|
created () {
|
|
|
|
this.fetchRequestsCount()
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
fetchRequestsCount () {
|
|
|
|
let self = this
|
|
|
|
axios.get('requests/import-requests', {params: {status: 'pending'}}).then(response => {
|
|
|
|
self.requestsCount = response.data.count
|
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
2017-06-23 21:00:42 +00:00
|
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
|
|
|
<style lang="scss">
|
2018-02-15 21:34:14 +00:00
|
|
|
@import '../../style/vendor/media';
|
|
|
|
|
2017-06-29 21:26:57 +00:00
|
|
|
.library.pusher > .ui.secondary.menu {
|
2018-02-15 21:34:14 +00:00
|
|
|
@include media(">tablet") {
|
|
|
|
margin: 0 2.5rem;
|
|
|
|
}
|
2017-12-24 21:59:49 +00:00
|
|
|
.item {
|
|
|
|
padding-top: 1.5em;
|
|
|
|
padding-bottom: 1.5em;
|
|
|
|
}
|
2017-06-23 21:00:42 +00:00
|
|
|
}
|
|
|
|
|
2017-06-29 21:26:57 +00:00
|
|
|
.library {
|
2017-06-23 21:00:42 +00:00
|
|
|
.ui.segment.head {
|
|
|
|
background-size: cover;
|
|
|
|
background-position: center;
|
|
|
|
padding: 0;
|
|
|
|
.segment-content {
|
|
|
|
margin: 0 auto;
|
2018-02-15 21:34:14 +00:00
|
|
|
padding: 2em;
|
|
|
|
@include media(">tablet") {
|
|
|
|
padding: 4em;
|
|
|
|
}
|
2017-06-23 21:00:42 +00:00
|
|
|
}
|
|
|
|
&.with-background {
|
|
|
|
.header {
|
|
|
|
&, .sub, a {
|
|
|
|
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.8);
|
|
|
|
color: white !important;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.segment-content {
|
|
|
|
background-color: rgba(0, 0, 0, 0.5)
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
</style>
|