Page MenuHomePhorge
Differential D3551 Diff 10262 src/resources/vue/Domain/Info.vue

Changeset View

Standalone View

View Options

src/resources/vue/Domain/Info.vue

<template> <template>
<div class="container"> <div class="container">
<status-component v-if="domain_id !== 'new'" :status="status" @status-update="statusUpdate"></status-component> <status-component v-if="domain_id !== 'new'" :status="status" @status-update="statusUpdate"></status-component>
<div class="card"> <div class="card">
<div class="card-body"> <div class="card-body">
<div class="card-title" v-if="domain_id === 'new'">{{ $t('domain.new') }}</div> <div class="card-title" v-if="domain_id === 'new'">{{ $t('domain.new') }}</div>
<div class="card-title" v-else>{{ $t('form.domain') }} <div class="card-title" v-else>{{ $t('form.domain') }}
<btn class="btn-outline-danger button-delete float-end" @click="showDeleteConfirmation()" icon="trash-can">{{ $t('domain.delete') }}</btn> <btn class="btn-outline-danger button-delete float-end" @click="$refs.deleteDialog.show()" icon="trash-can">{{ $t('domain.delete') }}</btn>
</div> </div>
<div class="card-text"> <div class="card-text">
<ul class="nav nav-tabs mt-3" role="tablist"> <ul class="nav nav-tabs mt-3" role="tablist">
<li class="nav-item"> <li class="nav-item">
<a class="nav-link active" id="tab-general" href="#general" role="tab" aria-controls="general" aria-selected="true" @click="$root.tab"> <a class="nav-link active" id="tab-general" href="#general" role="tab" aria-controls="general" aria-selected="true" @click="$root.tab">
{{ $t('form.general') }} {{ $t('form.general') }}
</a> </a>
</li> </li>
▲ Show 20 Lines • Show All 70 Lines • ▼ Show 20 Lines <div class="container">
<btn class="btn-primary" type="submit" icon="check">{{ $t('btn.submit') }}</btn> <btn class="btn-primary" type="submit" icon="check">{{ $t('btn.submit') }}</btn>
</form> </form>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div id="delete-warning" class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document"> <modal-dialog id="delete-warning" ref="deleteDialog" @click="deleteDomain()" :buttons="['delete']" :cancel-focus="true"
<div class="modal-content"> :title="$t('domain.delete-domain', { domain: domain.namespace })"
<div class="modal-header"> >
<h5 class="modal-title">{{ $t('domain.delete-domain', { domain: domain.namespace }) }}</h5>
<btn class="btn-close" data-bs-dismiss="modal" :aria-label="$t('btn.close')"></btn>
</div>
<div class="modal-body">
<p>{{ $t('domain.delete-text') }}</p> <p>{{ $t('domain.delete-text') }}</p>
</div> </modal-dialog>
<div class="modal-footer">
<btn class="btn-secondary modal-cancel" data-bs-dismiss="modal">{{ $t('btn.cancel') }}</btn>
<btn class="btn-danger modal-action" @click="deleteDomain()" icon="trash-can">{{ $t('btn.delete') }}</btn>
</div>
</div>
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
import { Modal } from 'bootstrap'
import ListInput from '../Widgets/ListInput' import ListInput from '../Widgets/ListInput'
import ModalDialog from '../Widgets/ModalDialog'
import PackageSelect from '../Widgets/PackageSelect' import PackageSelect from '../Widgets/PackageSelect'
import StatusComponent from '../Widgets/Status' import StatusComponent from '../Widgets/Status'
import SubscriptionSelect from '../Widgets/SubscriptionSelect' import SubscriptionSelect from '../Widgets/SubscriptionSelect'
import { library } from '@fortawesome/fontawesome-svg-core' import { library } from '@fortawesome/fontawesome-svg-core'
library.add( library.add(
require('@fortawesome/free-solid-svg-icons/faRotate').definition, require('@fortawesome/free-solid-svg-icons/faRotate').definition,
) )
export default { export default {
components: { components: {
ListInput, ListInput,
ModalDialog,
PackageSelect, PackageSelect,
StatusComponent, StatusComponent,
SubscriptionSelect SubscriptionSelect
}, },
data() { data() {
return { return {
domain_id: null, domain_id: null,
domain: {}, domain: {},
Show All 16 Lines export default {
this.status = response.data.statusInfo this.status = response.data.statusInfo
}) })
.catch(this.$root.errorHandler) .catch(this.$root.errorHandler)
} }
}, },
mounted() { mounted() {
$('#namespace').focus() $('#namespace').focus()
$('#delete-warning')[0].addEventListener('shown.bs.modal', event => {
$(event.target).find('button.modal-cancel').focus()
})
}, },
methods: { methods: {
confirm() { confirm() {
axios.get('/api/v4/domains/' + this.domain_id + '/confirm') axios.get('/api/v4/domains/' + this.domain_id + '/confirm')
.then(response => { .then(response => {
if (response.data.status == 'success') { if (response.data.status == 'success') {
this.domain.isConfirmed = true this.domain.isConfirmed = true
this.status = response.data.statusInfo this.status = response.data.statusInfo
Show All 9 Lines export default {
axios.delete('/api/v4/domains/' + this.domain_id) axios.delete('/api/v4/domains/' + this.domain_id)
.then(response => { .then(response => {
if (response.data.status == 'success') { if (response.data.status == 'success') {
this.$toast.success(response.data.message) this.$toast.success(response.data.message)
this.$router.push({ name: 'domains' }) this.$router.push({ name: 'domains' })
} }
}) })
}, },
showDeleteConfirmation() {
// Display the warning
new Modal('#delete-warning').show()
},
statusUpdate(domain) { statusUpdate(domain) {
this.domain = Object.assign({}, this.domain, domain) this.domain = Object.assign({}, this.domain, domain)
}, },
submit() { submit() {
this.$root.clearFormValidation($('#general form')) this.$root.clearFormValidation($('#general form'))
let post = this.$root.pick(this.domain, ['namespace']) let post = this.$root.pick(this.domain, ['namespace'])
Show All 21 Lines