272 lines
16 KiB
PHP
272 lines
16 KiB
PHP
<h3>{{'shop.headers.MY_CART' | translate}}</h3>
|
|
<div id="shop-cart-container" ng-if="!isCartEmpty()">
|
|
<div id="shop-cart" class="row">
|
|
<div id="show-order-info-headers">
|
|
<div class="show-order-items step active-step">1. {{'shop.headers.ORDER_INFO' | translate}}</div>
|
|
<div class="step-link"></div>
|
|
<div class="upload-customer-questionaire step inactive-step">2. {{'shop.headers.CUSTOMER_QUESTIONAIRE' | translate}}</div>
|
|
<div class="step-link"></div>
|
|
<div class="upload-agreement step inactive-step">3. {{'shop.headers.UPLOAD_AGREEMENT' | translate}}</div>
|
|
<div class="step-link"></div>
|
|
<div class="show-customer-details step inactive-step">4. {{'shop.headers.CUSTOMER_INFO' | translate}}</div>
|
|
<div class="step-link"></div>
|
|
<div class="show-customer-billing step inactive-step">5. {{'shop.headers.BILLING_ADDRESS' | translate}}</div>
|
|
</div>
|
|
<div id="show-order-items" class="shop-cl" ng-if="isStepVisible('show-order-items')">
|
|
<h3 class="col-md-12">{{'shop.headers.SOLD_BY' | translate}} {{::commercialLead}}</h3>
|
|
<div class="shop-cart-item col-md-12" ng-repeat="(position, package) in cartPackages track by position">
|
|
<div class="shop-item-name col-md-3">
|
|
{{position+1}}. {{package.packageName}}
|
|
<div class="shop-item-options" ng-if="package.options.length">
|
|
<div class="shop-item-option {{getOptionAvailabilityClass(option.isAvailable)}}" ng-repeat="option in package.options">
|
|
<b>{{option.groupName}}</b> : {{option.packageName}}
|
|
</div>
|
|
</div>
|
|
<div class="shop-item-additional-packages" ng-if="package.additionalPackages.length">
|
|
<div class="shop-item-option {{getOptionAvailabilityClass(additionalPackage.isAvailable)}}" ng-repeat="additionalPackage in package.additionalPackages">
|
|
{{additionalPackage.packageName}}
|
|
</div>
|
|
</div>
|
|
<div ng-if="!isAvailable(package)" class="not-available">
|
|
<span class="glyphicon glyphicon-warning-sign"></span>
|
|
{{'shop.messages.' + getAvailabilityMessage(package) | translate}}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="shop-item-pay col-md-2">
|
|
{{package.payType}}
|
|
</div>
|
|
<div ng-if="isAvailable(package)" class="shop-item-pay col-md-2">
|
|
{{sumPrice([package.fixedPrice, package.extraFixedPrice], package.quantity)}} ({{sumPrice([package.recurentPrice, package.servicesPrice, package.extraRecurrentPrice], package.quantity)}} / {{package.periodUnit}})
|
|
</div>
|
|
<div ng-if="!isAvailable(package)" class="shop-item-pay col-md-2">-</div>
|
|
|
|
<div class="shop-item-quantity col-md-4">
|
|
{{'shop.labels.QUANTITY' | translate}}: <input class="quantity-input" type="number" min="1" max="100" ng-model="package.quantity" ng-blur="updateQuantity(package)"/>
|
|
</div>
|
|
|
|
<div class="shop-item-remove col-md-1">
|
|
<span ng-click="removeFromCart(package)" class="glyphicon glyphicon-remove"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="upload-customer-questionaire" class="upload-customer-questionaire col-md-12" ng-if="isStepVisible('upload-customer-questionaire')">
|
|
<div class="documet-templates">
|
|
<div ng-if="!documents[DOCUMENT_TYPES['TEMPLATE_QUESTINNAIRE']].length" class="questionnaire-info col-md-12">
|
|
<div class="alert alert-info">
|
|
<span class="glyphicon glyphicon-info-sign"></span>
|
|
{{'shop.messages.QUESIONNAIRE_NOT_REQUIRED' | translate}}
|
|
</div>
|
|
</div>
|
|
<div class="document-layer col-md-12" ng-repeat="document in documents[DOCUMENT_TYPES['TEMPLATE_QUESTINNAIRE']]">
|
|
<h3 class="col-md-12">{{document.packageName}}: {{'shop.headers.CUSTOMER_QUESTIONAIRE' | translate}}</h3>
|
|
<div class="col-md-12">
|
|
<a href="utils/api/downloadFile?idDocument={{document.id}}&fileName={{document.documentName}}.{{document.extension}}">
|
|
<div class="btn btn-primary">
|
|
{{'shop.buttons.DOWNLOAD' | translate}} {{document.documentName}}
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<form name="form" class="col-md-4">
|
|
<div ngf-drop="uploadFile($file, document.idPackage, 'questionnaire')"
|
|
ng-model="files"
|
|
ngf-drag-over-class="'dragover'"
|
|
ngf-select="uploadFile($file, document.idPackage, 'questionnaire')"
|
|
ngf-pattern="'.pdf,.docx,.doc,.xlsx,.xls,.odt,.ods,.zip'"
|
|
ngf-max-size="20MB"
|
|
class="drop-box">{{'shop.labels.SELECT_QUESTIONAIRE' | translate}}</div>
|
|
</form>
|
|
<div class="col-md-4">
|
|
<div ng-if="!document.isUploaded" class="no-file-uploaded upload-status">
|
|
<span class="glyphicon glyphicon-upload"></span> {{'shop.labels.UPLOAD_QUESTIONAIRE' | translate}}
|
|
</div>
|
|
|
|
<div ng-if="document.isUploaded" class="file-uploaded upload-status">
|
|
<span class="glyphicon glyphicon-ok"></span> {{'shop.labels.FILE_UPLOADED' | translate}}
|
|
</div>
|
|
</div>
|
|
<div ngf-no-file-drop>{{'shop.messages.NO_SUPPORT' | translate}}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="upload-agreement" class="upload-customer-questionaire col-md-12" ng-if="isStepVisible('upload-agreement')">
|
|
<div class="documet-templates">
|
|
<div ng-if="!documents[DOCUMENT_TYPES['TEMPLATE_AGREEMENT']].length" class="questionnaire-info col-md-12">
|
|
<div class="alert alert-info">
|
|
<span class="glyphicon glyphicon-info-sign"></span>
|
|
{{'shop.messages.AGREEMENT_NOT_REQUIRED' | translate}}
|
|
</div>
|
|
</div>
|
|
<div class="document-layer col-md-12" ng-repeat="document in documents[DOCUMENT_TYPES['TEMPLATE_AGREEMENT']]">
|
|
<h3 class="col-md-12">{{document.packageName}}: {{'shop.headers.CUSTOMER_AGREEMENT' | translate}}</h3>
|
|
<div class="col-md-12">
|
|
<a href="utils/api/downloadFile?idDocument={{document.id}}&fileName={{document.documentName}}.{{document.extension}}">
|
|
<div class="btn btn-primary">
|
|
{{'shop.buttons.DOWNLOAD' | translate}} {{document.documentName}}
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<form name="form" class="col-md-4">
|
|
<div ngf-drop="uploadFile($file, document.idPackage, 'agreement')"
|
|
ng-model="files"
|
|
ngf-drag-over-class="'dragover'"
|
|
ngf-select="uploadFile($file, document.idPackage, 'agreement')"
|
|
ngf-pattern="'.pdf,.docx,.doc,.xlsx,.xls,.odt,.ods,.png,.jpg,.jpeg,.zip'"
|
|
ngf-max-size="20MB"
|
|
class="drop-box">{{'shop.labels.SELECT_AGREEMENT' | translate}}</div>
|
|
</form>
|
|
<div class="col-md-4">
|
|
<div ng-if="!document.isUploaded" class="no-file-uploaded upload-status">
|
|
<span class="glyphicon glyphicon-upload"></span> {{'shop.labels.UPLOAD_AGREEMENT' | translate}}
|
|
</div>
|
|
|
|
<div ng-if="document.isUploaded" class="file-uploaded upload-status">
|
|
<span class="glyphicon glyphicon-ok"></span> {{'shop.labels.FILE_UPLOADED' | translate}}
|
|
</div>
|
|
</div>
|
|
<div ngf-no-file-drop>{{'shop.messages.NO_SUPPORT' | translate}}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="show-customer-details" class="show-customer-addresses" ng-if="isStepVisible('show-customer-details')">
|
|
<div class="label-value-pair col-md-12">
|
|
<label class="col-md-2">{{'shop.labels.VAT' | translate}}</label>
|
|
<input id="vat-code-nb" class="col-md-2" type="text" ng-model="vatCode" ng-disabled="vatCode" />
|
|
</div>
|
|
<div class="label-value-pair col-md-12">
|
|
<label class="col-md-2">{{'shop.labels.REFERENCE' | translate}}</label>
|
|
<input id="reference-nb" class="col-md-3" type="text" ng-model="details.reference" required />
|
|
</div>
|
|
<div class="label-value-pair col-md-12">
|
|
<label class="col-md-2">{{'shop.labels.TENDER' | translate}}</label>
|
|
<input id="tender-nb" class="col-md-3" type="text" ng-model="details.tender" />
|
|
</div>
|
|
<div class="address-type col-md-12">
|
|
<label>{{'shop.labels.DELIVERY_ADDRESS' | translate}}</label>
|
|
</div>
|
|
<div class="label-value-pair col-md-12">
|
|
<label class="col-md-2">{{'shop.labels.ADDRESS' | translate}}</label>
|
|
<textarea id="detailed-address" class="address-area col-md-3" type="text" ng-model="delivery.detailedAddress" required></textarea>
|
|
</div>
|
|
<div class="label-value-pair col-md-12">
|
|
<label class="col-md-2">{{'shop.labels.COUNTRY' | translate}}</label>
|
|
<select id="delivery-country" class="form-control-static col-md-2" ng-change="changeCountryName('delivery', delivery.idCountrySelected)" ng-model="delivery.idCountrySelected" required>
|
|
<option ng-repeat="country in countries track by country.id" value="{{country.id}}">
|
|
{{country.name}}
|
|
</option>
|
|
</select>
|
|
</div>
|
|
<div class="label-value-pair col-md-12">
|
|
<label class="col-md-2">{{'shop.labels.CITY' | translate}}</label>
|
|
<input id="delivery-city" class="col-md-2" type="text" ng-model="delivery.city" required />
|
|
</div>
|
|
<div class="label-value-pair col-md-12">
|
|
<label class="col-md-2">{{'shop.labels.ZIP' | translate}}</label>
|
|
<input id="zip-code" class="col-md-2" type="text" ng-model="delivery.zipCode" required />
|
|
</div>
|
|
</div>
|
|
|
|
<div id="show-customer-billing" class="show-customer-addresses" ng-if="isStepVisible('show-customer-billing')">
|
|
<div class="label-value-pair col-md-12">
|
|
<label class="col-md-2">{{'shop.labels.VAT' | translate}}</label>
|
|
<input id="vat-code-nb" class="col-md-2" type="text" ng-model="vatCode" ng-disabled="vatCode" />
|
|
</div>
|
|
<div class="label-value-pair col-md-12">
|
|
<label class="col-md-2">{{'shop.labels.COMPANY' | translate}}</label>
|
|
<input id="billing-company-name" class="col-md-2" type="text" ng-model="billing.companyName" required />
|
|
</div>
|
|
<div class="label-value-pair col-md-12">
|
|
<label class="col-md-2">{{'shop.labels.FIRST_NAME' | translate}}</label>
|
|
<input id="billing-first-name" class="col-md-2" type="text" ng-model="billing.firstName" required />
|
|
</div>
|
|
<div class="label-value-pair col-md-12">
|
|
<label class="col-md-2">{{'shop.labels.LAST_NAME' | translate}}</label>
|
|
<input id="billing-last-name" class="col-md-2" type="text" ng-model="billing.lastName" required />
|
|
</div>
|
|
<div class="address-type col-md-12">
|
|
<label>{{'shop.labels.BILLING_ADDRESS' | translate}}</label>
|
|
</div>
|
|
<div class="label-value-pair col-md-12">
|
|
<input type="checkbox" ng-model="deliveryEqualsBilling.checked" ng-change="setBillingSameAsDeliveryAddress()" />
|
|
<label>{{'shop.labels.DELIVERY_SAME_AS_BILLING' | translate}}</label>
|
|
</div>
|
|
<div class="label-value-pair col-md-12">
|
|
<label class="col-md-2">{{'shop.labels.ADDRESS' | translate}}</label>
|
|
<textarea id="billing-address" class="address-area col-md-3" type="text" ng-model="billing.detailedAddress" required></textarea>
|
|
</div>
|
|
<div class="label-value-pair col-md-12">
|
|
<label class="col-md-2">{{'shop.labels.COUNTRY' | translate}}</label>
|
|
<select id="billing-country" class="form-control-static col-md-2" ng-change="changeCountryName('billing', billing.idCountrySelected)" ng-model="billing.idCountrySelected" required>
|
|
<option ng-repeat="country in countries track by country.id" value="{{country.id}}">
|
|
{{country.name}}
|
|
</option>
|
|
</select>
|
|
</div>
|
|
<div class="label-value-pair col-md-12">
|
|
<label class="col-md-2">{{'shop.labels.CITY' | translate}}</label>
|
|
<input id="billing-city" class="col-md-2" type="text" ng-model="billing.city" required />
|
|
</div>
|
|
<div class="label-value-pair col-md-12">
|
|
<label class="col-md-2">{{'shop.labels.ZIP' | translate}}</label>
|
|
<input id="billing-zip-code" class="col-md-2" type="text" ng-model="billing.zipCode" required />
|
|
</div>
|
|
|
|
<div class="shop-terms-conditions alert {{getAlertClass(termsAndConditionCheckbox)}} col-md-12">
|
|
<input type="checkbox"
|
|
ng-model="termsAndConditionCheckbox"
|
|
ng-change="setTermsCheckboxValue(termsAndConditionCheckbox)"/>
|
|
{{'shop.labels.ACCEPT' | translate}} <a target="_blank" href="terms">{{'shop.labels.TERMS_CONDITIONS' | translate}}</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="order-action-buttons">
|
|
<div class="next-btn btn btn-primary"
|
|
ng-disabled="isBtnDisabled"
|
|
ng-click="goToNextStep('next')">
|
|
{{'shop.buttons.' + actionButton | translate}}
|
|
</div>
|
|
<div class="prev-btn btn btn-primary"
|
|
ng-click="goToNextStep('prev')"
|
|
ng-if="hasPrevStep()">
|
|
{{'shop.buttons.' + prevButton | translate}}
|
|
</div>
|
|
</div>
|
|
|
|
<div id="place-order-dialog-confirm"
|
|
dialog
|
|
ng-if="isDialogVisible"
|
|
on-confirmation="placeOrder"
|
|
on-close="showHideDialog"
|
|
is-modal="true"
|
|
has-buttons="true"
|
|
parameters="details"
|
|
title="{{'shop.headers.PLACE_ORDER' | translate}}">
|
|
<p>
|
|
<span class="glyphicon glyphicon-warning-sign"></span>{{'shop.headers.OVERVIEW' | translate}}
|
|
<div cart-review
|
|
country-names="countryNames"
|
|
cart-packages="cartPackages"
|
|
delivery="delivery"
|
|
billing="billing"
|
|
details="details">
|
|
</div>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="shop-cart-order-success" class="alert alert-success shop-message" ng-if="isOrderPlaced">
|
|
<span class="glyphicon glyphicon-ok"></span>
|
|
{{'shop.messages.ORDER_PLACED' | translate}}
|
|
</div>
|
|
|
|
<div id="shop-cart-empty-container" class="alert alert-info shop-message" ng-if="isCartEmpty()">
|
|
<span class="glyphicon glyphicon-alert"></span>
|
|
<a href="shop">
|
|
{{'shop.messages.NO_PACKAGES_IN_CART' | translate}}
|
|
</a>
|
|
</div>
|