forked from rc/aircox
180cc8bc02
- serializer: track search, reorder module files
- autocomplete: allow simple string value selection
- playlist editor:
- ui & flow improve
- init data
- save user settings
- autocomplete
- fix bugs
- discard changes
85 lines
3.6 KiB
HTML
85 lines
3.6 KiB
HTML
{% comment %}Inline block to edit playlists{% endcomment %}
|
|
{% load aircox aircox_admin static i18n %}
|
|
|
|
{% with inline_admin_formset as admin_formset %}
|
|
{% with admin_formset.formset as formset %}
|
|
|
|
<div id="inline-tracks" class="box mb-5">
|
|
{{ admin_formset.non_form_errors }}
|
|
|
|
<a-playlist-editor
|
|
:labels="{% track_inline_labels %}"
|
|
:init-data="{% track_inline_data formset=formset %}"
|
|
settings-url="{% url "api:user-settings" %}"
|
|
data-prefix="{{ formset.prefix }}-">
|
|
<template #title>
|
|
<h5 class="title is-4">{% trans "Playlist" %}</h5>
|
|
</template>
|
|
<template v-slot:top="{items}">
|
|
<input type="hidden" name="{{ formset.prefix }}-TOTAL_FORMS"
|
|
:value="items.length || 0"/>
|
|
<input type="hidden" name="{{ formset.prefix }}-INITIAL_FORMS"
|
|
value="{{ formset.initial_form_count }}"/>
|
|
<input type="hidden" name="{{ formset.prefix }}-MIN_NUM_FORMS"
|
|
value="{{ formset.min_num }}"/>
|
|
<input type="hidden" name="{{ formset.prefix }}-MAX_NUM_FORMS"
|
|
value="{{ formset.max_num }}"/>
|
|
</template>
|
|
<template #rows-header-head>
|
|
<th style="max-width:2em" title="{% trans "Track Position" %}"
|
|
aria-description="{% trans "Track Position" %}">
|
|
<span class="icon">
|
|
<i class="fa fa-arrow-down-1-9"></i>
|
|
</span>
|
|
</th>
|
|
</template>
|
|
<template v-slot:row-head="{item,row}">
|
|
<td>
|
|
[[ row+1 ]]
|
|
<input type="hidden"
|
|
:name="'{{ formset.prefix }}-' + row + '-position'"
|
|
:value="row"/>
|
|
<input t-if="item.id" type="hidden"
|
|
:name="'{{ formset.prefix }}-' + row + '-id'"
|
|
:value="item.data.id"/>
|
|
|
|
{% for field in admin_formset.fields %}
|
|
{% if field.name != 'position' and field.widget.is_hidden %}
|
|
<input type="hidden"
|
|
:name="'{{ formset.prefix }}-' + row + '-{{ field.name }}'"
|
|
v-model="item.data[attr]"/>
|
|
{% endif %}
|
|
{% endfor %}
|
|
</td>
|
|
</template>
|
|
{% for field in admin_formset.fields %}
|
|
{% if not field.widget.is_hidden and not field.is_readonly %}
|
|
<template v-slot:row-{{ field.name }}="{item,col,row,value,attr,emit}">
|
|
<div class="field">
|
|
{% if field.name in 'artist,title,album' %}
|
|
<a-autocomplete
|
|
:input-class="['input', item.error(attr) ? 'is-danger' : 'half-field']"
|
|
url="{% url 'api:track-autocomplete' %}?{{ field.name }}=${query}&field={{ field.name }}"
|
|
{% else %}
|
|
<div class="control">
|
|
<input type="{{ widget.type }}"
|
|
:class="['input', item.error(attr) ? 'is-danger' : 'half-field']"
|
|
{% endif %}
|
|
:name="'{{ formset.prefix }}-' + row + '-{{ field.name }}'"
|
|
v-model="item.data[attr]"
|
|
@change="emit('change', col)"/>
|
|
{% if field.name not in 'artist,title,album' %}
|
|
</div>
|
|
{% endif %}
|
|
<p v-for="error in item.error(attr)" class="help is-danger">
|
|
[[ error ]] !
|
|
</p>
|
|
</div>
|
|
</template>
|
|
{% endif %}
|
|
{% endfor %}
|
|
</a-playlist-editor>
|
|
</div>
|
|
{% endwith %}
|
|
{% endwith %}
|