From efc5ca41cef796418c9a7dbb28d0d236b1cb8f80 Mon Sep 17 00:00:00 2001
From: Henning Leutz <leutz@pcsg.de>
Date: Thu, 4 Mar 2021 15:51:50 +0100
Subject: [PATCH] refactor: locale and search UX -> search is triggered at the
start at the discount window
---
bin/controls/search/Search.html | 38 ++++++++++++++-------------------
bin/controls/search/Search.js | 27 +++++++++++++++++++++--
bin/controls/search/Window.js | 18 +++++++---------
locale.xml | 9 ++++++++
4 files changed, 58 insertions(+), 34 deletions(-)
diff --git a/bin/controls/search/Search.html b/bin/controls/search/Search.html
index 6be17e3..8d3b933 100644
--- a/bin/controls/search/Search.html
+++ b/bin/controls/search/Search.html
@@ -3,7 +3,7 @@
<thead>
<tr>
<th colspan="2">
- Rabatt
+ {{header}}
</th>
</tr>
</thead>
@@ -13,7 +13,7 @@
<td>
<label class="field-container">
<span class="field-container-item">
- ID
+ {{id}}
</span>
<input type="text" name="id"
class="field-container-field"/>
@@ -24,7 +24,7 @@
<td>
<label class="field-container">
<span class="field-container-item">
- Rabatt
+ {{title}}
</span>
<input type="text" name="discount"
class="field-container-field"/>
@@ -45,7 +45,7 @@
<thead>
<tr>
<th colspan="2">
- Nutzung definieren
+ {{usageHeader}}
</th>
</tr>
</thead>
@@ -56,20 +56,18 @@
<label class="field-container">
<span class="field-container-item">
<span class="fa fa-calendar"></span>
- Nutzbar von
+ {{usageFrom}}
</span>
- <input type="datetime" name="date_from"
- class="field-container-field"/>
+ <input type="datetime" name="date_from" class="field-container-field"/>
</label>
</td>
<td>
<label class="field-container">
<span class="field-container-item">
<span class="fa fa-calendar"></span>
- Nutzbar bis
+ {{usageTo}}
</span>
- <input type="datetime" name="date_until"
- class="field-container-field"/>
+ <input type="datetime" name="date_until" class="field-container-field"/>
</label>
</td>
</tr>
@@ -77,19 +75,17 @@
<td>
<label class="field-container">
<span class="field-container-item">
- Einkaufsmenge von
+ {{usageAmountOf}}
</span>
- <input type="number" min="0" name="purchase_quantity_from"
- class="field-container-field"/>
+ <input type="number" min="0" name="purchase_quantity_from" class="field-container-field"/>
</label>
</td>
<td>
<label class="field-container">
<span class="field-container-item">
- Einkaufsmenge bis
+ {{usageAmountTo}}
</span>
- <input type="number" min="0" name="purchase_quantity_until"
- class="field-container-field"/>
+ <input type="number" min="0" name="purchase_quantity_until" class="field-container-field"/>
</label>
</td>
</tr>
@@ -98,20 +94,18 @@
<label class="field-container">
<span class="field-container-item">
<span class="fa fa-money"></span>
- Einkaufswert von
+ {{usageValueOf}}
</span>
- <input type="number" min="0" name="purchase_value_from"
- class="field-container-field"/>
+ <input type="number" min="0" name="purchase_value_from" class="field-container-field"/>
</label>
</td>
<td>
<label class="field-container">
<span class="field-container-item">
<span class="fa fa-money"></span>
- Einkaufswert bis
+ {{usageValueTo}}
</span>
- <input type="number" min="0" name="purchase_value_until"
- class="field-container-field"/>
+ <input type="number" min="0" name="purchase_value_until" class="field-container-field"/>
</label>
</td>
</tr>
diff --git a/bin/controls/search/Search.js b/bin/controls/search/Search.js
index 82250e0..361de94 100644
--- a/bin/controls/search/Search.js
+++ b/bin/controls/search/Search.js
@@ -12,13 +12,16 @@ define('package/quiqqer/discount/bin/controls/search/Search', [
'qui/controls/buttons/Button',
'qui/utils/Form',
'package/quiqqer/discount/bin/classes/Handler',
+ 'Locale',
+ 'Mustache',
'text!package/quiqqer/discount/bin/controls/search/Search.html'
-], function (QUI, QUIControl, QUIButton, QUIFormUtils, Handler, template) {
+], function (QUI, QUIControl, QUIButton, QUIFormUtils, Handler, QUILocale, Mustache, template) {
"use strict";
var Discounts = new Handler();
+ var lg = 'quiqqer/discount';
return new Class({
Extends: QUIControl,
@@ -45,7 +48,27 @@ define('package/quiqqer/discount/bin/controls/search/Search', [
create: function () {
var Elm = this.parent();
- Elm.set('html', template);
+ Elm.set('html', Mustache.render(template, {
+ header : QUILocale.get(lg, 'control.search.title'),
+ id : QUILocale.get(lg, 'control.edit.template.id'),
+ title : QUILocale.get(lg, 'control.edit.template.title'),
+ discount : QUILocale.get(lg, 'control.edit.template.discount'),
+ usageHeader : QUILocale.get(lg, 'control.edit.template.usage'),
+ usageVat : QUILocale.get(lg, 'control.edit.template.vat'),
+ usageVatDesc : QUILocale.get(lg, 'control.edit.template.vatDesc'),
+ usageFrom : QUILocale.get(lg, 'control.edit.template.usage.from'),
+ usageTo : QUILocale.get(lg, 'control.edit.template.usage.to'),
+ usageAmountOf : QUILocale.get(lg, 'control.edit.template.shopping.amount.of'),
+ usageAmountTo : QUILocale.get(lg, 'control.edit.template.shopping.amount.to'),
+ usageValueOf : QUILocale.get(lg, 'control.edit.template.purchase.value.of'),
+ usageValueTo : QUILocale.get(lg, 'control.edit.template.purchase.value.to'),
+ usageAssignment : QUILocale.get(lg, 'control.edit.template.assignment'),
+ usageAssignmentAreas : QUILocale.get(lg, 'control.edit.template.areas'),
+ usageLastSumDiscount : QUILocale.get(lg, 'control.edit.template.usageLastSumDiscount'),
+ usageLastSumDiscountDesc : QUILocale.get(lg, 'control.edit.template.usageLastSumDiscountDesc'),
+ usageLastProductDiscount : QUILocale.get(lg, 'control.edit.template.usageLastProductDiscount'),
+ usageLastProductDiscountDesc: QUILocale.get(lg, 'control.edit.template.usageLastProductDiscountDesc')
+ }));
Elm.setStyles({
'float': 'left',
diff --git a/bin/controls/search/Window.js b/bin/controls/search/Window.js
index 473969b..13694e7 100644
--- a/bin/controls/search/Window.js
+++ b/bin/controls/search/Window.js
@@ -31,7 +31,7 @@ define('package/quiqqer/discount/bin/controls/search/Window', [
maxHeight: 600,
maxWidth : 800,
icon : 'fa fa-percent',
- title : 'Rabattsuche', // #locale
+ title : QUILocale.get(lg, 'window.discount.search.title'),
autoclose: false,
cancel_button: {
@@ -73,7 +73,11 @@ define('package/quiqqer/discount/bin/controls/search/Window', [
Content.addClass('discount-search');
this.$SearchContainer = new Element('div', {
- 'class': 'discount-search-searchContainer'
+ 'class': 'discount-search-searchContainer',
+ style : {
+ display: 'none',
+ opacity: 0
+ }
}).inject(Content);
this.$ResultContainer = new Element('div', {
@@ -91,7 +95,6 @@ define('package/quiqqer/discount/bin/controls/search/Window', [
this.$ButtonCancel = this.getButton('cancel');
this.$ButtonSubmit.removeEvents('click');
-
this.$ButtonSubmit.addEvent('click', function () {
self.showResults();
});
@@ -100,7 +103,6 @@ define('package/quiqqer/discount/bin/controls/search/Window', [
'package/quiqqer/discount/bin/controls/search/Search',
'package/quiqqer/discount/bin/controls/search/Result'
], function (Search, Result) {
-
self.$Search = new Search({
events: {
onLoaded: function () {
@@ -122,6 +124,7 @@ define('package/quiqqer/discount/bin/controls/search/Window', [
}).inject(self.$ResultContainer);
self.$Result.resize();
+ self.showResults();
});
},
@@ -133,10 +136,7 @@ define('package/quiqqer/discount/bin/controls/search/Window', [
return;
}
- this.fireEvent(
- 'submit',
- [this, this.$Result.getSelected()]
- );
+ this.fireEvent('submit', [this, this.$Result.getSelected()]);
if (this.getAttribute('autoclose')) {
this.close();
@@ -159,7 +159,6 @@ define('package/quiqqer/discount/bin/controls/search/Window', [
}, {
duration: 200,
callback: function () {
-
self.$ResultContainer.setStyle('display', 'none');
self.$SC_FX.animate({
@@ -214,7 +213,6 @@ define('package/quiqqer/discount/bin/controls/search/Window', [
}, {
duration: 200,
callback: function () {
-
self.$SearchContainer.setStyle('display', 'none');
self.$ResultContainer.setStyles({
diff --git a/locale.xml b/locale.xml
index ed686a8..6397067 100644
--- a/locale.xml
+++ b/locale.xml
@@ -374,6 +374,15 @@ Automatic: This discount is automatically added to an order if the conditions ap
<en><![CDATA[Add automatically]]></en>
</locale>
+ <locale name="window.discount.search.title">
+ <de><![CDATA[Rabattsuche]]></de>
+ <en><![CDATA[Discount search]]></en>
+ </locale>
+ <locale name="control.search.title">
+ <de><![CDATA[Rabatt]]></de>
+ <en><![CDATA[Discount]]></en>
+ </locale>
+
</groups>
</locales>
--
GitLab