公告问题

src/components/noticeDetail.vue

@@ -7,7 +7,13 @@
     :size="drawerWidth"
     :before-close="handleClose"
   >
-    <div v-html="content"></div>
+    <div class="header">
+      <div>{{data.title}}</div>
+      <div>
+        <span>发布人：{{data.publishUserName}}</span><span>发布时间：{{data.publishTime}}</span>
+      </div>
+    </div>
+    <div v-html="data.content"></div>
     <div style="text-align: center">
       <el-button
         icon="el-icon-back"
@@ -28,7 +34,7 @@
     data() {
       return {
         drawerWidth: document.body.clientWidth - 190 + "px",
-        content:''
+        data:{}
       }
     },
     props: {
@@ -54,9 +60,9 @@
       },
       getInfo() {
         api.info(this.noticeId).then(res => {
-          this.content=res.data.content
+          this.data=res.data
         }).catch(e => {
-          this.content=''
+          this.data={}
         });
       }
     }
@@ -65,6 +71,26 @@
 
 <style lang="less">
   .noticeDetail {
-
+    p{
+      margin: 0;
+    }
+    .header{
+      text-align: center;
+      margin-bottom: 30px;
+      >div:first-child{
+        font-size: 18px;
+        line-height: 20px;
+        font-weight: bold;
+      }
+      >div:last-child{
+        font-size: 14px;
+        color: #999999;
+        margin-top: 15px;
+        line-height: 16px;
+        >span{
+          margin-left: 30px;
+        }
+      }
+    }
   }
 </style>