|
@@ -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>
|