github
/
nginxconfig.io
mirror of https://github.com/digitalocean/nginxconfig.io
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Make entire presets header the collapse click target

pull/159/head
MattIPv4 2020-06-09 17:02:05 +01:00
parent 5502c8c6bb
commit 6cfaf24d00
1 changed files with 24 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
src/nginxconfig/templates/domain_sections/presets.vue
View File

@ -26,16 +26,11 @@ THE SOFTWARE.
<template> <template>
<div class="container"> <div class="container">
<div class="header-group"> <div class="header-group" :style="{ cursor: interacted ? 'pointer' : undefined }" @click="toggleCollapse">
<h3>{{ i18n.templates.domainSections.presets.presets }}</h3> <h3>{{ i18n.templates.domainSections.presets.presets }}</h3>
<template v-if="$parent.$props.data.hasUserInteraction"> <a v-if="interacted" class="button is-tiny">
<a v-if="expanded" class="button is-tiny" @click="expanded = false"> <i :class="`fas fa-angle-${expanded ? 'up' : 'down'}`"></i>
<i class="fas fa-angle-up"></i> </a>
</a>
<a v-else class="button is-tiny" @click="expanded = true">
<i class="fas fa-angle-down"></i>
</a>
</template>
</div> </div>
<template v-if="!$parent.$props.data.hasUserInteraction || expanded"> <template v-if="!$parent.$props.data.hasUserInteraction || expanded">
@ -67,7 +62,7 @@ THE SOFTWARE.
default: false, default: false,
display: i18n.templates.domainSections.presets.frontend, display: i18n.templates.domainSections.presets.frontend,
enabled: true, enabled: true,
computedCheck (data) { computedCheck(data) {
return !data.php.php.computed return !data.php.php.computed
&& !data.python.python.computed && !data.python.python.computed
&& !data.reverseProxy.reverseProxy.computed && !data.reverseProxy.reverseProxy.computed
@ -79,7 +74,7 @@ THE SOFTWARE.
default: true, default: true,
display: i18n.common.php, display: i18n.common.php,
enabled: true, enabled: true,
computedCheck (data) { computedCheck(data) {
return data.php.php.computed return data.php.php.computed
&& data.routing.index.computed === 'index.php' && data.routing.index.computed === 'index.php'
&& data.routing.fallbackPhp.computed && data.routing.fallbackPhp.computed
@ -93,7 +88,7 @@ THE SOFTWARE.
default: false, default: false,
display: i18n.common.django, display: i18n.common.django,
enabled: true, enabled: true,
computedCheck (data) { computedCheck(data) {
return data.python.python.computed return data.python.python.computed
&& data.python.djangoRules.computed && data.python.djangoRules.computed
&& !data.routing.root.computed; && !data.routing.root.computed;
@ -103,7 +98,7 @@ THE SOFTWARE.
default: false, default: false,
display: i18n.templates.domainSections.presets.nodeJs, display: i18n.templates.domainSections.presets.nodeJs,
enabled: true, enabled: true,
computedCheck (data) { computedCheck(data) {
return data.reverseProxy.reverseProxy.computed return data.reverseProxy.reverseProxy.computed
&& !data.routing.root.computed; && !data.routing.root.computed;
}, },
@ -112,7 +107,7 @@ THE SOFTWARE.
default: false, default: false,
display: i18n.templates.domainSections.presets.singlePageApplication, display: i18n.templates.domainSections.presets.singlePageApplication,
enabled: true, enabled: true,
computedCheck (data) { computedCheck(data) {
return data.php.php.computed return data.php.php.computed
&& data.routing.index.computed === 'index.html' && data.routing.index.computed === 'index.html'
&& data.routing.fallbackHtml.computed; && data.routing.fallbackHtml.computed;
@ -122,7 +117,7 @@ THE SOFTWARE.
default: false, default: false,
display: i18n.common.wordPress, display: i18n.common.wordPress,
enabled: true, enabled: true,
computedCheck (data) { computedCheck(data) {
return data.routing.index.computed === 'index.php' return data.routing.index.computed === 'index.php'
&& data.routing.fallbackPhp.computed && data.routing.fallbackPhp.computed
&& !data.routing.fallbackHtml.computed && !data.routing.fallbackHtml.computed
@ -135,7 +130,7 @@ THE SOFTWARE.
default: false, default: false,
display: i18n.common.drupal, display: i18n.common.drupal,
enabled: true, enabled: true,
computedCheck (data) { computedCheck(data) {
return data.routing.index.computed === 'index.php' return data.routing.index.computed === 'index.php'
&& data.routing.fallbackPhp.computed && data.routing.fallbackPhp.computed
&& !data.routing.fallbackHtml.computed && !data.routing.fallbackHtml.computed
@ -148,7 +143,7 @@ THE SOFTWARE.
default: false, default: false,
display: i18n.common.magento, display: i18n.common.magento,
enabled: true, enabled: true,
computedCheck (data) { computedCheck(data) {
return data.routing.index.computed === 'index.php' return data.routing.index.computed === 'index.php'
&& data.routing.fallbackPhp.computed && data.routing.fallbackPhp.computed
&& !data.routing.fallbackHtml.computed && !data.routing.fallbackHtml.computed
@ -167,13 +162,18 @@ THE SOFTWARE.
props: { props: {
data: Object, // Data delegated back to us from parent data: Object, // Data delegated back to us from parent
}, },
data () { data() {
return { return {
i18n, i18n,
expanded: false, expanded: false,
}; };
}, },
computed: computedFromDefaults(defaults, 'presets', false), // Getters & setters for the delegated data computed: {
...computedFromDefaults(defaults, 'presets', false), // Getters & setters for the delegated data
interacted() {
return this.$parent.$props.data.hasUserInteraction;
},
},
watch: { watch: {
// When any data changes, check if it still matches a preset // When any data changes, check if it still matches a preset
'$parent.$props.data': { '$parent.$props.data': {
@ -246,6 +246,11 @@ THE SOFTWARE.
break; break;
} }
}, },
toggleCollapse() {
if (this.interacted) {
this.expanded = !this.expanded;
}
},
}, },
}; };
</script> </script>