67 lines
3.3 KiB
JavaScript
67 lines
3.3 KiB
JavaScript
/**
|
|
* Component to render data for site sheet
|
|
* @class SiteSheet
|
|
*/
|
|
export class SiteSheet {
|
|
/**
|
|
* @param {object} data
|
|
*/
|
|
set siteData(data) {
|
|
this._siteData = data;
|
|
}
|
|
|
|
render() {
|
|
return `<div class="container has-bottom-border">
|
|
<table class="table is-fullwidth is-striped">
|
|
<tr class="is-link"><th class="is-size-5 has-text-centered" colspan=2>Identificazione</th></tr>
|
|
<tr><th>Denominazione</th><td>${this._siteData.denomination}</td></tr>
|
|
<tr><th>Definizione</th><td>${this._siteData.definition}</td></tr>
|
|
<tr class="is-link"><th class="is-size-5 has-text-centered" colspan=2>Localizzazione geografico-amministrativa</th></tr>
|
|
<tr><th>Comune</th><td>${this._siteData.municipality}</td></tr>
|
|
<tr><th>Indirizzo</th><td>${this._siteData.address}</td></tr>
|
|
<tr><th>Località</th><td>${this._siteData.place}</td></tr>
|
|
<tr><th>Localizzazione</th><td>${this._siteData.localization}</td></tr>
|
|
<tr class="is-link"><th class="is-size-5 has-text-centered" colspan=2>Cronologia</th></tr>
|
|
<tr><th>Periodo</th><td>${this._siteData.period}</td></tr>
|
|
<tr><th>Fase</th><td>${this._siteData.phase}</td></tr>
|
|
<tr><th>Cronologia</th><td>${this._siteData.chronology}</td></tr>
|
|
<tr><th>Motivazione cronologia</th><td>${this._siteData.motivation}</td></tr>
|
|
<tr class="is-link"><th class="is-size-5 has-text-centered" colspan=2>Conservazione e condizione giuridica</th></tr>
|
|
<tr><th>Stato di conservazione</th><td>${this._siteData.conservationState}</td></tr>
|
|
<tr class="is-link"><th class="is-size-5 has-text-centered" colspan=2>Ritrovamento e materiali</th></tr>
|
|
<tr><th>Anno di ritrovamento</th><td>${this._siteData.finding}</td></tr>
|
|
<tr><th>Materiali rinvenuti</th><td>${this._siteData.materials}</td></tr>
|
|
<tr><th>Luogo custodia materiali</th><td>${this._siteData.conservationPlace}</td></tr>
|
|
<tr class="is-link"><th class="is-size-5 has-text-centered" colspan=2>Descrizione</th></tr>
|
|
<tr><td class="pr-6 pl-6 pt-3" colspan="2">${this._siteData.description}</td></tr>
|
|
</table>
|
|
</div>`;
|
|
}
|
|
|
|
renderShort() {
|
|
return `
|
|
<div class="container ml-3">
|
|
<p class="p-2">
|
|
<span class="icon has-text-link">
|
|
<i class="fa fa-tag"></i>
|
|
</span>
|
|
<strong>Denominazione:</strong> ${this._siteData.denomination}
|
|
</p>
|
|
<p class="p-2">
|
|
<span class="icon has-text-link">
|
|
<i class="fa fa-hourglass"></i>
|
|
</span>
|
|
<strong>Periodo:</strong> ${this._siteData.period}
|
|
</p>
|
|
<p class="p-2">
|
|
<span class="icon has-text-link">
|
|
<i class="fa fa-map"></i>
|
|
</span>
|
|
<strong>Località generica:</strong> ${this._siteData.genericPlace}
|
|
</p>
|
|
<p class="mt-4 pl-2 pr-5">
|
|
${this._siteData.shortDescription}
|
|
</p>
|
|
</div>`;
|
|
}
|
|
} |