mirror of
https://github.com/wu736139669/vczero.github.io.git
synced 2026-08-05 06:23:38 +00:00
add t
This commit is contained in:
+54
-3
@@ -3,6 +3,7 @@ body{
|
||||
width:100%;
|
||||
background-color:#FAFBFB;
|
||||
font-family:"微软雅黑";
|
||||
min-width:308px;
|
||||
}
|
||||
|
||||
input{
|
||||
@@ -41,10 +42,9 @@ header div:nth-child(2){
|
||||
}
|
||||
#search_btn{
|
||||
width:50px;
|
||||
height:42px;
|
||||
height:46px;
|
||||
line-height:45px;
|
||||
text-align:center;
|
||||
margin-left:3px;
|
||||
background-color:#0091FF;
|
||||
border-left:0;
|
||||
border:0;
|
||||
@@ -95,7 +95,7 @@ section{
|
||||
right:5px;
|
||||
left:5px;
|
||||
border-top:1px solid #CCCCCC;
|
||||
background-color:#FFFFFF;
|
||||
/*background-color:#FFFFFF;*/
|
||||
font-size:12px;
|
||||
}
|
||||
|
||||
@@ -103,6 +103,8 @@ section{
|
||||
margin-top:5px;
|
||||
height:150px;
|
||||
border-bottom: 1px solid #A8A8A8;
|
||||
background-color: #FFF;
|
||||
min-width:290px;
|
||||
}
|
||||
|
||||
section .list_item:last-child{
|
||||
@@ -168,6 +170,55 @@ section .list_item:last-child{
|
||||
height:150px;display:block;
|
||||
}
|
||||
|
||||
#loading{
|
||||
position:absolute;top:170px;left:110px;z-index:2;
|
||||
}
|
||||
/* book detail*/
|
||||
#book_detail_info{
|
||||
width:100%;min-height:164px;
|
||||
font-size:14px;
|
||||
background-color: #FFF;
|
||||
min-width:308px;
|
||||
border-bottom: 1px dashed #CCCCCC;
|
||||
|
||||
}
|
||||
|
||||
.book_detail_pic{
|
||||
margin-top: 5px;
|
||||
margin-left:5px;
|
||||
width:104px;
|
||||
height:144px;
|
||||
}
|
||||
|
||||
.book_detail_title{
|
||||
color:#0091FF;
|
||||
margin-left: 10px;
|
||||
line-height:23px;
|
||||
}
|
||||
|
||||
.book_detail_sum{
|
||||
background-color: #FFF;
|
||||
margin-top:10px;font-size:14px;
|
||||
border-bottom: 1px dashed #CCCCCC;
|
||||
}
|
||||
|
||||
.book_detail_sum div{
|
||||
border:1px solid #2BB2A3;
|
||||
border-radius:2px;
|
||||
color: #2BB2A3;
|
||||
width:80px;
|
||||
height:30px;
|
||||
text-align: center;
|
||||
line-height:30px;
|
||||
}
|
||||
|
||||
.book_detail_t_w{
|
||||
max-width:120px;
|
||||
height:23px;
|
||||
line-height:33px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
+3
-2
@@ -2,7 +2,7 @@
|
||||
<html ng-app="app">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, minimal-ui" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
|
||||
<title>天天爱搜索</title>
|
||||
<link rel="stylesheet" type="text/css" href="../css/main.css">
|
||||
</head>
|
||||
@@ -24,12 +24,13 @@
|
||||
<a>电影</a>
|
||||
</footer>
|
||||
|
||||
<div style="position:absolute;top:170px;left:110px;z-index:2;">
|
||||
<div id="loading">
|
||||
<img src="../imgs/loading.gif" />
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="../js/angular.js"></script>
|
||||
<script type="text/javascript" src="../js/angular-route.js" ></script>
|
||||
<script type="text/javascript" src="../lib/config.js"></script>
|
||||
<script type="text/javascript" src="../lib/index.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,49 @@
|
||||
|
||||
<section ng-controller="BookDetailController">
|
||||
<div>
|
||||
<div id="book_detail_info">
|
||||
<div class="fl book_detail_pic">
|
||||
<img class="book_detail_pic" ng-src="{{data.image}}"/>
|
||||
</div>
|
||||
<div class="fl">
|
||||
<div>
|
||||
<span class="book_detail_title">书名:</span><span class="overflow book_detail_t_w">{{data.title}}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="book_detail_title">作者:</span><span class="overflow book_detail_t_w">{{data.author[0]}}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="book_detail_title">出版社:</span><span class="overflow book_detail_t_w">{{data.publisher}}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="book_detail_title">价格:</span><span class="overflow book_detail_t_w">{{data.price}}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="book_detail_title">页码:</span><span class="overflow book_detail_t_w">{{data.pages}}页</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="book_detail_sum">
|
||||
<div>
|
||||
书籍简介
|
||||
</div>
|
||||
<span>
|
||||
{{data.summary}}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="book_detail_sum">
|
||||
<div>作者简介</div>
|
||||
<span>
|
||||
{{data.author_intro}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="height:45px;"></div>
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
@@ -0,0 +1,35 @@
|
||||
|
||||
<section ng-controller="BookListController">
|
||||
<div>
|
||||
<div class="list_item" ng-repeat="data in list">
|
||||
<a class="list_bookname_a" href="#/list/book/{{data.id}}">
|
||||
<div class="list_img overflow fl">
|
||||
<img class="list_img" ng-src="{{data.image}}"/>
|
||||
</div>
|
||||
<div class="list_content overflow fl">
|
||||
<div class="list_bookname overflow">
|
||||
{{data.origin_title}}
|
||||
</div>
|
||||
<div class="list_author overflow">
|
||||
{{data.author}} {{data.publisher}}
|
||||
</div>
|
||||
<div class="list_bookprice">
|
||||
<span class="list_price_num">
|
||||
{{data.price}}
|
||||
</span>
|
||||
<span>元</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="list_other overflow fr">
|
||||
<span>
|
||||
{{data.pages}}页
|
||||
</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div style="height:45px;"></div>
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
@@ -0,0 +1,9 @@
|
||||
(function(global){
|
||||
var config = {
|
||||
book_search: 'https://api.douban.com/v2/book/search',
|
||||
book_search_id: 'https://api.douban.com/v2/book/'
|
||||
};
|
||||
|
||||
global.CONFIG_SERVER = config;
|
||||
})(window);
|
||||
|
||||
+20
-12
@@ -3,34 +3,34 @@ var app = angular.module('app', ['ngRoute']);
|
||||
|
||||
app.config(['$routeProvider', function ($routeProvider) {
|
||||
$routeProvider
|
||||
.when('/list', {
|
||||
templateUrl: 'view/list.html',
|
||||
controller: 'BookListController'
|
||||
})
|
||||
.when('/list/book', {
|
||||
templateUrl: 'view/list.html',
|
||||
templateUrl: 'view/book_list.html',
|
||||
controller: 'BookListController'
|
||||
})
|
||||
.when('/list/:id', {
|
||||
templateUrl: 'view/detail.html',
|
||||
controller: 'BookListController'
|
||||
.when('/list/book/:id', {
|
||||
templateUrl: 'view/book_detail.html',
|
||||
controller: 'BookDetailController'
|
||||
})
|
||||
.otherwise({
|
||||
redirectTo: '/',
|
||||
templateUrl: 'view/list.html',
|
||||
templateUrl: 'view/book_list.html',
|
||||
controller: 'BookListController'
|
||||
});
|
||||
}]);
|
||||
|
||||
app.controller('BookListController', function($http, $scope){
|
||||
$http.jsonp('https://api.douban.com/v2/book/search?callback=showList&q=C%E8%AF%AD%E8%A8%80');
|
||||
window.showList = function(data){
|
||||
$http.jsonp(window.CONFIG_SERVER.book_search + '?callback=showBookList&count=10&q=C%E8%AF%AD%E8%A8%80');
|
||||
window.showBookList = function(data){
|
||||
if(data.books){
|
||||
document.getElementById('loading').style.visibility = 'hidden';
|
||||
}
|
||||
var list = [];
|
||||
for(var i = 0; i < data.books.length; i++){
|
||||
var book = data.books[i];
|
||||
var item = {
|
||||
id: book.id,
|
||||
image: book.image,
|
||||
origin_title: book.origin_title || '书名未共享',
|
||||
origin_title: book.title || '书名未共享',
|
||||
author: book.author[0] || '作者未知',
|
||||
publisher: book.publisher || '出版社未知',
|
||||
price: book.price.split('.')[0] || '未知',
|
||||
@@ -41,3 +41,11 @@ app.controller('BookListController', function($http, $scope){
|
||||
$scope.list = list;
|
||||
}
|
||||
});
|
||||
|
||||
app.controller('BookDetailController', function($http, $scope, $location){
|
||||
var id = $location.path().split('/book/')[1] || '';
|
||||
$http.jsonp(window.CONFIG_SERVER.book_search_id + '' + id + '?callback=showBookDeatil');
|
||||
window.showBookDeatil = function(data){
|
||||
$scope.data = data;
|
||||
};
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user