mirror of
https://github.com/digitalocean/nginxconfig.io.git
synced 2025-11-08 05:27:36 +08:00
Add prettier and run prettier command via lint-staged (#448)
This commit is contained in:
Nihal Maskey
GitHub
@@ -34,8 +34,15 @@ THE SOFTWARE.
|
||||
<div class="field">
|
||||
<div :class="`control${httpsChanged ? ' is-changed' : ''}`">
|
||||
<div class="checkbox">
|
||||
<PrettyCheck v-model="https" class="p-default p-curve p-fill p-icon">
|
||||
{{ $t('templates.domainSections.https.enableEncryptedSslConnection') }}
|
||||
<PrettyCheck
|
||||
v-model="https"
|
||||
class="p-default p-curve p-fill p-icon"
|
||||
>
|
||||
{{
|
||||
$t(
|
||||
'templates.domainSections.https.enableEncryptedSslConnection',
|
||||
)
|
||||
}}
|
||||
</PrettyCheck>
|
||||
</div>
|
||||
</div>
|
||||
@@ -43,7 +50,10 @@ THE SOFTWARE.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="http2Enabled" class="field is-horizontal">
|
||||
<div
|
||||
v-if="http2Enabled"
|
||||
class="field is-horizontal"
|
||||
>
|
||||
<div class="field-label">
|
||||
<label class="label">{{ $t('templates.domainSections.https.http2') }}</label>
|
||||
</div>
|
||||
@@ -51,7 +61,10 @@ THE SOFTWARE.
|
||||
<div class="field">
|
||||
<div :class="`control${http2Changed ? ' is-changed' : ''}`">
|
||||
<div class="checkbox">
|
||||
<PrettyCheck v-model="http2" class="p-default p-curve p-fill p-icon">
|
||||
<PrettyCheck
|
||||
v-model="http2"
|
||||
class="p-default p-curve p-fill p-icon"
|
||||
>
|
||||
{{ $t('templates.domainSections.https.enableHttp2Connections') }}
|
||||
</PrettyCheck>
|
||||
</div>
|
||||
@@ -60,7 +73,10 @@ THE SOFTWARE.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="http3Enabled" class="field is-horizontal is-aligned-top">
|
||||
<div
|
||||
v-if="http3Enabled"
|
||||
class="field is-horizontal is-aligned-top"
|
||||
>
|
||||
<div class="field-label has-small-margin-top">
|
||||
<label class="label">{{ $t('templates.domainSections.https.http3') }}</label>
|
||||
</div>
|
||||
@@ -68,26 +84,42 @@ THE SOFTWARE.
|
||||
<div class="field">
|
||||
<div :class="`control${http3Changed ? ' is-changed' : ''}`">
|
||||
<div class="checkbox">
|
||||
<PrettyCheck v-model="http3" class="p-default p-curve p-fill p-icon">
|
||||
<PrettyCheck
|
||||
v-model="http3"
|
||||
class="p-default p-curve p-fill p-icon"
|
||||
>
|
||||
{{ $t('templates.domainSections.https.enableHttp3Connections') }}
|
||||
</PrettyCheck>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="showHttp3Warning" class="control">
|
||||
<div
|
||||
v-if="showHttp3Warning"
|
||||
class="control"
|
||||
>
|
||||
<label class="text message is-warning">
|
||||
<span class="message-body">
|
||||
{{ $t('templates.domainSections.https.http3IsANonStandardModule') }}
|
||||
<ExternalLink
|
||||
:text="$t('templates.domainSections.https.http3NginxQuicReadme')"
|
||||
:text="
|
||||
$t('templates.domainSections.https.http3NginxQuicReadme')
|
||||
"
|
||||
link="https://quic.nginx.org/README"
|
||||
></ExternalLink>
|
||||
{{ $t('templates.domainSections.https.http3OrThe') }}
|
||||
<ExternalLink
|
||||
:text="$t('templates.domainSections.https.http3CloudflareQuicheProject')"
|
||||
:text="
|
||||
$t(
|
||||
'templates.domainSections.https.http3CloudflareQuicheProject',
|
||||
)
|
||||
"
|
||||
link="https://github.com/cloudflare/quiche/tree/master/nginx"
|
||||
></ExternalLink>
|
||||
{{ $t('templates.domainSections.https.http3ForBuildingNginxWithHttp3') }}
|
||||
{{
|
||||
$t(
|
||||
'templates.domainSections.https.http3ForBuildingNginxWithHttp3',
|
||||
)
|
||||
}}
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
@@ -95,7 +127,10 @@ THE SOFTWARE.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="forceHttpsEnabled" class="field is-horizontal">
|
||||
<div
|
||||
v-if="forceHttpsEnabled"
|
||||
class="field is-horizontal"
|
||||
>
|
||||
<div class="field-label">
|
||||
<label class="label">{{ $t('templates.domainSections.https.forceHttps') }}</label>
|
||||
</div>
|
||||
@@ -103,7 +138,10 @@ THE SOFTWARE.
|
||||
<div class="field">
|
||||
<div :class="`control${forceHttpsChanged ? ' is-changed' : ''}`">
|
||||
<div class="checkbox">
|
||||
<PrettyCheck v-model="forceHttps" class="p-default p-curve p-fill p-icon">
|
||||
<PrettyCheck
|
||||
v-model="forceHttps"
|
||||
class="p-default p-curve p-fill p-icon"
|
||||
>
|
||||
(http://{{ $parent.$props.data.server.domain.computed }}
|
||||
<i class="fas fa-long-arrow-alt-right"></i>
|
||||
https://{{ $parent.$props.data.server.domain.computed }})
|
||||
@@ -114,7 +152,10 @@ THE SOFTWARE.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="hstsEnabled" class="field is-horizontal is-aligned-top">
|
||||
<div
|
||||
v-if="hstsEnabled"
|
||||
class="field is-horizontal is-aligned-top"
|
||||
>
|
||||
<div class="field-label">
|
||||
<label class="label">{{ $t('templates.domainSections.https.hsts') }}</label>
|
||||
</div>
|
||||
@@ -122,23 +163,42 @@ THE SOFTWARE.
|
||||
<div class="field">
|
||||
<div :class="`control${hstsChanged ? ' is-changed' : ''}`">
|
||||
<div class="checkbox">
|
||||
<PrettyCheck v-model="hsts" class="p-default p-curve p-fill p-icon">
|
||||
{{ $t('templates.domainSections.https.enableStrictTransportSecurity') }}
|
||||
<PrettyCheck
|
||||
v-model="hsts"
|
||||
class="p-default p-curve p-fill p-icon"
|
||||
>
|
||||
{{
|
||||
$t(
|
||||
'templates.domainSections.https.enableStrictTransportSecurity',
|
||||
)
|
||||
}}
|
||||
</PrettyCheck>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="hstsSubdomainsEnabled" :class="`control${hstsSubdomainsChanged ? ' is-changed' : ''}`">
|
||||
<div
|
||||
v-if="hstsSubdomainsEnabled"
|
||||
:class="`control${hstsSubdomainsChanged ? ' is-changed' : ''}`"
|
||||
>
|
||||
<div class="checkbox">
|
||||
<PrettyCheck v-model="hstsSubdomains" class="p-default p-curve p-fill p-icon">
|
||||
<PrettyCheck
|
||||
v-model="hstsSubdomains"
|
||||
class="p-default p-curve p-fill p-icon"
|
||||
>
|
||||
{{ $t('templates.domainSections.https.enableIncludeSubDomains') }}
|
||||
</PrettyCheck>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="hstsPreloadEnabled" :class="`control${hstsPreloadChanged ? ' is-changed' : ''}`">
|
||||
<div
|
||||
v-if="hstsPreloadEnabled"
|
||||
:class="`control${hstsPreloadChanged ? ' is-changed' : ''}`"
|
||||
>
|
||||
<div class="checkbox">
|
||||
<PrettyCheck v-model="hstsPreload" class="p-default p-curve p-fill p-icon">
|
||||
<PrettyCheck
|
||||
v-model="hstsPreload"
|
||||
class="p-default p-curve p-fill p-icon"
|
||||
>
|
||||
{{ $t('templates.domainSections.https.enablePreload') }}
|
||||
</PrettyCheck>
|
||||
</div>
|
||||
@@ -147,18 +207,29 @@ THE SOFTWARE.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="certTypeEnabled" class="field is-horizontal is-aligned-top">
|
||||
<div
|
||||
v-if="certTypeEnabled"
|
||||
class="field is-horizontal is-aligned-top"
|
||||
>
|
||||
<div class="field-label">
|
||||
<label class="label">{{ $t('templates.domainSections.https.certificationType') }}</label>
|
||||
<label class="label">
|
||||
{{ $t('templates.domainSections.https.certificationType') }}
|
||||
</label>
|
||||
</div>
|
||||
<div class="field-body">
|
||||
<div class="field">
|
||||
<div
|
||||
v-for="(name, value) in $props.data.certType.options"
|
||||
:class="`control${certTypeChanged && value === certType ? ' is-changed' : ''}`"
|
||||
:class="`control${
|
||||
certTypeChanged && value === certType ? ' is-changed' : ''
|
||||
}`"
|
||||
>
|
||||
<div class="radio">
|
||||
<PrettyRadio v-model="certType" :value="value" class="p-default p-round p-fill p-icon">
|
||||
<PrettyRadio
|
||||
v-model="certType"
|
||||
:value="value"
|
||||
class="p-default p-round p-fill p-icon"
|
||||
>
|
||||
{{ $t(name) }}
|
||||
</PrettyRadio>
|
||||
</div>
|
||||
@@ -167,9 +238,14 @@ THE SOFTWARE.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="letsEncryptEmailEnabled" class="field is-horizontal">
|
||||
<div
|
||||
v-if="letsEncryptEmailEnabled"
|
||||
class="field is-horizontal"
|
||||
>
|
||||
<div class="field-label">
|
||||
<label class="label">{{ $t('templates.domainSections.https.letsEncryptEmail') }}</label>
|
||||
<label class="label">
|
||||
{{ $t('templates.domainSections.https.letsEncryptEmail') }}
|
||||
</label>
|
||||
</div>
|
||||
<div class="field-body">
|
||||
<div class="field">
|
||||
@@ -185,7 +261,10 @@ THE SOFTWARE.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="sslCertificateEnabled" class="field is-horizontal">
|
||||
<div
|
||||
v-if="sslCertificateEnabled"
|
||||
class="field is-horizontal"
|
||||
>
|
||||
<div class="field-label">
|
||||
<label class="label">ssl_certificate</label>
|
||||
</div>
|
||||
@@ -203,7 +282,10 @@ THE SOFTWARE.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="sslCertificateKeyEnabled" class="field is-horizontal">
|
||||
<div
|
||||
v-if="sslCertificateKeyEnabled"
|
||||
class="field is-horizontal"
|
||||
>
|
||||
<div class="field-label">
|
||||
<label class="label">ssl_certificate_key</label>
|
||||
</div>
|
||||
@@ -284,20 +366,20 @@ THE SOFTWARE.
|
||||
};
|
||||
|
||||
export default {
|
||||
name: 'DomainHTTPS', // Component name
|
||||
display: 'common.https', // Display name for tab (i18n key)
|
||||
key: 'https', // Key for data in parent
|
||||
delegated: delegatedFromDefaults(defaults), // Data the parent will present here
|
||||
name: 'DomainHTTPS', // Component name
|
||||
display: 'common.https', // Display name for tab (i18n key)
|
||||
key: 'https', // Key for data in parent
|
||||
delegated: delegatedFromDefaults(defaults), // Data the parent will present here
|
||||
components: {
|
||||
PrettyCheck,
|
||||
PrettyRadio,
|
||||
ExternalLink,
|
||||
},
|
||||
props: {
|
||||
data: Object, // Data delegated back to us from parent
|
||||
data: Object, // Data delegated back to us from parent
|
||||
},
|
||||
computed: {
|
||||
...computedFromDefaults(defaults, 'https'), // Getters & setters for the delegated data
|
||||
...computedFromDefaults(defaults, 'https'), // Getters & setters for the delegated data
|
||||
showHttp3Warning() {
|
||||
return this.$props.data.http3.computed;
|
||||
},
|
||||
@@ -342,14 +424,18 @@ THE SOFTWARE.
|
||||
// hstsSubdomains
|
||||
if (this.$props.data.hsts.computed) {
|
||||
this.$props.data.hstsSubdomains.enabled = true;
|
||||
this.$props.data.hstsSubdomains.computed = this.$props.data.hstsSubdomains.value;
|
||||
this.$props.data.hstsSubdomains.computed =
|
||||
this.$props.data.hstsSubdomains.value;
|
||||
} else {
|
||||
this.$props.data.hstsSubdomains.enabled = false;
|
||||
this.$props.data.hstsSubdomains.computed = false;
|
||||
}
|
||||
|
||||
// hstsPreload
|
||||
if (this.$props.data.hsts.computed && this.$props.data.hstsSubdomains.computed) {
|
||||
if (
|
||||
this.$props.data.hsts.computed &&
|
||||
this.$props.data.hstsSubdomains.computed
|
||||
) {
|
||||
this.$props.data.hstsPreload.enabled = true;
|
||||
this.$props.data.hstsPreload.computed = this.$props.data.hstsPreload.value;
|
||||
} else {
|
||||
@@ -373,12 +459,14 @@ THE SOFTWARE.
|
||||
this.$props.data.sslCertificateKey.computed = '';
|
||||
} else {
|
||||
// First, check its valid
|
||||
if (!Object.keys(data.options).includes(data.computed)) data.computed = data.default;
|
||||
if (!Object.keys(data.options).includes(data.computed))
|
||||
data.computed = data.default;
|
||||
|
||||
// Show the correct fields
|
||||
if (data.computed === 'letsEncrypt') {
|
||||
this.$props.data.letsEncryptEmail.enabled = true;
|
||||
this.$props.data.letsEncryptEmail.computed = this.$props.data.letsEncryptEmail.value;
|
||||
this.$props.data.letsEncryptEmail.computed =
|
||||
this.$props.data.letsEncryptEmail.value;
|
||||
|
||||
this.$props.data.sslCertificate.enabled = false;
|
||||
this.$props.data.sslCertificate.computed = '';
|
||||
@@ -386,9 +474,11 @@ THE SOFTWARE.
|
||||
this.$props.data.sslCertificateKey.computed = '';
|
||||
} else {
|
||||
this.$props.data.sslCertificate.enabled = true;
|
||||
this.$props.data.sslCertificate.computed = this.$props.data.sslCertificate.value;
|
||||
this.$props.data.sslCertificate.computed =
|
||||
this.$props.data.sslCertificate.value;
|
||||
this.$props.data.sslCertificateKey.enabled = true;
|
||||
this.$props.data.sslCertificateKey.computed = this.$props.data.sslCertificateKey.value;
|
||||
this.$props.data.sslCertificateKey.computed =
|
||||
this.$props.data.sslCertificateKey.value;
|
||||
|
||||
this.$props.data.letsEncryptEmail.enabled = false;
|
||||
this.$props.data.letsEncryptEmail.computed = '';
|
||||
|
||||
Reference in New Issue
Block a user