Fixed depth sorting inside zone and zoneEditor

src/components/zone/Objects.vue

@@ -1,3 +1,31 @@
-<template></template>
+<template>
+  <Image
+    v-for="object in zoneStore.zone?.zoneObjects"
+    :depth="calculateIsometricDepth(object.positionX, object.positionY, 0)"
+    :key="object.id" v-bind="getObjectImageProps(object)"
+  />
+</template>
 
-<script setup lang="ts"></script>
+<script setup lang="ts">
+import { calculateIsometricDepth, tileToWorldX, tileToWorldY } from '@/services/zone'
+import { Image } from 'phavuer'
+import { useZoneStore } from '@/stores/zone'
+import type { ZoneObject } from '@/types'
+import { storeToRefs } from 'pinia'
+
+const zoneStore = useZoneStore()
+
+const props = defineProps<{
+  tilemap: Phaser.Tilemaps.Tilemap
+}>()
+
+const getObjectImageProps = (object: ZoneObject) => {
+  return {
+    x: tileToWorldX(props.tilemap as any, object.positionX, object.positionY),
+    y: tileToWorldY(props.tilemap as any, object.positionX, object.positionY),
+    texture: object.object.id,
+    originY: Number(object.object.originX),
+    originX: Number(object.object.originY)
+  }
+}
+</script>