Changeset View
Changeset View
Standalone View
Standalone View
src/resources/vue/CompanionApp.vue
| <template> | <template> | ||||
| <div class="container" dusk="companionapp-component"> | <div class="container" dusk="companionapp-component"> | ||||
| <div class="card"> | <div class="card"> | ||||
| <div class="card-body"> | <div class="card-body"> | ||||
| <div class="card-title"> | <div class="card-title"> | ||||
| {{ $t('companion.title') }} | {{ $t('companion.title') }} | ||||
| <small><sup class="badge bg-primary">{{ $t('dashboard.beta') }}</sup></small> | <small><sup class="badge bg-primary">{{ $t('dashboard.beta') }}</sup></small> | ||||
| </div> | </div> | ||||
| <div class="card-text"> | <div class="card-text"> | ||||
| <p> | <p> | ||||
| {{ $t('companion.description') }} | {{ $t('companion.description') }} | ||||
| </p> | </p> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| <tabs class="mt-3" :tabs="['companion.pair-new','companion.paired']"></tabs> | |||||
| <ul class="nav nav-tabs mt-2" role="tablist"> | |||||
| <li class="nav-item"> | |||||
| <a class="nav-link active" id="tab-qrcode" href="#companion-qrcode" role="tab" aria-controls="companion-qrcode" aria-selected="true" @click="$root.tab"> | |||||
| {{ $t('companion.pair-new') }} | |||||
| </a> | |||||
| </li> | |||||
| <li class="nav-item"> | |||||
| <a class="nav-link" id="tab-list" href="#companion-list" role="tab" aria-controls="companion-list" aria-selected="false" @click="$root.tab"> | |||||
| {{ $t('companion.paired') }} | |||||
| </a> | |||||
| </li> | |||||
| </ul> | |||||
| <div class="tab-content"> | <div class="tab-content"> | ||||
| <div class="tab-pane active" id="companion-qrcode" role="tabpanel" aria-labelledby="tab-qrcode"> | <div class="tab-pane active" id="new" role="tabpanel" aria-labelledby="tab-new"> | ||||
| <div class="card-body"> | <div class="card-body"> | ||||
| <div class="card-text"> | <div class="card-text"> | ||||
| <p> | <p> | ||||
| {{ $t('companion.pairing-instructions') }} | {{ $t('companion.pairing-instructions') }} | ||||
| </p> | </p> | ||||
| <p> | <p> | ||||
| <img :src="qrcode" /> | <img :src="qrcode" /> | ||||
| </p> | </p> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| <div class="tab-pane" id="companion-list" role="tabpanel" aria-labelledby="tab-list"> | <div class="tab-pane" id="paired" role="tabpanel" aria-labelledby="tab-paired"> | ||||
| <div class="card-body"> | <div class="card-body"> | ||||
| <companionapp-list class="card-text"></companionapp-list> | <companionapp-list class="card-text"></companionapp-list> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </template> | </template> | ||||
| <script> | <script> | ||||
| import CompanionappList from './Widgets/CompanionappList' | import CompanionappList from './Widgets/CompanionappList' | ||||
| export default { | export default { | ||||
| components: { | components: { | ||||
| Show All 16 Lines | |||||