Feat/dave 157 farbige messstellen

frontend/src/components/map/ZaehlstelleMap.vue

@@ -175,9 +175,15 @@ import TooltipZaehlstelleDTO from "@/domain/dto/TooltipZaehlstelleDTO";
 import markerIconRed from "@/assets/marker-icon-red.png";
 import markerIconDiamondViolet from "@/assets/cards-diamond-violet.png";
 import markerIconDiamondRed from "@/assets/cards-diamond-red.png";
+import markerIconDiamondOrange from "@/assets/cards-diamond-orange.png";
+import markerIconDiamondShadow from "@/assets/cards-diamond-shadow.png";
 import TooltipMessstelleDTO from "@/domain/dto/TooltipMessstelleDTO";
 import AnzeigeKarteDTO from "@/domain/dto/AnzeigeKarteDTO";
 import MessstelleKarteDTO from "@/domain/dto/messstelle/MessstelleKarteDTO";
+import {
+    MessstelleStatus,
+    messstelleStatusText,
+} from "@/domain/enums/MessstelleStatus";
 /* eslint-enable no-unused-vars */
 
 @Component({
@@ -544,8 +550,17 @@ export default class ZaehlstelleMap extends Vue {
      * Setzt die Optionen bezüglich verwendetes Icon für den Messstellenmarker.
      */
     private markerOptionsMessstelle(messstelleKarte: MessstelleKarteDTO) {
-        let defaultIcon = new Icon.Default();
-        defaultIcon.options.iconUrl = markerIconDiamondViolet;
+        let defaultIcon = new Icon({
+            iconUrl: markerIconDiamondViolet,
+            shadowUrl: markerIconDiamondShadow,
+            shadowAnchor: [8, 25],
+            iconSize: [25, 41],
+        });
+
+        if (messstelleKarte.status === MessstelleStatus.IN_PLANUNG) {
+            defaultIcon.options.iconUrl = markerIconDiamondOrange;
+        }
+
         if (this.zId) {
             if (this.zId === messstelleKarte.id) {
                 defaultIcon.options.iconUrl = markerIconDiamondRed;

frontend/src/domain/dto/messstelle/MessstelleKarteDTO.ts

@@ -5,4 +5,6 @@ export default interface MessstelleKarteDTO extends AnzeigeKarteDTO {
     mstId: string;
 
     tooltip: TooltipMessstelleDTO;
+
+    status: string;
 }