Merge branch 'master' of http://106.12.23.251:10080/CDHABOOK/TEAMModelOS

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

@@ -5,10 +5,10 @@
       <ul>
         <li :class="activeIndex == 0 ? 'li-active':''" @click="handleMenuClick(0,'index')">首页</li>
         <li :class="activeIndex == 1 ? 'li-active':''" @click="handleMenuClick(1,'notice')">通知公告</li>
-        <li :class="activeIndex == 2 ? 'li-active':''" @click="handleMenuClick(2,'index')">评审活动</li> 
-        <li :class="activeIndex == 3 ? 'li-active':''" @click="handleMenuClick(3,'index')">往届回顾</li>
-        <li :class="activeIndex == 4 ? 'li-active':''" @click="handleMenuClick(4,'index')">天天直播</li>
-        <li :class="activeIndex == 5 ? 'li-active':''" @click="handleMenuClick(5,'index')">优客汇聚</li>
+        <li :class="activeIndex == 2 ? 'li-active':''" @click="handleMenuClick(2,'reviewActivity')">评审活动</li> 
+        <li :class="activeIndex == 3 ? 'li-active':''" @click="handleMenuClick(3,'PastReview')">往届回顾</li>
+        <li :class="activeIndex == 4 ? 'li-active':''" @click="handleMenuClick(4,'LiveBroadcast')">天天直播</li>
+        <li :class="activeIndex == 5 ? 'li-active':''" @click="handleMenuClick(5,'Lessons')">优课汇聚</li>
       </ul>
       <span class="btn-login">登录</span>
     </div>
@@ -70,7 +70,7 @@
       }
         .header ul li:hover {
           background:rgba(160,160,160,.24);
-          color:#cbcdcf;
+          color:#33aafe;
         }
 
       .header ul .li-active {

TEAMModelOS.SmartClass/ClientApp/router/routes.js

@@ -17,7 +17,27 @@ export const routes = [
       {
         name: 'notice',
         path: '/notice',
-        component: resolve => require(['@/view/smart-class/Notice'], resolve), //路由懒加载
+        component: resolve => require(['@/view/smart-class/notice'], resolve), //路由懒加载
+      },
+      {
+        name: 'reviewActivity',
+        path: '/reviewActivity',
+        component: resolve => require(['@/view/smart-class/ReviewActivity'], resolve), //路由懒加载
+      },
+      {
+        name: 'PastReview',
+        path: '/PastReview',
+        component: resolve => require(['@/view/smart-class/PastReview'], resolve), //路由懒加载
+      },
+      {
+        name: 'LiveBroadcast',
+        path: '/LiveBroadcast',
+        component: resolve => require(['@/view/smart-class/LiveBroadcast'], resolve), //路由懒加载
+      },
+      {
+        name: 'Lessons',
+        path: '/Lessons',
+        component: resolve => require(['@/view/smart-class/Lessons'], resolve), //路由懒加载
       }
     ]
   }

TEAMModelOS.SmartClass/ClientApp/static/noticeList.json

@@ -0,0 +1,152 @@
+{
+  "data": null,
+  "errorCode": null,
+  "html": null,
+  "key": null,
+  "list": [
+    {
+      "coverUri": "",
+      "endTime": null,
+      "id": 125,
+      "next": false,
+      "noticeTypeId": 1,
+      "noticeTypeName": "天天展示",
+      "prev": false,
+      "startTime": "2019-04-28",
+      "status": 1,
+      "title": "2019年柯桥区天天智慧课堂5月份排课安排表",
+      "viewCount": 8
+    },
+    {
+      "coverUri": "",
+      "endTime": null,
+      "id": 124,
+      "next": false,
+      "noticeTypeId": 12,
+      "noticeTypeName": "获奖信息",
+      "prev": false,
+      "startTime": "2019-04-22",
+      "status": 1,
+      "title": "柯桥区教师在2019年全国中小学互动课堂课例比赛中再创佳绩",
+      "viewCount": 6
+    },
+    {
+      "coverUri": "",
+      "endTime": null,
+      "id": 123,
+      "next": false,
+      "noticeTypeId": 1,
+      "noticeTypeName": "天天展示",
+      "prev": false,
+      "startTime": "2019-04-18",
+      "status": 1,
+      "title": "关于公布2019年柯桥区天天智慧课堂3月份优课评比结果的通知",
+      "viewCount": 2
+    },
+    {
+      "coverUri": "",
+      "endTime": null,
+      "id": 122,
+      "next": false,
+      "noticeTypeId": 4,
+      "noticeTypeName": "月月研讨",
+      "prev": false,
+      "startTime": "2019-04-16",
+      "status": 1,
+      "title": "2019年柯桥区智慧课堂第二次研讨活动在实验中学举行",
+      "viewCount": 0
+    },
+    {
+      "coverUri": "",
+      "endTime": null,
+      "id": 121,
+      "next": false,
+      "noticeTypeId": 4,
+      "noticeTypeName": "月月研讨",
+      "prev": false,
+      "startTime": "2019-04-11",
+      "status": 1,
+      "title": "关于开展2019年柯桥区智慧课堂第二次研讨活动的通知",
+      "viewCount": 1
+    },
+    {
+      "coverUri": "",
+      "endTime": null,
+      "id": 120,
+      "next": false,
+      "noticeTypeId": 1,
+      "noticeTypeName": "天天展示",
+      "prev": false,
+      "startTime": "2019-04-01",
+      "status": 1,
+      "title": "2019年柯桥区天天智慧课堂4月份排课安排表",
+      "viewCount": 1
+    },
+    {
+      "coverUri": "",
+      "endTime": null,
+      "id": 122,
+      "next": false,
+      "noticeTypeId": 4,
+      "noticeTypeName": "月月研讨",
+      "prev": false,
+      "startTime": "2019-04-16",
+      "status": 1,
+      "title": "2019年柯桥区智慧课堂第二次研讨活动在实验中学举行",
+      "viewCount": 0
+    },
+    {
+      "coverUri": "",
+      "endTime": null,
+      "id": 121,
+      "next": false,
+      "noticeTypeId": 4,
+      "noticeTypeName": "月月研讨",
+      "prev": false,
+      "startTime": "2019-04-11",
+      "status": 1,
+      "title": "关于开展2019年柯桥区智慧课堂第二次研讨活动的通知",
+      "viewCount": 1
+    },
+    {
+      "coverUri": "",
+      "endTime": null,
+      "id": 120,
+      "next": false,
+      "noticeTypeId": 1,
+      "noticeTypeName": "天天展示",
+      "prev": false,
+      "startTime": "2019-04-01",
+      "status": 1,
+      "title": "2019年柯桥区天天智慧课堂4月份排课安排表",
+      "viewCount": 1
+    }
+
+  ],
+  "message": null,
+  "query": {
+    "fields": [],
+    "orders": [
+      {
+        "asc": false,
+        "property": "-1"
+      },
+      {
+        "asc": false,
+        "property": "startTime"
+      },
+      {
+        "asc": true,
+        "property": "id"
+      }
+    ],
+    "pageCount": 12,
+    "pageIndex": 1,
+    "pageSize": 10,
+    "recordCount": 117,
+    "recordEnd": 10,
+    "recordStart": 1
+  },
+  "success": true,
+  "uri": null
+}

TEAMModelOS.SmartClass/ClientApp/view/app.vue

@@ -41,7 +41,6 @@
     width: 100%;
     min-width: 1200px;
     min-height: 768px;
-    height: 100%;
     display: flex;
     flex-direction: column;
     align-items: center;

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

@@ -0,0 +1,58 @@
+<template>
+  <div class="container">
+    <h1>往届回顾</h1>
+      <div class="left-box"></div>
+      <div class="right-box"></div>
+  </div>
+</template>
+<script>
+  export default {
+    components: {
+    },
+    data() {
+      return {
+      }
+    },
+    methods: {
+
+
+
+    },
+    mounted() {
+    }
+  }
+</script>
+<style scoped>
+  html, body, #app {
+    height: 100% !important;
+    user-select: none;
+  }
+
+  .main-content {
+    background:rgb(248,248,248) !important;
+  }
+  .container {
+    width: 1200px;
+    margin: 100px auto;
+    display:flex;
+    flex-direction:row;
+    justify-content:space-between;
+  }
+
+    .container .left-box {
+      width:25%;
+      height:600px;
+      background:#fff;
+    }
+
+    .container .right-box {
+      width:73%;
+      height:600px;
+      background:#fff;
+    }
+
+  .center-col {
+
+  }
+
+</style>

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

@@ -0,0 +1,62 @@
+<template>
+  <div class="container">
+    <div class="review-main">
+      <h1>往届回顾1231</h1>
+    </div>
+  </div>
+</template>
+<script>
+  export default {
+    components: {
+    },
+    data() {
+      return {
+      }
+    },
+    methods: {
+
+
+
+    },
+    mounted() {
+    }
+  }
+</script>
+<style scoped>
+  html, body, #app {
+    height: 100% !important;
+    user-select: none;
+  }
+
+  .main-content {
+    background:rgb(248,248,248) !important;
+  }
+  .container {
+    width: 1200px;
+    margin: 100px auto;
+    display:flex;
+    flex-direction:row;
+    justify-content:space-between;
+  }
+  .review-main {
+    background:#fff;
+    width:100%;
+    height:600px;
+  }
+    .container .left-box {
+      width:25%;
+      height:600px;
+      background:#fff;
+    }
+
+    .container .right-box {
+      width:73%;
+      height:600px;
+      background:#fff;
+    }
+
+  .center-col {
+
+  }
+
+</style>

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

@@ -1,7 +1,50 @@
 <template>
   <div class="container">
-      <div class="left-box"></div>
-      <div class="right-box"></div>
+    <div class="review-page">
+      <div class="reviews-header">
+        <p class="title">
+          往届回顾
+          <span class="sub">
+            <span>18</span>
+            个活动已结束
+          </span>
+        </p>
+        <div class="selections">
+          <span class="name">年份：</span>
+          <ul>
+            <li class="active"><span class="item">不限</span></li>
+            <li class=""><span class="item">2015</span></li>
+            <li class=""><span class="item">2016</span></li>
+            <li class=""><span class="item">2017</span></li>
+            <li class=""><span class="item">2018</span></li>
+            <li class=""><span class="item">2019</span></li>
+          </ul>
+        </div>
+        <div class="selections">
+          <span class="name">排序：</span>
+          <ul>
+            <li class="active"><span class="item">最新</span></li>
+            <li class=""><span class="item">最热</span></li>
+          </ul>
+        </div>
+        <div style="clear:both;"></div>
+        <div class="activities">
+          <div class="activity" v-for="(item,index) in activities">
+            <div>
+              <div class="img-box"><span class="state" style="background: rgb(19, 206, 102); visibility: visible; display:none;">{{item.status}}</span> <img :src="item.img" alt=""></div> <div class="infos">
+                <p class="actName">{{item.name}}</p>
+                <p class="actOrganizer">
+                  <span class="organizer">
+                    {{item.time}}
+                  </span>
+                  <span style="display:none;">主办</span>
+                </p>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
   </div>
 </template>
 <script>
@@ -10,6 +53,64 @@
     },
     data() {
       return {
+        activities: [
+          {
+            status: "筹备阶段",
+            img: "http://ttkt.sxedu.org:70/upload/activity/cover/40/40.jpg?_=1557199674221",
+            name: "2019年柯桥区天天智慧课堂 5月份 优课评比",
+            organizer: "柯桥区教师发展中心",
+            time:"2019.03.01-04.06"
+          },{
+            status: "筹备阶段",
+            img: "http://ttkt.sxedu.org:70/upload/activity/cover/40/40.jpg?_=1557199674221",
+            name: "2019年柯桥区天天智慧课堂 5月份 优课评比",
+            organizer: "柯桥区教师发展中心",
+            time:"2019.03.01-04.06"
+          },{
+            status: "筹备阶段",
+            img: "http://ttkt.sxedu.org:70/upload/activity/cover/40/40.jpg?_=1557199674221",
+            name: "2019年柯桥区天天智慧课堂 5月份 优课评比",
+            organizer: "柯桥区教师发展中心",
+            time:"2019.03.01-04.06"
+          },{
+            status: "筹备阶段",
+            img: "http://ttkt.sxedu.org:70/upload/activity/cover/40/40.jpg?_=1557199674221",
+            name: "2019年柯桥区天天智慧课堂 5月份 优课评比",
+            organizer: "柯桥区教师发展中心",
+            time:"2019.03.01-04.06"
+          },{
+            status: "筹备阶段",
+            img: "http://ttkt.sxedu.org:70/upload/activity/cover/40/40.jpg?_=1557199674221",
+            name: "2019年柯桥区天天智慧课堂 5月份 优课评比",
+            organizer: "柯桥区教师发展中心",
+            time:"2019.03.01-04.06"
+          },{
+            status: "筹备阶段",
+            img: "http://ttkt.sxedu.org:70/upload/activity/cover/40/40.jpg?_=1557199674221",
+            name: "2019年柯桥区天天智慧课堂 5月份 优课评比",
+            organizer: "柯桥区教师发展中心",
+            time:"2019.03.01-04.06"
+          },
+          {
+            status: "筹备阶段",
+            img: "http://ttkt.sxedu.org:70/upload/activity/cover/40/40.jpg?_=1557199674221",
+            name: "2019年柯桥区天天智慧课堂 5月份 优课评比",
+            organizer: "柯桥区教师发展中心",
+            time:"2019.03.01-04.06"
+          },{
+            status: "筹备阶段",
+            img: "http://ttkt.sxedu.org:70/upload/activity/cover/40/40.jpg?_=1557199674221",
+            name: "2019年柯桥区天天智慧课堂 5月份 优课评比",
+            organizer: "柯桥区教师发展中心",
+            time:"2019.03.01-04.06"
+          },{
+            status: "筹备阶段",
+            img: "http://ttkt.sxedu.org:70/upload/activity/cover/40/40.jpg?_=1557199674221",
+            name: "2019年柯桥区天天智慧课堂 5月份 优课评比",
+            organizer: "柯桥区教师发展中心",
+            time:"2019.03.01-04.06"
+          }
+        ]
       }
     },
     methods: {
@@ -28,30 +129,141 @@
   }
 
   .main-content {
-    background:rgb(248,248,248) !important;
+    background: rgb(248,248,248) !important;
   }
+
   .container {
     width: 1200px;
     margin: 100px auto;
-    display:flex;
-    flex-direction:row;
-    justify-content:space-between;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+  }
+
+  .review-page {
+    background-color: #fff;
+    width: 1120px;
+    padding: 30px;
+    margin: 0 auto;
+    margin-bottom: 30px;
+  }
+
+  .reviews-header .title {
+    height: 20px;
+    line-height: 20px;
+    color: #444;
+    font-size: 16px;
+    padding-left: 10px;
+    border-left: 3px solid #20a1f8;
+    margin-bottom: 30px;
+  }
+  .sub {
+    color: #cbb;
+    font-size: 16px;
+    margin-left: 10px;
+  }
+
+  .selections .name {
+    color: #999;
+    font-size: 14px;
+    float: left;
+    clear: left;
+  }
+
+  .selections ul li {
+    float: left;
+    font-size: 14px;
+    cursor: pointer;
+    list-style: none;
+    padding: 0 0 0 40px;
   }
 
-    .container .left-box {
-      width:25%;
-      height:600px;
-      background:#fff;
+    .selections ul li.active {
+      color: #33aeff;
     }
+  .activities {
+    min-height: 300px;
+    overflow: hidden;
+    margin-top: 30px;
+  }
 
-    .container .right-box {
-      width:73%;
-      height:600px;
-      background:#fff;
+    .activities .activity {
+      margin-right: 25px;
+      margin-bottom: 40px;
+      width: 335px;
+      height:292px;
+      float: left;
+      cursor: pointer;
+      border: 1px solid #ddd;
+      box-sizing: border-box
     }
 
-  .center-col {
+ .activities .activity:hover {
+    box-shadow: 0 26px 40px -24px rgba(0,36,100,.3);
+    transform: translateY(-6px);
+    transition: all .3s ease 0s
+}
 
-  }
+.activities .activity:nth-child(3n) {
+    margin-right: 0
+}
+
+.img-box {
+    width: 335px;
+}
+
+.img-box .state {
+    padding: 5px 8px;
+    line-height: 20px;
+    position: relative;
+    left: 0;
+    top: 3px;
+    z-index: 1;
+    background-color: #13ce66;
+    color: #fff
+}
+
+.img-box img {
+    width: 333px;
+    height: 210px;
+    position: relative;
+    left: 0;
+    top:-21px;
+    padding-top: 1px
+}
+
+.infos {
+  position:relative;
+  top:-21px;
+    background-color: #fff
+}
+
+.infos .actName {
+    color: #444;
+    font-size: 16px;
+    padding: 20px 10px 10px 20px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    width: 280px
+}
+
+.infos .actOrganizer {
+    color: #999;
+    font-size: 14px;
+    padding-left: 20px;
+    padding-bottom: 20px
+}
+
+.infos .actTime {
+    color: #aaa;
+    font-size: 14px;
+    padding-left: 20px;
+    padding-bottom: 10px
+}
 
+.view-more {
+    text-decoration: none;
+    float: right
+}
 </style>

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

@@ -0,0 +1,190 @@
+<template>
+  <div class="container">
+    <div class="activity-item">
+      <div class="activity-banner">
+        <img src="http://ttkt.sxedu.org:70/upload/activity/banner/40/40.jpg?_=1557231709373" />
+      </div>
+      <div class="activity-brief">
+        <div class="left">
+          <div class="line">
+            <span class="tips">活动：</span>
+            <span title="2019年柯桥区天天智慧课堂 5月份 优课评比" class="items">2019年柯桥区天天智慧课堂 5月份 优课评比</span>
+            <span class="status" style="background: rgb(19, 206, 102);">筹备阶段</span>
+          </div>
+          <div class="line"><span class="tips">时间：</span> <span class="items2">2019.05.01-06.08</span></div>
+          <div class="line"><span class="tips">主办：</span> <span class="items2">柯桥区教师发展中心</span></div>
+          <div class="line"><span class="tips">作品：</span> <span class="items2">征集中</span></div>
+
+        </div>
+        <div class="right">
+          <p class="time-count">距离报名开始还有<span class="count-down"> 0天 0小时 0分</span></p>
+          <Button type="primary" size="large">查看详情</Button>
+        </div>
+      </div>
+    </div>
+    <div class="activity-item">
+      <div class="activity-banner">
+        <img src="http://ttkt.sxedu.org:70/upload/activity/banner/40/40.jpg?_=1557231709373" />
+      </div>
+      <div class="activity-brief">
+        <div class="left">
+          <div class="line">
+            <span class="tips">活动：</span>
+            <span title="2019年柯桥区天天智慧课堂 5月份 优课评比" class="items">2019年柯桥区天天智慧课堂 5月份 优课评比</span>
+            <span class="status" style="background: rgb(19, 206, 102);">筹备阶段</span>
+          </div>
+          <div class="line"><span class="tips">时间：</span> <span class="items2">2019.05.01-06.08</span></div>
+          <div class="line"><span class="tips">主办：</span> <span class="items2">柯桥区教师发展中心</span></div>
+          <div class="line"><span class="tips">作品：</span> <span class="items2">征集中</span></div>
+
+        </div>
+        <div class="right">
+          <p class="time-count">距离报名开始还有<span class="count-down"> 0天 0小时 0分</span></p>
+          <Button type="primary" size="large">查看详情</Button>
+        </div>
+      </div>
+    </div>
+
+    <div class="activity-item">
+      <div class="activity-banner">
+        <img src="http://ttkt.sxedu.org:70/upload/activity/banner/40/40.jpg?_=1557231709373" />
+      </div>
+      <div class="activity-brief">
+        <div class="left">
+          <div class="line">
+            <span class="tips">活动：</span>
+            <span title="2019年柯桥区天天智慧课堂 5月份 优课评比" class="items">2019年柯桥区天天智慧课堂 5月份 优课评比</span>
+            <span class="status" style="background: rgb(19, 206, 102);">筹备阶段</span>
+          </div>
+          <div class="line"><span class="tips">时间：</span> <span class="items2">2019.05.01-06.08</span></div>
+          <div class="line"><span class="tips">主办：</span> <span class="items2">柯桥区教师发展中心</span></div>
+          <div class="line"><span class="tips">作品：</span> <span class="items2">征集中</span></div>
+
+        </div>
+        <div class="right">
+          <p class="time-count">距离报名开始还有<span class="count-down"> 0天 0小时 0分</span></p>
+          <Button type="primary" size="large">查看详情</Button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+
+  export default {
+    components: {
+    },
+    data() {
+      return {
+        activeIndex: 0,
+        typeName:"",
+        newColumns: [
+          {
+            title: '标题',
+            key: 'title'
+          },
+          {
+            title: '日期',
+            key: 'startTime'
+          }
+        ],
+        noticeList: []
+      }
+    },
+
+    created() {
+
+    },
+    methods: {
+      getList(type) {
+        let list = noticeList.list;
+        var newArray = list.filter(function(item){
+            return item.noticeTypeId == type;
+        });
+        this.noticeList = newArray;
+      },
+
+      handleMenuClick(index,typeId,name) {
+        this.activeIndex = index;
+        this.typeName = name;
+        this.getList(typeId);
+      }
+
+
+    },
+    mounted() {
+    }
+  }
+</script>
+<style scoped>
+  html, body, #app {
+    height: 100% !important;
+    user-select: none;
+  }
+
+  .main-content {
+    background: rgb(248,248,248) !important;
+  }
+
+  .container {
+    width: 1200px;
+    margin: 100px auto;
+    display: flex;
+    flex-direction: column;
+  }
+
+    .container .activity-item {
+      width:100%;
+      padding-bottom:50px;
+      background:#fff;
+      margin-top:40px;
+    }
+
+    .container .activity-item .activity-banner img {
+      width:100%;
+    }
+
+    .container .activity-brief {
+      width:100%;
+      padding:15px 40px;
+      display:flex;
+      flex-direction:row;
+      justify-content:space-between;
+      align-items:center;
+    }
+
+      .container .activity-brief .line {
+        font-size:16px;
+        margin-top:10px;
+      }
+
+      .container .activity-brief .status {
+        font-size:14px;
+        padding:2px 8px;
+        margin-left:8px;
+        border-radius:5px;
+        color:#fff;
+       }
+
+      .container .activity-brief .line .tips{
+        font-weight:bold;
+        color:#999;
+      }
+
+    .container .time-count {
+      font-size:16px;
+      margin-bottom:20px;
+    }
+
+      .container .time-count .count-down {
+        color:orange;
+      }
+
+    .container .right .ivu-btn {
+      width:180px;
+      height:48px;
+      font-size:16px;
+    }
+
+
+</style>

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

@@ -1,31 +1,69 @@
 <template>
-  <div class="container">
+  <div class="container notice-container">
     <div class="left-box">
-      <Menu mode="vertical" active-name="1">
-        <MenuItem name="1">
-          内容管理
-        </MenuItem>
-        <MenuItem name="2">
-          用户管理
-        </MenuItem>
-        <MenuItem name="4">
-          综合设置
-        </MenuItem>
-      </Menu>
+      <p class="title">通知公告<span class="sub">NOTICE</span></p>
+      <ul>
+        <li :class="activeIndex == 0 ? 'li-active':''" @click="handleMenuClick(0,0,'全部类型')">全部类型</li>
+        <li :class="activeIndex == 1 ? 'li-active':''" @click="handleMenuClick(1,1,'天天展示')">天天展示</li>
+        <li :class="activeIndex == 2 ? 'li-active':''" @click="handleMenuClick(2,2,'月月研讨')">月月研讨</li>
+        <li :class="activeIndex == 3 ? 'li-active':''" @click="handleMenuClick(3,3,'年年观摩')">年年观摩</li>
+        <li :class="activeIndex == 4 ? 'li-active':''" @click="handleMenuClick(4,4,'课例征集')">课例征集</li>
+        <li :class="activeIndex == 5 ? 'li-active':''" @click="handleMenuClick(5,5,'获奖信息')">获奖信息</li>
+        <li :class="activeIndex == 6 ? 'li-active':''" @click="handleMenuClick(6,6,'智慧团队')">智慧团队</li>
+        <li :class="activeIndex == 7 ? 'li-active':''" @click="handleMenuClick(7,7,'评课标准')">评课标准</li>
+        <li :class="activeIndex == 8 ? 'li-active':''" @click="handleMenuClick(8,8,'上级通知')">上级通知</li>
+        <li :class="activeIndex == 9 ? 'li-active':''" @click="handleMenuClick(9,9,'每周评论')">每周评论</li>
+        <li :class="activeIndex == 10 ? 'li-active':''" @click="handleMenuClick(10,10,'高阶研修')">高阶研修</li>
+      </ul>
+    </div>
+    <div class="right-box center-col">
+      <p class="title">{{typeName}}</p>
+      <Table :columns="newColumns" :data="noticeList"></Table>
+      <Page :total="50" show-elevator show-total/>
     </div>
-      <div class="right-box"></div>
   </div>
 </template>
 <script>
+
+  import noticeList from '@/static/noticeList.json'
   export default {
     components: {
     },
     data() {
       return {
+        activeIndex: 0,
+        typeName:"",
+        newColumns: [
+          {
+            title: '标题',
+            key: 'title'
+          },
+          {
+            title: '日期',
+            key: 'startTime'
+          }
+        ],
+        noticeList: []
       }
     },
+
+    created() {
+      this.getList(1);
+    },
     methods: {
+      getList(type) {
+        let list = noticeList.list;
+        var newArray = list.filter(function(item){
+            return item.noticeTypeId == type;
+        });
+        this.noticeList = newArray;
+      },
 
+      handleMenuClick(index,typeId,name) {
+        this.activeIndex = index;
+        this.typeName = name;
+        this.getList(typeId);
+      }
 
 
     },
@@ -40,30 +78,92 @@
   }
 
   .main-content {
-    background:rgb(248,248,248) !important;
+    background: rgb(248,248,248) !important;
   }
+
   .container {
     width: 1200px;
     margin: 100px auto;
-    display:flex;
-    flex-direction:row;
-    justify-content:space-between;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
   }
 
     .container .left-box {
-      width:25%;
-      height:600px;
-      background:#fff;
+      width: 25%;
+      padding-bottom: 50px;
+      background: #fff;
     }
 
+      .container .left-box .title {
+        font-size: 16px;
+        color: #33aafe;
+        letter-spacing: 1px;
+        font-weight: 500;
+        margin: 30px 0 0 20px;
+      }
+
+        .container .left-box .title .sub {
+          font-size: 14px;
+          color: #cbb;
+          margin-left: 15px;
+        }
+
+      .container .left-box ul {
+        list-style: none;
+        width: 100%;
+        margin-top: 20px;
+      }
+
+        .container .left-box ul li {
+          width: 100%;
+          height: 56px;
+          line-height: 56px;
+          font-size: 14px;
+          padding-left: 20px;
+          color: #999;
+          letter-spacing: 1px;
+          text-indent: 5px;
+          cursor: pointer;
+        }
+
+          .container .left-box ul li:hover{
+            background: rgba(212, 226, 236, 0.5);
+            color:#999;
+          }
+
+          .container .left-box .li-active {
+            background: #33aafe;
+            color: #fff;
+          }
     .container .right-box {
-      width:73%;
-      height:600px;
-      background:#fff;
+      width: 73%;
+      padding-bottom:50px;
+      padding: 30px 15px;
+      background: #fff;
     }
 
-  .center-col {
+      .container .right-box .title {
+        font-size: 16px;
+        color: #444;
+      }
 
-  }
+      .container .right-box .ivu-table-wrapper {
+        width:100%;
+        margin-top:20px;
+      }
 
+      .container .right-box .ivu-page {
+        margin-top:20px;
+      }
+
+      .container .right-box /deep/ .ivu-table-wrapper .ivu-table-cell {
+        cursor:pointer;
+      }
+
+  .center-col {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+  }
 </style>

TEAMModelOS.SmartTeach/ClientApp/common/headers.vue

@@ -4,7 +4,7 @@
       <img src="https://css.huijiaoyun.com/tianyu_edu/area/888888/images/logo/logo.png?v=0818"  class="logo_img"/>
       <div class="header_list">
         <ul>
-          <li v-for="items in navlist" class="nav_name">{{items.name}}</li>
+          <a href=""><li v-for="items in navlist" class="nav_name">{{items.name}}</li></a>
         </ul>
       </div>
     </div>
@@ -37,12 +37,12 @@
   .header_left {
     width: 70%;
     float: left;
-    height: 85px;
+    height: 75px;
   }
   .header_right {
     width: 30%;
     float: left;
-    height: 85px;
+    height: 75px;
   }
   .logo_img {
     float: left;

TEAMModelOS.SmartTeach/ClientApp/components/resource/list.vue

@@ -0,0 +1,190 @@
+<template>
+  <div class="list_box">
+    <ul class="list_header">
+      <li class="list_data"><Icon type="ios-menu-outline" size="30" style="color:#fff;margin-bottom:10px;" /><span class="list_header_title">学科资源</span></li>
+      <li class="moreover_data">
+        <div class="top_title"><div class="icon_img"></div><span class="moreover_title">小学</span><Icon type="ios-arrow-forward" size="28" style="color:#fff;margin-left:25px;" /></div>
+        <div class="bottom_title">
+          <a href="">教案</a>
+          <a href="">素材</a>
+          <a href="">动画</a>
+          <a href="">课件</a>
+        </div>
+      </li>
+      <li class="moreover_data">
+        <div class="top_title"><div class="icon_img_two"></div><span class="moreover_title">初中</span><Icon type="ios-arrow-forward" size="28" style="color:#fff;margin-left:25px;" /></div>
+        <div class="bottom_title">
+          <a href="">教案</a>
+          <a href="">试卷</a>
+          <a href="">素材</a>
+          <a href="">课件</a>
+        </div>
+      </li>
+      <li class="moreover_data">
+        <div class="top_title"><div class="icon_img_three"></div><span class="moreover_title">高中</span><Icon type="ios-arrow-forward" size="28" style="color:#fff;margin-left:25px;" /></div>
+        <div class="bottom_title">
+          <a href="">教案</a>
+          <a href="">真题</a>
+          <a href="">素材</a>
+          <a href="">课件</a>
+        </div>
+      </li>
+    </ul>
+    <ul class="conceal">
+      <li class="conceal_list" v-for="item in xiaoxue">
+        <p class="conceal_list_title">{{item.title}}</p>
+        <p class="conceal_list_subhead"><span>同步资源</span><span>卷库</span></p>
+      </li>
+      <!--<li class="conceal_list">
+        <p class="conceal_list_title">语文</p>
+        <p class="conceal_list_subhead"><span>同步资源</span><span>卷库</span></p>
+      </li>
+      <li class="conceal_list">
+        <p class="conceal_list_title">语文</p>
+        <p class="conceal_list_subhead"><span>同步资源</span><span>卷库</span></p>
+      </li>
+      <li class="conceal_list">
+        <p class="conceal_list_title">语文</p>
+        <p class="conceal_list_subhead"><span>同步资源</span><span>卷库</span></p>
+      </li>-->
+    </ul>
+  </div>
+</template>
+<script>
+  export default {
+    data() {
+      return {
+        xiaoxue: [
+          { "id": 1, "title": '语文', "data": [{ "id": 2, "pid": 1, "title": '同步资源' }, { "id": 3, "pid": 1, "title": '卷库' },] },
+          { "id": 4, "title": '数学', "data": [{ "id": 5, "pid": 4, "title": '同步资源' }, { "id": 6, "pid": 4, "title": '卷库' },] },
+          { "id": 7, "title": '英语', "data": [{ "id": 8, "pid": 7, "title": '同步资源' }, { "id": 9, "pid": 7, "title": '卷库' },] },
+          { "id": 10, "title": '体育', "data": [{ "id": 11, "pid": 10, "title": '同步资源' }, { "id": 12, "pid": 10, "title": '卷库' },] },
+          { "id": 13, "title": '美术', "data": [{ "id": 14, "pid": 13, "title": '同步资源' }, { "id": 15, "pid": 13, "title": '卷库' },] },
+          { "id": 16, "title": '音乐', "data": [{ "id": 17, "pid": 16, "title": '同步资源' }, { "id": 18, "pid": 16, "title": '卷库' },] },
+          { "id": 19, "title": '科学', "data": [{ "id": 20, "pid": 19, "title": '同步资源' }, { "id": 21, "pid": 19, "title": '卷库' },] },
+          { "id": 22, "title": '信息技术', "data": [{ "id": 23, "pid": 22, "title": '同步资源' }, { "id": 24, "pid": 22, "title": '卷库' },] },
+          { "id": 25, "title": '书法', "data": [{ "id": 26, "pid": 25, "title": '同步资源' }, { "id": 27, "pid": 25, "title": '卷库' },] },
+          { "id": 28, "title": '汉语', "data": [{ "id": 29, "pid": 28, "title": '同步资源' }, { "id": 30, "pid": 28, "title": '卷库' },] },
+          { "id": 31, "title": '品德与生活', "data": [{ "id": 32, "pid": 31, "title": '同步资源' }, { "id": 33, "pid": 31, "title": '卷库' },] },
+          { "id": 34, "title": '生活与科技', "data": [{ "id": 35, "pid": 34, "title": '同步资源' }, { "id": 36, "pid": 34, "title": '卷库' },] },
+          { "id": 37, "title": '体育与健康', "data": [{ "id": 38, "pid": 37, "title": '同步资源' }, { "id": 39, "pid": 37, "title": '卷库' },] },
+
+        ],
+      }
+    }
+  }
+</script>
+<style>
+  .list_box {
+    width:100%;
+    background:url("../../assets/image/banner.png") no-repeat;
+    background-size:100% 100%;
+    height:396px;
+    position:relative;
+  }
+  .list_header {
+    width:11%;
+    position:absolute;
+    left:210px;
+    height:400px;
+    text-align:center;
+  }
+  .list_data {
+    width: 100%;
+    height: 70px;
+    list-style: none;
+    background: #7abeee;
+    line-height: 70px;
+  }
+  .list_header_title {
+    font-size: 24px;
+    color:#fff;
+    margin-top:5px;
+  }
+  .moreover_data {
+    width: 100%;
+    height: 108.5px;
+    padding: 5%;
+    list-style: none;
+    background: #7abeee;
+    border-top: #7abeee solid 1px;
+    text-align: left;
+  }
+  .top_title {
+    width:100%;
+    height:40px;
+    display:block;
+  }
+  .icon_img {
+    width:35px;
+    height:28px;
+    background:url(../../assets/image/list_icon.png) no-repeat 0px 0px ;
+    display:block;
+    float:left;
+  }
+  .icon_img_two {
+    width: 35px;
+    height: 28px;
+    background: url(../../assets/image/list_icon.png) no-repeat 0px -70px;
+    display: block;
+    float: left;
+  }
+  .icon_img_three {
+    width: 35px;
+    height: 28px;
+    background: url(../../assets/image/list_icon.png) no-repeat 0px -141px;
+    display: block;
+    float: left;
+  }
+  .moreover_title {
+    font-size: 20px;
+    color: #fff;
+    margin-left: 40px;
+    float: left;
+  }
+  .jt {
+    color:#fff;
+    font-size:30px;
+  }
+  .bottom_title {
+    width:100%;
+    height:40px;
+    padding-top:15px;
+  }
+    .bottom_title a {
+      font-size: 14px;
+      color: #fff;
+      margin: 0px 6px;
+    }
+  .moreover_data:hover {
+    background:#056eaf;
+  }
+  .conceal {
+    width:580px;
+    height:500px;
+    border:1px solid red;
+    position:absolute;
+    left:420px;
+    background:rgba(85,85,85,.9);
+  }
+  .conceal_list {
+    float: left;
+    width: 175px;
+    padding-left: 19px;
+    padding-top:20px;
+    overflow: hidden;
+    zoom: 1;
+    margin-right: 15px;
+    height: 76px;
+    list-style:none;
+  }
+  .conceal_list_title{
+    font-size: 18px;
+    color: #5e90b1;
+  }
+  .conceal_list_subhead span {
+    font-size:14px;
+    color:#fff;
+    margin-left:5px;
+  }
+</style>

TEAMModelOS.SmartTeach/ClientApp/router/routes.js

@@ -1,11 +1,9 @@
 //import Login from '@/view/login'
 //import ServerSideLogin from '@/view/serverside/login'
 // import HTTP404 from '@/view/404'
-import Index from '@/view/index'
-import HeaderPage from '@/components/HeaderPage.vue'
+import Index from '@/view/resource/index'
 import { resolve } from 'url';
 
 export const routes = [  
   { name: 'index', path: '', component: Index },
-  { name: 'HeaderPage', path: '/HeaderPage', component: HeaderPage },
 ]

TEAMModelOS.SmartTeach/ClientApp/view/index.vue

@@ -1,13 +1,17 @@
 <template>
   <div id="app">
       <Header></Header>
+      <div>
+        <Banner></Banner>
+      </div>
   </div>
 </template>
 <script>
-  import Header from '@/common/headers.vue'
+  import Header from '@/common/headers.vue';
   export default {
     components: {
-      Header
+      Header,
+      Banner
     },
     data() {
       return {
@@ -20,132 +24,9 @@
     }
 </script>
 <style scoped>
-  html, body, #app {
-    height: 100% !important;
-    /*-moz-user-select: none; /*火狐 firefox*/
-    /*-webkit-user-select: none;/ /*webkit浏览器*/
-    /*-ms-user-select: none;*/ /*IE10+*/
-    /*user-select: none;*/
-  }
-
-  .main-content {
-    position: relative;
-    width: 100%;
-    min-width: 1200px;
-    min-height: 768px;
-    background: url("http://chq.dygl.pujiaoyun.cn/static/img/banner.071530a.jpg") center 100% no-repeat;
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    padding-top: 50px;
-  }
-
-  .center {
-    display: flex;
-    flex-direction: row;
-    justify-content: center;
-    align-items: center;
-  }
-
-  .centerCol {
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-  }
-
-  .overlay-wrap {
-    padding: 20px 10px;
-    background-color: rgba(218, 218, 218, 0.08);
-    margin-top: 50px;
-  }
-
-  .logo {
-    width: 200px;
-    height: 200px;
-    margin-bottom: 50px;
-  }
-
-  .btn-login {
-    width: 150px;
-    margin-top: 15px;
-    background-color: rgba(204,204,204,.37) !important;
-    border-color: #87888a !important;
-  }
-
-  .suc-text {
-    color: #fff;
-    font-size: 14px;
-    font-weight: 200;
-  }
-
-  .user-wrap {
-    position: absolute;
-    right: 50px;
-    top: 50px;
-    color: white;
-    font-size: 14px;
-    font-weight: 200;
-  }
-
-  .ivu-avatar {
-    background-color: #30a6e1 !important;
-    margin-right: 10px;
-  }
-
-  .btn-exit {
-    font-size: 12px;
-    cursor: pointer;
-    margin-left: 15px;
-  }
-
-  .select-role {
-    margin-top: 15px;
-  }
-
-    .select-role /deep/ .ivu-select {
-      color: #000 !important;
-      width: 150px !important;
-    }
-
-    .select-role .ivu-select-selection {
-      background-color: rgba(255,255,255,.18) !important;
-      border-color: #373737 !important;
-    }
-
-  .select-role-wrap {
-    background-color: rgba(218, 218, 218, 0.08);
-    padding: 5px;
-    justify-content: normal;
-    flex-wrap: wrap;
-    max-width: 930px;
-  }
-
-  .role-item {
-    width: 210px;
-    height: 210px;
-    background-color: rgba(179,179,179,.15);
-    margin: 10px;
-    color: #c5c5c5;
-    font-size: 14px;
-    font-weight: 200;
-    cursor: pointer;
-  }
-
-    .role-item:hover {
-      background: rgba(179,179,179,.42);
-      color: #fff;
-    }
-
-  .title {
-    font-size: 26px;
-    font-weight: 200;
-    color: #fff;
-    margin-bottom: 20px;
-  }
-
-  .role-name {
-    margin-top: 10px;
+  #app {
+    width:100%;
+    height:auto;
+    padding:0;
   }
 </style>

TEAMModelOS.SmartTeach/ClientApp/view/resource/index.vue

@@ -0,0 +1,154 @@
+<template>
+  <div id="app">
+      <Header></Header>
+    <Banner></Banner>
+  </div>
+</template>
+<script>
+  import Header from '@/common/headers.vue'
+  import Banner from '@/components/resource/list.vue'
+  export default {
+    components: {
+      Header,
+      Banner
+    },
+    data() {
+      return {
+
+      }
+    },
+      mounted() {
+        
+      }
+    }
+</script>
+<style scoped>
+  html, body, #app {
+    height: 100% !important;
+    /*-moz-user-select: none; /*火狐 firefox*/
+    /*-webkit-user-select: none;/ /*webkit浏览器*/
+    /*-ms-user-select: none;*/ /*IE10+*/
+    /*user-select: none;*/
+  }
+
+  .main-content {
+    position: relative;
+    width: 100%;
+    min-width: 1200px;
+    min-height: 768px;
+    background: url("http://chq.dygl.pujiaoyun.cn/static/img/banner.071530a.jpg") center 100% no-repeat;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    padding-top: 50px;
+  }
+
+  .center {
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .centerCol {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .overlay-wrap {
+    padding: 20px 10px;
+    background-color: rgba(218, 218, 218, 0.08);
+    margin-top: 50px;
+  }
+
+  .logo {
+    width: 200px;
+    height: 200px;
+    margin-bottom: 50px;
+  }
+
+  .btn-login {
+    width: 150px;
+    margin-top: 15px;
+    background-color: rgba(204,204,204,.37) !important;
+    border-color: #87888a !important;
+  }
+
+  .suc-text {
+    color: #fff;
+    font-size: 14px;
+    font-weight: 200;
+  }
+
+  .user-wrap {
+    position: absolute;
+    right: 50px;
+    top: 50px;
+    color: white;
+    font-size: 14px;
+    font-weight: 200;
+  }
+
+  .ivu-avatar {
+    background-color: #30a6e1 !important;
+    margin-right: 10px;
+  }
+
+  .btn-exit {
+    font-size: 12px;
+    cursor: pointer;
+    margin-left: 15px;
+  }
+
+  .select-role {
+    margin-top: 15px;
+  }
+
+    .select-role /deep/ .ivu-select {
+      color: #000 !important;
+      width: 150px !important;
+    }
+
+    .select-role .ivu-select-selection {
+      background-color: rgba(255,255,255,.18) !important;
+      border-color: #373737 !important;
+    }
+
+  .select-role-wrap {
+    background-color: rgba(218, 218, 218, 0.08);
+    padding: 5px;
+    justify-content: normal;
+    flex-wrap: wrap;
+    max-width: 930px;
+  }
+
+  .role-item {
+    width: 210px;
+    height: 210px;
+    background-color: rgba(179,179,179,.15);
+    margin: 10px;
+    color: #c5c5c5;
+    font-size: 14px;
+    font-weight: 200;
+    cursor: pointer;
+  }
+
+    .role-item:hover {
+      background: rgba(179,179,179,.42);
+      color: #fff;
+    }
+
+  .title {
+    font-size: 26px;
+    font-weight: 200;
+    color: #fff;
+    margin-bottom: 20px;
+  }
+
+  .role-name {
+    margin-top: 10px;
+  }
+</style>