Prerobena verzia, s zobrazovanim a logom

This commit is contained in:
2023-02-13 17:20:27 +01:00
parent cb9dc89ef6
commit 9eea644d0e
8 changed files with 3217 additions and 47 deletions

View File

@@ -49,47 +49,104 @@ function printRpoName(rpoKey) {
return rpoKey;
}
function createRPOflatList(resultTree, flatList, RpoTree, lastKey = undefined, level = 0, fullPathRpo = []) {
console.log('RESTREE=',resultTree);
let fullPath = [ ...fullPathRpo ] ;
if (lastKey != undefined) fullPath.push(lastKey);
if (level == 0 || checkValueType(resultTree) == "object") {
let i=0;
Object.keys(resultTree).forEach(k => {
if (typeof resultTree[k] != 'string') {
if (RpoTree[k] !== undefined) {
flatList.push({"level": level, "key": k, "val": undefined, "translated": RpoTree[k].desc ,"full": fullPath.join(' => '), "index": i++ });
createRPOflatList(resultTree[k],flatList, RpoTree[k], k, level + 1, fullPath );
}
} else {
console.log('RT=',RpoTree);
console.log('K=', k);
if (RpoTree[k] !== undefined)
flatList.push({"level": level, "key": k, "val": resultTree[k], "translated": RpoTree[k].desc ,"full": fullPath.join(' => '), "index": i++ });
}
});
} else if (checkValueType(resultTree) == "array") {
let i=0;
for (const e of resultTree) {
console.log('e=',e);
if (checkValueType(e) == "object" || checkValueType(e) == "array") {
createRPOflatList(e, flatList, RpoTree, lastKey, level + 1, fullPath );
} else {
console.log('RT=',RpoTree);
flatList.push({"level": level, "key": lastKey, "val": e, "translated": RpoTree.desc !== undefined ? RpoTree.desc : '' ,"full": fullPath.join(' => '), "index": i++ });
}
}
}
}
function subRpo(val,kz,i) {
console.log('val=',val,'k=',kz,'i=',i);
console.log(props.rpo);
return props.rpo[kz];
}
var flatListRpo = [];
createRPOflatList(props.data, flatListRpo, props.rpo);
console.log('FLAT=',flatListRpo);
</script>
<template>
<div class="table-main">
<div
v-for="(row, index) in arrData"
:key="index"
class="row-data m-2 d-flex"
>
<div class="key p-2 d-inline-block">
<!-- <div class="text-capitalize "> -->
{{ printRpoName(row) }}
<!-- </div> -->
</div>
<div v-if="['string', 'number'].includes(checkValueType(data[row]))">
<div class="value p-2 d-inline-block">{{ data[row] }}</div>
</div>
<div v-else-if="checkValueType(data[row]) === 'array'">
<div v-for="(arrRow, index2) in data[row]" :key="index2" class="d-flex">
<div v-if="['string', 'number'].includes(checkValueType(arrRow))">
{{ arrRow }}
<div class="flex flex-col">
<div class="overflow-x-auto">
<div class="p-1.5 w-full inline-block align-middle">
<div class="overflow-hidden border rounded-lg">
<table class="min-w-full divide-y divide-gray-200 border-4 border-black border-solid">
<thead class="bg-red-300">
<tr>
<th
scope="col"
class="min-w-min px-2 py-2 text-xs font-bold text-left border-4 border-black border-solid uppercase"
>
Nazov
</th>
<th
scope="col"
class="px-2 py-2 text-xs font-bold text-left border-4 border-black border-solid uppercase"
>
Hodnota
</th>
</tr>
</thead>
<tbody class="divide-y divide-gray-200">
<tr v-for="(row,index) in flatListRpo" :key="index"
:class="index % 2 === 0 ? 'bg-zinc-100' : 'bg-zinc-200'">
<td
class="py-2 text-sm text-gray-800 font-bold whitespace-nowrap border-r-4 border-black border-solid border-b"
:style="`padding-left: ${10+row.level*15}px`"
>
{{ row.translated }}
</td>
<td
class="px-2 py-2 text-sm text-gray-800 whitespace-nowrap border-black border-solid border-b"
>
{{ row.val }}
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div v-else>
<RpoRecord2 :data="arrRow" :rpo="subRpo(arrRow, row,index2)"/>
</div>
</div>
</div>
<div v-else>
<RpoRecord2 :data="data[row]" :rpo="subRpo(data[row],row,index)" />
</div>
</div>
</div>
</template>
</template>
<style scoped>
.level-1 {
width: 200px;
}
.table-main {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}