修改

src/api/course/index.js

@@ -360,6 +360,30 @@ export function GetMyNoticePageList(data) {
   })
 }
 
+/**
+ * 获取公告弹窗详情
+ */
+export function GetNoticeInfo(data) {
+  return request({
+    url: "/UserCenter/GetNoticeInfo",
+    method: 'post',
+    data
+  })
+}
+
+/**
+ *  修改弹窗公告状态
+ */
+export function SetNoticeOperation(data) {
+  return request({
+    url: "/UserCenter/SetNoticeOperation",
+    method: 'post',
+    data
+  })
+}
+
+
+
 
 
   
\ No newline at end of file

src/boot/permission.js

@@ -8,7 +8,7 @@ LoadingBar.setDefaults({
     position: "bottom"
 });
 let loadAsyncRouter = false;
-const whiteList = ["/login", "/", "/contractConfirm"]; // 不重定向白名单
+const whiteList = ["/login", "/", "/contractConfirm", "contractView","noticeView"]; // 不重定向白名单
 router.beforeEach((to, from, next) => {
     localStorage.setItem("routerBefore", from.path);
     LoadingBar.start();

src/components/course/notice-form.vue

@@ -106,23 +106,24 @@
         <div class="notice_dix" style="margin-top:20px;">
           <div>
             <div class="noticeFile" v-if="dataList[0].fileList.length>0">
-              <span v-for="item in dataList[0].fileList"><i class="iconfont icon-Download"
-                  style="margin-right:5px;"></i>关于2021年春节放假通知.jpg</span>
+              <span v-for="item in dataList[0].fileList" style="cursor:pointer;" @click="downFiles(item)">
+                <i class="iconfont icon-Download"
+                  style="margin-right:5px;"></i>{{item.FileName}}</span>
             </div>
           </div>
           <div style="margin-top:5px;">
             <div class="notice_Page" style="margin-right:10px;">
               <img v-if="setingObj.PageIndex==1" src="../../assets/images/arrowLeft2.png" />
-              <img v-else src="../../assets/images/arrowLeft1.png" />
+              <img @click="goBefore" v-else src="../../assets/images/arrowLeft1.png" />
             </div>
             <div class="notice_Page">
-              <img v-if="setingObj.PageCount==setingObj.Count" src="../../assets/images/arrowRight2.png" />
-              <img v-else src="../../assets/images/arrowRight2.png" />
+              <img v-if="setingObj.PageIndex==setingObj.Count" src="../../assets/images/arrowRight2.png" />
+              <img @click="goAfter" v-else src="../../assets/images/arrowRight1.png" />
             </div>
           </div>
         </div>
-        <q-btn label="查看详情" color="accent q-px-md" style="font-weight:400 !important;margin:30px 0 10px 40%;"
-          @click="goDetail" />
+        <q-btn label="查看详情" color="accent q-px-md" style="font-weight:400 !important;margin:30px 0 0 40%;"
+          @click="goDetail()" />
       </div>
       <q-card-actions align="right" class="bg-white">
         <q-btn label="取消" flat color="grey-10" style="font-weight:400 !important" @click="closeSaveForm" />
@@ -131,6 +132,10 @@
   </q-dialog>
 </template>
 <script>
+  import {
+    downloadLocalFile
+  } from '../../api/common/common'
+
   export default {
     props: {
       setingObj: {
@@ -145,11 +150,18 @@
       }
     },
     created() {
-      if (this.setingObj) {
-        this.dataList = this.setingObj.PageData;
+
+    },
+    watch: {
+      setingObj: {
+        handler(newValue) {
+          if (this.setingObj) {
+            this.dataList = this.setingObj.PageData;
+          }
+        },
+        immediate: true
       }
     },
-
     mounted() {},
     methods: {
       //关闭弹窗
@@ -159,7 +171,26 @@
       },
       //查看详情
       goDetail() {
-
+       let routeUrl = this.$router.resolve({
+         path: "/noticeView",
+         query: {NoticeId:this.dataList[0].Id}
+       });
+       window.open(routeUrl.href, '_blank');
+      },
+      //下载文件
+      downFiles(item){
+        const link = document.createElement('a')
+        link.setAttribute("download", item.FileName) //下载的文件名
+        link.href = item.FileUrl   //文件url
+        link.click()
+      },
+      //往后翻页
+      goAfter(){    
+        this.$emit('fathergoAfter');  
+      },
+      //往前翻
+      goBefore(){
+        this.$emit('fathergoBefore');  
       }
     },
   }

src/components/global/notify.vue

@@ -44,25 +44,30 @@
           <none-data v-else></none-data>
         </q-tab-panel>
         <q-tab-panel name="notify" class="scroll _scrollbar">
-          <q-card flat class="relative-position overflow-hidden q-pa-md text-grey-1 cursor-pointer q-mb-md"
-            style="height:130px" @click="undefinedGongneng">
+          <q-card flat v-for="(item,index) in noticeList" :key="index" class="relative-position overflow-hidden q-pa-md text-grey-1 cursor-pointer q-mb-md"
+            style="height:130px" @click="goNoticeDetail(item)">
             <div class="gonggao-bg">
               <img src="../../assets/images/noticeBg.png" />
             </div>
             <div class="flex row items-center relative-position">
               <q-avatar size="30px" font-size="14px" rounded style="background:#C9F7F5" class="q-mr-md"
                 text-color="secondary">
-                <img :src="showObj.UserIcon" v-if="showObj.UserIcon">
-                <span v-else>{{showObj.AccountName.substring(0,1)}}</span>
+                <img :src="item.UpdateByIcon" v-if="item.UpdateByIcon">
+                <span v-else>{{item.UpdateByName.substring(0,1)}}</span>
               </q-avatar>
-              <div>{{showObj.AccountName}}</div>
-              <div class="remark-font col text-right text-grey-3">5天前</div>
+              <div>{{item.UpdateByName}}</div>
+              <div class="col text-right">{{item.DayStr}}</div>
             </div>
             <div class="ellipsis relative-position q-mt-md" style="font-size:16px;">
-              关于2021年春节放假的相关通知与安排关于2021年春节放假的相关通知与安排
+              {{item.Title}}
+            </div>
+            <div class="relative-position q-mt-md text-right">
+                甲鹤行{{item.Number}}
             </div>
-            <div class="relative-position q-mt-md text-right text-grey-2 remark-font">甲鹤行2021-A-001</div>
           </q-card>
+          <div class="notifyLoadMore" v-if="noticeMsg.pageSize<Count" @click="getMoreNotify()">
+            <span>加载更多</span>
+          </div>
         </q-tab-panel>
         <q-tab-panel name="work" class="scroll _scrollbar">
           <none-data></none-data>
@@ -236,8 +241,10 @@
         //通知请求参数
         noticeMsg:{
           pageIndex:1,
-          pageSize:5
+          pageSize:1
         },
+        Count:0,
+        noticeList:[]
       }
     },
     created() {
@@ -275,12 +282,24 @@
         GetMyNoticePageList(this.noticeMsg).then(res => {
           if (res.Code == 1) {
             console.log(res, 'notice数据');
-            // this.noticeObj = res.Data;
-            // if (res.Data.PageData.length > 0) {
-            //   this.isShowNotice = true;
-            // }
+            this.noticeList = res.Data.PageData;
+            this.Count = res.Data.Count;
           }
         })
+      },
+      //加载更多一次加载一条
+      getMoreNotify(){
+        this.noticeMsg.pageSize++;
+        this.getNotify();
+      },
+      //跳转详情
+      goNoticeDetail(item){
+       var url = window.location.host;    
+       let routeUrl = this.$router.resolve({
+         path: "/noticeView",
+         query: {NoticeId:item.Id}
+       });
+       window.open(routeUrl.href, '_blank');
       }
     },
   }
@@ -321,5 +340,10 @@
     margin-top: -8%;
     margin-left: -5%;
   }
-
+  .notifyLoadMore{
+    text-align:right;
+    cursor: pointer;
+    font-size:12px;
+    color:#2961FE;
+  }
 </style>

src/pages/Work.vue

@@ -43,7 +43,7 @@
       <teachplan></teachplan>
     </div>
     <!-- zk新增公告弹窗 -->
-    <notice-form v-if="isShowNotice" :seting-obj="noticeObj" @close="closeNoticeForm">
+    <notice-form v-if="isShowNotice" @fathergoBefore="fathergoBefore" @fathergoAfter="fathergoAfter" :seting-obj="noticeObj" @close="closeNoticeForm">
     </notice-form>
 
   </div>
@@ -86,7 +86,8 @@
           LookTime:""
         },
         isShowNotice:false,
-        noticeObj:{}
+        noticeObj:{},
+        TimeList:[], //存放时间作为比较
       }
     },
     created() {
@@ -111,7 +112,10 @@
          {label: '备课管理', value: 'two'},
        ];
      }
-
+     var notifyTime = window.localStorage.getItem('notifyTime');
+     if(notifyTime){
+      this.noticeMsg.LookTime = notifyTime;
+     }
      this.getNoticeList();
     },
     methods:{
@@ -136,17 +140,36 @@
       getNoticeList(){
         GetMyNoticePageList(this.noticeMsg).then(res => {
           if (res.Code == 1) {
-            console.log(res,'数据');
             this.noticeObj = res.Data;
             if(res.Data.PageData.length>0){
               this.isShowNotice=true;
             }
+            this.TimeList.push(new Date(res.Data.PageData[0].UpdateTimeStr));
+            var maxDate=new Date(Math.max.apply(null,this.TimeList));
+            var date = new Date(maxDate);
+            var y = date.getFullYear();
+            var m = date.getMonth() + 1;
+            m = m < 10 ? ('0' + m) : m;
+            var d = date.getDate();
+            d = d < 10 ? ('0' + d) : d;
+            var notifyData = y+'-'+m+'-'+d;
+            localStorage.setItem("notifyTime", notifyData);
           }
         })
       },
       //关闭公告弹窗
       closeNoticeForm(){
         this.isShowNotice=false;
+      },
+      //向后翻页
+      fathergoAfter(){
+        this.noticeMsg.pageIndex++;
+        this.getNoticeList();
+      },
+      //往回翻页
+      fathergoBefore(){
+        this.noticeMsg.pageIndex--;
+        this.getNoticeList();
       }
     }
   }

src/pages/noticeView.vue

+<style>
+  .noticeView {
+    width: 1200px;
+    margin: auto;
+  }
+
+  .noticeView .noticeContent {
+    width: 100%;
+    min-height: 300px;
+    padding: 20px;
+  }
+
+  .noticeView .notice_dix {
+    display: flex;
+    justify-content: space-between;
+    font-size: 14px;
+  }
+
+  .noticeView .noticeBlue {
+    color: #2961FE;
+    font-weight: bold;
+  }
+
+  .noticeView .notice_Span {
+    color: #111111;
+    font-weight: bold;
+  }
+
+  .noticeView .noticeViewTitle {
+    width: 100%;
+    text-align: center;
+    font-size: 28px;
+    color: #000000;
+    margin-top: 20px;
+    font-weight: Medium;
+  }
+
+  .noticeView .notiveViewInner {
+    margin-top: 20px;
+    color: #333333;
+    font-size: 15px;
+    line-height: 26px;
+  }
+
+</style>
+<template>
+  <div class="noticeView">
+    <div class="noticeTopBg">
+      <img style="width:100%;height:100%;" src="../assets/images/noticeBigBg.png" />
+    </div>
+    <div class="noticeContent">
+      <div class="notice_dix">
+        <div>
+          <span class="noticeBlue">Fr：</span>
+          <span class="notice_Span">{{dataList.From}}</span>
+        </div>
+        <div>
+          <span class="noticeBlue">编号：</span>
+          <span class="notice_Span">{{dataList.Number}}</span>
+        </div>
+      </div>
+      <div style="margin:10px 0;">
+        <div>
+          <span class="noticeBlue">To：</span>
+          <span class="notice_Span">
+            <span v-for="(item,index) in dataList.toList">{{item.DeptName}}
+              <template v-if="index!=dataList.toList.length-1">、</template>
+            </span>
+          </span>
+        </div>
+      </div>
+      <div>
+        <div>
+          <span class="noticeBlue">Cc：</span>
+          <span class="notice_Span">
+            <span v-for="(item,index) in dataList.ccList">{{item.EmName}}
+              <template v-if="index!=dataList.ccList.length-1">、</template>
+            </span>
+          </span>
+        </div>
+      </div>
+      <div style="margin:5px 0;">
+        <div>
+          <span class="noticeBlue">Time：</span>
+          <span class="notice_Span">{{dataList.UpdateTime}}</span>
+        </div>
+      </div>
+      <div class="noticeViewTitle">{{dataList.Title}}</div>
+      <div class="notiveViewInner" v-html="dataList.Content">
+
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+  import {
+    SetNoticeOperation,
+    GetNoticeInfo
+  } from '../api/course/index'
+
+  export default {
+    data() {
+      return {
+        infoMsg: {
+          NoticeId: 0
+        },
+        noticeMsg: {
+          NoticeId: 0,
+          Type: 5
+        },
+        dataList: {}
+      }
+    },
+    created() {},
+
+    mounted() {
+      if (this.$route.query.NoticeId) {
+        this.infoMsg.NoticeId = this.$route.query.NoticeId;
+        this.noticeMsg.NoticeId = this.$route.query.NoticeId;
+        this.getList();
+        this.SetOperation();
+      }
+    },
+    methods: {
+      //关闭弹窗
+      getList() {
+        GetNoticeInfo(this.infoMsg).then(res => {
+          if (res.Code == 1) {
+            this.dataList = res.Data;
+          }
+        })
+      },
+      //查看详情
+      SetOperation() {
+        SetNoticeOperation(this.noticeMsg).then(res => {
+          if (res.Code == 1) {
+            
+          }
+        })
+      }
+    },
+  }
+
+</script>