Files
guangan-mp/pages/news/detail.vue
2025-06-16 10:09:19 +08:00

78 lines
1.8 KiB
Vue

<template>
<view class="px-3">
<i-loading v-if="loading" />
<view class="mt-2 font40 line15">{{newsInfo.title}}</view>
<view class="bg-hover-light p-2 mt-2 rounded flex align-center justify-between flex-wrap font24">
<view class="flex align-center">
<uni-icons type="contact" size="16" color="#cccccc"></uni-icons>
<text class="font24 text-muted">{{newsInfo.author}}</text>
</view>
<view class="flex align-center">
<uni-icons type="eye" size="16" color="#cccccc"></uni-icons>
<text class="font24 text-muted">{{newsInfo.view_count}}</text>
</view>
<view class="flex align-center">
<uni-icons type="calendar" size="16" color="#cccccc"></uni-icons>
<text class="font24 text-muted">{{newsInfo.publish_at}}</text>
</view>
</view>
<view class="mt-2">
<u-parse :content="content" @preview="preview" @navigate="navigate"></u-parse>
</view>
</view>
</template>
<script>
import { friendlyDate } from '../../common/util';
import {
TaAjax
} from '@/common/ajax'
export default {
data() {
return {
id: 0,
content: "",
newsInfo: {
title: "",
from: "",
source: "",
publish_at: "",
view_count: 0,
},
loading: true
}
},
onLoad(params) {
this.id = params.id
this.loading = true;
TaAjax.get('/cms/api.article/info', {
id: this.id
}).then((response) => {
const data = response.data;
this.content = data.content;
uni.setNavigationBarTitle({
title: data.title
});
data.publish_at = friendlyDate((new Date(data.publish_at.replace(/\-/g, '/')).getTime()))
this.newsInfo = data;
}).catch((e) => {
console.warn(e)
}).finally(() => {
this.loading = false;
})
},
methods: {
preview(src, e) {
// do something
},
navigate(href, e) {
// do something
},
},
}
</script>
<style>
</style>