Moved server, added backend structs and added ui elements.

.env.sample

@@ -3,5 +3,4 @@ SERVER_ADDRESS=localhost
 SERVER_PORT=9090
 
 # Database
-DATABASE_URL=sqlite:db.db
+DATABASE_URL=postgres://USER:PASSWORD@localhost:5432/label_editor
-# DATABASE_URL=postgres://USER:PASSWORD@localhost:5432/label_editor

Cargo.lock

@@ -383,6 +383,7 @@ dependencies = [
  "iana-time-zone",
  "js-sys",
  "num-traits",
+ "serde",
  "wasm-bindgen",
  "windows-link",
 ]
@@ -393,6 +394,16 @@ version = "1.0.4"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "b05b61dc5112cbb17e4b6cd61790d9845d13888356391624cbe7e41efeac1e75"
 
+[[package]]
+name = "common"
+version = "0.1.0"
+dependencies = [
+ "chrono",
+ "serde",
+ "serde_json",
+ "sqlx",
+]
+
 [[package]]
 name = "concurrent-queue"
 version = "2.5.0"
@@ -1186,17 +1197,8 @@ dependencies = [
 name = "label_editor"
 version = "0.1.0"
 dependencies = [
- "axum",
+ "common",
- "chrono",
+ "server",
- "dotenv",
- "env_logger",
- "http",
- "serde",
- "serde_json",
- "sqlx",
- "tokio",
- "tracing",
- "tracing-subscriber",
 ]
 
 [[package]]
@@ -1865,6 +1867,24 @@ dependencies = [
  "serde",
 ]
 
+[[package]]
+name = "server"
+version = "0.1.0"
+dependencies = [
+ "axum",
+ "chrono",
+ "common",
+ "dotenv",
+ "env_logger",
+ "http",
+ "serde",
+ "serde_json",
+ "sqlx",
+ "tokio",
+ "tracing",
+ "tracing-subscriber",
+]
+
 [[package]]
 name = "sha1"
 version = "0.10.6"

Cargo.toml

@@ -2,24 +2,14 @@
 name = "label_editor"
 version = "0.1.0"
 edition = "2024"
+authors = ["Matthias Lodner <matthias@lodner.de>"]
+
+[workspace]
+members = [
+    "common",
+    "server",
+]
 
 [dependencies]
-axum = "0.8.8"
+common = {path = "common" }
-tokio = { version = "1.49.0", default-features = false, features = ["full"] }
+server = {path = "server"}
-http = "1.4.0"
-tracing = "=0.1.44"
-tracing-subscriber = "0.3.22"
-
-
-serde = { version = "1.0.228", features = ["derive"] }
-serde_json = "1.0.149"
-
-# Logging
-env_logger = "0.11.8"
-
-# Database
-sqlx = { version = "0.8.6", features = [ "runtime-async-std-native-tls", "postgres", "chrono" ] }
-
-# Etc.
-dotenv = "0.15.0"
-chrono = { version = "0.4.42" }

common/Cargo.toml

@@ -0,0 +1,16 @@
+[package]
+name = "common"
+version = "0.1.0"
+edition = "2024"
+authors = ["Matthias Lodner <matthias@lodner.de>"]
+
+[dependencies]
+# Deserialize/Serialize
+serde = { version = "1.0.228", features = ["derive"] }
+serde_json = "1.0.145"
+
+# Database
+sqlx = { version = "0.8.6", features = [ "runtime-async-std-native-tls", "postgres", "chrono" ] }
+
+# Etc.
+chrono = { version = "0.4.42", features = [ "serde" ] }

common/src/lib.rs

@@ -0,0 +1,11 @@
+pub mod models;
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+
+    #[test]
+    fn it_works() {
+        assert_eq!(2 + 2, 4);
+    }
+}

common/src/models/article.rs

@@ -0,0 +1,14 @@
+use serde::{Deserialize, Serialize};
+use crate::models::origin::Origin;
+use crate::models::variant::Variant;
+
+#[derive(Debug, Deserialize, Serialize, Clone)]
+pub struct Article {
+    pub id: usize,
+    pub name: String,
+    pub bio: bool,
+    pub origin: Origin,
+    pub description: Option<String>,
+    pub ingredients: Option<String>,
+    pub variants: Vec<Variant>,
+}

common/src/models/mod.rs

@@ -0,0 +1,3 @@
+pub mod origin;
+pub mod article;
+pub mod variant;

common/src/models/origin.rs

@@ -0,0 +1,31 @@
+use std::fmt;
+use std::fmt::Formatter;
+use serde::{Deserialize, Serialize};
+
+#[repr(i32)]
+#[derive(Deserialize, Serialize, Copy, Clone, PartialEq, sqlx::Type)]
+pub enum Origin {
+    EU,
+    NEU,
+    EUnEU,
+}
+
+fn to_string(unit: Origin, f: &mut Formatter) -> fmt::Result {
+    match unit {
+        Origin::EU => write!(f, "EU"),
+        Origin::NEU => write!(f, "Nicht EU"),
+        Origin::EUnEU => write!(f, "EU / Nicht EU"),
+    }
+}
+
+impl fmt::Debug for Origin {
+    fn fmt(&self, f: &mut Formatter) -> fmt::Result {
+        to_string(*self, f)
+    }
+}
+
+impl fmt::Display for Origin {
+    fn fmt(&self, f: &mut Formatter<'_>) -> fmt::Result {
+        to_string(*self, f)
+    }
+}

common/src/models/variant.rs

@@ -0,0 +1,7 @@
+use serde::{Deserialize, Serialize};
+
+#[derive(Debug, Deserialize, Serialize, Clone)]
+pub struct Variant {
+    pub id: usize,
+
+}

frontend/app/components/article/articleCreate.vue

@@ -0,0 +1,152 @@
+<script setup lang="ts">
+  import type {Ref} from "vue";
+  import {useLabelEditorStore} from "~/store/labelEditorStore";
+  import {Article} from "~/types/article";
+  import {Origin} from "~/types/origin";
+
+  let store = useLabelEditorStore();
+
+  let dialog: Ref<boolean> = ref<boolean>(false);
+  let loading: Ref<boolean> = ref<boolean>(false);
+
+  let name: Ref<string | null> = ref<string | null>(null);
+  let bio: Ref<boolean> = ref<boolean>(false);
+  let origin: Ref<Origin | null> = ref<Origin | null>(null);
+  let description: Ref<string | null> = ref<string | null>(null);
+  let ingredients: Ref<string | null> = ref<string | null>(null);
+
+  let origins: Origin[] = [
+      Origin.EU,
+      Origin.NEU,
+      Origin.EUnEU
+  ];
+
+  async function create() {
+    if (name.value != null && name.value.trim().length > 0 &&
+      origin.value != null && origin.value.trim().length > 0
+    ) {
+      loading.value = true;
+
+      const article: Article = new Article(0, name.value, bio.value, origin.value, description.value, ingredients.value, []);
+
+      await store.createArticle(article);
+
+      closeDialog();
+    }
+  }
+
+  function closeDialog() {
+    dialog.value = false;
+    clearVariables();
+  }
+
+  function clearVariables() {
+    name.value = null;
+    bio.value = false;
+    origin.value = null;
+    description.value = null;
+    ingredients.value = null;
+
+    loading.value = false;
+  }
+</script>
+
+<template>
+  <v-dialog
+      v-model="dialog"
+      :scrollable="true"
+      width="800"
+      max-height="750"
+  >
+    <template v-slot:activator="{ props }">
+      <v-btn
+          :flat="true"
+          v-bind="props"
+          size="small"
+      >
+        <v-icon>mdi-plus-thick</v-icon>
+        <v-tooltip
+            activator="parent"
+            location="bottom"
+        >
+          Erstellen
+        </v-tooltip>
+      </v-btn>
+    </template>
+
+    <v-card>
+      <v-card-title>
+        <v-icon size="small">
+          mdi-plus-thick
+        </v-icon>
+
+        Artikel erstellen
+
+        <v-progress-circular v-if="loading" indeterminate :size="15" :width="2"></v-progress-circular>
+      </v-card-title>
+
+      <v-divider/>
+
+      <v-card-text>
+        <v-text-field
+            v-model.trim="name"
+            label="Bezeichnung"
+        />
+
+        <v-row>
+          <v-col cols="2">
+            <v-checkbox
+                v-model.="bio"
+                label="BIO"
+            />
+          </v-col>
+          <v-col>
+            <v-select
+                v-model="origin"
+                :items="origins"
+                label="Herkunft"
+            ></v-select>
+          </v-col>
+        </v-row>
+
+        <v-textarea
+            v-model.trim="description"
+            label="Beschreibung"
+        />
+
+        <v-textarea
+            v-model.trim="ingredients"
+            label="Zutaten"
+        />
+      </v-card-text>
+
+      <v-divider/>
+
+      <v-card-actions>
+        <v-spacer/>
+
+        <v-btn
+            variant="text"
+            :disabled="loading"
+            @click="closeDialog()"
+        >
+          Abbrechen
+        </v-btn>
+
+        <v-btn
+            variant="text"
+            :disabled="name == null ||
+            origin == null ||
+             loading"
+            @click="create();"
+        >
+          Erstellen
+        </v-btn>
+      </v-card-actions>
+    </v-card>
+  </v-dialog>
+</template>
+
+<style scoped>
+
+</style>

frontend/app/components/layout/customHeader.vue

@@ -13,6 +13,12 @@
         :vertical="true"
     />
 
+    <ArticleCreate/>
+
+    <v-divider
+        :vertical="true"
+    />
+
     <Notifications/>
 
   </v-app-bar>

frontend/app/store/labelEditorStore.ts

@@ -1,5 +1,5 @@
 import {defineStore} from "pinia";
-import type {Entity} from "~/types/entity";
+import type {Article} from "~/types/article";
 import {NotificationMessage} from "~/types/notificationMessage";
 import type {RuntimeConfig} from "nuxt/schema";
 
@@ -10,8 +10,8 @@ interface State {
   notifications: NotificationMessage[],
   notificationQueue: NotificationMessage[],
 
-  // Entity
+  // Article
-  entity: Entity | null,
+  article: Article | null,
 }
 
 export const useLabelEditorStore = defineStore('label_editor_store', {
@@ -22,8 +22,8 @@ export const useLabelEditorStore = defineStore('label_editor_store', {
     notifications: [],
     notificationQueue: [],
 
-    // Entity
+    // Article
-    entity: null,
+    article: null,
   }),
   actions: {
     // Notification
@@ -88,33 +88,45 @@ export const useLabelEditorStore = defineStore('label_editor_store', {
     },
 
 
-    // Entity
+    // Article
-    async loadEntity(entityID: number) {
+    async loadArticle(articleID: number) {
       try {
-        const entity: Entity = await $fetch<Entity>(this.config.public.url + '/entity/' + entityID, {
+        const entity: Article = await $fetch<Article>(this.config.public.url + '/article/' + articleID, {
           method: 'GET',
         });
 
-        this.entity = entity;
+        this.article = entity;
-        this.addNotification(false, 'Artikel geladen: ' + this.entity.name);
+        this.addNotification(false, 'Artikel geladen: ' + this.article.name);
       } catch {
-        this.entity = null;
+        this.article = null;
-        this.addNotification(true, 'Fehler beim laden des Artikel. ID:' + entityID);
+        this.addNotification(true, 'Fehler beim laden des Artikel. ID:' + articleID);
       }
     },
 
-    async updateEntity(entity: Entity) {
+    async createArticle(article: Article) {
-      if (this.entity != null) {
       try {
-          const entity: Entity = await $fetch<Entity>(this.config.public.url + '/entity/update', {
+        this.article = await $fetch<Article>(this.config.public.url + '/article', {
           method: 'POST',
-            body: JSON.stringify(this.entity),
+          body: JSON.stringify(article),
         });
 
-          this.entity = entity;
+        this.addNotification(false, 'Artikel "' + article.name + '" erstellt');
-          this.addNotification(false, 'Artikel "' + this.entity.name + '" aktualisiert');
       } catch {
-          this.addNotification(true, 'Fehler beim aktualisieren des Artikel: ' + this.entity.name);
+        this.addNotification(true, 'Fehler beim erstellen des Artikel: ' + article.name);
+      }
+    },
+
+    async updateArticle(article: Article) {
+      if (this.article != null) {
+        try {
+          this.article = await $fetch<Article>(this.config.public.url + '/article/update', {
+            method: 'POST',
+            body: JSON.stringify(this.article),
+          });
+
+          this.addNotification(false, 'Artikel "' + this.article.name + '" aktualisiert');
+        } catch {
+          this.addNotification(true, 'Fehler beim aktualisieren des Artikel: ' + this.article.name);
         }
       } else {
         this.addNotification(true, 'Es ist kein Artikel ausgewählt');
@@ -122,7 +134,7 @@ export const useLabelEditorStore = defineStore('label_editor_store', {
     },
 
     clearEntity() {
-      this.entity = null;
+      this.article = null;
     },
   },
 });

frontend/app/types/article.ts

@@ -1,15 +1,16 @@
 import type {Variant} from "~/types/variant";
+import type {Origin} from "~/types/origin";
 
-export class Entity {
+export class Article {
   readonly id: number;
   name: string;
   bio: boolean;
-  origin: string;
+  origin: Origin;
-  description: string;
+  description: string | null;
-  ingredients: string;
+  ingredients: string | null;
   variants: Array<Variant>;
 
-  constructor(id: number, name: string, bio: boolean, origin: string, description: string, ingredients: string, variants: Array<Variant> | null) {
+  constructor(id: number, name: string, bio: boolean, origin: Origin, description: string | null, ingredients: string | null, variants: Array<Variant> | null) {
     this.id = id;
     this.name = name;
     this.bio = bio;

frontend/app/types/origin.ts

@@ -0,0 +1,5 @@
+export enum Origin {
+    EU = "EU",
+    NEU = "Nicht - EU",
+    EUnEU= "EU / Nicht EU",
+}

label_editor.iml

@@ -3,7 +3,10 @@
   <component name="NewModuleRootManager" inherit-compiler-output="true">
     <exclude-output />
     <content url="file://$MODULE_DIR$">
+      <sourceFolder url="file://$MODULE_DIR$/common/src" isTestSource="false" />
+      <sourceFolder url="file://$MODULE_DIR$/server/src" isTestSource="false" />
       <sourceFolder url="file://$MODULE_DIR$/src" isTestSource="false" />
+      <excludeFolder url="file://$MODULE_DIR$/server/target" />
       <excludeFolder url="file://$MODULE_DIR$/target" />
     </content>
     <orderEntry type="inheritedJdk" />

server/Cargo.toml

@@ -0,0 +1,32 @@
+[package]
+name = "server"
+version = "0.1.0"
+edition = "2024"
+authors = ["Matthias Lodner <matthias@lodner.de>"]
+
+[[bin]]
+name = "server"
+path = "src/main.rs"
+
+[dependencies]
+common = {path = "../common"}
+
+axum = "0.8.8"
+tokio = { version = "1.49.0", default-features = false, features = ["full"] }
+http = "1.4.0"
+tracing = "=0.1.44"
+tracing-subscriber = "0.3.22"
+
+
+serde = { version = "1.0.228", features = ["derive"] }
+serde_json = "1.0.149"
+
+# Logging
+env_logger = "0.11.8"
+
+# Database
+sqlx = { version = "0.8.6", features = [ "runtime-async-std-native-tls", "postgres", "chrono" ] }
+
+# Etc.
+dotenv = "0.15.0"
+chrono = { version = "0.4.42" }

server/src/main.rs

@@ -0,0 +1,55 @@
+use std::env;
+use axum::{
+    routing::{get, post},
+    http::StatusCode,
+    Json, Router,
+};
+use dotenv::dotenv;
+use common::models::article::Article;
+
+#[tokio::main]
+async fn main() {
+    dotenv().ok();
+
+    let server_address = env::var("SERVER_ADDRESS").expect("SERVER_ADDRESS is not set in .env file");
+    let server_port = env::var("SERVER_PORT").expect("SERVER_PORT is not set in .env file");
+    let database = env::var("DATABASE_URL").expect("DATABASE is not set in .env file");
+
+    let addr = format!("{}:{}", server_address, server_port);
+
+    // initialize tracing
+    tracing_subscriber::fmt().init();
+
+    // build our application with a route
+    let app = Router::new()
+        // `GET /` goes to `root`
+        .route("/", get(root))
+        // `POST /users` goes to `create_user`
+        .route("/article", post(create_article));
+
+    // run our app with hyper, listening globally on port 3000
+    let listener = tokio::net::TcpListener::bind(addr).await.unwrap();
+    axum::serve(listener, app).await.unwrap();
+}
+
+// basic handler that responds with a static string
+async fn root() -> &'static str {
+    "Hello, World!"
+}
+
+#[tracing::instrument(ret)]
+async fn create_article(
+    Json(payload): Json<Article>,
+) -> (StatusCode, Json<Article>) {
+    let article = Article {
+        id: payload.id,
+        name: payload.name,
+        bio: payload.bio,
+        origin: payload.origin,
+        description: payload.description,
+        ingredients: payload.ingredients,
+        variants: payload.variants,
+    };
+
+    (StatusCode::CREATED, Json(article))
+}

src/main.rs

@@ -1,67 +1,3 @@
-use std::env;
+fn main() {
-use axum::{
+    println!("Hello, world from main starter!");
-    routing::{get, post},
-    http::StatusCode,
-    Json, Router,
-};
-use dotenv::dotenv;
-use serde::{Deserialize, Serialize};
-
-#[tokio::main]
-async fn main() {
-    dotenv().ok();
-
-    let server_address = env::var("SERVER_ADDRESS").expect("SERVER_ADDRESS is not set in .env file");
-    let server_port = env::var("SERVER_PORT").expect("SERVER_PORT is not set in .env file");
-    let database = env::var("DATABASE_URL").expect("DATABASE is not set in .env file");
-
-    let addr = format!("{}:{}", server_address, server_port);
-
-    // initialize tracing
-    tracing_subscriber::fmt::init();
-
-    // build our application with a route
-    let app = Router::new()
-        // `GET /` goes to `root`
-        .route("/", get(root))
-        // `POST /users` goes to `create_user`
-        .route("/users", post(create_user));
-
-    // run our app with hyper, listening globally on port 3000
-    let listener = tokio::net::TcpListener::bind(addr).await.unwrap();
-    axum::serve(listener, app).await.unwrap();
-}
-
-// basic handler that responds with a static string
-async fn root() -> &'static str {
-    "Hello, World!"
-}
-
-async fn create_user(
-    // this argument tells axum to parse the request body
-    // as JSON into a `CreateUser` type
-    Json(payload): Json<CreateUser>,
-) -> (StatusCode, Json<User>) {
-    // insert your application logic here
-    let user = User {
-        id: 1337,
-        username: payload.username,
-    };
-
-    // this will be converted into a JSON response
-    // with a status code of `201 Created`
-    (StatusCode::CREATED, Json(user))
-}
-
-// the input to our `create_user` handler
-#[derive(Deserialize)]
-struct CreateUser {
-    username: String,
-}
-
-// the output to our `create_user` handler
-#[derive(Serialize)]
-struct User {
-    id: u64,
-    username: String,
 }