mirror of
https://github.com/VueFileManager/vuefilemanager.git
synced 2026-04-24 01:50:38 +00:00
added prettier
This commit is contained in:
Čarodej
@@ -1,40 +1,37 @@
|
||||
<template>
|
||||
<div class="landing-page">
|
||||
|
||||
<!--Navigation-->
|
||||
<Navigation class="page-wrapper small"/>
|
||||
<Navigation class="page-wrapper small" />
|
||||
|
||||
<!--Page content-->
|
||||
<div class="page-wrapper small">
|
||||
|
||||
<!--Headline-->
|
||||
<PageTitle
|
||||
class="headline"
|
||||
:title="$t('page_contact_us.title')"
|
||||
:description="$t('page_contact_us.description')"
|
||||
></PageTitle>
|
||||
|
||||
<ValidationObserver v-if="! isSuccess" @submit.prevent="contactForm" ref="contactForm" v-slot="{ invalid }" tag="form"
|
||||
class="form block-form">
|
||||
<PageTitle class="headline" :title="$t('page_contact_us.title')" :description="$t('page_contact_us.description')"></PageTitle>
|
||||
|
||||
<ValidationObserver v-if="!isSuccess" @submit.prevent="contactForm" ref="contactForm" v-slot="{ invalid }" tag="form" class="form block-form">
|
||||
<div class="block-wrapper">
|
||||
<label>{{ $t('page_contact_us.form.email') }}:</label>
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="E-Mail" rules="required"
|
||||
v-slot="{ errors }">
|
||||
<input v-model="contact.email" :placeholder="$t('page_contact_us.form.email_plac')" type="email"
|
||||
class="focus-border-theme"
|
||||
:class="{'border-red': errors[0]}"/>
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="E-Mail" rules="required" v-slot="{ errors }">
|
||||
<input
|
||||
v-model="contact.email"
|
||||
:placeholder="$t('page_contact_us.form.email_plac')"
|
||||
type="email"
|
||||
class="focus-border-theme"
|
||||
:class="{ 'border-red': errors[0] }"
|
||||
/>
|
||||
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
|
||||
</ValidationProvider>
|
||||
</div>
|
||||
|
||||
<div class="block-wrapper">
|
||||
<label>{{ $t('page_contact_us.form.message') }}:</label>
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="Message" rules="required"
|
||||
v-slot="{ errors }">
|
||||
<textarea v-model="contact.message" :placeholder="$t('page_contact_us.form.message_plac')" rows="6"
|
||||
class="focus-border-theme"
|
||||
:class="{'border-red': errors[0]}"
|
||||
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="Message" rules="required" v-slot="{ errors }">
|
||||
<textarea
|
||||
v-model="contact.message"
|
||||
:placeholder="$t('page_contact_us.form.message_plac')"
|
||||
rows="6"
|
||||
class="focus-border-theme"
|
||||
:class="{ 'border-red': errors[0] }"
|
||||
></textarea>
|
||||
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
|
||||
</ValidationProvider>
|
||||
@@ -45,7 +42,7 @@
|
||||
</InfoBox>
|
||||
|
||||
<div>
|
||||
<AuthButton class="submit-button" icon="chevron-right" :text="$t('page_contact_us.form.submit_button')" :loading="isLoading" :disabled="isLoading"/>
|
||||
<AuthButton class="submit-button" icon="chevron-right" :text="$t('page_contact_us.form.submit_button')" :loading="isLoading" :disabled="isLoading" />
|
||||
</div>
|
||||
</ValidationObserver>
|
||||
<InfoBox v-if="isSuccess">
|
||||
@@ -54,119 +51,116 @@
|
||||
</div>
|
||||
|
||||
<!--Footer-->
|
||||
<PageFooter/>
|
||||
<PageFooter />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {ValidationProvider, ValidationObserver} from 'vee-validate/dist/vee-validate.full'
|
||||
import PageTitle from "../../components/Index/Components/PageTitle";
|
||||
import PageFooter from '../../components/Index/IndexPageFooter'
|
||||
import Navigation from '../../components/Index/IndexNavigation'
|
||||
import InfoBox from "../../components/Others/Forms/InfoBox";
|
||||
import AuthButton from "../../components/Auth/AuthButton";
|
||||
import {required} from 'vee-validate/dist/rules'
|
||||
import {mapGetters} from 'vuex'
|
||||
import axios from 'axios'
|
||||
import { ValidationProvider, ValidationObserver } from 'vee-validate/dist/vee-validate.full'
|
||||
import PageTitle from '../../components/Index/Components/PageTitle'
|
||||
import PageFooter from '../../components/Index/IndexPageFooter'
|
||||
import Navigation from '../../components/Index/IndexNavigation'
|
||||
import InfoBox from '../../components/Others/Forms/InfoBox'
|
||||
import AuthButton from '../../components/Auth/AuthButton'
|
||||
import { required } from 'vee-validate/dist/rules'
|
||||
import { mapGetters } from 'vuex'
|
||||
import axios from 'axios'
|
||||
|
||||
export default {
|
||||
name: 'ContactUs',
|
||||
components: {
|
||||
ValidationProvider,
|
||||
ValidationObserver,
|
||||
AuthButton,
|
||||
PageFooter,
|
||||
Navigation,
|
||||
PageTitle,
|
||||
required,
|
||||
InfoBox,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['config']),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isLoading: false,
|
||||
isSuccess: false,
|
||||
isError: false,
|
||||
contact: {
|
||||
email: '',
|
||||
message: '',
|
||||
reCaptcha: null,
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async contactForm() {
|
||||
|
||||
// Validate fields
|
||||
const isValid = await this.$refs.contactForm.validate();
|
||||
|
||||
if (!isValid) return;
|
||||
|
||||
// Start loading
|
||||
this.isLoading = true
|
||||
|
||||
// Get ReCaptcha token
|
||||
if(config.allowedRecaptcha) {
|
||||
this.register.reCaptcha = await this.$reCaptchaToken('register').then((response) => {
|
||||
return response
|
||||
})
|
||||
}
|
||||
|
||||
// Send request to get user token
|
||||
axios
|
||||
.post('/api/contact', this.contact)
|
||||
.then(() => {
|
||||
this.isSuccess = true
|
||||
})
|
||||
.catch(() => {
|
||||
this.isError = true
|
||||
})
|
||||
.finally(() => {
|
||||
// End loading
|
||||
this.isLoading = false
|
||||
})
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.$scrollTop()
|
||||
export default {
|
||||
name: 'ContactUs',
|
||||
components: {
|
||||
ValidationProvider,
|
||||
ValidationObserver,
|
||||
AuthButton,
|
||||
PageFooter,
|
||||
Navigation,
|
||||
PageTitle,
|
||||
required,
|
||||
InfoBox,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['config']),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isLoading: false,
|
||||
isSuccess: false,
|
||||
isError: false,
|
||||
contact: {
|
||||
email: '',
|
||||
message: '',
|
||||
reCaptcha: null,
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async contactForm() {
|
||||
// Validate fields
|
||||
const isValid = await this.$refs.contactForm.validate()
|
||||
|
||||
if (!isValid) return
|
||||
|
||||
// Start loading
|
||||
this.isLoading = true
|
||||
|
||||
// Get ReCaptcha token
|
||||
if (config.allowedRecaptcha) {
|
||||
this.register.reCaptcha = await this.$reCaptchaToken('register').then((response) => {
|
||||
return response
|
||||
})
|
||||
}
|
||||
|
||||
// Send request to get user token
|
||||
axios
|
||||
.post('/api/contact', this.contact)
|
||||
.then(() => {
|
||||
this.isSuccess = true
|
||||
})
|
||||
.catch(() => {
|
||||
this.isError = true
|
||||
})
|
||||
.finally(() => {
|
||||
// End loading
|
||||
this.isLoading = false
|
||||
})
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.$scrollTop()
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import '../../../sass/vuefilemanager/landing-page';
|
||||
@import '../../../sass/vuefilemanager/variables';
|
||||
@import '../../../sass/vuefilemanager/mixins';
|
||||
@import '../../../sass/vuefilemanager/forms';
|
||||
@import '../../../sass/vuefilemanager/landing-page';
|
||||
@import '../../../sass/vuefilemanager/variables';
|
||||
@import '../../../sass/vuefilemanager/mixins';
|
||||
@import '../../../sass/vuefilemanager/forms';
|
||||
|
||||
.form {
|
||||
max-width: 100%;
|
||||
.form {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.headline {
|
||||
padding-top: 70px;
|
||||
padding-bottom: 50px;
|
||||
}
|
||||
|
||||
.form.block-form {
|
||||
.submit-button {
|
||||
margin-top: 20px;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.dark {
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 960px) {
|
||||
.headline {
|
||||
padding-top: 70px;
|
||||
padding-bottom: 50px;
|
||||
}
|
||||
|
||||
.form.block-form {
|
||||
|
||||
.submit-button {
|
||||
margin-top: 20px;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.dark {
|
||||
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 960px) {
|
||||
.headline {
|
||||
padding-top: 50px;
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
padding-top: 50px;
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,99 +1,91 @@
|
||||
<template>
|
||||
<div class="landing-page">
|
||||
|
||||
<!--Navigation-->
|
||||
<Navigation class="page-wrapper small"/>
|
||||
<Navigation class="page-wrapper small" />
|
||||
|
||||
<!--Page content-->
|
||||
<div class="page-wrapper small">
|
||||
|
||||
<!--Headline-->
|
||||
<PageTitle
|
||||
class="headline"
|
||||
:title="page.data.attributes.title"
|
||||
></PageTitle>
|
||||
<PageTitle class="headline" :title="page.data.attributes.title"></PageTitle>
|
||||
|
||||
<!--Content-->
|
||||
<div class="page-content" v-html="page.data.attributes.content_formatted"></div>
|
||||
</div>
|
||||
|
||||
<!--Footer-->
|
||||
<PageFooter/>
|
||||
<PageFooter />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import PageTitle from "../../components/Index/Components/PageTitle";
|
||||
import PageFooter from '../../components/Index/IndexPageFooter'
|
||||
import Navigation from '../../components/Index/IndexNavigation'
|
||||
import {mapGetters} from 'vuex'
|
||||
import axios from 'axios'
|
||||
import PageTitle from '../../components/Index/Components/PageTitle'
|
||||
import PageFooter from '../../components/Index/IndexPageFooter'
|
||||
import Navigation from '../../components/Index/IndexNavigation'
|
||||
import { mapGetters } from 'vuex'
|
||||
import axios from 'axios'
|
||||
|
||||
export default {
|
||||
name: 'DynamicPage',
|
||||
components: {
|
||||
PageFooter,
|
||||
Navigation,
|
||||
PageTitle,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['config']),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isLoading: false,
|
||||
page: undefined,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
$route(to, from) {
|
||||
this.getPage()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getPage() {
|
||||
axios.get('/api/page/' + this.$route.params.slug)
|
||||
.then(response => {
|
||||
this.page = response.data
|
||||
|
||||
this.$scrollTop()
|
||||
})
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getPage()
|
||||
export default {
|
||||
name: 'DynamicPage',
|
||||
components: {
|
||||
PageFooter,
|
||||
Navigation,
|
||||
PageTitle,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['config']),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isLoading: false,
|
||||
page: undefined,
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
$route(to, from) {
|
||||
this.getPage()
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
getPage() {
|
||||
axios.get('/api/page/' + this.$route.params.slug).then((response) => {
|
||||
this.page = response.data
|
||||
|
||||
this.$scrollTop()
|
||||
})
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.getPage()
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import '../../../sass/vuefilemanager/landing-page';
|
||||
@import '../../../sass/vuefilemanager/variables';
|
||||
@import '../../../sass/vuefilemanager/mixins';
|
||||
@import '../../../sass/vuefilemanager/landing-page';
|
||||
@import '../../../sass/vuefilemanager/variables';
|
||||
@import '../../../sass/vuefilemanager/mixins';
|
||||
|
||||
.headline {
|
||||
padding-top: 70px;
|
||||
padding-bottom: 50px;
|
||||
}
|
||||
|
||||
.page-content {
|
||||
/deep/ p {
|
||||
@include font-size(20);
|
||||
font-weight: 500;
|
||||
line-height: 1.65;
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.dark {
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 960px) {
|
||||
.headline {
|
||||
padding-top: 70px;
|
||||
padding-bottom: 50px;
|
||||
}
|
||||
|
||||
.page-content {
|
||||
|
||||
/deep/ p {
|
||||
@include font-size(20);
|
||||
font-weight: 500;
|
||||
line-height: 1.65;
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.dark {
|
||||
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 960px) {
|
||||
.headline {
|
||||
padding-top: 50px;
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
padding-top: 50px;
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="landing-page">
|
||||
<div v-if="! isLoading">
|
||||
<div v-if="!isLoading">
|
||||
<!--Navigation-->
|
||||
<Navigation class="page-wrapper medium" />
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
<MainFeatures />
|
||||
|
||||
<!--Pricing Tables-->
|
||||
<!-- <PricingTables v-if="config.isSaaS" />-->
|
||||
<!-- <PricingTables v-if="config.isSaaS" />-->
|
||||
|
||||
<!--Get Started Call To Action-->
|
||||
<GetStarted />
|
||||
@@ -29,63 +29,62 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import HeroScreenshot from '../../components/Index/IndexHeroScreenshot'
|
||||
import PricingTables from '../../components/Index/IndexPricingTables'
|
||||
import MainFeatures from '../../components/Index/IndexMainFeatures'
|
||||
import Navigation from '../../components/Index/IndexNavigation'
|
||||
import PageHeader from '../../components/Index/IndexPageHeader'
|
||||
import GetStarted from '../../components/Index/IndexGetStarted'
|
||||
import PageFooter from '../../components/Index/IndexPageFooter'
|
||||
import Spinner from "../../components/FilesView/Spinner";
|
||||
import { mapGetters } from 'vuex'
|
||||
import axios from 'axios'
|
||||
import HeroScreenshot from '../../components/Index/IndexHeroScreenshot'
|
||||
import PricingTables from '../../components/Index/IndexPricingTables'
|
||||
import MainFeatures from '../../components/Index/IndexMainFeatures'
|
||||
import Navigation from '../../components/Index/IndexNavigation'
|
||||
import PageHeader from '../../components/Index/IndexPageHeader'
|
||||
import GetStarted from '../../components/Index/IndexGetStarted'
|
||||
import PageFooter from '../../components/Index/IndexPageFooter'
|
||||
import Spinner from '../../components/FilesView/Spinner'
|
||||
import { mapGetters } from 'vuex'
|
||||
import axios from 'axios'
|
||||
|
||||
export default {
|
||||
name: 'Homepage',
|
||||
components: {
|
||||
HeroScreenshot,
|
||||
PricingTables,
|
||||
MainFeatures,
|
||||
GetStarted,
|
||||
Navigation,
|
||||
PageHeader,
|
||||
PageFooter,
|
||||
Spinner,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['config']),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isLoading: true,
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
if (! this.config.allowHomepage)
|
||||
this.$router.push({name: 'SignIn'})
|
||||
|
||||
// Get page content
|
||||
axios.get('/api/settings', {
|
||||
params: {
|
||||
column: 'allow_homepage|footer_content|get_started_description|get_started_title|pricing_description|pricing_title|feature_description_3|feature_title_3|feature_description_2|feature_title_2|feature_description_1|feature_title_1|features_description|features_title|header_description|header_title|section_get_started|section_pricing_content|section_feature_boxes|section_features'
|
||||
}
|
||||
})
|
||||
.then(response => {
|
||||
this.$store.commit('SET_INDEX_CONTENT', response.data)
|
||||
})
|
||||
.finally(() => {
|
||||
this.isLoading = false
|
||||
})
|
||||
},
|
||||
created() {
|
||||
this.$scrollTop()
|
||||
export default {
|
||||
name: 'Homepage',
|
||||
components: {
|
||||
HeroScreenshot,
|
||||
PricingTables,
|
||||
MainFeatures,
|
||||
GetStarted,
|
||||
Navigation,
|
||||
PageHeader,
|
||||
PageFooter,
|
||||
Spinner,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['config']),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isLoading: true,
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
if (!this.config.allowHomepage) this.$router.push({ name: 'SignIn' })
|
||||
|
||||
// Get page content
|
||||
axios
|
||||
.get('/api/settings', {
|
||||
params: {
|
||||
column: 'allow_homepage|footer_content|get_started_description|get_started_title|pricing_description|pricing_title|feature_description_3|feature_title_3|feature_description_2|feature_title_2|feature_description_1|feature_title_1|features_description|features_title|header_description|header_title|section_get_started|section_pricing_content|section_feature_boxes|section_features',
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
this.$store.commit('SET_INDEX_CONTENT', response.data)
|
||||
})
|
||||
.finally(() => {
|
||||
this.isLoading = false
|
||||
})
|
||||
},
|
||||
created() {
|
||||
this.$scrollTop()
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import '../../../sass/vuefilemanager/landing-page';
|
||||
@import '../../../sass/vuefilemanager/variables';
|
||||
@import '../../../sass/vuefilemanager/mixins';
|
||||
@import '../../../sass/vuefilemanager/landing-page';
|
||||
@import '../../../sass/vuefilemanager/variables';
|
||||
@import '../../../sass/vuefilemanager/mixins';
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user