Changeset View
Changeset View
Standalone View
Standalone View
src/resources/vue/Widgets/ListInput.vue
<template> | <template> | ||||
<div class="list-input" :id="id"> | <div class="list-input" :id="id"> | ||||
<div class="input-group"> | <div class="input-group"> | ||||
<input :id="id + '-input'" type="text" class="form-control main-input" @keydown="keyDown"> | <input :id="id + '-input'" type="text" class="form-control main-input" @keydown="keyDown"> | ||||
<a href="#" class="btn btn-outline-secondary" @click.prevent="addItem"> | <a href="#" class="btn btn-outline-secondary" @click.prevent="addItem"> | ||||
<svg-icon icon="plus"></svg-icon> | <svg-icon icon="plus"></svg-icon> | ||||
<span class="visually-hidden">{{ $t('btn.add') }}</span> | <span class="visually-hidden">{{ $t('btn.add') }}</span> | ||||
</a> | </a> | ||||
</div> | </div> | ||||
<div class="input-group" v-for="(item, index) in list" :key="index"> | <div class="input-group" v-for="(item, index) in list" :key="index"> | ||||
<input type="text" class="form-control" @input="$set(list, index, $event.target.value)" :value="item"> | <input type="text" class="form-control" @input="$set(list, index, $event.target.value)" :value="item"> | ||||
<a href="#" class="btn btn-outline-secondary" @click.prevent="deleteItem(index)"> | <a href="#" class="btn btn-outline-secondary" @click.prevent="deleteItem(index)"> | ||||
<svg-icon icon="trash-alt"></svg-icon> | <svg-icon icon="trash-can"></svg-icon> | ||||
<span class="visually-hidden">{{ $t('btn.delete') }}</span> | <span class="visually-hidden">{{ $t('btn.delete') }}</span> | ||||
</a> | </a> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
</template> | </template> | ||||
<script> | <script> | ||||
export default { | export default { | ||||
▲ Show 20 Lines • Show All 54 Lines • Show Last 20 Lines |