合并

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

@@ -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/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/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/app.js

@@ -12,6 +12,7 @@ import apiTools from '@/api/api.js';
 import { fetch, post } from '@/filters/http.js';
 import VideoPlayer from 'vue-video-player';
 import jwtDecode from 'jwt-decode';
+import animate from 'animate.css'
 require('video.js/dist/video-js.css');
 require('vue-video-player/src/custom-theme.css');
 Vue.use(VideoPlayer);
@@ -29,6 +30,7 @@ Vue.prototype.$get = fetch;
 Vue.prototype.$jwtDecode = jwtDecode;
 
 Vue.use(vuescroll)
+Vue.use(animate)
 Vue.prototype.$echarts = echarts
 
 //ZXJ

TEAMModelOS.SmartTeach/ClientApp/components/HeaderPage.vue

@@ -0,0 +1,117 @@
+
+<template>
+  <div class="home">
+        <div class="title">
+          <!--顶部轮播图-->
+          <div >
+            <Carousel >
+              <CarouselItem v-for="(homeImagesList,index) in homeCarouselImg" :key="index">
+                <div class="demo-carousel">
+                  <img class="carousel-img" :src="homeImagesList.images" >
+                </div>
+              </CarouselItem>
+            </Carousel>
+          </div>
+        </div>
+        <div class="who-is">
+          <ul class="people-list">
+            <li>
+              <img src="https://css.huijiaoyun.com/tianyu_edu/area/edu4.0/images/w_hjy/ami1.png">
+              <span>我是管理者</span>
+            </li>
+            <li>
+              <img src="https://css.huijiaoyun.com/tianyu_edu/area/edu4.0/images/w_hjy/ami2.png">
+              <span>我是教师</span>
+            </li>
+            <li>
+              <img src="https://css.huijiaoyun.com/tianyu_edu/area/edu4.0/images/w_hjy/ami3.png">
+              <span>我是学生</span>
+            </li>
+            <li>
+              <img src="https://css.huijiaoyun.com/tianyu_edu/area/edu4.0/images/w_hjy/ami4.png">
+              <span>我是家长</span>
+            </li>
+          </ul>
+        </div>
+     </div>
+</template>
+<script>
+  export default {
+    data() {
+      return {
+        homeCarouselImg: [
+          {
+            images: 'https://css.huijiaoyun.com/tianyu_edu/area/edu4.0/images/w_hjy/banner/banner4.jpg'
+          },
+          {
+            images: require('../assets/image/banner02.png')
+          },
+          {
+            images: require('../assets/image/banner01.png')
+          }
+        ]
+      };
+    },
+   
+  }
+</script>
+<style scoped>
+  .home {
+    width: 100%;
+    margin: auto;
+  }
+
+  .title {
+    width: 100%;
+    margin-top:5%;
+  }
+
+  .header {
+    height: 80px;
+    background-color: rgb(29, 34, 34);
+  }
+
+  .demo-carousel {
+    width: 100%;
+  }
+
+  .carousel-img {
+    width: 100%;
+    cursor: pointer;
+    margin: auto;
+  }
+  .who-is {
+    height: 264px;
+    margin-top: -114px;
+    position: relative;
+    z-index: 21;
+    overflow: hidden;
+    margin-left:18%;
+  }
+  .people-list {
+    display: block;
+  }
+  .who-is ul{
+    list-style:none;
+  }
+    .who-is ul li span {
+      padding-top: 20px;
+      font-size: 24px;
+      color: #fff;
+    }
+    .who-is ul li {
+      float: left;
+      width: 300px;
+      height: 264px;
+      text-align: center;
+      position: relative;
+      /*opacity: 0;
+      opacity: 1\9;*/
+      background-color: #289EFB;
+    }
+      .who-is ul li img {
+        border: 0;
+        vertical-align: middle;
+        margin-top: 30%;
+      }
+</style>

TEAMModelOS.SmartTeach/ClientApp/router/routes.js

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