Jose Pinto / foca-crear-nota-pedido

Download as
Browse Code »

Commit 33e084b501b33fbb0367e0045511f4e8726a477a

Authored by Nicolás Guarnieri
1 parent f25ff4555e
Exists in master

arreglos para mobile

Showing 2 changed files with 181 additions and 9 deletions   Show diff stats
... ... @@ -71,7 +71,7 @@ gulp.task('pre-commit', function() {
71 71  
72 72 gulp.task('webserver', function() {
73 73 pump [
74   - connect.server({port: 3000})
  74 + connect.server({port: 3300, host: '0.0.0.0'})
75 75 ]
76 76 });
77 77  
src/views/nota-pedido.html
Diff comments   View file @ 33e084b
... ... @@ -8,8 +8,8 @@
8 8 <div class="col-12 col-sm-4 nota-pedido">
9 9 <h5>NOTA DE PEDIDO</h5>
10 10 </div>
11   - <div class="col-6 col-sm-4 numero-pedido">Nº {{puntoVenta}}-{{comprobante}}</div>
12   - <div class="col-6 col-sm-4 text-right">
  11 + <div class="col-5 col-sm-4 numero-pedido">Nº {{puntoVenta}}-{{comprobante}}</div>
  12 + <div class="col-7 col-sm-4 text-right">
13 13 Fecha: {{ now | date:'dd/MM/yyyy HH:mm'}}
14 14 </div>
15 15 </div>
... ... @@ -65,7 +65,7 @@
65 65 <div class="row">
66 66 <div class="col-12 col-md-10 col-lg-8 offset-md-1 offset-lg-2">
67 67 <!-- PC -->
68   - <div class="row grilla-articulo align-items-end">
  68 + <div class="row grilla-articulo align-items-end d-none d-sm-block">
69 69 <table class="table tabla-articulo table-striped table-sm table-dark">
70 70 <thead>
71 71 <tr class="d-flex">
... ... @@ -210,15 +210,15 @@
210 210 </td>
211 211 </tr>
212 212 <tr class="d-flex">
213   - <td colspan="4">
  213 + <td colspan="4" class="no-border-top">
214 214 <strong>Cantidad Items:</strong>
215 215 <a ng-bind="articulosTabla.length"></a>
216 216 </td>
217   - <td class="text-right ml-auto table-celda-total"><h3>Total:</h3></td>
218   - <td class="table-celda-total text-right" colspan="1">
  217 + <td class="text-right ml-auto table-celda-total no-border-top"><h3>Total:</h3></td>
  218 + <td class="table-celda-total text-right no-border-top" colspan="1">
219 219 <h3>{{getTotal() | currency: '$'}}</h3>
220 220 </td>
221   - <td class="text-right">
  221 + <td class="text-right no-border-top">
222 222 <button
223 223 type="button"
224 224 class="btn btn-default btn-sm"
... ... @@ -230,8 +230,174 @@
230 230 </tfoot>
231 231 </table>
232 232 </div>
  233 +
  234 + <!-- MOBILE -->
  235 + <div class="row d-sm-none">
  236 + <table class="table table-sm table-striped table-dark margin-bottom-mobile">
  237 + <thead>
  238 + <tr class="d-flex">
  239 + <th class="">#</th>
  240 + <th class="col px-0">
  241 + <div class="d-flex">
  242 + <div class="col-4 px-1">Código</div>
  243 + <div class="col-8 px-1">Descripción</div>
  244 + </div>
  245 + <div class="d-flex">
  246 + <div class="col-3 px-1">Cantidad</div>
  247 + <div class="col px-1 text-right">P. Uni.</div>
  248 + <div class="col px-1 text-right">Subtotal</div>
  249 + </div>
  250 + </th>
  251 + <th class="text-center tamaño-boton">
  252 + &nbsp;
  253 + </th>
  254 + </tr>
  255 + </thead>
  256 + <tbody>
  257 + <tr
  258 + ng-repeat="(key, articulo) in articulosTabla"
  259 + ng-show="show || key == articulosTabla.length - 1"
  260 + >
  261 + <td class="w-100 align-middle d-flex p-0">
  262 + <div class="align-middle p-1">
  263 + <span ng-bind="key+1" class="align-middle"></span>
  264 + </div>
  265 + <div class="col px-0">
  266 + <div class="d-flex">
  267 + <div class="col-4 px-1">
  268 + <span
  269 + ng-bind="articulo.sector + '-' + articulo.codigo"
  270 + ></span>
  271 + </div>
  272 + <div class="col-8 px-1">
  273 + <span ng-bind="articulo.descripcion"></span>
  274 + </div>
  275 + </div>
  276 + <div class="d-flex">
  277 + <div class="col-3 px-1">
  278 + <span ng-bind="'x' + articulo.cantidad"></span>
  279 + </div>
  280 + <div class="col-3 px-1 text-right">
  281 + <span ng-bind="articulo.precio | currency: '$'"></span>
  282 + </div>
  283 + <div class="col px-1 text-right">
  284 + <span
  285 + ng-bind="(articulo.precio * articulo.cantidad) | currency: '$'"
  286 + >
  287 + </span>
  288 + </div>
  289 + </div>
  290 + </div>
  291 + <div class="align-middle p-1">
  292 + <button
  293 + class="btn btn-outline-secondary"
  294 + ng-click="quitarArticulo(key)"
  295 + >
  296 + <i class="fa fa-trash"></i>
  297 + </button>
  298 + </div>
  299 + </td>
  300 + </tr>
  301 + </tbody>
  302 + <tfoot>
  303 + <!-- CARGANDO ITEM -->
  304 + <tr ng-show="!cargando" class="d-flex">
  305 + <td
  306 + class="align-middle p-1"
  307 + ng-bind="articulosTabla.length + 1"
  308 + ></td>
  309 + <td class="col p-0">
  310 + <div class="d-flex">
  311 + <div class="col-4 px-1">
  312 + <span
  313 + ng-bind="articuloACargar.sectorCodigo"
  314 + ></span>
  315 + </div>
  316 + <div class="col-8 px-1">
  317 + <span ng-bind="articuloACargar.descripcion"></span>
  318 + </div>
  319 + </div>
  320 + <div class="d-flex">
  321 + <div class="col-3 px-1 m-1">
  322 + <input
  323 + class="form-control p-1"
  324 + type="number"
  325 + min="1"
  326 + ng-model="articuloACargar.cantidad"
  327 + foca-focus="!cargando"
  328 + ng-keypress="agregarATabla($event.keyCode)"
  329 + style="height: auto; line-height: 1.1em"
  330 + >
  331 + </div>
  332 + <div class="col-3 px-1 text-right">
  333 + <span ng-bind="articuloACargar.precio | currency: '$'"></span>
  334 + </div>
  335 + <div class="col px-1 text-right">
  336 + <span
  337 + ng-bind="getSubTotal() | currency: '$'"
  338 + >
  339 + </span>
  340 + </div>
  341 + </div>
  342 + </td>
  343 + <td class="text-center align-middle">
  344 + <button
  345 + class="btn btn-outline-secondary"
  346 + ng-click="agregarATabla(13)"
  347 + >
  348 + <i class="fa fa-save"></i>
  349 + </button>
  350 + </td>
  351 + </tr>
  352 + <!-- SELECCIONAR PRODUCTO -->
  353 + <tr ng-show="cargando" class="d-flex">
  354 + <td class="col-12">
  355 + <input
  356 + placeholder="Seleccione Articulo"
  357 + class="form-control form-control-sm"
  358 + readonly
  359 + ng-click="seleccionarArticulo()"
  360 + />
  361 + </td>
  362 + </tr>
  363 + <!-- TOOGLE EXPANDIR -->
  364 + <tr>
  365 + <td class="col">
  366 + <button
  367 + class="btn btn-outline-secondary selectable w-100"
  368 + ng-click="show = !show; masMenos()"
  369 + ng-show="articulosTabla.length > 0"
  370 + >
  371 + <i
  372 + class="fa fa-chevron-down"
  373 + ng-hide="show"
  374 + aria-hidden="true"
  375 + >
  376 + </i>
  377 + <i
  378 + class="fa fa-chevron-up"
  379 + ng-show="show"
  380 + aria-hidden="true">
  381 + </i>
  382 + </button>
  383 + </td>
  384 + </tr>
  385 + <!-- FOOTER -->
  386 + <tr class="d-flex">
  387 + <td class="align-middle no-border-top" colspan="2">
  388 + <strong>Cantidad Items:</strong>
  389 + <a ng-bind="articulosTabla.length"></a>
  390 + </td>
  391 + <td class="text-right ml-auto table-celda-total no-border-top"><h3>Total:</h3></td>
  392 + <td class="table-celda-total text-right no-border-top">
  393 + <h3>{{getTotal() | currency: '$'}}</h3>
  394 + </td>
  395 + </tr>
  396 + </tfoot>
  397 + </table>
  398 + </div>
233 399 </div>
234   - <div class="col-auto my-2 col-lg-2 botonera-lateral">
  400 + <div class="col-auto my-2 col-lg-2 botonera-lateral d-none d-sm-block">
235 401 <div class="row align-items-end">
236 402 <div class="col-12">
237 403 <button
... ... @@ -252,4 +418,10 @@
252 418 </div>
253 419 </div>
254 420 </div>
  421 + <div class="row d-sm-none fixed-bottom">
  422 + <div class="w-100 bg-dark d-flex px-3 acciones-mobile">
  423 + <span class="ml-3 text-muted" ng-click="salir()">Salir</span>
  424 + <span class="mr-3 ml-auto" ng-click="crearNotaPedido()">Guardar</span>
  425 + </div>
  426 + </div>
255 427 </div>