483 lines
16 KiB
Vue
483 lines
16 KiB
Vue
<!--
|
|
Copyright or © or Copr. happyDNS (2020)
|
|
|
|
contact@happydomain.org
|
|
|
|
This software is a computer program whose purpose is to provide a modern
|
|
interface to interact with DNS systems.
|
|
|
|
This software is governed by the CeCILL license under French law and abiding
|
|
by the rules of distribution of free software. You can use, modify and/or
|
|
redistribute the software under the terms of the CeCILL license as
|
|
circulated by CEA, CNRS and INRIA at the following URL
|
|
"http://www.cecill.info".
|
|
|
|
As a counterpart to the access to the source code and rights to copy, modify
|
|
and redistribute granted by the license, users are provided only with a
|
|
limited warranty and the software's author, the holder of the economic
|
|
rights, and the successive licensors have only limited liability.
|
|
|
|
In this respect, the user's attention is drawn to the risks associated with
|
|
loading, using, modifying and/or developing or reproducing the software by
|
|
the user in light of its specific status of free software, that may mean
|
|
that it is complicated to manipulate, and that also therefore means that it
|
|
is reserved for developers and experienced professionals having in-depth
|
|
computer knowledge. Users are therefore encouraged to load and test the
|
|
software's suitability as regards their requirements in conditions enabling
|
|
the security of their systems and/or data to be ensured and, more generally,
|
|
to use and operate it in the same conditions as regards security.
|
|
|
|
The fact that you are presently reading this means that you have had
|
|
knowledge of the CeCILL license and that you accept its terms.
|
|
-->
|
|
|
|
<template>
|
|
<b-container fluid>
|
|
<div v-if="!domain" class="mt-5 text-center">
|
|
<b-spinner label="Spinning" />
|
|
<p>{{ $t('wait.loading') }}</p>
|
|
</div>
|
|
<b-row v-else style="min-height: inherit">
|
|
<b-col sm="4" md="3" class="bg-light pt-2 pb-2 sticky-top d-flex flex-column justify-content-between" style="height: 100vh; overflow-y: auto; z-index: 5">
|
|
<b-row>
|
|
<b-col class="pr-0" sm="auto">
|
|
<router-link to="/domains/" class="btn font-weight-bolder">
|
|
<b-icon icon="chevron-up" />
|
|
</router-link>
|
|
</b-col>
|
|
<b-col class="pl-0">
|
|
<b-form-select :value="domain.domain" :options="sortedDomainsByGroup" value-field="domain" text-field="domain" @input="changeDomain($event)" />
|
|
</b-col>
|
|
</b-row>
|
|
|
|
<b-form class="mt-3">
|
|
<b-button
|
|
class="float-right"
|
|
variant="outline-secondary"
|
|
size="sm"
|
|
:title="$t('domains.actions.reimport')"
|
|
@click="importZone"
|
|
>
|
|
<b-icon icon="cloud-download" />
|
|
</b-button>
|
|
<label class="font-weight-bolder" for="zhistory">{{ $t('domains.history') }}:</label>
|
|
<b-form-select id="zhistory" v-model="selectedHistory" :options="domain.zone_history" value-field="id" text-field="last_modified" />
|
|
</b-form>
|
|
|
|
<b-button-group class="mt-3 w-100">
|
|
<b-button size="sm" variant="outline-info" :title="$t('domains.actions.view')" @click="viewZone">
|
|
<b-icon icon="list-ul" aria-hidden="true" /><br>
|
|
{{ $t('domains.actions.view') }}
|
|
</b-button>
|
|
<b-button v-if="domain.zone_history.length && selectedHistory === domain.zone_history[0].id" size="sm" variant="success" :title="$t('domains.actions.propagate')" @click="showDiff">
|
|
<b-icon icon="cloud-upload" aria-hidden="true" /><br>
|
|
{{ $t('domains.actions.propagate') }}
|
|
</b-button>
|
|
<b-button v-else size="sm" variant="warning" :title="$t('domains.actions.rollback')" @click="showDiff">
|
|
<b-icon icon="cloud-upload" aria-hidden="true" /><br>
|
|
{{ $t('domains.actions.rollback') }}
|
|
</b-button>
|
|
</b-button-group>
|
|
|
|
<div class="flex-fill" />
|
|
|
|
<b-button class="w-100" type="button" variant="outline-danger" @click="detachDomain()">
|
|
<b-icon icon="trash-fill" /> {{ $t('domains.stop') }}
|
|
</b-button>
|
|
|
|
<b-form v-if="providers_getAll && providers_getAll[domain.id_provider]" class="mt-5">
|
|
<label class="font-weight-bolder">{{ $t('domains.view.provider') }}:</label>
|
|
<div class="pr-2 pl-2">
|
|
<b-button class="p-3 w-100 text-left" type="button" variant="outline-info" @click="goToProvider()">
|
|
<div class="d-inline-block text-center" style="width: 50px;">
|
|
<img :src="'/api/providers/_specs/' + providers_getAll[domain.id_provider]._srctype + '/icon.png'" :alt="providers_getAll[domain.id_provider]._srctype" :title="providers_getAll[domain.id_provider]._srctype" style="max-width: 100%; max-height: 2.5em; margin: -.6em .4em -.6em -.6em">
|
|
</div>
|
|
{{ providers_getAll[domain.id_provider]._comment }}
|
|
</b-button>
|
|
</div>
|
|
</b-form>
|
|
</b-col>
|
|
|
|
<b-col sm="8" md="9" class="mb-5">
|
|
<div v-if="importInProgress" class="mt-4 text-center">
|
|
<b-spinner :label="$t('common.spinning')" />
|
|
<p>{{ $t('wait.importing') }}</p>
|
|
</div>
|
|
<h-subdomain-list v-else-if="selectedHistory && domain.zone_history.length > 0" :display-format="displayFormat" :domain="domain" :zone-id="selectedHistory" />
|
|
</b-col>
|
|
</b-row>
|
|
|
|
<b-modal id="modal-viewZone" :title="$t('domains.view.title')" size="lg" scrollable ok-only :ok-disabled="zoneContent === null">
|
|
<div v-if="zoneContent === null" class="my-2 text-center">
|
|
<b-spinner label="Spinning" />
|
|
<p>{{ $t('wait.formating') }}</p>
|
|
</div>
|
|
<pre v-else style="overflow: initial">{{ zoneContent }}</pre>
|
|
</b-modal>
|
|
|
|
<b-modal id="modal-applyZone" size="lg" scrollable @ok.prevent="applyDiff()">
|
|
<template #modal-title>
|
|
<i18n path="domains.view.description" tag="span">
|
|
<span class="text-monospace">{{ domain.domain }}</span>
|
|
</i18n>
|
|
</template>
|
|
<template #modal-footer="{ ok, cancel }">
|
|
<div v-if="zoneDiff">
|
|
<span v-if="zoneDiffCreated.length" class="text-success">
|
|
{{ $tc('domains.apply.additions', (selectedDiffCreated || []).length) }}
|
|
</span>
|
|
<span v-if="zoneDiffCreated.length && zoneDiffDeleted.length">
|
|
–
|
|
</span>
|
|
<span v-if="zoneDiffDeleted.length" class="text-danger">
|
|
{{ $tc('domains.apply.deletions', (selectedDiffDeleted || []).length) }}
|
|
</span>
|
|
<span v-if="(zoneDiffCreated.length || zoneDiffDeleted.length) && zoneDiffModified.length">
|
|
–
|
|
</span>
|
|
<span v-if="zoneDiffModified.length" class="text-warning">
|
|
{{ $tc('domains.apply.modifications', (selectedDiffModified || []).length) }}
|
|
</span>
|
|
<span v-if="(zoneDiffCreated.length || zoneDiffDeleted.length || zoneDiffModified.length) && (zoneDiff.length - zoneDiffCreated.length - zoneDiffDeleted.length - zoneDiffModified.length !== 0)">
|
|
–
|
|
</span>
|
|
<span v-if="zoneDiff.length - zoneDiffCreated.length - zoneDiffDeleted.length - zoneDiffModified.length !== 0" class="text-info">
|
|
{{ $tc('domains.apply.others', selectedDiff.length - selectedDiffCreated.length - selectedDiffDeleted.length - selectedDiffModified.length) }}
|
|
</span>
|
|
</div>
|
|
<div class="d-flex">
|
|
<b-button class="mr-1" variant="secondary" @click="cancel()">
|
|
{{ $t('common.cancel') }}
|
|
</b-button>
|
|
<b-button variant="success" :disabled="propagationInProgress || zoneDiff === null || selectedDiff.length === 0" @click="ok()">
|
|
<b-spinner v-if="propagationInProgress" label="Spinning" small />
|
|
{{ $t('domains.apply.button') }}
|
|
</b-button>
|
|
</div>
|
|
</template>
|
|
<div v-if="zoneDiff === null" class="my-2 text-center">
|
|
<b-spinner label="Spinning" />
|
|
<p>{{ $t('wait.exporting') }}</p>
|
|
</div>
|
|
<div v-for="(line, n) in zoneDiffAnalyzed" :key="'diff' + n">
|
|
<b-form-checkbox
|
|
v-model="selectedDiff"
|
|
:value="line.msg"
|
|
>
|
|
<div
|
|
:class="'col text-monospace ' + line.className"
|
|
style="padding-left: 1em; text-indent: -1em;"
|
|
>
|
|
{{ line.msg }}
|
|
</div>
|
|
</b-form-checkbox>
|
|
</div>
|
|
</b-modal>
|
|
</b-container>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapGetters } from 'vuex'
|
|
import DomainsApi from '@/api/domains'
|
|
import ZonesApi from '@/api/zones'
|
|
|
|
export default {
|
|
components: {
|
|
hSubdomainList: () => import('@/components/hSubdomainList')
|
|
},
|
|
|
|
data: function () {
|
|
return {
|
|
importInProgress: false,
|
|
propagationInProgress: false,
|
|
selectedDiff: [],
|
|
selectedHistory: null,
|
|
zoneContent: null,
|
|
zoneDiff: null
|
|
}
|
|
},
|
|
|
|
computed: {
|
|
displayFormat () {
|
|
switch (this.user_getSettings.zoneview) {
|
|
case 1:
|
|
return 'list'
|
|
case 2:
|
|
return 'records'
|
|
default:
|
|
return 'grid'
|
|
}
|
|
},
|
|
|
|
domain () {
|
|
return this.domains_getDetailed[this.$route.params.domain]
|
|
},
|
|
|
|
selectedDiffCreated () {
|
|
if (!this.selectedDiff) {
|
|
return null
|
|
}
|
|
|
|
return this.selectedDiff.filter((msg) => (/^CREATE/.test(msg)))
|
|
},
|
|
|
|
selectedDiffDeleted () {
|
|
if (!this.selectedDiff) {
|
|
return null
|
|
}
|
|
|
|
return this.selectedDiff.filter((msg) => (/^DELETE/.test(msg)))
|
|
},
|
|
|
|
selectedDiffModified () {
|
|
if (!this.selectedDiff) {
|
|
return null
|
|
}
|
|
|
|
return this.selectedDiff.filter((msg) => (/^MODIFY/.test(msg)))
|
|
},
|
|
|
|
sortedDomainsByGroup () {
|
|
if (!this.sortedDomains) {
|
|
return this.sortedDomains
|
|
}
|
|
|
|
const groups = {}
|
|
this.sortedDomains.forEach((domain) => {
|
|
if (!groups[domain.group]) {
|
|
groups[domain.group] = []
|
|
}
|
|
|
|
groups[domain.group].push(domain)
|
|
})
|
|
|
|
const options = []
|
|
for (const g in groups) {
|
|
if (g === 'undefined') {
|
|
options.push(...groups[g])
|
|
} else {
|
|
options.push({ label: g, options: groups[g] })
|
|
}
|
|
}
|
|
|
|
return options
|
|
},
|
|
|
|
zoneDiffAnalyzed () {
|
|
if (!this.zoneDiff) {
|
|
return null
|
|
}
|
|
|
|
return this.zoneDiff.map(
|
|
(msg) => {
|
|
let className = ''
|
|
if (/^MODIFY/.test(msg)) {
|
|
className = 'text-warning'
|
|
} else if (/^CREATE/.test(msg)) {
|
|
className = 'text-success'
|
|
} else if (/^DELETE/.test(msg)) {
|
|
className = 'text-danger'
|
|
} else if (/^REFRESH/.test(msg)) {
|
|
className = 'text-info'
|
|
}
|
|
|
|
return {
|
|
className,
|
|
msg
|
|
}
|
|
}
|
|
)
|
|
},
|
|
|
|
zoneDiffCreated () {
|
|
if (!this.zoneDiff) {
|
|
return null
|
|
}
|
|
|
|
return this.zoneDiff.filter((msg) => (/^CREATE/.test(msg)))
|
|
},
|
|
|
|
zoneDiffDeleted () {
|
|
if (!this.zoneDiff) {
|
|
return null
|
|
}
|
|
|
|
return this.zoneDiff.filter((msg) => (/^DELETE/.test(msg)))
|
|
},
|
|
|
|
zoneDiffModified () {
|
|
if (!this.zoneDiff) {
|
|
return null
|
|
}
|
|
|
|
return this.zoneDiff.filter((msg) => (/^MODIFY/.test(msg)))
|
|
},
|
|
|
|
...mapGetters('domains', ['domains_getDetailed', 'sortedDomains']),
|
|
...mapGetters('providers', ['providers_getAll']),
|
|
...mapGetters('user', ['user_getSettings'])
|
|
},
|
|
|
|
watch: {
|
|
domain: function () {
|
|
this.pullDomain()
|
|
if (!this.selectedHistory && this.domain.zone_history.length !== 0) {
|
|
this.selectedHistory = this.domain.zone_history[0].id
|
|
}
|
|
}
|
|
},
|
|
|
|
created () {
|
|
this.$store.dispatch('domains/getAllMyDomains')
|
|
this.$store.dispatch('providers/getAllMyProviders')
|
|
this.updateDomainInfo()
|
|
},
|
|
|
|
methods: {
|
|
pullDomain () {
|
|
if (this.domain.zone_history === null || this.domain.zone_history.length === 0) {
|
|
this.importZone()
|
|
} else {
|
|
this.selectedHistory = this.domain.zone_history[0].id
|
|
}
|
|
},
|
|
|
|
importZone () {
|
|
this.importInProgress = true
|
|
ZonesApi.importZone(this.domain.domain)
|
|
.then(
|
|
(response) => {
|
|
this.importInProgress = false
|
|
this.updateDomainInfo()
|
|
this.selectedHistory = response.data.id
|
|
},
|
|
(error) => {
|
|
this.importInProgress = false
|
|
this.$root.$bvToast.toast(
|
|
error.response.data.errmsg, {
|
|
title: this.$t('errors.occurs', { when: 'importing the zone' }),
|
|
autoHideDelay: 5000,
|
|
variant: 'danger',
|
|
toaster: 'b-toaster-content-right'
|
|
}
|
|
)
|
|
this.$router.push('/domains/')
|
|
}
|
|
)
|
|
},
|
|
|
|
changeDomain (newDomain) {
|
|
this.$router.push('/domains/' + encodeURIComponent(newDomain))
|
|
this.updateDomainInfo()
|
|
},
|
|
|
|
goToProvider () {
|
|
this.$router.push('/providers/' + encodeURIComponent(this.domain.id_provider))
|
|
},
|
|
|
|
detachDomain () {
|
|
this.$bvModal.msgBoxConfirm(this.$t('domains.alert.remove', { domain: this.domain.domain }), {
|
|
title: this.$t('domains.removal'),
|
|
size: 'lg',
|
|
okVariant: 'danger',
|
|
okTitle: this.$t('domains.discard'),
|
|
cancelVariant: 'outline-secondary',
|
|
cancelTitle: this.$t('domains.view.cancel-title')
|
|
})
|
|
.then(value => {
|
|
if (value) {
|
|
DomainsApi.detachDomain(this.domain.domain)
|
|
.then(
|
|
() => {
|
|
this.$store.dispatch('domains/dropDomain', this.domain.domain)
|
|
this.$router.push('/domains/')
|
|
}
|
|
)
|
|
}
|
|
})
|
|
},
|
|
|
|
showDiff () {
|
|
this.zoneDiff = null
|
|
this.$bvModal.show('modal-applyZone')
|
|
ZonesApi.diffZone(this.domain.domain, '@', this.selectedHistory)
|
|
.then(
|
|
(response) => {
|
|
if (response.data == null) {
|
|
this.$bvModal.hide('modal-applyZone')
|
|
this.$bvModal.msgBoxOk(this.$t('domains.apply.nochange'))
|
|
} else {
|
|
this.zoneDiff = response.data
|
|
this.selectedDiff = response.data
|
|
}
|
|
},
|
|
(error) => {
|
|
this.$bvModal.hide('modal-applyZone')
|
|
this.$bvToast.toast(
|
|
error.response.data.errmsg, {
|
|
title: this.$t('errors.occurs', { when: 'exporting the zone' }),
|
|
autoHideDelay: 5000,
|
|
variant: 'danger',
|
|
toaster: 'b-toaster-content-right'
|
|
}
|
|
)
|
|
})
|
|
},
|
|
|
|
applyDiff () {
|
|
this.propagationInProgress = true
|
|
ZonesApi.applyZone(this.domain.domain, this.selectedHistory, this.selectedDiff)
|
|
.then(
|
|
(response) => {
|
|
this.$bvModal.hide('modal-applyZone')
|
|
this.propagationInProgress = false
|
|
this.$bvToast.toast(
|
|
this.$t('domains.apply.done.description', { zone: this.domain.domain }), {
|
|
title: this.$t('domains.apply.done.title'),
|
|
autoHideDelay: 5000,
|
|
variant: 'success',
|
|
toaster: 'b-toaster-content-right'
|
|
}
|
|
)
|
|
},
|
|
(error) => {
|
|
this.propagationInProgress = false
|
|
this.$bvToast.toast(
|
|
error.response.data.errmsg, {
|
|
title: this.$t('errors.occurs', { when: 'applying the zone' }),
|
|
autoHideDelay: 5000,
|
|
variant: 'danger',
|
|
toaster: 'b-toaster-content-right'
|
|
}
|
|
)
|
|
})
|
|
},
|
|
|
|
viewZone () {
|
|
this.zoneContent = null
|
|
this.$bvModal.show('modal-viewZone')
|
|
ZonesApi.viewZone(this.domain.domain, this.selectedHistory)
|
|
.then(
|
|
(response) => {
|
|
this.zoneContent = response.data
|
|
},
|
|
(error) => {
|
|
this.$bvModal.hide('modal-viewZone')
|
|
this.$bvToast.toast(
|
|
error.response.data.errmsg, {
|
|
title: this.$t('errors.occurs', { when: 'exporting the zone' }),
|
|
autoHideDelay: 5000,
|
|
variant: 'danger',
|
|
toaster: 'b-toaster-content-right'
|
|
}
|
|
)
|
|
})
|
|
},
|
|
|
|
updateDomainInfo () {
|
|
this.$store.dispatch('domains/getDomainDetails', this.$route.params.domain)
|
|
}
|
|
}
|
|
}
|
|
</script>
|