<template>
     <div class="promotion-page">
        <div style="background-color: #1e1e1e;padding: 16px 10px;border-radius: 6px;">
            <el-page-header @back="goBack">
            <template #content>
                <span class="text-large font-600 mr-3"> {{ t('优惠活动详情') }} </span>
            </template>
        </el-page-header>
        </div>
        <div style="overflow-y: auto;height: 100%;margin-top: 20px;background-color: #1e1e1e;border-radius: 6px;">
            <div v-html="content">

            </div>
        </div>
     </div>
   
</template>

<script setup>
import { useI18n } from 'vue-i18n'
import { getActivityInfo } from '@/request/api'

const {t} = useI18n()
const route = useRoute();
const router = useRouter();
const content = ref()


 getActivityInfo({id: route.query.id}).then((res) => {
            // 将常见的 HTML 实体字符还原为真实标签
        content.value = res.data.content
                .replace(/&lt;/g, '<')
                .replace(/&gt;/g, '>')
                .replace(/&nbsp;/g, ' ')
                .replace(/&amp;/g, '&')
                .replace(/&quot;/g, '"')
                .replace(/<\/?p[^>]*>/gi, '')
                .replace(/<\/?br[^>]*>/gi, '');
    })

function goBack() {
    router.back();
}
</script>

<style lang="scss" scoped>
.promotion-page {
    max-width: 1200px;
    width: 90%;
    
    height: calc(100% - 100px);
    margin: 10px auto;
    border-radius: 6px;
    box-sizing: border-box;
    padding: 10px;
}
</style>