41fbe71a1f
- Fix template check 'carte' → 'map' so map subpages are served by API - Add parseMarker() and enrich parseCarte() with static image, intro, markers - Include map children in parseGeoformat() alongside chapters - Resolve map block references in chapters to full carte data - Update narrative store flattening with new carte fields - Replace MapBlock placeholder with full carte rendering (title, image, tags, intro, markers with icons and blocks) - Add default marker-pin.svg for markers without custom icon Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
72 lines
2.1 KiB
Vue
72 lines
2.1 KiB
Vue
<template>
|
|
<div v-if="content.template === 'carte'" class="block-map">
|
|
<h4>{{ content.title }}</h4>
|
|
<img v-if="content.image" :src="content.image" class="carte-image" alt="" />
|
|
<div v-if="content.tags && content.tags.length" class="tags">
|
|
<span v-for="tag in content.tags" :key="tag" class="tag">{{ tag }}</span>
|
|
</div>
|
|
<div v-if="content.intro" class="intro" v-html="content.intro"></div>
|
|
<div v-if="content.markers && content.markers.length" class="markers">
|
|
<div v-for="(marker, idx) in content.markers" :key="idx" class="marker">
|
|
<h5 class="marker-title">
|
|
<img
|
|
v-if="marker.icon"
|
|
:src="marker.icon"
|
|
class="marker-icon"
|
|
:style="{ width: marker.iconSize + 'px', height: marker.iconSize + 'px' }"
|
|
alt=""
|
|
/>
|
|
<img
|
|
v-else
|
|
src="/assets/svg/marker-pin.svg"
|
|
class="marker-icon marker-icon--default"
|
|
alt=""
|
|
/>
|
|
{{ marker.title }}
|
|
</h5>
|
|
<img v-if="marker.cover" :src="marker.cover" class="marker-cover" alt="" />
|
|
<template v-if="marker.blocks">
|
|
<component
|
|
v-for="block in visibleBlocks(marker.blocks)"
|
|
:key="block.id"
|
|
:is="getBlockComponent(block.type)"
|
|
:content="block.content"
|
|
/>
|
|
</template>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div v-else class="block-map">
|
|
<p class="map-placeholder">[Carte: {{ content.map }}]</p>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import TextBlock from './TextBlock.vue';
|
|
import HeadingBlock from './HeadingBlock.vue';
|
|
import ImageBlock from './ImageBlock.vue';
|
|
import ListBlock from './ListBlock.vue';
|
|
import QuoteBlock from './QuoteBlock.vue';
|
|
|
|
defineProps({
|
|
content: {
|
|
type: Object,
|
|
required: true
|
|
}
|
|
});
|
|
|
|
const visibleBlocks = (blocks) => {
|
|
return blocks.filter((block) => !block.isHidden);
|
|
};
|
|
|
|
const getBlockComponent = (type) => {
|
|
const components = {
|
|
text: TextBlock,
|
|
heading: HeadingBlock,
|
|
image: ImageBlock,
|
|
list: ListBlock,
|
|
quote: QuoteBlock,
|
|
};
|
|
return components[type] || TextBlock;
|
|
};
|
|
</script>
|