Commit 33e084b501b33fbb0367e0045511f4e8726a477a
1 parent
f25ff4555e
Exists in
master
arreglos para mobile
Showing
2 changed files
with
181 additions
and
9 deletions
Show diff stats
gulpfile.js
src/views/nota-pedido.html
| ... | ... | @@ -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 | + | |
| 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> |