From b15a997e95d715c41df3a76aecbf58ec1141ab53 Mon Sep 17 00:00:00 2001
From: qiyunfeng-create <1940665526@qq.com>
Date: 星期四, 21 八月 2025 18:37:17 +0800
Subject: [PATCH] 个人中心-接口测试
---
src/views/personalCenter/myMessage.vue | 205 +++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 204 insertions(+), 1 deletions(-)
diff --git a/src/views/personalCenter/myMessage.vue b/src/views/personalCenter/myMessage.vue
index ad630af..9d87747 100644
--- a/src/views/personalCenter/myMessage.vue
+++ b/src/views/personalCenter/myMessage.vue
@@ -1,3 +1,206 @@
<template>
- <div>鎴戠殑娑堟伅</div>
+ <!-- <page> -->
+ <div class="personalPage-box">
+ <div class="personalPage-title">鎴戠殑娑堟伅</div>
+ <div class="personalPage-content">
+ <div class="list-box" v-loading="pages.loading">
+ <ul class="listTable" v-if="dataList.length > 0 && !pages.loading">
+ <li v-for="(item, index) in dataList" :key="index" class="body flex">
+ <div class="icon">
+ <img src="@/assets/images/personalCenter/notification.svg" alt="star" />
+ </div>
+ <div class="flex1 ai-c">
+ <p class="title hover" :title="item.name" @click="viewDetail(item)">
+ {{ item.name }}
+ </p>
+ <p class="content" :title="item.description">{{ item.description }}</p>
+ </div>
+ <span class="createDate">{{ item.createDate }}</span>
+ </li>
+ </ul>
+ <div v-if="dataList.length == 0 && !pages.loading">
+ <el-empty :image-size="200" description="鏆傛棤鏁版嵁" />
+ </div>
+ </div>
+ <div class="pagination-box" v-if="dataList.length > 0 && !pages.loading">
+ <el-pagination
+ v-model:current-page="pages.page"
+ v-model:page-size="pages.pageSize"
+ layout="total, prev, pager, next"
+ :total="pages.count"
+ @current-change="handleCurrentChange"
+ />
+ </div>
+ </div>
+ <el-dialog align-center v-model="detailDialog" title="娑堟伅" class="messageDialog">
+ <div>
+ <div class="title">{{ dataInfo.name }}</div>
+ <div class="content" v-html="dataInfo.content"></div>
+ </div>
+ </el-dialog>
+ </div>
+ <!-- </page> -->
</template>
+
+<script setup lang="ts">
+import { reactive, ref, onMounted, inject, watch } from "vue";
+import moment from "moment";
+import { useUserStore } from "@/store";
+const userStore = useUserStore();
+const MG: any = inject("MG");
+const config: any = inject("config");
+let dataList = ref([]);
+let pages = reactive({
+ page: 1,
+ pageSize: 10,
+ count: 0,
+ loading: false,
+});
+const detailDialog = ref(false);
+let dataInfo = reactive({
+ name: "",
+ content: "",
+});
+
+function getDataList() {
+ pages.loading = true;
+ MG.app
+ .getAppMessageList({
+ appRefCode: config.appRefCode,
+ start: (pages.page - 1) * pages.pageSize,
+ size: pages.pageSize,
+ sort: {
+ type: "Desc",
+ field: "CreateDate",
+ },
+ })
+ .then((res) => {
+ pages.count = res.totalSize;
+ res.datas.forEach((item) => {
+ item.createDate = moment(item.createDate).format("YYYY-MM-DD HH:mm:ss");
+ });
+ dataList.value = res.datas;
+ pages.loading = false;
+ })
+ .catch(() => {
+ pages.loading = false;
+ });
+}
+onMounted(() => {
+ getDataList();
+});
+
+watch(
+ () => userStore?.token,
+ () => {
+ getDataList();
+ }
+);
+
+const handleCurrentChange = (val: number) => {
+ pages.page = val;
+ getDataList();
+};
+
+function viewDetail(data) {
+ MG.app
+ .getMessage({
+ messageId: data.id,
+ })
+ .then((res) => {
+ if (res) {
+ dataInfo.name = res.name;
+ dataInfo.content = res.content;
+ detailDialog.value = true;
+ }
+ });
+}
+</script>
+<style lang="less" scoped>
+.listTable {
+ .body {
+ padding: 15px 0;
+ border-bottom: 1px solid #ededed;
+
+ .icon {
+ width: 36px;
+
+ img {
+ margin-top: 2px;
+ width: 22px;
+ height: 22px;
+ }
+ }
+
+ .title {
+ font-weight: bold;
+ line-height: 24px;
+ height: 24px;
+ display: -webkit-box;
+ -webkit-box-orient: vertical;
+ -webkit-line-clamp: 1;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+
+ .content {
+ height: 45px;
+ line-height: 24px;
+ display: -webkit-box;
+ margin: 5px 0;
+ -webkit-box-orient: vertical;
+ -webkit-line-clamp: 2;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+
+ .createDate {
+ line-height: 24px;
+ padding-left: 20px;
+ color: #949494;
+ }
+ }
+}
+
+.list-box {
+ min-height: 570px;
+}
+
+.pagination-box {
+ display: flex;
+ justify-content: center;
+}
+
+.messageDialog {
+ width: 600px;
+
+ .title {
+ line-height: 22px;
+ font-weight: bold;
+ }
+
+ .content {
+ margin-top: 10px;
+ line-height: 22px;
+ }
+}
+</style>
+<style lang="less">
+.messageDialog {
+ .el-dialog__header {
+ padding: 15px;
+ margin-right: 0;
+ border-bottom: 1px solid #f4f4f4;
+ }
+
+ .el-dialog__title {
+ font-weight: bold;
+ font-size: 16px;
+ }
+
+ .el-dialog__headerbtn {
+ top: 6px;
+ right: 6px;
+ }
+}
+</style>
--
Gitblit v1.9.1