plantilla claim-pickup #1044

modules/claim/front/descriptor/index.js

@@ -48,10 +48,10 @@ class Controller {
 
     returnDialog(response) {
         if (response === 'CANCEL') {
-            let url = `/report/rpt-claim-pickup-order?claimFk=${this.claim.id}`;
+            let url = `/api/report/rpt-claim-pickup-order?claimFk=${this.claim.id}`;
             window.open(url);
         } else if (response === 'ACCEPT') {
-            this.$http.post(`/email/claim-pickup-order`, {claimFk: this.claim.id}).then(
+            this.$http.post(`/api/email/claim-pickup-order`, {claimFk: this.claim.id}).then(
                 () => this.vnApp.showMessage(this.$translate.instant('Notification sent!'))
             );
         }

print/common/css/layout.css

@@ -120,8 +120,7 @@
     font-weight: bold
 }
 
-
-.grid .row.inline > div {
+.grid .row.inline > section {
     float: left;
 }
 
@@ -129,11 +128,13 @@
     border: 1px solid #DDD;
     margin-bottom: 10px;
     position: relative;
-    padding:10px
+    padding:20px
 }
 
 .panel .header {
-    font-weight: bold
+    background-color: #FFF;
+    font-weight: bold;
+    margin-top: -20px
 }
 
 .box {

print/common/css/misc.css

@@ -0,0 +1,15 @@
+.uppercase {
+    text-transform: uppercase
+}
+
+.centered {
+    text-align: center
+}
+
+.number {
+    text-align: right
+}
+
+.gray {
+    color: #555
+}

print/lib/emailEngine.js

@@ -88,7 +88,7 @@ module.exports = {
                 const componentPath = `${this.path}/${orgComponent.name}`;
                 let fileSrc = componentPath + file;
 
-                if (file.slice(0, 4) === 'http' || file.slice(0, 4) === 'https')
+                if (file.slice(0, 4) === 'http' || file.slice(0, 5) === 'https')
                     fileSrc = file;
 
                 const fileName = file.split('/').pop();

print/lib/router.js

@@ -14,7 +14,7 @@ module.exports = app => {
     function registerReport(name) {
         if (!name) throw new Error('Report name required');
 
-        app.get(`/report/${name}`, (request, response, next) => {
+        app.get(`/api/report/${name}`, (request, response, next) => {
             reportEngine.toPdf(name, request).then(stream => {
                 response.setHeader('Content-Disposition', `attachment; filename="${name}.pdf"`);
                 response.setHeader('Content-type', 'application/pdf');
@@ -33,7 +33,7 @@ module.exports = app => {
     function registerEmail(name) {
         if (!name) throw new Error('Email name required');
 
-        app.get(`/email/${name}`, (request, response, next) => {
+        app.get(`/api/email/${name}`, (request, response, next) => {
             emailEngine.render(name, request).then(rendered => {
                 response.send(rendered.html);
             }).catch(e => {
@@ -41,7 +41,7 @@ module.exports = app => {
             });
         });
 
-        app.post(`/email/${name}`, (request, response, next) => {
+        app.post(`/api/email/${name}`, (request, response, next) => {
             emailEngine.toEmail(name, request).then(() => {
                 response.status(200).json({status: 200});
             }).catch(e => {
@@ -60,6 +60,6 @@ module.exports = app => {
             registerReport(route.name);
 
         const staticPath = this.path + `/${route.name}/assets`;
-        app.use(`/assets`, express.static(staticPath));
+        app.use(`/api/assets`, express.static(staticPath));
     });
 };

print/report/email-footer/assets/css/style.css

@@ -1,34 +1,39 @@
+@media (max-width: 400px) {
+    .buttons a {
+        display: block;
+        width: 100%
+    }
+}
+
 .buttons {
-    background-color: #FFF;
-    text-align: center;
     width: 100%
 }
 
 .buttons a {
+    display: inline-block;
+    box-sizing: border-box;
     text-decoration: none;
-    font-size: 18px;
-    color: #fff
+    font-size: 16px;
+    color: #fff;
+    width: 50%
 }
 
 .buttons .btn {
     background-color: #333;
-    min-width: 300px;
-    height: 72px;
-    display: inline-block;
     text-align: center
 }
 
 .buttons .btn .text {
     display: inline-block;
-    padding-top: 22px
+    padding: 22px 0
 }
 
 .buttons .btn .icon {
     background-color: #95d831;
+    box-sizing: border-box;
     text-align: center;
-    padding-top: 22px;
+    padding: 16.5px 0;
     float: right;
-    height: 50px;
     width: 70px
 }
 

print/report/email-footer/index.html

@@ -1,16 +1,16 @@
 <footer>
     <!-- Action button block -->
-    <!-- <section class="buttons">
+<!--     <section class="buttons">
         <a href="https://www.verdnatura.es" target="_blank">
             <div class="btn">
                 <span class="text">{{ $t('buttons.webAcccess')}}</span>
-                <span class="icon"><img src="/assets/images/action.png"/></span>
+                <span class="icon"><img :src="embeded['/assets/images/action.png']"/></span>
             </div>
         </a>
         <a href="https://goo.gl/forms/j8WSL151ZW6QtlT72" target="_blank">
             <div class="btn">
                 <span class="text">{{ $t('buttons.info')}}</span>
-                <span class="icon"><img src="/assets/images/info.png"/></span>
+                <span class="icon"><img :src="embeded['/assets/images/info.png']"/></span>
             </div>
         </a>
     </section> -->

print/report/email-footer/index.js

@@ -8,7 +8,7 @@ module.exports = {
     created() {
         const embeded = [];
         this.files.map(file => {
-            const src = this.isPreview ? file : `cid:${file}`;
+            const src = this.isPreview ? `/api/${file}` : `cid:${file}`;
             embeded[file] = src;
         });
         this.embeded = embeded;
@@ -16,6 +16,8 @@ module.exports = {
     data() {
         return {
             files: [
+                '/assets/images/action.png',
+                '/assets/images/info.png',
                 '/assets/images/facebook.png',
                 '/assets/images/twitter.png',
                 '/assets/images/youtube.png',

print/report/email-footer/locale.js

@@ -8,12 +8,15 @@ module.exports = {
             privacy: {
                 fiscalAddress: 'VERDNATURA LEVANTE SL, B97367486 Avda. Espioca, 100, 46460 Silla · www.verdnatura.es · clientes@verdnatura.es',
                 disclaimer: `- AVISO - Este mensaje es privado y confidencial, y debe ser utilizado 
-                    exclusivamente por la persona destinataria del mismo. Si usted ha recibido este mensaje 
-                    por error, le rogamos lo comunique al remitente y borre dicho mensaje y cualquier documento 
+                    exclusivamente por la persona destinataria del mismo. Si has recibido este mensaje 
+                    por error, te rogamos lo comuniques al remitente y borres dicho mensaje y cualquier documento 
                     adjunto que pudiera contener. Verdnatura Levante SL no renuncia a la confidencialidad ni a 
                     ningún privilegio por causa de transmisión errónea o mal funcionamiento. Igualmente no se hace 
                     responsable de los cambios, alteraciones, errores u omisiones que pudieran hacerse al mensaje una vez enviado.`,
-                law: 'En cumplimiento de lo dispuesto en la Ley Orgánica 15/1999, de Protección de Datos de Carácter Personal, le comunicamos que los datos personales que facilite se incluirán en ficheros automatizados de VERDNATURA LEVANTE S.L., pudiendo en todo momento ejercitar los derechos de acceso, rectificación, cancelación y oposición, comunicándolo por escrito al domicilio social de la entidad. La finalidad del fichero es la gestión administrativa, contabilidad, y facturación.',
+                law: `En cumplimiento de lo dispuesto en la Ley Orgánica 15/1999, de Protección de Datos de Carácter Personal, 
+                    te comunicamos que los datos personales que facilites se incluirán en ficheros automatizados de VERDNATURA LEVANTE S.L., 
+                    pudiendo en todo momento ejercitar los derechos de acceso, rectificación, cancelación y oposición, comunicándolo por 
+                    escrito al domicilio social de la entidad. La finalidad del fichero es la gestión administrativa, contabilidad, y facturación.`,
             },
         },
     },

print/report/email-header/index.js

@@ -8,7 +8,7 @@ module.exports = {
     created() {
         const embeded = [];
         this.files.map(file => {
-            const src = this.isPreview ? file : `cid:${file}`;
+            const src = this.isPreview ? `/api/${file}` : `cid:${file}`;
             embeded[file] = src;
         });
         this.embeded = embeded;

print/report/report-footer/assets/css/index.js

@@ -1,4 +1,6 @@
 const CssReader = require(`${appPath}/lib/cssReader`);
 
-module.exports = new CssReader([`${__dirname}/style.css`])
+module.exports = new CssReader([
+    `${__dirname}/style.css`,
+    `${appPath}/common/css/misc.css`])
     .mergeStyles();

print/report/report-footer/assets/css/style.css

@@ -1,6 +1,9 @@
 footer {
+    font-family: verdana, sans-serif;
     margin-top: 30px;
-    color: #555
+    font-size: 12px;
+    color: #555;
+    zoom: 0.55
 }
 
 footer, footer p {

print/report/report-footer/index.html

@@ -1,9 +1,9 @@
 <footer>
     <section class="page">
         <section :if="leftText">{{leftText}}</section>
-        <section :if="centerText">{{centerText}}</section>
+        <section :if="centerText" class="uppercase">{{centerText}}</section>
         <section class="number">{{$t('numPages')}}</section>
     </section>
-    <p>{{$t('law.phytosanitary')}}</p>
-    <p>{{$t('law.privacy')}}</p>
+    <p class="phytosanitary">{{$t('law.phytosanitary')}}</p>
+    <p v-html="$t('law.privacy')"></p>
 </footer>

print/report/report-footer/locale.js

@@ -7,8 +7,8 @@ module.exports = {
                 privacy: `En cumplimiento de lo dispuesto en la Ley Orgánica 15/1999, de Protección de Datos de Carácter Personal, 
                     le comunicamos que los datos personales que facilite se incluirán en ficheros automatizados de VERDNATURA LEVANTE S.L., 
                     pudiendo en todo momento ejercitar los derechos de acceso, rectificación, cancelación y oposición, comunicándolo 
-                    por escrito al domicilio social de la entidad. La finalidad del fichero 
-                    es la gestión administrativa, contabilidad, y facturación.`,
+                    por escrito al domicilio social de la entidad. <br/> 
+                    La finalidad del fichero es la gestión administrativa, contabilidad, y facturación.`,
             }
         },
     },

print/report/rpt-claim-pickup-order/assets/css/index.js

@@ -2,5 +2,6 @@ const CssReader = require(`${appPath}/lib/cssReader`);
 
 module.exports = new CssReader([
     `${appPath}/common/css/layout.css`,
+    `${appPath}/common/css/misc.css`,
     `${__dirname}/style.css`])
     .mergeStyles();

print/report/rpt-claim-pickup-order/assets/css/style.css

@@ -1,3 +1,10 @@
 .container {
     color: #000
+}
+
+.title {
+    font-weight: 100;
+    margin-top: 0;
+    margin-bottom: 20px;
+    font-size: 2em
 }

print/report/rpt-claim-pickup-order/index.html

@@ -4,69 +4,69 @@
         <section class="container">
             <report-header></report-header>
             <section class="main">
-                <div class="columns">
-                    <div class="size50">
-                        <div class="size75">
-                            <h1 style="margin-top:0" class="font extraLarge" style="font-weight: 100">{{$t('title')}}</h1>
-                            <div class="row inline font normal">
-                                <div class="text font gray">{{$t('claimId')}}:</div>
-                                <div class="control">{{claimId}}</div>
-                            </div>
-                            <div class="row inline font normal">
-                                <div class="text font gray">{{$t('clientId')}}:</div>
-                                <div class="control">{{clientId}}</div>
-                            </div>
-                            <div class="row inline font normal">
-                                <div class="text font gray">{{$t('date')}}:</div>
-                                <div class="control">{{dated()}}</div>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="size50">
-                        <div class="panel">
-                            <div class="header">{{$t('clientData')}}</div>
+                <section class="columns">
+                    <section class="size50">
+                        <section class="size75">
+                            <h1 style="margin-top:0" class="title">{{$t('title')}}</h1>
+                            <section class="row inline small">
+                                <section class="text uppercase gray">{{$t('claimId')}}:</section>
+                                <section class="control">{{claimId}}</section>
+                            </section>
+                            <section class="row inline small">
+                                <section class="text uppercase gray">{{$t('clientId')}}:</section>
+                                <section class="control">{{clientId}}</section>
+                            </section>
+                            <section class="row inline small">
+                                <section class="text uppercase gray">{{$t('date')}}:</section>
+                                <section class="control">{{dated()}}</section>
+                            </section>
+                        </section>
+                    </section>
+                    <section class="size50">
+                        <section class="panel">
+                            <section class="header">{{$t('clientData')}}</section>
                             <p>
-                                <strong>{{clientName}}</strong>
+                                <strong class="uppercase">{{clientName}}</strong>
                             </p>
-                            <div>
+                            <section>
                                 {{street}}
-                            </div>
-                            <div>
+                            </section>
+                            <section>
                                 {{postcode}}, {{city}} ({{province}})
-                            </div>
-                            <div>
+                            </section>
+                            <section>
                                 {{country}}
-                            </div>
-                        </div>
-                    </div>
-                </div>
+                            </section>
+                        </section>
+                    </section>
+                </section>
                     
-                <div class="grid" style="margin-top:20px">
-                    <div class="row header inline">
-                        <div style="width: 15%">{{$t('quantity')}}</div>
-                        <div style="width: 15%">{{$t('claims')}}</div>
-                        <div style="width: 20%">{{$t('reference')}}</div>
-                        <div style="width: 50%">{{$t('concept')}}</div>
-                    </div>
-                    <div class="row inline" v-for="sale in sales">
-                        <div class="font bold" style="width: 15%">{{sale.quantity}}&nbsp;</div>
-                        <div class="font bold" style="width: 15%">{{sale.claimQuantity}}&nbsp;</div>
-                        <div class="font bold" style="width: 20%">{{sale.id}}&nbsp;</div>
-                        <div class="font bold" style="width: 50%">{{sale.concept}}&nbsp;</div>
-                    </div>
-                </div>
+                <section class="grid" style="margin-top:20px">
+                    <section class="row header inline">
+                        <section style="width: 15%">{{$t('quantity')}}</section>
+                        <section style="width: 15%">{{$t('claims')}}</section>
+                        <section style="width: 20%">{{$t('reference')}}</section>
+                        <section style="width: 50%">{{$t('concept')}}</section>
+                    </section>
+                    <section class="row inline" v-for="sale in sales">
+                        <section class="number" style="width: 15%">{{sale.quantity}}&nbsp;</section>
+                        <section class="number" style="width: 15%">{{sale.claimQuantity}}&nbsp;</section>
+                        <section style="width: 20%">{{sale.id}}&nbsp;</section>
+                        <section style="width: 50%">{{sale.concept}}&nbsp;</section>
+                    </section>
+                </section>
 
-                <div class="columns" style="margin-top: 50px">
-                    <div class="size25">&nbsp;</div>
-                    <div class="size50">
-                        <div class="panel" style="height: 150px">
-                            <div style="text-align: center">
+                <section class="columns" style="margin-top: 50px">
+                    <section class="size25">&nbsp;</section>
+                    <section class="size50">
+                        <section class="panel" style="height: 150px">
+                            <section class="centered">
                                 <h3>{{clientName}}</h3>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="size25">&nbsp;</div>
-                </div>
+                            </section>
+                        </section>
+                    </section>
+                    <section class="size25">&nbsp;</section>
+                </section>
                 <p v-html="$t('sections.agency.description')"></p>
             </section>
 

print/report/rpt-claim-pickup-order/locale.js

@@ -13,7 +13,7 @@ module.exports = {
             claim: 'Reclamación {0}',
             sections: {
                 agency: {
-                    description: `Para agilizar su recogida, por favor, póngase en contacto con la oficina de integrados. <br/>
+                    description: `Para agilizar tu recogida, por favor, pónte en contacto con la oficina de integrados. <br/>
                         Tlf: 96 166 77 88 - Ana Gómez <em>(agomezf@integra2.es)</em>`
                 }
             }