fetch log api and file api done

This commit is contained in:
chiayin
2023-02-09 17:23:46 +08:00
parent a9184730c8
commit f34061608b
4 changed files with 88 additions and 103 deletions

View File

@@ -24,96 +24,6 @@
</p>
</a>
</li>
<li class="w-[216px] h-[168px] p-4 border rounded border-neutral-300 hover:text-primary hover:bg-primary/50 hover:border-primary duration-300">
<a href="" class="h-full flex flex-col justify-between">
<div>
<figure class="mb-2">
<IconDataFormat class="w-8 h-8"></IconDataFormat>
</figure>
<h3 class="text-sm font-medium mb-2">
File type
</h3>
<p class="text-sm text-neutral-500">
Daily operation records of......
</p>
</div>
<p class="text-sm text-neutral-500">
Edited just now
</p>
</a>
</li>
<li class="w-[216px] h-[168px] p-4 border rounded border-neutral-300 hover:text-primary hover:bg-primary/50 hover:border-primary duration-300">
<a href="" class="h-full flex flex-col justify-between">
<div>
<figure class="mb-2">
<IconDataFormat class="w-8 h-8"></IconDataFormat>
</figure>
<h3 class="text-sm font-medium mb-2">
File type
</h3>
<p class="text-sm text-neutral-500">
Daily operation records of......
</p>
</div>
<p class="text-sm text-neutral-500">
Edited just now
</p>
</a>
</li>
<li class="w-[216px] h-[168px] p-4 border rounded border-neutral-300 hover:text-primary hover:bg-primary/50 hover:border-primary duration-300">
<a href="" class="h-full flex flex-col justify-between">
<div>
<figure class="mb-2">
<IconDataFormat class="w-8 h-8"></IconDataFormat>
</figure>
<h3 class="text-sm font-medium mb-2">
File type
</h3>
<p class="text-sm text-neutral-500">
Daily operation records of......
</p>
</div>
<p class="text-sm text-neutral-500">
Edited just now
</p>
</a>
</li>
<li class="w-[216px] h-[168px] p-4 border rounded border-neutral-300 hover:text-primary hover:bg-primary/50 hover:border-primary duration-300">
<a href="" class="h-full flex flex-col justify-between">
<div>
<figure class="mb-2">
<IconDataFormat class="w-8 h-8"></IconDataFormat>
</figure>
<h3 class="text-sm font-medium mb-2">
File type
</h3>
<p class="text-sm text-neutral-500">
Daily operation records of......
</p>
</div>
<p class="text-sm text-neutral-500">
Edited just now
</p>
</a>
</li>
<li class="w-[216px] h-[168px] p-4 border rounded border-neutral-300 hover:text-primary hover:bg-primary/50 hover:border-primary duration-300">
<a href="" class="h-full flex flex-col justify-between">
<div>
<figure class="mb-2">
<IconDataFormat class="w-8 h-8"></IconDataFormat>
</figure>
<h3 class="text-sm font-medium mb-2">
File type
</h3>
<p class="text-sm text-neutral-500">
Daily operation records of......
</p>
</div>
<p class="text-sm text-neutral-500">
Edited just now
</p>
</a>
</li>
</ul>
</section>
<section>
@@ -141,10 +51,11 @@
File type
<IconVector class="inline-block ml-2 fill-neutral-500"></IconVector>
</th>
<th>
<!-- 後端暫時沒做 Owner -->
<!-- <th>
Owner
<IconVector class="inline-block ml-2 fill-neutral-500"></IconVector>
</th>
</th> -->
<th>
Last update
<IconVector class="inline-block ml-2 fill-neutral-500"></IconVector>
@@ -152,12 +63,12 @@
</tr>
</thead>
<tbody>
<tr>
<td>Daily operation records of wind turbines of...</td>
<td class="text-neutral-500">-</td>
<td class="text-neutral-500">Log</td>
<td class="text-neutral-500">Ivory Liao</td>
<td class="text-neutral-500"></td>
<tr v-for="(file, index) in allFiles" :key="file.id">
<td>{{ file.name }}</td>
<td class="text-neutral-500">{{ file.parentLog }}</td>
<td class="text-neutral-500">{{ file.fileType }}</td>
<!-- <td class="text-neutral-500">Owner</td> -->
<td class="text-neutral-500">{{ file.updated_at }}</td>
</tr>
</tbody>
</table>
@@ -199,7 +110,18 @@
export default {
data() {
return {
allFilter: [
{
log: {},
fileType: '',
}
],
allEventLog: [
{
parentLog: '',
fileType: '',
}
],
}
},
setup() {},
@@ -211,6 +133,54 @@
IconVector,
IconList,
IconGrid
},
computed: {
allFiles: function() {
return [
...this.allEventLog,
...this.allFilter.map(itemFilter => {
return { ...itemFilter, parentLog: itemFilter.log.name }
})
]
}
},
methods: {
/**
* Get all files
*/
async fetchFilter() {
const api = 'api/filters';
try {
const response = await this.$http.get(api);
this.allFilter = response.data;
this.allFilter.map(o => o.fileType = "Filter");
} catch(error) {
} finally {};
},
/**
* Get all event log
*/
async fetchEventLog() {
const api = 'api/logs';
try {
const response = await this.$http.get(api);
this.allEventLog = response.data;
this.allEventLog.map(o => {
o.parentLog = "-";
o.fileType = "Log";
return this.allEventLog
})
} catch(error) {
};
},
},
mounted() {
this.fetchFilter();
this.fetchEventLog();
}
}