show attachments on email templates attachment component
gitea/salix/1466-print_refactor There was a failure building this commit Details

This commit is contained in:
Joan Sanchez 2019-11-07 11:19:05 +01:00
parent 114e8c87d6
commit 5705c37f92
37 changed files with 262 additions and 81 deletions

View File

@ -1456,7 +1456,7 @@ INSERT INTO `vn`.`receipt`(`id`, `invoiceFk`, `amountPaid`, `amountUnpaid`, `pay
(1, 'Cobro web', 100.50, 0.00, CURDATE(), 9, 1, 101, CURDATE(), 442, 1),
(2, 'Cobro web', 200.50, 0.00, DATE_ADD(CURDATE(), INTERVAL -5 DAY), 9, 1, 101, DATE_ADD(CURDATE(), INTERVAL -5 DAY), 442, 1),
(3, 'Cobro en efectivo', 300.00, 100.00, DATE_ADD(CURDATE(), INTERVAL -10 DAY), 9, 1, 102, DATE_ADD(CURDATE(), INTERVAL -10 DAY), 442, 0),
(4, 'Cobro en efectivo', -400.00, -50.00, DATE_ADD(CURDATE(), INTERVAL -15 DAY), 9, 1, 103, DATE_ADD(CURDATE(), INTERVAL -15 DAY), 442, 0);
(4, 'Cobro en efectivo', 400.00, -50.00, DATE_ADD(CURDATE(), INTERVAL -15 DAY), 9, 1, 103, DATE_ADD(CURDATE(), INTERVAL -15 DAY), 442, 0);
INSERT INTO `vn2008`.`workerTeam`(`id`, `team`, `user`)
VALUES

View File

@ -1,4 +1,9 @@
<mg-ajax path="ClientSamples" options="vnPost"></mg-ajax>
<vn-crud-model auto-load="true"
url="Companies"
data="companiesData"
order="code">
</vn-crud-model>
<vn-watcher
vn-id="watcher"
data="$ctrl.clientSample"
@ -24,9 +29,9 @@
label="Sample">
</vn-autocomplete>
<vn-autocomplete vn-one
ng-model="$ctrl.clientSample.companyFk"
ng-model="$ctrl.companyId"
model="ClientSample.companyFk"
url="Companies"
data="companiesData"
show-field="code"
value-field="id"
label="Company"

View File

@ -1,18 +1,16 @@
import ngModule from '../../module';
import Component from 'core/lib/component';
import './style.scss';
class Controller {
constructor($scope, $state, $http, vnApp, $translate, $httpParamSerializer, $window) {
this.$scope = $scope;
this.$state = $state;
this.$stateParams = $state.params;
this.$http = $http;
class Controller extends Component {
constructor($element, $, vnApp, $httpParamSerializer, vnConfig) {
super($element, $);
this.vnApp = vnApp;
this.$translate = $translate;
this.$window = $window;
this.$httpParamSerializer = $httpParamSerializer;
this.vnConfig = vnConfig;
this.clientSample = {
clientFk: this.$stateParams.id
clientFk: this.$params.id,
companyFk: vnConfig.companyFk
};
}
@ -27,8 +25,18 @@ class Controller {
this.clientSample.recipient = value.email;
}
get companyId() {
if (!this.clientSample.companyFk)
this.clientSample.companyFk = this.vnConfig.companyFk;
return this.clientSample.companyFk;
}
set companyId(value) {
this.clientSample.companyFk = value;
}
showPreview() {
let sampleType = this.$scope.sampleType.selection;
let sampleType = this.$.sampleType.selection;
if (!sampleType)
return this.vnApp.showError(this.$translate.instant('Choose a sample'));
@ -37,7 +45,7 @@ class Controller {
return this.vnApp.showError(this.$translate.instant('Choose a company'));
const params = {
clientId: this.$stateParams.id,
clientId: this.$params.id,
recipient: this.clientSample.recipient,
isPreview: true
};
@ -48,7 +56,7 @@ class Controller {
const serializedParams = this.$httpParamSerializer(params);
const query = `email/${sampleType.code}?${serializedParams}`;
this.$http.get(query).then(res => {
this.$scope.showPreview.show();
this.$.showPreview.show();
let dialog = document.body.querySelector('div.vn-dialog');
let body = dialog.querySelector('tpl-body');
let scroll = dialog.querySelector('div:first-child');
@ -59,16 +67,16 @@ class Controller {
}
onSubmit() {
this.$scope.watcher.check();
this.$scope.watcher.realSubmit().then(() =>
this.$.watcher.check();
this.$.watcher.realSubmit().then(() =>
this.sendSample()
);
}
sendSample() {
let sampleType = this.$scope.sampleType.selection;
let sampleType = this.$.sampleType.selection;
let params = {
clientId: this.$stateParams.id,
clientId: this.$params.id,
recipient: this.clientSample.recipient
};
@ -89,7 +97,7 @@ class Controller {
});
}
}
Controller.$inject = ['$scope', '$state', '$http', 'vnApp', '$translate', '$httpParamSerializer', '$window'];
Controller.$inject = ['$element', '$scope', 'vnApp', '$httpParamSerializer', 'vnConfig'];
ngModule.component('vnClientSampleCreate', {
template: require('./index.html'),

View File

@ -34,7 +34,7 @@ module.exports = app => {
const componentDir = path.join(componentsPath, '/', componentName);
const assetsDir = `${componentDir}/assets`;
app.use(`/api/assets/${componentName}`, express.static(assetsDir));
app.use(`/api/${componentName}/assets`, express.static(assetsDir));
});
/**
@ -49,7 +49,7 @@ module.exports = app => {
const templateDir = path.join(templatesPath, '/', directory, '/', templateName);
const assetsDir = `${templateDir}/assets`;
app.use(`/api/assets/${templateName}`, express.static(assetsDir));
app.use(`/api/${templateName}/assets`, express.static(assetsDir));
});
});
};

View File

@ -0,0 +1,8 @@
const Stylesheet = require(`${appPath}/core/stylesheet`);
module.exports = new Stylesheet([
`${appPath}/common/css/layout.css`,
`${appPath}/common/css/email.css`,
`${appPath}/common/css/misc.css`,
`${__dirname}/style.css`])
.mergeStyles();

View File

@ -0,0 +1,59 @@
@media (max-width: 400px) {
.buttons a {
display: block;
width: 100%
}
}
.buttons {
width: 100%
}
.buttons a {
display: inline-block;
box-sizing: border-box;
text-decoration: none;
font-size: 16px;
color: #fff;
width: 50%
}
.buttons .btn {
background-color: #333;
text-align: center
}
.buttons .btn .text {
display: inline-block;
padding: 22px 0
}
.buttons .btn .icon {
background-color: #95d831;
box-sizing: border-box;
text-align: center;
padding: 16.5px 0;
float: right;
width: 70px
}
.networks {
background-color: #555;
text-align: center;
padding: 20px 0
}
.networks a {
text-decoration: none;
margin-right: 5px
}
.networks a img {
margin: 0
}
.privacy {
padding: 20px 0;
font-size: 10px;
font-weight: 100
}

View File

@ -0,0 +1,3 @@
<section v-if="attachment.component">
<a v-bind:href="path" target="_blank">{{attachment.filename}}</a>
</section>

View File

@ -0,0 +1,37 @@
module.exports = {
name: 'attachment',
computed: {
path() {
const filename = this.attachment.filename;
const component = this.attachment.component;
if (this.attachment.cid)
return `/api/${component}/assets/files/${filename}`;
else
return `/api/report/${component}?${this.getHttpParams()}`;
}
},
methods: {
getHttpParams() {
const props = this.args;
let query = '';
for (let param in props) {
if (query != '')
query += '&';
query += `${param}=${props[param]}`;
}
return query;
}
},
props: {
attachment: {
type: Object,
required: true
},
args: {
type: Object,
required: false
}
}
};

View File

@ -1,40 +1,40 @@
<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 v-bind:src="getEmailSrc('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 v-bind:src="getEmailSrc('info.png')"/></span>
</div>
</a>
</section> -->
</section>
<!-- Action button block -->
<!-- Networks block -->
<section class="networks">
<a href="https://www.facebook.com/Verdnatura" target="_blank">
<img :src="getEmailSrc('facebook.png')" alt="Facebook"/>
<img v-bind:src="getEmailSrc('facebook.png')" alt="Facebook"/>
</a>
<a href="https://www.twitter.com/Verdnatura" target="_blank">
<img :src="getEmailSrc('twitter.png')" alt="Twitter"/>
<img v-bind:src="getEmailSrc('twitter.png')" alt="Twitter"/>
</a>
<a href="https://www.youtube.com/Verdnatura" target="_blank">
<img :src="getEmailSrc('youtube.png')" alt="Youtube"/>
<img v-bind:src="getEmailSrc('youtube.png')" alt="Youtube"/>
</a>
<a href="https://www.pinterest.com/Verdnatura" target="_blank">
<img :src="getEmailSrc('pinterest.png')" alt="Pinterest"/>
<img v-bind:src="getEmailSrc('pinterest.png')" alt="Pinterest"/>
</a>
<a href="https://www.instagram.com/Verdnatura" target="_blank">
<img :src="getEmailSrc('instagram.png')" alt="Instagram"/>
<img v-bind:src="getEmailSrc('instagram.png')" alt="Instagram"/>
</a>
<a href="https://www.linkedin.com/company/verdnatura" target="_blank">
<img :src="getEmailSrc('linkedin.png')" alt="Linkedin"/>
<img v-bind:src="getEmailSrc('linkedin.png')" alt="Linkedin"/>
</a>
</section>
<!-- Networks block end -->

View File

@ -7,18 +7,17 @@ const imageSrc = {
let src = `cid:${image}`;
if (this.isPreview === 'true')
src = `/api/assets/${this.$options.name}/images/${image}`;
src = `/api/${this.$options.name}/assets/images/${image}`;
return src;
},
getReportSrc(image) {
const assetsPath = `${config.app.host}/api/assets`;
const imagePath = `${assetsPath}/${this.$options.name}/images/${image}`;
const assetsPath = `${config.app.host}/api/${this.$options.name}`;
const imagePath = `${assetsPath}/assets/images/${image}`;
return imagePath;
}
},
}
};
Vue.mixin(imageSrc);

View File

@ -1 +1,4 @@
[{"filename": "claim-pickup-order.pdf"}]
[{
"filename": "claim-pickup-order.pdf",
"component": "claim-pickup"
}]

View File

@ -20,12 +20,6 @@
<p>{{$t('description.dear')}},</p>
<p>{{$t('description.instructions')}}</p>
<section>
<section v-for="attachment in attachments">
<a href="/api/report/claim-pickup-order?userId=106&claimId=5" target="_blank">Ver PDF</a>
</section>
</section>
</section>
<!-- Footer component -->
<email-footer

View File

@ -1,15 +1,9 @@
const Component = require(`${appPath}/core/component`);
const emailHeader = new Component('email-header');
const emailFooter = new Component('email-footer');
const attachments = require('./attachments.json');
module.exports = {
name: 'claim-pickup-order',
data() {
return {
attachments
};
},
components: {
'email-header': emailHeader.build(),
'email-footer': emailFooter.build()

View File

@ -1,7 +1,7 @@
const Component = require(`${appPath}/core/component`);
const db = require(`${appPath}/core/database`);
const emailHeader = new Component('email-header');
const emailFooter = new Component('email-footer');
const db = require(`${appPath}/core/database`);
module.exports = {
name: 'client-welcome',

View File

@ -1 +1,4 @@
[{"filename": "delivery-note.pdf"}]
[{
"filename": "delivery-note.pdf",
"component": "delivery-note"
}]

View File

@ -1 +1,4 @@
[{"filename": "letter-debtor.pdf"}]
[{
"filename": "letter-debtor.pdf",
"component": "letter-debtor"
}]

View File

@ -53,9 +53,12 @@
</div>
</p>
<section>
<a href="/api/report/letter-debtor?clientId=101&companyId=442" target="_blank">Ver PDF</a>
</section>
<setion v-if="isPreview">
<attachment v-for="attachment in attachments"
v-bind:attachment="attachment"
v-bind:args="$props">
</attachment>
</setion>
</section>
<!-- Footer component -->
<email-footer

View File

@ -1,7 +1,9 @@
const Component = require(`${appPath}/core/component`);
const db = require(`${appPath}/core/database`);
const emailHeader = new Component('email-header');
const emailFooter = new Component('email-footer');
const db = require(`${appPath}/core/database`);
const attachment = new Component('attachment');
const attachments = require('./attachments.json');
module.exports = {
name: 'letter-debtor-nd',
@ -11,6 +13,9 @@ module.exports = {
if (!this.debtor)
throw new Error('Something went wrong');
},
data() {
return {attachments};
},
methods: {
fetchDebtor(clientId, companyId) {
return db.findOne(`
@ -28,7 +33,8 @@ module.exports = {
},
components: {
'email-header': emailHeader.build(),
'email-footer': emailFooter.build()
'email-footer': emailFooter.build(),
'attachment': attachment.build()
},
props: {
clientId: {

View File

@ -1 +1,4 @@
[{"filename": "letter-debtor.pdf"}]
[{
"filename": "letter-debtor.pdf",
"component": "letter-debtor"
}]

View File

@ -35,6 +35,13 @@
</div>
</div>
</p>
<setion v-if="isPreview">
<attachment v-for="attachment in attachments"
v-bind:attachment="attachment"
v-bind:args="$props">
</attachment>
</setion>
</section>
<!-- Footer component -->
<email-footer

View File

@ -1,7 +1,9 @@
const Component = require(`${appPath}/core/component`);
const db = require(`${appPath}/core/database`);
const emailHeader = new Component('email-header');
const emailFooter = new Component('email-footer');
const db = require(`${appPath}/core/database`);
const attachment = new Component('attachment');
const attachments = require('./attachments.json');
module.exports = {
name: 'letter-debtor-st',
@ -11,6 +13,9 @@ module.exports = {
if (!this.debtor)
throw new Error('Something went wrong');
},
data() {
return {attachments};
},
methods: {
fetchDebtor(clientId, companyId) {
return db.findOne(`
@ -28,7 +33,8 @@ module.exports = {
},
components: {
'email-header': emailHeader.build(),
'email-footer': emailFooter.build()
'email-footer': emailFooter.build(),
'attachment': attachment.build()
},
props: {
clientId: {

View File

@ -1,7 +1,7 @@
const Component = require(`${appPath}/core/component`);
const db = require(`${appPath}/core/database`);
const emailHeader = new Component('email-header');
const emailFooter = new Component('email-footer');
const db = require(`${appPath}/core/database`);
module.exports = {
name: 'payment-update',

View File

@ -1,10 +1,12 @@
[{
"filename": "model.ezp",
"component": "printer-setup",
"path": "/assets/files/model.ezp",
"cid": "model.ezp"
},
{
"filename": "port.png",
"component": "printer-setup",
"path": "/assets/files/port.png",
"cid": "port.png"
}]

View File

@ -46,9 +46,16 @@
</section>
<section v-if="client.salesPersonEmail">
{{$t('salesPersonEmail')}}:
<strong><a v-bind:href="`mailto: client.salesPersonEmail`" target="_blank">{{client.salesPersonEmail}}</strong>
<strong><a v-bind:href="`mailto:${client.salesPersonEmail}`" target="_blank">{{client.salesPersonEmail}}</strong>
</section>
</p>
<setion v-if="isPreview">
<attachment v-for="attachment in attachments"
v-bind:attachment="attachment"
v-bind:args="$props">
</attachment>
</setion>
</section>
<!-- Footer component -->
<email-footer

View File

@ -1,13 +1,18 @@
const Component = require(`${appPath}/core/component`);
const db = require(`${appPath}/core/database`);
const emailHeader = new Component('email-header');
const emailFooter = new Component('email-footer');
const db = require(`${appPath}/core/database`);
const attachment = new Component('attachment');
const attachments = require('./attachments.json');
module.exports = {
name: 'printer-setup',
async serverPrefetch() {
this.client = await this.fetchClient(this.clientId);
},
data() {
return {attachments};
},
methods: {
fetchClient(clientId) {
return db.findOne(`
@ -28,7 +33,8 @@ module.exports = {
},
components: {
'email-header': emailHeader.build(),
'email-footer': emailFooter.build()
'email-footer': emailFooter.build(),
'attachment': attachment.build()
},
props: {
clientId: {

View File

@ -1,3 +1,4 @@
[{
"filename": "sepa-core.pdf"
"filename": "sepa-core.pdf",
"component": "sepa-core"
}]

View File

@ -21,6 +21,13 @@
<p>{{$t('description.dear')}},</p>
<p>{{$t('description.instructions')}}</p>
<p>{{$t('description.conclusion')}}</p>
<setion v-if="isPreview">
<attachment v-for="attachment in attachments"
v-bind:attachment="attachment"
v-bind:args="$props">
</attachment>
</setion>
</section>
<!-- Footer component -->
<email-footer

View File

@ -1,11 +1,25 @@
const Component = require(`${appPath}/core/component`);
const emailHeader = new Component('email-header');
const emailFooter = new Component('email-footer');
const attachment = new Component('attachment');
const attachments = require('./attachments.json');
module.exports = {
name: 'sepa-core',
data() {
return {attachments};
},
components: {
'email-header': emailHeader.build(),
'email-footer': emailFooter.build()
'email-footer': emailFooter.build(),
'attachment': attachment.build()
},
props: {
clientId: {
required: true
},
companyId: {
required: true
}
}
};

View File

@ -1,7 +1,7 @@
const Component = require(`${appPath}/core/component`);
const db = require(`${appPath}/core/database`);
const reportHeader = new Component('report-header');
const reportFooter = new Component('report-footer');
const db = require(`${appPath}/core/database`);
module.exports = {
name: 'claim-pickup-order',

View File

@ -1,8 +1,8 @@
const config = require(`${appPath}/core/config`);
const db = require(`${appPath}/core/database`);
const Component = require(`${appPath}/core/component`);
const reportHeader = new Component('report-header');
const reportFooter = new Component('report-footer');
const db = require(`${appPath}/core/database`);
const md5 = require('md5');
module.exports = {

View File

@ -1,7 +1,7 @@
const Component = require(`${appPath}/core/component`);
const db = require(`${appPath}/core/database`);
const reportHeader = new Component('report-header');
const reportFooter = new Component('report-footer');
const db = require(`${appPath}/core/database`);
module.exports = {
name: 'driver-route',

View File

@ -1,7 +1,7 @@
const Component = require(`${appPath}/core/component`);
const db = require(`${appPath}/core/database`);
const reportHeader = new Component('report-header');
const reportFooter = new Component('report-footer');
const db = require(`${appPath}/core/database`);
const qrcode = require('qrcode');
module.exports = {

View File

@ -1,7 +1,7 @@
const Component = require(`${appPath}/core/component`);
const db = require(`${appPath}/core/database`);
const reportHeader = new Component('report-header');
const reportFooter = new Component('report-footer');
const db = require(`${appPath}/core/database`);
module.exports = {
name: 'letter-debtor',
@ -41,7 +41,10 @@ module.exports = {
},
fetchSales(clientId, companyId) {
return db.find(
`CALL vn.clientGetDebtDiary(?, ?)`, [clientId, companyId]).then(rows => {
`CALL vn.clientGetDebtDiary(:clientId, :companyId)`, {
clientId: clientId,
companyId: companyId,
}).then(rows => {
return rows[0];
});
},

View File

@ -1,7 +1,7 @@
const Component = require(`${appPath}/core/component`);
const db = require(`${appPath}/core/database`);
const reportHeader = new Component('report-header');
const reportFooter = new Component('report-footer');
const db = require(`${appPath}/core/database`);
module.exports = {
name: 'receipt',

View File

@ -1,9 +1,9 @@
<!DOCTYPE html>
<html lang="es">
<html v-bind:lang="locale">
<body>
<section class="container">
<!-- Header component -->
<report-header :locale="locale"></report-header>
<report-header v-bind:locale="locale"></report-header>
<!-- End header component -->
<section class="main">
<h1 class="title centered">{{$t('title')}}</h1>
@ -150,9 +150,9 @@
</section>
<!-- Footer component -->
<report-footer id="pageFooter"
:left-text="$t('order', [supplier.mandateCode])"
:center-text="client.socialName"
:locale="locale">
v-bind:left-text="$t('order', [supplier.mandateCode])"
v-bind:center-text="client.socialName"
v-bind:locale="locale">
</report-footer>
<!-- End footer component -->
</section>

View File

@ -1,7 +1,7 @@
const Component = require(`${appPath}/core/component`);
const db = require(`${appPath}/core/database`);
const reportHeader = new Component('report-header');
const reportFooter = new Component('report-footer');
const db = require(`${appPath}/core/database`);
const rptSepaCore = {
name: 'sepa-core',

View File

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="es">
<html v-bind:lang="locale">
<body>
<section class="container" id="report">
<section class="main">