72 lines
2.6 KiB
Vue
72 lines
2.6 KiB
Vue
<script setup lang="ts">
|
|
/**
|
|
* F006 系统消息 - P1 真 view
|
|
*
|
|
* 走 /user/message/page
|
|
* 真实接口 (2026-08-07 探测: 200, total=112)
|
|
* 字段: id/type/pushType/name/content/readFlag/itemCode/createDate
|
|
*/
|
|
import { onMounted, ref, reactive } from 'vue'
|
|
import { httpGet } from '@/utils/request'
|
|
import DataTable from '@/components/DataTable/DataTable.vue'
|
|
import PageHeader from '@/components/PageHeader/PageHeader.vue'
|
|
|
|
interface Msg {
|
|
id: string
|
|
type: number
|
|
pushType: number | null
|
|
name: string
|
|
content: string
|
|
readFlag: number
|
|
itemCode: string | null
|
|
createDate: string
|
|
}
|
|
|
|
const props = defineProps<{ status?: number }>()
|
|
const list = ref<Msg[]>([])
|
|
const total = ref(0)
|
|
const loading = ref(false)
|
|
const query = reactive({ page: 1, limit: 10 })
|
|
|
|
const READ_MAP: Record<number, { label: string; type: string }> = { 0: { label: '未读', type: 'danger' }, 1: { label: '已读', type: 'success' } }
|
|
|
|
const columns = [
|
|
{ prop: 'id', label: 'ID', width: 90 },
|
|
{ prop: 'name', label: '消息名称', minWidth: 180 },
|
|
{ prop: 'content', label: '内容', minWidth: 280 },
|
|
{ prop: 'readFlag', label: '状态', width: 100, slot: 'read' },
|
|
{ prop: 'createDate', label: '创建时间', width: 180 }
|
|
]
|
|
|
|
async function load() {
|
|
loading.value = true
|
|
try {
|
|
const resp: any = await httpGet('/user/message/page', { page: query.page, limit: query.limit, ...(props.status !== undefined ? { status: props.status } : {}) })
|
|
list.value = resp?.list || []
|
|
total.value = Number(resp?.total || 0)
|
|
} catch { list.value = []; total.value = 0 } finally { loading.value = false }
|
|
}
|
|
function onPageChange(p: number) { query.page = p; load() }
|
|
function onLimitChange(l: number) { query.limit = l; query.page = 1; load() }
|
|
onMounted(load)
|
|
</script>
|
|
|
|
<template>
|
|
<div class="rr-page">
|
|
<PageHeader :title="props.status === 0 ? '待处理消息' : '系统消息'" :sub="`${props.status === 0 ? '待处理' : '站内'}消息 (共 ${total} 条)`" />
|
|
<div class="rr-card">
|
|
<DataTable :columns="columns" :data="list"
|
|
:borderless="true" :loading="loading" :total="total" :page="query.page" :limit="query.limit" :show-pagination="true" row-key="id" empty-text="暂无消息" @page-change="onPageChange"
|
|
@limit-change="onLimitChange">
|
|
<template #read="{ row }">
|
|
<el-tag :type="READ_MAP[row.readFlag]?.type || 'info'">{{ READ_MAP[row.readFlag]?.label || row.readFlag }}</el-tag>
|
|
</template>
|
|
</DataTable>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped lang="scss">
|
|
.rr-page { max-width: 1400px; }
|
|
.rr-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; }
|
|
</style> |