Pārlūkot izejas kodu

Split sections into seperate template files

Split comparison, summary, and header sections into seperate files to
reuse headers more easily and make future changes easier.
master
Immanuel Onyeka pirms 1 gada
vecāks
revīzija
bf0a017836
5 mainītis faili ar 161 papildinājumiem un 136 dzēšanām
  1. +4
    -1
      skouter.go
  2. +2
    -131
      views/report/comparison.tpl
  3. +46
    -0
      views/report/header.tpl
  4. +40
    -4
      views/report/master.tpl
  5. +69
    -0
      views/report/summary.tpl

+ 4
- 1
skouter.go Parādīt failu

@@ -223,7 +223,10 @@ func cachePdf(name string) Page {
}
fm := template.FuncMap{ "dollars": dollars, "diff": diff }
var p = []string{"views/report/master.tpl", paths[name]}
var p = []string{"views/report/master.tpl",
"views/report/header.tpl",
"views/report/summary.tpl",
"views/report/comparison.tpl"}
tpl := template.Must(template.New("master.tpl").Funcs(fm).ParseFiles(p...))
return Page{ tpl: tpl, Title: "", Name: name }


+ 2
- 131
views/report/comparison.tpl Parādīt failu

@@ -1,138 +1,9 @@
{{define "header"}}
{{end}}

{{define "main"}}
<div id="pdf-doc">
<div class="disclaimer"><p>Actual costs may vary from estimates after approval. Get an official quote before choosing a loan.</p></div>

<header class="heading">

<img src="data:image/png;base64,{{.Letterhead}}" />

<div>
<div class="user-info">
<h4>{{.User.FirstName}} {{.User.LastName}}</h4>
<span>{{.User.Email}}</span>
<span>{{.User.Phone}}</span>
<small>{{.User.Address.Street}}</small>
<small>
{{.User.Address.City}}, {{.User.Address.Region}} {{.User.Address.Zip}}
</small>
</div>
<img src="data:image/png;base64,{{.Avatar}}" />
</div>

</header>

<table>
<thead><tr>
<th></th>{{range $l := .Estimate.Loans}}<th>{{$l.Name}}</th>{{end}}
</tr></thead>

<tbody>
<tr><td>Type</td>
{{range .Estimate.Loans}}<td>{{.Type.Name}}</td>{{end}}</tr>
<tr><td>Term</td>
{{range .Estimate.Loans}}<td>{{.Term}} Years</td>{{end}}</tr>
<tr><td>Amortization</td>
{{range .Estimate.Loans}}<td>{{.Amortization}}</td>{{end}}</tr>
<tr><td>Interest rate</td>
{{range .Estimate.Loans}}<td>{{.Interest}}%</td>{{end}}</tr>
<tr><td>Monthly MI</td>
{{range .Estimate.Loans}}<td>${{dollars .Mi.Premium}}/month</td>{{end}}</tr>
<tr><td>Real estate taxes</td>
{{range .Estimate.Loans}}<td>${{dollars .Tax}}</td>{{end}}</tr>
<tr class="total"><td>Total monthly payment</td>
{{range .Estimate.Loans}}<td>${{dollars .Result.TotalMonthly}}</td>{{end}}</tr>
<tr class="gap"></tr>
<tr><td>Purchase price</td>
{{range .Estimate.Loans}}<td>${{dollars $.Estimate.Price}}</td>{{end}}</tr>
<tr><td>Loan amount</td>
{{range .Estimate.Loans}}<td>${{dollars .Amount}}</td>{{end}}</tr>
<tr><td>Down payment</td>
{{range .Estimate.Loans}}<td>${{diff .Amount $.Estimate.Price}}</td>{{end}}</tr>
<tr><td>Closing costs</td>
{{range .Estimate.Loans}}<td>${{dollars .Result.TotalFees}}</td>{{end}}</tr>
<tr><td>MI Premium</td>
{{range .Estimate.Loans}}<td>${{.Mi.Upfront}}</td>{{end}}</tr>
<tr><td>Credits</td>
{{range .Estimate.Loans}}<td>${{dollars .Result.TotalCredits}}</td>{{end}}</tr>
</tbody>
</table>

<div class="break"></div>

<section class="summary">
{{define "comparison"}}
<section class="comparison">
<div class="box">
hello
</div>
</section>

<style scoped>
#pdf-doc {
margin: 4px 30px;
}

.disclaimer {
font-weight: bold;
border-bottom: 1px solid lightgrey;
margin-bottom: 20px;
color: var(--text);
text-align: center;
}

.disclaimer p {
margin: 5px 0;
}

h4 {
margin: 4px 0;
}

header.heading {
display: flex;
justify-content: space-between;
}

.user-info {
display: flex;
flex-flow: column;
}

#pdf-doc header.heading > div {
display: flex;
text-align: right;
}

header.heading .user-info {
margin-right: 8px;
}

table {
width: 100%;
margin-top: 20px;
}

tr.gap {
height: 20px;
}

table td:first-child {
font-weight: bold;
}

tbody tr:nth-child(odd) {
background: #F5F5F3;
}

table td {
padding: 4px;
}

div.break {
page-break-after: always;
}
</style>
{{end}}



+ 46
- 0
views/report/header.tpl Parādīt failu

@@ -0,0 +1,46 @@
{{define "header"}}
<header class="heading">

<img src="data:image/png;base64,{{.Letterhead}}" />

<div>
<div class="user-info">
<h4>{{.User.FirstName}} {{.User.LastName}}</h4>
<span>{{.User.Email}}</span>
<span>{{.User.Phone}}</span>
<small>{{.User.Address.Street}}</small>
<small>
{{.User.Address.City}}, {{.User.Address.Region}} {{.User.Address.Zip}}
</small>
</div>
<img src="data:image/png;base64,{{.Avatar}}" />
</div>

</header>

<style scoped>
h4 {
margin: 4px 0;
}

header.heading > div {
display: flex;
text-align: right;
}

header.heading .user-info {
margin-right: 8px;
}


header.heading {
display: flex;
justify-content: space-between;
}

.user-info {
display: flex;
flex-flow: column;
}
</style>
{{end}}

+ 40
- 4
views/report/master.tpl Parādīt failu

@@ -5,9 +5,45 @@
content="width=device-width, initial-scale=1, shrink-to-fit=no">
</head>

<body>
{{block "header" .}}
{{end}}
<body id="pdf-doc">

{{template "main" .}}
<div class="disclaimer">
<p>Actual costs may vary from estimates after approval.
Get an official quote before choosing a loan.</p>
</div>
{{template "header" .}}
{{template "summary" .}}

<div class="break"></div>

<div class="disclaimer">
<p>Actual costs may vary from estimates after approval.
Get an official quote before choosing a loan.</p>
</div>
{{template "header" .}}
{{template "comparison" .}}

<div class="break"></div>
</body>

<style>
#pdf-doc {
margin: 0px 30px;
}

.disclaimer {
font-weight: bold;
border-bottom: 1px solid lightgrey;
margin-bottom: 20px;
color: var(--text);
text-align: center;
}

.disclaimer p {
margin: 5px 0;
}

div.break {
page-break-after: always;
}
</style>

+ 69
- 0
views/report/summary.tpl Parādīt failu

@@ -0,0 +1,69 @@
{{define "summary"}}
<section id="summary">
<table>
<thead><tr>
<th></th>{{range $l := .Estimate.Loans}}<th>{{$l.Name}}</th>{{end}}
</tr></thead>

<tbody>
<tr><td>Type</td>
{{range .Estimate.Loans}}<td>{{.Type.Name}}</td>{{end}}</tr>
<tr><td>Term</td>
{{range .Estimate.Loans}}<td>{{.Term}} Years</td>{{end}}</tr>
<tr><td>Amortization</td>
{{range .Estimate.Loans}}<td>{{.Amortization}}</td>{{end}}</tr>
<tr><td>Interest rate</td>
{{range .Estimate.Loans}}<td>{{.Interest}}%</td>{{end}}</tr>
<tr><td>Monthly MI</td>
{{range .Estimate.Loans}}<td>${{dollars .Mi.Premium}}/month</td>{{end}}</tr>
<tr><td>Real estate taxes</td>
{{range .Estimate.Loans}}<td>${{dollars .Tax}}/month</td>{{end}}</tr>
<tr class="total"><td>Total monthly</td>
{{range .Estimate.Loans}}<td>${{dollars .Result.TotalMonthly}}</td>{{end}}</tr>
<tr class="gap"></tr>
<tr><td>Purchase price</td>
{{range .Estimate.Loans}}<td>${{dollars $.Estimate.Price}}</td>{{end}}</tr>
<tr><td>Loan amount</td>
{{range .Estimate.Loans}}<td>${{dollars .Amount}}</td>{{end}}</tr>
<tr><td>Down payment</td>
{{range .Estimate.Loans}}<td>${{diff .Amount $.Estimate.Price}}</td>{{end}}</tr>
<tr><td>Closing costs</td>
{{range .Estimate.Loans}}<td>${{dollars .Result.TotalFees}}</td>{{end}}</tr>
<tr><td>MI Premium</td>
{{range .Estimate.Loans}}<td>${{.Mi.Upfront}}</td>{{end}}</tr>
<tr><td>Credits</td>
{{range .Estimate.Loans}}<td>${{dollars .Result.TotalCredits}}</td>{{end}}</tr>
<tr class="total"><td>Cash to close</td>
{{range .Estimate.Loans}}<td>${{dollars .Result.CashToClose}}</td>{{end}}</tr>
</tbody>
</table>
</section>

<style scoped>
table {
width: 100%;
margin-top: 20px;
}

tr.gap {
height: 20px;
}

tr.total {
text-decoration: underline;
font-weight: bold;
}

table td:first-child {
font-weight: bold;
}

tbody tr:nth-child(odd) {
background: #F5F5F3;
}

table td {
padding: 4px;
}
</style>
{{end}}

Notiek ielāde…
Atcelt
Saglabāt