feat(fe playlist): adding editor functionalities

resources/js/components/content/partials/PlaylistEditor.vue

@@ -1,12 +1,17 @@
 <script setup lang="ts">
 import {playlist} from "@/composables/content/models/playlist.ts";
 import Sources from "@/components/content/partials/Sources.vue";
+import TrackList from "@/components/content/partials/TrackList.vue";
 
 const props = defineProps({
   item: Object,
 })
 
-console.log(props.item.id)
+const tracks = props.item?.tracks
+
+console.log(props.item)
+console.log(tracks)
+
 const item = (): object => {
   if (props.item.id === 0) {
     return {
@@ -14,6 +19,8 @@ const item = (): object => {
       name: '',
       creator_id: 0,
       description: '',
+      creator: {},
+      tracks: []
     }
   } else {
     return props.item
@@ -35,6 +42,8 @@ console.log(playlistFields())
             :label="field.label"
             :value="field.value"
             :disabled="field.disabled"
+            :density="'compact'"
+            rows="2"
             v-model="item()[key]"
             item-title="type_name"
             density="compact"
@@ -45,19 +54,24 @@ console.log(playlistFields())
         />
       </v-form>
     </v-col>
-    <v-col></v-col>
+    <v-col>
+      <v-btn
+          color="accent"
+          @click="$emit('goBack')"
+      >Torna indietro</v-btn>
+    </v-col>
   </v-row>
   <v-row no-gutters>
-    <v-col></v-col>
+    <v-col>
+      <TrackList
+          :tracks="item().tracks"
+      />
+    </v-col>
     <v-col>
       <Sources />
     </v-col>
   </v-row>
   <v-row no-gutters>
-    <v-btn
-        color="accent"
-        @click="$emit('goBack')"
-    >Torna indietro</v-btn>
   </v-row>
 </template>