日历学校筛选

TEAMModelOS.SmartClass/ClientApp/components/smart-class/headers.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="headerContainer">
     <div class="header center-row">
-      <img src="../../assets/image/e_logo.png" style="width:150px" />
+      <img src="../../assets/image/e_logo3.png" style="width:150px" />
       <ul>
         <li :class="this.$route.path ==  '/main/index' || activeIndex == 0 ? 'li-active':''" @click="handleMenuClick(0,'index')">首页</li>
         <li :class="this.$route.path ==  '/main/notice' || activeIndex == 1? 'li-active':''" @click="handleMenuClick(1,'notice')">通知公告</li>

TEAMModelOS.SmartClass/ClientApp/view/smart-class/LiveBroadcast.vue

@@ -3,9 +3,13 @@
     <div class="review-main">
       <div class="condition-wrap">
         <!--<div class="condition-wrap-left">
-          <Button type="primary">新媒体新技术</Button>
-          <Button type="success">创新实验室</Button>
-        </div>-->
+    <Button type="primary">新媒体新技术</Button>
+    <Button type="success">创新实验室</Button>
+  </div>-->
+
+        <Select v-model="selectSchool" style="width:200px" @on-change="chooseSchool">
+          <Option v-for="(item,index) in schoolList" :value="item" :key="index">{{ item }}</Option>
+        </Select>
         <div class="condition-wrap-right" style="display:none;">
           <Select v-model="yearDefault" size="large" style="width:100px">
             <Option v-for="item in years" :value="item" :key="item">{{ item }}</Option>
@@ -21,8 +25,7 @@
       <Tooltip :content="eventContent" placement="right" transfer max-width="300px">
         <full-calendar :config="config"
                        :events="fcEvents"
-                       ref="calendar"
-                       @dayClick="getDay">
+                       ref="calendar">
         </full-calendar>
       </Tooltip>
       <br><br>
@@ -92,82 +95,82 @@
             console.log(day);
             console.log(jsEvent);
           },
-          eventClick: (day, jsEvent) => {
+          eventClick: () => {
             this.$router.push({ path: 'lessonDetails' });
           },
           eventMouseover: function (event, jsEvent, view) {
             self.eventContent = event.title;
           },
         },
-        lessonList: []
+        lessonList: [],
+        schoolList: [],
+        allList:[],
+        selectSchool:""
       }
     },
 
-    methods: {
-      getDay(event, jsEvent, view) {
-      },
-    },
-    mounted() {
-      this._this = this;
+    created() {
+      this.allList = require("@/static/lessonList.json");
       this.lessonList = require("@/static/lessonList.json");
-      for (let i = 0; i < this.lessonList.length; i++) {
 
-        var sdate = new Date(this.lessonList[i].startTime.time);
-        let sY = sdate.getFullYear() + '-';
-        let sM = (sdate.getMonth() + 1 < 10 ? '0' + (sdate.getMonth() + 1) : sdate.getMonth() + 1) + '-';
-        let sD = sdate.getDate() + ' ';
-        var edate = new Date(this.lessonList[i].endTime.time);
-        let eY = edate.getFullYear() + '-';
-        let eM = (edate.getMonth() + 1 < 10 ? '0' + (edate.getMonth() + 1) : edate.getMonth() + 1) + '-';
-        let eD = edate.getDate() + ' ';
-
-        let dateArr = this.fcEvents.map(item => item.start);
+    },
 
-        //如果已存在
-        if (dateArr.indexOf(sY + sM + sD) == -1) {
-          this.fcEvents.push({
-            title: '名称：' + this.lessonList[i].name
-              + ' \n 学校：' + this.lessonList[i].schoolName
-              + ' \n 主讲人：' + this.lessonList[i].employeeName
-              + ' \n 学科：' + this.lessonList[i].parentCategoryName
-              + ' \n 课题：' + this.lessonList[i].parentProjectName
-              + ' \n 时间：' + this.lessonList[i].timeRangeTipHHmm
-              + ' \n ',
-            start: sY + sM + sD,
-            end: eY + eM + eD
-          });
+    methods: {
+      chooseSchool(val) {
+        if (val == "全部课程") {
+          this.initCalendar(this.allList);
         } else {
-          let index = dateArr.indexOf(sY + sM + sD);
-          let newEvent = {
-            title: this.lessonList[i].name + ' \n\n 等多个活动',
-            start: sY + sM + sD,
-            end: eY + eM + eD,
-            renderHeader: (h, params) => {
-              return h('div', [
-                h('span', params.column.title),
-                h('Tooltip', {
-                  props: {
-                    content: '您希望展示的提示语',
-                    transfer: true,
-                    maxWidth: '220',
-                    theme: 'light'
-                  }
-                }, [
-                    h('Icon', {
-                      props: {
-                        type: 'md-help-circle',
-                        color: "#c8c8c8",
-                        size: "20"
-                      },
-                      class: { iconClass: true }
-                    })
-                  ]),
-              ])
+          this.$nextTick(() => {
+            this.initCalendar(this.allList.filter(item => item.schoolName == val));
+          })
+        }
+
+      },
+      initCalendar(arr) {
+        this.fcEvents = [];
+        this._this = this;
+        for (let i = 0; i < arr.length; i++) {
+          var sdate = new Date(arr[i].startTime.time);
+          let sY = sdate.getFullYear() + '-';
+          let sM = (sdate.getMonth() + 1 < 10 ? '0' + (sdate.getMonth() + 1) : sdate.getMonth() + 1) + '-';
+          let sD = sdate.getDate() + ' ';
+          var edate = new Date(arr[i].endTime.time);
+          let eY = edate.getFullYear() + '-';
+          let eM = (edate.getMonth() + 1 < 10 ? '0' + (edate.getMonth() + 1) : edate.getMonth() + 1) + '-';
+          let eD = edate.getDate() + ' ';
+          let dateArr = this.fcEvents.map(item => item.start);
+
+          //如果已存在
+          if (dateArr.indexOf(sY + sM + sD) == -1) {
+            this.fcEvents.push({
+              title: '名称：' + arr[i].name
+                + ' \n 学校：' + arr[i].schoolName
+                + ' \n 主讲人：' + arr[i].employeeName
+                + ' \n 学科：' + arr[i].parentCategoryName
+                + ' \n 课题：' + arr[i].parentProjectName
+                + ' \n 时间：' + arr[i].timeRangeTipHHmm
+                + ' \n ',
+              start: sY + sM + sD,
+              end: eY + eM + eD
+            });
+          } else {
+            let index = dateArr.indexOf(sY + sM + sD);
+            let newEvent = {
+              title: arr[i].name + ' \n\n 等多个活动',
+              start: sY + sM + sD,
+              end: eY + eM + eD,
             }
+            this.fcEvents.splice(index, 1, newEvent);
           }
-          this.fcEvents.splice(index, 1, newEvent);
         }
-      }
+        }
+      },
+    mounted() {
+        this.schoolList = [...new Set(this.allList.map(item => item.schoolName))];
+        this.lessonList = this.allList;
+        this.schoolList.unshift("全部课程");
+        this.selectSchool = this.schoolList[0];
+        this.initCalendar(this.lessonList);
     }
   }
 </script>
@@ -249,6 +252,11 @@
       background: none;
     }
 
+    .review-main .fc-week {
+      min-height:120px;
+      height:120px !important;
+    }
+
     .review-main  .fc-event {
       border: none;
     }

TEAMModelOS.SmartClass/ClientApp/view/smart-class/index.vue

@@ -54,7 +54,8 @@
     <div class="home-activity">
       <div class="activity-container">
         <div class="header-line">
-          <h3>往届回顾</h3> <span>REVIEW</span> <div class="more">
+          <h3>往届回顾</h3> <span>REVIEW</span>
+          <div class="more">
             <a href="./activity.html" class="view-more">查看更多</a>
           <span class="count">
               <b style="color: rgb(83, 199, 102);">18</b>个活动
@@ -65,7 +66,10 @@
           <div class="activity" v-for="(item,index) in activityList" @click="handleActivityClick()">
             <div>
               <div class="img-box"><span class="state" style="background: rgb(19, 206, 102); visibility: visible;">{{item.statusTip}}</span> <img src="http://ttkt.sxedu.org:70/upload/activity/cover/40/40.jpg?_=1557199674221" alt=""></div> <div class="infos">
-                <p></p><p class="actName">{{item.name}}</p> <p></p> <p class="actOrganizer">
+              <p></p>
+              <p class="actName">{{item.name}}</p>
+              <p></p>
+              <p class="actOrganizer">
                   <span class="organizer">
                     {{item.organizer}}
                   </span>