You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
95 lines
3.0 KiB
95 lines
3.0 KiB
<template>
|
|
<div class="app-container">
|
|
<el-row :gutter="20">
|
|
<splitpanes :horizontal="this.$store.getters.device === 'mobile'" class="default-theme">
|
|
<!--设备档案-->
|
|
<pane size="84">
|
|
<el-col>
|
|
<el-table v-loading="loading" :data="dataList">
|
|
<el-table-column type="selection" width="50" align="center" />
|
|
<el-table-column
|
|
label="序号"
|
|
width="60"
|
|
type="index"
|
|
></el-table-column>
|
|
<el-table-column label="消息ID" align="center" key="id" prop="id" width="80" />
|
|
<el-table-column label="用户ID" align="center" key="userId" prop="userId" width="80" />
|
|
<el-table-column label="消息内容" align="center" key="content" prop="content" :show-overflow-tooltip="true">
|
|
<template slot-scope="scope">
|
|
<span>{{ scope.row.content || '--' }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="消息状态" align="center" key="status" prop="status" width="100">
|
|
<template slot-scope="scope">
|
|
<el-tag :type="scope.row.status === 'unread' ? 'primary' : 'success'">
|
|
{{ scope.row.status === 'unread' ? '未读' : '已读' }}
|
|
</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="标题" align="center" key="title" prop="title" :show-overflow-tooltip="true">
|
|
<template slot-scope="scope">
|
|
<span>{{ scope.row.title || '--' }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
|
<template slot-scope="scope">
|
|
<span>{{ parseTime(scope.row.createTime) }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
|
|
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
|
|
</el-col>
|
|
</pane>
|
|
</splitpanes>
|
|
</el-row>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { messageList } from "@/api/message/index"
|
|
import { Splitpanes, Pane } from "splitpanes"
|
|
import "splitpanes/dist/splitpanes.css"
|
|
|
|
export default {
|
|
name: "Message",
|
|
components: { Splitpanes, Pane },
|
|
data() {
|
|
return {
|
|
// 遮罩层
|
|
loading: true,
|
|
|
|
|
|
// 总条数
|
|
total: 0,
|
|
// 消息数据列表
|
|
dataList: [],
|
|
// 查询参数
|
|
queryParams: {
|
|
pageNum: 1,
|
|
pageSize: 10,
|
|
status: undefined
|
|
},
|
|
|
|
}
|
|
},
|
|
|
|
created() {
|
|
this.getList()
|
|
},
|
|
methods: {
|
|
/** 查询设备列表 */
|
|
getList() {
|
|
this.loading = true
|
|
messageList(this.queryParams).then(response => {
|
|
this.dataList = response.rows || []
|
|
this.total = response.data?.length || 0
|
|
this.loading = false
|
|
}
|
|
)
|
|
},
|
|
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|