49c946dd55
将管理后台功能从微信小程序中剥离，独立为Vue.js前端项目admin-web Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
57 lines
1.6 KiB
Vue
57 lines
1.6 KiB
Vue
<template>
|
||
<div class="container">
|
||
<section class="hero fade-up">
|
||
<div class="hero-badge">INBOX</div>
|
||
<h1 class="hero-title">用户私信收件箱</h1>
|
||
<p class="hero-sub">仅展示通过检测后成功送达的私信内容。</p>
|
||
</section>
|
||
|
||
<section class="card fade-up fade-up-delay-1" v-if="list.length">
|
||
<div class="card-title">私信列表</div>
|
||
<div class="list-item" v-for="item in list" :key="item.id">
|
||
<div class="item-title">{{ item.text }}</div>
|
||
<div class="item-sub">发送人：{{ item.nickname || item.username }}（{{ item.username }}）</div>
|
||
<div class="row">
|
||
<span class="label">发送时间</span>
|
||
<span class="value">{{ item.created_text }}</span>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="card fade-up fade-up-delay-1" v-else>
|
||
<div class="empty">{{ loading ? '加载中...' : '暂无私信内容。' }}</div>
|
||
</section>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { request } from '@/utils/request'
|
||
|
||
export default {
|
||
name: 'InboxView',
|
||
data() {
|
||
return {
|
||
loading: false,
|
||
list: []
|
||
}
|
||
},
|
||
mounted() {
|
||
this.fetchList()
|
||
},
|
||
methods: {
|
||
async fetchList() {
|
||
this.loading = true
|
||
try {
|
||
const data = await request({ url: '/content/posts/inbox', params: { page: 1, page_size: 80 } })
|
||
this.list = (data.items || []).map((item) => ({
|
||
...item,
|
||
created_text: (item.created_at || '').replace('T', ' ').slice(0, 19)
|
||
}))
|
||
} finally {
|
||
this.loading = false
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|