65 lines
No EOL
3.1 KiB
Text
65 lines
No EOL
3.1 KiB
Text
<template v-if="page == 'library-albums'">
|
|
<div class="content-inner">
|
|
<div class="row">
|
|
<div class="col" style="padding:0px;">
|
|
<h1 class="header-text">Albums</h1>
|
|
</div>
|
|
<div class="col-auto">
|
|
<button v-if="library.albums.downloadState == 2" @click="getLibraryAlbumsFull(true, 1)"
|
|
class="reload-btn">
|
|
<%- include('../svg/redo.svg') %>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col" style="padding:0px;">
|
|
<div class="search-input-container" style="width:100%;margin: 16px 0px;">
|
|
<div class="search-input--icon"></div>
|
|
<input type="search" style="width:100%;" spellcheck="false" placeholder="Search..."
|
|
@input="searchLibraryAlbums" v-model="library.albums.search" class="search-input">
|
|
</div>
|
|
</div>
|
|
<div class="col-auto flex-center">
|
|
<div class="row">
|
|
<div class="col">
|
|
<select class="md-select" v-model="library.albums.sorting[1]" @change="searchLibraryAlbums(1)">
|
|
<optgroup label="Sort By">
|
|
<option v-for="(sort, index) in library.albums.sortingOptions" :value="index">{{ sort }}
|
|
</option>
|
|
</optgroup>
|
|
</select>
|
|
</div>
|
|
<div class="col">
|
|
<select class="md-select" v-model="library.albums.sortOrder[1]"
|
|
@change="searchLibraryAlbums(1)">
|
|
<optgroup label="Sort Order">
|
|
<option value="asc">Ascending</option>
|
|
<option value="desc">Descending</option>
|
|
</optgroup>
|
|
</select>
|
|
</div>
|
|
<div class="col">
|
|
<select class="md-select" v-model="library.albums.viewAs">
|
|
<optgroup label="View As">
|
|
<option value="covers">Cover Art</option>
|
|
<option value="list">List</option>
|
|
</optgroup>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="well">
|
|
<div class="albums-square-container">
|
|
<div>
|
|
<mediaitem-square v-if="library.albums.viewAs == 'covers'" :size="'150'" :item="item"
|
|
v-for="item in library.albums.displayListing">
|
|
</mediaitem-square>
|
|
</div>
|
|
</div>
|
|
<mediaitem-list-item v-if="library.albums.viewAs == 'list'" :show-duration="false" :show-meta-data="true"
|
|
:show-library-status="false" :item="item" v-for="item in library.albums.displayListing">
|
|
</mediaitem-list-item>
|
|
</div>
|
|
</div>
|
|
</template> |