Przeglądaj źródła

活动二级页面

chenmy 6 lat temu
rodzic
commit
4773201881

BIN
TEAMModelOS.SmartTeach/ClientApp/assets/image/resource/ni_bg_ico01.png


BIN
TEAMModelOS.SmartTeach/ClientApp/assets/image/resource/ni_search_ico.png


BIN
TEAMModelOS.SmartTeach/ClientApp/assets/image/resource/rank_ico.png


+ 2 - 2
TEAMModelOS.SmartTeach/ClientApp/components/resource/activitycommon.vue

@@ -44,8 +44,8 @@
         navname: [
           { "id": 1, "title": '活动首页', "url": '/activity', },
           { "id": 2, "title": '活动指南', "url": '/activityguide', },
-          { "id": 3, "title": '作品展示', "url": '', },
-          { "id": 4, "title": '活动排行', "url": '', },
+          { "id": 3, "title": '作品展示', "url": '/activityshow', },
+          { "id": 4, "title": '活动排行', "url": '/activityrank', },
           { "id": 5, "title": '课题证书', "url": '', }
         ],
       }

+ 2 - 0
TEAMModelOS.SmartTeach/ClientApp/router/routes.js

@@ -9,6 +9,7 @@ import Videodetails from '@/view/resource/resourceindex/videodetails.vue'
 import Activity from '@/view/resource/activity'
 import ActivityGuide from '@/view/resource/activity_guide.vue'
 import ActivityShow from '@/view/resource/activity_show.vue'
+import ActivityRank from '@/view/resource/activity_rank.vue'
 import HomePage from '@/view/resource/HomePage'
 import Teacher from '@/view/resource/Teacher'
 import TeacherZone from '@/view/resource/TeacherZone'
@@ -23,6 +24,7 @@ export const routes = [
   { name: 'activity', path: '/activity', component: Activity },
   { name: 'ActivityGuide', path: '/activityguide', component: ActivityGuide },
   { name: 'ActivityShow', path: '/activityshow', component: ActivityShow },
+  { name: 'ActivityRank', path: '/activityrank', component: ActivityRank },
   { name: 'HomePage', path: '/HomePage', component: HomePage },
   { name: 'Teacher', path: '/Teacher', component: Teacher },
   { name: 'TeacherZone', path: '/TeacherZone', component: TeacherZone },

+ 1 - 1
TEAMModelOS.SmartTeach/ClientApp/view/resource/activity_guide.vue

@@ -207,7 +207,7 @@ import Header from '@/common/headers.vue'
     }
   }
 </script>
-<style>
+<style scoped>
   .activity_container {
     width: 100%;
     height: auto;

+ 129 - 0
TEAMModelOS.SmartTeach/ClientApp/view/resource/activity_rank.vue

@@ -0,0 +1,129 @@
+<template>
+  <div class="activity_container">
+    <Header></Header>
+    <Activitycommon></Activitycommon>
+    <div class="activityrank">
+      <div class="activityrank_box">
+        <div class="rowWrap py_white_bg pdt30">
+          <div class="w1200 clearfix ni_g_txt_center">
+            <a href="" class="ni_g_cup ni_a01 active"></a>
+            <a href="" class="ni_g_cup ni_a02 "></a>
+            <a href="" class="ni_g_cup ni_a03"></a>
+          </div>
+        </div>
+        <div class="rowWrap py_white_bg pdtb30">
+          <div class="w1200 ni_g_cup_list">
+            <!--选项卡切换 S-->
+            <div class="ni_table_class clearfix">
+              <a class="ni_a active" href="javascript:">达人</a>
+              <!--     <a class="ni_a" href="javascript:">初中</a>
+            <a class="ni_a" href="javascript:">高中</a> -->
+            </div>
+            <!--选项卡切换 E-->
+            <!--一二三名 只需要在对应tr标签上添加num01-->
+            <div class="top100">
+              <div style="text-align:center;font-size:18px;margin:30px;">
+                暂无数据
+              </div>
+
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <Footer></Footer>
+  </div>
+</template>
+<script>
+import Header from '@/common/headers.vue'
+  import Footer from '@/common/footer.vue'
+  import Activitycommon from '@/components/resource/activitycommon.vue'
+  export default {
+    components: {
+      Header,
+      Footer,
+      Activitycommon,
+    },
+    data() {
+      return {
+
+      }
+    }
+  }
+</script>
+<style scoped>
+  .activityrank {
+    width:100%;
+    height:auto;
+  }
+  .activityrank_box {
+    width:1200px;
+    height:auto;
+    margin:0 auto;
+  }
+  .rowWrap {
+    width: 100%;
+    background: white;
+  }
+  .ni_g_txt_center {
+    text-align: center;
+  }
+  .ni_g_cup {
+    height: 143px;
+    width: 190px;
+    background: url(../../assets/image/resource/rank_ico.png) no-repeat;
+    display: inline-block;
+    margin: 0 50px;
+  }
+    .ni_g_cup.ni_a01 {
+      background-position: -7px -9px;
+    }
+    .ni_g_cup.ni_a01.active {
+      background-position: -7px -208px;
+    }
+    .ni_g_cup.ni_a02 {
+      background-position: -307px -9px;
+    }
+    .ni_g_cup.ni_a03 {
+      background-position: -607px -9px;
+    }
+    .ni_g_cup.ni_a02:hover {
+      background-position: -307px -208px;
+    }
+    .ni_g_cup.ni_a03:hover {
+      background-position: -607px -208px;
+    }
+  .pdtb30 {
+    padding-top: 30px;
+    padding-bottom: 30px;
+  }
+  .rowWrap {
+    width: 100%;
+    background: white;
+  }
+  .ni_g_cup_list .ni_table_class {
+    width: 1100px;
+    padding-right: 100px;
+    position: relative;
+    height: 42px;
+    overflow: hidden;
+    display: block;
+  }
+     .ni_g_cup_list .ni_table_class a.active {
+      background: #91caff;
+      color: #fff;
+      text-decoration: none;
+    }
+    .ni_g_cup_list .ni_table_class a {
+      float: left;
+      height: 42px;
+      font-size: 18px;
+      color: #888;
+      line-height: 42px;
+      text-align: center;
+      border-top-right-radius: 5px;
+      border-top-left-radius: 5px;
+      padding: 0 20px;
+      margin-right: 10px;
+    }
+</style>

+ 256 - 3
TEAMModelOS.SmartTeach/ClientApp/view/resource/activity_show.vue

@@ -2,6 +2,89 @@
   <div class="activity_container">
     <Header></Header>
     <Activitycommon></Activitycommon>
+    <div class="activityshow">
+      <div class="activityshow_box">
+        <div class="ni_g_mainLeft01">
+          <div class="ni_g_lnav_tit ni_g_h56">
+            <span class="ni_span01">教材选择</span>
+          </div>
+          <div class="ni_g_lnav_sclass">
+            <div class="ni_sclass clearfix pdtb25 ni_bg_img01 period">
+              <a class="ni_g_text_align_right">学段 :</a>
+              <a href="javascript:" class="active" data-id="">全部</a>
+              <a href="javascript:" data-id="xx">小学</a>
+              <a href="javascript:" data-id="cz">初中</a>
+              <a href="javascript:" data-id="pg">高中</a>
+            </div>
+            <div class="ni_sclass_list">
+              <div class="ni_div clearfix subject">
+                <div class="ni_left ni_g_text_align_right">学科 :</div>
+                <div class="ni_right">
+                  <!--下拉插件 S-->
+                  <Select v-model="model1" style="width:150px;">
+                    <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
+                  </Select>
+                  <!--下拉插件 E-->
+                </div>
+              </div>
+              <div class="ni_div clearfix mgt20 edition">
+                <div class="ni_left ni_g_text_align_right">版本 :</div>
+                <div class="ni_right">
+                  <!--下拉插件 S-->
+                  <Select v-model="model1" style="width:150px;">
+                    <Option v-for="itemc in cityList1" :value="itemc.value" :key="itemc.value">{{ itemc.label }}</Option>
+                  </Select>
+                  <!--下拉插件 E-->
+                </div>
+              </div>
+              <div class="ni_div clearfix mgt20 volume">
+                <div class="ni_left ni_g_text_align_right">册别 :</div>
+                <div class="ni_right">
+                  <!--下拉插件 S-->
+                  <Select v-model="model1" style="width:150px;">
+                    <Option v-for="itemy in cityList2" :value="itemy.value" :key="itemy.value">{{ itemy.label }}</Option>
+                  </Select>
+                  <!--下拉插件 E-->
+                </div>
+              </div>
+
+            </div>
+          </div>
+          <div class="ni_tree_tools0816">
+            <div class="zTreeDemoBackground2 left">
+              <ul id="treeDemo2" class="ztree2"></ul>
+            </div>
+          </div>
+        </div>
+        <div class="ni_g_mainRight01">
+          <!--排序和搜索 S-->
+          <div class="ni_g_order_search clearfix">
+            <!--排序 S-->
+            <div class="ni_g_order">
+              <a class="ni_a01 noactive">排序:</a>
+              <a class="ni_a02 active" href="javascript:;" data-value="viewCount"><i class="ni_g_bg_ico01"></i>浏览最多</a>
+              <a class="ni_a03" href="javascript:;" data-value="laudCount"><i class="ni_g_bg_ico01"></i>票数最高</a>
+              <a class="ni_a04" href="javascript:;" data-value="commentCount"><i class="ni_g_bg_ico01"></i>点评最多</a>
+              <a class="ni_a05" href="javascript:;" data-value="addTime"><i class="ni_g_bg_ico01"></i>最新上传</a>
+              <a class="ni_a06 noactive">共<big class="totalnum">0</big>个文档</a>
+            </div>
+            <!--排序 E-->
+            <!--搜索 S-->
+            <div class="ni_g_search fr">
+              <input type="text" placeholder="请输入作者或作品名称进行搜索" class="inp ni_g_w230 key">
+              <a class="ni_button" href="javascript:;" onclick="loadList()"></a>
+            </div>
+            <!--搜索 E-->
+          </div>
+          <!--排序和搜索 E-->
+          <!--作品展示列表 S-->
+          <div class="ni_g_work listresource">
+            <img style="display: block;margin: 60px auto;" src="https://css.huijiaoyun.com/tianyu_edu/area/edu4.0/images/tianyu_cup/ni_search_no_a.png">
+          </div>
+          <!--作品展示列表 E-->
+        </div>
+      </div>
+    </div>
     <Footer></Footer>
   </div>
 </template>
@@ -17,11 +100,181 @@ import Header from '@/common/headers.vue'
     },
     data() {
       return {
-      
+        cityList: [
+          {
+            value: '语文',
+            label: '语文'
+          },
+          {
+            value: '数学',
+            label: '数学'
+          },
+          {
+            value: '英语',
+            label: '英语'
+          },
+          {
+            value: '体育',
+            label: '体育'
+          },
+        ],
+        cityList1: [
+          {
+            value: '人教版',
+            label: '人教版'
+          },
+        ],
+        cityList2: [
+          {
+            value: '2017-2018上册',
+            label: '2017-2018上册'
+          },
+          {
+            value: '2017-2018下册',
+            label: '2017-2018下册'
+          },
+        ],
       }
     }
   }
 </script>
-<style>
- 
+<style scoped>
+  .activityshow {
+    width: 100%;
+    height: 500px;
+    background: #f8f8f8;
+    padding-top: 30px;
+    padding-bottom: 30px;
+  }
+  .activityshow_box {
+    width:1200px;
+    height:auto;
+    margin:0 auto;
+  }
+  .ni_g_mainLeft01 {
+    float: left;
+    width: 208px;
+    border: 1px solid #e4e4e4;
+  }
+  .ni_g_h56 {
+    height: 56px;
+    line-height: 56px;
+  }
+
+  .ni_g_lnav_tit {
+    background: #65b9ff;
+    color: #fff;
+    font-size: 20px;
+    text-align: center;
+  }
+  .ni_g_lnav_sclass {
+    background: #fff;
+    padding:5px 0px 25px 0px;
+  }
+  .pdtb25 {
+    padding-top: 25px;
+    padding-bottom: 40px;
+  }
+  .clearfix {
+    display: block;
+  }
+  .ni_g_lnav_sclass .ni_sclass a, .ni_g_lnav_sclass .ni_sclass_list .ni_div .ni_left {
+    width: 20%;
+    padding: 4px 0;
+    float: left;
+    text-align: center;
+    display: inline-block;
+    color: #555;
+    font-size: 12px;
+    border-radius: 3px;
+  }
+    .ni_g_lnav_sclass .ni_sclass a.active {
+      background: #9d9d9d;
+      color: #fff;
+    }
+  .mgt20 {
+    margin-top: 20px;
+  }
+  .subject {
+    margin-top:20px;
+  }
+  .ni_g_mainRight01 {
+    float: right;
+    width: 954px;
+  }
+  .ni_g_order_search {
+    border-bottom: 1px solid #d0d0d0;
+    height: 47px;
+  }
+  .ni_g_order {
+    float: left;
+    font-size: 14px;
+    height: 36px;
+    line-height: 36px;
+  }
+  .fr {
+    float: right;
+  }
+  .ni_g_order a {
+    color: #555;
+    display: block;
+    float: left;
+    margin-left: 21px;
+    height: 47px;
+    border-bottom: 1px solid #d0d0d0;
+    padding: 0 4px;
+  }
+    .ni_g_order a.noactive {
+      border-bottom-color: transparent;
+      color: #555;
+    }
+    .ni_g_order a.active {
+      border-bottom-color: #288add;
+      text-decoration: none;
+      color: #288add;
+    }
+    .ni_g_order a .ni_g_bg_ico01 {
+      width: 22px;
+      height: 22px;
+      display: block;
+      float: left;
+      margin: 5px 3px 0 0;
+      background: url(../../assets/image/resource/ni_bg_ico01.png) no-repeat;
+    }
+    .ni_g_order a.ni_a02.active .ni_g_bg_ico01 {
+      background-position: -28px -60px;
+    }
+    .ni_g_order a.ni_a03 .ni_g_bg_ico01 {
+      background-position: 0 -96px;
+    }
+    .ni_g_order a.ni_a04 .ni_g_bg_ico01 {
+      background-position: 0 -125px;
+    }
+    .ni_g_order a.ni_a05 .ni_g_bg_ico01 {
+      background-position: 0 -158px;
+    }
+  .ni_g_search .inp {
+    padding-top: 9px;
+    padding-bottom: 8px;
+  }
+  .ni_g_w230 {
+    width: 230px;
+  }
+  .inp {
+    padding: 5px;
+    border: 1px solid #d5d5d5;
+    color: #888;
+    outline: none;
+    vertical-align: middle;
+  }
+  .ni_g_search .ni_button {
+    height: 37px;
+    width: 38px;
+    border: 1px solid #44a9f1;
+    display: block;
+    float: right;
+    border-top-right-radius: 3px;
+    border-bottom-right-radius: 3px;
+    background: url(../../assets/image/resource/ni_search_ico.png) no-repeat center center #56b8fd;
+  }
 </style>