Changeset View
Changeset View
Standalone View
Standalone View
src/resources/vue/Widgets/CompanionappList.vue
| <template> | <template> | ||||
| <div> | <div> | ||||
| <btn icon="trash-can" class="btn-outline-danger button-delete float-end" @click="showDeleteConfirmation()"> | <btn icon="trash-can" class="btn-outline-danger button-delete float-end" @click="showDeleteConfirmation()"> | ||||
| {{ $t('companion.delete') }} | {{ $t('companion.delete') }} | ||||
| </btn> | </btn> | ||||
| <table class="table table-sm m-0 entries"> | <list-table class="m-0" :list="entries" :setup="setup"></list-table> | ||||
| <thead> | |||||
| <tr> | |||||
| <th scope="col">{{ $t('companion.name') }}</th> | |||||
| <th scope="col">{{ $t('companion.deviceid') }}</th> | |||||
| </tr> | |||||
| </thead> | |||||
| <tbody> | |||||
| <tr v-for="entry in entries" :id="'entry' + entry.id" :key="entry.id"> | |||||
| <td class="description">{{ entry.name }}</td> | |||||
| <td class="description">{{ entry.device_id }}</td> | |||||
| </tr> | |||||
| </tbody> | |||||
| <list-foot :text="$t('companion.nodevices')" :colspan="2"></list-foot> | |||||
| </table> | |||||
| <list-more v-if="hasMore" :on-click="loadMore"></list-more> | <list-more v-if="hasMore" :on-click="loadMore"></list-more> | ||||
| <div id="delete-warning" class="modal" tabindex="-1" role="dialog"> | <div id="delete-warning" class="modal" tabindex="-1" role="dialog"> | ||||
| <div class="modal-dialog" role="document"> | <div class="modal-dialog" role="document"> | ||||
| <div class="modal-content"> | <div class="modal-content"> | ||||
| <div class="modal-header"> | <div class="modal-header"> | ||||
| <h5 class="modal-title">{{ $t('companion.remove-devices') }}</h5> | <h5 class="modal-title">{{ $t('companion.remove-devices') }}</h5> | ||||
| <btn class="btn-close" data-bs-dismiss="modal" :aria-label="$t('btn.close')"></btn> | <btn class="btn-close" data-bs-dismiss="modal" :aria-label="$t('btn.close')"></btn> | ||||
| </div> | </div> | ||||
| Show All 11 Lines | |||||
| </template> | </template> | ||||
| <script> | <script> | ||||
| import { Modal } from 'bootstrap' | import { Modal } from 'bootstrap' | ||||
| import ListTools from './ListTools' | import ListTools from './ListTools' | ||||
| export default { | export default { | ||||
| mixins: [ ListTools ], | mixins: [ ListTools ], | ||||
| props: { | |||||
| }, | |||||
| data() { | data() { | ||||
| return { | return { | ||||
| entries: [] | entries: [], | ||||
| setup: { | |||||
| model: 'companion', | |||||
| columns: [ | |||||
| { | |||||
| prop: 'name' | |||||
| }, | |||||
| { | |||||
| prop: 'device_id', | |||||
| label: 'companion.deviceid' | |||||
| } | |||||
| ] | |||||
| } | |||||
| } | } | ||||
| }, | }, | ||||
| mounted() { | mounted() { | ||||
| this.loadMore({ reset: true }) | this.loadMore({ reset: true }) | ||||
| $('#delete-warning')[0].addEventListener('shown.bs.modal', event => { | $('#delete-warning')[0].addEventListener('shown.bs.modal', event => { | ||||
| $(event.target).find('button.modal-cancel').focus() | $(event.target).find('button.modal-cancel').focus() | ||||
| }) | }) | ||||
| }, | }, | ||||
| Show All 21 Lines | |||||