diff --git a/src/common/lang/en-us.js b/src/common/lang/en-us.js
index e8eaa2c8..4a14d450 100644
--- a/src/common/lang/en-us.js
+++ b/src/common/lang/en-us.js
@@ -501,6 +501,7 @@ module.exports = {
   message: {
     // 我的消息
     my: {
+      myMessage: 'My Message',
       title: 'title',
       publisher: 'publisher',
       readingStatus: 'readingStatus',
diff --git a/src/common/lang/zh-cn.js b/src/common/lang/zh-cn.js
index 333253a4..d589c9f1 100644
--- a/src/common/lang/zh-cn.js
+++ b/src/common/lang/zh-cn.js
@@ -531,6 +531,7 @@ module.exports = {
   message: {
     // 我的消息
     my: {
+      myMessage: '我的消息',
       title: '标题',
       publisher: '发布人',
       readingStatus: '阅读状态',
diff --git a/src/views/system/UserAnnouncementDetail.vue b/src/views/system/UserAnnouncementDetail.vue
index 9c016faa..2b4220d7 100644
--- a/src/views/system/UserAnnouncementDetail.vue
+++ b/src/views/system/UserAnnouncementDetail.vue
@@ -1,6 +1,16 @@
 <template>
-  <internal-detail-page :title="title" :loading="loading" :content-padding="0">
-    {{data}}
+  <internal-detail-page :title="$t('message.my.myMessage')" :loading="loading" :content-padding="0">
+    <div class="container">
+      <div class="msg-header">
+        <div class="title">{{ model.titile }}</div>
+        <div class="subTitle">
+          <span>{{ $t('message.my.notificationTime') }}：{{ model.sendTime }}</span>
+        </div>
+      </div>
+      <div class="msg-content">
+        {{ model.msgContent }}
+      </div>
+    </div>
   </internal-detail-page>
 </template>
 
@@ -12,9 +22,8 @@ export default {
   components: { InternalDetailPage },
   data () {
     return {
-      title: '',
       loading: false,
-      data: {}
+      model: {}
     }
   },
   created () {
@@ -22,14 +31,46 @@ export default {
   },
   methods: {
     initPage () {
-      getMsgDetail({ ids: this.$route.query.id }).then(res => {
-        this.data = res
+      this.loading = true
+      getMsgDetail({ id: this.$route.query.id }).then(res => {
+        if (res.success) {
+          const data = res.result || {}
+          this.model = data
+          this.title = data.titile
+        } else {
+          this.$message.warn(res.message)
+        }
+      }).catch((err) => {
+        this.$message.warn(err)
+      }).finally(() => {
+        this.loading = false
       })
     }
   }
 }
 </script>
 
-<style scoped>
+<style lang="less" scoped>
+.container {
+  margin: 0 90px;
 
+  .msg-header {
+    border-bottom: 1px solid #E5E6EB;
+    .title {
+      margin-top: 30px;
+      font-size: 22px;
+      font-family: PingFang SC-Semibold, PingFang SC, sans-serif;
+      font-weight: 600;
+      color: #1D2129;
+      text-align: center;
+    }
+    .subTitle {
+      text-align: right;
+      line-height: 32px;
+    }
+  }
+  .msg-content {
+    margin-top: 20px;
+  }
+}
 </style>