diff --git a/src/nginxconfig/templates/app.vue b/src/nginxconfig/templates/app.vue index 8299f80..0544a2e 100644 --- a/src/nginxconfig/templates/app.vue +++ b/src/nginxconfig/templates/app.vue @@ -26,7 +26,7 @@ limitations under the License. -
+

Per-website config

@@ -46,7 +46,7 @@ limitations under the License. @@ -66,6 +66,8 @@ limitations under the License. import Footer from 'do-vue/src/templates/footer'; import isChanged from '../util/is_changed'; import exportData from '../util/export_data'; + import importData from '../util/import_data'; + import isObject from '../util/is_object'; import i18n from '../i18n'; import Domain from './domain'; import Global from './global'; @@ -81,11 +83,10 @@ limitations under the License. data() { return { i18n, - domains: [ - clone(Domain.delegated), - ], + domains: [], global: Global.delegated, active: 0, + ready: false, }; }, computed: { @@ -96,11 +97,26 @@ limitations under the License. return JSON.stringify(exportData(this.activeDomains, this.$data.global), null, 2); }, }, + mounted() { + // If there is no query param, add one default domain and we're ready + if (!window.location.search.length) { + this.$data.domains.push(clone(Domain.delegated)); + this.$data.ready = true; + return; + } + + // Import any data from the URL query params + importData(window.location.search, this.$data.domains, this.$data.global, this.$nextTick); + + // After two ticks (one tick to set watched data), we are ready + this.$nextTick(() => this.$nextTick(() => this.$data.ready = true)); + }, methods: { changes(index) { const data = this.$data.domains[index]; const changes = Object.entries(data).reduce((prev, current) => { if (current[0] === 'presets') return prev; // Ignore changes from presets + if (!isObject(current[1])) return prev; // Ignore non-objects (things that aren't tabs) prev += Object.keys(current[1]).filter(key => isChanged(current[1][key], current[0], key)).length; return prev; }, 0); diff --git a/src/nginxconfig/templates/domain.vue b/src/nginxconfig/templates/domain.vue index 1675e76..2eacdda 100644 --- a/src/nginxconfig/templates/domain.vue +++ b/src/nginxconfig/templates/domain.vue @@ -33,7 +33,7 @@ limitations under the License. v-for="tab in tabs" :key="tab.key" :data="$props.data[tab.key]" - :style="{ display: active === tab.key ? 'block' : 'none' }" + :style="{ display: active === tab.key ? undefined : 'none' }" class="container" > @@ -56,6 +56,7 @@ limitations under the License. const tabs = Object.values(Sections); const delegated = { + hasUserInteraction: false, presets: Presets.delegated, ...tabs.reduce((prev, tab) => { prev[tab.key] = tab.delegated; @@ -65,10 +66,10 @@ limitations under the License. export default { name: 'Domain', - delegated, + delegated, // Data the parent will present here components: { Presets, - }, // Data the parent will present here + }, props: { data: Object, // Data delegated back to us from parent }, @@ -76,7 +77,6 @@ limitations under the License. return { active: tabs[0].key, tabs, - hasUserInteraction: false, }; }, computed: { diff --git a/src/nginxconfig/templates/domain_sections/presets.vue b/src/nginxconfig/templates/domain_sections/presets.vue index 581f777..b95ec3e 100644 --- a/src/nginxconfig/templates/domain_sections/presets.vue +++ b/src/nginxconfig/templates/domain_sections/presets.vue @@ -2,7 +2,7 @@

Presets

-