orchard/resources/cider-ui-tests/views/pages/library-songs.ejs
booploops 557081482e changes to songs page, changes to mediaitem-list-item
Added props to mediaitem-list-item
show-artwork
show-library-status
show-meta-data
2021-12-07 17:49:31 -08:00

33 lines
No EOL
1.7 KiB
Text

<template v-if="page == 'library-songs'">
<div class="content-inner">
<h1 class="header-text">Songs</h1>
<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="searchLibrarySongs"
v-model="library.songs.search" class="search-input">
</div>
</div>
<div class="col-auto flex-center">
<select class="md-select" v-model="library.songs.sorting" @change="searchLibrarySongs()">
<optgroup label="Sort By">
<option v-for="(sort, index) in library.sortingOptions" :value="index">{{ sort }}</option>
</optgroup>
</select>
<select class="md-select" v-model="library.songs.sortOrder" @change="searchLibrarySongs()">
<optgroup label="Sort Order">
<option value="asc">Ascending</option>
<option value="desc">Descending</option>
</optgroup>
</select>
</div>
</div>
<div v-if="library.songs.downloadState == 3">Library contains no songs.</div>
<mediaitem-list-item :item="item" :show-artwork="false" :show-meta-data="true" :show-library-status="false" v-for="item in library.songs.displayListing"></mediaitem-list-item>
</div>
</template>