Browse Source

Merge branch 'feature/categories_front' into dev

dev
Guillaume 3 years ago
parent
commit
ddf0662ac2
5 changed files with 183 additions and 37 deletions
  1. +8
    -1
      producer/controllers/OrderController.php
  2. +42
    -20
      producer/views/order/order.php
  3. +61
    -15
      producer/web/css/screen.css
  4. +22
    -0
      producer/web/js/vuejs/order-order.js
  5. +50
    -1
      producer/web/sass/order/_order.scss

+ 8
- 1
producer/controllers/OrderController.php View File



// Catégories // Catégories
$categoriesArray = ProductCategory::searchAll([], ['orderby' => 'product_category.position ASC', 'as_array' => true]) ; $categoriesArray = ProductCategory::searchAll([], ['orderby' => 'product_category.position ASC', 'as_array' => true]) ;
array_unshift($categoriesArray, ['id' => null, 'name' => 'Catégorie par défaut']) ;
$countProductsWithoutCategories = Product::searchCount([
'id_producer' => $this->getProducer()->id,
'product.active' => 1,
'product.id_product_category' => null
]);
if($countProductsWithoutCategories) {
array_unshift($categoriesArray, ['id' => null, 'name' => 'Catégorie par défaut']) ;
}
$json['categories'] = $categoriesArray ; $json['categories'] = $categoriesArray ;


// Produits // Produits

+ 42
- 20
producer/views/order/order.php View File

<tbody> <tbody>
<template v-for="category in categories"> <template v-for="category in categories">
<tr v-if="category.id && countProductsByCategory(category)"> <tr v-if="category.id && countProductsByCategory(category)">
<td class="category-name" colspan="5">{{ category.name }}</td>
</tr>
<tr v-for="product in products" v-if="product.id_product_category == category.id && product.productDistribution && product.productDistribution[0] && product.productDistribution[0].active == 1">
<td class="photo">
<img v-if="product.photo.length" class="photo-product" :src="'<?php echo Yii::$app->urlManager->getBaseUrl(); ?>/uploads/'+product.photo" />
<td class="category-name" colspan="5" @click="setCategoryCurrent(category)">
<span v-if="categoryCurrent && categoryCurrent.id == category.id" class="glyphicon glyphicon-triangle-bottom"></span>
<span v-else class="glyphicon glyphicon-triangle-right"></span>
{{ category.name }}
<span class="label label-default">{{ countProductsByCategory(category) }} produit<template v-if="countProductsByCategory(category) > 1">s</template></span>
<span v-if="countSelectedProductsByCategory(category) > 0" class="label label-success">{{ countSelectedProductsByCategory(category) }} produit<template v-if="countSelectedProductsByCategory(category) > 1">s</template> sélectionné<template v-if="countSelectedProductsByCategory(category) > 1">s</template></span>
</td> </td>
<td class="name">
<span class="name">{{ product.name }}</span>
<span class="other">
</tr>
<template v-if="(categoryCurrent && categoryCurrent.id == category.id) || category.id == null">
<tr v-for="product in products" v-if="product.id_product_category == category.id && product.productDistribution && product.productDistribution[0] && product.productDistribution[0].active == 1">
<td class="photo">
<img v-if="product.photo.length" class="photo-product" :src="'<?php echo Yii::$app->urlManager->getBaseUrl(); ?>/uploads/'+product.photo" />
</td>
<td class="name">
<span class="name">{{ product.name }}</span>
<span class="other">
<span v-if="product.description.length">/</span> <span v-if="product.description.length">/</span>
<span class="description">{{ product.description }}</span> <span class="description">{{ product.description }}</span>
<span v-if="product.weight">({{ product.weight }}&nbsp;g)</span> <span v-if="product.weight">({{ product.weight }}&nbsp;g)</span>
</span> </span>
<span v-if="product.quantity_max > 0 && ((product.quantity_form / product.coefficient_unit == product.quantity_remaining) || ((product.quantity_remaining * product.coefficient_unit) - product.quantity_form) < product.step)" class="label label-danger">
<span v-if="product.quantity_max > 0 && ((product.quantity_form / product.coefficient_unit == product.quantity_remaining) || ((product.quantity_remaining * product.coefficient_unit) - product.quantity_form) < product.step)" class="label label-danger">
Épuisé Épuisé
</span> </span>
<div class="recipe" v-if="product.recipe.length">{{ product.recipe }}</div>
</td>
<td class="price-unit">
<div class="recipe" v-if="product.recipe.length">{{ product.recipe }}</div>
</td>
<td class="price-unit">
<template v-if="product.price_with_tax > 0">{{ formatPrice(product.price_with_tax) }}<br /><span class="unit">{{ product.wording_unit }}</span></template> <template v-if="product.price_with_tax > 0">{{ formatPrice(product.price_with_tax) }}<br /><span class="unit">{{ product.wording_unit }}</span></template>
</td>
<td class="td-quantity">
</td>
<td class="td-quantity">
<template v-if="product.price_with_tax > 0"> <template v-if="product.price_with_tax > 0">
<div class="input-group"> <div class="input-group">
<span class="input-group-btn"> <span class="input-group-btn">
</span> </span>
</div> </div>
</template> </template>
</td>
<td class="price-total">
</td>
<td class="price-total">
<template v-if="product.price_with_tax > 0 && product.quantity_form > 0"> <template v-if="product.price_with_tax > 0 && product.quantity_form > 0">
{{ formatPrice(product.price_with_tax * (product.quantity_form / product.coefficient_unit )) }}
{{ formatPrice(product.price_with_tax * (product.quantity_form / product.coefficient_unit )) }}
</template> </template>
</td>
</tr>
</td>
</tr>
</template>
</template> </template>
<tr class="total"> <tr class="total">
<td colspan="4"></td>
<td class="summary" colspan="4">
<template v-if="priceTotal() > 0">
<h3>&gt; Résumé</h3>
<ul>
<li v-for="product in products" v-if="product.quantity_form > 0">
<span class="quantity">{{ product.quantity_form }} x</span>
<span class="name">{{ product.name }}</span>
<span class="other">
<span v-if="product.description.length">/</span>
<span class="description">{{ product.description }}</span>
<span v-if="product.weight">({{ product.weight }}&nbsp;g)</span>
</li>
</ul>
</template>
</td>
<td class="price-total">{{ priceTotal(true) }}</td> <td class="price-total">{{ priceTotal(true) }}</td>
</tr> </tr>
</tbody> </tbody>

+ 61
- 15
producer/web/css/screen.css View File

text-transform: uppercase; text-transform: uppercase;
padding-top: 13px; padding-top: 13px;
} }
/* line 233, ../sass/order/_order.scss */
/* line 230, ../sass/order/_order.scss */
.order-order #main #app-order-order table#products td.category-name .glyphicon-triangle-bottom,
.order-order #main #app-order-order table#products td.category-name .glyphicon-triangle-right {
font-size: 15px;
}
/* line 235, ../sass/order/_order.scss */
.order-order #main #app-order-order table#products td.category-name span.label {
font-family: "Arial";
font-weight: normal;
float: right;
text-transform: none;
margin-left: 15px;
}
/* line 244, ../sass/order/_order.scss */
.order-order #main #app-order-order table#products td.category-name:hover {
cursor: pointer;
background-color: #FF7F00;
color: white;
}
/* line 252, ../sass/order/_order.scss */
.order-order #main #app-order-order table#products td.photo img { .order-order #main #app-order-order table#products td.photo img {
width: 100px; width: 100px;
} }
/* line 239, ../sass/order/_order.scss */
/* line 258, ../sass/order/_order.scss */
.order-order #main #app-order-order table#products td.name .name { .order-order #main #app-order-order table#products td.name .name {
font-family: "capsuularegular"; font-family: "capsuularegular";
color: black; color: black;
font-size: 20px; font-size: 20px;
line-height: 25px; line-height: 25px;
} }
/* line 245, ../sass/order/_order.scss */
/* line 264, ../sass/order/_order.scss */
.order-order #main #app-order-order table#products td.name .other { .order-order #main #app-order-order table#products td.name .other {
font-size: 14px; font-size: 14px;
color: #333; color: #333;
} }
/* line 249, ../sass/order/_order.scss */
/* line 268, ../sass/order/_order.scss */
.order-order #main #app-order-order table#products td.name .recipe { .order-order #main #app-order-order table#products td.name .recipe {
color: gray; color: gray;
} }
/* line 253, ../sass/order/_order.scss */
/* line 272, ../sass/order/_order.scss */
.order-order #main #app-order-order table#products .price-unit, .order-order #main #app-order-order table#products .price-total { .order-order #main #app-order-order table#products .price-unit, .order-order #main #app-order-order table#products .price-total {
width: 100px; width: 100px;
text-align: center; text-align: center;
} }
/* line 257, ../sass/order/_order.scss */
/* line 276, ../sass/order/_order.scss */
.order-order #main #app-order-order table#products .price-unit .unit, .order-order #main #app-order-order table#products .price-total .unit { .order-order #main #app-order-order table#products .price-unit .unit, .order-order #main #app-order-order table#products .price-total .unit {
color: gray; color: gray;
font-size: 13px; font-size: 13px;
} }
/* line 262, ../sass/order/_order.scss */
/* line 281, ../sass/order/_order.scss */
.order-order #main #app-order-order table#products .td-quantity { .order-order #main #app-order-order table#products .td-quantity {
width: 175px; width: 175px;
} }
/* line 264, ../sass/order/_order.scss */
/* line 283, ../sass/order/_order.scss */
.order-order #main #app-order-order table#products .td-quantity input.quantity { .order-order #main #app-order-order table#products .td-quantity input.quantity {
text-align: center; text-align: center;
border-right: 0px none; border-right: 0px none;
} }
/* line 268, ../sass/order/_order.scss */
/* line 287, ../sass/order/_order.scss */
.order-order #main #app-order-order table#products .td-quantity .input-group-addon { .order-order #main #app-order-order table#products .td-quantity .input-group-addon {
padding: 5px; padding: 5px;
padding-left: 0px; padding-left: 0px;
border-left: 0px none; border-left: 0px none;
border-right: 0px none; border-right: 0px none;
} }
/* line 278, ../sass/order/_order.scss */
/* line 298, ../sass/order/_order.scss */
.order-order #main #app-order-order table#products tr.total .summary h3 {
margin-top: 0px;
font-family: "capsuularegular";
text-transform: none;
margin-bottom: 5px;
}
/* line 305, ../sass/order/_order.scss */
.order-order #main #app-order-order table#products tr.total .summary ul {
margin-bottom: 15px;
padding-left: 20px;
font-size: 23px;
}
/* line 312, ../sass/order/_order.scss */
.order-order #main #app-order-order table#products tr.total .summary ul li .quantity {
font-size: 18px;
}
/* line 316, ../sass/order/_order.scss */
.order-order #main #app-order-order table#products tr.total .summary ul li .name {
font-family: "capsuularegular";
font-size: 24px;
}
/* line 320, ../sass/order/_order.scss */
.order-order #main #app-order-order table#products tr.total .summary ul li .other {
font-family: "arial";
font-size: 14px;
}
/* line 327, ../sass/order/_order.scss */
.order-order #main #app-order-order table#products tr.total .price-total { .order-order #main #app-order-order table#products tr.total .price-total {
font-size: 23px; font-size: 23px;
} }
/* line 286, ../sass/order/_order.scss */
/* line 335, ../sass/order/_order.scss */
.order-order #main #app-order-order #content-step-payment .credit .info { .order-order #main #app-order-order #content-step-payment .credit .info {
margin-left: 20px; margin-left: 20px;
color: gray; color: gray;
} }
/* line 292, ../sass/order/_order.scss */
/* line 341, ../sass/order/_order.scss */
.order-order #main #app-order-order #content-step-payment .comment { .order-order #main #app-order-order #content-step-payment .comment {
margin-bottom: 20px; margin-bottom: 20px;
} }
/* line 303, ../sass/order/_order.scss */
/* line 352, ../sass/order/_order.scss */
.order-order #main #app-order-order #infos { .order-order #main #app-order-order #infos {
margin-top: 30px; margin-top: 30px;
} }
/* line 305, ../sass/order/_order.scss */
/* line 354, ../sass/order/_order.scss */
.order-order #main #app-order-order #infos .panel-body { .order-order #main #app-order-order #infos .panel-body {
padding-top: 0px; padding-top: 0px;
white-space: pre-line; white-space: pre-line;
} }


/* line 315, ../sass/order/_order.scss */
/* line 364, ../sass/order/_order.scss */
#main #content .panel h3 { #main #content .panel h3 {
font-family: "highvoltageregular"; font-family: "highvoltageregular";
margin: 0px; margin: 0px;

+ 22
- 0
producer/web/js/vuejs/order-order.js View File

pointsSaleCodes: [], pointsSaleCodes: [],
products: [], products: [],
categories: [], categories: [],
categoryCurrent: null,
comment: '', comment: '',
creditCheckbox: false, creditCheckbox: false,
useCredit: false, useCredit: false,
app.calendar.attrs = []; app.calendar.attrs = [];
app.calendar.availableDates = []; app.calendar.availableDates = [];
var distributions = response.data.distributions; var distributions = response.data.distributions;

if (distributions.length) { if (distributions.length) {
app.distributions = distributions; app.distributions = distributions;
var arrayDate; var arrayDate;


if(response.data.categories) { if(response.data.categories) {
app.categories = response.data.categories ; app.categories = response.data.categories ;
console.log(response.data.categories[0]) ;
app.setCategoryCurrent(response.data.categories[0]) ;
} }


if(!updateOnlyProducts) { if(!updateOnlyProducts) {
} }
} }
return count ; return count ;
},
countSelectedProductsByCategory: function(category) {
var count = 0 ;
for(var key in this.products) {
if(this.products[key].quantity_form > 0 && this.products[key].id_product_category == category.id) {
count ++ ;
}
}

return count ;
},
setCategoryCurrent: function(category) {
if(this.categoryCurrent && this.categoryCurrent.id == category.id) {
this.categoryCurrent = null ;
}
else {
this.categoryCurrent = category ;
}
} }
}, },
computed : { computed : {

+ 50
- 1
producer/web/sass/order/_order.scss View File

table#products { table#products {


td.category-name { td.category-name {
//font-family: "capsuularegular" ;
font-family: "highvoltageregular" ; font-family: "highvoltageregular" ;
font-size: 22px ; font-size: 22px ;
line-height: 30px; line-height: 30px;
text-transform: uppercase; text-transform: uppercase;
padding-top: 13px ; padding-top: 13px ;

.glyphicon-triangle-bottom,
.glyphicon-triangle-right {
font-size: 15px ;
}

span.label {
//font-family: 'capsuularegular' ;
font-family: 'Arial' ;
font-weight: normal ;
float: right ;
text-transform: none ;
margin-left: 15px ;
}

&:hover {
cursor: pointer ;
background-color: $color1 ;
color: white ;
}
} }


td.photo { td.photo {
} }
tr.total { tr.total {
.summary {
h3 {
margin-top: 0px ;
font-family: 'capsuularegular' ;
text-transform: none ;
margin-bottom: 5px ;
}

ul {
margin-bottom: 15px ;
padding-left: 20px ;
font-size: 23px ;


li {
.quantity {
font-size: 18px ;
}

.name {
font-family: 'capsuularegular' ;
font-size: 24px ;
}
.other {
font-family: 'arial' ;
font-size: 14px ;
}
}
}
}
.price-total { .price-total {
font-size: 23px ; font-size: 23px ;
} }

Loading…
Cancel
Save