Chamilo is a learning management system focused on ease of use and accessibility
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 
chamilo-lms/assets/vue/components/installer/Step3.vue

284 lines
8.1 KiB

<template>
<div class="install-step">
<SectionHeader :title="t('Step 3 - License')" />
<p
v-t="'Chamilo is free software distributed under the GNU General Public licence (GPL).'"
class="RequirementHeading mb-4"
/>
<a
v-t="'Printable version'"
class="mb-4"
href="/main/documentation/license.html"
target="_blank"
/>
<div class="field">
<pre
class="bg-gray-15 py-3 px-6 h-80 overflow-y-auto text-sm border border-solid border-gray-25 rounded-md"
v-html="installerData.stepData.license"
/>
</div>
<div class="field-checkbox">
<Checkbox
v-model="acceptLicence"
:binary="true"
input-id="accept_licence"
name="accept"
value="1"
/>
<label
v-t="'I accept'"
for="accept_licence"
/>
</div>
<hr />
<Fieldset
:legend="t('Contact information')"
:toggleable="true"
class="mt-4"
>
<div class="space-y-3 mb-3">
<p v-t="'Dear user'" />
<p
v-t="
'You are about to start using one of the best open-source e-learning platform on the market. Like many other open-source project, this project is backed up by a large community of students, teachers, developers and content creators who would like to promote the project better.'
"
/>
<p
v-t="
'By knowing a little bit more about you, one of our most important users, who will manage this e-learning system, we will be able to let people know that our software is used and let you know when we organize events that might be relevant to you.'
"
/>
<p
v-t="
'By filling this form, you accept that the Chamilo association or its members might send you information by e-mail about important events or updates in the Chamilo software or community. This will help the community grow as an organized entity where information flow, with a permanent respect of your time and your privacy.'
"
/>
<p
v-html="
t(
'Please note that you are <b>not required</b> to fill this form. If you want to remain anonymous, we will loose the opportunity to offer you all the privileges of being a registered portal administrator, but we will respect your decision. Simply leave this form empty and click Next',
)
"
/>
</div>
<BaseInputText
id="person_name"
v-model="contact.personName"
:label="t('Name')"
/>
<BaseInputText
id="person_email"
v-model="contact.personEmail"
:label="t('E-mail')"
/>
<BaseInputText
id="company_name"
v-model="contact.companyName"
:label="t('Your company\'s name')"
/>
<BaseDropdown
v-model="contact.companyActivity"
:label="t('Your company\'s activity')"
:options="installerData.stepData.activitiesList"
input-id="company_activity"
name="company_activity"
option-label="0"
option-value="0"
/>
<BaseDropdown
v-model="contact.jobRole"
:label="t('Your job\'s description')"
:options="installerData.stepData.rolesList"
input-id="person_role"
name="person_role"
option-label="0"
option-value="0"
/>
<BaseDropdown
v-model="contact.companyCountry"
:label="t('Your company\'s home country')"
:options="installerData.stepData.countriesList"
input-id="country"
name="country"
option-label="0"
option-value="0"
/>
<BaseInputText
id="company_city"
v-model="contact.companyCity"
:label="t('Company city')"
/>
<BaseDropdown
v-model="contact.contactLanguage"
:label="t('Preferred contact language')"
:options="installerData.stepData.languagesList"
input-id="language"
name="country"
option-label="1"
option-value="0"
/>
<label v-t="'Do you have the power to take financial decisions on behalf of your company?'" />
<div class="formgroup-inline">
<div class="field-checkbox">
<RadioButton
v-model="contact.financialDecision"
:value="true"
input-id="final_decision_yes"
name="finalcial_decision"
/>
<label
v-t="'Yes'"
for="final_decision_yes"
/>
</div>
<div class="field-checkbox">
<RadioButton
v-model="contact.financialDecision"
:value="false"
input-id="final_decision_no"
name="finalcial_decision"
/>
<label
v-t="'No'"
for="final_decision_no"
/>
</div>
</div>
<div class="formgroup-inline">
<Button
:label="t('Send information')"
:loading="sendingContactInformation"
class="p-button-outlined p-button-plain"
icon="mdi mdi-send-check"
type="button"
@click="sendContactInformation"
/>
</div>
</Fieldset>
<hr />
<div class="formgroup-inline">
<div class="field">
<Button
:label="t('Previous')"
class="p-button-plain"
icon="mdi mdi-page-previous"
name="step1"
type="submit"
/>
</div>
<Button
id="license-next"
ref="btnNext"
:disabled="!acceptLicence"
:label="t('Next')"
class="p-button-success"
icon="mdi mdi-page-next"
name="step3"
type="submit"
/>
<input
id="is_executable"
name="is_executable"
type="hidden"
value="-"
/>
</div>
</div>
</template>
<script setup>
import { useI18n } from "vue-i18n"
import { inject, reactive, ref } from "vue"
import axios from "axios"
import Checkbox from "primevue/checkbox"
import Fieldset from "primevue/fieldset"
import RadioButton from "primevue/radiobutton"
import Button from "primevue/button"
import BaseInputText from "../basecomponents/BaseInputText.vue"
import BaseDropdown from "../basecomponents/BaseDropdown.vue"
import SectionHeader from "../layout/SectionHeader.vue"
const { t } = useI18n()
const installerData = inject("installerData")
const acceptLicence = ref(false)
const contact = reactive({
personName: null,
personEmail: null,
companyName: null,
companyActivity: null,
jobRole: null,
companyCountry: null,
companyCity: null,
contactLanguage: null,
financialDecision: true,
})
const sendingContactInformation = ref(false)
const btnNext = ref(null)
async function sendContactInformation() {
if (!acceptLicence.value) {
alert(t("You must accept the licence"))
return
}
sendingContactInformation.value = true
const formData = new FormData()
formData.append("person_name", contact.personName)
formData.append("person_email", contact.personEmail)
formData.append("company_name", contact.companyName)
formData.append("company_activity", contact.companyActivity)
formData.append("person_role", contact.jobRole)
formData.append("company_country", contact.companyCountry)
formData.append("company_city", contact.companyCity)
formData.append("language", contact.contactLanguage)
formData.append("financial_decision", contact.financialDecision * 1 + "")
const { data } = await axios.post("/main/inc/ajax/install.ajax.php?a=send_contact_information", formData, {
headers: { "content-type": "application/x-www-form-urlencoded" },
})
if ("1" === data + "") {
alert(t("Contact information has been sent"))
btnNext.value.$el.click()
return
} else if ("required_field_error" === data) {
alert(t("The form contains incorrect or incomplete data. Please check your input."))
} else {
alert(
t(
"Your contact information could not be sent. This is probably due to a temporary network problem. Please try again in a few seconds. If the problem remains, ignore this registration process and simply click the button to go to the next step.",
),
)
}
sendingContactInformation.value = false
}
</script>