<template>
    <div>
        <div
            class="mt-10px shadow-default bg-white pl-35px pr-30px pr-35px h-60px rounded-10px relative flex items-center justify-between">
            <h3 class="nav-title"> 名师工作室 - <span>{{ detailData.tmt_cymc }}</span> - <span>{{ title }}</span> - <span
                    class="text-18px font-medium">{{ detailData.tmg_title
                    }}</span></h3>
            <div class="btnDiv">
                <el-button size="large" @click="linkBack" class="w-100px">返回
                </el-button>
            </div>
        </div>
        <div class="shadow-default bg-white rounded-10px py-34px px-106px mt-5">
            <h3 class="text-20px font-mudiem text-center">{{ detailData.tmg_title }}</h3>
            <div class="flex justify-center text-gray-400 text-14px my-15px">
                <p class="mr-5">发布人: {{ detailData.tmg_fbr }}</p>
                <p class="ml-5" v-if="detailData.tmg_fbsj_datetime">发布时间: {{ detailData.tmg_fbsj_datetime.split(' ')[0] }}
                </p>
            </div>
            <div v-html="detailData.tmg_content" class="indent"></div>
        </div>
    </div>
</template>
<script setup>
import { useRoute, useRouter } from 'vue-router';
import { gwz_detail } from './api';
const route = useRoute();
const router = useRouter();
let tmg_lb = route.params.type;
let tmg_id = route.params.tmg_id
let title = $ref('');
title = tmg_lb == '3' ? '资讯' : (tmg_lb == '1' ? '公告' : '文章');
let detailData = $ref({});
gwz_detail({ tmg_id }).then(res => {
    if (res.code == '1') {
        detailData = res.data.one_info;
    }
})
const linkBack = () => {
    router.back();
}
</script>
<style lang="scss" scoped>
$color: #1259A1;

.color {
    color: $color;
}

.btnDiv {
    .el-button {
        background: $color;
        border-color: $color;
        color: #fff;
    }
}

.shadow-default {
    box-shadow: 0 10px 24px rgba(161, 153, 168, 0.18);
}
</style>