Skip to content

Commit

Permalink
fix: order proces -> button basket event
Browse files Browse the repository at this point in the history
  • Loading branch information
dehenne committed Mar 19, 2018
1 parent bf3926f commit 5942865
Show file tree
Hide file tree
Showing 4 changed files with 63 additions and 38 deletions.
25 changes: 13 additions & 12 deletions bin/frontend/controls/OrderProcess.js
Original file line number Diff line number Diff line change
Expand Up @@ -123,10 +123,11 @@ define('package/quiqqer/order/bin/frontend/controls/OrderProcess', [
});
}

this.$Buttons = this.getElm().getElement('.quiqqer-order-ordering-buttons');
this.$StepContainer = this.getElm().getElement('.quiqqer-order-ordering-step');
this.$Timeline = this.getElm().getElement('.quiqqer-order-ordering-timeline');
this.$Form = this.getElm().getElement('[name="order"]');
this.$Buttons = this.getElm().getElement('.quiqqer-order-ordering-buttons');
this.$StepContainer = this.getElm().getElement('.quiqqer-order-ordering-step');
this.$Timeline = this.getElm().getElement('.quiqqer-order-ordering-timeline');
this.$TimelineContainer = this.getElm().getElement('.quiqqer-order-ordering-timeline-container');
this.$Form = this.getElm().getElement('[name="order"]');

if (this.getAttribute('buttons') === false) {
this.$Buttons.setStyle('display', 'none');
Expand All @@ -136,10 +137,10 @@ define('package/quiqqer/order/bin/frontend/controls/OrderProcess', [

this.setAttribute('orderHash', this.$Form.get('data-order-hash'));

var Current = this.$Timeline.getFirst('ul li.current');
var Current = this.$TimelineContainer.getFirst('ul li.current');

if (!Current) {
Current = this.$Timeline.getFirst('ul li');
Current = this.$TimelineContainer.getFirst('ul li');
}

this.setAttribute('current', Current.get('data-step'));
Expand Down Expand Up @@ -303,7 +304,7 @@ define('package/quiqqer/order/bin/frontend/controls/OrderProcess', [
var self = this;

if (!parseInt(this.$Form.get('data-products-count'))) {
var FirstLi = this.$Timeline.getElement('li:first-child');
var FirstLi = this.$TimelineContainer.getElement('li:first-child');
step = FirstLi.get('data-step');
}

Expand Down Expand Up @@ -357,7 +358,7 @@ define('package/quiqqer/order/bin/frontend/controls/OrderProcess', [
return Promise.resolve();
}

var FirstLi = this.$Timeline.getElement('li:first-child'),
var FirstLi = this.$TimelineContainer.getElement('li:first-child'),
firstStep = FirstLi.get('data-step');

var current = this.getCurrentStepData();
Expand Down Expand Up @@ -420,7 +421,7 @@ define('package/quiqqer/order/bin/frontend/controls/OrderProcess', [
*/
getCurrentStepData: function () {
var current = this.getAttribute('current');
var Step = this.$Timeline.getElement('li[data-step="' + current + '"]');
var Step = this.$TimelineContainer.getElement('li[data-step="' + current + '"]');

if (!Step) {
return {
Expand Down Expand Up @@ -472,7 +473,7 @@ define('package/quiqqer/order/bin/frontend/controls/OrderProcess', [

if (TimeLine) {
// refresh the timeline
this.$Timeline.set('html', TimeLine.get('html'));
this.$TimelineContainer.set('html', TimeLine.get('html'));
}

// render container
Expand Down Expand Up @@ -590,7 +591,7 @@ define('package/quiqqer/order/bin/frontend/controls/OrderProcess', [
*/
$refreshSteps: function () {
var current = this.getAttribute('current');
var list = this.$Timeline.getElements('li');
var list = this.$TimelineContainer.getElements('li');

list.removeClass('current');
list.removeClass('active');
Expand Down Expand Up @@ -620,7 +621,7 @@ define('package/quiqqer/order/bin/frontend/controls/OrderProcess', [
this.$Previous.addEvent('click', this.$onPreviousClick);

var self = this,
list = this.$Timeline.getElements('li');
list = this.$TimelineContainer.getElements('li');

list.removeEvents('click');

Expand Down
20 changes: 20 additions & 0 deletions src/QUI/ERP/Order/Controls/OrderProcess.css
Original file line number Diff line number Diff line change
Expand Up @@ -132,3 +132,23 @@
.quiqqer-order-ordering-buttons-next {
float: right;
}

@media (max-width: 768px) {
.quiqqer-order-ordering-timeline {
white-space: nowrap;
overflow: auto;
}

.quiqqer-order-ordering-timeline-container {
float: left;
height: 100px;
overflow: hidden;
width: 100%;
}

.quiqqer-order-ordering-timeline li {
display: inline-block;
float: none;
width: 175px !important;
}
}
52 changes: 27 additions & 25 deletions src/QUI/ERP/Order/Controls/OrderProcess.html
Original file line number Diff line number Diff line change
Expand Up @@ -14,35 +14,37 @@
>
{/if}
<div class="quiqqer-order-ordering-timeline">
<ul>
{strip}
{assign var=cssClass value="active"}
{foreach $steps as $step => $Step}
{if $CurrentStep == $Step}
{assign var=cssClass value="current"}
{/if}
<div class="quiqqer-order-ordering-timeline-container">
<ul>
{strip}
{assign var=cssClass value="active"}
{foreach $steps as $step => $Step}
{if $CurrentStep == $Step}
{assign var=cssClass value="current"}
{/if}

<li style="width: {$listWidth}%;" class="{$cssClass}"
data-step="{$Step->getName()}"
data-icon="{$Step->getIcon()}"
>
{if $Step->getName() === 'finish'}
<span class="title">{$Step->getTitle()}</span>
<span class="fa fa-check-circle"></span>
{else if}
<a href="{$this->getStepUrl($step)}">
<li style="width: {$listWidth}%;" class="{$cssClass}"
data-step="{$Step->getName()}"
data-icon="{$Step->getIcon()}"
>
{if $Step->getName() === 'finish'}
<span class="title">{$Step->getTitle()}</span>
<span class="fa fa-check-circle"></span>
</a>
{/if}
</li>
{else if}
<a href="{$this->getStepUrl($step)}">
<span class="title">{$Step->getTitle()}</span>
<span class="fa fa-check-circle"></span>
</a>
{/if}
</li>

{if $CurrentStep == $Step}
{assign var=cssClass value=""}
{/if}
{/foreach}
{strip}
</ul>
{if $CurrentStep == $Step}
{assign var=cssClass value=""}
{/if}
{/foreach}
{strip}
</ul>
</div>
</div>

{if $error}
Expand Down
4 changes: 3 additions & 1 deletion src/QUI/ERP/Order/Controls/OrderProcess/Basket.html
Original file line number Diff line number Diff line change
Expand Up @@ -6,4 +6,6 @@ <h1>{locale group="quiqqer/order" var="ordering.step.title.Basket"}</h1>

{$BasketControl->create()}

{template_event name="quiqqer::order::orderProcessBasketEnd" Basket=$Basket}
<div class="quiqqer-order-basket-end">
{template_event name="quiqqer::order::orderProcessBasketEnd" Basket=$Basket}
</div>

0 comments on commit 5942865

Please sign in to comment.