bg img and split of angular tpl

This commit is contained in:
Kayn Ty 2018-04-06 15:43:14 +02:00
parent c66aa69037
commit 15cc66ab79
12 changed files with 162 additions and 127 deletions

View File

@ -8,6 +8,7 @@
{% endblock %} {% endblock %}
</head> </head>
<body> <body>
<div class="bg-img"></div>
{% block navigation %} {% block navigation %}
{% include 'default/login-choices.html.twig' %} {% include 'default/login-choices.html.twig' %}
{% endblock %} {% endblock %}

View File

@ -1,4 +1,4 @@
<sub class="footer-note"> développé par Tykayn / <sub class="footer-note text-center"> développé par Tykayn /
<a href="http://www.cipherbliss.com"> <a href="http://www.cipherbliss.com">
Cipher Bliss Cipher Bliss
</a> </a>

View File

@ -9,20 +9,20 @@
</div> </div>
<div class="product-values"> <div class="product-values">
<div class="row"> <div class="row">
<div class="col"> <div class="col-xs-4 text-center">
<i class="fa fa-clipboard-check "></i> <i class="fa fa-clipboard-check fa-3x"></i>
<h2>Gratuit</h2> <h2 class="text-center">Gratuit</h2>
<p>Gérez votre comptabilité de stand en ligne sans dépenser un rond. Plus besoin de transporter un <p>Gérez votre comptabilité de stand en ligne sans dépenser un rond. Plus besoin de transporter un
inventaire et des feuilles de calcul faites à l'arrache.</p> inventaire et des feuilles de calcul faites à l'arrache.</p>
</div> </div>
<div class="col"> <div class="col-xs-4 text-center">
<i class="fa fa-boxes"></i> <i class="fa fa-boxes fa-3x"></i>
<h2>Flexible</h2> <h2>Flexible</h2>
<p>Modifiez vos produits à la volée, soyez plusieurs à gérer la caisse si vous le souhaitez, changez de <p>Modifiez vos produits à la volée, soyez plusieurs à gérer la caisse si vous le souhaitez, changez de
responsable en cours de journée. </p> responsable en cours de journée. </p>
</div> </div>
<div class="col"> <div class="col-xs-4 text-center">
<i class="fa fa-truck"></i> <i class="fa fa-truck fa-3x"></i>
<h2>Portable</h2> <h2>Portable</h2>
<p>Fait pour être utilisé sur les marchés et les salons. Votre gestion des stocks n'en sera que <p>Fait pour être utilisé sur les marchés et les salons. Votre gestion des stocks n'en sera que
simplifiée.</p> simplifiée.</p>

View File

@ -0,0 +1,56 @@
{% verbatim %}
<div class="current-selling">
<form action="#">
Festival: {{ activeFestival.name }}
<input type="text" ng-model="activeFestival.commentaire">
<hr>
{{ activeSelling.length }} produits
<ul>
<li ng-repeat="p in activeSelling track by $index">
<div class="row">
<div class="col-xs-6">
<div class="input-group">
<input type="text" ng-model="p.name">
<div class="btn btn-warning input-group-addon"
ng-click="activeSelling.splice($index,1)">
<i class="fa fa-trash"></i>
</div>
</div>
</div>
<div class="col-xs-6 text-right">
<strong>
<input type="number" ng-model="p.price">
€ </strong>
</div>
</div>
</li>
</ul>
<div class="text-right">
<h3>Total: <strong>{{ CurrentSellingTotal() }}€</strong></h3>
<input type="number" id="paid_amount" ng-model="paidAmount">
<div class="alert alert-success" ng-if="CurrentSellingTotal() - paidAmount <=0">
<h3>Rendu: {{ CurrentSellingTotal() - paidAmount }}€</h3>
</div>
<div class="alert alert-warning" ng-if="CurrentSellingTotal() - paidAmount >0">
<h3>il manque: {{ CurrentSellingTotal() - paidAmount }}€</h3>
</div>
</div>
<div class="row">
<div class="col">
<button class="btn btn-primary btn-block" id="validate_selling" ng-click="sendForm()">
<i class="fa fa-check"></i>
Valider
</button>
</div>
<div class="col">
<button class="btn btn-default" id="pause_selling" ng-click="pauseSelling()">
<i class="fa fa-clock"></i>
Pause
</button>
</div>
</div>
</form>
<hr>
</div>
{% endverbatim %}

View File

@ -0,0 +1,15 @@
{% verbatim %}
<div class="category-listing" ng-repeat="c in categories">
<h2>
{{ c.name }}
</h2>
<button ng-repeat="p in c.products track by p.id"
class="btn btn-default"
ng-click="addProduct( p )">
{{ p.name }}
<span class="badge">
{{ p.price }}
</span>
</button>
</div>
{% endverbatim %}

View File

@ -0,0 +1,35 @@
<!--ok loading done-->
<div id="loaded" ng-if="initLoadDone">
{% include 'logged/angular/messages.html.twig' %}
<!--caisse IHM-->
<div id="load_ok">
<div class="listing-products col-xs-7">
{% include 'logged/angular/listing-products.html.twig' %}
</div>
<div class="sellings col-xs-5">
{% include 'logged/angular/current.html.twig' %}
{% include 'logged/angular/paused.html.twig' %}
<div class="selling-history">
<h4>
Ventes récentes
</h4>
{% if recentSells %}
<ul>
{% for s in recentSells %}
<li>{{ s.date|date('Y/m/d H:i:s') }} {{ s.amount }}€</li>
{% endfor %}
</ul>
{% else %}
aucune
{% endif %}
</div>
</div>
</div>
</div>

View File

@ -0,0 +1,13 @@
{% verbatim %}
<div id="messages">
<div id="no-categories" class="alert alert-info" ng-if="!categories.length">
<i class="fa fa-info"></i>
Vous n'avez pas encore enregistré de <strong>catégorie de produit</strong>, ajoutez-en donc.
</div>
<div id="no-products" class="alert alert-info" ng-if="!productsFromDB.length">
<i class="fa fa-info"></i>
Vous n'avez pas encore enregistré de <strong>produit</strong>, ajoutez-en donc.
</div>
<!--end messages warning-->
</div>
{% endverbatim %}

View File

@ -0,0 +1,15 @@
{% verbatim %}
<div class="selling-on-hold">
<h4>
Ventes en pause
</h4>
<ul>
<li ng-repeat="list in pausedSellings track by $index"
ng-click="setBackPausedSelling(list, $index)">
{{ $index }}) {{ list.products.length }} produits, <strong>
{{ sumOfList(list) }}€ </strong>
</li>
</ul>
<hr>
</div>
{% endverbatim %}

View File

@ -2,128 +2,14 @@
ng-app="caisse" ng-app="caisse"
ng-controller="CaisseCtrl" ng-controller="CaisseCtrl"
> >
{% verbatim %} {% verbatim %}
<div class="alert">
test stuff: {{ stuff[0] }}. <div id="not_loaded" ng-if="!initLoadDone">
<br>compte: {{ stuff.length }}.
</div>
<div class="well"> <div class="well">
{{productsFromDB.length}} <i class="fa fa-refresh fa-3x"></i> Chargement en cours de vos produits
</div>
<div class="listing-products col-xs-7">
<div class="category-listing" ng-repeat="c in categories">
<h2>
{{ c.name }}
</h2>
<button ng-repeat="p in c.products track by p.id"
class="btn btn-default"
ng-click="addProduct( p )">
{{ p.name }}
<span class="badge">
{{ p.price }}
</span>
</button>
</div>
</div>
<div class="sellings col-xs-5">
<div class="current-selling">
<form action="#">
Festival: {{activeFestival.name}}
<input type="text" ng-model="activeFestival.commentaire">
<hr>
{{activeSelling.length}} produits
<ul>
<li ng-repeat="p in activeSelling track by $index">
<div class="row">
<div class="col-xs-6">
<div class="input-group">
<input type="text" ng-model="p.name">
<div class="btn btn-warning input-group-addon" ng-click="activeSelling.splice($index,1)">
<i class="fa fa-trash"></i>
</div>
</div> </div>
</div> </div>
<div class="col-xs-6 text-right">
<strong>
<input type="number" ng-model="p.price"> €
</strong>
</div>
</div>
</li>
</ul>
<div class="text-right">
<h3 >Total: <strong>{{CurrentSellingTotal()}}€</strong></h3>
<input type="number" id="paid_amount" ng-model="paidAmount">
<div class="alert alert-success" ng-if="CurrentSellingTotal() - paidAmount <=0">
<h3>Rendu: {{ CurrentSellingTotal() - paidAmount }}€</h3>
</div>
<div class="alert alert-warning" ng-if="CurrentSellingTotal() - paidAmount >0">
<h3>il manque: {{ CurrentSellingTotal() - paidAmount }}€</h3>
</div>
</div>
{% endverbatim %} {% endverbatim %}
<div class="row"> {% include 'logged/angular/loaded-caisse.html.twig' %}
<div class="col">
<button class="btn btn-primary btn-block" id="validate_selling" ng-click="sendForm()">
<i class="fa fa-check"></i>
Valider
</button>
</div>
<div class="col">
<button class="btn btn-default" id="pause_selling" ng-click="pauseSelling()">
<i class="fa fa-clock"></i>
Pause
</button>
</div>
</div>
</form>
<hr>
</div>
<div class="selling-on-hold">
<h4>
Ventes en pause
</h4>
{% verbatim %}
<ul>
<li ng-repeat="list in pausedSellings track by $index" ng-click="setBackPausedSelling(list, $index)">
{{ $index }}) {{ list.products.length }} produits,
<strong>
{{ sumOfList(list) }}
</strong>
</li>
</ul>
{% endverbatim %}
<hr>
</div>
<div class="selling-history">
<h4>
Ventes récentes
</h4>
{% if recentSells %}
<ul>
{% for s in recentSells %}
<li>{{ s.date|date('Y/m/d H:i:s') }} {{ s.amount }}€</li>
{% endfor %}
</ul>
{% else %}
aucune
{% endif %}
</div>
</div>
</div> </div>

View File

@ -1,3 +1,14 @@
.main-screen { .main-screen {
min-height: 80vh; min-height: 80vh;
} }
.bg-img {
background-image: url('bg.jpg');
background-size: cover;
opacity: 0.2;
filter: alpha(opacity=20);
width: 100vw;
height: 100vh;
position: absolute;
overflow: hidden;
}

View File

@ -10,6 +10,7 @@ angular
{id: 4, name: "truc 4", price: 1, category: 2}, {id: 4, name: "truc 4", price: 1, category: 2},
]; ];
$scope.categories = []; $scope.categories = [];
$scope.initLoadDone = false;
$scope.recentSellings = []; $scope.recentSellings = [];
$scope.pausedSelling = []; $scope.pausedSelling = [];
$scope.activeSelling = []; $scope.activeSelling = [];
@ -56,8 +57,10 @@ angular
console.log('ok', rep); console.log('ok', rep);
$scope.categories = rep.data.categories; $scope.categories = rep.data.categories;
$scope.recentSellings = rep.data.history; $scope.recentSellings = rep.data.history;
$scope.initLoadDone = true;
}, (err) => { }, (err) => {
console.log(err); console.log(err);
$scope.initLoadDone = true;
}); });
}; };
$scope.pauseSelling = function () { $scope.pauseSelling = function () {

BIN
web/bg.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 176 KiB