voxsoftware/templateemail.vue

## __template__email.vue
<template>
    <html>
        <body>
            <div>

                <b>Estimado <span>{{person.name || ''}}</span> <span>{{person.lastname || ''}}</span></b>
                <div style='height:12px'></div>
                Le enviamos este correo para notificarle que usted tiene obligaciones pendientes en el SRI,
                favor contáctese con su asesor para evitar sanciones.

                <div>
                    <b>Fecha consulta:</b>
                    <span>{{moment.format('DD-MM-YYYY HH:mm')}}</span>
                </div>


                <div>
                    <table class='t01' border='0' spacing='0'>
                        <thead>
                            <tr>
                                <th class='grey lighten-4' style='width:35%'>Mensaje</th>
                                <th class='grey lighten-4' style='width:20%'>Periodo</th>
                                <th class='grey lighten-4' style='width:45%'>Acción</th>
                            </tr>
                        </thead>
                        <tbody v-if='result.Detalle'>
                            <tr v-for='item in result.Detalle'>
                                <td>{{item.Mensaje}}</td>
                                <td>{{item.Período}}</td>
                                <td>{{item.Acción}}</td>
                            </tr>
                        </tbody>
                    </table>
                </div>


                <div class='grey--text footer'>
                    Si ha recibido este mensaje por error, por favor elimínelo y notifique a la empresa.
                    Este comprobante se emitió con su <b>AUTORIZACIÓN</b>. Si tiene alguna inquietud no dude en responder este mensaje con el asunto <b>Ayuda</b>.
                </div>
            </div>
        </body>
    </html>
</template>

<style>
    .t01{
        width: 100%;
        table-layout:fixed;

    }
    .t01 td,.t01 th{
        padding: 0.5em 1em;
        border:solid 1px rgb(220,220,220);
    }
    .grey{
        background-color: grey;
    }
    .grey--text{
        color: grey;
    }
    .grey.lighten-4{
        background-color: rgb(230,230,230);
    }

    .footer{
        padding-top:8px;
        margin-top:8px;
    }

</style>

<script lang='coffeescript'>

    export default (body)->
        vars= body || self.context.body
        return
            data: ()->
                data= Object.assign {}, vars
                data.moment= core.VW.Moment(new Date(data.result.updated || data.result.created))
                return data

</script>
	<template>
	<html>
	<body>
	<div>

	<b>Estimado <span>{{person.name \|\| ''}}</span> <span>{{person.lastname \|\| ''}}</span></b>
	<div style='height:12px'></div>
	Le enviamos este correo para notificarle que usted tiene obligaciones pendientes en el SRI,
	favor contáctese con su asesor para evitar sanciones.

	<div>
	<b>Fecha consulta:</b>
	<span>{{moment.format('DD-MM-YYYY HH:mm')}}</span>
	</div>


	<div>
	<table class='t01' border='0' spacing='0'>
	<thead>
	<tr>
	<th class='grey lighten-4' style='width:35%'>Mensaje</th>
	<th class='grey lighten-4' style='width:20%'>Periodo</th>
	<th class='grey lighten-4' style='width:45%'>Acción</th>
	</tr>
	</thead>
	<tbody v-if='result.Detalle'>
	<tr v-for='item in result.Detalle'>
	<td>{{item.Mensaje}}</td>
	<td>{{item.Período}}</td>
	<td>{{item.Acción}}</td>
	</tr>
	</tbody>
	</table>
	</div>


	<div class='grey--text footer'>
	Si ha recibido este mensaje por error, por favor elimínelo y notifique a la empresa.
	Este comprobante se emitió con su <b>AUTORIZACIÓN</b>. Si tiene alguna inquietud no dude en responder este mensaje con el asunto <b>Ayuda</b>.
	</div>
	</div>
	</body>
	</html>
	</template>

	<style>
	.t01{
	width: 100%;
	table-layout:fixed;

	}
	.t01 td,.t01 th{
	padding: 0.5em 1em;
	border:solid 1px rgb(220,220,220);
	}
	.grey{
	background-color: grey;
	}
	.grey--text{
	color: grey;
	}
	.grey.lighten-4{
	background-color: rgb(230,230,230);
	}

	.footer{
	padding-top:8px;
	margin-top:8px;
	}

	</style>

	<script lang='coffeescript'>

	export default (body)->
	vars= body \|\| self.context.body
	return
	data: ()->
	data= Object.assign {}, vars
	data.moment= core.VW.Moment(new Date(data.result.updated \|\| data.result.created))
	return data

	</script>