vcalame/jsHtml2Ods
1
0
Fork 0
Code Issues Pull Requests Projects Releases 2 Wiki Activity

Démo basé sur le fichier compilé dans dist

Browse Source
This commit is contained in:
Vincent Calame 2022-07-29 14:40:43 +02:00
parent c3695ad5fa
commit 15cfce1837
2 changed files with 99 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
demos/dist.css Normal file
View File

@ -0,0 +1,34 @@
body {
font-family: sans-serif;
}
table {
border-collapse: collapse;
margin-left: 40px;
}
td {
border-width: 1px;
border-color: #2e3436;
border-style: solid;
font-size: small;
}
th {
padding: 3px;
}
.small {
font-size: smaller;
}
.number {
text-align: right;
}
/***************************
* Styles ODS
* *************************/
column.Date {
width: 2cm;
}

65
demos/dist.html Normal file
View File

@ -0,0 +1,65 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<title>Exemple après compilation dans Dist</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<link href="dist.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="../dist/html2ods.js"></script>
<script>
function fodsLink() {
let link = document.getElementById("link");
link.href = URL.createObjectURL(
Html2Ods.blob("table")
);
setTimeout(function () {
URL.revokeObjectURL(link.href);
}, 4E4); // 40s
return true;
}
</script>
</head>
<body>
<h1>Exemple d'utilisation de jsHtml2Ods</h1>
<div>
<p><a href="blob:" download="table.fods" id="link" onclick="fodsLink()" id="link">Version ODS</a></p>
<table id="table"
data-od-sheetname="Tableau des clients"
data-od-currency="EUR"
data-od-fixed-rows="2"
data-od-fixed-columns="1">
<colgroup>
<col data-od-width="4cm">
<col span="2" data-od-style="Date">
<col>
<col>
</colgroup>
<colgroup span="2" class="moyennecolonne">
</colgroup>
<thead>
<tr data-od-style="Entete">
<th rowspan="2">Client</th>
<th colspan="2">Dates</th>
<th rowspan="2">Nuitées</th>
<th rowspan="2">Facture</th>
</tr>
<tr>
<th class="small">Départ</th>
<th class="small">Arrivée</th>
</tr>
</thead>
<tbody>
<tr>
<td>Victor Hugo</td>
<td data-od-type="date" data-od-text="2020-12-01">01/12/2020</td>
<td data-od-type="date" data-od-text="2021-01-11">11/01/2021</td>
<td data-od-type="number" class="number">40</td>
<td data-od-type="currency" data-od-text="1250" class="number">1 250 €</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>