show loading screen

This commit is contained in:
Jonas Heinrich 2020-10-21 10:19:03 +02:00
parent 1b0eb9a82a
commit 7c2fa68383

View File

@ -9,9 +9,13 @@
href="/Top" /> href="/Top" />
</Breadcrumbs> </Breadcrumbs>
<Table <Table
v-if="!loading"
:station-data="tableData" :station-data="tableData"
@doPlay="doPlay" @doPlay="doPlay"
@doFavor="doFavor" /> @doFavor="doFavor" />
<EmptyContent
v-if="loading"
icon="icon-loading" />
</AppContent> </AppContent>
</Content> </Content>
</template> </template>
@ -21,6 +25,7 @@ import Content from '@nextcloud/vue/dist/Components/Content'
import AppContent from '@nextcloud/vue/dist/Components/AppContent' import AppContent from '@nextcloud/vue/dist/Components/AppContent'
import Breadcrumbs from '@nextcloud/vue/dist/Components/Breadcrumbs' import Breadcrumbs from '@nextcloud/vue/dist/Components/Breadcrumbs'
import Breadcrumb from '@nextcloud/vue/dist/Components/Breadcrumb' import Breadcrumb from '@nextcloud/vue/dist/Components/Breadcrumb'
import EmptyContent from '@nextcloud/vue/dist/Components/EmptyContent'
import Navigation from './Navigation' import Navigation from './Navigation'
import Table from './Table' import Table from './Table'
import { Howl } from 'howler' import { Howl } from 'howler'
@ -40,10 +45,12 @@ export default {
Breadcrumbs, Breadcrumbs,
Breadcrumb, Breadcrumb,
Table, Table,
EmptyContent,
}, },
data: () => ({ data: () => ({
tableData: [], tableData: [],
offset: 0, offset: 0,
loading: false,
}), }),
watch: { watch: {
$route: 'onRoute', $route: 'onRoute',
@ -117,6 +124,7 @@ export default {
loadStations() { loadStations() {
// FIXME https://de1.api.radio-browser.info/json/stations/lastchange?limit=10 // FIXME https://de1.api.radio-browser.info/json/stations/lastchange?limit=10
const vm = this const vm = this
vm.loading = true
this.$jquery.getJSON('https://de1.api.radio-browser.info/json/stations', this.$jquery.getJSON('https://de1.api.radio-browser.info/json/stations',
{ {
limit: 20, limit: 20,
@ -126,6 +134,8 @@ export default {
'User-Agent': 'Nextcloud Radio/1.0.0', // FIXME global version, doesnt seem to work 'User-Agent': 'Nextcloud Radio/1.0.0', // FIXME global version, doesnt seem to work
}) })
.done(function(data) { .done(function(data) {
vm.loading = false
console.log(vm.loading)
vm.tableData = vm.tableData.concat(data) vm.tableData = vm.tableData.concat(data)
vm.offset += 20 vm.offset += 20
}) })