<template>
|
<div :class="['rich-edit-content', size]">
|
<template v-for="(item, index) in content" :key="index">
|
<AutoWidthImage
|
v-if="item.type === EditorType.Image"
|
wrapperClassName="rich-content-item rich-content-image-item"
|
:src="setOSSLink(item.path)"
|
/>
|
<Video
|
v-else-if="item.type === EditorType.Video"
|
class="rich-content-item rich-content-video-item"
|
:src="setOSSLink(item.path)"
|
></Video>
|
<RichEditorContent
|
v-else-if="item.type === EditorType.Rich || item.type === EditorType.WXContent"
|
:content="item.content"
|
></RichEditorContent>
|
<div v-else class="rich-content-item rich-content-text-item">
|
{{ item.content }}
|
</div>
|
</template>
|
</div>
|
</template>
|
|
<script setup lang="ts">
|
import { AutoWidthImage } from '@12333/components';
|
import { EditorType } from '@12333/constants';
|
import { setOSSLink } from '@12333/utils';
|
import { Video } from '@tarojs/components';
|
import RichEditorContent from '../RichEditor/RichEditorContent.vue';
|
// import {} from '@nutui/nutui-taro/dist/packages/video'
|
|
defineOptions({
|
name: 'RichContent',
|
});
|
|
type Props = {
|
content?: API.IntroInfo[];
|
size?: 'small' | 'default' | 'large';
|
};
|
|
const props = withDefaults(defineProps<Props>(), {
|
content: () => [],
|
size: 'default',
|
});
|
</script>
|
