add: lp and navigation

Added... a lot of stuff

app/components/Pp/PriceCardDialog.vue

@@ -16,7 +16,8 @@
               v-model="currentCard.name"
               id="card_name"
               label="Name"
-              icon="uil:user"
+              icon="uil:pricetag-alt"
+              :placeholder="randomName"
               :class="{ error: !validFields.name }"
               :message="!validFields.name ? 'Feld darf nicht leer sein.' : ''"
               @input="validFields.name = true"
@@ -25,6 +26,7 @@
               v-model="currentCard.price"
               id="card_price"
               label="Preis"
+              placeholder="2,49"
               icon="uil:euro"
               mode="decimal"
               :class="{ error: !validFields.price }"
@@ -37,6 +39,7 @@
               v-model="currentCard.roles"
               id="card_roles"
               label="Rollen"
+              placeholder="8"
               icon="uil:toilet-paper"
               mode="decimal"
               :class="{ error: !validFields.roles }"
@@ -47,6 +50,7 @@
               v-model="currentCard.sheets"
               id="card_sheets"
               label="Blatt"
+              placeholder="150"
               icon="uil:file-landscape"
               mode="decimal"
               :class="{ error: !validFields.sheets }"
@@ -57,6 +61,7 @@
               v-model="currentCard.layers"
               id="card_layers"
               label="Lagen"
+              placeholder="3"
               icon="uil:layer-group"
               mode="decimal"
               :class="{ error: !validFields.layers }"
@@ -94,6 +99,25 @@ const emit = defineEmits(['update'])
 const dialog = useTemplateRef<HTMLDialogElement>('dialog')
 const wrapper = useTemplateRef<HTMLElement>('wrapper')
 
+const market = [
+  'Lotl',
+  'Olda',
+  'Bäwä',
+  'Brutto',
+]
+
+const product = [
+  'Weichelig',
+  'Sau Rauh',
+  'Bissl Sanft',
+  'Ganz ok',
+  'Flauschi'
+]
+
+const generateRandomName = () => `${market[Math.floor(Math.random() * market.length)]} ${product[Math.floor(Math.random() * product.length)]}`
+
+const randomName = useState('randomName', () => generateRandomName())
+
 const checkPrice = () => {
   if (!currentCard) return false
   if (currentCard.price.length === 0) return false
@@ -138,6 +162,7 @@ onMounted(() => {
     validFields.roles = true
     validFields.sheets = true
     validFields.layers = true
+    randomName.value = generateRandomName()
   })
 
   onClickOutside(wrapper, () => dialog.value?.close())