Skip to content

Commit 9500f73

Browse files
lauraluizlauraluiz
committed
Merge branch 'development'
2 parents 2d1a88f + 471e539 commit 9500f73

File tree

15 files changed

+2078
-2136
lines changed

15 files changed

+2078
-2136
lines changed

‎package-lock.json

Lines changed: 1208 additions & 1447 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,8 @@
1717
"babel-loader": "^8.0.2",
1818
"graphql-tag": "^2.9.0",
1919
"lodash.debounce": "^4.0.8",
20-
"register-service-worker": "^1.0.0",
21-
"vue": "^2.5.17",
20+
"register-service-worker": "^1.5.2",
21+
"vue": "^2.6.6",
2222
"vue-apollo": "^3.0.0-beta.25",
2323
"vue-cli-plugin-apollo": "^0.17.2",
2424
"vue-i18n": "^8.4.0",
@@ -40,22 +40,26 @@
4040
"@vue/eslint-config-airbnb": "^4.0.0",
4141
"@vue/test-utils": "^1.0.0-beta.24",
4242
"babel-core": "7.0.0-bridge.0",
43-
"babel-jest": "^23.4.2",
43+
"babel-eslint": "^10.0.1",
44+
"babel-jest": "^23.6.0",
4445
"babel-loader": "^8.0.2",
46+
"eslint": "^5.8.0",
47+
"eslint-plugin-vue": "^5.0.0",
4548
"eslint-plugin-graphql": "^2.1.1",
49+
"fibers": "^3.1.1",
4650
"jest-fetch-mock": "^1.6.6",
4751
"jest-junit": "^5.1.0",
4852
"jest-localstorage-mock": "^2.2.0",
4953
"jest-transform-graphql": "^2.1.0",
50-
"lint-staged": "^7.2.2",
54+
"lint-staged": "^8.1.0",
5155
"mocha": "^5.2.0",
5256
"mocha-junit-reporter": "^1.18.0",
5357
"mocha-multi-reporters": "^1.1.7",
54-
"node-sass": "^4.9.0",
55-
"sass-loader": "^7.0.1",
58+
"sass": "^1.16.0",
59+
"sass-loader": "^7.1.0",
5660
"selectboxit": "^3.8.2",
5761
"vue-cli-plugin-i18n": "^0.5.0",
58-
"vue-template-compiler": "^2.5.17"
62+
"vue-template-compiler": "^2.5.21"
5963
},
6064
"gitHooks": {
6165
"pre-commit": "lint-staged"

‎src/components/common/ProductThumbnail.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -88,7 +88,7 @@
8888
<script>
8989
import priceMixin from '@/mixins/priceMixin';
9090
import productMixin from '@/mixins/productMixin';
91-
import BasePrice from '../common/BasePrice.vue';
91+
import BasePrice from './BasePrice.vue';
9292
9393
export default {
9494
components: {

‎src/components/common/SelectBoxIt.vue

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,8 @@
99
</template>
1010

1111
<script>
12+
import Vue from 'vue';
13+
1214
export default {
1315
name: 'SelectBoxIt',
1416
props: ['options', 'value'],
@@ -28,6 +30,10 @@ export default {
2830
// update value
2931
$(this.$el).val(value).trigger('change');
3032
},
33+
34+
options() {
35+
Vue.nextTick(() => $(this.$el).data('selectBox-selectBoxIt').refresh());
36+
},
3137
},
3238
};
3339
</script>

‎src/components/login/SignUpForm.vue

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -101,7 +101,9 @@
101101
</template>
102102

103103
<script>
104-
import { required, email, minLength, sameAs } from 'vuelidate/lib/validators';
104+
import {
105+
required, email, minLength, sameAs,
106+
} from 'vuelidate/lib/validators';
105107
import gql from 'graphql-tag';
106108
import { clientLogin } from '@/auth';
107109
import ServerError from '../common/ServerError.vue';

‎src/components/productdetail/DetailsSection.vue

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -98,13 +98,8 @@
9898

9999
<script>
100100
import gql from 'graphql-tag';
101-
import DetailsSection from './DetailsSection.vue';
102101
103102
export default {
104-
components: {
105-
DetailsSection,
106-
},
107-
108103
props: {
109104
sku: {
110105
type: String,

‎src/components/productoverview/PageProductOverview.vue

Lines changed: 0 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -40,40 +40,6 @@
4040
</div>
4141
<!-- End mobile version -->
4242

43-
<form id="form-filter-products" name="filter-products" action="#">
44-
<!-- {{#if content.searchTerm}}
45-
<input type="hidden" name="q" value="{{content.searchTerm}}"/>
46-
{{/if}}-->
47-
48-
<div class="row item-list-pagination">
49-
<!-- {{#if content.searchResult}}
50-
<div class="search-results-row">
51-
{{> catalog/pop/search-result searchResult=content.searchResult}}
52-
</div>
53-
{{else}}
54-
<div class="jumbotron-row">
55-
{{> catalog/pop/jumbotron jumbotron=content.jumbotron}}
56-
</div>
57-
{{/if}}-->
58-
<div class="col-xs-4 hidden-xs text-left">
59-
<div class="custom-select-wrapper">
60-
<!--{{> catalog/pop/sort-selector sortSelector=content.sortSelector}}-->
61-
</div>
62-
</div>
63-
<div class="col-xs-4 hidden-xs text-center custom-pagination">
64-
<ul class="page-numbers">
65-
<!--{{> common/pagination pagination=content.pagination}}-->
66-
</ul>
67-
</div>
68-
<div class="col-xs-4 hidden-xs text-right">
69-
<!--{{> catalog/pop/display-selector displaySelector=content.displaySelector}}-->
70-
</div>
71-
</div>
72-
<div class="product-filter hidden-xs">
73-
<!--{{> catalog/pop/filters-sidebar}}-->
74-
</div>
75-
</form>
76-
7743
<ProductList :categorySlug="categorySlug" />
7844

7945
<div class="row">

‎src/components/productoverview/ProductList.vue

Lines changed: 55 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,51 @@
11
<template>
22
<div>
3-
<div v-if="!products">
4-
<img src="../../assets/img/spinner.gif"/>
3+
<form id="form-filter-products" name="filter-products" action="#">
4+
<!-- {{#if content.searchTerm}}
5+
<input type="hidden" name="q" value="{{content.searchTerm}}"/>
6+
{{/if}}-->
7+
8+
<div class="row item-list-pagination">
9+
<!-- {{#if content.searchResult}}
10+
<div class="search-results-row">
11+
{{> catalog/pop/search-result searchResult=content.searchResult}}
12+
</div>
13+
{{else}}
14+
<div class="jumbotron-row">
15+
{{> catalog/pop/jumbotron jumbotron=content.jumbotron}}
16+
</div>
17+
{{/if}}-->
18+
<div class="col-xs-4 hidden-xs text-left">
19+
<div class="custom-select-wrapper">
20+
<ProductSortSelector @changeSort="changeSort" />
21+
<!--{{> catalog/pop/sort-selector sortSelector=content.sortSelector}}-->
22+
</div>
23+
</div>
24+
<div class="col-xs-4 hidden-xs text-center custom-pagination">
25+
<ul class="page-numbers">
26+
<!--{{> common/pagination pagination=content.pagination}}-->
27+
</ul>
28+
</div>
29+
<div class="col-xs-4 hidden-xs text-right">
30+
<!--{{> catalog/pop/display-selector displaySelector=content.displaySelector}}-->
31+
</div>
32+
</div>
33+
<div class="product-filter hidden-xs">
34+
<!--{{> catalog/pop/filters-sidebar}}-->
35+
</div>
36+
</form>
37+
<div v-if="isLoading">
38+
<img data-test="spinner" src="../../assets/img/spinner.gif"/>
539
</div>
6-
<div v-else-if="!products.results.length">
40+
<div v-else-if="products && !products.results.length">
741
{{ $t('catalog.searchNotFound.notFound') }}
842
</div>
943
<transition name="fade">
10-
<div v-if="products && products.results.length"
44+
<div v-if="!isLoading && products && products.results.length"
1145
id="pop-product-list"
1246
class="row">
1347
<ProductThumbnail v-for="product in products.results"
48+
data-test="product-list"
1449
:key="product.id"
1550
:product="product" />
1651
</div>
@@ -21,21 +56,34 @@
2156
<script>
2257
import gql from 'graphql-tag';
2358
import ProductThumbnail from '../common/ProductThumbnail.vue';
59+
import ProductSortSelector from './ProductSortSelector.vue';
2460
2561
export default {
2662
components: {
2763
ProductThumbnail,
64+
ProductSortSelector,
2865
},
2966
3067
props: ['categorySlug'],
3168
3269
data: () => ({
3370
categories: null,
3471
products: null,
72+
sort: null,
3573
}),
3674
3775
computed: {
3876
category: vm => vm.categories.results[0],
77+
78+
isLoading() {
79+
return this.$apollo.loading;
80+
},
81+
},
82+
83+
methods: {
84+
changeSort(sort) {
85+
this.sort = sort;
86+
},
3987
},
4088
4189
apollo: {
@@ -58,8 +106,8 @@ export default {
58106
59107
products: {
60108
query: gql`
61-
query products($locale: Locale!, $currency: Currency!, $where: String) {
62-
products(limit: 20, where: $where, sort: "id asc") {
109+
query products($locale: Locale!, $currency: Currency!, $where: String, $sort: [String!]) {
110+
products(limit: 20, where: $where, sort: $sort) {
63111
results {
64112
id
65113
masterData {
@@ -97,6 +145,7 @@ export default {
97145
locale: this.$i18n.locale,
98146
currency: this.$i18n.numberFormats[this.$store.state.country].currency.currency,
99147
where: `masterData(current(categories(id="${this.category.id}")))`,
148+
sort: this.sort,
100149
};
101150
},
102151
skip: vm => !vm.categories,

‎src/components/productoverview/ProductSortSelector.vue

Lines changed: 92 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,92 @@
1+
<template>
2+
<div>
3+
<label>{{ $t('sortBy') }}</label>
4+
<SelectBoxIt :options="sortOptions"
5+
v-model="sort"
6+
data-test="sort-selector"
7+
class="sort-selector"/>
8+
</div>
9+
</template>
10+
11+
<script>
12+
export default {
13+
data: () => ({
14+
sort: null,
15+
}),
16+
17+
computed: {
18+
sortOptions() {
19+
return [
20+
{ id: null, name: this.$t('recommended') },
21+
{ id: 'newest', name: this.$t('newest') },
22+
{ id: 'oldest', name: this.$t('oldest') },
23+
];
24+
},
25+
},
26+
27+
methods: {
28+
changeSortParameter(value) {
29+
const query = { ...this.$route.query };
30+
if (value) {
31+
query.sort = value;
32+
} else {
33+
delete query.sort;
34+
}
35+
this.$router.replace({ query });
36+
},
37+
},
38+
39+
created() {
40+
this.sort = this.$route.query.sort;
41+
},
42+
43+
watch: {
44+
sort(newValue) {
45+
const sortCriteria = (sort) => {
46+
switch (sort) {
47+
case 'newest': return 'createdAt desc';
48+
case 'oldest': return 'createdAt asc';
49+
default: return null;
50+
}
51+
};
52+
this.$emit('changeSort', sortCriteria(newValue));
53+
this.changeSortParameter(newValue);
54+
},
55+
},
56+
};
57+
</script>
58+
59+
<style scoped>
60+
label {
61+
font-size: 0.9em;
62+
display: block;
63+
margin: 0;
64+
padding: 0;
65+
line-height: normal;
66+
}
67+
68+
.sort-selector {
69+
background: #ffffff url("../../assets/img/arrow-67-filled.png") no-repeat 90% 50%;
70+
background-size: 12px;
71+
color: #333333;
72+
padding-right: 10px;
73+
border: 1px solid #D6D6D6;
74+
}
75+
</style>
76+
77+
<i18n>
78+
{
79+
"en": {
80+
"sortBy": "Sort by",
81+
"newest": "Newest",
82+
"oldest": "Oldest",
83+
"recommended": "Recommended"
84+
},
85+
"de": {
86+
"sortBy": "Sortieren nach",
87+
"newest": "Neueste",
88+
"oldest": "Älteste",
89+
"recommended": "Empfohlen"
90+
}
91+
}
92+
</i18n>

‎src/registerServiceWorker.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@ import { register } from 'register-service-worker';
55
if (process.env.NODE_ENV === 'production') {
66
register(`${process.env.BASE_URL}service-worker.js`, {
77
ready() {
8-
console.log('App is being served from cache by a service worker.\n' +
9-
'For more details, visit https://goo.gl/AFskqB');
8+
console.log('App is being served from cache by a service worker.\n'
9+
+ 'For more details, visit https://goo.gl/AFskqB');
1010
},
1111
cached() {
1212
console.log('Content has been cached for offline use.');

0 commit comments

Comments
 (0)