Added color name

myMartek · Dec 1, 2023 · 875d361 · 875d361
1 parent b6ff448
commit 875d361
Show file tree

Hide file tree

Showing 7 changed files with 39 additions and 3 deletions.
diff --git a/frontend/src/components/FilamentDetails.vue b/frontend/src/components/FilamentDetails.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-dialog width="1200" v-model="show">
+  <v-dialog width="1400" v-model="show">
     <v-card :title="t('$vuetify.filamentDetails.title')">
       <v-card-text>
         <v-table>
@@ -11,6 +11,9 @@
               <th class="text-left">
                 {{ t('$vuetify.filamentDetails.name') }}
               </th>
+              <th class="text-left">
+                {{ t('$vuetify.filamentDetails.colorname') }}
+              </th>
               <th class="text-left">
                 {{ t('$vuetify.filamentDetails.size') }}
               </th>
@@ -37,6 +40,14 @@
                   @update:modelValue="debouncedUpdate(item)"
                 ></v-text-field>
               </td>
+              <td width="150">
+                <v-text-field
+                  v-model="item.colorname"
+                  :label="t('$vuetify.filamentDetails.colorname')"
+                  hide-details
+                  @update:modelValue="debouncedUpdate(item)"
+                ></v-text-field>
+              </td>
               <td width="150">
                 <v-combobox
                   v-model="item.size"

diff --git a/frontend/src/locale/de.js b/frontend/src/locale/de.js
@@ -31,6 +31,7 @@ language.homeView = {
     size: 'Größe',
     remain: 'Verbleibend',
     color: 'Farbe',
+    colorname: 'Farbname',
     spools: 'Spulen',
     actions: 'Aktionen'
   }
@@ -43,6 +44,7 @@ language.filamentDetails = {
   size: 'Größe',
   remain: 'Verbleibend',
   remaining: 'Restmenge',
+  colorname: 'Farbname',
   actions: 'Aktionen',
   successDelete: 'Filament gelöscht',
   errorDelete: 'Fehler beim Löschen des Filaments',

diff --git a/frontend/src/locale/en.js b/frontend/src/locale/en.js
@@ -31,6 +31,7 @@ language.homeView = {
     size: 'Size',
     remain: 'Remaining',
     color: 'Color',
+    colorname: 'Colorname',
     spools: 'Spools',
     actions: 'Actions'
   }
@@ -42,6 +43,7 @@ language.filamentDetails = {
   name: 'Name',
   size: 'Size',
   remain: 'Remaining',
+  colorname: 'Colorname',
   remaining: 'Remaining amount',
   actions: 'Actions',
   successDelete: 'Filament deleted successfully',

diff --git a/frontend/src/store/app.js b/frontend/src/store/app.js
@@ -31,6 +31,7 @@ export const useAppStore = defineStore('app', {
             remain: filament.size / 100 * filament.remain,
             filaments: [filament],
             color: filament.color,
+            colorname: filament.colorname,
             name: filament.name
           }
         } else {

diff --git a/frontend/src/views/HomeView.vue b/frontend/src/views/HomeView.vue
@@ -106,6 +106,19 @@
                     </v-col>
                   </v-row>
 
+                  <v-row>
+                    <v-col
+                      cols="12"
+                    >
+                      <v-text-field
+                        v-model="addModel.colorname"
+                        required
+                        :rules="requiredRules"
+                        :label="t('$vuetify.homeView.form.colorname')"
+                      ></v-text-field>
+                    </v-col>
+                  </v-row>
+
                   <v-row>
                     <v-col
                       cols="12"
@@ -154,7 +167,7 @@
       :items-per-page="-1"
     >
       <template v-slot:item.color="{ item }">
-        <v-avatar variant="elevated" :color="item.color"></v-avatar>
+        <v-avatar variant="elevated" :color="item.color"></v-avatar>&nbsp;{{ item.colorname }}
       </template>
 
       <template v-slot:item.filaments="{ item }">
@@ -222,6 +235,7 @@ const addModel = ref({
   type: '',
   name: '',
   color: '#ffffffff',
+  colorname: '',
   size: 1000,
   remain: 100,
   empty: false

diff --git a/index.js b/index.js
@@ -111,6 +111,7 @@ app.post('/update', async (req, res) => {
       empty: true,
       name: 'Unknown',
       size: 1000,
+      colorname: '',
       ...req.body,
       tracking: false
     };

diff --git a/src/hass-bambulab.js b/src/hass-bambulab.js
@@ -1,11 +1,15 @@
 import axios from 'axios';
 import fs from 'fs/promises';
-import { v4 as uuidv4 } from 'uuid';
 
 let usagedata;
 
 try {
   usagedata = JSON.parse(await fs.readFile('./data/hass-data.json', 'utf-8'));
+  Object.values(usagedata).forEach((filament) => {
+    if (!filament.colorname) {
+      filament.colorname = '';
+    }
+  });
 } catch (e) {
   usagedata = {};
 }
@@ -31,6 +35,7 @@ const getAMSTrays = async (sensor) => {
         tag_uid: data.attributes.tag_uid,
         remain: data.attributes.remain,
         color: data.attributes.color,
+        colorname: '',
         empty: data.attributes.empty,
         name: data.attributes.name
       };