7x31/nginxconfig.io
1
0
Fork 0
mirror of https://github.com/digitalocean/nginxconfig.io.git synced 2025-09-21 11:19:20 +08:00
Code Issues Packages Projects Releases Wiki Activity

Add global tools section & export data generator

Browse Source
This commit is contained in:
MattIPv4
2020-05-04 20:55:23 +01:00
parent 431cbf53e2
commit e7e9cbcfa2
5 changed files with 264 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/nginxconfig/templates/app.vue
View File

@@ -53,7 +53,7 @@ limitations under the License.
<h2>Global config</h2>
<Global :data="global"></Global>
<pre><code>{{ JSON.stringify({ domains: activeDomains, global }, null, 2) }}</code></pre>
<pre><code>{{ exportData }}</code></pre>
</div>
<Footer :text="i18n.templates.app.oss"></Footer>
@@ -65,6 +65,7 @@ limitations under the License.
import Header from 'do-vue/src/templates/header';
import Footer from 'do-vue/src/templates/footer';
import isChanged from '../util/is_changed';
import exportData from '../util/export_data';
import i18n from '../i18n';
import Domain from './domain';
import Global from './global';
@@ -91,6 +92,9 @@ limitations under the License.
activeDomains() {
return this.$data.domains.map((domain, index) => [domain, index]).filter(d => d[0] !== null);
},
exportData() {
return JSON.stringify(exportData(this.activeDomains, this.$data.global), null, 2);
},
},
methods: {
changes(index) {

1
src/nginxconfig/templates/global_sections/index.js
View File

@@ -5,3 +5,4 @@ export { default as Python } from './python';
export { default as Performance } from './performance';
export { default as Logging } from './logging';
export { default as NGINX } from './nginx';
export { default as Tools } from './tools';

192
src/nginxconfig/templates/global_sections/tools.vue Normal file
View File

@@ -0,0 +1,192 @@
<template>
<div>
<div class="field is-horizontal">
<div class="field-label">
<label class="label">Modularized structure</label>
</div>
<div class="field-body">
<div class="field">
<div :class="`control${modularizedStructureChanged ? ' is-changed' : ''}`">
<div class="checkbox">
<PrettyCheck v-model="modularizedStructure" class="p-default p-curve p-fill p-icon">
<i slot="extra" class="icon fas fa-check"></i>
enable modularized config files
</PrettyCheck>
</div>
</div>
</div>
</div>
</div>
<div class="field is-horizontal">
<div class="field-label">
<label class="label">Symlink vhost</label>
</div>
<div class="field-body">
<div class="field">
<div :class="`control${symlinkVhostChanged ? ' is-changed' : ''}`">
<div class="checkbox">
<PrettyCheck v-model="symlinkVhost" class="p-default p-curve p-fill p-icon">
<i slot="extra" class="icon fas fa-check"></i>
enable symlink from sites-available/ to sites-enabled/
</PrettyCheck>
</div>
</div>
</div>
</div>
</div>
<div class="field is-horizontal">
<div class="field-label">
<label class="label">Share configuration</label>
</div>
<div class="field-body">
<div class="field">
<div class="control">
<input v-model="shareLink"
class="input"
type="text"
disabled="disabled"
/>
</div>
</div>
</div>
</div>
<div class="field is-horizontal">
<div class="field-label">
<label class="label">Reset configuration</label>
</div>
<div class="field-body">
<div class="field is-grouped">
<div class="control">
<a class="button is-danger is-mini" @click="resetGlobal">
Reset global config
</a>
</div>
<div v-if="hasDomain" class="control">
<a class="button is-danger is-mini" @click="resetDomains">
Reset all domains
</a>
</div>
<div v-if="hasDomain" class="control">
<a class="button is-danger is-mini" @click="removeDomains">
Remove all domains
</a>
</div>
</div>
</div>
</div>
<div class="field is-horizontal">
<div class="field-label">
</div>
<div class="field-body is-vertical">
<div v-for="domainData in $parent.$parent.activeDomains" class="field is-horizontal">
<div class="field-label">
<label class="label">{{ domainData[0].server.domain.computed }}</label>
</div>
<div class="field-body">
<div class="field is-grouped">
<div class="control">
<a class="button is-danger is-mini" @click="resetDomain(domainData[1])">
Reset domain config
</a>
</div>
<div class="control">
<a class="button is-danger is-mini" @click="removeDomain(domainData[1])">
Remove domain
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import PrettyCheck from 'pretty-checkbox-vue/check';
import i18n from '../../i18n';
import delegatedFromDefaults from '../../util/delegated_from_defaults';
import computedFromDefaults from '../../util/computed_from_defaults';
import exportData from '../../util/export_data';
const defaults = {
modularizedStructure: {
default: true,
enabled: true,
},
symlinkVhost: {
default: true,
enabled: true,
},
};
export default {
name: 'GlobalTools', // Component name
display: 'Tools', // Display name for tab
key: 'tools', // Key for data in parent
delegated: delegatedFromDefaults(defaults), // Data the parent will present here
components: {
PrettyCheck,
},
props: {
data: Object, // Data delegated back to us from parent
},
data () {
return {
i18n,
};
},
computed: {
...computedFromDefaults(defaults, 'tools'), // Getters & setters for the delegated data
hasDomain() {
return this.$parent.$parent.activeDomains.length > 0;
},
shareLink() {
return JSON.stringify(exportData(this.$parent.$parent.activeDomains, this.$parent.$props.data));
},
},
methods: {
// TODO: These all need confirmation prompts!
resetGlobal() {
Object.values(this.$parent.$props.data).forEach(category => {
Object.values(category).forEach(property => {
property.value = property.default;
property.computed = property.default;
});
});
},
resetDomain(index) {
if (index >= this.$parent.$parent.$data.domains.length) return;
const domain = this.$parent.$parent.$data.domains[index];
if (!domain) return;
Object.values(domain).forEach(category => {
Object.values(category).forEach(property => {
property.value = property.default;
property.computed = property.default;
});
});
},
removeDomain(index) {
if (index >= this.$parent.$parent.$data.domains.length) return;
this.$set(this.$parent.$parent.$data.domains, index, null);
},
resetDomains() {
for (let i = 0; i < this.$parent.$parent.$data.domains.length; i++) {
this.resetDomain(i);
}
},
removeDomains() {
for (let i = 0; i < this.$parent.$parent.$data.domains.length; i++) {
this.removeDomain(i);
}
},
},
};
</script>