ctmesh/map
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

more code cleanup

Browse Source
This commit is contained in:
Matt
2025-04-17 18:45:15 -04:00
parent 600ed7bbb3
commit 63b823a7a1
49 changed files with 3016 additions and 1658 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
webapp/frontend/src/components/HardwareModelList.vue
View File

@ -1,16 +1,19 @@
<script setup>
import axios from 'axios';
import { state } from '../store.js';
import { buildPath } from '../utils.js';
import { buildPath } from '@/utils';
import { ref, onMounted } from 'vue';
import { useUIStore } from '@/stores/uiStore';
const ui = useUIStore();
const hardwareModelStats = ref([]);
onMounted(() => {
axios.get(buildPath('/api/v1/stats/hardware-models')).then((response) => {
hardwareModelStats.value = response.data.hardware_model_stats;
}).catch((error) => {
// do nothing
});
});
async function loadHardwareStats() {
try {
const { data } = await axios.get(buildPath('/api/v1/stats/hardware-models'));
hardwareModelStats.value = data.hardware_model_stats;
} catch (error) {
console.warn('Failed to fetch hardware model stats:', error);
}
}
onMounted(loadHardwareStats);
</script>
<template>
@ -24,7 +27,7 @@ onMounted(() => {
leave-active-class="transition-opacity duration-300 ease-linear"
leave-from-class="opacity-100"
leave-to-class="opacity-0">
<div v-show="state.hardwareStatsVisible" @click="state.hardwareStatsVisible = !state.hardwareStatsVisible" class="fixed inset-0 bg-gray-900/75"></div>
<div v-show="ui.hardwareStatsVisible" @click="ui.toggleHardwareStats" class="fixed inset-0 bg-gray-900/75"></div>
</transition>
<!-- sidebar -->
@ -35,7 +38,7 @@ onMounted(() => {
leave-active-class="transition duration-300 ease-in-out transform"
leave-from-class="translate-x-0"
leave-to-class="-translate-x-full">
<div v-show="state.hardwareStatsVisible" class="fixed top-0 left-0 bottom-0">
<div v-show="ui.hardwareStatsVisible" class="fixed top-0 left-0 bottom-0">
<div class="w-screen h-full max-w-md overflow-hidden">
<div class="flex h-full flex-col bg-white shadow-xl">
@ -47,7 +50,7 @@ onMounted(() => {
<h3 class="text-sm">Ordered by most popular</h3>
</div>
<div class="my-auto ml-3 flex h-7 items-center">
<a href="javascript:void(0)" class="rounded-full" @click="state.hardwareStatsVisible = false">
<a href="javascript:void(0)" class="rounded-full" @click="ui.hideHardwareStats">
<div class="bg-gray-100 hover:bg-gray-200 p-2 rounded-full">
<svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
@ -62,13 +65,13 @@ onMounted(() => {
<!-- list of hardware models -->
<ul role="list" class="flex-1 divide-y divide-gray-200 overflow-y-auto">
<li v-for="hardwareModel of hardwareModelStats">
<li v-for="hardwareModel in hardwareModelStats" :key="hardwareModel.hardware_model_name">
<div class="group relative flex items-center">
<a href="#" class="block flex-1 px-4 py-2">
<div class="absolute inset-0 group-hover:bg-gray-100" aria-hidden="true"></div>
<div class="relative flex min-w-0 flex-1 items-center">
<span class="relative inline-block flex-shrink-0 mr-4">
<img class="h-20 w-20 rounded-sm object-contain" :src="`/images/devices/${hardwareModel.hardware_model_name}.png`" alt="" onerror="if(this.src != '/images/no_image.png') this.src = '/images/no_image.png';">
<img class="h-20 w-20 rounded-sm object-contain" :src="`/images/devices/${hardwareModel.hardware_model_name}.png`" alt="" @error="(e) => e.target.src = '/images/no_image.png'">
</span>
<div class="truncate">
<p class="truncate text-sm font-medium text-gray-900">{{ hardwareModel.hardware_model_name }}</p>