5f06d8ef11
Replace all usages of legacy `.color-*` and `.text-color-*` SCSS utility classes with inline Tailwind `text-[#hexcode]` arbitrary value classes. Remove the deprecated `src/static/scss/colors.scss` file, and fix minor formatting/indentation issues across multiple component files.
74 lines
2.1 KiB
Vue
74 lines
2.1 KiB
Vue
<template>
|
||
<view class="flex flex-col bg-liner h-screen overflow-hidden">
|
||
<!-- ✅ 顶部固定导航 -->
|
||
<view class="flex-shrink-0">
|
||
<TopNavBar :title="detailTitle" background="transparent" />
|
||
</view>
|
||
|
||
<!-- ✅ 滚动区域 -->
|
||
<scroll-view class="flex-full overflow-hidden" scroll-y>
|
||
<view class="pb-[24px] overflow-hidden">
|
||
<image v-if="coverImage" class="w-full h-auto block" :src="coverImage" mode="widthFix" />
|
||
|
||
<view class="pt-[16px] px-[12px] pb-[24px] border-box">
|
||
<view class="text-[#171717] font-size-16 font-weight-600">{{ detailTitle }}</view>
|
||
|
||
<view v-if="publishTime" class="notice-time-tag flex flex-row flex-items-center mt-16">
|
||
<uni-icons type="clock" size="18" color="#5A6780" />
|
||
<text class="text-[#171717] font-size-12 font-weight-600 ml-8">发布时间：{{ publishTime }}</text>
|
||
</view>
|
||
|
||
<view class="mt-20 pt-[16px] text-[#666666] font-size-14 leading-[20px] border-top">{{ noticeContent }}</view>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import TopNavBar from "@/components/TopNavBar/index.vue";
|
||
import { computed, ref } from "vue";
|
||
import { onLoad } from "@dcloudio/uni-app";
|
||
|
||
const noticeData = ref({});
|
||
|
||
const detailTitle = computed(() => {
|
||
return noticeData.value.entityName?.trim() || "消息详情";
|
||
});
|
||
|
||
const publishTime = computed(() => {
|
||
return noticeData.value.effectiveStartTime?.trim();
|
||
});
|
||
|
||
const coverImage = computed(() => {
|
||
return noticeData.value.imgUrl?.trim();
|
||
});
|
||
|
||
const noticeContent = computed(() => {
|
||
return noticeData.value.eventDescription?.trim();
|
||
});
|
||
|
||
onLoad((query = {}) => {
|
||
if (query.noticeData) {
|
||
try {
|
||
noticeData.value = JSON.parse(decodeURIComponent(query.noticeData));
|
||
} catch (error) {
|
||
console.warn("noticeData parse failed:", error);
|
||
}
|
||
}
|
||
});
|
||
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.notice-time-tag {
|
||
display: inline-flex;
|
||
height: 28px;
|
||
padding: 6px 12px;
|
||
background: linear-gradient(180deg, #f4f7fb 0%, #e9eef6 100%);
|
||
border: 1px solid #d6dde8;
|
||
border-radius: 14px;
|
||
box-sizing: border-box;
|
||
}
|
||
</style>
|