├── .gitignore ├── README.md ├── favicon.ico ├── icon ├── icon1.png ├── icon2.png ├── icon3.png ├── icon4.png ├── icon5.png ├── icon6.png ├── icon7.png ├── icon8.png ├── iconfont.css ├── iconfont.eot ├── iconfont.js ├── iconfont.svg ├── iconfont.ttf └── iconfont.woff ├── index.html ├── package.json ├── screenshot ├── 20170505163109.png ├── film.png ├── index.png ├── movie.png └── shop.png ├── src ├── components │ ├── App.js │ ├── Nav.js │ ├── TopBar.js │ ├── cinema │ │ ├── Cinema.js │ │ └── CinemaItem.js │ ├── home │ │ ├── Home.js │ │ ├── Item.js │ │ ├── MovieDetail.js │ │ └── Slider.js │ ├── movie │ │ ├── MoveItem.js │ │ ├── Movie.js │ │ └── MovieList.js │ └── shop │ │ ├── Shop.js │ │ └── ShopItem.js ├── css │ ├── app.js │ ├── app.scss │ ├── reset.css │ └── reset.js ├── data │ ├── banner.json │ ├── cinema.json │ ├── coming-soon-1.json │ ├── coming-soon-2.json │ ├── coming-soon-3.json │ ├── coming-soon-4.json │ ├── coming-soon-5.json │ ├── coming-soon.json │ ├── detail.json │ ├── now-playing-1.json │ ├── now-playing-2.json │ ├── now-playing-3.json │ ├── now-playing-4.json │ ├── now-playing-5.json │ ├── now-playing.json │ ├── shop-1.json │ ├── shop-2.json │ └── shop-3.json ├── index.js ├── router.js ├── store │ ├── action.js │ ├── index.js │ ├── reducer.js │ └── state.js └── swipe.js └── webpack.config.js /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # maizuo-react 2 | 仿卖座电影，官网地址http://m.maizuo.com/v4/?co=maizuo 3 | 4 | 5 | # 技术栈 6 | * react 7 | * react-router 路由 8 | * redux react-redux 状态管理 9 | * sass css预编译 10 | * swiper 轮播图 11 | 12 | # 界面预览 13 | ![首页](https://raw.githubusercontent.com/cncp20/maizuo-react/master/screenshot/20170505163109.png)
14 | ![film](https://github.com/cncp20/maizuo-react/blob/master/screenshot/index.png?raw=true)
15 | ![film](https://github.com/cncp20/maizuo-react/blob/master/screenshot/movie.png?raw=true)
16 | ![film](https://github.com/cncp20/maizuo-react/blob/master/screenshot/film.png?raw=true)
17 | ![index](https://github.com/cncp20/maizuo-react/blob/master/screenshot/shop.png?raw=true)
18 | -------------------------------------------------------------------------------- /favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cncp20/maizuo-react/843b70cd780b8394dbf28d340ad13ed2bf4bd5f3/favicon.ico -------------------------------------------------------------------------------- /icon/icon1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cncp20/maizuo-react/843b70cd780b8394dbf28d340ad13ed2bf4bd5f3/icon/icon1.png -------------------------------------------------------------------------------- /icon/icon2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cncp20/maizuo-react/843b70cd780b8394dbf28d340ad13ed2bf4bd5f3/icon/icon2.png -------------------------------------------------------------------------------- /icon/icon3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cncp20/maizuo-react/843b70cd780b8394dbf28d340ad13ed2bf4bd5f3/icon/icon3.png -------------------------------------------------------------------------------- /icon/icon4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cncp20/maizuo-react/843b70cd780b8394dbf28d340ad13ed2bf4bd5f3/icon/icon4.png -------------------------------------------------------------------------------- /icon/icon5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cncp20/maizuo-react/843b70cd780b8394dbf28d340ad13ed2bf4bd5f3/icon/icon5.png -------------------------------------------------------------------------------- /icon/icon6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cncp20/maizuo-react/843b70cd780b8394dbf28d340ad13ed2bf4bd5f3/icon/icon6.png -------------------------------------------------------------------------------- /icon/icon7.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cncp20/maizuo-react/843b70cd780b8394dbf28d340ad13ed2bf4bd5f3/icon/icon7.png -------------------------------------------------------------------------------- /icon/icon8.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cncp20/maizuo-react/843b70cd780b8394dbf28d340ad13ed2bf4bd5f3/icon/icon8.png -------------------------------------------------------------------------------- /icon/iconfont.css: -------------------------------------------------------------------------------- 1 | 2 | @font-face {font-family: "iconfont"; 3 | src: url('iconfont.eot?t=1493347998960'); /* IE9*/ 4 | src: url('iconfont.eot?t=1493347998960#iefix') format('embedded-opentype'), /* IE6-IE8 */ 5 | url('iconfont.woff?t=1493347998960') format('woff'), /* chrome, firefox */ 6 | url('iconfont.ttf?t=1493347998960') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/ 7 | url('iconfont.svg?t=1493347998960#iconfont') format('svg'); /* iOS 4.1- */ 8 | } 9 | 10 | .iconfont { 11 | font-family:"iconfont" !important; 12 | font-size:16px; 13 | font-style:normal; 14 | -webkit-font-smoothing: antialiased; 15 | -moz-osx-font-smoothing: grayscale; 16 | } 17 | 18 | .icon-back:before { content: "\e6c9"; } 19 | 20 | .icon-right:before { content: "\e613"; } 21 | 22 | .icon-menu:before { content: "\e6c1"; } 23 | 24 | .icon-down:before { content: "\e611"; } 25 | 26 | .icon-my:before { content: "\e6c3"; } 27 | 28 | -------------------------------------------------------------------------------- /icon/iconfont.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cncp20/maizuo-react/843b70cd780b8394dbf28d340ad13ed2bf4bd5f3/icon/iconfont.eot -------------------------------------------------------------------------------- /icon/iconfont.js: -------------------------------------------------------------------------------- 1 | ;(function(window) { 2 | 3 | var svgSprite = '' + 4 | '' + 5 | '' + 6 | '' + 7 | '' + 8 | '' + 9 | '' + 10 | '' + 11 | '' + 12 | '' + 13 | '' + 14 | '' + 15 | '' + 16 | '' + 17 | '' + 18 | '' + 19 | '' + 20 | '' + 21 | '' + 22 | '' + 23 | '' + 24 | '' + 25 | '' + 26 | '' + 27 | '' + 28 | '' + 29 | '' + 30 | '' + 31 | '' + 32 | '' + 33 | '' + 34 | '' + 35 | '' 36 | var script = function() { 37 | var scripts = document.getElementsByTagName('script') 38 | return scripts[scripts.length - 1] 39 | }() 40 | var shouldInjectCss = script.getAttribute("data-injectcss") 41 | 42 | /** 43 | * document ready 44 | */ 45 | var ready = function(fn) { 46 | if (document.addEventListener) { 47 | if (~["complete", "loaded", "interactive"].indexOf(document.readyState)) { 48 | setTimeout(fn, 0) 49 | } else { 50 | var loadFn = function() { 51 | document.removeEventListener("DOMContentLoaded", loadFn, false) 52 | fn() 53 | } 54 | document.addEventListener("DOMContentLoaded", loadFn, false) 55 | } 56 | } else if (document.attachEvent) { 57 | IEContentLoaded(window, fn) 58 | } 59 | 60 | function IEContentLoaded(w, fn) { 61 | var d = w.document, 62 | done = false, 63 | // only fire once 64 | init = function() { 65 | if (!done) { 66 | done = true 67 | fn() 68 | } 69 | } 70 | // polling for no errors 71 | var polling = function() { 72 | try { 73 | // throws errors until after ondocumentready 74 | d.documentElement.doScroll('left') 75 | } catch (e) { 76 | setTimeout(polling, 50) 77 | return 78 | } 79 | // no errors, fire 80 | 81 | init() 82 | }; 83 | 84 | polling() 85 | // trying to always fire before onload 86 | d.onreadystatechange = function() { 87 | if (d.readyState == 'complete') { 88 | d.onreadystatechange = null 89 | init() 90 | } 91 | } 92 | } 93 | } 94 | 95 | /** 96 | * Insert el before target 97 | * 98 | * @param {Element} el 99 | * @param {Element} target 100 | */ 101 | 102 | var before = function(el, target) { 103 | target.parentNode.insertBefore(el, target) 104 | } 105 | 106 | /** 107 | * Prepend el to target 108 | * 109 | * @param {Element} el 110 | * @param {Element} target 111 | */ 112 | 113 | var prepend = function(el, target) { 114 | if (target.firstChild) { 115 | before(el, target.firstChild) 116 | } else { 117 | target.appendChild(el) 118 | } 119 | } 120 | 121 | function appendSvg() { 122 | var div, svg 123 | 124 | div = document.createElement('div') 125 | div.innerHTML = svgSprite 126 | svgSprite = null 127 | svg = div.getElementsByTagName('svg')[0] 128 | if (svg) { 129 | svg.setAttribute('aria-hidden', 'true') 130 | svg.style.position = 'absolute' 131 | svg.style.width = 0 132 | svg.style.height = 0 133 | svg.style.overflow = 'hidden' 134 | prepend(svg, document.body) 135 | } 136 | } 137 | 138 | if (shouldInjectCss && !window.__iconfont__svg__cssinject__) { 139 | window.__iconfont__svg__cssinject__ = true 140 | try { 141 | document.write(""); 142 | } catch (e) { 143 | console && console.log(e) 144 | } 145 | } 146 | 147 | ready(appendSvg) 148 | 149 | 150 | })(window) -------------------------------------------------------------------------------- /icon/iconfont.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Created by FontForge 20120731 at Fri Apr 28 10:53:18 2017 6 | By admin 7 | 8 | 9 | 10 | 24 | 26 | 28 | 30 | 32 | 34 | 38 | 40 | 42 | 45 | 47 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /icon/iconfont.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cncp20/maizuo-react/843b70cd780b8394dbf28d340ad13ed2bf4bd5f3/icon/iconfont.ttf -------------------------------------------------------------------------------- /icon/iconfont.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cncp20/maizuo-react/843b70cd780b8394dbf28d340ad13ed2bf4bd5f3/icon/iconfont.woff -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 电影 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react-obj", 3 | "version": "1.0.0", 4 | "description": "play and test", 5 | "repository": "http://github/wan9alex.io", 6 | "main": "index.js", 7 | "scripts": { 8 | "test": "echo \"Error: no test specified\" && exit 1", 9 | "dev": "webpack-dev-server --hot --inline --open --port 8001 --history-api-fallback", 10 | "build": "webpack -p" 11 | }, 12 | "author": "wan9", 13 | "license": "ISC", 14 | "devDependencies": { 15 | "babel-core": "^6.21.0", 16 | "babel-loader": "^6.2.10", 17 | "babel-preset-es2015": "^6.18.0", 18 | "babel-preset-react": "^6.16.0", 19 | "babel-preset-stage-2": "^6.18.0", 20 | "css-loader": "^0.23.1", 21 | "extract-text-webpack-plugin": "^1.0.1", 22 | "fetch-jsonp": "^1.0.6", 23 | "file-loader": "^0.8.5", 24 | "jsx-loader": "^0.13.2", 25 | "node-sass": "^3.13.0", 26 | "pubsub-js": "^1.5.6", 27 | "rc-queue-anim": "^0.13.3", 28 | "react": "^15.3.2", 29 | "react-addons-css-transition-group": "^15.4.2", 30 | "react-dom": "^15.3.2", 31 | "react-redux": "^5.0.3", 32 | "react-router": "^3.0.0", 33 | "react-router-dom": "^4.0.0", 34 | "redux": "^3.6.0", 35 | "redux-thunk": "^2.2.0", 36 | "sass-loader": "^4.0.2", 37 | "style-loader": "^0.13.1", 38 | "url-loader": "^0.5.7", 39 | "webpack": "^1.13.1", 40 | "webpack-dev-server": "^1.16.2" 41 | } 42 | } 43 | -------------------------------------------------------------------------------- /screenshot/20170505163109.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cncp20/maizuo-react/843b70cd780b8394dbf28d340ad13ed2bf4bd5f3/screenshot/20170505163109.png -------------------------------------------------------------------------------- /screenshot/film.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cncp20/maizuo-react/843b70cd780b8394dbf28d340ad13ed2bf4bd5f3/screenshot/film.png -------------------------------------------------------------------------------- /screenshot/index.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cncp20/maizuo-react/843b70cd780b8394dbf28d340ad13ed2bf4bd5f3/screenshot/index.png -------------------------------------------------------------------------------- /screenshot/movie.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cncp20/maizuo-react/843b70cd780b8394dbf28d340ad13ed2bf4bd5f3/screenshot/movie.png -------------------------------------------------------------------------------- /screenshot/shop.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cncp20/maizuo-react/843b70cd780b8394dbf28d340ad13ed2bf4bd5f3/screenshot/shop.png -------------------------------------------------------------------------------- /src/components/App.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import "../css/app.scss"; 3 | import Nav from "./Nav"; 4 | import TopBar from "./TopBar"; 5 | import {connect} from "react-redux"; 6 | 7 | 8 | class App extends React.Component { 9 | render() { 10 | let {navShow} = this.props; 11 | return ( 12 |
13 | 14 | {navShow ? : ""} 15 | {this.props.children} 16 |
17 | ); 18 | } 19 | } 20 | const mapState = (state) => { 21 | return { 22 | navShow: state.navShow 23 | } 24 | } 25 | const mapDispatch = (dispatch) => { 26 | return { 27 | 28 | } 29 | } 30 | export default connect(mapState,mapDispatch)(App); 31 | -------------------------------------------------------------------------------- /src/components/Nav.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import ReactDom from "react-dom"; 3 | import {Link} from "react-router"; 4 | import {connect} from "react-redux"; 5 | 6 | class Nav extends React.Component { 7 | constructor() { 8 | super(); 9 | this.state = { 10 | navList: [ 11 | { name: '首页', path: "home" }, 12 | { name: '影片', path: "movie" }, 13 | { name: '影院', path: "cinema" }, 14 | { name: '商城', path: "shop" } 15 | ] 16 | } 17 | } 18 | render() { 19 | let {toggleNav } = this.props; 20 | return ( 21 |
22 | 27 |
28 | ); 29 | } 30 | } 31 | const mapState = (state) => { 32 | return { 33 | navShow: state.navShow 34 | } 35 | } 36 | const mapDispatch = (dispatch) => { 37 | return { 38 | toggleNav: (ev) => { 39 | dispatch({ 40 | type:"TOGGLE_NAV" 41 | }) 42 | ev.stopPropagation(); 43 | } 44 | } 45 | } 46 | export default connect(mapState,mapDispatch)(Nav); -------------------------------------------------------------------------------- /src/components/TopBar.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import {connect} from "react-redux"; 3 | 4 | class TopBar extends React.Component { 5 | render() { 6 | let {toggleNav} = this.props; 7 | return ( 8 |
9 | 10 |

电影

11 | 12 |
13 | ); 14 | } 15 | } 16 | const mapState = (state) => { 17 | return { 18 | 19 | } 20 | } 21 | const mapDispatch = (dispatch) => { 22 | return { 23 | toggleNav: () => { 24 | dispatch({ 25 | type:"TOGGLE_NAV" 26 | }) 27 | } 28 | } 29 | } 30 | 31 | export default connect(mapState,mapDispatch)(TopBar); -------------------------------------------------------------------------------- /src/components/cinema/Cinema.js: -------------------------------------------------------------------------------- 1 | import React,{Component} from "react"; 2 | import CinemaItem from "./CinemaItem"; 3 | 4 | class Cinema extends Component { 5 | constructor() { 6 | super(); 7 | this.state = { 8 | cinemas:[] 9 | }; 10 | } 11 | componentDidMount() { 12 | fetch("/src/data/cinema.json").then((res) => { 13 | if (res.ok) { 14 | res.json().then((data) => { 15 | this.setState({ 16 | cinemas: data.data.cinemas 17 | }) 18 | }) 19 | }else { 20 | console.log("error"); 21 | } 22 | }) 23 | } 24 | 25 | render() { 26 | let cinemas = this.state.cinemas; 27 | return ( 28 |
29 | {cinemas.length !== 0 ? cinemas.map((item , index) => { 30 | return 31 | }): ""} 32 |
33 | ) 34 | } 35 | 36 | } 37 | 38 | export default Cinema; -------------------------------------------------------------------------------- /src/components/cinema/CinemaItem.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | class CinemaItem extends React.Component { 4 | render() { 5 | let cinema = this.props.cinema; 6 | return ( 7 |
8 |

{cinema.name}

9 |
10 | {cinema.labels.map((item, index) => { 11 | return {item.name} 12 | })} 13 |
14 |

{cinema.address}

15 |
16 | ); 17 | } 18 | } 19 | 20 | export default CinemaItem; -------------------------------------------------------------------------------- /src/components/home/Home.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import ReactDom from "react-dom"; 3 | import Item from "./Item"; 4 | import Slider from "./Slider"; 5 | import { Link } from "react-router"; 6 | 7 | class Home extends React.Component { 8 | constructor() { 9 | super(); 10 | this.state = { 11 | banner: [], 12 | nowPlaying: [], 13 | comingSoon: [] 14 | } 15 | } 16 | render() { 17 | let nowPlaying = this.state.nowPlaying; 18 | let comingSoon = this.state.comingSoon; 19 | return ( 20 |
21 | {this.state.banner.length !== 0 ? : ""} 22 | {nowPlaying.length !== 0 ?
23 | { 24 | nowPlaying.map((item, index) => { 25 | return 26 | }) 27 | } 28 | 更多热映电影 29 |
: ""} 30 | 31 | {comingSoon.length !== 0 ?
32 |

即将上映

33 | { 34 | comingSoon.map((item, index) => { 35 | return 36 | }) 37 | } 38 | 更多即将上映电影 39 |
: ""} 40 |
41 | ); 42 | } 43 | componentDidMount() { 44 | var mySwipe = new Swipe(document.getElementById("banner"), { 45 | auto: 2000, 46 | continuous: true, 47 | stopPropation: true 48 | }); 49 | fetch("/src/data/banner.json").then((res) => { 50 | if (res.ok) { 51 | return res.json(); 52 | } else { 53 | console.log("error"); 54 | } 55 | }).then((data) => { 56 | this.setState({ 57 | banner: data.data.billboards 58 | }) 59 | fetch("/src/data/now-playing.json").then((res) => { 60 | if (res.ok) { 61 | res.json().then((data) => { 62 | this.setState({ 63 | nowPlaying: data.data.films 64 | }) 65 | }); 66 | } else { 67 | console.log("error"); 68 | } 69 | }); 70 | fetch("/src/data/coming-soon.json").then((res) => { 71 | if (res.ok) { 72 | res.json().then((data) => { 73 | this.setState({ 74 | comingSoon: data.data.films 75 | }) 76 | }); 77 | } else { 78 | console.log("error"); 79 | } 80 | }); 81 | }) 82 | } 83 | } 84 | 85 | export default Home; -------------------------------------------------------------------------------- /src/components/home/Item.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import {Link} from "react-router"; 3 | 4 | class Item extends React.Component { 5 | render() { 6 | let film = this.props.film; 7 | return ( 8 |
9 | 10 | 11 | { 12 | !film.isComingSoon ?
13 |

{film.name}{film.grade}

14 |

{film.cinemaCount}家影院上映 {film.watchCount}人购票

15 |
:
16 |

{film.name}{this.formatDate(film.premiereAt)}

17 |
18 | } 19 | 20 |
21 | ); 22 | } 23 | formatDate(time) { 24 | let date = new Date(time); 25 | return (date.getMonth() + 1) + "月" + date.getDate() + "日上映" 26 | } 27 | } 28 | 29 | export default Item; -------------------------------------------------------------------------------- /src/components/home/MovieDetail.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from "react"; 2 | 3 | class MovieDetail extends Component { 4 | constructor() { 5 | super(); 6 | this.state = { 7 | film:{} 8 | } 9 | } 10 | componentDidMount() { 11 | fetch("/src/data/detail.json").then((res) => { 12 | if(res.ok) { 13 | res.json().then((data) => { 14 | this.setState({ 15 | film:data.data.film 16 | }) 17 | }) 18 | }else { 19 | console.log("error"); 20 | } 21 | }) 22 | } 23 | render() { 24 | let film = this.state.film; 25 | return ( 26 | !film.name ?
:
27 | 28 |
29 |

影片简介

30 |

导演：{film.director}

31 |

主演：{film.actors.map((item, index) => { 32 | return {item.name} 33 | })}

34 |

语言：{film.language}

35 |

类型：{film.category}

36 |

上映时间：{this.formatDate(film.premiereAt)}

37 |

{film.synopsis}

38 |
39 |
40 | ) 41 | } 42 | formatDate(time) { 43 | let date = new Date(time); 44 | return (date.getMonth() + 1) + "月" + date.getDate() + "日上映" 45 | } 46 | } 47 | 48 | export default MovieDetail; -------------------------------------------------------------------------------- /src/components/home/Slider.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | class Slider extends Component { 3 | componentDidMount() { 4 | var mySwipe = new Swipe(document.getElementById("banner-container"), { 5 | continuous:true, 6 | stopPropation:true, 7 | auto:4000 8 | }) 9 | } 10 | render() { 11 | return ( 12 | 21 | 22 | ); 23 | } 24 | } 25 | export default Slider; -------------------------------------------------------------------------------- /src/components/movie/MoveItem.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import {Link} from "react-router"; 3 | 4 | class MovieItem extends React.Component { 5 | render() { 6 | let film = this.props.film; 7 | return ( 8 |
9 | 10 | 11 |
12 |

{film.name}{film.grade}

13 |

{film.intro}

14 |

{film.cinemaCount}家影院上映 {film.watchCount}人购票

15 |
16 | 17 |
18 | ); 19 | } 20 | } 21 | 22 | export default MovieItem; -------------------------------------------------------------------------------- /src/components/movie/Movie.js: -------------------------------------------------------------------------------- 1 | import React, { 2 | Component 3 | } from "react"; 4 | import { 5 | Link 6 | } from "react-router"; 7 | import { 8 | connect 9 | } from "react-redux"; 10 | import MovieList from "./MovieList"; 11 | 12 | 13 | import { bindActionCreators } from "redux"; 14 | import * as action from "../../store/action"; 15 | 16 | class Movie extends Component { 17 | constructor() { 18 | super(); 19 | this.state = { 20 | nowData: [], 21 | nowPg: 1 22 | } 23 | this.sc = this.sc.bind(this); 24 | } 25 | componentDidMount() { 26 | let { tabNow, tabComing } = this.props.actions; 27 | if (this.props.router.location.pathname == "/movie/coming-soon") { 28 | tabComing() 29 | } else { 30 | tabNow() 31 | } 32 | } 33 | sc() { 34 | let { isNow, nowPage, comingPage } = this.props; 35 | let { getMoreNow, changeNowPage, getMoreComing, changeComingPage } = this.props.actions; 36 | let el = this.refs.el; 37 | if (el.scrollTop + el.clientHeight >= el.scrollHeight) { 38 | if (isNow) { 39 | if (nowPage >= 5 ) return; 40 | getMoreNow(nowPage + 1); 41 | changeNowPage(nowPage + 1); 42 | } else { 43 | if (comingPage >= 5 ) return; 44 | getMoreComing(comingPage + 1); 45 | changeComingPage(comingPage + 1); 46 | } 47 | 48 | } 49 | } 50 | render() { 51 | let nowData = this.state.nowData; 52 | let { isNow } = this.props; 53 | let { tabNow, tabComing } = this.props.actions; 54 | return ( 55 |
56 |

57 | 正在热映 58 | 即将上映 59 |

60 | { 61 | /*this.props.children && React.cloneElement(this.props.children, {tab:this.state.tab })*/ 62 | } 63 | < MovieList> 64 | 65 |
66 | ) 67 | } 68 | } 69 | const mapStateToProps = (state) => { 70 | return { 71 | isNow: state.isNow, 72 | nowPage: state.nowPage, 73 | comingPage: state.comingPage 74 | } 75 | } 76 | // const mapDispatchToProps = (dispatch) => { 77 | // return { 78 | // tabNow:() => { 79 | // dispatch({ 80 | // type:"TAB_NOW" 81 | // }); 82 | // }, 83 | // tabComing:() => { 84 | // dispatch({ 85 | // type:"TAB_COMING" 86 | // }); 87 | // } 88 | // } 89 | // } 90 | const mapDispatchToProps = (dispatch) => { 91 | return { 92 | actions: bindActionCreators(action, dispatch) 93 | } 94 | } 95 | export default connect(mapStateToProps, mapDispatchToProps)(Movie); -------------------------------------------------------------------------------- /src/components/movie/MovieList.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import MovieItem from "./MoveItem"; 3 | import { connect } from "react-redux"; 4 | 5 | class MovieList extends React.Component { 6 | render() { 7 | let { isNow, nowList, comingList} = this.props; 8 | return ( 9 |
10 | { 11 | isNow ? nowList.map((item, index) => { 12 | return
13 | }) : comingList.map((item, index) => { 14 | return
15 | }) 16 | } 17 |
18 | ); 19 | } 20 | } 21 | const mapStateToProps = (state) => { 22 | return { 23 | isNow: state.isNow, 24 | nowList: state.nowList, 25 | comingList: state.comingList 26 | } 27 | } 28 | const mapDispatchToProps = (dispatch) => { 29 | return { 30 | 31 | } 32 | } 33 | export default connect(mapStateToProps, mapDispatchToProps)(MovieList); -------------------------------------------------------------------------------- /src/components/shop/Shop.js: -------------------------------------------------------------------------------- 1 | import React,{Component} from "react"; 2 | import ShopItem from "./ShopItem"; 3 | 4 | class Shop extends Component { 5 | constructor() { 6 | super(); 7 | this.state = { 8 | shopData:[], 9 | shopPg:1, 10 | category:[ 11 | {name:"3D眼镜", img:"/icon/icon1.png"}, 12 | {name:"充电装备", img:"/icon/icon2.png"}, 13 | {name:"手机配件", img:"/icon/icon3.png"}, 14 | {name:"居家百货", img:"/icon/icon4.png"}, 15 | {name:"数据线", img:"/icon/icon5.png"}, 16 | {name:"服饰箱包", img:"/icon/icon6.png"}, 17 | {name:"模型玩具", img:"/icon/icon7.png"}, 18 | {name:"车载用品", img:"/icon/icon8.png"}, 19 | ] 20 | } 21 | this.getData = this.getData.bind(this); 22 | this.sc = this.sc.bind(this); 23 | } 24 | componentDidMount() { 25 | this.getData(this.state.shopPg); 26 | } 27 | getData(pg) { 28 | fetch("/src/data/shop-" + pg + ".json").then((res) => { 29 | if (res.ok) { 30 | res.json().then((data) => { 31 | let arr = this.state.shopData; 32 | data.data.list.map((item) => { 33 | arr.push(item); 34 | }) 35 | this.setState({ 36 | shopData:arr, 37 | }) 38 | }) 39 | }else { 40 | console.log("error"); 41 | } 42 | }); 43 | } 44 | sc() { 45 | let el = this.refs.el; 46 | let oPg = this.state.shopPg; 47 | if(el.scrollTop + el.clientHeight >= el.scrollHeight) { 48 | if(oPg >= 3) return; 49 | let nPg = oPg + 1; 50 | this.getData(nPg); 51 | this.setState({ 52 | shopPg: nPg 53 | }) 54 | } 55 | } 56 | render() { 57 | let shopData = this.state.shopData; 58 | return ( 59 |
60 | 68 |

精彩推荐

69 | {shopData.length !== 0 ? shopData.map((item, index) => { 70 | return 71 | }) : "" } 72 |
73 | ) 74 | } 75 | } 76 | 77 | export default Shop; -------------------------------------------------------------------------------- /src/components/shop/ShopItem.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | class ShopItem extends React.Component { 4 | render() { 5 | let product = this.props.product; 6 | return ( 7 |
8 | 9 |
10 |

{product.masterName}

11 |

{product.slaveName}

12 |

¥{product.skuList[0].price/100}已售{product.displaySalesCount}

13 |
14 | 15 |
16 | ); 17 | } 18 | } 19 | 20 | export default ShopItem; -------------------------------------------------------------------------------- /src/css/app.js: -------------------------------------------------------------------------------- 1 | import { StyleSheet } from 'react-native'; 2 | 3 | export default StyleSheet.create({ 4 | 'app': { 5 | 'width': [{ 'unit': '%H', 'value': 1 }], 6 | 'height': [{ 'unit': '%V', 'value': 1 }], 7 | 'display': 'flex', 8 | 'flexDirection': 'column' 9 | }, 10 | 'top-bar': { 11 | 'width': [{ 'unit': '%H', 'value': 1 }], 12 | 'height': [{ 'unit': 'px', 'value': 50 }], 13 | 'background': '#282828', 14 | 'fontSize': [{ 'unit': 'px', 'value': 18 }], 15 | 'color': '#fff', 16 | 'display': 'flex', 17 | 'alignItems': 'center', 18 | 'justifyContent': 'space-between', 19 | 'zIndex': '10' 20 | }, 21 | 'top-bar iconfont': { 22 | 'margin': [{ 'unit': 'px', 'value': 0 }, { 'unit': 'px', 'value': 20 }, { 'unit': 'px', 'value': 0 }, { 'unit': 'px', 'value': 20 }] 23 | }, 24 | 'nav': { 25 | 'background': '#282828', 26 | 'width': [{ 'unit': '%H', 'value': 0.66 }], 27 | 'height': [{ 'unit': '%V', 'value': 1 }], 28 | 'boxSizing': 'border-box', 29 | 'position': 'fixed', 30 | 'left': [{ 'unit': 'px', 'value': 0 }], 31 | 'top': [{ 'unit': 'px', 'value': 0 }], 32 | 'zIndex': '3' 33 | }, 34 | 'nav ul': { 35 | 'marginTop': [{ 'unit': 'px', 'value': 50 }] 36 | }, 37 | 'nav ul li': { 38 | 'color': '#333', 39 | 'height': [{ 'unit': 'px', 'value': 50 }], 40 | 'lineHeight': [{ 'unit': 'px', 'value': 50 }], 41 | 'boxSizing': 'border-box', 42 | 'borderBottom': [{ 'unit': 'px', 'value': 1 }, { 'unit': 'string', 'value': '#333' }, { 'unit': 'string', 'value': 'solid' }], 43 | 'padding': [{ 'unit': 'px', 'value': 0 }, { 'unit': 'px', 'value': 10 }, { 'unit': 'px', 'value': 0 }, { 'unit': 'px', 'value': 10 }], 44 | 'fontSize': [{ 'unit': 'px', 'value': 14 }] 45 | }, 46 | 'nav ul li a': { 47 | 'width': [{ 'unit': '%H', 'value': 1 }], 48 | 'height': [{ 'unit': '%V', 'value': 1 }], 49 | 'color': '#eee', 50 | 'display': 'flex', 51 | 'justifyContent': 'space-between' 52 | }, 53 | 'home': { 54 | 'flex': '1', 55 | 'overflow': 'auto', 56 | 'background': '#ebebeb', 57 | 'paddingBottom': [{ 'unit': 'px', 'value': 30 }] 58 | }, 59 | 'home #banner-container': { 60 | 'width': [{ 'unit': '%H', 'value': 1 }], 61 | 'height': [{ 'unit': 'px', 'value': 200 }], 62 | 'position': 'relative', 63 | 'overflow': 'hidden' 64 | }, 65 | 'home #banner-container banner': { 66 | 'height': [{ 'unit': 'px', 'value': 200 }] 67 | }, 68 | 'home #banner-container banner li': { 69 | 'float': 'left', 70 | 'position': 'relative' 71 | }, 72 | 'home #banner-container banner li img': { 73 | 'width': [{ 'unit': '%H', 'value': 1 }], 74 | 'height': [{ 'unit': 'px', 'value': 200 }] 75 | }, 76 | 'home now-play > a': { 77 | 'display': 'block', 78 | 'fontSize': [{ 'unit': 'px', 'value': 14 }], 79 | 'padding': [{ 'unit': 'px', 'value': 5 }, { 'unit': 'px', 'value': 10 }, { 'unit': 'px', 'value': 5 }, { 'unit': 'px', 'value': 10 }], 80 | 'border': [{ 'unit': 'px', 'value': 1 }, { 'unit': 'string', 'value': '#999' }, { 'unit': 'string', 'value': 'solid' }], 81 | 'borderRadius': '30px', 82 | 'margin': [{ 'unit': 'px', 'value': 30 }, { 'unit': 'string', 'value': 'auto' }, { 'unit': 'px', 'value': 30 }, { 'unit': 'string', 'value': 'auto' }], 83 | 'width': [{ 'unit': 'px', 'value': 130 }], 84 | 'textAlign': 'center' 85 | }, 86 | 'home coming-soon > a': { 87 | 'display': 'block', 88 | 'fontSize': [{ 'unit': 'px', 'value': 14 }], 89 | 'padding': [{ 'unit': 'px', 'value': 5 }, { 'unit': 'px', 'value': 10 }, { 'unit': 'px', 'value': 5 }, { 'unit': 'px', 'value': 10 }], 90 | 'border': [{ 'unit': 'px', 'value': 1 }, { 'unit': 'string', 'value': '#999' }, { 'unit': 'string', 'value': 'solid' }], 91 | 'borderRadius': '30px', 92 | 'margin': [{ 'unit': 'px', 'value': 30 }, { 'unit': 'string', 'value': 'auto' }, { 'unit': 'px', 'value': 30 }, { 'unit': 'string', 'value': 'auto' }], 93 | 'width': [{ 'unit': 'px', 'value': 130 }], 94 | 'textAlign': 'center' 95 | }, 96 | 'home line': { 97 | 'display': 'flex', 98 | 'marginBottom': [{ 'unit': 'px', 'value': 60 }] 99 | }, 100 | 'home line p': { 101 | 'flex': '1', 102 | 'borderBottom': [{ 'unit': 'px', 'value': 1 }, { 'unit': 'string', 'value': '#aaa' }, { 'unit': 'string', 'value': 'solid' }] 103 | }, 104 | 'home line span': { 105 | 'background': '#aaa', 106 | 'fontSize': [{ 'unit': 'px', 'value': 12 }], 107 | 'borderRadius': '2px', 108 | 'padding': [{ 'unit': 'px', 'value': 5 }, { 'unit': 'px', 'value': 5 }, { 'unit': 'px', 'value': 5 }, { 'unit': 'px', 'value': 5 }], 109 | 'marginBottom': [{ 'unit': 'px', 'value': -10 }], 110 | 'color': '#fff' 111 | }, 112 | 'home-item': { 113 | 'boxSizing': 'border-box', 114 | 'margin': [{ 'unit': 'px', 'value': 20 }, { 'unit': 'px', 'value': 20 }, { 'unit': 'px', 'value': 0 }, { 'unit': 'px', 'value': 20 }], 115 | 'boxShadow': [{ 'unit': 'px', 'value': 2 }, { 'unit': 'px', 'value': 2 }, { 'unit': 'px', 'value': 4 }, { 'unit': 'string', 'value': '#666' }] 116 | }, 117 | 'home-item img': { 118 | 'width': [{ 'unit': '%H', 'value': 1 }], 119 | 'height': [{ 'unit': 'px', 'value': 200 }] 120 | }, 121 | 'home-item home-info': { 122 | 'background': '#fff', 123 | 'padding': [{ 'unit': 'px', 'value': 10 }, { 'unit': 'px', 'value': 10 }, { 'unit': 'px', 'value': 10 }, { 'unit': 'px', 'value': 10 }] 124 | }, 125 | 'home-item home-info h1': { 126 | 'fontSize': [{ 'unit': 'px', 'value': 18 }], 127 | 'marginBottom': [{ 'unit': 'px', 'value': 5 }] 128 | }, 129 | 'home-item home-info h1 span': { 130 | 'color': '#f00', 131 | 'fontSize': [{ 'unit': 'px', 'value': 20 }], 132 | 'float': 'right' 133 | }, 134 | 'home-item home-info p': { 135 | 'color': '#333', 136 | 'fontSize': [{ 'unit': 'px', 'value': 14 }] 137 | }, 138 | 'movie': { 139 | 'flex': '1', 140 | 'overflow': 'auto', 141 | 'background': '#ebebeb', 142 | 'padding': [{ 'unit': 'px', 'value': 0 }, { 'unit': 'px', 'value': 20 }, { 'unit': 'px', 'value': 30 }, { 'unit': 'px', 'value': 20 }] 143 | }, 144 | 'movie movie-tab': { 145 | 'width': [{ 'unit': '%H', 'value': 1 }], 146 | 'height': [{ 'unit': 'px', 'value': 45 }], 147 | 'borderBottom': [{ 'unit': 'px', 'value': 2 }, { 'unit': 'string', 'value': 'orange' }, { 'unit': 'string', 'value': 'solid' }], 148 | 'display': 'flex' 149 | }, 150 | 'movie movie-tab a': { 151 | 'flex': '1', 152 | 'height': [{ 'unit': 'px', 'value': 45 }], 153 | 'lineHeight': [{ 'unit': 'px', 'value': 45 }], 154 | 'textAlign': 'center', 155 | 'boxSizing': 'border-box' 156 | }, 157 | 'movie movie-tab aactive': { 158 | 'color': 'orange', 159 | 'borderBottom': [{ 'unit': 'px', 'value': 3 }, { 'unit': 'string', 'value': 'orange' }, { 'unit': 'string', 'value': 'solid' }] 160 | }, 161 | 'movie-item': { 162 | 'padding': [{ 'unit': 'px', 'value': 20 }, { 'unit': 'px', 'value': 0 }, { 'unit': 'px', 'value': 20 }, { 'unit': 'px', 'value': 0 }], 163 | 'width': [{ 'unit': '%H', 'value': 1 }], 164 | 'borderBottom': [{ 'unit': 'px', 'value': 1 }, { 'unit': 'string', 'value': '#aaa' }, { 'unit': 'string', 'value': 'dashed' }] 165 | }, 166 | 'movie-item a': { 167 | 'width': [{ 'unit': '%H', 'value': 1 }], 168 | 'display': 'flex' 169 | }, 170 | 'movie-item a img': { 171 | 'width': [{ 'unit': 'px', 'value': 60 }], 172 | 'height': [{ 'unit': 'px', 'value': 82 }], 173 | 'marginRight': [{ 'unit': 'px', 'value': 10 }] 174 | }, 175 | 'movie-item a movie-info': { 176 | 'height': [{ 'unit': 'px', 'value': 82 }], 177 | 'flex': '1', 178 | 'display': 'flex', 179 | 'flexDirection': 'column', 180 | 'justifyContent': 'space-between' 181 | }, 182 | 'movie-item a movie-info h1': { 183 | 'fontSize': [{ 'unit': 'px', 'value': 18 }], 184 | 'marginBottom': [{ 'unit': 'px', 'value': 5 }] 185 | }, 186 | 'movie-item a movie-info h1 span': { 187 | 'color': '#f00', 188 | 'fontSize': [{ 'unit': 'px', 'value': 20 }], 189 | 'float': 'right' 190 | }, 191 | 'movie-item a movie-info p': { 192 | 'color': '#333', 193 | 'fontSize': [{ 'unit': 'px', 'value': 14 }] 194 | }, 195 | 'cinema': { 196 | 'flex': '1', 197 | 'overflow': 'auto', 198 | 'background': '#ebebeb' 199 | }, 200 | 'cinema-item': { 201 | 'padding': [{ 'unit': 'px', 'value': 20 }, { 'unit': 'px', 'value': 20 }, { 'unit': 'px', 'value': 20 }, { 'unit': 'px', 'value': 20 }], 202 | 'background': '#fff', 203 | 'borderBottom': [{ 'unit': 'px', 'value': 1 }, { 'unit': 'string', 'value': '#aaa' }, { 'unit': 'string', 'value': 'solid' }] 204 | }, 205 | 'cinema-item h1': { 206 | 'whiteSpace': 'nowrap', 207 | 'textOverflow': 'hidden', 208 | 'textOverflow': 'ellipsis' 209 | }, 210 | 'cinema-item p': { 211 | 'fontSize': [{ 'unit': 'px', 'value': 12 }], 212 | 'color': '#aaa', 213 | 'lineHeight': [{ 'unit': 'px', 'value': 15 }] 214 | }, 215 | 'cinema-item labels': { 216 | 'margin': [{ 'unit': 'px', 'value': 15 }, { 'unit': 'px', 'value': 0 }, { 'unit': 'px', 'value': 15 }, { 'unit': 'px', 'value': 0 }], 217 | 'fontSize': [{ 'unit': 'px', 'value': 12 }] 218 | }, 219 | 'cinema-item labels span': { 220 | 'background': 'orange', 221 | 'color': '#fff', 222 | 'borderRadius': '3px', 223 | 'marginRight': [{ 'unit': 'px', 'value': 5 }], 224 | 'padding': [{ 'unit': 'px', 'value': 2 }, { 'unit': 'px', 'value': 4 }, { 'unit': 'px', 'value': 2 }, { 'unit': 'px', 'value': 4 }] 225 | }, 226 | 'shop': { 227 | 'flex': '1', 228 | 'overflow': 'auto', 229 | 'background': '#ebebeb' 230 | }, 231 | 'shop category': { 232 | 'display': 'flex', 233 | 'flexWrap': 'wrap', 234 | 'background': '#fff' 235 | }, 236 | 'shop category li': { 237 | 'width': [{ 'unit': '%H', 'value': 0.25 }], 238 | 'height': [{ 'unit': 'px', 'value': 80 }], 239 | 'justifyContent': 'center', 240 | 'display': 'flex', 241 | 'flexDirection': 'column', 242 | 'alignItems': 'center' 243 | }, 244 | 'shop category li img': { 245 | 'width': [{ 'unit': 'px', 'value': 40 }], 246 | 'height': [{ 'unit': 'px', 'value': 40 }] 247 | }, 248 | 'shop category li p': { 249 | 'fontSize': [{ 'unit': 'px', 'value': 14 }] 250 | }, 251 | 'shop > p': { 252 | 'fontSize': [{ 'unit': 'px', 'value': 14 }], 253 | 'margin': [{ 'unit': 'px', 'value': 10 }, { 'unit': 'px', 'value': 5 }, { 'unit': 'px', 'value': 10 }, { 'unit': 'px', 'value': 5 }] 254 | }, 255 | 'shop-item': { 256 | 'padding': [{ 'unit': 'px', 'value': 20 }, { 'unit': 'px', 'value': 20 }, { 'unit': 'px', 'value': 20 }, { 'unit': 'px', 'value': 20 }], 257 | 'borderBottom': [{ 'unit': 'px', 'value': 1 }, { 'unit': 'string', 'value': '#ddd' }, { 'unit': 'string', 'value': 'solid' }], 258 | 'display': 'flex', 259 | 'background': '#fff' 260 | }, 261 | 'shop-item img': { 262 | 'width': [{ 'unit': 'px', 'value': 80 }], 263 | 'height': [{ 'unit': 'px', 'value': 80 }], 264 | 'marginRight': [{ 'unit': 'px', 'value': 20 }] 265 | }, 266 | 'shop-item shop-info': { 267 | 'width': [{ 'unit': 'px', 'value': 230 }], 268 | 'display': 'flex', 269 | 'flexDirection': 'column', 270 | 'justifyContent': 'space-between' 271 | }, 272 | 'shop-item shop-info h1': { 273 | 'fontSize': [{ 'unit': 'px', 'value': 14 }], 274 | 'whiteSpace': 'nowrap', 275 | 'overflow': 'hidden', 276 | 'textOverflow': 'ellipsis' 277 | }, 278 | 'shop-item shop-info h2': { 279 | 'fontSize': [{ 'unit': 'px', 'value': 12 }], 280 | 'color': '#aaa' 281 | }, 282 | 'shop-item shop-info p': { 283 | 'color': '#f00', 284 | 'fontSize': [{ 'unit': 'px', 'value': 14 }] 285 | }, 286 | 'shop-item shop-info p span': { 287 | 'color': '#aaa', 288 | 'float': 'right', 289 | 'fontSize': [{ 'unit': 'px', 'value': 12 }] 290 | }, 291 | 'detail': { 292 | 'flex': '1', 293 | 'overflow': 'auto', 294 | 'background': '#ebebeb' 295 | }, 296 | 'detail img': { 297 | 'width': [{ 'unit': '%H', 'value': 1 }], 298 | 'height': [{ 'unit': 'px', 'value': 210 }] 299 | }, 300 | 'detail info': { 301 | 'padding': [{ 'unit': 'px', 'value': 20 }, { 'unit': 'px', 'value': 20 }, { 'unit': 'px', 'value': 20 }, { 'unit': 'px', 'value': 20 }] 302 | }, 303 | 'detail h1': { 304 | 'fontSize': [{ 'unit': 'px', 'value': 18 }], 305 | 'marginBottom': [{ 'unit': 'px', 'value': 20 }] 306 | }, 307 | 'detail p': { 308 | 'margin': [{ 'unit': 'px', 'value': 10 }, { 'unit': 'px', 'value': 0 }, { 'unit': 'px', 'value': 10 }, { 'unit': 'px', 'value': 0 }], 309 | 'fontSize': [{ 'unit': 'px', 'value': 14 }], 310 | 'lineHeight': [{ 'unit': 'px', 'value': 18 }] 311 | } 312 | }); 313 | -------------------------------------------------------------------------------- /src/css/app.scss: -------------------------------------------------------------------------------- 1 | @mixin setwh($w, $h) { 2 | width: $w; 3 | height: $h; 4 | } 5 | 6 | @mixin singleMid($h) { 7 | height: $h; 8 | line-height: $h; 9 | } 10 | 11 | .app { 12 | @include setwh(100%, 100%); 13 | display: flex; 14 | flex-direction: column; 15 | } 16 | 17 | .top-bar { 18 | @include setwh(100%, 50px); 19 | background: #282828; 20 | font-size: 18px; 21 | color: #fff; 22 | display: flex; 23 | align-items: center; 24 | justify-content: space-between; 25 | z-index: 10; 26 | .iconfont { 27 | margin: 0 20px; 28 | } 29 | } 30 | 31 | .nav { 32 | background: #282828; 33 | width: 66%; 34 | height: 100%; 35 | box-sizing: border-box; 36 | position: fixed; 37 | left: 0; 38 | top: 0; 39 | z-index: 3; 40 | ul { 41 | margin-top: 50px; 42 | li { 43 | color: #333; 44 | @include singleMid(50px); 45 | box-sizing: border-box; 46 | border-bottom: 1px #333 solid; 47 | padding: 0 10px; 48 | font-size: 14px; 49 | a { 50 | width: 100%; 51 | height: 100%; 52 | color: #eee; 53 | display: flex; 54 | justify-content: space-between; 55 | } 56 | } 57 | } 58 | } 59 | 60 | .home { 61 | flex: 1; 62 | overflow: auto; 63 | background: #ebebeb; 64 | padding-bottom: 30px; 65 | #banner-container { 66 | @include setwh(100%, 200px); 67 | position: relative; 68 | overflow: hidden; 69 | .banner { 70 | height: 200px; 71 | li { 72 | float: left; 73 | position: relative; 74 | img { 75 | @include setwh(100%, 200px); 76 | } 77 | } 78 | } 79 | } 80 | .now-play, 81 | .coming-soon { 82 | &>a { 83 | display: block; 84 | font-size: 14px; 85 | padding: 5px 10px; 86 | border: 1px #999 solid; 87 | border-radius: 30px; 88 | margin: 30px auto; 89 | width: 130px; 90 | text-align: center; 91 | } 92 | } 93 | .line { 94 | display: flex; 95 | margin-bottom: 60px; 96 | p { 97 | flex: 1; 98 | border-bottom: 1px #aaa solid; 99 | } 100 | span { 101 | background: #aaa; 102 | font-size: 12px; 103 | border-radius: 2px; 104 | padding: 5px; 105 | margin-bottom: -10px; 106 | color: #fff; 107 | } 108 | } 109 | } 110 | 111 | .home-item { 112 | box-sizing: border-box; 113 | margin: 20px 20px 0; 114 | box-shadow: 2px 2px 4px #666; 115 | img { 116 | @include setwh(100%, 200px); 117 | } 118 | .home-info { 119 | background: #fff; 120 | padding: 10px; 121 | h1 { 122 | font-size: 18px; 123 | margin-bottom: 5px; 124 | span { 125 | color: #f00; 126 | font-size: 20px; 127 | float: right; 128 | } 129 | } 130 | p { 131 | color: #333; 132 | font-size: 14px; 133 | } 134 | } 135 | } 136 | 137 | .movie { 138 | flex: 1; 139 | overflow: auto; 140 | background: #ebebeb; 141 | padding: 0px 20px 30px; 142 | .movie-tab { 143 | @include setwh(100%, 45px); 144 | border-bottom: 2px orange solid; 145 | display: flex; 146 | a { 147 | flex: 1; 148 | @include singleMid(45px); 149 | text-align: center; 150 | box-sizing: border-box; 151 | &.active { 152 | color: orange; 153 | border-bottom: 3px orange solid; 154 | } 155 | } 156 | } 157 | } 158 | 159 | .movie-item { 160 | padding: 20px 0; 161 | width: 100%; 162 | border-bottom: 1px #aaa dashed; 163 | a { 164 | width: 100%; 165 | display: flex; 166 | img { 167 | @include setwh(60px, 82px); 168 | margin-right: 10px; 169 | } 170 | .movie-info { 171 | height: 82px; 172 | flex: 1; 173 | display: flex; 174 | flex-direction: column; 175 | justify-content: space-between; 176 | h1 { 177 | font-size: 18px; 178 | margin-bottom: 5px; 179 | span { 180 | color: #f00; 181 | font-size: 20px; 182 | float: right; 183 | } 184 | } 185 | p { 186 | color: #333; 187 | font-size: 14px; 188 | } 189 | } 190 | } 191 | } 192 | 193 | .cinema { 194 | flex: 1; 195 | overflow: auto; 196 | background: #ebebeb; 197 | } 198 | 199 | .cinema-item { 200 | padding: 20px; 201 | background: #fff; 202 | border-bottom: 1px #aaa solid; 203 | h1 { 204 | white-space: nowrap; 205 | text-overflow: hidden; 206 | text-overflow: ellipsis; 207 | } 208 | p { 209 | font-size: 12px; 210 | color: #aaa; 211 | line-height: 15px; 212 | } 213 | .labels { 214 | margin: 15px 0; 215 | font-size: 12px; 216 | span { 217 | background: orange; 218 | color: #fff; 219 | border-radius: 3px; 220 | margin-right: 5px; 221 | padding: 2px 4px; 222 | } 223 | } 224 | } 225 | 226 | .shop { 227 | flex: 1; 228 | overflow: auto; 229 | background: #ebebeb; 230 | .category { 231 | display: flex; 232 | flex-wrap: wrap; 233 | background: #fff; 234 | li { 235 | width: 25%; 236 | height: 80px; 237 | justify-content: center; 238 | display: flex; 239 | flex-direction: column; 240 | align-items: center; 241 | img { 242 | @include setwh(40px, 40px); 243 | } 244 | p { 245 | font-size: 14px; 246 | } 247 | } 248 | } 249 | &>p { 250 | font-size: 14px; 251 | margin: 10px 5px; 252 | } 253 | } 254 | 255 | .shop-item { 256 | padding: 20px; 257 | border-bottom: 1px #ddd solid; 258 | display: flex; 259 | background: #fff; 260 | img { 261 | @include setwh(80px, 80px); 262 | margin-right: 20px; 263 | } 264 | .shop-info { 265 | width: 230px; 266 | display: flex; 267 | flex-direction: column; 268 | justify-content: space-between; 269 | h1 { 270 | font-size: 14px; 271 | white-space: nowrap; 272 | overflow: hidden; 273 | text-overflow: ellipsis; 274 | } 275 | h2 { 276 | font-size: 12px; 277 | color: #aaa; 278 | } 279 | p { 280 | color: #f00; 281 | font-size: 14px; 282 | span { 283 | color: #aaa; 284 | float: right; 285 | font-size: 12px; 286 | } 287 | } 288 | } 289 | } 290 | 291 | .detail { 292 | flex: 1; 293 | overflow: auto; 294 | background: #ebebeb; 295 | img { 296 | @include setwh(100%, 210px); 297 | } 298 | .info { 299 | padding: 20px 20px; 300 | } 301 | h1 { 302 | font-size: 18px; 303 | margin-bottom: 20px; 304 | } 305 | p { 306 | margin: 10px 0; 307 | font-size: 14px; 308 | line-height: 18px; 309 | } 310 | } -------------------------------------------------------------------------------- /src/css/reset.css: -------------------------------------------------------------------------------- 1 | /** 2 | * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/) 3 | * http://cssreset.com 4 | */ 5 | html, body, div, span, applet, object, iframe, 6 | h1, h2, h3, h4, h5, h6, p, blockquote, pre, 7 | a, abbr, acronym, address, big, cite, code, 8 | del, dfn, em, img, ins, kbd, q, s, samp, 9 | small, strike, strong, sub, sup, tt, var, 10 | b, u, i, center, 11 | dl, dt, dd, ol, ul, li, 12 | fieldset, form, label, legend, 13 | table, caption, tbody, tfoot, thead, tr, th, td, 14 | article, aside, canvas, details, embed, 15 | figure, figcaption, footer, header, 16 | menu, nav, output, ruby, section, summary, 17 | time, mark, audio, video, input { 18 | margin: 0; 19 | padding: 0; 20 | border: 0; 21 | font-size: 100%; 22 | font-weight: normal; 23 | vertical-align: baseline; 24 | } 25 | 26 | /* HTML5 display-role reset for older browsers */ 27 | article, aside, details, figcaption, figure, 28 | footer, header, menu, nav, section { 29 | display: block; 30 | } 31 | 32 | body { 33 | line-height: 1; 34 | } 35 | 36 | blockquote, q { 37 | quotes: none; 38 | } 39 | 40 | blockquote:before, blockquote:after, 41 | q:before, q:after { 42 | content: none; 43 | } 44 | 45 | table { 46 | border-collapse: collapse; 47 | border-spacing: 0; 48 | } 49 | 50 | /* custom */ 51 | a { 52 | color: #000; 53 | text-decoration: none; 54 | -webkit-backface-visibility: hidden; 55 | } 56 | 57 | li { 58 | list-style: none; 59 | } 60 | 61 | 62 | ::-webkit-scrollbar { 63 | display: none; 64 | } 65 | 66 | html, body { 67 | width: 100%; 68 | height: 100%; 69 | } 70 | 71 | #app { 72 | width: 100%; 73 | height: 100%; 74 | } 75 | 76 | body { 77 | -webkit-text-size-adjust: none; 78 | -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 79 | } 80 | 81 | fix:after { 82 | content: " "; 83 | height: 0; 84 | font-size: 0; 85 | clear: both; 86 | display: block; 87 | } -------------------------------------------------------------------------------- /src/data/banner.json: -------------------------------------------------------------------------------- 1 | { 2 | "status": 0, 3 | "data": { 4 | "billboards": [ 5 | { 6 | "id": 648, 7 | "name": "5.1抢影票", 8 | "url": "http://m.maizuo.com/act/active/1154", 9 | "imageUrl": "https://pic.maizuo.com/h5PicUpload/a8df6800dee20943e7ee629fc4c2c18d.jpg", 10 | "weight": 2 11 | }, 12 | { 13 | "id": 649, 14 | "name": "X幻想 岛国奇片", 15 | "url": "http://cps.maizuo.com/changeUrl.htm?channelId=372&urlId=1501", 16 | "imageUrl": "https://pic.maizuo.com/h5PicUpload/4cde9c244f685148f7e839585fd57f5e.jpg", 17 | "weight": 9 18 | }, 19 | { 20 | "id": 650, 21 | "name": "熊本熊正版周边", 22 | "url": "http://m.maizuo.com/act/active/1160", 23 | "imageUrl": "https://pic.maizuo.com/h5PicUpload/9dc9fce2dfe9a207744e1b4c406d7df7.jpg", 24 | "weight": 1 25 | }, 26 | { 27 | "id": 651, 28 | "name": "2017[如果]田馥甄巡回演唱会PLUS", 29 | "url": "http://m.maizuo.com/act/active/1135", 30 | "imageUrl": "https://pic.maizuo.com/h5PicUpload/c891d3346ecbda99a3370ae5b34026a1.jpg", 31 | "weight": 1 32 | }, 33 | { 34 | "id": 655, 35 | "name": "春娇救志明", 36 | "url": "http://m.maizuo.com/act/active/1151", 37 | "imageUrl": "https://pic.maizuo.com/h5PicUpload/800476b18771136fd7e2944477e85b08.jpg", 38 | "weight": 2 39 | } 40 | ] 41 | }, 42 | "msg": "ok" 43 | } -------------------------------------------------------------------------------- /src/data/coming-soon-1.json: -------------------------------------------------------------------------------- 1 | { 2 | "status": 0, 3 | "data": { 4 | "films": [{ 5 | "id": 3647, 6 | "name": "银河护卫队2", 7 | "cover": { 8 | "origin": "https://pic.maizuo.com/usr/movie/bb468eeee509991ff8eb585c6897f0c5.jpg" 9 | }, 10 | "poster": { 11 | "origin": "https://pic.maizuo.com/usr/movie/7e6e6d01c4a22643dae2b1777cab524b.jpg", 12 | "thumbnail": "https://pic.maizuo.com/usr/movie/7e6e6d01c4a22643dae2b1777cab524b.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 13 | }, 14 | "intro": "星爵身世迷 终于见爹地", 15 | "premiereAt": 1493913600000, 16 | "grade": "8.5", 17 | "watchCount": 21237, 18 | "cinemaCount": 0, 19 | "scheduleCount": 0, 20 | "isPromotion": true, 21 | "isNowPlaying": "", 22 | "isComingSoon": true, 23 | "isPresold": "" 24 | }, { 25 | "id": 3663, 26 | "name": "摔跤吧！爸爸", 27 | "cover": { 28 | "origin": "https://pic.maizuo.com/usr/movie/50fee00488817e1acda5fad62ef66456.jpg" 29 | }, 30 | "poster": { 31 | "origin": "https://pic.maizuo.com/usr/movie/0478e393c2b69bd4b97666854af44263.jpg", 32 | "thumbnail": "https://pic.maizuo.com/usr/movie/0478e393c2b69bd4b97666854af44263.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 33 | }, 34 | "intro": "为圆摔跤梦 女儿不心疼", 35 | "premiereAt": 1493913600000, 36 | "grade": "9.5", 37 | "watchCount": 2911, 38 | "cinemaCount": 0, 39 | "scheduleCount": 0, 40 | "isPromotion": true, 41 | "isNowPlaying": "", 42 | "isComingSoon": true, 43 | "isPresold": "" 44 | }, { 45 | "id": 3488, 46 | "name": "咸鱼传奇", 47 | "cover": { 48 | "origin": "https://pic.maizuo.com/usr/100003488/2a84229ae00707143b6a55bf4b201eea.jpg" 49 | }, 50 | "poster": { 51 | "origin": "https://pic.maizuo.com/usr/100003488/1bb2435fbef875786c2b1397d533f8a8.jpg", 52 | "thumbnail": "https://pic.maizuo.com/usr/100003488/1bb2435fbef875786c2b1397d533f8a8.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 53 | }, 54 | "intro": "咸鱼也有梦 跨越千年追", 55 | "premiereAt": 1493913600000, 56 | "grade": "8.0", 57 | "watchCount": 348, 58 | "cinemaCount": 0, 59 | "scheduleCount": 0, 60 | "isPromotion": false, 61 | "isNowPlaying": "", 62 | "isComingSoon": true, 63 | "isPresold": "" 64 | }, { 65 | "id": 3648, 66 | "name": "海阔天空", 67 | "cover": { 68 | "origin": "https://pic.maizuo.com/usr/movie/5e7b5238bb39ec2328d7aeb16cec0898.jpg" 69 | }, 70 | "poster": { 71 | "origin": "https://pic.maizuo.com/usr/movie/e01fded12252b763676ab0bf40b267fa.jpg", 72 | "thumbnail": "https://pic.maizuo.com/usr/movie/e01fded12252b763676ab0bf40b267fa.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 73 | }, 74 | "intro": "", 75 | "premiereAt": 1493913600000, 76 | "grade": "8.0", 77 | "watchCount": 0, 78 | "cinemaCount": 0, 79 | "scheduleCount": 0, 80 | "isPromotion": false, 81 | "isNowPlaying": "", 82 | "isComingSoon": true, 83 | "isPresold": "" 84 | }, { 85 | "id": 3672, 86 | "name": "黑白照相馆", 87 | "cover": { 88 | "origin": "https://pic.maizuo.com/usr/movie/12e89451f7b20677cff235a39dd7d255.jpg" 89 | }, 90 | "poster": { 91 | "origin": "https://pic.maizuo.com/usr/movie/881e3465b398834feab9b69f35f045cf.jpg", 92 | "thumbnail": "https://pic.maizuo.com/usr/movie/881e3465b398834feab9b69f35f045cf.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 93 | }, 94 | "intro": "神秘照相馆 空间会逆变", 95 | "premiereAt": 1493913600000, 96 | "grade": "8.0", 97 | "watchCount": 0, 98 | "cinemaCount": 0, 99 | "scheduleCount": 0, 100 | "isPromotion": false, 101 | "isNowPlaying": "", 102 | "isComingSoon": true, 103 | "isPresold": "" 104 | }, { 105 | "id": 3674, 106 | "name": "凤凰街风雨", 107 | "cover": { 108 | "origin": "https://pic.maizuo.com/usr/movie/a6bb5693b62af9eb304be6ccc1153746.jpg" 109 | }, 110 | "poster": { 111 | "origin": "https://pic.maizuo.com/usr/movie/0e26ceb2e45f236343e14ef51f715da2.jpg", 112 | "thumbnail": "https://pic.maizuo.com/usr/movie/0e26ceb2e45f236343e14ef51f715da2.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 113 | }, 114 | "intro": "", 115 | "premiereAt": 1494259200000, 116 | "grade": "8.0", 117 | "watchCount": 0, 118 | "cinemaCount": 0, 119 | "scheduleCount": 0, 120 | "isPromotion": false, 121 | "isNowPlaying": "", 122 | "isComingSoon": true, 123 | "isPresold": "" 124 | }, { 125 | "id": 3532, 126 | "name": "麻烦家族", 127 | "cover": { 128 | "origin": "https://pic.maizuo.com/usr/100003532/8655df340ae54e9471f10356c9ddc765.jpg" 129 | }, 130 | "poster": { 131 | "origin": "https://pic.maizuo.com/usr/movie/a5cac98679a3903768f69a6996881ffb.jpg", 132 | "thumbnail": "https://pic.maizuo.com/usr/movie/a5cac98679a3903768f69a6996881ffb.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 133 | }, 134 | "intro": "晚年大危机 生日要分离", 135 | "premiereAt": 1494432000000, 136 | "grade": "8.0", 137 | "watchCount": 0, 138 | "cinemaCount": 0, 139 | "scheduleCount": 0, 140 | "isPromotion": false, 141 | "isNowPlaying": "", 142 | "isComingSoon": true, 143 | "isPresold": "" 144 | }], 145 | "page": { 146 | "total": 14, 147 | "current": 1 148 | } 149 | }, 150 | "msg": "ok" 151 | } -------------------------------------------------------------------------------- /src/data/coming-soon-2.json: -------------------------------------------------------------------------------- 1 | {"status":0,"data":{"films":[{"id":3659,"name":"六人晚餐","cover":{"origin":"https://pic.maizuo.com/usr/movie/4bf3b352fd60d3eb3b40e42b36875d85.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/df8c81bde180b08474de6b2abbfea03e.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/df8c81bde180b08474de6b2abbfea03e.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"刺痛青春 向爱而生","premiereAt":1494432000000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3565,"name":"碟仙前传","cover":{"origin":"https://pic.maizuo.com/usr/100003565/ed2a2302842e7cdaf1e0437ffc43843f.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/cd0c50a9ba38808a921ffd9e23a4606b.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/cd0c50a9ba38808a921ffd9e23a4606b.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"不作不会死 远离碟仙戏","premiereAt":1494518400000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3603,"name":"诡宅","cover":{"origin":"https://pic.maizuo.com/usr/100003603/b18a4e450222dcd75b5a7090b0980410.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/100003603/d0ca107873fffaaeb161ce019be377bd.jpg","thumbnail":"https://pic.maizuo.com/usr/100003603/d0ca107873fffaaeb161ce019be377bd.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"乡下去养胎 不料入鬼宅","premiereAt":1494518400000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3622,"name":"提着心，吊着胆","cover":{"origin":"https://pic.maizuo.com/usr/movie/63607d8e5b8a14aaf1d0a6c048894934.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/600bae63775dfc9792ae3c341d367aa5.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/600bae63775dfc9792ae3c341d367aa5.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"疑妻在出轨 犯下杀手罪","premiereAt":1494518400000,"grade":"7.5","watchCount":57,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3649,"name":"亚瑟王：斗兽争霸","cover":{"origin":"https://pic.maizuo.com/usr/movie/c0c70db2a95f929863720f03c6b7ec1b.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/08feeebc46a6b81bf57ee1e348147ebc.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/08feeebc46a6b81bf57ee1e348147ebc.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"从一无所有 到圣剑在手","premiereAt":1494518400000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3652,"name":"超凡战队（原《恐龙战队》）","cover":{"origin":"https://pic.maizuo.com/usr/movie/addb0a27c06216fc3984b4b21572c849.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/3915cc3aa36a24ceda5b00be4be9de66.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/3915cc3aa36a24ceda5b00be4be9de66.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"少年齐合体 打击恶势力","premiereAt":1494518400000,"grade":"8.0","watchCount":74,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3658,"name":"借眼","cover":{"origin":"https://pic.maizuo.com/usr/movie/c18b8a7cf8e4a27fd5d3773b31907bc8.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/9b5bba348204ad699d8446d31c0264a1.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/9b5bba348204ad699d8446d31c0264a1.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"终于见光明 却被恶鬼缠","premiereAt":1494518400000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""}],"page":{"total":14,"current":2}},"msg":"ok"} -------------------------------------------------------------------------------- /src/data/coming-soon-3.json: -------------------------------------------------------------------------------- 1 | { 2 | "status": 0, 3 | "data": { 4 | "films": [{ 5 | "id": 3660, 6 | "name": "毒。诫", 7 | "cover": { 8 | "origin": "https://pic.maizuo.com/usr/movie/9fb5c35da890168dc938917a4835ba10.jpg" 9 | }, 10 | "poster": { 11 | "origin": "https://pic.maizuo.com/usr/movie/9f2f3f6bc3c1103c210405be1c69db73.jpg", 12 | "thumbnail": "https://pic.maizuo.com/usr/movie/9f2f3f6bc3c1103c210405be1c69db73.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 13 | }, 14 | "intro": "慈云山太保 古惑仔老炮", 15 | "premiereAt": 1494518400000, 16 | "grade": "8.0", 17 | "watchCount": 0, 18 | "cinemaCount": 0, 19 | "scheduleCount": 0, 20 | "isPromotion": false, 21 | "isNowPlaying": "", 22 | "isComingSoon": true, 23 | "isPresold": "" 24 | }, { 25 | "id": 3673, 26 | "name": "宝贝，再爱我一次", 27 | "cover": { 28 | "origin": "https://pic.maizuo.com/usr/movie/d652b8cab6a8e5683e3ed58b111f15c0.jpg" 29 | }, 30 | "poster": { 31 | "origin": "https://pic.maizuo.com/usr/movie/582d08c554cc516d8b52200f3a28783c.jpg", 32 | "thumbnail": "https://pic.maizuo.com/usr/movie/582d08c554cc516d8b52200f3a28783c.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 33 | }, 34 | "intro": "一个母亲，今生最深的渴慕", 35 | "premiereAt": 1494604800000, 36 | "grade": "8.0", 37 | "watchCount": 0, 38 | "cinemaCount": 0, 39 | "scheduleCount": 0, 40 | "isPromotion": false, 41 | "isNowPlaying": "", 42 | "isComingSoon": true, 43 | "isPresold": "" 44 | }, { 45 | "id": 3564, 46 | "name": "美容针", 47 | "cover": { 48 | "origin": "https://pic.maizuo.com/usr/100003564/4cd9cae9c49a6f86276f6c0bd47603c9.jpg" 49 | }, 50 | "poster": { 51 | "origin": "https://pic.maizuo.com/usr/100003564/df5249965e4e71be759cc5efe512c94d.jpg", 52 | "thumbnail": "https://pic.maizuo.com/usr/100003564/df5249965e4e71be759cc5efe512c94d.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 53 | }, 54 | "intro": "熟女遇男孩 春天重再来", 55 | "premiereAt": 1495123200000, 56 | "grade": "8.0", 57 | "watchCount": 0, 58 | "cinemaCount": 0, 59 | "scheduleCount": 0, 60 | "isPromotion": false, 61 | "isNowPlaying": "", 62 | "isComingSoon": true, 63 | "isPresold": "" 64 | }, { 65 | "id": 3589, 66 | "name": "碟仙实录", 67 | "cover": { 68 | "origin": "https://pic.maizuo.com/usr/100003589/bf2eeb3906b9c046fc2f8dc25abae084.jpg" 69 | }, 70 | "poster": { 71 | "origin": "https://pic.maizuo.com/usr/100003589/40e2574b70442e7fb0753ad92006066d.jpg", 72 | "thumbnail": "https://pic.maizuo.com/usr/100003589/40e2574b70442e7fb0753ad92006066d.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 73 | }, 74 | "intro": "千年厉鬼出 古宅成鬼屋", 75 | "premiereAt": 1495123200000, 76 | "grade": "8.0", 77 | "watchCount": 0, 78 | "cinemaCount": 0, 79 | "scheduleCount": 0, 80 | "isPromotion": false, 81 | "isNowPlaying": "", 82 | "isComingSoon": true, 83 | "isPresold": "" 84 | }, { 85 | "id": 3651, 86 | "name": "不期而遇", 87 | "cover": { 88 | "origin": "https://pic.maizuo.com/usr/movie/530d39626ca9a49dae8a9397bc820dfd.jpg" 89 | }, 90 | "poster": { 91 | "origin": "https://pic.maizuo.com/usr/movie/df15b3e236f996c13452bce8e1a8cfb8.jpg", 92 | "thumbnail": "https://pic.maizuo.com/usr/movie/df15b3e236f996c13452bce8e1a8cfb8.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 93 | }, 94 | "intro": "冤家路太窄 越吵越相爱", 95 | "premiereAt": 1495123200000, 96 | "grade": "8.0", 97 | "watchCount": 0, 98 | "cinemaCount": 0, 99 | "scheduleCount": 0, 100 | "isPromotion": false, 101 | "isNowPlaying": "", 102 | "isComingSoon": true, 103 | "isPresold": "" 104 | }, { 105 | "id": 3653, 106 | "name": "抢红", 107 | "cover": { 108 | "origin": "https://pic.maizuo.com/usr/movie/8ba9602b60ed30cff46a5133f7a1d6fa.jpg" 109 | }, 110 | "poster": { 111 | "origin": "https://pic.maizuo.com/usr/movie/f2679971479dc4dc015b65d3e007f7d9.jpg", 112 | "thumbnail": "https://pic.maizuo.com/usr/movie/f2679971479dc4dc015b65d3e007f7d9.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 113 | }, 114 | "intro": "利诱陷困局 是酒还是局", 115 | "premiereAt": 1495123200000, 116 | "grade": "8.0", 117 | "watchCount": 0, 118 | "cinemaCount": 0, 119 | "scheduleCount": 0, 120 | "isPromotion": false, 121 | "isNowPlaying": "", 122 | "isComingSoon": true, 123 | "isPresold": "" 124 | }, { 125 | "id": 3662, 126 | "name": "小情书", 127 | "cover": { 128 | "origin": "https://pic.maizuo.com/usr/movie/f9de8f3cc14a70e804405b274e4414e6.jpg" 129 | }, 130 | "poster": { 131 | "origin": "https://pic.maizuo.com/usr/movie/ffa96e8c0495c085b03514eff1a23538.jpg", 132 | "thumbnail": "https://pic.maizuo.com/usr/movie/ffa96e8c0495c085b03514eff1a23538.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 133 | }, 134 | "intro": "情书闹乌龙 纸清情意重", 135 | "premiereAt": 1495123200000, 136 | "grade": "8.0", 137 | "watchCount": 0, 138 | "cinemaCount": 0, 139 | "scheduleCount": 0, 140 | "isPromotion": false, 141 | "isNowPlaying": "", 142 | "isComingSoon": true, 143 | "isPresold": "" 144 | }], 145 | "page": { 146 | "total": 14, 147 | "current": 3 148 | } 149 | }, 150 | "msg": "ok" 151 | } -------------------------------------------------------------------------------- /src/data/coming-soon-4.json: -------------------------------------------------------------------------------- 1 | {"status":0,"data":{"films":[{"id":3675,"name":"异星觉醒","cover":{"origin":"https://pic.maizuo.com/usr/movie/eeceda1dd2c3174a223991c0bbd01473.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/713f4a7bdbffb47477cc74a614e3d697.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/713f4a7bdbffb47477cc74a614e3d697.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"宇宙外来物 样本来揭秘","premiereAt":1495123200000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3528,"name":"爱情邮局","cover":{"origin":"https://pic.maizuo.com/usr/100003528/529964d89f0bb678be2076e2437bfb85.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/2927cd84961523f0ac57dae13a328e5e.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/2927cd84961523f0ac57dae13a328e5e.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"神秘老板娘 掀情感巨浪","premiereAt":1495209600000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3560,"name":"放学后","cover":{"origin":"https://pic.maizuo.com/usr/100003560/6e89732293b6dd7867b0d91ba052ee08.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/aba90cb64f34c870bbec04bd33bc0f76.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/aba90cb64f34c870bbec04bd33bc0f76.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"校园暴力案 放学后惊现","premiereAt":1495209600000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3582,"name":"恐怖电影院2","cover":{"origin":"https://pic.maizuo.com/usr/100003582/ff19116062df8177aba76daba07fe21c.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/100003582/44a5795e9e49216d167db6ee533ad825.jpg","thumbnail":"https://pic.maizuo.com/usr/100003582/44a5795e9e49216d167db6ee533ad825.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"怨魂电影院 谁来大冒险","premiereAt":1495728000000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3641,"name":"中国推销员","cover":{"origin":"https://pic.maizuo.com/usr/movie/4a5382de6ffdd97c7ea20884efcafd6c.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/6b15c08519bbeb6c069e90cbe44f0732.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/6b15c08519bbeb6c069e90cbe44f0732.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"码农技术猿 爱拼才会赢","premiereAt":1495728000000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3664,"name":"加勒比海盗5：死无对证","cover":{"origin":"https://pic.maizuo.com/usr/movie/d0094473056fec9ba2796be10ac1eb1c.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/652044dc15e794669a11cafc6a609819.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/652044dc15e794669a11cafc6a609819.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"三次大改档 船长又出航","premiereAt":1495728000000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":2727,"name":"临时演员","cover":{"origin":"https://pic.maizuo.com/usr/100002727/679bcd31079b052b5e4ead23e7643d80.tmp"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/42348af339822eddff738faa19f96943.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/42348af339822eddff738faa19f96943.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"狗仔太难敌 逢场作个戏","premiereAt":1495814400000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""}],"page":{"total":14,"current":4}},"msg":"ok"} -------------------------------------------------------------------------------- /src/data/coming-soon-5.json: -------------------------------------------------------------------------------- 1 | {"status":0,"data":{"films":[{"id":3037,"name":"美好的意外","cover":{"origin":"https://pic.maizuo.com/usr/100003037/dd52ab3d52c9dad7348f8ca375e389ab.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/114505b4b847a3b3fd1980c363af4f2f.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/114505b4b847a3b3fd1980c363af4f2f.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"人生有假如 陈坤变主夫","premiereAt":1495814400000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3077,"name":"夏天十九岁的肖像","cover":{"origin":"https://pic.maizuo.com/usr/movie/f78a4d230832abb2db4de463cab5c61d.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/96d77cc6653147996596d73eb7fb6ead.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/96d77cc6653147996596d73eb7fb6ead.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"恋上杀人女 子滔陷迷局","premiereAt":1495814400000,"grade":"8.4","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3654,"name":"荡寇风云","cover":{"origin":"https://pic.maizuo.com/usr/movie/fc871e587cc62b12b6c1d9f088d84bc6.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/0d8f9bfd7aadc7f22046a6ddfe48ba26.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/0d8f9bfd7aadc7f22046a6ddfe48ba26.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"战神戚继光 海战谁更强","premiereAt":1495814400000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3665,"name":"“吃吃”的爱","cover":{"origin":"https://pic.maizuo.com/usr/movie/b28a38b63e00304adff2812cc144bbfd.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/e395d307bca6013afa0723667bb40452.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/e395d307bca6013afa0723667bb40452.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"打工女明星 酒店把情定","premiereAt":1495814400000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3666,"name":"三只小猪2","cover":{"origin":"https://pic.maizuo.com/usr/movie/6bdf0f655f2085b6d5cefa52544b1acc.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/8ac85b3f073a3e3a561973e1239f57e6.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/8ac85b3f073a3e3a561973e1239f57e6.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"小猪学功夫 跟怪狼比武","premiereAt":1495814400000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3596,"name":"小茜当家","cover":{"origin":"https://pic.maizuo.com/usr/100003596/86545235a727162f8ed85ebc7709a882.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/100003596/322a4399a0ed3a9a4f1af99d6c0e0526.jpg","thumbnail":"https://pic.maizuo.com/usr/100003596/322a4399a0ed3a9a4f1af99d6c0e0526.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"真实的故事为蓝本","premiereAt":1495900800000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3485,"name":"悟空圣诞奇遇记","cover":{"origin":"https://pic.maizuo.com/usr/100003485/25987457042163eb9c45717c42557b83.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/100003485/3142d62674078e5c187eedd2cca9cfea.jpg","thumbnail":"https://pic.maizuo.com/usr/100003485/3142d62674078e5c187eedd2cca9cfea.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"世间若无你 要着铁棒有何用","premiereAt":1496073600000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""}],"page":{"total":14,"current":5}},"msg":"ok"} -------------------------------------------------------------------------------- /src/data/coming-soon.json: -------------------------------------------------------------------------------- 1 | { 2 | "status": 0, 3 | "data": { 4 | "films": [{ 5 | "id": 3656, 6 | "name": "灵狼传奇", 7 | "cover": { 8 | "origin": "https://pic.maizuo.com/usr/movie/e79328680d1e70be5cf6af156d0426a2.jpg" 9 | }, 10 | "poster": { 11 | "origin": "https://pic.maizuo.com/usr/movie/5bace3b8c3bf5a8bb6c34b96a81046cb.jpg", 12 | "thumbnail": "https://pic.maizuo.com/usr/movie/5bace3b8c3bf5a8bb6c34b96a81046cb.jpg!150x0" 13 | }, 14 | "intro": "大山坏猴王 白狼保村庄", 15 | "premiereAt": 1493395200000, 16 | "grade": "8.0", 17 | "watchCount": 333, 18 | "cinemaCount": 0, 19 | "scheduleCount": 0, 20 | "isPromotion": false, 21 | "isNowPlaying": "", 22 | "isComingSoon": true, 23 | "isPresold": "" 24 | }, { 25 | "id": 3488, 26 | "name": "咸鱼传奇", 27 | "cover": { 28 | "origin": "https://pic.maizuo.com/usr/100003488/2a84229ae00707143b6a55bf4b201eea.jpg" 29 | }, 30 | "poster": { 31 | "origin": "https://pic.maizuo.com/usr/100003488/1bb2435fbef875786c2b1397d533f8a8.jpg", 32 | "thumbnail": "https://pic.maizuo.com/usr/100003488/1bb2435fbef875786c2b1397d533f8a8.jpg!150x0" 33 | }, 34 | "intro": "咸鱼也有梦 跨越千年追", 35 | "premiereAt": 1493913600000, 36 | "grade": "8.0", 37 | "watchCount": 0, 38 | "cinemaCount": 0, 39 | "scheduleCount": 0, 40 | "isPromotion": false, 41 | "isNowPlaying": "", 42 | "isComingSoon": true, 43 | "isPresold": "" 44 | }, { 45 | "id": 3647, 46 | "name": "银河护卫队2", 47 | "cover": { 48 | "origin": "https://pic.maizuo.com/usr/movie/bb468eeee509991ff8eb585c6897f0c5.jpg" 49 | }, 50 | "poster": { 51 | "origin": "https://pic.maizuo.com/usr/movie/7e6e6d01c4a22643dae2b1777cab524b.jpg", 52 | "thumbnail": "https://pic.maizuo.com/usr/movie/7e6e6d01c4a22643dae2b1777cab524b.jpg!150x0" 53 | }, 54 | "intro": "星爵身世迷 终于见爹地", 55 | "premiereAt": 1493913600000, 56 | "grade": "8.5", 57 | "watchCount": 3234, 58 | "cinemaCount": 0, 59 | "scheduleCount": 0, 60 | "isPromotion": false, 61 | "isNowPlaying": "", 62 | "isComingSoon": true, 63 | "isPresold": "" 64 | }], 65 | "page": { 66 | "total": 32, 67 | "current": 1 68 | } 69 | }, 70 | "msg": "ok" 71 | } -------------------------------------------------------------------------------- /src/data/detail.json: -------------------------------------------------------------------------------- 1 | { 2 | "status": 0, 3 | "data": { 4 | "film": { 5 | "id": 3590, 6 | "name": "拆弹专家", 7 | "imageryType": "1", 8 | "cover": { 9 | "origin": "https://pic.maizuo.com/usr/movie/d16085506bf738e6f2763b4d8d5f6cce.jpg" 10 | }, 11 | "poster": { 12 | "origin": "https://pic.maizuo.com/usr/movie/3d915dcc28097d3f30a388cdc7099920.jpg" 13 | }, 14 | "intro": "爆炸袭击案 拆弹反恐难", 15 | "synopsis": " 最新警匪动作电影《拆弹专家》（Shock Wave）将于4月份开拍，刘德华担任制作人和主演，由寰宇公司、博纳影业和刘德华的新公司梦造者联合制作，邱礼涛担任导演，投资2300万美元。片中刘德华将饰演一名卧底，追缉炸弹狂徒。预计将在2017年中期上映。之前该片曾曝出的阵容为张家辉、谢霆锋（反派）、张智霖。", 16 | "premiereAt": 1493308800000, 17 | "mins": 120, 18 | "language": "普通话、粤语", 19 | "director": "邱礼涛", 20 | "actors": [{ 21 | "name": "刘德华" 22 | }, { 23 | "name": "姜武" 24 | }, { 25 | "name": "宋佳" 26 | }], 27 | "photos": [{ 28 | "bigPictureAddress": "https://pic.maizuo.com/usr/100003590/5f325da5705e8c361eda80a8a4c99147.jpg", 29 | "pictureAddress": "https://pic.maizuo.com/usr/100003590/5f325da5705e8c361eda80a8a4c99147.jpg?x-oss-process=image/resize,m_fixed,h_0,w_300" 30 | }, { 31 | "bigPictureAddress": "https://pic.maizuo.com/usr/100003590/74e39ec69deaf517cca7abad31122602.jpg", 32 | "pictureAddress": "https://pic.maizuo.com/usr/100003590/74e39ec69deaf517cca7abad31122602.jpg?x-oss-process=image/resize,m_fixed,h_0,w_300" 33 | }, { 34 | "bigPictureAddress": "https://pic.maizuo.com/usr/100003590/62c823d9e1ceaaf4b6bdb4eee2c3027c.jpg", 35 | "pictureAddress": "https://pic.maizuo.com/usr/100003590/62c823d9e1ceaaf4b6bdb4eee2c3027c.jpg?x-oss-process=image/resize,m_fixed,h_0,w_300" 36 | }, { 37 | "bigPictureAddress": "https://pic.maizuo.com/usr/100003590/0fc48d8d7c5b2ffb73d28618cebc26c6.jpg", 38 | "pictureAddress": "https://pic.maizuo.com/usr/100003590/0fc48d8d7c5b2ffb73d28618cebc26c6.jpg?x-oss-process=image/resize,m_fixed,h_0,w_300" 39 | }, { 40 | "bigPictureAddress": "https://pic.maizuo.com/usr/100003590/2a1e410bdfdcb0f828501ac12f80811f.jpg", 41 | "pictureAddress": "https://pic.maizuo.com/usr/100003590/2a1e410bdfdcb0f828501ac12f80811f.jpg?x-oss-process=image/resize,m_fixed,h_0,w_300" 42 | }, { 43 | "bigPictureAddress": "https://pic.maizuo.com/usr/100003590/9602d7f87c9a9f2d52befb49979f0621.jpg", 44 | "pictureAddress": "https://pic.maizuo.com/usr/100003590/9602d7f87c9a9f2d52befb49979f0621.jpg?x-oss-process=image/resize,m_fixed,h_0,w_300" 45 | }, { 46 | "bigPictureAddress": "https://pic.maizuo.com/usr/100003590/ec3da4fc35a0c09fd219567515f0a01e.jpg", 47 | "pictureAddress": "https://pic.maizuo.com/usr/100003590/ec3da4fc35a0c09fd219567515f0a01e.jpg?x-oss-process=image/resize,m_fixed,h_0,w_300" 48 | }, { 49 | "bigPictureAddress": "https://pic.maizuo.com/usr/100003590/7acee706970306ee4d95e3f190f22689.jpg", 50 | "pictureAddress": "https://pic.maizuo.com/usr/100003590/7acee706970306ee4d95e3f190f22689.jpg?x-oss-process=image/resize,m_fixed,h_0,w_300" 51 | }, { 52 | "bigPictureAddress": "https://pic.maizuo.com/usr/100003590/c58387343b04459bbbbae965f54358e4.jpg", 53 | "pictureAddress": "https://pic.maizuo.com/usr/100003590/c58387343b04459bbbbae965f54358e4.jpg?x-oss-process=image/resize,m_fixed,h_0,w_300" 54 | }, { 55 | "bigPictureAddress": "https://pic.maizuo.com/usr/100003590/66badbea7e0dee6b8ec8620136790783.jpg", 56 | "pictureAddress": "https://pic.maizuo.com/usr/100003590/66badbea7e0dee6b8ec8620136790783.jpg?x-oss-process=image/resize,m_fixed,h_0,w_300" 57 | }, { 58 | "bigPictureAddress": "https://pic.maizuo.com/usr/100003590/c7b125093245f006d7e6c134eab97adb.jpg", 59 | "pictureAddress": "https://pic.maizuo.com/usr/100003590/c7b125093245f006d7e6c134eab97adb.jpg?x-oss-process=image/resize,m_fixed,h_0,w_300" 60 | }, { 61 | "bigPictureAddress": "https://pic.maizuo.com/usr/100003590/f72e363682e41e1a06b83f6768e43e29.jpg", 62 | "pictureAddress": "https://pic.maizuo.com/usr/100003590/f72e363682e41e1a06b83f6768e43e29.jpg?x-oss-process=image/resize,m_fixed,h_0,w_300" 63 | }, { 64 | "bigPictureAddress": "https://pic.maizuo.com/usr/100003590/5a98d62581a9202fbce11b9f2f0c6b1d.jpg", 65 | "pictureAddress": "https://pic.maizuo.com/usr/100003590/5a98d62581a9202fbce11b9f2f0c6b1d.jpg?x-oss-process=image/resize,m_fixed,h_0,w_300" 66 | }, { 67 | "bigPictureAddress": "https://pic.maizuo.com/usr/100003590/4ba7ecd7d70fd635bd4b264549cab642.jpg", 68 | "pictureAddress": "https://pic.maizuo.com/usr/100003590/4ba7ecd7d70fd635bd4b264549cab642.jpg?x-oss-process=image/resize,m_fixed,h_0,w_300" 69 | }, { 70 | "bigPictureAddress": "https://pic.maizuo.com/usr/100003590/3476074af271d4400c3df9d1556ec769.jpg", 71 | "pictureAddress": "https://pic.maizuo.com/usr/100003590/3476074af271d4400c3df9d1556ec769.jpg?x-oss-process=image/resize,m_fixed,h_0,w_300" 72 | }], 73 | "nation": "香港", 74 | "category": "动作|悬疑|犯罪", 75 | "trailer": { 76 | "youkuId": "XMjY1MjMwODE5Ng==" 77 | }, 78 | "labelType": "0", 79 | "grade": "8.5", 80 | "party": { 81 | "likeCount": 149, 82 | "dislikeCount": 5 83 | }, 84 | "cinemaCount": 125, 85 | "scheduleCount": 0, 86 | "actives": [], 87 | "isPromotion": true, 88 | "isNowPlaying": true, 89 | "isComingSoon": "", 90 | "isPresold": "", 91 | "isLike": true 92 | } 93 | }, 94 | "msg": "ok" 95 | } -------------------------------------------------------------------------------- /src/data/now-playing-1.json: -------------------------------------------------------------------------------- 1 | { 2 | "status": 0, 3 | "data": { 4 | "films": [{ 5 | "id": 3590, 6 | "name": "拆弹专家", 7 | "cover": { 8 | "origin": "https://pic.maizuo.com/usr/movie/d16085506bf738e6f2763b4d8d5f6cce.jpg" 9 | }, 10 | "poster": { 11 | "origin": "https://pic.maizuo.com/usr/movie/3d915dcc28097d3f30a388cdc7099920.jpg", 12 | "thumbnail": "https://pic.maizuo.com/usr/movie/3d915dcc28097d3f30a388cdc7099920.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 13 | }, 14 | "intro": "爆炸袭击案 拆弹反恐难", 15 | "premiereAt": 1493308800000, 16 | "grade": "8.5", 17 | "watchCount": 480689, 18 | "cinemaCount": 125, 19 | "scheduleCount": 1688, 20 | "isPromotion": true, 21 | "isNowPlaying": true, 22 | "isComingSoon": "", 23 | "isPresold": "" 24 | }, { 25 | "id": 3647, 26 | "name": "银河护卫队2", 27 | "cover": { 28 | "origin": "https://pic.maizuo.com/usr/movie/bb468eeee509991ff8eb585c6897f0c5.jpg" 29 | }, 30 | "poster": { 31 | "origin": "https://pic.maizuo.com/usr/movie/7e6e6d01c4a22643dae2b1777cab524b.jpg", 32 | "thumbnail": "https://pic.maizuo.com/usr/movie/7e6e6d01c4a22643dae2b1777cab524b.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 33 | }, 34 | "intro": "星爵身世迷 终于见爹地", 35 | "premiereAt": 1493913600000, 36 | "grade": "8.5", 37 | "watchCount": 21237, 38 | "cinemaCount": 132, 39 | "scheduleCount": 2417, 40 | "isPromotion": true, 41 | "isNowPlaying": true, 42 | "isComingSoon": "", 43 | "isPresold": "" 44 | }, { 45 | "id": 3364, 46 | "name": "记忆大师", 47 | "cover": { 48 | "origin": "https://pic.maizuo.com/usr/movie/ad2e489494445db9eb1b70bf51e9d8de.jpg" 49 | }, 50 | "poster": { 51 | "origin": "https://pic.maizuo.com/usr/movie/39f1c6dedf39810780aee8b9b6c1f63a.jpg", 52 | "thumbnail": "https://pic.maizuo.com/usr/movie/39f1c6dedf39810780aee8b9b6c1f63a.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 53 | }, 54 | "intro": "记忆可存取 麻烦一大堆", 55 | "premiereAt": 1493308800000, 56 | "grade": "8.5", 57 | "watchCount": 321873, 58 | "cinemaCount": 132, 59 | "scheduleCount": 1301, 60 | "isPromotion": true, 61 | "isNowPlaying": true, 62 | "isComingSoon": "", 63 | "isPresold": "" 64 | }, { 65 | "id": 3609, 66 | "name": "春娇救志明", 67 | "cover": { 68 | "origin": "https://pic.maizuo.com/usr/movie/a5da1aa2c03b111215fc9d83cde4987c.jpg" 69 | }, 70 | "poster": { 71 | "origin": "https://pic.maizuo.com/usr/movie/99d9cb24c162593f44efd5365f1aff73.jpg", 72 | "thumbnail": "https://pic.maizuo.com/usr/movie/99d9cb24c162593f44efd5365f1aff73.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 73 | }, 74 | "intro": "感情趋平淡 唯恐不喜欢", 75 | "premiereAt": 1493308800000, 76 | "grade": "7.9", 77 | "watchCount": 456342, 78 | "cinemaCount": 131, 79 | "scheduleCount": 836, 80 | "isPromotion": true, 81 | "isNowPlaying": true, 82 | "isComingSoon": "", 83 | "isPresold": "" 84 | }, { 85 | "id": 3631, 86 | "name": "喜欢你", 87 | "cover": { 88 | "origin": "https://pic.maizuo.com/usr/movie/88ac8daa5a3941b69b61513193e05bee.jpg" 89 | }, 90 | "poster": { 91 | "origin": "https://pic.maizuo.com/usr/movie/66e5b065fb8ecf6d871f447f0697635a.jpg", 92 | "thumbnail": "https://pic.maizuo.com/usr/movie/66e5b065fb8ecf6d871f447f0697635a.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 93 | }, 94 | "intro": "爱情换主角 命运中出错", 95 | "premiereAt": 1493222400000, 96 | "grade": "8.5", 97 | "watchCount": 203839, 98 | "cinemaCount": 124, 99 | "scheduleCount": 819, 100 | "isPromotion": true, 101 | "isNowPlaying": true, 102 | "isComingSoon": "", 103 | "isPresold": "" 104 | }, { 105 | "id": 3456, 106 | "name": "速度与激情8", 107 | "cover": { 108 | "origin": "https://pic.maizuo.com/usr/movie/f724ae8171940a23bc75593c1176ebf8.jpg" 109 | }, 110 | "poster": { 111 | "origin": "https://pic.maizuo.com/usr/movie/285b69bedff4291808174e940367659f.jpg", 112 | "thumbnail": "https://pic.maizuo.com/usr/movie/285b69bedff4291808174e940367659f.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 113 | }, 114 | "intro": "车主要黑化 家族被击垮", 115 | "premiereAt": 1492099200000, 116 | "grade": "9.7", 117 | "watchCount": 1764242, 118 | "cinemaCount": 131, 119 | "scheduleCount": 1007, 120 | "isPromotion": true, 121 | "isNowPlaying": true, 122 | "isComingSoon": "", 123 | "isPresold": "" 124 | }, { 125 | "id": 3663, 126 | "name": "摔跤吧！爸爸", 127 | "cover": { 128 | "origin": "https://pic.maizuo.com/usr/movie/50fee00488817e1acda5fad62ef66456.jpg" 129 | }, 130 | "poster": { 131 | "origin": "https://pic.maizuo.com/usr/movie/0478e393c2b69bd4b97666854af44263.jpg", 132 | "thumbnail": "https://pic.maizuo.com/usr/movie/0478e393c2b69bd4b97666854af44263.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 133 | }, 134 | "intro": "为圆摔跤梦 女儿不心疼", 135 | "premiereAt": 1493913600000, 136 | "grade": "9.5", 137 | "watchCount": 2911, 138 | "cinemaCount": 111, 139 | "scheduleCount": 643, 140 | "isPromotion": true, 141 | "isNowPlaying": true, 142 | "isComingSoon": "", 143 | "isPresold": "" 144 | }], 145 | "page": { 146 | "total": 5, 147 | "current": 1 148 | } 149 | }, 150 | "msg": "ok" 151 | } -------------------------------------------------------------------------------- /src/data/now-playing-2.json: -------------------------------------------------------------------------------- 1 | { 2 | "status": 0, 3 | "data": { 4 | "films": [{ 5 | "id": 3623, 6 | "name": "蓝精灵：寻找神秘村", 7 | "cover": { 8 | "origin": "https://pic.maizuo.com/usr/movie/6cd0606b878761b18f6046a2b5a1965c.jpg" 9 | }, 10 | "poster": { 11 | "origin": "https://pic.maizuo.com/usr/movie/eeb12f9820ace8aa2de856b8a24a1312.jpg", 12 | "thumbnail": "https://pic.maizuo.com/usr/movie/eeb12f9820ace8aa2de856b8a24a1312.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 13 | }, 14 | "intro": "魔法再重启 寻找神秘村", 15 | "premiereAt": 1492704000000, 16 | "grade": "8.4", 17 | "watchCount": 286865, 18 | "cinemaCount": 107, 19 | "scheduleCount": 426, 20 | "isPromotion": true, 21 | "isNowPlaying": true, 22 | "isComingSoon": "", 23 | "isPresold": "" 24 | }, { 25 | "id": 3624, 26 | "name": "傲娇与偏见", 27 | "cover": { 28 | "origin": "https://pic.maizuo.com/usr/movie/72daa61be526be7aaa0744a6edfc4a31.jpg" 29 | }, 30 | "poster": { 31 | "origin": "https://pic.maizuo.com/usr/movie/311a9082437bf375cf1beccf4ed722a4.jpg", 32 | "thumbnail": "https://pic.maizuo.com/usr/movie/311a9082437bf375cf1beccf4ed722a4.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 33 | }, 34 | "intro": "落难富二代 从小被惯坏", 35 | "premiereAt": 1492617600000, 36 | "grade": "8.4", 37 | "watchCount": 97412, 38 | "cinemaCount": 35, 39 | "scheduleCount": 124, 40 | "isPromotion": true, 41 | "isNowPlaying": true, 42 | "isComingSoon": "", 43 | "isPresold": "" 44 | }, { 45 | "id": 1976, 46 | "name": "大话西游之大圣娶亲", 47 | "cover": { 48 | "origin": "https://pic.maizuo.com/usr/movie/0966d64714804be356427f88c35cc088.jpg" 49 | }, 50 | "poster": { 51 | "origin": "https://pic.maizuo.com/usr/movie/381a1fe7f9742c35a7bbf6296e9c50bd.jpg", 52 | "thumbnail": "https://pic.maizuo.com/usr/movie/381a1fe7f9742c35a7bbf6296e9c50bd.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 53 | }, 54 | "intro": "一生所爱 此情无憾", 55 | "premiereAt": 1492012800000, 56 | "grade": "9.5", 57 | "watchCount": 180234, 58 | "cinemaCount": 12, 59 | "scheduleCount": 25, 60 | "isPromotion": true, 61 | "isNowPlaying": true, 62 | "isComingSoon": "", 63 | "isPresold": "" 64 | }, { 65 | "id": 3378, 66 | "name": "嫌疑人X的献身", 67 | "cover": { 68 | "origin": "https://pic.maizuo.com/usr/movie/c2d6768dcd4f2c35f8be66805bb20396.jpg" 69 | }, 70 | "poster": { 71 | "origin": "https://pic.maizuo.com/usr/movie/83fe91fad3e5456330fb71cdf2ab13af.jpg", 72 | "thumbnail": "https://pic.maizuo.com/usr/movie/83fe91fad3e5456330fb71cdf2ab13af.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 73 | }, 74 | "intro": "天才谋杀案 诡计造谜团", 75 | "premiereAt": 1490889600000, 76 | "grade": "8.4", 77 | "watchCount": 635477, 78 | "cinemaCount": 2, 79 | "scheduleCount": 3, 80 | "isPromotion": true, 81 | "isNowPlaying": true, 82 | "isComingSoon": "", 83 | "isPresold": "" 84 | }, { 85 | "id": 3601, 86 | "name": "金刚：骷髅岛", 87 | "cover": { 88 | "origin": "https://pic.maizuo.com/usr/100003601/b77973ee3a12e6a1010509ece2f94743.jpg" 89 | }, 90 | "poster": { 91 | "origin": "https://pic.maizuo.com/usr/100003601/9c53f31bbb9690662c815ca0265f1c1e.jpg", 92 | "thumbnail": "https://pic.maizuo.com/usr/100003601/9c53f31bbb9690662c815ca0265f1c1e.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 93 | }, 94 | "intro": "人类新大陆 金刚快跑路", 95 | "premiereAt": 1490284800000, 96 | "grade": "8.4", 97 | "watchCount": 1537916, 98 | "cinemaCount": 1, 99 | "scheduleCount": 2, 100 | "isPromotion": true, 101 | "isNowPlaying": true, 102 | "isComingSoon": "", 103 | "isPresold": "" 104 | }, { 105 | "id": 3515, 106 | "name": "猪猪侠之英雄猪少年", 107 | "cover": { 108 | "origin": "https://pic.maizuo.com/usr/100003515/b89b1d5a57f5c413ba23e5dbb943f418.jpg" 109 | }, 110 | "poster": { 111 | "origin": "https://pic.maizuo.com/usr/100003515/f2c9c87729e13a5dcf9ceae05131161b.jpg", 112 | "thumbnail": "https://pic.maizuo.com/usr/100003515/f2c9c87729e13a5dcf9ceae05131161b.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 113 | }, 114 | "intro": "猪猪侠归来 再战大反派", 115 | "premiereAt": 1483718400000, 116 | "grade": "8.4", 117 | "watchCount": 61379, 118 | "cinemaCount": 1, 119 | "scheduleCount": 1, 120 | "isPromotion": true, 121 | "isNowPlaying": true, 122 | "isComingSoon": "", 123 | "isPresold": "" 124 | }, { 125 | "id": 3652, 126 | "name": "超凡战队（原《恐龙战队》）", 127 | "cover": { 128 | "origin": "https://pic.maizuo.com/usr/movie/addb0a27c06216fc3984b4b21572c849.jpg" 129 | }, 130 | "poster": { 131 | "origin": "https://pic.maizuo.com/usr/movie/3915cc3aa36a24ceda5b00be4be9de66.jpg", 132 | "thumbnail": "https://pic.maizuo.com/usr/movie/3915cc3aa36a24ceda5b00be4be9de66.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 133 | }, 134 | "intro": "少年齐合体 打击恶势力", 135 | "premiereAt": 1494518400000, 136 | "grade": "8.0", 137 | "watchCount": 74, 138 | "cinemaCount": 19, 139 | "scheduleCount": 172, 140 | "isPromotion": false, 141 | "isNowPlaying": true, 142 | "isComingSoon": "", 143 | "isPresold": "" 144 | }], 145 | "page": { 146 | "total": 5, 147 | "current": 2 148 | } 149 | }, 150 | "msg": "ok" 151 | } -------------------------------------------------------------------------------- /src/data/now-playing-3.json: -------------------------------------------------------------------------------- 1 | {"status":0,"data":{"films":[{"id":3037,"name":"美好的意外","cover":{"origin":"https://pic.maizuo.com/usr/100003037/dd52ab3d52c9dad7348f8ca375e389ab.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/114505b4b847a3b3fd1980c363af4f2f.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/114505b4b847a3b3fd1980c363af4f2f.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"人生有假如 陈坤变主夫","premiereAt":1495814400000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3077,"name":"夏天十九岁的肖像","cover":{"origin":"https://pic.maizuo.com/usr/movie/f78a4d230832abb2db4de463cab5c61d.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/96d77cc6653147996596d73eb7fb6ead.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/96d77cc6653147996596d73eb7fb6ead.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"恋上杀人女 子滔陷迷局","premiereAt":1495814400000,"grade":"8.4","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3654,"name":"荡寇风云","cover":{"origin":"https://pic.maizuo.com/usr/movie/fc871e587cc62b12b6c1d9f088d84bc6.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/0d8f9bfd7aadc7f22046a6ddfe48ba26.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/0d8f9bfd7aadc7f22046a6ddfe48ba26.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"战神戚继光 海战谁更强","premiereAt":1495814400000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3665,"name":"“吃吃”的爱","cover":{"origin":"https://pic.maizuo.com/usr/movie/b28a38b63e00304adff2812cc144bbfd.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/e395d307bca6013afa0723667bb40452.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/e395d307bca6013afa0723667bb40452.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"打工女明星 酒店把情定","premiereAt":1495814400000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3666,"name":"三只小猪2","cover":{"origin":"https://pic.maizuo.com/usr/movie/6bdf0f655f2085b6d5cefa52544b1acc.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/8ac85b3f073a3e3a561973e1239f57e6.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/8ac85b3f073a3e3a561973e1239f57e6.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"小猪学功夫 跟怪狼比武","premiereAt":1495814400000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3596,"name":"小茜当家","cover":{"origin":"https://pic.maizuo.com/usr/100003596/86545235a727162f8ed85ebc7709a882.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/100003596/322a4399a0ed3a9a4f1af99d6c0e0526.jpg","thumbnail":"https://pic.maizuo.com/usr/100003596/322a4399a0ed3a9a4f1af99d6c0e0526.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"真实的故事为蓝本","premiereAt":1495900800000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""},{"id":3485,"name":"悟空圣诞奇遇记","cover":{"origin":"https://pic.maizuo.com/usr/100003485/25987457042163eb9c45717c42557b83.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/100003485/3142d62674078e5c187eedd2cca9cfea.jpg","thumbnail":"https://pic.maizuo.com/usr/100003485/3142d62674078e5c187eedd2cca9cfea.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"世间若无你 要着铁棒有何用","premiereAt":1496073600000,"grade":"8.0","watchCount":0,"cinemaCount":0,"scheduleCount":0,"isPromotion":false,"isNowPlaying":"","isComingSoon":true,"isPresold":""}],"page":{"total":14,"current":5}},"msg":"ok"} -------------------------------------------------------------------------------- /src/data/now-playing-4.json: -------------------------------------------------------------------------------- 1 | {"status":0,"data":{"films":[{"id":3622,"name":"提着心，吊着胆","cover":{"origin":"https://pic.maizuo.com/usr/movie/63607d8e5b8a14aaf1d0a6c048894934.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/600bae63775dfc9792ae3c341d367aa5.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/600bae63775dfc9792ae3c341d367aa5.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"疑妻在出轨 犯下杀手罪","premiereAt":1494518400000,"grade":"7.5","watchCount":57,"cinemaCount":10,"scheduleCount":11,"isPromotion":false,"isNowPlaying":true,"isComingSoon":"","isPresold":""},{"id":3642,"name":"一念无明","cover":{"origin":"https://pic.maizuo.com/usr/movie/785d57f7b01098f7b3bc246537c17340.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/890367f8805ee2230bed3dc07fc0bd06.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/890367f8805ee2230bed3dc07fc0bd06.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"母亲身亡后 父亲相处愁","premiereAt":1491494400000,"grade":"7.3","watchCount":35618,"cinemaCount":5,"scheduleCount":9,"isPromotion":false,"isNowPlaying":true,"isComingSoon":"","isPresold":""},{"id":2692,"name":"夜闯寡妇村","cover":{"origin":"https://pic.maizuo.com/usr/100002692/0d1aa497440d9ddff9ff1c272a95d84b.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/100002692/15f6f24b85d8bd148696334696f13c03.jpg","thumbnail":"https://pic.maizuo.com/usr/100002692/15f6f24b85d8bd148696334696f13c03.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"谁才是幕后真正的凶手呢？ ","premiereAt":1479398400000,"grade":"8.1","watchCount":1682,"cinemaCount":4,"scheduleCount":9,"isPromotion":false,"isNowPlaying":true,"isComingSoon":"","isPresold":""},{"id":3488,"name":"咸鱼传奇","cover":{"origin":"https://pic.maizuo.com/usr/100003488/2a84229ae00707143b6a55bf4b201eea.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/100003488/1bb2435fbef875786c2b1397d533f8a8.jpg","thumbnail":"https://pic.maizuo.com/usr/100003488/1bb2435fbef875786c2b1397d533f8a8.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"咸鱼也有梦 跨越千年追","premiereAt":1493913600000,"grade":"8.0","watchCount":348,"cinemaCount":3,"scheduleCount":7,"isPromotion":false,"isNowPlaying":true,"isComingSoon":"","isPresold":""},{"id":3351,"name":"谁的青春不热血之深流不息","cover":{"origin":"https://pic.maizuo.com/usr/100003351/11feb9c3358cc5af6315c08a56b66648.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/100003351/025f50c426b52a1766e3947b4bb470d3.jpg","thumbnail":"https://pic.maizuo.com/usr/100003351/025f50c426b52a1766e3947b4bb470d3.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"奋斗漫画家 追梦去天涯","premiereAt":1474560000000,"grade":"8.0","watchCount":137,"cinemaCount":2,"scheduleCount":6,"isPromotion":false,"isNowPlaying":true,"isComingSoon":"","isPresold":""},{"id":3449,"name":"生门","cover":{"origin":"https://pic.maizuo.com/usr/100003449/ef0f42cfea5dc62e3588aa91e101c3d1.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/100003449/a67ff87d43f3788c86780ea2c2e8426a.jpg","thumbnail":"https://pic.maizuo.com/usr/100003449/a67ff87d43f3788c86780ea2c2e8426a.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"谱生命赞歌 书人间蹉跎","premiereAt":1481817600000,"grade":"8.0","watchCount":2280,"cinemaCount":2,"scheduleCount":6,"isPromotion":false,"isNowPlaying":true,"isComingSoon":"","isPresold":""},{"id":3627,"name":"领袖1935","cover":{"origin":"https://pic.maizuo.com/usr/movie/213668d90b35588199410c0e638c1bb7.jpg"},"poster":{"origin":"https://pic.maizuo.com/usr/movie/9314bd96e20b4cc4af172da1c9d0d503.jpg","thumbnail":"https://pic.maizuo.com/usr/movie/9314bd96e20b4cc4af172da1c9d0d503.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150"},"intro":"不怕远征难 长征掀波澜","premiereAt":1490630400000,"grade":"8.0","watchCount":358,"cinemaCount":1,"scheduleCount":2,"isPromotion":false,"isNowPlaying":true,"isComingSoon":"","isPresold":""}],"page":{"total":5,"current":4}},"msg":"ok"} -------------------------------------------------------------------------------- /src/data/now-playing-5.json: -------------------------------------------------------------------------------- 1 | { 2 | "status": 0, 3 | "data": { 4 | "films": [{ 5 | "id": 3627, 6 | "name": "领袖1935", 7 | "cover": { 8 | "origin": "https://pic.maizuo.com/usr/movie/213668d90b35588199410c0e638c1bb7.jpg" 9 | }, 10 | "poster": { 11 | "origin": "https://pic.maizuo.com/usr/movie/9314bd96e20b4cc4af172da1c9d0d503.jpg", 12 | "thumbnail": "https://pic.maizuo.com/usr/movie/9314bd96e20b4cc4af172da1c9d0d503.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 13 | }, 14 | "intro": "不怕远征难 长征掀波澜", 15 | "premiereAt": 1490630400000, 16 | "grade": "8.0", 17 | "watchCount": 358, 18 | "cinemaCount": 1, 19 | "scheduleCount": 2, 20 | "isPromotion": false, 21 | "isNowPlaying": true, 22 | "isComingSoon": "", 23 | "isPresold": "" 24 | }, { 25 | "id": 3634, 26 | "name": "海角有个五店市", 27 | "cover": { 28 | "origin": "https://pic.maizuo.com/usr/movie/6ae06a06a89c40fb1b159867153d1607.jpg" 29 | }, 30 | "poster": { 31 | "origin": "https://pic.maizuo.com/usr/movie/478b9f778639975448d9a0159084aede.jpg", 32 | "thumbnail": "https://pic.maizuo.com/usr/movie/478b9f778639975448d9a0159084aede.jpg?x-oss-process=image/resize,m_fixed,h_0,w_150" 33 | }, 34 | "intro": "爱情跨世纪 笑泪永铭记", 35 | "premiereAt": 1491494400000, 36 | "grade": "8.0", 37 | "watchCount": 78, 38 | "cinemaCount": 1, 39 | "scheduleCount": 1, 40 | "isPromotion": false, 41 | "isNowPlaying": true, 42 | "isComingSoon": "", 43 | "isPresold": "" 44 | }], 45 | "page": { 46 | "total": 5, 47 | "current": 5 48 | } 49 | }, 50 | "msg": "ok" 51 | } -------------------------------------------------------------------------------- /src/data/now-playing.json: -------------------------------------------------------------------------------- 1 | { 2 | "status": 0, 3 | "data": { 4 | "films": [{ 5 | "id": 3590, 6 | "name": "拆弹专家", 7 | "cover": { 8 | "origin": "https://pic.maizuo.com/usr/movie/d16085506bf738e6f2763b4d8d5f6cce.jpg" 9 | }, 10 | "poster": { 11 | "origin": "https://pic.maizuo.com/usr/movie/3d915dcc28097d3f30a388cdc7099920.jpg", 12 | "thumbnail": "https://pic.maizuo.com/usr/movie/3d915dcc28097d3f30a388cdc7099920.jpg!150x0" 13 | }, 14 | "intro": "爆炸袭击案 拆弹反恐难", 15 | "premiereAt": 1493308800000, 16 | "grade": "8.5", 17 | "watchCount": 18004, 18 | "cinemaCount": 129, 19 | "scheduleCount": 2261, 20 | "isPromotion": true, 21 | "isNowPlaying": true, 22 | "isComingSoon": "", 23 | "isPresold": "" 24 | }, { 25 | "id": 3631, 26 | "name": "喜欢你", 27 | "cover": { 28 | "origin": "https://pic.maizuo.com/usr/movie/88ac8daa5a3941b69b61513193e05bee.jpg" 29 | }, 30 | "poster": { 31 | "origin": "https://pic.maizuo.com/usr/movie/66e5b065fb8ecf6d871f447f0697635a.jpg", 32 | "thumbnail": "https://pic.maizuo.com/usr/movie/66e5b065fb8ecf6d871f447f0697635a.jpg!150x0" 33 | }, 34 | "intro": "爱情换主角 命运中出错", 35 | "premiereAt": 1493222400000, 36 | "grade": "8.5", 37 | "watchCount": 32230, 38 | "cinemaCount": 122, 39 | "scheduleCount": 1528, 40 | "isPromotion": true, 41 | "isNowPlaying": true, 42 | "isComingSoon": "", 43 | "isPresold": "" 44 | }, { 45 | "id": 3609, 46 | "name": "春娇救志明", 47 | "cover": { 48 | "origin": "https://pic.maizuo.com/usr/movie/a5da1aa2c03b111215fc9d83cde4987c.jpg" 49 | }, 50 | "poster": { 51 | "origin": "https://pic.maizuo.com/usr/movie/99d9cb24c162593f44efd5365f1aff73.jpg", 52 | "thumbnail": "https://pic.maizuo.com/usr/movie/99d9cb24c162593f44efd5365f1aff73.jpg!150x0" 53 | }, 54 | "intro": "感情趋平淡 唯恐不喜欢", 55 | "premiereAt": 1493308800000, 56 | "grade": "7.9", 57 | "watchCount": 67766, 58 | "cinemaCount": 129, 59 | "scheduleCount": 1518, 60 | "isPromotion": true, 61 | "isNowPlaying": true, 62 | "isComingSoon": "", 63 | "isPresold": "" 64 | }, { 65 | "id": 3364, 66 | "name": "记忆大师", 67 | "cover": { 68 | "origin": "https://pic.maizuo.com/usr/movie/ad2e489494445db9eb1b70bf51e9d8de.jpg" 69 | }, 70 | "poster": { 71 | "origin": "https://pic.maizuo.com/usr/movie/39f1c6dedf39810780aee8b9b6c1f63a.jpg", 72 | "thumbnail": "https://pic.maizuo.com/usr/movie/39f1c6dedf39810780aee8b9b6c1f63a.jpg!150x0" 73 | }, 74 | "intro": "记忆可存取 麻烦一大堆", 75 | "premiereAt": 1493308800000, 76 | "grade": "8.5", 77 | "watchCount": 15223, 78 | "cinemaCount": 131, 79 | "scheduleCount": 1968, 80 | "isPromotion": true, 81 | "isNowPlaying": true, 82 | "isComingSoon": "", 83 | "isPresold": "" 84 | }, { 85 | "id": 3456, 86 | "name": "速度与激情8", 87 | "cover": { 88 | "origin": "https://pic.maizuo.com/usr/movie/f724ae8171940a23bc75593c1176ebf8.jpg" 89 | }, 90 | "poster": { 91 | "origin": "https://pic.maizuo.com/usr/movie/285b69bedff4291808174e940367659f.jpg", 92 | "thumbnail": "https://pic.maizuo.com/usr/movie/285b69bedff4291808174e940367659f.jpg!150x0" 93 | }, 94 | "intro": "车主要黑化 家族被击垮", 95 | "premiereAt": 1492099200000, 96 | "grade": "9.7", 97 | "watchCount": 1764279, 98 | "cinemaCount": 127, 99 | "scheduleCount": 1492, 100 | "isPromotion": true, 101 | "isNowPlaying": true, 102 | "isComingSoon": "", 103 | "isPresold": "" 104 | }], 105 | "page": { 106 | "total": 7, 107 | "current": 1 108 | } 109 | }, 110 | "msg": "ok" 111 | } -------------------------------------------------------------------------------- /src/data/shop-1.json: -------------------------------------------------------------------------------- 1 | { 2 | "status": 0, 3 | "data": { 4 | "list": [{ 5 | "attrs": [], 6 | "defaultSkuId": 18, 7 | "displaySalesCount": 2970, 8 | "id": 18, 9 | "isMember": 0, 10 | "masterName": "哆啦A梦十二生肖充电宝5800毫安", 11 | "maxPrice": 12800, 12 | "minPrice": 12800, 13 | "options": null, 14 | "score": 12800, 15 | "skuList": [{ 16 | "id": 18, 17 | "image": "http://pic.maizuo.com/manager/a8182630f20c0935f186bae78805446e.jpg", 18 | "inventory": 998, 19 | "masterName": "鼠 ", 20 | "price": 9990, 21 | "salesCount": 243, 22 | "score": 0, 23 | "slaveName": "" 24 | }], 25 | "slaveName": "【鸡年大吉】哆啦萌不停，造型新升级", 26 | "supplierId": 5 27 | }, { 28 | "attrs": [], 29 | "defaultSkuId": 141, 30 | "displaySalesCount": 2700, 31 | "id": 141, 32 | "isMember": 0, 33 | "masterName": "双口智能USB车充", 34 | "maxPrice": 3900, 35 | "minPrice": 3900, 36 | "options": null, 37 | "score": 3900, 38 | "skuList": [{ 39 | "id": 141, 40 | "image": "http://pic.maizuo.com/manager/299e59c8cb09bc868fc6ba31e43d1ca1.jpg", 41 | "inventory": 0, 42 | "masterName": "玫瑰金 ", 43 | "price": 3900, 44 | "salesCount": 567, 45 | "score": 0, 46 | "slaveName": "" 47 | }], 48 | "slaveName": "你一个，副驾驶一个，数量刚刚够~", 49 | "supplierId": 5 50 | }, { 51 | "attrs": [], 52 | "defaultSkuId": 118, 53 | "displaySalesCount": 2178, 54 | "id": 118, 55 | "isMember": 0, 56 | "masterName": "迷你镜子线控自拍杆", 57 | "maxPrice": 3900, 58 | "minPrice": 3900, 59 | "options": null, 60 | "score": 3900, 61 | "skuList": [{ 62 | "id": 118, 63 | "image": "http://pic.maizuo.com/manager/281d84836e612bd2876fcee6ceec28d0.jpg", 64 | "inventory": 0, 65 | "masterName": "粉色 ", 66 | "price": 2990, 67 | "salesCount": 630, 68 | "score": 0, 69 | "slaveName": "" 70 | }], 71 | "slaveName": "有了后置小镜子，用后置镜头自拍，照片质量更精细喔", 72 | "supplierId": 5 73 | }, { 74 | "attrs": [], 75 | "defaultSkuId": 12, 76 | "displaySalesCount": 1737, 77 | "id": 12, 78 | "isMember": 0, 79 | "masterName": "哆啦A梦挂饰款iPhone6s/6sp保护壳", 80 | "maxPrice": 7900, 81 | "minPrice": 7900, 82 | "options": null, 83 | "score": 7900, 84 | "skuList": [{ 85 | "id": 12, 86 | "image": "http://pic.maizuo.com/manager/902e6955b6c684a926f1e86e0dc19b88.jpg", 87 | "inventory": 985, 88 | "masterName": "iphone6/6s ", 89 | "price": 7900, 90 | "salesCount": 864, 91 | "score": 0, 92 | "slaveName": "" 93 | }], 94 | "slaveName": "叮叮当当的声音可萌啦", 95 | "supplierId": 5 96 | }, { 97 | "attrs": [], 98 | "defaultSkuId": 15, 99 | "displaySalesCount": 1728, 100 | "id": 15, 101 | "isMember": 0, 102 | "masterName": "哆啦A梦的道具！之自拍神器伸缩手", 103 | "maxPrice": 3900, 104 | "minPrice": 3900, 105 | "options": null, 106 | "score": 5900, 107 | "skuList": [{ 108 | "id": 15, 109 | "image": "http://pic.maizuo.com/manager/37e298bf8610154bea50df1aebfd6a91.jpg", 110 | "inventory": 947, 111 | "masterName": "蓝色 ", 112 | "price": 2990, 113 | "salesCount": 1728, 114 | "score": 0, 115 | "slaveName": "" 116 | }], 117 | "slaveName": "美丽永远自拍杆", 118 | "supplierId": 5 119 | }, { 120 | "attrs": [], 121 | "defaultSkuId": 59, 122 | "displaySalesCount": 1584, 123 | "id": 59, 124 | "isMember": 0, 125 | "masterName": "Rock Bear便携水杯", 126 | "maxPrice": 2900, 127 | "minPrice": 2900, 128 | "options": null, 129 | "score": 2900, 130 | "skuList": [{ 131 | "id": 59, 132 | "image": "http://pic.maizuo.com/manager/d691be6e86cce663c427cd583eb18fc3.jpg", 133 | "inventory": 13, 134 | "masterName": "黑色 ", 135 | "price": 2490, 136 | "salesCount": 513, 137 | "score": 0, 138 | "slaveName": "" 139 | }], 140 | "slaveName": "单纯不做作的便宜大水杯", 141 | "supplierId": 5 142 | }, { 143 | "attrs": [], 144 | "defaultSkuId": 138, 145 | "displaySalesCount": 1944, 146 | "id": 138, 147 | "isMember": 0, 148 | "masterName": "飞迪欧 蓝酷3D眼镜", 149 | "maxPrice": 990, 150 | "minPrice": 990, 151 | "options": null, 152 | "score": 499, 153 | "skuList": [{ 154 | "id": 138, 155 | "image": "http://pic.maizuo.com/manager/7a1988d369fd6763065aebea60f0122d.jpg", 156 | "inventory": 977, 157 | "masterName": "蓝色 ", 158 | "price": 990, 159 | "salesCount": 1944, 160 | "score": 0, 161 | "slaveName": "" 162 | }], 163 | "slaveName": "不要九九八，九块九包邮", 164 | "supplierId": 7 165 | }, { 166 | "attrs": [], 167 | "defaultSkuId": 92, 168 | "displaySalesCount": 1251, 169 | "id": 92, 170 | "isMember": 0, 171 | "masterName": "哆啦A梦锌合金数据线", 172 | "maxPrice": 3900, 173 | "minPrice": 3900, 174 | "options": null, 175 | "score": 3900, 176 | "skuList": [{ 177 | "id": 92, 178 | "image": "http://pic.maizuo.com/manager/7c95934d9c037025169ddfd2aa70ac30.jpg", 179 | "inventory": 961, 180 | "masterName": "蓝色 ", 181 | "price": 3900, 182 | "salesCount": 639, 183 | "score": 0, 184 | "slaveName": "" 185 | }], 186 | "slaveName": "安全的数据线，默默的守候，你值得拥有", 187 | "supplierId": 5 188 | }, { 189 | "attrs": [], 190 | "defaultSkuId": 27, 191 | "displaySalesCount": 1188, 192 | "id": 27, 193 | "isMember": 0, 194 | "masterName": "蜘蛛侠公仔LED灯", 195 | "maxPrice": 5900, 196 | "minPrice": 5900, 197 | "options": null, 198 | "score": 8900, 199 | "skuList": [{ 200 | "id": 27, 201 | "image": "http://pic.maizuo.com/manager/424db424a6420d3552e2b36aa0ac8b41.jpg", 202 | "inventory": 979, 203 | "masterName": "红色 ", 204 | "price": 6900, 205 | "salesCount": 1188, 206 | "score": 0, 207 | "slaveName": "" 208 | }], 209 | "slaveName": "蜘蛛侠不在吐丝的时候，他在放射光芒", 210 | "supplierId": 2 211 | }, { 212 | "attrs": [], 213 | "defaultSkuId": 132, 214 | "displaySalesCount": 1125, 215 | "id": 132, 216 | "isMember": 0, 217 | "masterName": "一拖三 充电线A款", 218 | "maxPrice": 3900, 219 | "minPrice": 3900, 220 | "options": null, 221 | "score": 3900, 222 | "skuList": [{ 223 | "id": 132, 224 | "image": "http://pic.maizuo.com/manager/b16b13954436b6d8ed87f1d05c6f6271.jpg", 225 | "inventory": 980, 226 | "masterName": "锖色 ", 227 | "price": 2990, 228 | "salesCount": 360, 229 | "score": 0, 230 | "slaveName": "" 231 | }], 232 | "slaveName": "你喜欢的样子我都有", 233 | "supplierId": 5 234 | }, { 235 | "attrs": [], 236 | "defaultSkuId": 4966, 237 | "displaySalesCount": 92, 238 | "id": 1439, 239 | "isMember": 0, 240 | "masterName": "CoCo李玟 世界巡回演唱会 深圳站 2017年5月6日￥580档", 241 | "maxPrice": 0, 242 | "minPrice": 0, 243 | "options": null, 244 | "score": 0, 245 | "skuList": [{ 246 | "id": 4966, 247 | "image": "http://mall.s.maizuo.com/8cfd7b5da29323ea1c86f7aceef61476.jpg", 248 | "inventory": 108, 249 | "masterName": "秒杀价199 ", 250 | "price": 19900, 251 | "salesCount": 92, 252 | "score": 0, 253 | "slaveName": "" 254 | }], 255 | "slaveName": "原￥580档，秒杀价现仅需￥199", 256 | "supplierId": 25 257 | }, { 258 | "attrs": [], 259 | "defaultSkuId": 162, 260 | "displaySalesCount": 873, 261 | "id": 162, 262 | "isMember": 0, 263 | "masterName": "长草颜团子iphone7/7p保护壳 挂绳款", 264 | "maxPrice": 9900, 265 | "minPrice": 9900, 266 | "options": null, 267 | "score": 9900, 268 | "skuList": [{ 269 | "id": 162, 270 | "image": "http://pic.maizuo.com/manager/171216cac804f0349f3fa140dcae15df.jpg", 271 | "inventory": 994, 272 | "masterName": "iPhone7 ", 273 | "price": 5990, 274 | "salesCount": 450, 275 | "score": 0, 276 | "slaveName": "" 277 | }], 278 | "slaveName": "喜欢被你挂在心上的感觉", 279 | "supplierId": 5 280 | }, { 281 | "attrs": [], 282 | "defaultSkuId": 163, 283 | "displaySalesCount": 810, 284 | "id": 163, 285 | "isMember": 0, 286 | "masterName": "长草呆萌公仔iphone7/7p保护壳", 287 | "maxPrice": 7900, 288 | "minPrice": 7900, 289 | "options": null, 290 | "score": 7900, 291 | "skuList": [{ 292 | "id": 163, 293 | "image": "http://pic.maizuo.com/manager/e1c34b67015a93a0932df69086aa597e.jpg", 294 | "inventory": 997, 295 | "masterName": "iPhone7 ", 296 | "price": 7900, 297 | "salesCount": 405, 298 | "score": 0, 299 | "slaveName": "" 300 | }], 301 | "slaveName": "呆萌长草团子，你心动了没", 302 | "supplierId": 5 303 | }, { 304 | "attrs": [], 305 | "defaultSkuId": 157, 306 | "displaySalesCount": 927, 307 | "id": 157, 308 | "isMember": 0, 309 | "masterName": "包邮| 正版贝肯熊定制卡通萌版学生手表", 310 | "maxPrice": 5900, 311 | "minPrice": 5900, 312 | "options": null, 313 | "score": 9900, 314 | "skuList": [{ 315 | "id": 157, 316 | "image": "http://pic.maizuo.com/manager/f1ae00dc3df8e20dace792ee443d1ece.jpg", 317 | "inventory": 974, 318 | "masterName": "蓝色 ", 319 | "price": 5990, 320 | "salesCount": 540, 321 | "score": 0, 322 | "slaveName": "" 323 | }], 324 | "slaveName": "撞色表盘表带，金属表扣彰显品质", 325 | "supplierId": 6 326 | }, { 327 | "attrs": [], 328 | "defaultSkuId": 184, 329 | "displaySalesCount": 729, 330 | "id": 184, 331 | "isMember": 0, 332 | "masterName": "蝙蝠侠大战超人系列手办之经典蝙蝠侠", 333 | "maxPrice": 7900, 334 | "minPrice": 7900, 335 | "options": null, 336 | "score": 8800, 337 | "skuList": [{ 338 | "id": 184, 339 | "image": "http://pic.maizuo.com/manager/2a9e80f7a21c8d3c2e02638cedb3caea.jpg", 340 | "inventory": 995, 341 | "masterName": "", 342 | "price": 8800, 343 | "salesCount": 729, 344 | "score": 0, 345 | "slaveName": "" 346 | }], 347 | "slaveName": "源自美国，畅销全球，FUNKO正品搪胶收藏玩偶", 348 | "supplierId": 2 349 | }, { 350 | "attrs": [], 351 | "defaultSkuId": 119, 352 | "displaySalesCount": 1215, 353 | "id": 119, 354 | "isMember": 0, 355 | "masterName": "运动腰包", 356 | "maxPrice": 3900, 357 | "minPrice": 3900, 358 | "options": null, 359 | "score": 3900, 360 | "skuList": [{ 361 | "id": 119, 362 | "image": "http://pic.maizuo.com/manager/8f570005cf54c9d9c1e1315a07a23407.jpg", 363 | "inventory": 0, 364 | "masterName": "黑色 ", 365 | "price": 3990, 366 | "salesCount": 360, 367 | "score": 0, 368 | "slaveName": "" 369 | }], 370 | "slaveName": "跑步装备不用贵，便宜好用才是对", 371 | "supplierId": 5 372 | }, { 373 | "attrs": [], 374 | "defaultSkuId": 95, 375 | "displaySalesCount": 783, 376 | "id": 95, 377 | "isMember": 0, 378 | "masterName": "Rock Bear车载支架", 379 | "maxPrice": 4900, 380 | "minPrice": 4900, 381 | "options": null, 382 | "score": 5500, 383 | "skuList": [{ 384 | "id": 95, 385 | "image": "http://pic.maizuo.com/manager/079275d8615f7268df90f083292185c7.jpg", 386 | "inventory": 957, 387 | "masterName": "黑红 ", 388 | "price": 4990, 389 | "salesCount": 783, 390 | "score": 0, 391 | "slaveName": "" 392 | }], 393 | "slaveName": "我是一款百搭的支架", 394 | "supplierId": 5 395 | }, { 396 | "attrs": [], 397 | "defaultSkuId": 116, 398 | "displaySalesCount": 666, 399 | "id": 116, 400 | "isMember": 0, 401 | "masterName": "磁吸懒人手机支架 ", 402 | "maxPrice": 3200, 403 | "minPrice": 3200, 404 | "options": null, 405 | "score": 3200, 406 | "skuList": [{ 407 | "id": 116, 408 | "image": "http://pic.maizuo.com/manager/5b68bac388d460f7c941976d1326020e.jpg", 409 | "inventory": 0, 410 | "masterName": "白色 ", 411 | "price": 3200, 412 | "salesCount": 666, 413 | "score": 0, 414 | "slaveName": "" 415 | }], 416 | "slaveName": "躺着玩手机，再也不会柠檬手啦！", 417 | "supplierId": 5 418 | }, { 419 | "attrs": [], 420 | "defaultSkuId": 107, 421 | "displaySalesCount": 765, 422 | "id": 107, 423 | "isMember": 0, 424 | "masterName": "立体声耳机", 425 | "maxPrice": 5900, 426 | "minPrice": 5900, 427 | "options": null, 428 | "score": 5900, 429 | "skuList": [{ 430 | "id": 107, 431 | "image": "http://pic.maizuo.com/manager/33f8ab9459276389404fae58b955f483.jpg", 432 | "inventory": 981, 433 | "masterName": "红色 ", 434 | "price": 5900, 435 | "salesCount": 279, 436 | "score": 0, 437 | "slaveName": "" 438 | }], 439 | "slaveName": "别看我像豌豆射手，其实我声音超正的", 440 | "supplierId": 5 441 | }, { 442 | "attrs": [], 443 | "defaultSkuId": 144, 444 | "displaySalesCount": 1017, 445 | "id": 144, 446 | "isMember": 0, 447 | "masterName": "后视镜行车记录仪", 448 | "maxPrice": 35900, 449 | "minPrice": 35900, 450 | "options": null, 451 | "score": 39900, 452 | "skuList": [{ 453 | "id": 144, 454 | "image": "http://pic.maizuo.com/manager/c1e3adbb8ee2c99172717a14e30bfcca.jpg", 455 | "inventory": 926, 456 | "masterName": "黑色 ", 457 | "price": 32990, 458 | "salesCount": 1017, 459 | "score": 0, 460 | "slaveName": "" 461 | }], 462 | "slaveName": "碰瓷倒车不用怕，出门在外全靠它", 463 | "supplierId": 5 464 | }], 465 | "total": 358 466 | }, 467 | "msg": "ok" 468 | } -------------------------------------------------------------------------------- /src/data/shop-2.json: -------------------------------------------------------------------------------- 1 | { 2 | "status": 0, 3 | "data": { 4 | "list": [{ 5 | "attrs": [], 6 | "defaultSkuId": 130, 7 | "displaySalesCount": 738, 8 | "id": 130, 9 | "isMember": 0, 10 | "masterName": "二合一Micro转Lightning面条数据线 L=100CM", 11 | "maxPrice": 2900, 12 | "minPrice": 2900, 13 | "options": null, 14 | "score": 2900, 15 | "skuList": [{ 16 | "id": 130, 17 | "image": "http://pic.maizuo.com/manager/0aed9b48432ff0302a5b4f4667bfefed.jpg", 18 | "inventory": 10, 19 | "masterName": "白色 ", 20 | "price": 2900, 21 | "salesCount": 108, 22 | "score": 0, 23 | "slaveName": "" 24 | }], 25 | "slaveName": "我一看小数据线，还有两幅面孔呢", 26 | "supplierId": 5 27 | }, { 28 | "attrs": [], 29 | "defaultSkuId": 160, 30 | "displaySalesCount": 612, 31 | "id": 160, 32 | "isMember": 0, 33 | "masterName": "贝肯熊安卓苹果手机通用数据线", 34 | "maxPrice": 3500, 35 | "minPrice": 3500, 36 | "options": null, 37 | "score": 3500, 38 | "skuList": [{ 39 | "id": 160, 40 | "image": "http://pic.maizuo.com/manager/9c6b6167bf2411e6702dcbb37c1359a5.jpg", 41 | "inventory": 994, 42 | "masterName": "蓝色 ", 43 | "price": 3500, 44 | "salesCount": 162, 45 | "score": 0, 46 | "slaveName": "" 47 | }], 48 | "slaveName": "别看我不起眼，但是我们安卓苹果通用的哦", 49 | "supplierId": 6 50 | }, { 51 | "attrs": [], 52 | "defaultSkuId": 158, 53 | "displaySalesCount": 594, 54 | "id": 158, 55 | "isMember": 0, 56 | "masterName": "萌萌贝肯熊书包", 57 | "maxPrice": 11900, 58 | "minPrice": 11900, 59 | "options": null, 60 | "score": 15900, 61 | "skuList": [{ 62 | "id": 158, 63 | "image": "http://pic.maizuo.com/manager/35dcf56467a2ea426d730ee19e011fb5.jpg", 64 | "inventory": 980, 65 | "masterName": "蓝灰色 ", 66 | "price": 9990, 67 | "salesCount": 594, 68 | "score": 0, 69 | "slaveName": "" 70 | }], 71 | "slaveName": "萌童必备热销款！", 72 | "supplierId": 6 73 | }, { 74 | "attrs": [], 75 | "defaultSkuId": 159, 76 | "displaySalesCount": 711, 77 | "id": 159, 78 | "isMember": 0, 79 | "masterName": "贝肯熊萌萌趴趴枕", 80 | "maxPrice": 12300, 81 | "minPrice": 12300, 82 | "options": null, 83 | "score": 12300, 84 | "skuList": [{ 85 | "id": 159, 86 | "image": "http://pic.maizuo.com/manager/ca5f8ec16bf6e7554e4423fc6cad6008.jpg", 87 | "inventory": 958, 88 | "masterName": "灰色 ", 89 | "price": 7990, 90 | "salesCount": 711, 91 | "score": 0, 92 | "slaveName": "" 93 | }], 94 | "slaveName": "见过这么萌的枕头嘛，喜欢就让它伴你入梦", 95 | "supplierId": 6 96 | }, { 97 | "attrs": [], 98 | "defaultSkuId": 23, 99 | "displaySalesCount": 549, 100 | "id": 23, 101 | "isMember": 0, 102 | "masterName": "漫威正版美国队长LED灯USB床头灯小夜灯", 103 | "maxPrice": 8900, 104 | "minPrice": 8900, 105 | "options": null, 106 | "score": 8900, 107 | "skuList": [{ 108 | "id": 23, 109 | "image": "http://pic.maizuo.com/manager/508a92c0eb723eb84411f72b056310ce.jpg", 110 | "inventory": 978, 111 | "masterName": "蓝红 ", 112 | "price": 4990, 113 | "salesCount": 549, 114 | "score": 0, 115 | "slaveName": "" 116 | }], 117 | "slaveName": "超级英雄保护你的眼睛", 118 | "supplierId": 2 119 | }, { 120 | "attrs": [], 121 | "defaultSkuId": 146, 122 | "displaySalesCount": 666, 123 | "id": 146, 124 | "isMember": 0, 125 | "masterName": "飞迪欧 绿酷3D眼镜", 126 | "maxPrice": 990, 127 | "minPrice": 990, 128 | "options": null, 129 | "score": 990, 130 | "skuList": [{ 131 | "id": 146, 132 | "image": "http://pic.maizuo.com/manager/21bba61bad40b21f0dac341acf07c709.jpg", 133 | "inventory": 974, 134 | "masterName": "绿色 ", 135 | "price": 990, 136 | "salesCount": 666, 137 | "score": 0, 138 | "slaveName": "" 139 | }], 140 | "slaveName": "酷酷3D眼镜，把时尚带到影院里", 141 | "supplierId": 7 142 | }, { 143 | "attrs": [], 144 | "defaultSkuId": 218, 145 | "displaySalesCount": 630, 146 | "id": 218, 147 | "isMember": 0, 148 | "masterName": "卡哇伊英雄来袭系列抱枕", 149 | "maxPrice": 3900, 150 | "minPrice": 3900, 151 | "options": null, 152 | "score": 4900, 153 | "skuList": [{ 154 | "id": 218, 155 | "image": "http://pic.maizuo.com/manager/5a1482b3b9ebc4cf235ef26bac15629f.jpg", 156 | "inventory": 984, 157 | "masterName": "蜘蛛侠 ", 158 | "price": 3900, 159 | "salesCount": 198, 160 | "score": 0, 161 | "slaveName": "" 162 | }], 163 | "slaveName": "可爱抱枕还能满足你的英雄情结", 164 | "supplierId": 2 165 | }, { 166 | "attrs": [], 167 | "defaultSkuId": 4746, 168 | "displaySalesCount": 326, 169 | "id": 1326, 170 | "isMember": 0, 171 | "masterName": "张惠妹“乌托邦 2.0 庆典”世界巡回演唱会-深圳站 2017.04.22~23", 172 | "maxPrice": 0, 173 | "minPrice": 0, 174 | "options": null, 175 | "score": 0, 176 | "skuList": [{ 177 | "id": 4746, 178 | "image": "http://mall.s.maizuo.com/13cb25dcb369d640d529ef12da834e5c.jpg", 179 | "inventory": 0, 180 | "masterName": "22日 780票面 ", 181 | "price": 78000, 182 | "salesCount": 172, 183 | "score": 0, 184 | "slaveName": "" 185 | }], 186 | "slaveName": "天后乌托邦巡演再度来袭（下单最高减300）", 187 | "supplierId": 9 188 | }, { 189 | "attrs": [], 190 | "defaultSkuId": 4641, 191 | "displaySalesCount": 441, 192 | "id": 1274, 193 | "isMember": 0, 194 | "masterName": "哆啦A梦 记忆面包摆件U盘", 195 | "maxPrice": 0, 196 | "minPrice": 0, 197 | "options": null, 198 | "score": 0, 199 | "skuList": [{ 200 | "id": 4641, 201 | "image": "http://mall.s.maizuo.com/cb6130a1ed54d1fa92c7c29fa252b451.jpg", 202 | "inventory": 10, 203 | "masterName": "", 204 | "price": 13900, 205 | "salesCount": 441, 206 | "score": 0, 207 | "slaveName": "" 208 | }], 209 | "slaveName": "可爱蓝胖子造型U盘", 210 | "supplierId": 5 211 | }, { 212 | "attrs": [], 213 | "defaultSkuId": 94, 214 | "displaySalesCount": 423, 215 | "id": 94, 216 | "isMember": 0, 217 | "masterName": "锌合金数据线", 218 | "maxPrice": 3900, 219 | "minPrice": 3900, 220 | "options": null, 221 | "score": 3900, 222 | "skuList": [{ 223 | "id": 94, 224 | "image": "http://pic.maizuo.com/manager/dbbf4d3eb6b1b2b5a7e737c12beaf05d.jpg", 225 | "inventory": 997, 226 | "masterName": "黑色 ", 227 | "price": 3900, 228 | "salesCount": 198, 229 | "score": 0, 230 | "slaveName": "" 231 | }], 232 | "slaveName": "更长！更滑！更好用！", 233 | "supplierId": 5 234 | }, { 235 | "attrs": [], 236 | "defaultSkuId": 4968, 237 | "displaySalesCount": 41, 238 | "id": 1441, 239 | "isMember": 0, 240 | "masterName": "CoCo李玟 世界巡回演唱会 深圳站 2017年5月6日￥980档", 241 | "maxPrice": 0, 242 | "minPrice": 0, 243 | "options": null, 244 | "score": 0, 245 | "skuList": [{ 246 | "id": 4968, 247 | "image": "http://mall.s.maizuo.com/07fdfffd300103e0a87be4b0e295c281.jpg", 248 | "inventory": 159, 249 | "masterName": "秒杀价399 ", 250 | "price": 39900, 251 | "salesCount": 41, 252 | "score": 0, 253 | "slaveName": "" 254 | }], 255 | "slaveName": "原￥980档，秒杀价现仅需￥399", 256 | "supplierId": 25 257 | }, { 258 | "attrs": [], 259 | "defaultSkuId": 217, 260 | "displaySalesCount": 477, 261 | "id": 217, 262 | "isMember": 0, 263 | "masterName": "漫威英雄卡通抱枕两用空调被", 264 | "maxPrice": 11900, 265 | "minPrice": 11900, 266 | "options": null, 267 | "score": 11900, 268 | "skuList": [{ 269 | "id": 217, 270 | "image": "http://pic.maizuo.com/manager/42861c352eeab259610037f5ffce2834.jpg", 271 | "inventory": 6, 272 | "masterName": "美国队长 ", 273 | "price": 11900, 274 | "salesCount": 252, 275 | "score": 0, 276 | "slaveName": "" 277 | }], 278 | "slaveName": "卡通靠垫被，给你温暖每一天", 279 | "supplierId": 2 280 | }, { 281 | "attrs": [], 282 | "defaultSkuId": 99, 283 | "displaySalesCount": 639, 284 | "id": 99, 285 | "isMember": 0, 286 | "masterName": "萌萌贝肯熊纸巾盒", 287 | "maxPrice": 3900, 288 | "minPrice": 3900, 289 | "options": null, 290 | "score": 3900, 291 | "skuList": [{ 292 | "id": 99, 293 | "image": "http://pic.maizuo.com/manager/1fa2edbcb2809c0f82f6adc587d9126f.jpg", 294 | "inventory": 968, 295 | "masterName": "灰色 ", 296 | "price": 3900, 297 | "salesCount": 639, 298 | "score": 0, 299 | "slaveName": "" 300 | }], 301 | "slaveName": "如果你愿意一层一层一层地抽空我的心", 302 | "supplierId": 6 303 | }, { 304 | "attrs": [], 305 | "defaultSkuId": 140, 306 | "displaySalesCount": 405, 307 | "id": 140, 308 | "isMember": 0, 309 | "masterName": "汽车防滑垫", 310 | "maxPrice": 1900, 311 | "minPrice": 1900, 312 | "options": null, 313 | "score": 1900, 314 | "skuList": [{ 315 | "id": 140, 316 | "image": "http://pic.maizuo.com/manager/3c5abdf2dc9307daaa4cd24f45e3842d.jpg", 317 | "inventory": 37, 318 | "masterName": "格纹 ", 319 | "price": 1900, 320 | "salesCount": 261, 321 | "score": 0, 322 | "slaveName": "" 323 | }], 324 | "slaveName": "让手机告别在宝贝车上摩擦，摩擦", 325 | "supplierId": 5 326 | }, { 327 | "attrs": [], 328 | "defaultSkuId": 149, 329 | "displaySalesCount": 405, 330 | "id": 149, 331 | "isMember": 0, 332 | "masterName": "无线充电盘", 333 | "maxPrice": 10900, 334 | "minPrice": 10900, 335 | "options": null, 336 | "score": 10900, 337 | "skuList": [{ 338 | "id": 149, 339 | "image": "http://pic.maizuo.com/manager/8ebb0f1ec68af56d6e6334b6fd344ee5.jpg", 340 | "inventory": 990, 341 | "masterName": "黑色 ", 342 | "price": 7990, 343 | "salesCount": 243, 344 | "score": 0, 345 | "slaveName": "" 346 | }], 347 | "slaveName": "充电五分钟，不用数据线（本身手机不支持无线充电的，请自行购买无线充电接收器！！）", 348 | "supplierId": 5 349 | }, { 350 | "attrs": [], 351 | "defaultSkuId": 238, 352 | "displaySalesCount": 594, 353 | "id": 238, 354 | "isMember": 0, 355 | "masterName": "喵星星小夜灯", 356 | "maxPrice": 11800, 357 | "minPrice": 11800, 358 | "options": null, 359 | "score": 11800, 360 | "skuList": [{ 361 | "id": 238, 362 | "image": "http://pic.maizuo.com/manager/4f020d198553a0229f7882e5b98354c9.jpg", 363 | "inventory": 13, 364 | "masterName": "喵星星 ", 365 | "price": 8990, 366 | "salesCount": 594, 367 | "score": 0, 368 | "slaveName": "" 369 | }], 370 | "slaveName": "萌萌小夜灯，夜晚提供光明", 371 | "supplierId": 3 372 | }, { 373 | "attrs": [], 374 | "defaultSkuId": 241, 375 | "displaySalesCount": 351, 376 | "id": 241, 377 | "isMember": 0, 378 | "masterName": "卡通形象硬质透明手机壳iphone6/6s", 379 | "maxPrice": 4900, 380 | "minPrice": 4900, 381 | "options": null, 382 | "score": 4900, 383 | "skuList": [{ 384 | "id": 241, 385 | "image": "http://pic.maizuo.com/manager/1cacbb43889527a1df0cfa3b5f51cdb3.jpg", 386 | "inventory": 49, 387 | "masterName": "黄豆豆 ", 388 | "price": 4900, 389 | "salesCount": 90, 390 | "score": 0, 391 | "slaveName": "" 392 | }], 393 | "slaveName": "静静的看着你，有木有被我萌化", 394 | "supplierId": 3 395 | }, { 396 | "attrs": [], 397 | "defaultSkuId": 4789, 398 | "displaySalesCount": 154, 399 | "id": 1345, 400 | "isMember": 0, 401 | "masterName": "【你妹来啦】好妹妹2017“自在如风”全国巡回演唱会深圳站清新来袭！", 402 | "maxPrice": 0, 403 | "minPrice": 0, 404 | "options": null, 405 | "score": 0, 406 | "skuList": [{ 407 | "id": 4789, 408 | "image": "http://mall.s.maizuo.com/1a2ccc527901fafacb2b8d298184c9d6.jpg", 409 | "inventory": 23, 410 | "masterName": "99 ", 411 | "price": 9900, 412 | "salesCount": 96, 413 | "score": 0, 414 | "slaveName": "" 415 | }], 416 | "slaveName": "小清新民谣风来袭", 417 | "supplierId": 9 418 | }, { 419 | "attrs": [], 420 | "defaultSkuId": 127, 421 | "displaySalesCount": 450, 422 | "id": 127, 423 | "isMember": 0, 424 | "masterName": "iPhone 7 Plus 钢化玻璃保护膜(2.5D) 0.3MM", 425 | "maxPrice": 2600, 426 | "minPrice": 2600, 427 | "options": null, 428 | "score": 2600, 429 | "skuList": [{ 430 | "id": 127, 431 | "image": "http://pic.maizuo.com/manager/8d986d21968a22bdfe6fce867775fd32.jpg", 432 | "inventory": 976, 433 | "masterName": "透明 ", 434 | "price": 2600, 435 | "salesCount": 450, 436 | "score": 0, 437 | "slaveName": "" 438 | }], 439 | "slaveName": "我是保护手机屏幕的小透明", 440 | "supplierId": 5 441 | }, { 442 | "attrs": [], 443 | "defaultSkuId": 4468, 444 | "displaySalesCount": 684, 445 | "id": 1172, 446 | "isMember": 0, 447 | "masterName": "超轻近视3d眼镜夹片 圆形", 448 | "maxPrice": 0, 449 | "minPrice": 0, 450 | "options": null, 451 | "score": 0, 452 | "skuList": [{ 453 | "id": 4468, 454 | "image": "http://mall.s.maizuo.com/9e19c69db5d828ff38ed1d21859bd973.jpg", 455 | "inventory": 924, 456 | "masterName": "", 457 | "price": 1900, 458 | "salesCount": 684, 459 | "score": 0, 460 | "slaveName": "" 461 | }], 462 | "slaveName": "再也不用担心有要带两个眼镜看电影啦", 463 | "supplierId": 1 464 | }], 465 | "total": 358 466 | }, 467 | "msg": "ok" 468 | } -------------------------------------------------------------------------------- /src/data/shop-3.json: -------------------------------------------------------------------------------- 1 | { 2 | "status": 0, 3 | "data": { 4 | "list": [{ 5 | "attrs": [], 6 | "defaultSkuId": 4721, 7 | "displaySalesCount": 351, 8 | "id": 1320, 9 | "isMember": 0, 10 | "masterName": "小麦充电宝", 11 | "maxPrice": 0, 12 | "minPrice": 0, 13 | "options": null, 14 | "score": 0, 15 | "skuList": [{ 16 | "id": 4721, 17 | "image": "http://mall.s.maizuo.com/8b8a9ce7c1a69294f2301cfee6f51349.jpg", 18 | "inventory": 978, 19 | "masterName": "白色 ", 20 | "price": 8990, 21 | "salesCount": 198, 22 | "score": 0, 23 | "slaveName": "" 24 | }], 25 | "slaveName": "容量超大，自带双重数据线，出门只带我就好啦！", 26 | "supplierId": 9 27 | }, { 28 | "attrs": [], 29 | "defaultSkuId": 183, 30 | "displaySalesCount": 306, 31 | "id": 183, 32 | "isMember": 0, 33 | "masterName": "蝙蝠侠大战超人系列手办之超人", 34 | "maxPrice": 8800, 35 | "minPrice": 8800, 36 | "options": null, 37 | "score": 8800, 38 | "skuList": [{ 39 | "id": 183, 40 | "image": "http://pic.maizuo.com/manager/349a2d2519870f33e3fec5de5ad89fb1.jpg", 41 | "inventory": 996, 42 | "masterName": "", 43 | "price": 7900, 44 | "salesCount": 306, 45 | "score": 0, 46 | "slaveName": "" 47 | }], 48 | "slaveName": "源自美国，畅销全球，FUNKO正品搪胶收藏玩偶", 49 | "supplierId": 2 50 | }, { 51 | "attrs": [], 52 | "defaultSkuId": 243, 53 | "displaySalesCount": 432, 54 | "id": 243, 55 | "isMember": 0, 56 | "masterName": "萌仔形象马克杯", 57 | "maxPrice": 5700, 58 | "minPrice": 5700, 59 | "options": null, 60 | "score": 5700, 61 | "skuList": [{ 62 | "id": 243, 63 | "image": "http://pic.maizuo.com/manager/b8ca83cf0efff7a7efc120659032af24.jpg", 64 | "inventory": 44, 65 | "masterName": "棕色 ", 66 | "price": 4990, 67 | "salesCount": 180, 68 | "score": 0, 69 | "slaveName": "" 70 | }], 71 | "slaveName": "琦琦熊、黄豆豆，选一款，捧在手心里", 72 | "supplierId": 3 73 | }, { 74 | "attrs": [], 75 | "defaultSkuId": 299, 76 | "displaySalesCount": 423, 77 | "id": 299, 78 | "isMember": 0, 79 | "masterName": "Y5立体声有线耳机 红蓝两色可选", 80 | "maxPrice": 9900, 81 | "minPrice": 9900, 82 | "options": null, 83 | "score": 9900, 84 | "skuList": [{ 85 | "id": 299, 86 | "image": "http://pic.maizuo.com/manager/91089e69c5b5b10f107d7ff5d9dbd9e5.jpg", 87 | "inventory": 5, 88 | "masterName": "红色 ", 89 | "price": 9900, 90 | "salesCount": 207, 91 | "score": 0, 92 | "slaveName": "" 93 | }], 94 | "slaveName": "有点小酷的造型，音质同样有保障", 95 | "supplierId": 5 96 | }, { 97 | "attrs": [], 98 | "defaultSkuId": 58, 99 | "displaySalesCount": 342, 100 | "id": 58, 101 | "isMember": 0, 102 | "masterName": "Rock Bear便携轻巧自拍杆", 103 | "maxPrice": 4900, 104 | "minPrice": 4900, 105 | "options": null, 106 | "score": 4900, 107 | "skuList": [{ 108 | "id": 58, 109 | "image": "http://pic.maizuo.com/manager/c68181ddaf891a8f2a9fbfca6fc19939.jpg", 110 | "inventory": 980, 111 | "masterName": "黑红 ", 112 | "price": 4900, 113 | "salesCount": 342, 114 | "score": 0, 115 | "slaveName": "" 116 | }], 117 | "slaveName": "帅气永远自拍杆", 118 | "supplierId": 5 119 | }, { 120 | "attrs": [], 121 | "defaultSkuId": 80, 122 | "displaySalesCount": 333, 123 | "id": 80, 124 | "isMember": 0, 125 | "masterName": "立体熊仔iphone6/6s手机壳", 126 | "maxPrice": 5900, 127 | "minPrice": 5900, 128 | "options": null, 129 | "score": 5900, 130 | "skuList": [{ 131 | "id": 80, 132 | "image": "http://pic.maizuo.com/manager/1ca77185aa4049b9dd0c278835e1b2a4.jpg", 133 | "inventory": 996, 134 | "masterName": "黑色 ", 135 | "price": 5900, 136 | "salesCount": 162, 137 | "score": 0, 138 | "slaveName": "" 139 | }], 140 | "slaveName": "磨砂壳面，防汗防滑，壳面经过细致打磨，光滑舒适", 141 | "supplierId": 5 142 | }, { 143 | "attrs": [], 144 | "defaultSkuId": 245, 145 | "displaySalesCount": 450, 146 | "id": 245, 147 | "isMember": 0, 148 | "masterName": "天天爱消除卡通形象U型枕", 149 | "maxPrice": 6900, 150 | "minPrice": 6900, 151 | "options": null, 152 | "score": 6900, 153 | "skuList": [{ 154 | "id": 245, 155 | "image": "http://pic.maizuo.com/manager/3756bd64c03391c3b1eaa3067facc24b.jpg", 156 | "inventory": 42, 157 | "masterName": "紫色 ", 158 | "price": 6900, 159 | "salesCount": 126, 160 | "score": 0, 161 | "slaveName": "" 162 | }], 163 | "slaveName": "累了困了，就靠在我的肩上", 164 | "supplierId": 3 165 | }, { 166 | "attrs": [], 167 | "defaultSkuId": 4877, 168 | "displaySalesCount": 270, 169 | "id": 1391, 170 | "isMember": 0, 171 | "masterName": "熊本熊脸型抱枕", 172 | "maxPrice": 0, 173 | "minPrice": 0, 174 | "options": null, 175 | "score": 0, 176 | "skuList": [{ 177 | "id": 4877, 178 | "image": "http://mall.s.maizuo.com/7890fab7c831195cef6b7b1459419998.jpg", 179 | "inventory": 10, 180 | "masterName": "", 181 | "price": 1990, 182 | "salesCount": 270, 183 | "score": 0, 184 | "slaveName": "" 185 | }], 186 | "slaveName": "比鸡排还大的脸（预售5月中旬发货）", 187 | "supplierId": 9 188 | }, { 189 | "attrs": [], 190 | "defaultSkuId": 93, 191 | "displaySalesCount": 351, 192 | "id": 93, 193 | "isMember": 0, 194 | "masterName": "哆啦A梦 吸盘式保护支架", 195 | "maxPrice": 4900, 196 | "minPrice": 4900, 197 | "options": null, 198 | "score": 7900, 199 | "skuList": [{ 200 | "id": 93, 201 | "image": "http://pic.maizuo.com/manager/aa2271411b939c61666b5bebc5d646c7.jpg", 202 | "inventory": 982, 203 | "masterName": "蓝色 ", 204 | "price": 5500, 205 | "salesCount": 351, 206 | "score": 0, 207 | "slaveName": "" 208 | }], 209 | "slaveName": "主人去哪我去哪，我是可爱的小支架，大屏小屏全面通用", 210 | "supplierId": 5 211 | }, { 212 | "attrs": [], 213 | "defaultSkuId": 192, 214 | "displaySalesCount": 360, 215 | "id": 192, 216 | "isMember": 0, 217 | "masterName": "哆啦A梦暖手宝移动电源（配绒布袋）", 218 | "maxPrice": 15800, 219 | "minPrice": 15800, 220 | "options": null, 221 | "score": 15800, 222 | "skuList": [{ 223 | "id": 192, 224 | "image": "http://pic.maizuo.com/manager/2e75903ee00e58dcfd3e67ad0ff3bbcb.jpg", 225 | "inventory": 994, 226 | "masterName": "哆啦A梦 ", 227 | "price": 15800, 228 | "salesCount": 225, 229 | "score": 0, 230 | "slaveName": "" 231 | }], 232 | "slaveName": "能取暖的除了爱情，还有暖手宝", 233 | "supplierId": 5 234 | }, { 235 | "attrs": [], 236 | "defaultSkuId": 135, 237 | "displaySalesCount": 396, 238 | "id": 135, 239 | "isMember": 0, 240 | "masterName": "磁吸懒人平板支架", 241 | "maxPrice": 5900, 242 | "minPrice": 5900, 243 | "options": null, 244 | "score": 5900, 245 | "skuList": [{ 246 | "id": 135, 247 | "image": "http://pic.maizuo.com/manager/c590cb3c2a282f829971142b897ade09.jpg", 248 | "inventory": 15, 249 | "masterName": "玫瑰金 ", 250 | "price": 4990, 251 | "salesCount": 225, 252 | "score": 0, 253 | "slaveName": "" 254 | }], 255 | "slaveName": "解放双手神器", 256 | "supplierId": 5 257 | }, { 258 | "attrs": [], 259 | "defaultSkuId": 78, 260 | "displaySalesCount": 261, 261 | "id": 78, 262 | "isMember": 0, 263 | "masterName": "哆啦A梦防摔半透保护壳i6/6s", 264 | "maxPrice": 7900, 265 | "minPrice": 7900, 266 | "options": null, 267 | "score": 7900, 268 | "skuList": [{ 269 | "id": 78, 270 | "image": "http://pic.maizuo.com/manager/209027a0b76572de0eae2c46dd4c000b.jpg", 271 | "inventory": 996, 272 | "masterName": "精神 ", 273 | "price": 7900, 274 | "salesCount": 144, 275 | "score": 0, 276 | "slaveName": "" 277 | }], 278 | "slaveName": "风吹雨打都不怕", 279 | "supplierId": 5 280 | }, { 281 | "attrs": [], 282 | "defaultSkuId": 305, 283 | "displaySalesCount": 531, 284 | "id": 305, 285 | "isMember": 0, 286 | "masterName": "双口旅行充电器", 287 | "maxPrice": 3600, 288 | "minPrice": 3600, 289 | "options": null, 290 | "score": 3600, 291 | "skuList": [{ 292 | "id": 305, 293 | "image": "http://pic.maizuo.com/manager/4166ceb9ad4950eb7661c6f1ddddeb78.jpg", 294 | "inventory": 985, 295 | "masterName": "黑色 ", 296 | "price": 3600, 297 | "salesCount": 189, 298 | "score": 0, 299 | "slaveName": "" 300 | }], 301 | "slaveName": "手机平板一起充，不用担心电子产品没有电啦", 302 | "supplierId": 5 303 | }, { 304 | "attrs": [], 305 | "defaultSkuId": 4520, 306 | "displaySalesCount": 342, 307 | "id": 1196, 308 | "isMember": 0, 309 | "masterName": "龙猫搪胶挂件+绳子", 310 | "maxPrice": 0, 311 | "minPrice": 0, 312 | "options": null, 313 | "score": 0, 314 | "skuList": [{ 315 | "id": 4520, 316 | "image": "http://mall.s.maizuo.com/79de0b8d6cd0340eccb876e563aa6329.jpg", 317 | "inventory": 962, 318 | "masterName": "", 319 | "price": 1800, 320 | "salesCount": 342, 321 | "score": 0, 322 | "slaveName": "" 323 | }], 324 | "slaveName": "人人心中都有个龙猫，童年就永远不会消失", 325 | "supplierId": 10 326 | }, { 327 | "attrs": [], 328 | "defaultSkuId": 224, 329 | "displaySalesCount": 261, 330 | "id": 224, 331 | "isMember": 0, 332 | "masterName": "甲壳虫折叠儿童3d眼镜", 333 | "maxPrice": 1900, 334 | "minPrice": 1900, 335 | "options": null, 336 | "score": 1900, 337 | "skuList": [{ 338 | "id": 224, 339 | "image": "http://pic.maizuo.com/manager/69ffdda97414691d2a7ebe5f14885536.jpg", 340 | "inventory": 999, 341 | "masterName": "黄色 ", 342 | "price": 1900, 343 | "salesCount": 45, 344 | "score": 0, 345 | "slaveName": "" 346 | }], 347 | "slaveName": "适合2-13岁以下儿童使用", 348 | "supplierId": 1 349 | }, { 350 | "attrs": [], 351 | "defaultSkuId": 29, 352 | "displaySalesCount": 243, 353 | "id": 29, 354 | "isMember": 0, 355 | "masterName": "哆啦A梦i7/7P简约手机壳", 356 | "maxPrice": 4500, 357 | "minPrice": 4500, 358 | "options": null, 359 | "score": 4500, 360 | "skuList": [{ 361 | "id": 29, 362 | "image": "http://pic.maizuo.com/manager/881f6014ceba808d72d15aa4119de5d4.jpg", 363 | "inventory": 995, 364 | "masterName": "iPhone7 ", 365 | "price": 4500, 366 | "salesCount": 135, 367 | "score": 0, 368 | "slaveName": "" 369 | }], 370 | "slaveName": "你的哆啦A梦，快点把它带回家", 371 | "supplierId": 5 372 | }, { 373 | "attrs": [], 374 | "defaultSkuId": 321, 375 | "displaySalesCount": 225, 376 | "id": 321, 377 | "isMember": 0, 378 | "masterName": "星球大战-达斯摩尔T恤", 379 | "maxPrice": 14800, 380 | "minPrice": 14800, 381 | "options": null, 382 | "score": 14800, 383 | "skuList": [{ 384 | "id": 321, 385 | "image": "http://pic.maizuo.com/manager/81023a12f121a6f073c2e9e99df9f494.jpg", 386 | "inventory": 999, 387 | "masterName": "S ", 388 | "price": 14800, 389 | "salesCount": 45, 390 | "score": 0, 391 | "slaveName": "" 392 | }], 393 | "slaveName": "At last we shall have revenge!", 394 | "supplierId": 8 395 | }, { 396 | "attrs": [], 397 | "defaultSkuId": 4550, 398 | "displaySalesCount": 675, 399 | "id": 1217, 400 | "isMember": 0, 401 | "masterName": "精致立体小黄人搪胶公仔挂件（共3款）", 402 | "maxPrice": 0, 403 | "minPrice": 0, 404 | "options": null, 405 | "score": 0, 406 | "skuList": [{ 407 | "id": 4550, 408 | "image": "http://mall.s.maizuo.com/91020764e6f0a3ed712ed9211b1d06ca.jpg", 409 | "inventory": 97, 410 | "masterName": "单眼 ", 411 | "price": 1400, 412 | "salesCount": 126, 413 | "score": 0, 414 | "slaveName": "" 415 | }], 416 | "slaveName": "你知道吗？电影设定小黄人是用香蕉泥做的", 417 | "supplierId": 10 418 | }, { 419 | "attrs": [], 420 | "defaultSkuId": 26, 421 | "displaySalesCount": 225, 422 | "id": 26, 423 | "isMember": 0, 424 | "masterName": "哆啦A梦挂饰款iPhone7/7P保护壳", 425 | "maxPrice": 7900, 426 | "minPrice": 7900, 427 | "options": null, 428 | "score": 7900, 429 | "skuList": [{ 430 | "id": 26, 431 | "image": "http://pic.maizuo.com/manager/4ff1b04e704333ecffd56f1fdddd03b7.jpg", 432 | "inventory": 999, 433 | "masterName": "iPhone7 ", 434 | "price": 7900, 435 | "salesCount": 81, 436 | "score": 0, 437 | "slaveName": "" 438 | }], 439 | "slaveName": "叮叮当当的声音可萌啦", 440 | "supplierId": 5 441 | }, { 442 | "attrs": [], 443 | "defaultSkuId": 147, 444 | "displaySalesCount": 432, 445 | "id": 147, 446 | "isMember": 0, 447 | "masterName": "飞迪欧 魔镜3D眼镜", 448 | "maxPrice": 1580, 449 | "minPrice": 1580, 450 | "options": null, 451 | "score": 1580, 452 | "skuList": [{ 453 | "id": 147, 454 | "image": "http://pic.maizuo.com/manager/3a0493107a4eff34e5f7c3e403027f29.jpg", 455 | "inventory": 968, 456 | "masterName": "黑色 ", 457 | "price": 1800, 458 | "salesCount": 432, 459 | "score": 0, 460 | "slaveName": "" 461 | }], 462 | "slaveName": "不夹头 、不眩晕、不闪烁、无辐射、不伤眼", 463 | "supplierId": 7 464 | }], 465 | "total": 358 466 | }, 467 | "msg": "ok" 468 | } -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import ReactDom from "react-dom"; 3 | import Router from "./router"; 4 | 5 | ReactDom.render( 6 | , 7 | document.querySelector("#app") 8 | ) -------------------------------------------------------------------------------- /src/router.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { 3 | Router, 4 | Route, 5 | IndexRedirect, 6 | hashHistory 7 | } from "react-router"; 8 | import { 9 | Provider 10 | } from "react-redux"; 11 | import store from "./store"; 12 | 13 | import App from "./components/App"; 14 | import Home from "./components/home/Home"; 15 | import Detail from "./components/home/MovieDetail"; 16 | import Movie from "./components/movie/Movie"; 17 | import Cinema from "./components/cinema/Cinema"; 18 | import Shop from "./components/shop/Shop"; 19 | import MovieList from "./components/movie/MovieList"; 20 | 21 | const RouterConfig = () => ( 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | ) 39 | export default RouterConfig; -------------------------------------------------------------------------------- /src/store/action.js: -------------------------------------------------------------------------------- 1 | export function tabNow() { 2 | return (dispatch) => { 3 | dispatch({ 4 | type: "TAB_NOW" 5 | }); 6 | dispatch({ 7 | type: "CHANGE_NOW_PAGE", 8 | payload: 1 9 | }); 10 | getData(1, "now-playing", function (data) { 11 | dispatch({ 12 | type: "GET_NOW", 13 | payload: data 14 | }) 15 | }); 16 | } 17 | } 18 | 19 | export function tabComing() { 20 | return (dispatch) => { 21 | dispatch({ 22 | type: "TAB_COMING" 23 | }); 24 | dispatch({ 25 | type: "CHANGE_COMING_PAGE", 26 | payload: 1 27 | }); 28 | getData(1, "coming-soon", function (data) { 29 | dispatch({ 30 | type: "GET_COMING", 31 | payload: data 32 | }) 33 | }); 34 | } 35 | } 36 | 37 | export function getMoreNow(pg) { 38 | return (dispatch) => { 39 | getData(pg, "now-playing", function (data) { 40 | dispatch({ 41 | type: "GET_MORE_NOW", 42 | payload: data 43 | }) 44 | }); 45 | } 46 | } 47 | export function changeNowPage(p) { 48 | return (dispatch) => { 49 | dispatch({ 50 | type: "CHANGE_NOW_PAGE", 51 | payload: p 52 | }) 53 | } 54 | } 55 | export function getMoreComing(pg) { 56 | return (dispatch) => { 57 | getData(pg, "coming-soon", function (data) { 58 | dispatch({ 59 | type: "GET_MORE_COMING", 60 | payload: data 61 | }) 62 | }); 63 | } 64 | } 65 | export function changeComingPage(p) { 66 | return (dispatch) => { 67 | dispatch({ 68 | type: "CHANGE_COMING_PAGE", 69 | payload: p 70 | }) 71 | } 72 | } 73 | 74 | function getData(pg, tp, cb) { 75 | fetch("/src/data/" + tp + "-" + pg + ".json").then((res) => { 76 | if (res.ok) { 77 | return res.json(); 78 | } else { 79 | console.log("error"); 80 | } 81 | }).then((data) => { 82 | cb(data.data.films); 83 | }); 84 | } -------------------------------------------------------------------------------- /src/store/index.js: -------------------------------------------------------------------------------- 1 | import {createStore, applyMiddleware } from "redux"; 2 | import reducer from "./reducer"; 3 | import thunk from "redux-thunk"; 4 | import defaultState from "./state"; 5 | 6 | 7 | const store = createStore(reducer, defaultState, applyMiddleware(thunk)); 8 | 9 | export default store; -------------------------------------------------------------------------------- /src/store/reducer.js: -------------------------------------------------------------------------------- 1 | import defaultState from "./state"; 2 | const reducer = (state = defaultState, action) => { 3 | let { 4 | type, 5 | payload 6 | } = action; 7 | switch (type) { 8 | case "TOGGLE_NAV": 9 | if (state.navShow) { 10 | return Object.assign({}, state, { 11 | navShow: false 12 | }); 13 | } else { 14 | return Object.assign({}, state, { 15 | navShow: true 16 | }); 17 | } 18 | break; 19 | case "TAB_NOW": 20 | return Object.assign({}, state, { 21 | isNow: true, 22 | isComing: false 23 | }); 24 | break; 25 | case "TAB_COMING": 26 | return Object.assign({}, state, { 27 | isNow: false, 28 | isComing: true 29 | }); 30 | break; 31 | case "GET_NOW": 32 | return Object.assign({}, state, { 33 | nowList:payload 34 | }); 35 | break; 36 | case "GET_COMING": 37 | return Object.assign({}, state, { 38 | comingList: payload 39 | }); 40 | break; 41 | case "GET_MORE_NOW": 42 | return Object.assign({}, state, { 43 | nowList:state.nowList.concat(payload) 44 | }); 45 | break; 46 | case "CHANGE_NOW_PAGE": 47 | return Object.assign({}, state, { 48 | nowPage:payload 49 | }); 50 | break; 51 | case "GET_MORE_COMING": 52 | return Object.assign({}, state, { 53 | comingList: state.comingList.concat(payload) 54 | }); 55 | break; 56 | case "CHANGE_COMING_PAGE": 57 | return Object.assign({}, state, { 58 | comingPage:payload 59 | }); 60 | break; 61 | default: 62 | return state; 63 | break; 64 | } 65 | } 66 | 67 | export default reducer; -------------------------------------------------------------------------------- /src/store/state.js: -------------------------------------------------------------------------------- 1 | const defaultState = { 2 | navShow:false, 3 | isNow:true, 4 | isComing:false, 5 | nowList:[], 6 | comingList:[], 7 | nowPage:1, 8 | comingPage:1 9 | } 10 | 11 | export default defaultState; -------------------------------------------------------------------------------- /src/swipe.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Swipe 2.0 3 | * 4 | * Brad Birdsall 5 | * Copyright 2013, MIT License 6 | * 7 | */ 8 | 9 | function Swipe(container, options) { 10 | 11 | "use strict"; 12 | 13 | // utilities 14 | var noop = function() {}; // simple no operation function 15 | var offloadFn = function(fn) { setTimeout(fn || noop, 0) }; // offload a functions execution 16 | 17 | // check browser capabilities 18 | var browser = { 19 | addEventListener: !!window.addEventListener, 20 | touch: ('ontouchstart' in window) || window.DocumentTouch && document instanceof DocumentTouch, 21 | transitions: (function(temp) { 22 | var props = ['transitionProperty', 'WebkitTransition', 'MozTransition', 'OTransition', 'msTransition']; 23 | for ( var i in props ) if (temp.style[ props[i] ] !== undefined) return true; 24 | return false; 25 | })(document.createElement('swipe')) 26 | }; 27 | 28 | // quit if no root element 29 | if (!container) return; 30 | var element = container.children[0]; 31 | var slides, slidePos, width, length; 32 | options = options || {}; 33 | var index = parseInt(options.startSlide, 10) || 0; 34 | var speed = options.speed || 300; 35 | options.continuous = options.continuous !== undefined ? options.continuous : true; 36 | 37 | function setup() { 38 | 39 | // cache slides 40 | slides = element.children; 41 | length = slides.length; 42 | 43 | // set continuous to false if only one slide 44 | if (slides.length < 2) options.continuous = false; 45 | 46 | //special case if two slides 47 | if (browser.transitions && options.continuous && slides.length < 3) { 48 | element.appendChild(slides[0].cloneNode(true)); 49 | element.appendChild(element.children[1].cloneNode(true)); 50 | slides = element.children; 51 | } 52 | 53 | // create an array to store current positions of each slide 54 | slidePos = new Array(slides.length); 55 | 56 | // determine width of each slide 57 | //alert(container.offsetWidth); 58 | width = container.getBoundingClientRect().width || container.offsetWidth; 59 | //alert(width); 60 | //width=document.documentElement.clientWidth; 61 | 62 | element.style.width = (slides.length * width) + 'px'; 63 | 64 | // stack elements 65 | var pos = slides.length; 66 | while(pos--) { 67 | 68 | var slide = slides[pos]; 69 | 70 | slide.style.width = width + 'px'; 71 | slide.setAttribute('data-index', pos); 72 | 73 | if (browser.transitions) { 74 | slide.style.left = (pos * -width) + 'px'; 75 | move(pos, index > pos ? -width : (index < pos ? width : 0), 0); 76 | } 77 | 78 | } 79 | 80 | // reposition elements before and after index 81 | if (options.continuous && browser.transitions) { 82 | move(circle(index-1), -width, 0); 83 | move(circle(index+1), width, 0); 84 | } 85 | 86 | if (!browser.transitions) element.style.left = (index * -width) + 'px'; 87 | 88 | container.style.visibility = 'visible'; 89 | 90 | } 91 | 92 | function prev() { 93 | 94 | if (options.continuous) slide(index-1); 95 | else if (index) slide(index-1); 96 | 97 | } 98 | 99 | function next() { 100 | 101 | if (options.continuous) slide(index+1); 102 | else if (index < slides.length - 1) slide(index+1); 103 | 104 | } 105 | 106 | function circle(index) { 107 | 108 | // a simple positive modulo using slides.length 109 | return (slides.length + (index % slides.length)) % slides.length; 110 | 111 | } 112 | 113 | function slide(to, slideSpeed) { 114 | 115 | // do nothing if already on requested slide 116 | if (index == to) return; 117 | 118 | if (browser.transitions) { 119 | 120 | var direction = Math.abs(index-to) / (index-to); // 1: backward, -1: forward 121 | 122 | // get the actual position of the slide 123 | if (options.continuous) { 124 | var natural_direction = direction; 125 | direction = -slidePos[circle(to)] / width; 126 | 127 | // if going forward but to < index, use to = slides.length + to 128 | // if going backward but to > index, use to = -slides.length + to 129 | if (direction !== natural_direction) to = -direction * slides.length + to; 130 | 131 | } 132 | 133 | var diff = Math.abs(index-to) - 1; 134 | 135 | // move all the slides between index and to in the right direction 136 | while (diff--) move( circle((to > index ? to : index) - diff - 1), width * direction, 0); 137 | 138 | to = circle(to); 139 | 140 | move(index, width * direction, slideSpeed || speed); 141 | move(to, 0, slideSpeed || speed); 142 | 143 | if (options.continuous) move(circle(to - direction), -(width * direction), 0); // we need to get the next in place 144 | 145 | } else { 146 | 147 | to = circle(to); 148 | animate(index * -width, to * -width, slideSpeed || speed); 149 | //no fallback for a circular continuous if the browser does not accept transitions 150 | } 151 | 152 | index = to; 153 | offloadFn(options.callback && options.callback(index, slides[index])); 154 | } 155 | 156 | function move(index, dist, speed) { 157 | 158 | translate(index, dist, speed); 159 | slidePos[index] = dist; 160 | 161 | } 162 | 163 | function translate(index, dist, speed) { 164 | 165 | var slide = slides[index]; 166 | var style = slide && slide.style; 167 | 168 | if (!style) return; 169 | 170 | style.webkitTransitionDuration = 171 | style.MozTransitionDuration = 172 | style.msTransitionDuration = 173 | style.OTransitionDuration = 174 | style.transitionDuration = speed + 'ms'; 175 | 176 | style.webkitTransform = 'translate(' + dist + 'px,0)' + 'translateZ(0)'; 177 | style.msTransform = 178 | style.MozTransform = 179 | style.OTransform = 'translateX(' + dist + 'px)'; 180 | 181 | } 182 | 183 | function animate(from, to, speed) { 184 | 185 | // if not an animation, just reposition 186 | if (!speed) { 187 | 188 | element.style.left = to + 'px'; 189 | return; 190 | 191 | } 192 | 193 | var start = +new Date; 194 | 195 | var timer = setInterval(function() { 196 | 197 | var timeElap = +new Date - start; 198 | 199 | if (timeElap > speed) { 200 | 201 | element.style.left = to + 'px'; 202 | 203 | if (delay) begin(); 204 | 205 | options.transitionEnd && options.transitionEnd.call(event, index, slides[index]); 206 | 207 | clearInterval(timer); 208 | return; 209 | 210 | } 211 | 212 | element.style.left = (( (to - from) * (Math.floor((timeElap / speed) * 100) / 100) ) + from) + 'px'; 213 | 214 | }, 4); 215 | 216 | } 217 | 218 | // setup auto slideshow 219 | var delay = options.auto || 0; 220 | var interval; 221 | 222 | function begin() { 223 | 224 | interval = setTimeout(next, delay); 225 | 226 | } 227 | 228 | function stop() { 229 | 230 | delay = 0; 231 | clearTimeout(interval); 232 | 233 | } 234 | 235 | 236 | // setup initial vars 237 | var start = {}; 238 | var delta = {}; 239 | var isScrolling; 240 | 241 | // setup event capturing 242 | var events = { 243 | 244 | handleEvent: function(event) { 245 | 246 | switch (event.type) { 247 | case 'touchstart': this.start(event); break; 248 | case 'touchmove': this.move(event); break; 249 | case 'touchend': offloadFn(this.end(event)); break; 250 | case 'webkitTransitionEnd': 251 | case 'msTransitionEnd': 252 | case 'oTransitionEnd': 253 | case 'otransitionend': 254 | case 'transitionend': offloadFn(this.transitionEnd(event)); break; 255 | case 'resize': offloadFn(setup); break; 256 | } 257 | 258 | if (options.stopPropagation) event.stopPropagation(); 259 | 260 | }, 261 | start: function(event) { 262 | 263 | var touches = event.touches[0]; 264 | 265 | // measure start values 266 | start = { 267 | 268 | // get initial touch coords 269 | x: touches.pageX, 270 | y: touches.pageY, 271 | 272 | // store time to determine touch duration 273 | time: +new Date 274 | 275 | }; 276 | 277 | // used for testing first move event 278 | isScrolling = undefined; 279 | 280 | // reset delta and end measurements 281 | delta = {}; 282 | 283 | // attach touchmove and touchend listeners 284 | element.addEventListener('touchmove', this, false); 285 | element.addEventListener('touchend', this, false); 286 | 287 | }, 288 | move: function(event) { 289 | 290 | // ensure swiping with one touch and not pinching 291 | if ( event.touches.length > 1 || event.scale && event.scale !== 1) return 292 | 293 | if (options.disableScroll) event.preventDefault(); 294 | 295 | var touches = event.touches[0]; 296 | 297 | // measure change in x and y 298 | delta = { 299 | x: touches.pageX - start.x, 300 | y: touches.pageY - start.y 301 | } 302 | 303 | // determine if scrolling test has run - one time test 304 | if ( typeof isScrolling == 'undefined') { 305 | isScrolling = !!( isScrolling || Math.abs(delta.x) < Math.abs(delta.y) ); 306 | } 307 | 308 | // if user is not trying to scroll vertically 309 | if (!isScrolling) { 310 | 311 | // prevent native scrolling 312 | event.preventDefault(); 313 | 314 | // stop slideshow 315 | stop(); 316 | 317 | // increase resistance if first or last slide 318 | if (options.continuous) { // we don't add resistance at the end 319 | 320 | translate(circle(index-1), delta.x + slidePos[circle(index-1)], 0); 321 | translate(index, delta.x + slidePos[index], 0); 322 | translate(circle(index+1), delta.x + slidePos[circle(index+1)], 0); 323 | 324 | } else { 325 | 326 | delta.x = 327 | delta.x / 328 | ( (!index && delta.x > 0 // if first slide and sliding left 329 | || index == slides.length - 1 // or if last slide and sliding right 330 | && delta.x < 0 // and if sliding at all 331 | ) ? 332 | ( Math.abs(delta.x) / width + 1 ) // determine resistance level 333 | : 1 ); // no resistance if false 334 | 335 | // translate 1:1 336 | translate(index-1, delta.x + slidePos[index-1], 0); 337 | translate(index, delta.x + slidePos[index], 0); 338 | translate(index+1, delta.x + slidePos[index+1], 0); 339 | } 340 | 341 | } 342 | 343 | }, 344 | end: function(event) { 345 | 346 | // measure duration 347 | var duration = +new Date - start.time; 348 | 349 | // determine if slide attempt triggers next/prev slide 350 | var isValidSlide = 351 | Number(duration) < 250 // if slide duration is less than 250ms 352 | && Math.abs(delta.x) > 20 // and if slide amt is greater than 20px 353 | || Math.abs(delta.x) > width/2; // or if slide amt is greater than half the width 354 | 355 | // determine if slide attempt is past start and end 356 | var isPastBounds = 357 | !index && delta.x > 0 // if first slide and slide amt is greater than 0 358 | || index == slides.length - 1 && delta.x < 0; // or if last slide and slide amt is less than 0 359 | 360 | if (options.continuous) isPastBounds = false; 361 | 362 | // determine direction of swipe (true:right, false:left) 363 | var direction = delta.x < 0; 364 | 365 | // if not scrolling vertically 366 | if (!isScrolling) { 367 | 368 | if (isValidSlide && !isPastBounds) { 369 | 370 | if (direction) { 371 | 372 | if (options.continuous) { // we need to get the next in this direction in place 373 | 374 | move(circle(index-1), -width, 0); 375 | move(circle(index+2), width, 0); 376 | 377 | } else { 378 | move(index-1, -width, 0); 379 | } 380 | 381 | move(index, slidePos[index]-width, speed); 382 | move(circle(index+1), slidePos[circle(index+1)]-width, speed); 383 | index = circle(index+1); 384 | 385 | } else { 386 | if (options.continuous) { // we need to get the next in this direction in place 387 | 388 | move(circle(index+1), width, 0); 389 | move(circle(index-2), -width, 0); 390 | 391 | } else { 392 | move(index+1, width, 0); 393 | } 394 | 395 | move(index, slidePos[index]+width, speed); 396 | move(circle(index-1), slidePos[circle(index-1)]+width, speed); 397 | index = circle(index-1); 398 | 399 | } 400 | 401 | options.callback && options.callback(index, slides[index]); 402 | 403 | } else { 404 | 405 | if (options.continuous) { 406 | 407 | move(circle(index-1), -width, speed); 408 | move(index, 0, speed); 409 | move(circle(index+1), width, speed); 410 | 411 | } else { 412 | 413 | move(index-1, -width, speed); 414 | move(index, 0, speed); 415 | move(index+1, width, speed); 416 | } 417 | 418 | } 419 | 420 | } 421 | 422 | // kill touchmove and touchend event listeners until touchstart called again 423 | element.removeEventListener('touchmove', events, false) 424 | element.removeEventListener('touchend', events, false) 425 | 426 | }, 427 | transitionEnd: function(event) { 428 | 429 | if (parseInt(event.target.getAttribute('data-index'), 10) == index) { 430 | 431 | if (delay) begin(); 432 | 433 | options.transitionEnd && options.transitionEnd.call(event, index, slides[index]); 434 | 435 | } 436 | 437 | } 438 | 439 | } 440 | 441 | // trigger setup 442 | setup(); 443 | 444 | // start auto slideshow if applicable 445 | if (delay) begin(); 446 | 447 | 448 | // add event listeners 449 | if (browser.addEventListener) { 450 | 451 | // set touchstart event on element 452 | if (browser.touch) element.addEventListener('touchstart', events, false); 453 | 454 | if (browser.transitions) { 455 | element.addEventListener('webkitTransitionEnd', events, false); 456 | element.addEventListener('msTransitionEnd', events, false); 457 | element.addEventListener('oTransitionEnd', events, false); 458 | element.addEventListener('otransitionend', events, false); 459 | element.addEventListener('transitionend', events, false); 460 | } 461 | 462 | // set resize event on window 463 | window.addEventListener('resize', events, false); 464 | 465 | } else { 466 | 467 | window.onresize = function () { setup() }; // to play nice with old IE 468 | 469 | } 470 | 471 | // expose the Swipe API 472 | return { 473 | setup: function() { 474 | 475 | setup(); 476 | 477 | }, 478 | slide: function(to, speed) { 479 | 480 | // cancel slideshow 481 | stop(); 482 | 483 | slide(to, speed); 484 | 485 | }, 486 | prev: function() { 487 | 488 | // cancel slideshow 489 | stop(); 490 | 491 | prev(); 492 | 493 | }, 494 | next: function() { 495 | 496 | // cancel slideshow 497 | stop(); 498 | 499 | next(); 500 | 501 | }, 502 | stop: function() { 503 | 504 | // cancel slideshow 505 | stop(); 506 | 507 | }, 508 | getPos: function() { 509 | 510 | // return current index position 511 | return index; 512 | 513 | }, 514 | getNumSlides: function() { 515 | 516 | // return total number of slides 517 | return length; 518 | }, 519 | kill: function() { 520 | 521 | // cancel slideshow 522 | stop(); 523 | 524 | // reset element 525 | element.style.width = ''; 526 | element.style.left = ''; 527 | 528 | // reset slides 529 | var pos = slides.length; 530 | while(pos--) { 531 | 532 | var slide = slides[pos]; 533 | slide.style.width = ''; 534 | slide.style.left = ''; 535 | 536 | if (browser.transitions) translate(pos, 0, 0); 537 | 538 | } 539 | 540 | // removed event listeners 541 | if (browser.addEventListener) { 542 | 543 | // remove current event listeners 544 | element.removeEventListener('touchstart', events, false); 545 | element.removeEventListener('webkitTransitionEnd', events, false); 546 | element.removeEventListener('msTransitionEnd', events, false); 547 | element.removeEventListener('oTransitionEnd', events, false); 548 | element.removeEventListener('otransitionend', events, false); 549 | element.removeEventListener('transitionend', events, false); 550 | window.removeEventListener('resize', events, false); 551 | 552 | } 553 | else { 554 | 555 | window.onresize = null; 556 | 557 | } 558 | 559 | } 560 | } 561 | 562 | } 563 | 564 | 565 | if ( window.jQuery || window.Zepto ) { 566 | (function($) { 567 | $.fn.Swipe = function(params) { 568 | return this.each(function() { 569 | $(this).data('Swipe', new Swipe($(this)[0], params)); 570 | }); 571 | } 572 | })( window.jQuery || window.Zepto ) 573 | } 574 | -------------------------------------------------------------------------------- /webpack.config.js: -------------------------------------------------------------------------------- 1 | // webpack.config.js 2 | var path = require("path"); 3 | var webpack = require('webpack'); 4 | var ExtractTextPlugin = require("extract-text-webpack-plugin"); 5 | 6 | module.exports = { 7 | entry: { 8 | bundle:['./src/index.js'], 9 | }, 10 | output: { 11 | path: path.join(__dirname, 'build'), 12 | publicPath: "/build/", 13 | filename: '[name].js' 14 | }, 15 | // 新添加的module属性 16 | module: { 17 | loaders: [ 18 | { test: /\.jsx$/, exclude: /node_modules/, loader: 'jsx-loader!babel-loader' }, 19 | { test: /\.js$/, exclude:/node_modules/, loader: 'babel-loader'}, 20 | {test: /\.(jpg|png)$/, loader: "url?limit=8192"}, 21 | {test: /\.css$/, loader: "style-loader!css-loader"}, // 把多个css压缩到一个css中。 22 | {test: /\.scss$/, loader: 'style!css!sass'} 23 | ] 24 | }, 25 | babel: { 26 | presets: ["es2015", "react", "stage-2"] 27 | }, 28 | devServer: { inline: true }, 29 | plugins: [ 30 | new webpack.optimize.CommonsChunkPlugin('common.js'), 31 | new ExtractTextPlugin("[name].css"), 32 | new webpack.HotModuleReplacementPlugin() 33 | ] 34 | }; --------------------------------------------------------------------------------