|
|
<script setup>
|
|
|
/**
|
|
|
* name：
|
|
|
* user：sa0ChunLuyu
|
|
|
* date：2023年6月6日 11:01:06
|
|
|
*/
|
|
|
import {
|
|
|
ref
|
|
|
} from 'vue'
|
|
|
import {
|
|
|
$response,
|
|
|
PostInfoAction,
|
|
|
} from '@/api'
|
|
|
import {
|
|
|
onShow
|
|
|
} from '@dcloudio/uni-app'
|
|
|
const $props = defineProps({
|
|
|
id: {
|
|
|
type: String,
|
|
|
default: '0'
|
|
|
}
|
|
|
});
|
|
|
const post_info = ref(false)
|
|
|
const PostInfo = async () => {
|
|
|
const response = await PostInfoAction({
|
|
|
...$props
|
|
|
})
|
|
|
$response(response, () => {
|
|
|
post_info.value = response.data.info
|
|
|
post_info.value.content = post_info.value.content.replace(/<img/gi,
|
|
|
'<img style="max-width:80%;height:auto;display: block;margin: 0 auto;" ')
|
|
|
document.title = post_info.value.title
|
|
|
uni.setNavigationBarTitle({
|
|
|
title: post_info.value.title
|
|
|
})
|
|
|
})
|
|
|
}
|
|
|
//设置灰度
|
|
|
const SysGreyType=ref(0)
|
|
|
const GetGreySet=()=>{
|
|
|
uni.getStorage({
|
|
|
key: 'SysGreytype',
|
|
|
success: function (res) {
|
|
|
console.log(res.data);
|
|
|
if(res.data==1){
|
|
|
SysGreyType.value=1
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
onShow(() => {
|
|
|
GetGreySet()
|
|
|
PostInfo()
|
|
|
})
|
|
|
</script>
|
|
|
<template>
|
|
|
<view>
|
|
|
<view class="top_line_wrapper" :class="SysGreyType==1? 'grey' :''"></view>
|
|
|
<view v-if="!!post_info" :class="SysGreyType==1? 'grey' :''">
|
|
|
<view class="post_title_wrapper">
|
|
|
{{ post_info.title }}
|
|
|
</view>
|
|
|
<view class="post_box_wrapper">
|
|
|
<view class="post_info_wrapper">
|
|
|
<view class="post_author_wrapper">{{ post_info.author }}</view>
|
|
|
<view class="post_break_wrapper"></view>
|
|
|
<view class="post_date_wrapper">{{ post_info.date }}</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="post_line_wrapper"></view>
|
|
|
<view class="post_content_wrapper" v-html="post_info.content"></view>
|
|
|
</view>
|
|
|
<view class="blank_wrapper"></view>
|
|
|
</view>
|
|
|
</template>
|
|
|
<style>
|
|
|
page {
|
|
|
background: #ffffff;
|
|
|
}
|
|
|
</style>
|
|
|
<style scoped>
|
|
|
.grey{
|
|
|
filter: grayscale(100%);
|
|
|
}
|
|
|
.post_content_wrapper {
|
|
|
width: 666rpx;
|
|
|
font-size: 27rpx;
|
|
|
font-weight: 400;
|
|
|
color: #525252;
|
|
|
line-height: 46rpx;
|
|
|
margin: 30rpx auto 0;
|
|
|
}
|
|
|
|
|
|
.post_line_wrapper {
|
|
|
width: 750rpx;
|
|
|
height: 1rpx;
|
|
|
background: #D1D1D1;
|
|
|
margin-top: 30rpx;
|
|
|
}
|
|
|
|
|
|
.post_date_wrapper {
|
|
|
margin-left: 18rpx;
|
|
|
font-size: 21rpx;
|
|
|
font-weight: 400;
|
|
|
color: #AFAFAF;
|
|
|
line-height: 1;
|
|
|
}
|
|
|
|
|
|
.post_break_wrapper {
|
|
|
width: 2rpx;
|
|
|
height: 22rpx;
|
|
|
background: #DBDBDB;
|
|
|
margin-left: 24rpx;
|
|
|
}
|
|
|
|
|
|
.post_box_wrapper {
|
|
|
display: inline-block;
|
|
|
margin-left: 35rpx;
|
|
|
}
|
|
|
|
|
|
.post_info_wrapper {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
background: #E6F8FA;
|
|
|
border-radius: 5rpx;
|
|
|
padding: 5rpx 10rpx;
|
|
|
font-size: 23rpx;
|
|
|
font-weight: 500;
|
|
|
color: #6C6C6C;
|
|
|
line-height: 1;
|
|
|
}
|
|
|
|
|
|
.post_title_wrapper {
|
|
|
width: 655rpx;
|
|
|
font-size: 34rpx;
|
|
|
font-weight: 400;
|
|
|
color: #000000;
|
|
|
line-height: 48rpx;
|
|
|
margin: 10rpx auto 0;
|
|
|
overflow-wrap: break-word;
|
|
|
word-wrap: break-word;
|
|
|
}
|
|
|
</style> |