62 lines
1.1 KiB
Vue
62 lines
1.1 KiB
Vue
<template>
|
|
<div id="app">
|
|
<div>
|
|
<table v-if="json.headings && json.data">
|
|
<tr>
|
|
<th
|
|
v-for="(value, key) in json.headings.filter((val,ind)=>!json.hidden.includes(ind))"
|
|
:key="key"
|
|
>{{value}}</th>
|
|
</tr>
|
|
<tr v-for="(row,rowKey) in json.data" :key="rowKey">
|
|
<td
|
|
v-for="(value,key) in row.filter((val,ind)=>!json.hidden.includes(ind))"
|
|
:key="key"
|
|
>{{value}}</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
<br />
|
|
<br />
|
|
<a
|
|
style="font-size:10px"
|
|
rel="license"
|
|
href="https://www.gnu.org/licenses/gpl-3.0.en.html"
|
|
>GNU General Public License v3.0 or later © Timo Hocker</a>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: "App",
|
|
data() {
|
|
return {
|
|
json: {}
|
|
};
|
|
},
|
|
mounted() {
|
|
const self = this;
|
|
fetch("?json")
|
|
.then(res => res.json())
|
|
.then(json => (self.json = json));
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style>
|
|
@import url("https://cdn.scode.ovh/bootstrapLight.css");
|
|
|
|
td {
|
|
border: 1px solid green;
|
|
padding: 5px;
|
|
}
|
|
|
|
th {
|
|
padding: 5px;
|
|
}
|
|
|
|
table {
|
|
border-collapse: collapse;
|
|
}
|
|
</style>
|