You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
57 lines
2.2 KiB
57 lines
2.2 KiB
<div class="row">
|
|
|
|
<template x-if="$store.app.Queue.length > 0" >
|
|
<template x-for="album in $store.app.Queue">
|
|
<div class="col-12">
|
|
<div class="queue_card">
|
|
<div class="card mb-3 p-0">
|
|
<div class="row g-0">
|
|
<div class="col-md-3">
|
|
|
|
<div class="dl_queue_img">
|
|
|
|
<!-- Downloading Spinner -->
|
|
<template x-if="album.state === 'in_progress'">
|
|
<div class="icn-downloading">
|
|
<i class="la la-6x la-compact-disc icn-spinner text-white"></i>
|
|
</div>
|
|
</template>
|
|
<!-- Album Art -->
|
|
<img :src="album.image" class="img-fluid rounded-start"
|
|
:alt="album.name" style="width: 100%; height: 100%; min-height: 180px;">
|
|
</div>
|
|
|
|
</div>
|
|
<div class="col-md-9 vinyl-card">
|
|
<div class="card-body">
|
|
<a :href="album.url_remote" target="_blank">
|
|
<h3 class="card-title" x-text="album.name"></h3>
|
|
</a>
|
|
<h5 class="card-text"
|
|
style="font-weight: bold; font-family: serif;"><span x-text="album.artist_id.name"/>
|
|
</h5>
|
|
|
|
<template x-if="album.state === 'in_progress'">
|
|
<p>Downloading...</p>
|
|
</template>
|
|
|
|
<template x-if="album.state === 'pending'">
|
|
<p class="text-muted">Waiting to Download</p>
|
|
</template>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
|
|
<template x-if="$store.app.Queue.length === 0">
|
|
<p>Queue is empty</p>
|
|
</template>
|
|
|
|
</div>
|