1<!doctype html> 2<html lang="es"> 3 <head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 6 <title>Crear factura electrónica - Facturae Web</title> 7 <meta property="og:title" content="Crear factura electrónica"> 8 <meta property="og:image" content="https://josemmo.io/facturae-web/favicon.png"> 9 <meta property="og:site_name" content="Facturae Web"> 10 <meta name="description" property="og:description" content="Genera y firma facturas electrónicas en formato FacturaE (XML y XSIG) desde tu navegador totalmente válidas y listas para ser presentadas a FACe o a cualquier administraciones públicas."> 11 <link rel="icon" href="/facturae-web/favicon.png"> 12 <!--[if IE]><link rel="shortcut icon" href="/facturae-web/favicon.ico"><![endif]--> 13 <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700"> 14 <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"> 15 <link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.light_green-red.min.css"> 16 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/dialog-polyfill/0.4.10/dialog-polyfill.min.css"> 17 <link rel="stylesheet" href="/facturae-web/css/app.css?v=1.0.1"> 18 </head> 19 <body> 20 <div class="mdl-layout mdl-js-layout mdl-layout--fixed-header"> 21 22 <!-- HEADER --> 23 <header class="mdl-layout__header mdl-layout__header--scroll"> 24 <div class="mdl-layout__header-row"> 25 <span class="mdl-layout-title">Crear factura electrónica</span> 26 <div class="mdl-layout-spacer"></div> 27 <span class="mdl-layout--large-screen-only header-attribution"> 28 Con la tecnologÃa de <a href="https://github.com/josemmo/Facturae-PHP" target="_blank">Facturae-PHP</a> 29 </span> 30 </div> 31 </header> 32 <div class="mdl-layout__drawer"> 33 <span class="mdl-layout-title">Facturae Web <small>v1.0.1</small></span> 34 <nav class="mdl-navigation"> 35 <a class="mdl-navigation__link" href="/facturae-web/">Crear factura electrónica</a> 36 <a class="mdl-navigation__link" href="/facturae-web/faq/">Preguntas frecuentes</a> 37 </nav> 38 </div> 39 40 <!-- PAGE CONTENTS --> 41 <main class="mdl-layout__content"> 42 <div class="page-content"><form class="column create-invoice-form"> 43 44 <!-- INVOICE PROPERTIES --> 45 <div class="mdl-grid"> 46 <div class="mdl-cell mdl-cell--12-col"> 47 <div class="mdl-card w-100 mdl-shadow--2dp"> 48 <div class="mdl-card__title mdl-color--accent"> 49 <h2 class="mdl-card__title-text mdl-color-text--white">Datos de la factura</h2> 50 </div> 51 <div class="mdl-card__wrapper max-width-md"> 52 <div class="flex-row"> 53 <div class="flex-col"> 54 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 55 <select class="mdl-textfield__input" type="text" name="invoice[schema]"> 56 <option value="3.2">3.2</option> 57 <option value="3.2.1" selected>3.2.1</option> 58 <option value="3.2.2">3.2.2</option> 59 </select> 60 <label class="mdl-textfield__label">Versión de FacturaE</label> 61 </div> 62 </div> 63 </div> 64 <div class="flex-row"> 65 <div class="flex-col"> 66 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 67 <input class="mdl-textfield__input" type="text" name="invoice[serie]" maxlength="20" required> 68 <label class="mdl-textfield__label">Serie</label> 69 </div> 70 </div> 71 <div class="flex-col flex-ml"> 72 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 73 <input class="mdl-textfield__input" type="text" name="invoice[number]" maxlength="20" required> 74 <label class="mdl-textfield__label">Número</label> 75 </div> 76 </div> 77 </div> 78 <div class="flex-row"> 79 <div class="flex-col"> 80 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 81 <input class="mdl-textfield__input" type="date" name="invoice[issueDate]" required> 82 <label class="mdl-textfield__label">Fecha de la factura</label> 83 </div> 84 </div> 85 <div class="flex-col flex-ml"> 86 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 87 <input class="mdl-textfield__input" type="date" name="invoice[dueDate]"> 88 <label class="mdl-textfield__label">Fecha de vencimiento</label> 89 </div> 90 </div> 91 </div> 92 <div class="flex-row"> 93 <div class="flex-col"> 94 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 95 <input class="mdl-textfield__input" type="date" name="invoice[billingPeriod][start]"> 96 <label class="mdl-textfield__label">Inicio del periodo de fact.</label> 97 </div> 98 </div> 99 <div class="flex-col flex-ml"> 100 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 101 <input class="mdl-textfield__input" type="date" name="invoice[billingPeriod][end]"> 102 <label class="mdl-textfield__label">Fin del periodo de fact.</label> 103 </div> 104 </div> 105 </div> 106 </div> 107 </div> 108 </div> 109 </div> 110 111 <!-- INVOICE PARTIES --> 112 <div class="mdl-grid"> 113 <div class="mdl-cell mdl-cell--6-col"> 114 <div class="mdl-card w-100 mdl-shadow--2dp"> 115 <div class="mdl-card__title mdl-color--accent"> 116 <h2 class="mdl-card__title-text mdl-color-text--white">Datos del emisor</h2> 117 </div> 118 <div class="mdl-card__wrapper"> 119 <div class="flex-row"> 120 <div class="flex-col"> 121 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 122 <input class="mdl-textfield__input" type="text" name="seller[taxNumber]" maxlength="12" required> 123 <label class="mdl-textfield__label">NIF</label> 124 </div> 125 </div> 126 <div class="flex-col flex-fit flex-ml"> 127 <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect"> 128 <input type="checkbox" name="seller[isBusiness]" class="mdl-checkbox__input is-business-checkbox" checked>
129 <span class="mdl-checkbox__label">Es empresa</span> 130 </label> 131 </div> 132 </div> 133 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 134 <input class="mdl-textfield__input" type="text" name="seller[name]" maxlength="80" required> 135 <label class="mdl-textfield__label">Nombre</label> 136 </div> 137 <div class="flex-row d-none" data-business="false"> 138 <div class="flex-col"> 139 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 140 <input class="mdl-textfield__input" type="text" name="seller[firstSurname]" maxlength="40"> 141 <label class="mdl-textfield__label">Primer apellido</label> 142 </div> 143 </div> 144 <div class="flex-col flex-ml"> 145 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 146 <input class="mdl-textfield__input" type="text" name="seller[lastSurname]" maxlength="40"> 147 <label class="mdl-textfield__label">Segundo apellido</label> 148 </div> 149 </div> 150 </div> 151 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 152 <input class="mdl-textfield__input" type="text" name="seller[address]" maxlength="80" required> 153 <label class="mdl-textfield__label">Dirección</label> 154 </div> 155 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 156 <input class="mdl-textfield__input" type="text" name="seller[town]" maxlength="50" required> 157 <label class="mdl-textfield__label">Municipio</label> 158 </div> 159 <div class="flex-row"> 160 <div class="flex-col flex-md"> 161 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 162 <input class="mdl-textfield__input" type="text" name="seller[province]" maxlength="20" required> 163 <label class="mdl-textfield__label">Provincia</label> 164 </div> 165 </div> 166 <div class="flex-col flex-ml"> 167 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 168 <input class="mdl-textfield__input" type="text" name="seller[postCode]" pattern="[0-9]{5}" maxlength="5" required> 169 <label class="mdl-textfield__label">Código postal</label> 170 </div> 171 </div> 172 </div> 173 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 174 <input class="mdl-textfield__input" type="text" name="seller[email]" pattern="(.+)@(.+)\.(.+)" maxlength="60"> 175 <label class="mdl-textfield__label">Correo electrónico</label> 176 </div> 177 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 178 <input class="mdl-textfield__input" type="text" name="seller[website]" maxlength="60"> 179 <label class="mdl-textfield__label">Página web</label> 180 </div> 181 <div class="flex-row"> 182 <div class="flex-col"> 183 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 184 <input class="mdl-textfield__input" type="text" name="seller[phone]" pattern="[0-9]*" maxlength="15"> 185 <label class="mdl-textfield__label">Número de teléfono</label> 186 </div> 187 </div> 188 <div class="flex-col flex-ml"> 189 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 190 <input class="mdl-textfield__input" type="text" name="seller[fax]" pattern="[0-9]*" maxlength="15"> 191 <label class="mdl-textfield__label">Número de fax</label> 192 </div> 193 </div> 194 </div> 195 <div class="flex-row"> 196 <div class="flex-col"> 197 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 198 <input class="mdl-textfield__input" type="text" name="seller[dir3][contable]" pattern="[A-Z0-9]{9}" maxlength="9"> 199 <label class="mdl-textfield__label">Oficina Contable</label> 200 </div> 201 </div> 202 <div class="flex-col flex-ml flex-mr"> 203 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 204 <input class="mdl-textfield__input" type="text" name="seller[dir3][gestor]" pattern="[A-Z0-9]{9}" maxlength="9"> 205 <label class="mdl-textfield__label">Ãrgano gestor</label> 206 </div> 207 </div> 208 <div class="flex-col"> 209 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 210 <input class="mdl-textfield__input" type="text" name="seller[dir3][tramitador]" pattern="[A-Z0-9]{9}" maxlength="9"> 211 <label class="mdl-textfield__label">Ud. tramitadora</label> 212 </div> 213 </div> 214 </div> 215 </div> 216 </div> 217 </div> 218 <div class="mdl-cell mdl-cell--6-col"> 219 <div class="mdl-card w-100 mdl-shadow--2dp"> 220 <div class="mdl-card__title mdl-color--accent"> 221 <h2 class="mdl-card__title-text mdl-color-text--white">Datos del receptor</h2> 222 </div> 223 <div class="mdl-card__wrapper"> 224 <div class="flex-row"> 225 <div class="flex-col"> 226 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 227 <input class="mdl-textfield__input" type="text" name="buyer[taxNumber]" maxlength="12" required> 228 <label class="mdl-textfield__label">NIF</label> 229 </div> 230 </div> 231 <div class="flex-col flex-fit flex-ml"> 232 <label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect"> 233 <input type="checkbox" name="buyer[isBusiness]" class="mdl-checkbox__input is-business-checkbox" checked>
234 <span class="mdl-checkbox__label">Es empresa</span> 235 </label> 236 </div> 237 </div> 238 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 239 <input class="mdl-textfield__input" type="text" name="buyer[name]" maxlength="80" required> 240 <label class="mdl-textfield__label">Nombre</label> 241 </div> 242 <div class="flex-row d-none" data-business="false"> 243 <div class="flex-col"> 244 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 245 <input class="mdl-textfield__input" type="text" name="buyer[firstSurname]" maxlength="40"> 246 <label class="mdl-textfield__label">Primer apellido</label> 247 </div> 248 </div> 249 <div class="flex-col flex-ml"> 250 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 251 <input class="mdl-textfield__input" type="text" name="buyer[lastSurname]" maxlength="40"> 252 <label class="mdl-textfield__label">Segundo apellido</label> 253 </div> 254 </div> 255 </div> 256 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 257 <input class="mdl-textfield__input" type="text" name="buyer[address]" maxlength="80" required> 258 <label class="mdl-textfield__label">Dirección</label> 259 </div> 260 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 261 <input class="mdl-textfield__input" type="text" name="buyer[town]" maxlength="50" required> 262 <label class="mdl-textfield__label">Municipio</label> 263 </div> 264 <div class="flex-row"> 265 <div class="flex-col flex-md"> 266 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 267 <input class="mdl-textfield__input" type="text" name="buyer[province]" maxlength="20" required> 268 <label class="mdl-textfield__label">Provincia</label> 269 </div> 270 </div> 271 <div class="flex-col flex-ml"> 272 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 273 <input class="mdl-textfield__input" type="text" name="buyer[postCode]" pattern="[0-9]{5}" maxlength="5" required> 274 <label class="mdl-textfield__label">Código postal</label> 275 </div> 276 </div> 277 </div> 278 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 279 <input class="mdl-textfield__input" type="text" name="buyer[email]" pattern="(.+)@(.+)\.(.+)" maxlength="60"> 280 <label class="mdl-textfield__label">Correo electrónico</label> 281 </div> 282 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 283 <input class="mdl-textfield__input" type="text" name="buyer[website]" maxlength="60"> 284 <label class="mdl-textfield__label">Página web</label> 285 </div> 286 <div class="flex-row"> 287 <div class="flex-col"> 288 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 289 <input class="mdl-textfield__input" type="text" name="buyer[phone]" pattern="[0-9]*" maxlength="15"> 290 <label class="mdl-textfield__label">Número de teléfono</label> 291 </div> 292 </div> 293 <div class="flex-col flex-ml"> 294 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 295 <input class="mdl-textfield__input" type="text" name="buyer[fax]" pattern="[0-9]*" maxlength="15"> 296 <label class="mdl-textfield__label">Número de fax</label> 297 </div> 298 </div> 299 </div> 300 <div class="flex-row"> 301 <div class="flex-col"> 302 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 303 <input class="mdl-textfield__input" type="text" name="buyer[dir3][contable]" pattern="[A-Z0-9]{9}" maxlength="9"> 304 <label class="mdl-textfield__label">Oficina Contable</label> 305 </div> 306 </div> 307 <div class="flex-col flex-ml flex-mr"> 308 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 309 <input class="mdl-textfield__input" type="text" name="buyer[dir3][gestor]" pattern="[A-Z0-9]{9}" maxlength="9"> 310 <label class="mdl-textfield__label">Ãrgano gestor</label> 311 </div> 312 </div> 313 <div class="flex-col"> 314 <div class="mdl-textfield w-100 mdl-js-textfield mdl-textfield--floating-label"> 315 <input class="mdl-textfield__input" type="text" name="buyer[dir3][tramitador]" pattern="[A-Z0-9]{9}" maxlength="9"> 316 <label class="mdl-textfield__label">Ud. tramitadora</label> 317 </div> 318 </div> 319 </div> 320 </div> 321 </div> 322 </div> 323 </div> 324 325 <!-- INVOICE LINES --> 326 <div class="mdl-grid"> 327 <div class="mdl-cell mdl-cell--12-col"> 328 <table class="mdl-data-table mdl-js-data-table mdl-shadow--2dp w-100 table-lines"> 329 <thead> 330 <tr> 331 <th style="width:120px" class="mdl-data-table__cell--non-numeric">Ref.</th> 332 <th class="mdl-data-table__cell--non-numeric">Concepto</th> 333 <th style="width:120px">Cantidad</th> 334 <th style="width:120px" id="tt1">Precio unitario</th> 335 <th style="width:80px">IVA</th> 336 <th style="width:80px">IRPF</th> 337 <th class="pl-0" style="width:60px"></th> 338 </tr> 339 </thead> 340 <tbody></tbody> 341 <tfoot> 342 <tr> 343 <td colspan="7"> 344 <button type="button" class="mdl-button mdl-js-button mdl-js-ripple-effect btn-add-line">Añadir lÃnea</button> 345 </td> 346 </tr> 347 </tfoot> 348 </table>
349 <span for="tt1" class="mdl-tooltip">Impuestos incluidos</span> 350 </div> 351 </div> 352
352<script class="item-template" type="text/template"> 353 <tr> 354 <td class="mdl-data-table__cell--non-numeric"> 355 <div class="mdl-textfield w-100 mdl-js-textfield"> 356 <input class="mdl-textfield__input" type="text" name="item[{i}][ref]" maxlength="20"> 357 </div> 358 </td> 359 <td class="mdl-data-table__cell--non-numeric"> 360 <div class="mdl-textfield w-100 mdl-js-textfield"> 361 <input class="mdl-textfield__input" type="text" name="item[{i}][name]" maxlength="2500" required> 362 </div> 363 </td> 364 <td> 365 <div class="mdl-textfield w-100 mdl-js-textfield"> 366 <input class="mdl-textfield__input" type="number" name="item[{i}][quantity]" step="0.001" required> 367 </div> 368 </td> 369 <td> 370 <div class="mdl-textfield w-100 mdl-js-textfield"> 371 <input class="mdl-textfield__input" type="number" name="item[{i}][unitPrice]" step="0.000001" required> 372 </div> 373 </td> 374 <td> 375 <div class="mdl-textfield w-100 mdl-js-textfield"> 376 <input class="mdl-textfield__input" type="number" name="item[{i}][iva]" min="0" max="100" required> 377 </div> 378 </td> 379 <td> 380 <div class="mdl-textfield w-100 mdl-js-textfield"> 381 <input class="mdl-textfield__input" type="number" name="item[{i}][irpf]" min="0" max="100"> 382 </div> 383 </td> 384 <td class="pl-0"> 385 <button type="button" title="Eliminar lÃnea" class="mdl-button mdl-js-button mdl-button--icon btn-remove-line"> 386 <i class="material-icons">delete</i> 387 </button> 388 </td> 389 </tr> 390 </script>
390 391 392 <!-- BUTTONS --> 393 <div class="mdl-grid"> 394 <div class="mdl-cell mdl-cell--12-col"> 395 <div class="flex-row"> 396 <div class="flex-col"></div> 397 <div class="flex-col flex-fit"> 398 <button type="submit" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--colored">Generar factura</button> 399 </div> 400 <div class="flex-col flex-fit flex-ml"> 401 <button type="submit" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent sign-invoice">Generar factura y firmar</button> 402 </div> 403 </div> 404 </div> 405 </div> 406 407</form> 408 409 410<!-- @FIRMA DIALOG --> 411<dialog class="mdl-dialog firma-dialog"> 412 <h4 class="mdl-dialog__title">AutoFirma no encontrado</h4> 413 <div class="mdl-dialog__content"> 414 <p>Para poder firmar facturas electrónicas necesita tener instalado el programa AutoFirma del Gobierno de España.</p> 415 </div> 416 <div class="mdl-dialog__actions"> 417 <a href="http://firmaelectronica.gob.es/Home/Descargas.html" target="_blank" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--colored">Descargar AutoFirma</a> 418 <button type="button" class="mdl-button mdl-js-button mdl-js-ripple-effect close">Cerrar mensaje</button> 419 </div> 420 </dialog> 421</div> 422 </main> 423 424 </div> 425 426 <!-- SCRIPTS --> 427
427<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
427 428
428<script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script>
428 429
429<script src="https://cdnjs.cloudflare.com/ajax/libs/dialog-polyfill/0.4.10/dialog-polyfill.min.js"></script>
429 430
430<script src="/facturae-web/js/miniapplet.js"></script>
430 431
431<script src="/facturae-web/js/app.js?v=1.0.1"></script>
vendor: 72 bytes, lines 431-432
431 432 <script async src="https://www.googletagmanager.com/gtag/js?id=
432G-S32EE29N0G
vendor: 20 bytes, lines 432-433
432"></script> 433
433<script>
vendor: 118 bytes, line 433
433window.dataLayer=window.dataLayer||[];function gtag(){dataLayer.push(arguments);}gtag('js',new Date());gtag('config','
433G-S32EE29N0G
vendor: 3 bytes, line 433
433');
433</script>
433 434
434<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"3daabf8ce13f4b70a63cf2b6c37ee7b8","r":1,"spa":2}' crossorigin="anonymous"></script>
434 435</body> 436</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.