Angel Fernando Quiroz Campos
3 years ago
parent
f8719aebdc
commit
1b2ceeb174
@ -0,0 +1,49 @@ |
||||
.p-inline-message { |
||||
@apply py-3 px-4 m-0 rounded-md border border-solid flex gap-3.5 bg-white; |
||||
|
||||
.p-inline-message-icon { |
||||
font-size: 1rem; |
||||
} |
||||
|
||||
.p-inline-message-text { |
||||
font-size: 1rem; |
||||
} |
||||
|
||||
&.p-inline-message-info { |
||||
@apply text-info; |
||||
|
||||
.p-inline-message-icon { |
||||
@apply text-info; |
||||
} |
||||
} |
||||
|
||||
&.p-inline-message-success { |
||||
@apply text-success; |
||||
|
||||
.p-inline-message-icon { |
||||
@apply text-success; |
||||
} |
||||
} |
||||
|
||||
&.p-inline-message-warn { |
||||
@apply text-warning; |
||||
|
||||
.p-inline-message-icon { |
||||
@apply text-warning; |
||||
} |
||||
} |
||||
|
||||
&.p-inline-message-error { |
||||
@apply text-error; |
||||
|
||||
.p-inline-message-icon { |
||||
@apply text-error; |
||||
} |
||||
} |
||||
|
||||
&.p-inline-message-icon-only { |
||||
.p-inline-message-icon { |
||||
|
||||
} |
||||
} |
||||
} |
||||
@ -0,0 +1,63 @@ |
||||
.p-tag { |
||||
@apply box-decoration-clone text-caption-bold py-1 px-4 rounded-full text-white inline-block; |
||||
|
||||
&-success { |
||||
@apply bg-success; |
||||
} |
||||
|
||||
&-danger { |
||||
@apply bg-error; |
||||
} |
||||
|
||||
&-warning { |
||||
@apply bg-warning; |
||||
} |
||||
|
||||
&-info { |
||||
@apply bg-info; |
||||
} |
||||
|
||||
&-primary { |
||||
@apply bg-primary; |
||||
} |
||||
|
||||
&-secondary { |
||||
@apply bg-secondary; |
||||
} |
||||
|
||||
&-icon { |
||||
@apply mr-1.5; |
||||
} |
||||
} |
||||
|
||||
.badge { |
||||
@apply box-decoration-clone text-caption-bold py-1 px-4 rounded-full text-white inline-block; |
||||
|
||||
&--default { |
||||
@apply bg-gray-50; |
||||
} |
||||
|
||||
&--error { |
||||
@apply bg-error; |
||||
} |
||||
|
||||
&--success { |
||||
@apply bg-success; |
||||
} |
||||
|
||||
&--warning { |
||||
@apply bg-warning; |
||||
} |
||||
|
||||
&--info { |
||||
@apply bg-info; |
||||
} |
||||
|
||||
&--primary { |
||||
@apply bg-primary; |
||||
} |
||||
|
||||
&--secondary { |
||||
@apply bg-secondary; |
||||
} |
||||
} |
||||
@ -0,0 +1,35 @@ |
||||
.install-steps { |
||||
@apply space-y-4; |
||||
|
||||
.logo-install { |
||||
@apply block mx-auto w-fit; |
||||
} |
||||
|
||||
ol { |
||||
@apply list-decimal list-inside flex flex-col gap-1; |
||||
} |
||||
|
||||
&__step { |
||||
@apply border-0 border-solid py-3 pl-9 pr-3 text-body-2-bold text-gray-50; |
||||
|
||||
&--active { |
||||
@apply bg-support-1 text-primary border-primary border-l-4 pl-8; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.install-step { |
||||
|
||||
} |
||||
|
||||
table.requirements-list { |
||||
.requirements-item { |
||||
@apply text-left; |
||||
} |
||||
.requirements-recommended { |
||||
@apply text-center; |
||||
} |
||||
.requirements-value { |
||||
@apply text-center; |
||||
} |
||||
} |
||||
@ -0,0 +1,27 @@ |
||||
@layer components { |
||||
.table-responsive { |
||||
@apply overflow-x-auto min-w-full; |
||||
} |
||||
|
||||
table { |
||||
@apply w-full border-collapse border-spacing-0 table-auto; |
||||
} |
||||
|
||||
th, |
||||
td { |
||||
@apply p-1; |
||||
} |
||||
|
||||
th { |
||||
@apply text-body-2-bold; |
||||
} |
||||
|
||||
td { |
||||
@apply text-body-2; |
||||
|
||||
strong, |
||||
b { |
||||
@apply text-body-2-bold; |
||||
} |
||||
} |
||||
} |
||||
@ -0,0 +1,299 @@ |
||||
<template> |
||||
<div class="grid grid-cols-3 gap-4 rounded bg-white p-6 mb-4"> |
||||
<aside class="install-steps hidden md:block"> |
||||
<a |
||||
class="logo-install" |
||||
href="index.php" |
||||
> |
||||
<img |
||||
alt="Chamilo" |
||||
src="/build/css/themes/chamilo/images/header-logo.png" |
||||
> |
||||
</a> |
||||
<ol> |
||||
<li |
||||
v-for="{step, stepTitle} in steps" |
||||
:key="step" |
||||
:class="{ 'install-steps__step--active': step === installerData.currentStep }" |
||||
class="install-steps__step" |
||||
> |
||||
{{ stepTitle }} |
||||
</li> |
||||
</ol> |
||||
<div id="note"> |
||||
<a |
||||
class="p-button p-component p-button-info p-button-outlined" |
||||
href="../../documentation/installation_guide.html" |
||||
target="_blank" |
||||
> |
||||
<span |
||||
aria-hidden="true" |
||||
class="p-button-icon p-button-icon-left mdi mdi-text-box-search-outline" |
||||
/> |
||||
<span class="p-button-text">{{ t('Read the installation guide') }}</span> |
||||
</a> |
||||
</div> |
||||
</aside> |
||||
|
||||
<main class="install-step-container col-span-3 md:col-span-2 row-span-2"> |
||||
<h1 |
||||
v-if="'new' === installerData.installType" |
||||
v-t="'New installation'" |
||||
class="mb-4" |
||||
/> |
||||
<h1 |
||||
v-else-if="'update' === installerData.installType" |
||||
v-t="{ |
||||
path: 'Update from Chamilo {versions}', |
||||
args: { 'versions': installerData.upgradeFromVersion.join(' | ') } |
||||
}" |
||||
class="mb-4" |
||||
/> |
||||
<h1 |
||||
v-else |
||||
v-t="'Chamilo\'s installation wizard'" |
||||
class="mb-8" |
||||
/> |
||||
|
||||
<form |
||||
id="install_form" |
||||
:action="installerData.formAction" |
||||
method="post" |
||||
> |
||||
<input |
||||
:value="installerData.updatePath" |
||||
name="updatePath" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.urlAppendPath" |
||||
name="urlAppendPath" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.pathForm" |
||||
name="pathForm" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.urlForm" |
||||
name="urlForm" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.dbHostForm" |
||||
name="dbHostForm" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.dbPortForm" |
||||
name="dbPortForm" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.dbUsernameForm" |
||||
name="dbUsernameForm" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.dbPassForm" |
||||
name="dbPassForm" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.dbNameForm" |
||||
name="dbNameForm" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.allowSelfReg" |
||||
name="allowSelfReg" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.allowSelfRegProf" |
||||
name="allowSelfRegProf" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.emailForm" |
||||
name="emailForm" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.adminLastName" |
||||
name="adminLastName" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.adminFirstName" |
||||
name="adminFirstName" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.adminPhoneForm" |
||||
name="adminPhoneForm" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.loginForm" |
||||
name="loginForm" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.passForm" |
||||
name="passForm" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.languageForm" |
||||
name="languageForm" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.campusForm" |
||||
name="campusForm" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.educationForm" |
||||
name="educationForm" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.institutionForm" |
||||
name="institutionForm" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.institutionUrlForm" |
||||
name="institutionUrlForm" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.checkEmailByHashSent" |
||||
name="checkEmailByHashSent" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.showEmailNotCheckedToStudent" |
||||
name="ShowEmailNotCheckedToStudent" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.userMailCanBeEmpty" |
||||
name="userMailCanBeEmpty" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.encryptPassForm" |
||||
name="encryptPassForm" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.session_lifetime" |
||||
name="session_lifetime" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.old_version" |
||||
name="old_version" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.new_version" |
||||
name="new_version" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
:value="installerData.installationProfile" |
||||
name="installationProfile" |
||||
type="hidden" |
||||
> |
||||
|
||||
<Step1 v-if="1 === installerData.currentStep" /> |
||||
|
||||
<Step2 v-else-if="2 === installerData.currentStep" /> |
||||
|
||||
<Step3 v-else-if="3 === installerData.currentStep" /> |
||||
|
||||
<Step4 v-else-if="4 === installerData.currentStep" /> |
||||
|
||||
<Step5 v-else-if="5 === installerData.currentStep" /> |
||||
|
||||
<Step6 v-else-if="6 === installerData.currentStep" /> |
||||
|
||||
<Step7 v-else-if="7 === installerData.currentStep" /> |
||||
</form> |
||||
</main> |
||||
</div> |
||||
<footer class="text-center"> |
||||
<p v-html="installerData.poweredBy" /> |
||||
</footer> |
||||
</template> |
||||
|
||||
<script setup> |
||||
import { useI18n } from 'vue-i18n'; |
||||
import { onMounted, provide, ref } from 'vue'; |
||||
|
||||
import Step1 from './components/installer/Step1'; |
||||
import Step2 from './components/installer/Step2'; |
||||
import Step3 from './components/installer/Step3'; |
||||
import Step4 from './components/installer/Step4'; |
||||
import Step5 from './components/installer/Step5'; |
||||
import Step6 from './components/installer/Step6'; |
||||
import Step7 from './components/installer/Step7'; |
||||
|
||||
const { t } = useI18n(); |
||||
|
||||
const installerData = ref(window.installerData); |
||||
|
||||
provide('installerData', installerData); |
||||
|
||||
const steps = ref([ |
||||
{ |
||||
step: 1, |
||||
stepTitle: t('Installation language') |
||||
}, |
||||
{ |
||||
step: 2, |
||||
stepTitle: t('Requirements') |
||||
}, |
||||
{ |
||||
step: 3, |
||||
stepTitle: t('Licence') |
||||
}, |
||||
{ |
||||
step: 4, |
||||
stepTitle: t('Database settings') |
||||
}, |
||||
{ |
||||
step: 5, |
||||
stepTitle: t('Config settings') |
||||
}, |
||||
{ |
||||
step: 6, |
||||
stepTitle: t('Show Overview') |
||||
}, |
||||
{ |
||||
step: 7, |
||||
stepTitle: t('Install') |
||||
}, |
||||
]); |
||||
|
||||
onMounted(() => { |
||||
const txtIsExecutable = document.getElementById('is_executable'); |
||||
|
||||
if (!txtIsExecutable) { |
||||
return; |
||||
} |
||||
|
||||
document.querySelectorAll('button') |
||||
.forEach( |
||||
button => button.addEventListener( |
||||
'click', |
||||
() => txtIsExecutable.value = button.name |
||||
) |
||||
); |
||||
}); |
||||
</script> |
||||
@ -0,0 +1,74 @@ |
||||
<template> |
||||
<div class="install-step"> |
||||
<img |
||||
:alt="t('Install step 1')" |
||||
class="install-icon w-36 mx-auto mb-4" |
||||
src="/main/install/chamilo-install.svg" |
||||
> |
||||
<h2 |
||||
class="install-title mb-8" |
||||
v-text="t('Step 1 - Installation Language')" |
||||
/> |
||||
|
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<Dropdown |
||||
v-model="installerData.langIso" |
||||
:options="languages" |
||||
input-id="language_list" |
||||
option-label="english_name" |
||||
option-value="isocode" |
||||
/> |
||||
<label |
||||
v-t="'Please select installation language'" |
||||
for="language_list" |
||||
/> |
||||
</div> |
||||
<small v-text="t('Cannot find your language in the list? Contact us at info@chamilo.org to contribute as a translator.')" /> |
||||
</div> |
||||
|
||||
<input |
||||
v-model="installerData.langIso" |
||||
name="language_list" |
||||
type="hidden" |
||||
> |
||||
|
||||
<input |
||||
v-model="installerData.stepData.installationProfile" |
||||
type="hidden" |
||||
name="installationProfile" |
||||
> |
||||
|
||||
<hr> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<Button |
||||
:label="t('Next')" |
||||
class="p-button-secondary" |
||||
icon="mdi mdi-page-next" |
||||
name="step1" |
||||
type="submit" |
||||
/> |
||||
<input |
||||
id="is_executable" |
||||
name="is_executable" |
||||
type="hidden" |
||||
value="step1" |
||||
> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script setup> |
||||
import { inject } from 'vue'; |
||||
import { useI18n } from 'vue-i18n'; |
||||
|
||||
import Dropdown from 'primevue/dropdown'; |
||||
import Button from 'primevue/button'; |
||||
|
||||
import languages from '../../utils/languages'; |
||||
|
||||
const { t } = useI18n(); |
||||
|
||||
const installerData = inject('installerData'); |
||||
</script> |
||||
@ -0,0 +1,345 @@ |
||||
<template> |
||||
<div class="install-step"> |
||||
<h2 |
||||
v-t="'Step 2 - Requirements'" |
||||
class="install-title mb-8" |
||||
/> |
||||
|
||||
<p class="RequirementText mb-4"> |
||||
<strong v-text="t('Please read the following requirements thoroughly.')" /> |
||||
</p> |
||||
|
||||
<i18n-t |
||||
keypath="For more details {0}" |
||||
tag="p" |
||||
class="mb-4" |
||||
> |
||||
<a |
||||
v-t="'read the installation guide'" |
||||
href="/main/documentation/installation_guide.html" |
||||
target="_blank" |
||||
/> |
||||
</i18n-t> |
||||
|
||||
<p |
||||
v-if="'update' === installerData.installType" |
||||
class="mb-4" |
||||
> |
||||
{{ t('If you plan to upgrade from an older version of Chamilo, you might want to') }} |
||||
<a |
||||
href="/main/documentation/changelog.html" |
||||
target="_blank" |
||||
v-text="t('have a look at the changelog')" |
||||
/> |
||||
{{ t('to know what\'s new and what has been changed.') }} |
||||
</p> |
||||
|
||||
<h2 |
||||
class="install-subtitle mb-8" |
||||
v-text="t('Server requirements')" |
||||
/> |
||||
|
||||
<Message |
||||
v-if="!installerData.stepData.timezone" |
||||
:closable="false" |
||||
severity="warn" |
||||
> |
||||
{{ t('We have detected that your PHP installation does not define the date.timezone setting. This is a requirement of Chamilo. Please make sure it is configured by checking your php.ini configuration, otherwise you will run into problems. We warned you!') }} |
||||
</Message> |
||||
|
||||
<h3 |
||||
class="install-requirement mb-8" |
||||
v-text="t('Server requirements information')" |
||||
/> |
||||
|
||||
<div class="text-center mb-4"> |
||||
<p class="text-body-2-bold mb-2"> |
||||
{{ t('PHP version ') }} >= {{ installerData.phpRequiredVersion }} |
||||
</p> |
||||
<p |
||||
v-if="installerData.stepData.isVersionPassed" |
||||
class="text-success text-body-1-bold" |
||||
> |
||||
<span |
||||
class="mdi mdi-check" |
||||
aria-hidden="true" |
||||
/> |
||||
{{ t('Your PHP version matches the minimum requirement:') }} |
||||
{{ installerData.stepData.phpVersion }} |
||||
</p> |
||||
<p |
||||
v-else |
||||
class="text-error text-body-1-bold" |
||||
v-text="t('Your PHP version does not match the requirements for this software. Please check you have the latest version, then try again.')" |
||||
/> |
||||
</div> |
||||
|
||||
<div class="grid grid-flow-row-dense grid-cols-3 gap-x-3 gap-y-4 place-items-center mb-4"> |
||||
<p |
||||
v-for="(extension, i) in installerData.stepData.extensions" |
||||
:key="i" |
||||
class="text-center" |
||||
> |
||||
<a |
||||
:href="extension.url" |
||||
class="block" |
||||
v-text="extension.title" |
||||
/> |
||||
|
||||
<Tag |
||||
:icon="{ 'pi pi-check': 'success' === extension.status.severity, 'pi pi-exclamation-triangle': 'warning' === extension.status.severity, 'pi pi-times': 'danger' === extension.status.severity }" |
||||
:severity="extension.status.severity" |
||||
:value="extension.status.message" |
||||
/> |
||||
</p> |
||||
</div> |
||||
|
||||
<h4 |
||||
class="install-subtitle mb-4" |
||||
v-text="t('Recommended settings')" |
||||
/> |
||||
<p |
||||
class="install-requirement mb-4" |
||||
v-text="t('Recommended settings for your server configuration. These settings are set in the php.ini configuration file on your server.')" |
||||
/> |
||||
<div class="table-responsive"> |
||||
<table class="requirements-list"> |
||||
<thead> |
||||
<tr> |
||||
<th |
||||
class="requirements-item" |
||||
v-text="t('Setting')" |
||||
/> |
||||
<th |
||||
class="requirements-recommended" |
||||
v-text="t('Recommended')" |
||||
/> |
||||
<th |
||||
class="requirements-value" |
||||
v-text="t('Currently')" |
||||
/> |
||||
</tr> |
||||
</thead> |
||||
<tbody> |
||||
<tr |
||||
v-for="({ title, recommended, current }, i) in installerData.stepData.phpIni" |
||||
:key="i" |
||||
> |
||||
<td |
||||
class="requirements-item" |
||||
v-text="title" |
||||
/> |
||||
<td class="requirements-recommended"> |
||||
<Tag |
||||
severity="success" |
||||
:value="recommended" |
||||
/> |
||||
</td> |
||||
<td class="requirements-value"> |
||||
<Tag |
||||
:severity="current.severity" |
||||
:value="current.value" |
||||
/> |
||||
</td> |
||||
</tr> |
||||
</tbody> |
||||
</table> |
||||
</div> |
||||
|
||||
<h4 |
||||
class="install-subtitle mb-4" |
||||
v-text="t('Directory and files permissions')" |
||||
/> |
||||
<p |
||||
v-t="'Some directories and the files they include must be writable by the web server in order for Chamilo to run (user uploaded files, homepage html files, ...). This might imply a manual change on your server (outside of this interface).'" |
||||
class="mb-4" |
||||
/> |
||||
|
||||
<div class="table-responsive"> |
||||
<table class="requirements-list"> |
||||
<tbody> |
||||
<tr |
||||
v-for="({item, status}, i) in installerData.stepData.pathPermissions" |
||||
:key="i" |
||||
> |
||||
<td v-text="item" /> |
||||
<td> |
||||
<Tag |
||||
v-if="true === status" |
||||
:value="t('Writable')" |
||||
severity="success" |
||||
/> |
||||
<Tag |
||||
v-else-if="false === status" |
||||
:value="t('Not writable')" |
||||
severity="danger" |
||||
/> |
||||
<Tag |
||||
v-else |
||||
:value="status" |
||||
severity="info" |
||||
/> |
||||
</td> |
||||
</tr> |
||||
</tbody> |
||||
</table> |
||||
</div> |
||||
|
||||
<div v-if="'update' === installerData.installType && (!installerData.updatePath || installerData.badUpdatePath)"> |
||||
<Message |
||||
v-if="installerData.badUpdatePath" |
||||
:closable="false" |
||||
severity="warning" |
||||
> |
||||
<strong v-text="t('Error')" /><br> |
||||
Chamilo {{ installerData.upgradeFromVersion.join('|') }} |
||||
{{ t('has not been found in that directory') }} |
||||
</Message> |
||||
|
||||
<!-- form inputs for old version path --> |
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
id="updatePath" |
||||
name="updatePath" |
||||
size="50" |
||||
:value="installerData.badUpdatePath && installerData.updatePath ? updatePath : ''" |
||||
/> |
||||
<label v-text="t('Old version\'s root path')" /> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div class="field"> |
||||
<Button |
||||
:label="t('Back')" |
||||
class="p-button-secondary" |
||||
icon="mdi mdi-page-previous" |
||||
name="step1" |
||||
type="submit" |
||||
/> |
||||
</div> |
||||
<Button |
||||
:label="t('Next')" |
||||
:name="installerData.stepData.step2_update_6 ? 'step2_update_6' : 'step2_update_8'" |
||||
class="p-button-secondary" |
||||
icon="mdi mdi-page-next" |
||||
type="submit" |
||||
/> |
||||
<input |
||||
id="is_executable" |
||||
name="is_executable" |
||||
type="hidden" |
||||
value="-" |
||||
> |
||||
</div> |
||||
</div> |
||||
<div v-else> |
||||
<div v-if="installerData.stepData.notWritable.length > 0"> |
||||
<strong |
||||
class="text-error" |
||||
v-t="'Warning!'" |
||||
/> |
||||
<p class="text-error"> |
||||
{{ t('Some files or folders don\'t have writing permission. To be able to install Chamilo you should first change their permissions (using CHMOD). Please read the') }} |
||||
<a |
||||
href="/main/documentation/installation_guide.html" |
||||
target="_blank" |
||||
v-text="t('installation guide')" |
||||
/> |
||||
</p> |
||||
<ul class="list-disc list-inside"> |
||||
<li |
||||
v-for="(notWritable, i) in installerData.stepData.notWritable" |
||||
:key="i" |
||||
class="text-error" |
||||
v-text="notWritable" |
||||
/> |
||||
</ul> |
||||
</div> |
||||
|
||||
<div v-else-if="installerData.stepData.existsConfigurationFile"> |
||||
<!-- Check wether a Chamilo configuration file already exists --> |
||||
<Message |
||||
:closable="false" |
||||
severity="warning" |
||||
> |
||||
{{ t('The installer has detected an existing Chamilo platform on your system.') }} |
||||
</Message> |
||||
</div> |
||||
|
||||
<div v-if="installerData.stepData.deprecatedToRemove.length > 0"> |
||||
<p |
||||
class="text-error" |
||||
v-html="t('Because the <code>newscorm</code> and <code>exercice</code> directories were renamed to <code>lp</code> and <code>exercise</code> respectively, is necessary to delete or rename to <code>newscorm_old</code> and <code>exercice_old</code>.')" |
||||
/> |
||||
<ul class="list-disc list-inside"> |
||||
<li |
||||
v-for="(deprecatedToRemove, i) in installerData.stepData.deprecatedToRemove" |
||||
:key="i" |
||||
class="text-error" |
||||
v-text="deprecatedToRemove" |
||||
/> |
||||
</ul> |
||||
</div> |
||||
|
||||
<hr> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<!-- And now display the choice buttons (go back or install) --> |
||||
<div class="field"> |
||||
<Button |
||||
:label="t('Previous')" |
||||
class="p-button-plain" |
||||
icon="mdi mdi-page-previous" |
||||
name="step1" |
||||
type="button" |
||||
@click.prevent="goToIndex" |
||||
/> |
||||
</div> |
||||
<div class="field"> |
||||
<Button |
||||
:label="t('New installation')" |
||||
class="p-button-success" |
||||
icon="mdi mdi-page-next" |
||||
name="step2_install" |
||||
type="submit" |
||||
:disabled="installerData.stepData.installError" |
||||
/> |
||||
</div> |
||||
<Button |
||||
:label="t('Upgrade Chamilo LMS version')" |
||||
class="p-button-secondary" |
||||
icon="mdi mdi-page-next" |
||||
name="step2_update_8" |
||||
type="submit" |
||||
:disabled="!installerData.stepData.installError" |
||||
/> |
||||
<input |
||||
id="is_executable" |
||||
name="is_executable" |
||||
type="hidden" |
||||
value="-" |
||||
> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script setup> |
||||
import { useI18n } from 'vue-i18n'; |
||||
import { inject } from 'vue'; |
||||
|
||||
import Message from 'primevue/message'; |
||||
import Tag from 'primevue/tag'; |
||||
import InputText from 'primevue/inputtext'; |
||||
import Button from 'primevue/button'; |
||||
|
||||
const { t } = useI18n(); |
||||
|
||||
const installerData = inject('installerData'); |
||||
|
||||
function goToIndex() { |
||||
window.location = 'index.php'; |
||||
} |
||||
</script> |
||||
@ -0,0 +1,355 @@ |
||||
<template> |
||||
<div class="install-step"> |
||||
<h2 |
||||
v-t="'Step 3 - Licence'" |
||||
class="install-title mb-8" |
||||
/> |
||||
|
||||
<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> |
||||
|
||||
<InlineMessage severity="info"> |
||||
<i18n-t |
||||
keypath="The images and media galleries of Chamilo use images from Nuvola, Crystal Clear and Tango icon galleries. Other images and media like diagrams and Flash animations are borrowed from Wikimedia and Ali Pakdel's and Denis Hoa's courses with their agreement and released under BY-SA Creative Commons license. You may find the license details at the {0}, where a link to the full text of the license is provided at the bottom of the page." |
||||
> |
||||
<a |
||||
v-t="'CC website'" |
||||
href="https://creativecommons.org/licenses/by-sa/3.0/" |
||||
/> |
||||
</i18n-t> |
||||
</InlineMessage> |
||||
|
||||
<Fieldset |
||||
:legend="t('Contact information')" |
||||
:toggleable="true" |
||||
> |
||||
<p |
||||
v-t="'Dear user'" |
||||
class="mb-3" |
||||
/> |
||||
<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.'" |
||||
class="mb-3" |
||||
/> |
||||
<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.'" |
||||
class="mb-3" |
||||
/> |
||||
<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.'" |
||||
class="mb-3" |
||||
/> |
||||
<p |
||||
class="mb-3" |
||||
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 class="field"> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
id="person_name" |
||||
v-model="contact.personName" |
||||
size="30" |
||||
type="text" |
||||
/> |
||||
<label |
||||
v-t="'Name'" |
||||
for="person_name" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
id="person_email" |
||||
v-model="contact.personEmail" |
||||
size="30" |
||||
type="email" |
||||
/> |
||||
<label |
||||
v-t="'E-mail'" |
||||
for="person_email" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
id="company_name" |
||||
v-model="contact.companyName" |
||||
size="30" |
||||
type="text" |
||||
/> |
||||
<label |
||||
v-t="'Your company\'s name'" |
||||
for="company_name" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<Dropdown |
||||
v-model="contact.companyActivity" |
||||
:options="installerData.stepData.activitiesList" |
||||
:placeholder="t('Select one')" |
||||
input-id="company_activity" |
||||
/> |
||||
<label |
||||
v-t="'Your company\'s activity'" |
||||
for="company_activity" |
||||
/> |
||||
</div> |
||||
</div> |
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<Dropdown |
||||
v-model="contact.jobRole" |
||||
:options="installerData.stepData.rolesList" |
||||
:placeholder="t('Select one')" |
||||
input-id="person_role" |
||||
/> |
||||
<label |
||||
v-t="'Your job\'s description'" |
||||
for="person_role" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<Dropdown |
||||
v-model="contact.companyCountry" |
||||
:options="installerData.stepData.countriesList" |
||||
:placeholder="t('Select one')" |
||||
input-id="country" |
||||
/> |
||||
<label |
||||
v-t="'Your company\'s home country'" |
||||
for="country" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
id="company_city" |
||||
v-model="contact.companyCity" |
||||
size="30" |
||||
type="text" |
||||
/> |
||||
<label |
||||
v-t="'Company city'" |
||||
for="company_city" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<Dropdown |
||||
v-model="contact.contactLanguage" |
||||
:options="installerData.stepData.languagesList" |
||||
:placeholder="t('Select one')" |
||||
input-id="language" |
||||
option-label="1" |
||||
option-value="0" |
||||
/> |
||||
<label |
||||
v-t="'Preferred contact language'" |
||||
for="language" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<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="field"> |
||||
<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 InlineMessage from 'primevue/inlinemessage'; |
||||
import Fieldset from 'primevue/fieldset'; |
||||
import Dropdown from 'primevue/dropdown'; |
||||
import InputText from 'primevue/inputtext'; |
||||
import RadioButton from 'primevue/radiobutton'; |
||||
import Button from 'primevue/button'; |
||||
|
||||
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> |
||||
@ -0,0 +1,227 @@ |
||||
<template> |
||||
<div class="install-step"> |
||||
<h2 |
||||
v-t="'Step 4 - Database settings'" |
||||
class="RequirementHeading mb-8" |
||||
/> |
||||
|
||||
<p |
||||
v-if="'update' === installerData.installType" |
||||
v-t="'The upgrade script will recover and update the Chamilo database(s). In order to do this, this script will use the databases and settings defined below. Because our software runs on a wide range of systems and because all of them might not have been tested, we strongly recommend you do a full backup of your databases before you proceed with the upgrade!'" |
||||
class="RequirementContent mb-4" |
||||
/> |
||||
<p |
||||
v-else |
||||
v-t="'The install script will create (or use) the Chamilo database using the database name given here. Please make sure the user you give has the right to create the database by the name given here. If a database with this name exists, it will be overwritten. Please do not use the root user as the Chamilo database user. This can lead to serious security issues.'" |
||||
class="RequirementContent mb-4" |
||||
/> |
||||
|
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
v-model="installerData.stepData.dbHostForm" |
||||
:readonly="'update' === installerData.installType" |
||||
input-id="dbHostForm" |
||||
maxlength="50" |
||||
name="dbHostForm" |
||||
type="text" |
||||
/> |
||||
<label |
||||
v-t="'Database host'" |
||||
for="dbHostForm" |
||||
/> |
||||
</div> |
||||
<small v-t="'ex. localhost'" /> |
||||
</div> |
||||
|
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
v-model="installerData.stepData.dbPortForm" |
||||
:readonly="'update' === installerData.installType" |
||||
input-id="dbPortForm" |
||||
maxlength="25" |
||||
name="dbPortForm" |
||||
type="number" |
||||
/> |
||||
<label |
||||
v-t="'Port'" |
||||
for="dbPortForm" |
||||
/> |
||||
</div> |
||||
<small v-t="'ex. 3306'" /> |
||||
</div> |
||||
|
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
v-model="installerData.stepData.dbUsernameForm" |
||||
:readonly="'update' === installerData.installType" |
||||
input-id="dbUsernameForm" |
||||
maxlength="25" |
||||
name="dbUsernameForm" |
||||
type="text" |
||||
/> |
||||
<label |
||||
v-t="'Database login'" |
||||
for="dbUsernameForm" |
||||
/> |
||||
</div> |
||||
<small v-t="'ex. root'" /> |
||||
</div> |
||||
|
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<Password |
||||
v-model="installerData.stepData.dbPassForm" |
||||
:feedback="false" |
||||
:input-props="{ maxlength: 25, name: 'dbPassForm' }" |
||||
:readonly="'update' === installerData.installType" |
||||
input-id="dbPassForm" |
||||
toggle-mask |
||||
/> |
||||
<label |
||||
v-t="'Database password'" |
||||
for="dbPassForm" |
||||
/> |
||||
</div> |
||||
<small v-t="{ path: 'ex. {examplePassword}', args: { examplePassword: installerData.stepData.examplePassword } }" /> |
||||
</div> |
||||
|
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
v-model="installerData.stepData.dbNameForm" |
||||
:readonly="'update' === installerData.installType" |
||||
input-id="dbNameForm" |
||||
maxlength="25" |
||||
name="dbNameForm" |
||||
type="text" |
||||
/> |
||||
<label |
||||
v-t="'Database name'" |
||||
for="dbNameForm" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<div |
||||
v-if="'update' !== installerData.installType" |
||||
class="formgroup-inline" |
||||
> |
||||
<div class="field"> |
||||
<Button |
||||
:label="t('Check database connection')" |
||||
class="p-button-outlined" |
||||
icon="mdi mdi-database-sync" |
||||
name="step3" |
||||
type="submit" |
||||
value="step3" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<Message |
||||
v-if="installerData.stepData.dbExists" |
||||
:closable="false" |
||||
severity="warn" |
||||
> |
||||
<i18n-t keypath="A database with the name {0}. It will be {1}."> |
||||
<b>already exists</b> |
||||
<b>deleted</b> |
||||
</i18n-t> |
||||
</Message> |
||||
|
||||
<Message |
||||
v-if="installerData.stepData.connParams" |
||||
id="db_status" |
||||
:closable="false" |
||||
severity="success" |
||||
> |
||||
<table> |
||||
<tr> |
||||
<td v-t="'Database host'" /> |
||||
<td v-text="installerData.stepData.connParams.host" /> |
||||
</tr> |
||||
<tr> |
||||
<td v-t="'Database port'" /> |
||||
<td v-text="installerData.stepData.connParams.port" /> |
||||
</tr> |
||||
<tr> |
||||
<td v-t="'Database driver'" /> |
||||
<td v-text="installerData.stepData.connParams.driver" /> |
||||
</tr> |
||||
</table> |
||||
<table v-if="'update' === installerData.installType"> |
||||
<tr> |
||||
<td v-t="'CREATE TABLE works'" /> |
||||
<td v-t="'OK'" /> |
||||
</tr> |
||||
<tr> |
||||
<td v-t="'ALTER TABLE works'" /> |
||||
<td v-t="'OK'" /> |
||||
</tr> |
||||
<tr> |
||||
<td v-t="'DROP COLUMN works'" /> |
||||
<td v-t="'OK'" /> |
||||
</tr> |
||||
</table> |
||||
</Message> |
||||
<Message |
||||
v-else |
||||
id="db_status" |
||||
:closable="false" |
||||
severity="error" |
||||
> |
||||
{{ t('The database connection has failed. This is generally due to the wrong user, the wrong password or the wrong database prefix being set above. Please review these settings and try again.') }} |
||||
<code v-t="installerData.stepData.dbConnError" /> |
||||
</Message> |
||||
|
||||
<hr> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div class="field"> |
||||
<Button |
||||
:label="t('Previous')" |
||||
class="p-button-secondary" |
||||
icon="mdi mdi-page-previous" |
||||
name="step2" |
||||
type="submit" |
||||
/> |
||||
</div> |
||||
<Button |
||||
:disabled="!installerData.stepData.connParams" |
||||
:label="t('Next')" |
||||
class="p-button-success" |
||||
icon="mdi mdi-page-next" |
||||
name="step4" |
||||
type="submit" |
||||
/> |
||||
<input |
||||
id="is_executable" |
||||
name="is_executable" |
||||
type="hidden" |
||||
value="-" |
||||
> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script setup> |
||||
import { inject } from 'vue'; |
||||
import { useI18n } from 'vue-i18n'; |
||||
|
||||
import InputText from 'primevue/inputtext'; |
||||
import Password from 'primevue/password'; |
||||
import Button from 'primevue/button'; |
||||
import Message from 'primevue/message'; |
||||
|
||||
const { t } = useI18n(); |
||||
|
||||
const installerData = inject('installerData'); |
||||
|
||||
// Database Name fix replace weird chars |
||||
if ('update' !== installerData.value.installType) { |
||||
installerData.value.dbNameForm = installerData.value.dbNameForm.replace(/[-*$ .]/g, ''); |
||||
} |
||||
</script> |
||||
@ -0,0 +1,519 @@ |
||||
<template> |
||||
<div class="install-step"> |
||||
<h2 |
||||
v-t="'Step 5 - Configuration settings'" |
||||
class="RequirementHeading mb-8" |
||||
/> |
||||
|
||||
<div v-if="'update' === installerData.installType"> |
||||
<h3 |
||||
v-t="'System'" |
||||
class="mb-4" |
||||
/> |
||||
|
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
v-model="installerData.stepData.rootWeb" |
||||
input-id="loginForm" |
||||
maxlength="80" |
||||
name="loginForm" |
||||
type="text" |
||||
/> |
||||
<label |
||||
v-t="'Chamilo URL'" |
||||
for="loginForm" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
v-model="installerData.stepData.rootSys" |
||||
input-id="loginForm" |
||||
maxlength="80" |
||||
name="loginForm" |
||||
type="text" |
||||
/> |
||||
<label |
||||
v-t="'Path'" |
||||
for="loginForm" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
v-model="installerData.stepData.systemVersion" |
||||
input-id="loginForm" |
||||
maxlength="80" |
||||
name="loginForm" |
||||
type="text" |
||||
/> |
||||
<label |
||||
v-t="'Path'" |
||||
for="loginForm" |
||||
/> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<div> |
||||
<h3 |
||||
v-t="'Administrator'" |
||||
class="mb-4" |
||||
/> |
||||
|
||||
<!-- Parameter 1: administrator's login --> |
||||
<div |
||||
v-if="'update' !== installerData.installType" |
||||
class="field" |
||||
> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
v-model="installerData.stepData.loginForm" |
||||
input-id="loginForm" |
||||
maxlength="80" |
||||
name="loginForm" |
||||
type="text" |
||||
/> |
||||
<label |
||||
v-t="'Administrator login'" |
||||
for="loginForm" |
||||
/> |
||||
</div> |
||||
</div> |
||||
<div |
||||
v-else |
||||
class="field" |
||||
> |
||||
<input |
||||
v-model="installerData.stepData.loginForm" |
||||
type="hidden" |
||||
name="loginForm" |
||||
> |
||||
{{ installerData.stepData.loginForm }} |
||||
</div> |
||||
|
||||
<!-- Parameter 2: administrator's password --> |
||||
<div |
||||
v-if="'update' !== installerData.installType" |
||||
class="field" |
||||
> |
||||
<div class="p-float-label"> |
||||
<Password |
||||
v-model="installerData.stepData.passForm" |
||||
:feedback="false" |
||||
:input-props="{ maxlength: 80, name: 'passForm' }" |
||||
input-id="passForm" |
||||
toggle-mask |
||||
/> |
||||
<label |
||||
v-t="'Administrator password'" |
||||
for="passForm" |
||||
/> |
||||
</div> |
||||
<small |
||||
v-t="'You may want to change this'" |
||||
class="text-error" |
||||
/> |
||||
</div> |
||||
|
||||
<!-- Parameters 3 and 4: administrator's names --> |
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
v-model="installerData.stepData.adminFirstName" |
||||
input-id="adminFirstName" |
||||
maxlength="80" |
||||
name="adminFirstName" |
||||
type="text" |
||||
/> |
||||
<label |
||||
v-t="'Administrator first name'" |
||||
for="adminFirstName" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
v-model="installerData.stepData.adminLastName" |
||||
input-id="adminLastName" |
||||
maxlength="80" |
||||
name="adminLastName" |
||||
type="text" |
||||
/> |
||||
<label |
||||
v-t="'Administrator last name'" |
||||
for="adminLastName" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<!-- Parameter 5: administrator's email --> |
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
v-model="installerData.stepData.emailForm" |
||||
input-id="emailForm" |
||||
maxlength="80" |
||||
name="emailForm" |
||||
type="email" |
||||
/> |
||||
<label |
||||
v-t="'Administrator e-mail'" |
||||
for="emailForm" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<!-- Parameter 6: administrator's telephone --> |
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
v-model="installerData.stepData.adminPhoneForm" |
||||
input-id="adminPhoneForm" |
||||
maxlength="80" |
||||
name="adminPhoneForm" |
||||
type="text" |
||||
/> |
||||
<label |
||||
v-t="'Administrator telephone'" |
||||
for="adminPhoneForm" |
||||
/> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<div> |
||||
<h3 |
||||
v-t="'Portal'" |
||||
class="mb-4" |
||||
/> |
||||
|
||||
<!-- First parameter: language. --> |
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<Dropdown |
||||
v-if="'update' !== installerData.installType" |
||||
v-model="installerData.stepData.languageForm" |
||||
:options="languages" |
||||
input-id="language_form_list" |
||||
option-label="english_name" |
||||
option-value="isocode" |
||||
/> |
||||
<InputText |
||||
v-else |
||||
v-model="installerData.stepData.languageForm" |
||||
:readonly="true" |
||||
type="text" |
||||
/> |
||||
<label |
||||
v-t="'Language'" |
||||
for="language_form_list" |
||||
/> |
||||
<input |
||||
v-model="installerData.stepData.languageForm" |
||||
name="languageForm" |
||||
type="hidden" |
||||
> |
||||
</div> |
||||
</div> |
||||
|
||||
<!-- Second parameter: Chamilo URL --> |
||||
<div |
||||
v-if="'install' === installerData.installType" |
||||
class="field" |
||||
> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
v-model="installerData.stepData.urlForm" |
||||
input-id="urlForm" |
||||
maxlength="100" |
||||
name="urlForm" |
||||
type="url" |
||||
/> |
||||
<label |
||||
v-t="'Chamilo URL'" |
||||
for="urlForm" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<!-- Parameter 9: campus name --> |
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
v-model="installerData.stepData.campusForm" |
||||
input-id="campusForm" |
||||
maxlength="80" |
||||
name="campusForm" |
||||
type="text" |
||||
/> |
||||
<label |
||||
v-t="'Your portal name'" |
||||
for="campusForm" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<!-- Parameter 10: institute (short) name --> |
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
v-model="installerData.stepData.institutionForm" |
||||
input-id="institutionForm" |
||||
maxlength="80" |
||||
name="institutionForm" |
||||
type="text" |
||||
/> |
||||
<label |
||||
v-t="'Your company short name'" |
||||
for="institutionForm" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<!-- Parameter 11: institute URL --> |
||||
<div class="field"> |
||||
<div class="p-float-label"> |
||||
<InputText |
||||
v-model="installerData.stepData.institutionUrlForm" |
||||
input-id="institutionUrlForm" |
||||
maxlength="80" |
||||
name="institutionUrlForm" |
||||
type="text" |
||||
/> |
||||
<label |
||||
v-t="'URL of this company'" |
||||
for="institutionUrlForm" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<label v-t="'Encryption method'" /> |
||||
<div |
||||
v-if="'update' !== installerData.installType" |
||||
class="formgroup-inline" |
||||
> |
||||
<div class="field-checkbox"> |
||||
<RadioButton |
||||
v-model="installerData.stepData.encryptPassForm" |
||||
value="bcrypt" |
||||
input-id="encrypt_bcrypt" |
||||
name="encryptPassForm" |
||||
/> |
||||
<label |
||||
for="encrypt_bcrypt" |
||||
v-text="'bcrypt'" |
||||
/> |
||||
</div> |
||||
<div class="field-checkbox"> |
||||
<RadioButton |
||||
v-model="installerData.stepData.encryptPassForm" |
||||
value="sha1" |
||||
input-id="encrypt_sha1" |
||||
name="encryptPassForm" |
||||
/> |
||||
<label |
||||
for="encrypt_sha1" |
||||
v-text="'SHA1'" |
||||
/> |
||||
</div> |
||||
<div class="field-checkbox"> |
||||
<RadioButton |
||||
v-model="installerData.stepData.encryptPassForm" |
||||
value="md5" |
||||
input-id="encrypt_md5" |
||||
name="encryptPassForm" |
||||
/> |
||||
<label |
||||
for="encrypt_md5" |
||||
v-text="'MD5'" |
||||
/> |
||||
</div> |
||||
<div class="field-checkbox"> |
||||
<RadioButton |
||||
v-model="installerData.stepData.encryptPassForm" |
||||
value="none" |
||||
input-id="encrypt_none" |
||||
name="encryptPassForm" |
||||
/> |
||||
<label |
||||
v-t="'None'" |
||||
for="encrypt_none" |
||||
/> |
||||
</div> |
||||
</div> |
||||
<div |
||||
v-else |
||||
class="formgroup-inline" |
||||
> |
||||
<input |
||||
v-model="installerData.stepData.encryptPassForm" |
||||
type="hidden" |
||||
name="encryptPassForm" |
||||
> |
||||
{{ installerData.stepData.encryptPassForm }} |
||||
</div> |
||||
|
||||
<label v-t="'Allow self-registration'" /> |
||||
<div |
||||
v-if="'update' !== installerData.installType" |
||||
class="formgroup-inline" |
||||
> |
||||
<div class="field-checkbox"> |
||||
<RadioButton |
||||
v-model="installerData.stepData.allowSelfReg" |
||||
value="true" |
||||
input-id="self_reg_yes" |
||||
name="allowSelfReg" |
||||
/> |
||||
<label |
||||
v-t="'Yes'" |
||||
for="self_reg_yes" |
||||
/> |
||||
</div> |
||||
<div class="field-checkbox"> |
||||
<RadioButton |
||||
v-model="installerData.stepData.allowSelfReg" |
||||
value="false" |
||||
input-id="self_reg_no" |
||||
name="allowSelfReg" |
||||
/> |
||||
<label |
||||
v-t="'No'" |
||||
for="self_reg_no" |
||||
/> |
||||
</div> |
||||
<div class="field-checkbox"> |
||||
<RadioButton |
||||
v-model="installerData.stepData.allowSelfReg" |
||||
value="approval" |
||||
input-id="self_reg_approval" |
||||
name="allowSelfReg" |
||||
/> |
||||
<label |
||||
v-t="'After approval'" |
||||
for="self_reg_approval" |
||||
/> |
||||
</div> |
||||
</div> |
||||
<div v-else> |
||||
<input |
||||
v-model="installerData.stepData.allowSelfReg" |
||||
type="hidden" |
||||
name="allowSelfReg" |
||||
> |
||||
<span |
||||
v-if="'true' === installerData.stepData.allowSelfReg" |
||||
v-t="'Yes'" |
||||
/> |
||||
<span |
||||
v-else-if="'false' === installerData.stepData.allowSelfReg" |
||||
v-t="'No'" |
||||
/> |
||||
<span |
||||
v-else |
||||
v-t="'After approval'" |
||||
/> |
||||
</div> |
||||
|
||||
<label v-t="'Allow self-registration as a trainer'" /> |
||||
<div |
||||
v-if="'update' !== installerData.installType" |
||||
class="formgroup-inline" |
||||
> |
||||
<div class="field-checkbox"> |
||||
<RadioButton |
||||
v-model="installerData.stepData.allowSelfRegProf" |
||||
value="1" |
||||
input-id="self_reg_prof_yes" |
||||
name="allowSelfRegProf" |
||||
/> |
||||
<label |
||||
v-t="'Yes'" |
||||
for="self_reg_prof_yes" |
||||
/> |
||||
</div> |
||||
<div class="field-checkbox"> |
||||
<RadioButton |
||||
v-model="installerData.stepData.allowSelfRegProf" |
||||
value="0" |
||||
input-id="self_reg_prof_no" |
||||
name="allowSelfRegProf" |
||||
/> |
||||
<label |
||||
v-t="'No'" |
||||
for="self_reg_prof_no" |
||||
/> |
||||
</div> |
||||
</div> |
||||
<div v-else> |
||||
<input |
||||
v-model="installerData.stepData.allowSelfRegProf" |
||||
type="hidden" |
||||
name="allowSelfRegProf" |
||||
> |
||||
<span |
||||
v-if="1 === installerData.stepData.allowSelfRegProf" |
||||
v-t="'Yes'" |
||||
/> |
||||
<span |
||||
v-else-if="0 === installerData.stepData.allowSelfRegProf" |
||||
v-t="'No'" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<hr> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div class="field"> |
||||
<Button |
||||
:label="t('Previous')" |
||||
class="p-button-secondary" |
||||
icon="mdi mdi-page-previous" |
||||
name="step3" |
||||
type="submit" |
||||
/> |
||||
</div> |
||||
|
||||
<Button |
||||
:label="t('Next')" |
||||
class="p-button-success" |
||||
icon="mdi mdi-page-next" |
||||
name="step5" |
||||
type="submit" |
||||
/> |
||||
|
||||
<input |
||||
id="is_executable" |
||||
name="is_executable" |
||||
type="hidden" |
||||
value="-" |
||||
> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script setup> |
||||
import { inject, } from 'vue'; |
||||
import { useI18n } from 'vue-i18n'; |
||||
|
||||
import InputText from 'primevue/inputtext'; |
||||
import Password from 'primevue/password'; |
||||
import Dropdown from 'primevue/dropdown'; |
||||
import Button from 'primevue/button'; |
||||
import RadioButton from 'primevue/radiobutton'; |
||||
|
||||
import languages from '../../utils/languages'; |
||||
|
||||
const { t } = useI18n(); |
||||
|
||||
const installerData = inject('installerData'); |
||||
</script> |
||||
@ -0,0 +1,330 @@ |
||||
<template> |
||||
<div |
||||
v-show="!loading" |
||||
class="install-step" |
||||
> |
||||
<h2 |
||||
v-t="'Step 6 - Last check before install'" |
||||
class="RequirementHeading mb-8" |
||||
/> |
||||
|
||||
<p |
||||
v-t="'Here are the values you entered'" |
||||
class="RequirementContent mb-4" |
||||
/> |
||||
|
||||
<div> |
||||
<h3 |
||||
v-t="'Administrator'" |
||||
class="mb-4" |
||||
/> |
||||
|
||||
<div |
||||
v-if="'new' === installerData.installType" |
||||
class="formgroup-inline" |
||||
> |
||||
<div |
||||
v-t="'Administrator login'" |
||||
class="field text-body-2-bold" |
||||
/> |
||||
<div |
||||
class="field text-body-2" |
||||
v-text="installerData.stepData.loginForm" |
||||
/> |
||||
</div> |
||||
|
||||
<div |
||||
v-if="'new' === installerData.installType" |
||||
class="formgroup-inline" |
||||
> |
||||
<div |
||||
v-t="'Administrator password'" |
||||
class="field text-body-2-bold" |
||||
/> |
||||
<div |
||||
class="field text-body-2" |
||||
v-text="installerData.stepData.passForm" |
||||
/> |
||||
<div |
||||
v-t="'You may want to change this'" |
||||
class="field text-body-2 text-error" |
||||
/> |
||||
</div> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div |
||||
v-t="'Administrator first name'" |
||||
class="field text-body-2-bold" |
||||
/> |
||||
<div |
||||
class="field text-body-2" |
||||
v-text="installerData.stepData.adminFirstName" |
||||
/> |
||||
</div> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div |
||||
v-t="'Administrator last name'" |
||||
class="field text-body-2-bold" |
||||
/> |
||||
<div |
||||
class="field text-body-2" |
||||
v-text="installerData.stepData.adminLastName" |
||||
/> |
||||
</div> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div |
||||
v-t="'Administrator e-mail'" |
||||
class="field text-body-2-bold" |
||||
/> |
||||
<div |
||||
class="field text-body-2" |
||||
v-text="installerData.stepData.emailForm" |
||||
/> |
||||
</div> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div |
||||
v-t="'Administrator telephone'" |
||||
class="field text-body-2-bold" |
||||
/> |
||||
<div |
||||
class="field text-body-2" |
||||
v-text="installerData.stepData.adminPhoneForm" |
||||
/> |
||||
</div> |
||||
|
||||
<div class="field"> |
||||
<h3 v-t="'Portal'" /> |
||||
</div> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div |
||||
v-t="'Your portal name'" |
||||
class="field text-body-2-bold" |
||||
/> |
||||
<div |
||||
class="field text-body-2" |
||||
v-text="installerData.stepData.campusForm" |
||||
/> |
||||
</div> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div |
||||
v-t="'Main language'" |
||||
class="field text-body-2-bold" |
||||
/> |
||||
<div |
||||
class="field text-body-2" |
||||
v-text="installerData.stepData.languageForm" |
||||
/> |
||||
</div> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div |
||||
v-t="'Allow self-registration'" |
||||
class="field text-body-2-bold" |
||||
/> |
||||
<div |
||||
class="field text-body-2" |
||||
v-text="installerData.stepData.allowSelfRegistrationLiteral" |
||||
/> |
||||
</div> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div |
||||
v-t="'Your company short name'" |
||||
class="field text-body-2-bold" |
||||
/> |
||||
<div |
||||
class="field text-body-2" |
||||
v-text="installerData.stepData.institutionForm" |
||||
/> |
||||
</div> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div |
||||
v-t="'URL of this company'" |
||||
class="field text-body-2-bold" |
||||
/> |
||||
<div |
||||
class="field text-body-2" |
||||
v-text="installerData.stepData.institutionUrlForm" |
||||
/> |
||||
</div> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div |
||||
v-t="'Encryption method'" |
||||
class="field text-body-2-bold" |
||||
/> |
||||
<div |
||||
class="field text-body-2" |
||||
v-text="installerData.stepData.encryptPassForm" |
||||
/> |
||||
</div> |
||||
|
||||
<div class="field"> |
||||
<h3 v-t="'Database'" /> |
||||
</div> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div |
||||
v-t="'Database Host'" |
||||
class="field text-body-2-bold" |
||||
/> |
||||
<div |
||||
class="field text-body-2" |
||||
v-text="installerData.stepData.dbHostForm" |
||||
/> |
||||
</div> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div |
||||
v-t="'Port'" |
||||
class="field text-body-2-bold" |
||||
/> |
||||
<div |
||||
class="field text-body-2" |
||||
v-text="installerData.stepData.dbPortForm" |
||||
/> |
||||
</div> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div |
||||
v-t="'Database Login'" |
||||
class="field text-body-2-bold" |
||||
/> |
||||
<div |
||||
class="field text-body-2" |
||||
v-text="installerData.stepData.dbUsernameForm" |
||||
/> |
||||
</div> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div |
||||
v-t="'Database Password'" |
||||
class="field text-body-2-bold" |
||||
/> |
||||
<div |
||||
class="field text-body-2" |
||||
v-text="installerData.stepData.dbPassForm" |
||||
/> |
||||
</div> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div |
||||
v-t="'Database name'" |
||||
class="field text-body-2-bold" |
||||
/> |
||||
<div |
||||
class="field text-body-2" |
||||
v-text="installerData.stepData.dbNameForm" |
||||
/> |
||||
</div> |
||||
|
||||
<Message |
||||
v-if="'new' === installerData.installType" |
||||
:closable="false" |
||||
severity="warn" |
||||
> |
||||
{{ t('The install script will erase all tables of the selected database. We heavily recommend you do a full backup of them before confirming this last install step.') }} |
||||
</Message> |
||||
</div> |
||||
|
||||
<hr> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div class="field"> |
||||
<Button |
||||
:label="t('Previous')" |
||||
class="p-button-secondary" |
||||
icon="mdi mdi-page-previous" |
||||
name="step4" |
||||
type="submit" |
||||
/> |
||||
<input |
||||
id="is_executable" |
||||
v-model="isExecutable" |
||||
name="is_executable" |
||||
type="hidden" |
||||
> |
||||
<input |
||||
type="hidden" |
||||
name="step6" |
||||
value="1" |
||||
> |
||||
</div> |
||||
|
||||
<Button |
||||
id="button_step6" |
||||
:label="t('Install Chamilo')" |
||||
:loading="loading" |
||||
class="p-button-success" |
||||
icon="mdi mdi-progress-download" |
||||
name="button_step6" |
||||
type="submit" |
||||
@click="btnStep6OnClick" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<div |
||||
v-show="loading" |
||||
class="install-step" |
||||
> |
||||
<h2 |
||||
v-if="'update' !== installerData.installType" |
||||
v-t="'Step 7 - Installation process execution'" |
||||
class="RequirementHeading mb-8" |
||||
/> |
||||
<h2 |
||||
v-else |
||||
v-t="'Step 7 - Update process execution'" |
||||
class="RequirementHeading mb-8" |
||||
/> |
||||
|
||||
<p> |
||||
<strong |
||||
v-if="installerData.installationProfile" |
||||
v-text="installerData.installationProfile" |
||||
/> |
||||
</p> |
||||
|
||||
<Message |
||||
id="pleasewait" |
||||
:closable="false" |
||||
severity="success" |
||||
> |
||||
<p |
||||
v-t="'Please wait. This could take a while...'" |
||||
class="mb-3" |
||||
/> |
||||
<ProgressBar mode="indeterminate" /> |
||||
</Message> |
||||
</div> |
||||
</template> |
||||
|
||||
<script setup> |
||||
import { inject, ref } from 'vue'; |
||||
import { useI18n } from 'vue-i18n'; |
||||
|
||||
import Message from 'primevue/message'; |
||||
import Button from 'primevue/button'; |
||||
import ProgressBar from 'primevue/progressbar'; |
||||
|
||||
const { t } = useI18n(); |
||||
|
||||
const installerData = inject('installerData'); |
||||
|
||||
const loading = ref(false); |
||||
|
||||
const isExecutable = ref(''); |
||||
|
||||
function btnStep6OnClick () { |
||||
loading.value= true; |
||||
|
||||
isExecutable.value = 'step6'; |
||||
} |
||||
</script> |
||||
@ -0,0 +1,69 @@ |
||||
<template> |
||||
<div class="install-step"> |
||||
<h2 |
||||
v-if="'update' !== installerData.installType" |
||||
v-t="'Step 7 - Installation process execution'" |
||||
class="RequirementHeading mb-8" |
||||
/> |
||||
<h2 |
||||
v-else |
||||
v-t="'Step 7 - Update process execution'" |
||||
class="RequirementHeading mb-8" |
||||
/> |
||||
|
||||
<p |
||||
v-if="installerData.installationProfile" |
||||
class="mb-4" |
||||
v-text="installerData.installationProfile" |
||||
/> |
||||
|
||||
<div class="RequirementContent"> |
||||
<p |
||||
v-t="'When you enter your portal for the first time, the best way to understand it is to create a course with the \'Create course\' link in the menu and play around a little.'" |
||||
class="mb-3" |
||||
/> |
||||
|
||||
<Message |
||||
:closable="false" |
||||
severity="warn" |
||||
> |
||||
<strong v-t="'Security advice'" /> |
||||
|
||||
<i18n-t |
||||
keypath="To protect your site, make the whole {0} directory read-only (chmod -R 0555 on Linux) and delete the {1} directory." |
||||
tag="p" |
||||
> |
||||
<code>var/config/</code> |
||||
<code>main/install/</code> |
||||
</i18n-t> |
||||
</Message> |
||||
|
||||
<div class="formgroup-inline"> |
||||
<div class="field"> |
||||
<Button |
||||
:label="t('Go to your newly created portal.')" |
||||
class="p-button-success" |
||||
type="button" |
||||
@click="btnFinishOnClick" |
||||
/> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script setup> |
||||
import { inject } from 'vue'; |
||||
import { useI18n } from 'vue-i18n'; |
||||
|
||||
import Message from 'primevue/message'; |
||||
import Button from 'primevue/button'; |
||||
|
||||
const { t } = useI18n(); |
||||
|
||||
const installerData = inject('installerData'); |
||||
|
||||
function btnFinishOnClick () { |
||||
window.location = '../../'; |
||||
} |
||||
</script> |
||||
@ -0,0 +1,12 @@ |
||||
import { createApp } from 'vue'; |
||||
import AppInstaller from './AppInstaller'; |
||||
import PrimeVue from 'primevue/config'; |
||||
import i18n from './i18n'; |
||||
|
||||
const app = createApp(AppInstaller); |
||||
|
||||
app |
||||
.use(PrimeVue, { ripple: false }) |
||||
.use(i18n) |
||||
|
||||
.mount('#app'); |
||||
File diff suppressed because it is too large
Load Diff
Loading…
Reference in new issue