eduWeb/pages/search.html

268 lines
9.5 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>搜索页面</title>
<link rel="stylesheet" href="http://at.alicdn.com/t/font_2384888_ojge9md3tr.css
">
<link rel="shortcut icon" href="../favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="../css/online.css">
<script src="../js/vue.js"></script>
<script src="../js/axios.min.js"></script>
</head>
<body>
<q id="app">
<!-- 导航菜单 -->
<nav>
<div class="main">
<img src="../img/public/logo.png" alt="" class="logo">
<ul>
<li><a href="../index.html">首页</a></li>
<li ><a href="./online.html?typeId=1">Java</a></li>
<li ><a href="./online.html?typeId=2">Mysql</a></li>
<li ><a href="./online.html?typeId=3">Web</a></li>
</ul>
<div class="search">
<div class="left">课程<i class="iconfont icon-down"></i>
</div>
<input type="text" v-model="keyword" placeholder="搜索感兴趣的内容">
<img src="../img/public/search.png" @click="load_data(keyword)" alt="">
</div>
<div class="login">
<a href="./loginAndRegister/login.html">登陆</a>
/
<a href="./loginAndRegister/register.html">注册</a>
</div>
<div class="user">
<img src="../img/login/user.png" alt="">
<div class="userlist">
<ul>
<li>我是用户名</li>
<li>课程中心</li>
<li>订单中心</li>
<li>资金管理</li>
<li>个人中心</li>
<li class="out">退出登陆</li>
</ul>
</div>
</div>
</div>
</nav>
<!-- 主体内容 -->
<main>
<div class="row">
<div class="left">按省份选择</div>
<div class="right">
<span>省份<i class="iconfont icon-down"></i></span>
<span>城市<i class="iconfont icon-down"></i></span>
</div>
</div>
<div class="row">
<div class="left">热门城市</div>
<div class="right">
<ul>
<li><a>北京</a></li>
<li><a>上海</a></li>
<li><a>江苏</a></li>
<li><a>济南</a></li>
<li><a>河南</a></li>
<li><a>天津</a></li>
<li><a>沈阳</a></li>
<li><a>石家庄</a></li>
</ul>
</div>
</div>
<div class="row">
<div class="left">按年级选择</div>
<div class="right">
<ul>
<li><a>大班</a></li>
<li><a>中班</a></li>
<li><a>一年级</a></li>
<li><a>二年级</a></li>
<li><a>三年级</a></li>
<li><a>四年级</a></li>
<li><a>五年级</a></li>
<li><a>六年级</a></li>
<li><a>初一</a></li>
<li><a>初二</a></li>
<li><a>初三</a></li>
<li><a>高一</a></li>
<li><a>高二</a></li>
<li><a>高三</a></li>
</ul>
</div>
</div>
<div class="row">
<div class="left">按学科选择</div>
<div class="right">
<ul>
<li obj="1"><a>全部</a></li>
<li obj="yuwen"><a>语文</a></li>
<li obj="shuxue"><a>数学</a></li>
<li obj="english"><a>英语</a></li>
<li obj="shengwu"><a>生物</a></li>
<li obj="lishi"><a>历史</a></li>
<li obj="zhengzhi"><a>政治</a></li>
<li obj="wuli"><a>物理</a></li>
</ul>
</div>
</div>
<div class="row">
<div class="left">按版本选择</div>
<div class="right">
<ul>
<li><a class="active">人教版</a></li>
<li><a>沪教版</a></li>
<li><a>苏教版</a></li>
<li><a>浙教版</a></li>
<li><a>外研版</a></li>
<li><a>人教版</a></li>
<li><a>人教版</a></li>
</ul>
</div>
</div>
<div class="lesson">
<ul>
<li v-for="sc in datas" @click="toDetail(sc.cid)">
<div class="top">
<img :src="'.'+sc.courseImage" alt="" class="m">
<p>1100人在学习</p>
</div>
<div class="bottom">
<div class="left">
<span>{{sc.courseName}}</span>
<span class="time">23课时</span>
</div>
<div class="right">免费学习</div>
</div>
</li>
</ul>
</div>
<div class="pageNum">
<button>上一页</button>
<ul>
<li class="active">1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
</ul>
<button class="active">下一页</button>
</div>
</main>
</q>
<footer>
<div class="cont">
<div class="main">
<p>
首页 | 关于我们 | 加入我们 | 合作专区 | 联系我们 | AI开放平台 | 意见反馈 | 漏洞提交 | 隐私政策 | 版权声明 | 反盗链声明 | 网上有害信息举报 | 备案公示 | 营业执照
| 教师资格证公示
</p>
<p>
京ICP备 13030888号 Copyright © 2014-2019 行者信息科技(北京)有限公司 | 地址北京市新华区马当路388号C座 | 电话010-66666666 | 京公网安备
01010102002533号
</p>
<p>
京网文20184086-308号 | 网络文化经营许可证:沪网文[2018]4086-308号 | 增值电信业务经营许可证京B2-20150021 |
食品经营许可证JY13101140088888
</p>
<p>医疗器械经营许可证京嘉食药监械经营许20188008号 | 互联网药品信息服务资格证书:(京)-经营性-2018-0011 |</p>
</div>
</div>
</footer>
<div class="pos">
<div class="login">
<span class="close iconfont icon-close"></span>
<img src="../img/login/loginlogo.png" alt="">
<ul>
<li></li>
<li class="phone">使用手机号登陆</li>
<li></li>
</ul>
<input type="text" name="" id="" placeholder="请输入您的手机号">
<input type="password" name="" id="" placeholder="请输入密码">
<button class="loginbtn">
登陆
</button>
<p>
<span><a href="javascript:;">忘记密码</a></span>
<span>
还没有账号?
<a href="javascript:;">点击注册</a>
</span>
</p>
<ul>
<li></li>
<li class="phone">使用第三方软件登录</li>
<li></li>
</ul>
<p class="getCenter">
<img src="../img/login/wx.png" alt=""><img src="../img/login/qq.png" alt=""><img
src="../img/login/sina.png" alt="">
</p>
</div>
</div>
<script src="../js/ujiuye.js"></script>
<script src="../js/onlinedata.js"></script>
<script src="../js/online.js"></script>
<script>
var app=new Vue({
el:"#app",
data:{
datas:[],
keyword: ''
},
methods:{
//根据传入分类编号,读取对应全部的题目数据
load_data(keyword){
axios.get('http://localhost:8001/edu/course/search/'+keyword)
.then(res=>{
this.datas=res.data;
})
},
//跳转到课程详情页面
toDetail(cid){
location.href="./videoDetail.html?cid="+cid;
}
},
created(){
//捕获当前uri http://localhost:63342/uxue-edu-web001/pages/online.html?typeId=1
console.log(location.href)
var url=location.href;
var split= url.split("?");
//访问数组第2个 typeId=1
var parm= split[1];
var split2= parm.split("=");
var keyword=split2[1];
console.log("keyword:"+keyword)
//要编码后解码
this.keyword=decodeURI(keyword);
//调用方法,获取数据
this.load_data(keyword);
}
})
</script>
</body>
</html>