153 lines
9.6 KiB
PHP
153 lines
9.6 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="csrf-token" content="{{ csrf_token() }}">
|
|
|
|
<title>FleetCart</title>
|
|
|
|
<link rel="shortcut icon" href="{{ asset('build/assets/favicon.png') }}" type="image/x-icon">
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
|
|
|
|
@routes
|
|
@vite([
|
|
'resources/sass/install/main.scss',
|
|
'resources/js/install/main.js'
|
|
])
|
|
</head>
|
|
|
|
<body class="ltr">
|
|
<div id="app" class="installer-wrapper">
|
|
<Install
|
|
v-cloak
|
|
class="installer-box d-flex flex-column flex-md-row"
|
|
:requirement-satisfied="{{ $requirement->satisfied() ? 'true' : 'false' }}"
|
|
:permission-provided="{{ $permission->provided() ? 'true' : 'false' }}"
|
|
inline-template
|
|
>
|
|
<div>
|
|
<aside class="installer-left-sidebar d-flex flex-column justify-content-between">
|
|
<div class="logo d-flex justify-content-center">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 1 31 31" preserveAspectRatio="xMinYMid meet">
|
|
<g>
|
|
<g transform="translate(-164 -55)">
|
|
<g transform="translate(-457.529 -7971.529)">
|
|
<rect width="29" height="29" rx="3" transform="translate(622.529 8028.529)" fill="#0068e1" id="logo_f_bg"></rect>
|
|
<circle cx="2.062" cy="2.062" r="2.062" transform="translate(642.715 8048.341)" fill="#ffb135"></circle>
|
|
<g transform="translate(622.529 8028.529)">
|
|
<circle cx="23" cy="23" r="23" transform="translate(-25 -26)" fill="#ffffff" opacity="0.12"></circle>
|
|
<circle cx="23" cy="23" r="23" transform="translate(15 23)" fill="#ffffff" opacity="0.12"></circle>
|
|
</g>
|
|
<g transform="translate(630.791 8033.531)">
|
|
<g transform="translate(-200.084 -174)" stroke-miterlimit="10" fill="#0068e1" id="logo_f_text">
|
|
<path d="M 200.4339904785156 192.5772552490234 L 200.4339904785156 174.3499908447266 L 212.1227569580078 174.3499908447266 L 211.3375701904297 177.8291931152344 L 204.426025390625 177.8291931152344 L 204.0760192871094 177.8291931152344 L 204.0760192871094 178.1791839599609 L 204.0760192871094 181.8428344726563 L 204.0760192871094 182.1928405761719 L 204.426025390625 182.1928405761719 L 211.1689147949219 182.1928405761719 L 211.5615844726563 185.6720428466797 L 204.426025390625 185.6720428466797 L 204.0760192871094 185.6720428466797 L 204.0760192871094 186.0220336914063 L 204.0760192871094 191.9179992675781 L 200.4339904785156 192.5772552490234 Z" stroke="none" fill="#0068e1" id="logo_f_text_inner"></path>
|
|
<path d="M 200.7839965820313 174.6999969482422 L 200.7839965820313 192.158203125 L 203.7260284423828 191.6256561279297 L 203.7260284423828 186.0220336914063 L 203.7260284423828 185.3220367431641 L 204.426025390625 185.3220367431641 L 211.1698608398438 185.3220367431641 L 210.8561859130859 182.5428314208984 L 204.426025390625 182.5428314208984 L 203.7260284423828 182.5428314208984 L 203.7260284423828 181.8428344726563 L 203.7260284423828 178.1791839599609 L 203.7260284423828 177.4791870117188 L 204.426025390625 177.4791870117188 L 211.0577392578125 177.4791870117188 L 211.6849517822266 174.6999969482422 L 200.7839965820313 174.6999969482422 M 200.0839996337891 174 L 212.560546875 174 L 211.6173706054688 178.1791839599609 L 204.426025390625 178.1791839599609 L 204.426025390625 181.8428344726563 L 211.4816284179688 181.8428344726563 L 211.9533081054688 186.0220336914063 L 204.426025390625 186.0220336914063 L 204.426025390625 192.2103271484375 L 200.0839996337891 192.9962921142578 L 200.0839996337891 174 Z" stroke="none" fill="#ffffff"></path>
|
|
</g>
|
|
</g>
|
|
</g>
|
|
</g>
|
|
</g>
|
|
</svg>
|
|
</div>
|
|
|
|
<ul class="step-list list-inline">
|
|
<li
|
|
class="step-list-item d-flex position-relative"
|
|
:class="{
|
|
'active': step === 1,
|
|
'complete': step >= 2
|
|
}"
|
|
>
|
|
<div class="icon d-flex justify-content-center align-items-center rounded-circle">
|
|
<span :class="step > 1 ? 'mdi mdi-check' : 'circle rounded-circle'"></span>
|
|
</div>
|
|
|
|
<div
|
|
:class="{
|
|
'cursor-pointer': !appInstalled && step !== 1 && !formSubmitting
|
|
}"
|
|
@click="goToStep(1)"
|
|
>
|
|
<label class="title">Requirements</label>
|
|
<span class="excerpt d-block">Check system requirements</span>
|
|
</div>
|
|
</li>
|
|
|
|
<li
|
|
class="step-list-item d-flex position-relative"
|
|
:class="{
|
|
'active': step === 2,
|
|
'complete': step >= 3
|
|
}"
|
|
>
|
|
<div class="icon d-flex justify-content-center align-items-center rounded-circle">
|
|
<span :class="step > 2 ? 'mdi mdi-check' : 'circle rounded-circle'"></span>
|
|
</div>
|
|
|
|
<div
|
|
:class="{
|
|
'cursor-pointer': !appInstalled && step !== 2 && !formSubmitting
|
|
}"
|
|
@click="goToStep(2)"
|
|
>
|
|
<label class="title">Permissions</label>
|
|
<span class="excerpt d-block">Obtain necessary permissions</span>
|
|
</div>
|
|
</li>
|
|
|
|
<li
|
|
class="step-list-item d-flex position-relative"
|
|
:class="{
|
|
'active': step === 3 && !appInstalled,
|
|
'complete': appInstalled
|
|
}"
|
|
>
|
|
<div class="icon d-flex justify-content-center align-items-center rounded-circle">
|
|
<span :class="appInstalled ? 'mdi mdi-check' : 'circle rounded-circle'"></span>
|
|
</div>
|
|
|
|
<div
|
|
:class="{
|
|
'cursor-pointer': !appInstalled && step !== 3 && !formSubmitting
|
|
}"
|
|
@click="goToStep(3)"
|
|
>
|
|
<label class="title">Configuration</label>
|
|
<span class="excerpt d-block">Configure the application</span>
|
|
</div>
|
|
</li>
|
|
|
|
<li
|
|
class="step-list-item d-flex position-relative"
|
|
:class="{
|
|
'complete': appInstalled
|
|
}"
|
|
>
|
|
<div class="icon d-flex justify-content-center align-items-center rounded-circle">
|
|
<span :class="appInstalled ? 'mdi mdi-check' : 'circle rounded-circle'"></span>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="title">Complete</label>
|
|
<span class="excerpt d-block">Installation successful</span>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
|
|
<span class="app-version">Version {{ fleetcart_version() }}</span>
|
|
</aside>
|
|
|
|
<section class="installer-main-content flex-grow-1 overflow-hidden">
|
|
@yield('content')
|
|
</section>
|
|
</div>
|
|
</Install>
|
|
</div>
|
|
|
|
@stack('scripts')
|
|
</body>
|
|
</html>
|