├── README.md └── wxapp-mi-mall ├── app.js ├── app.json ├── app.wxss ├── assets ├── icons │ ├── add.png │ ├── addr.png │ ├── avatar.jpg │ ├── cart.png │ ├── cart_active.png │ ├── cart_empty.png │ ├── category.png │ ├── category_active.png │ ├── coupon.png │ ├── discovery.png │ ├── discovery_active.png │ ├── fcode.png │ ├── home.png │ ├── home_active.png │ ├── mine.png │ ├── mine_active.png │ ├── minus.png │ ├── order.png │ ├── qrcode.png │ ├── search.png │ ├── setting.png │ └── success.png └── nav_img │ ├── computer.png │ ├── news.png │ ├── phone.png │ ├── router.png │ └── tv.png ├── lib └── weui.wxss ├── modules ├── showDetail.js └── showcDetail.js ├── pages ├── addr │ ├── addr.js │ ├── addr.json │ ├── addr.wxml │ └── addr.wxss ├── cart │ ├── cart.js │ ├── cart.json │ ├── cart.wxml │ └── cart.wxss ├── categories │ ├── categories.js │ ├── categories.json │ ├── categories.wxml │ └── categories.wxss ├── channel │ ├── computer │ │ ├── computer.js │ │ ├── computer.json │ │ ├── computer.wxml │ │ └── computer.wxss │ ├── phone │ │ ├── phone.js │ │ ├── phone.json │ │ ├── phone.wxml │ │ └── phone.wxss │ └── tv │ │ ├── tv.js │ │ ├── tv.json │ │ ├── tv.wxml │ │ └── tv.wxss ├── discovery │ ├── discovery.js │ ├── discovery.json │ ├── discovery.wxml │ └── discovery.wxss ├── goods │ ├── show.js │ ├── show.json │ ├── show.wxml │ └── show.wxss ├── index │ ├── index.js │ ├── index.wxml │ └── index.wxss ├── logs │ ├── logs.js │ ├── logs.json │ ├── logs.wxml │ └── logs.wxss ├── mine │ ├── mine.js │ ├── mine.json │ ├── mine.wxml │ └── mine.wxss ├── search │ ├── search.js │ ├── search.json │ ├── search.wxml │ └── search.wxss └── selectGoods │ ├── selectGoods.js │ ├── selectGoods.json │ ├── selectGoods.wxml │ └── selectGoods.wxss ├── project.config.json ├── templates ├── cover │ ├── cover.wxml │ └── cover.wxss ├── goods_list │ ├── goods_list.wxml │ └── goods_list.wxss └── slide │ ├── slide.wxml │ └── slide.wxss └── utils ├── mock.js └── util.js /README.md: -------------------------------------------------------------------------------- 1 | # wxapp-mi-mall 2 | 仿小米商城小程序 3 | 4 | ## 踩坑记 5 | - 注意`wx.navigateTo`和`wx.switchTab`的区别 6 | - 在做分类页时，用到了`scroll-view`，但是随着页面内容的增多，滚动页面时，左边导航栏和右边分类内容都会滚动，这时设置整个页面和最外层`view`的样式为： 7 | ```css 8 | page,.container{ 9 | height:100vh; 10 | } 11 | ``` 12 | 即设置整个页面为一屏的高度。 13 | - 内容超过一屏时，`scroll-view`产生滚动条，嗯，这严重影响美观，通过以下样式隐藏： 14 | ```css 15 | ::-webkit-scrollbar{ 16 | height: 0; 17 | width: 0; 18 | color: transparent; 19 | } 20 | ``` 21 | - `scroll-view`的值应为它的子元素的`id`值，但是这个id**不能以数字开头**，否则会报错：`id属性格式错误，如不能包含数字`（还是要仔细看看开发手册::>_<::） -------------------------------------------------------------------------------- /wxapp-mi-mall/app.js: -------------------------------------------------------------------------------- 1 | import mock from "./utils/mock"; 2 | 3 | //app.js 4 | App({ 5 | onLaunch: function () { 6 | Object.assign(this.globalData,mock) 7 | // console.log(this.globalData); 8 | }, 9 | globalData: { 10 | userInfo: null 11 | } 12 | }) -------------------------------------------------------------------------------- /wxapp-mi-mall/app.json: -------------------------------------------------------------------------------- 1 | { 2 | "pages": [ 3 | "pages/index/index", 4 | "pages/logs/logs", 5 | "pages/categories/categories", 6 | "pages/discovery/discovery", 7 | "pages/search/search", 8 | "pages/cart/cart", 9 | "pages/mine/mine", 10 | "pages/channel/phone/phone", 11 | "pages/channel/tv/tv", 12 | "pages/channel/computer/computer", 13 | "pages/goods/show", 14 | "pages/selectGoods/selectGoods", 15 | "pages/addr/addr" 16 | ], 17 | "window": { 18 | "backgroundTextStyle": "light", 19 | "navigationBarBackgroundColor": "#ff6700", 20 | "navigationBarTitleText": "小米商城", 21 | "navigationBarTextStyle": "white" 22 | }, 23 | "tabBar": { 24 | "selectedColor": "#ff6700", 25 | "borderStyle": "white", 26 | "backgroundColor": "#fff", 27 | "list": [ 28 | { 29 | "text": "首页", 30 | "pagePath": "pages/index/index", 31 | "iconPath": "assets/icons/home.png", 32 | "selectedIconPath": "assets/icons/home_active.png" 33 | }, 34 | { 35 | "text": "分类", 36 | "pagePath": "pages/categories/categories", 37 | "iconPath": "assets/icons/category.png", 38 | "selectedIconPath": "assets/icons/category_active.png" 39 | }, 40 | { 41 | "text": "发现", 42 | "pagePath": "pages/discovery/discovery", 43 | "iconPath": "assets/icons/discovery.png", 44 | "selectedIconPath": "assets/icons/discovery_active.png" 45 | }, 46 | { 47 | "text": "购物车", 48 | "pagePath": "pages/cart/cart", 49 | "iconPath": "assets/icons/cart.png", 50 | "selectedIconPath": "assets/icons/cart_active.png" 51 | }, 52 | { 53 | "text": "我的", 54 | "pagePath": "pages/mine/mine", 55 | "iconPath": "assets/icons/mine.png", 56 | "selectedIconPath": "assets/icons/mine_active.png" 57 | } 58 | ] 59 | } 60 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/app.wxss: -------------------------------------------------------------------------------- 1 | /**app.wxss**/ 2 | @import "./lib/weui.wxss"; 3 | 4 | page{ 5 | background: #ebebeb; 6 | -webkit-font-smoothing: antialiased; 7 | box-sizing: border-box; 8 | } 9 | .container { 10 | display: flex; 11 | flex-direction: column; 12 | height: 100%; 13 | width: 100%; 14 | box-sizing: border-box; 15 | } 16 | /*隐藏滚动条*/ 17 | ::-webkit-scrollbar{ 18 | height: 0; 19 | width: 0; 20 | color: transparent; 21 | } 22 | -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/add.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/add.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/addr.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/addr.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/avatar.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/avatar.jpg -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/cart.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/cart.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/cart_active.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/cart_active.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/cart_empty.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/cart_empty.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/category.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/category.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/category_active.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/category_active.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/coupon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/coupon.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/discovery.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/discovery.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/discovery_active.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/discovery_active.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/fcode.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/fcode.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/home.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/home.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/home_active.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/home_active.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/mine.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/mine.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/mine_active.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/mine_active.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/minus.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/minus.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/order.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/order.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/qrcode.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/qrcode.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/search.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/search.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/setting.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/setting.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/icons/success.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/icons/success.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/nav_img/computer.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/nav_img/computer.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/nav_img/news.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/nav_img/news.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/nav_img/phone.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/nav_img/phone.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/nav_img/router.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/nav_img/router.png -------------------------------------------------------------------------------- /wxapp-mi-mall/assets/nav_img/tv.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/JoeWrights/wxapp-mi-mall/9bf3c5c2071ef33b983a577b99527a930c6ea603/wxapp-mi-mall/assets/nav_img/tv.png -------------------------------------------------------------------------------- /wxapp-mi-mall/lib/weui.wxss: -------------------------------------------------------------------------------- 1 | /*! 2 | * WeUI v1.1.1 (https://github.com/weui/weui-wxss) 3 | * Copyright 2017 Tencent, Inc. 4 | * Licensed under the MIT license 5 | */ 6 | page{line-height:1.6;font-family:-apple-system-font,Helvetica Neue,sans-serif}icon{vertical-align:middle}.weui-cells{position:relative;margin-top:1.17647059em;background-color:#fff;line-height:1.41176471;font-size:17px}.weui-cells:before{top:0;border-top:1rpx solid #d9d9d9}.weui-cells:after,.weui-cells:before{content:" ";position:absolute;left:0;right:0;height:1px;color:#d9d9d9}.weui-cells:after{bottom:0;border-bottom:1rpx solid #d9d9d9}.weui-cells__title{margin-top:.77em;margin-bottom:.3em;padding-left:15px;padding-right:15px;color:#999;font-size:14px}.weui-cells_after-title{margin-top:0}.weui-cells__tips{margin-top:.3em;color:#999;padding-left:15px;padding-right:15px;font-size:14px}.weui-cell{padding:10px 15px;position:relative;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.weui-cell:before{content:" ";position:absolute;left:0;top:0;right:0;height:1px;border-top:1rpx solid #d9d9d9;color:#d9d9d9;left:15px}.weui-cell:first-child:before{display:none}.weui-cell_active{background-color:#ececec}.weui-cell_primary{-webkit-box-align:start;-webkit-align-items:flex-start;align-items:flex-start}.weui-cell__bd{-webkit-box-flex:1;-webkit-flex:1;flex:1}.weui-cell__ft{text-align:right;color:#999}.weui-cell_access{color:inherit}.weui-cell__ft_in-access{padding-right:13px;position:relative}.weui-cell__ft_in-access:after{content:" ";display:inline-block;height:6px;width:6px;border-width:2px 2px 0 0;border-color:#c8c8cd;border-style:solid;-webkit-transform:matrix(.71,.71,-.71,.71,0,0);transform:matrix(.71,.71,-.71,.71,0,0);position:relative;top:-2px;position:absolute;top:50%;margin-top:-4px;right:2px}.weui-cell_link{color:#586c94;font-size:14px}.weui-cell_link:active{background-color:#ececec}.weui-cell_link:first-child:before{display:block}.weui-icon-radio{margin-left:3.2px;margin-right:3.2px}.weui-icon-checkbox_circle,.weui-icon-checkbox_success{margin-left:4.6px;margin-right:4.6px}.weui-check__label:active{background-color:#ececec}.weui-check{position:absolute;left:-9999px}.weui-check__hd_in-checkbox{padding-right:.35em}.weui-cell__ft_in-radio{padding-left:.35em}.weui-cell_input{padding-top:0;padding-bottom:0}.weui-label{width:105px;word-wrap:break-word;word-break:break-all}.weui-input{height:2.58823529em;min-height:2.58823529em;line-height:2.58823529em}.weui-toptips{position:fixed;-webkit-transform:translateZ(0);transform:translateZ(0);top:0;left:0;right:0;padding:5px;font-size:14px;text-align:center;color:#fff;z-index:5000;word-wrap:break-word;word-break:break-all}.weui-toptips_warn{background-color:#e64340}.weui-textarea{display:block;width:100%}.weui-textarea-counter{color:#b2b2b2;text-align:right}.weui-cell_warn,.weui-textarea-counter_warn{color:#e64340}.weui-form-preview{position:relative;background-color:#fff}.weui-form-preview:before{top:0;border-top:1rpx solid #d9d9d9}.weui-form-preview:after,.weui-form-preview:before{content:" ";position:absolute;left:0;right:0;height:1px;color:#d9d9d9}.weui-form-preview:after{bottom:0;border-bottom:1rpx solid #d9d9d9}.weui-form-preview__value{font-size:14px}.weui-form-preview__value_in-hd{font-size:26px}.weui-form-preview__hd{position:relative;padding:10px 15px;text-align:right;line-height:2.5em}.weui-form-preview__hd:after{content:" ";position:absolute;left:0;bottom:0;right:0;height:1px;border-bottom:1rpx solid #d9d9d9;color:#d9d9d9;left:15px}.weui-form-preview__bd{padding:10px 15px;font-size:.9em;text-align:right;color:#999;line-height:2}.weui-form-preview__ft{position:relative;line-height:50px;display:-webkit-box;display:-webkit-flex;display:flex}.weui-form-preview__ft:after{content:" ";position:absolute;left:0;top:0;right:0;height:1px;border-top:1rpx solid #d5d5d6;color:#d5d5d6}.weui-form-preview__item{overflow:hidden}.weui-form-preview__label{float:left;margin-right:1em;min-width:4em;color:#999;text-align:justify;text-align-last:justify}.weui-form-preview__value{display:block;overflow:hidden;word-break:normal;word-wrap:break-word}.weui-form-preview__btn{position:relative;display:block;-webkit-box-flex:1;-webkit-flex:1;flex:1;color:#3cc51f;text-align:center}.weui-form-preview__btn:after{content:" ";position:absolute;left:0;top:0;width:1px;bottom:0;border-left:1rpx solid #d5d5d6;color:#d5d5d6}.weui-form-preview__btn:first-child:after{display:none}.weui-form-preview__btn_active{background-color:#eee}.weui-form-preview__btn_default{color:#999}.weui-form-preview__btn_primary{color:#0bb20c}.weui-cell_select{padding:0}.weui-select{position:relative;padding-left:15px;padding-right:30px;height:2.58823529em;min-height:2.58823529em;line-height:2.58823529em;border-right:1rpx solid #d9d9d9}.weui-select:before{content:" ";display:inline-block;height:6px;width:6px;border-width:2px 2px 0 0;border-color:#c8c8cd;border-style:solid;-webkit-transform:matrix(.71,.71,-.71,.71,0,0);transform:matrix(.71,.71,-.71,.71,0,0);position:relative;top:-2px;position:absolute;top:50%;right:15px;margin-top:-4px}.weui-select_in-select-after{padding-left:0}.weui-cell__bd_in-select-before,.weui-cell__hd_in-select-after{padding-left:15px}.weui-cell_vcode{padding-right:0}.weui-vcode-btn,.weui-vcode-img{margin-left:5px;height:2.58823529em;vertical-align:middle}.weui-vcode-btn{display:inline-block;padding:0 .6em 0 .7em;border-left:1px solid #e5e5e5;line-height:2.58823529em;font-size:17px;color:#3cc51f;white-space:nowrap}.weui-vcode-btn:active{color:#52a341}.weui-cell_switch{padding-top:6px;padding-bottom:6px}.weui-uploader__hd{display:-webkit-box;display:-webkit-flex;display:flex;padding-bottom:10px;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.weui-uploader__title{-webkit-box-flex:1;-webkit-flex:1;flex:1}.weui-uploader__info{color:#b2b2b2}.weui-uploader__bd{margin-bottom:-4px;margin-right:-9px;overflow:hidden}.weui-uploader__file{float:left;margin-right:9px;margin-bottom:9px}.weui-uploader__img{display:block;width:79px;height:79px}.weui-uploader__file_status{position:relative}.weui-uploader__file_status:before{content:" ";position:absolute;top:0;right:0;bottom:0;left:0;background-color:rgba(0,0,0,.5)}.weui-uploader__file-content{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);color:#fff}.weui-uploader__input-box{float:left;position:relative;margin-right:9px;margin-bottom:9px;width:77px;height:77px;border:1px solid #d9d9d9}.weui-uploader__input-box:after,.weui-uploader__input-box:before{content:" ";position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);background-color:#d9d9d9}.weui-uploader__input-box:before{width:2px;height:39.5px}.weui-uploader__input-box:after{width:39.5px;height:2px}.weui-uploader__input-box:active{border-color:#999}.weui-uploader__input-box:active:after,.weui-uploader__input-box:active:before{background-color:#999}.weui-uploader__input{position:absolute;z-index:1;top:0;left:0;width:100%;height:100%;opacity:0}.weui-article{padding:20px 15px;font-size:15px}.weui-article__section{margin-bottom:1.5em}.weui-article__h1{font-size:18px;font-weight:400;margin-bottom:.9em}.weui-article__h2{font-size:16px;font-weight:400;margin-bottom:.34em}.weui-article__h3{font-weight:400;font-size:15px;margin-bottom:.34em}.weui-article__p{margin:0 0 .8em}.weui-msg{padding-top:36px;text-align:center}.weui-msg__link{display:inline;color:#586c94}.weui-msg__icon-area{margin-bottom:30px}.weui-msg__text-area{margin-bottom:25px;padding:0 20px}.weui-msg__title{margin-bottom:5px;font-weight:400;font-size:20px}.weui-msg__desc{font-size:14px;color:#999}.weui-msg__opr-area{margin-bottom:25px}.weui-msg__extra-area{margin-bottom:15px;font-size:14px;color:#999}@media screen and (min-height:438px){.weui-msg__extra-area{position:fixed;left:0;bottom:0;width:100%;text-align:center}}.weui-flex{display:-webkit-box;display:-webkit-flex;display:flex}.weui-flex__item{-webkit-box-flex:1;-webkit-flex:1;flex:1}.weui-btn{margin-top:15px}.weui-btn:first-child{margin-top:0}.weui-btn-area{margin:1.17647059em 15px .3em}.weui-agree{display:block;padding:.5em 15px;font-size:13px}.weui-agree__text{color:#999}.weui-agree__link{display:inline;color:#586c94}.weui-agree__checkbox{position:absolute;left:-9999px}.weui-agree__checkbox-icon{position:relative;top:2px;display:inline-block;border:1px solid #d1d1d1;background-color:#fff;border-radius:3px;width:11px;height:11px}.weui-agree__checkbox-icon-check{position:absolute;top:1px;left:1px}.weui-footer{color:#999;font-size:14px;text-align:center}.weui-footer_fixed-bottom{position:fixed;bottom:.52em;left:0;right:0}.weui-footer__links{font-size:0}.weui-footer__link{display:inline-block;vertical-align:top;margin:0 .62em;position:relative;font-size:14px;color:#586c94}.weui-footer__link:before{content:" ";position:absolute;left:0;top:0;width:1px;bottom:0;border-left:1rpx solid #c7c7c7;color:#c7c7c7;left:-.65em;top:.36em;bottom:.36em}.weui-footer__link:first-child:before{display:none}.weui-footer__text{padding:0 .34em;font-size:12px}.weui-grids{border-top:1rpx solid #d9d9d9;border-left:1rpx solid #d9d9d9;overflow:hidden}.weui-grid{position:relative;float:left;padding:20px 10px;width:33.33333333%;box-sizing:border-box;border-right:1rpx solid #d9d9d9;border-bottom:1rpx solid #d9d9d9}.weui-grid_active{background-color:#ececec}.weui-grid__icon{display:block;width:28px;height:28px;margin:0 auto}.weui-grid__label{margin-top:5px;display:block;text-align:center;color:#000;font-size:14px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.weui-loading{margin:0 5px;width:20px;height:20px;display:inline-block;vertical-align:middle;-webkit-animation:a 1s steps(12) infinite;animation:a 1s steps(12) infinite;background:transparent url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjAiIGhlaWdodD0iMTIwIiB2aWV3Qm94PSIwIDAgMTAwIDEwMCI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTTAgMGgxMDB2MTAwSDB6Ii8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjRTlFOUU5IiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgLTMwKSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iIzk4OTY5NyIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgzMCAxMDUuOTggNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjOUI5OTlBIiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKDYwIDc1Ljk4IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0EzQTFBMiIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSg5MCA2NSA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNBQkE5QUEiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoMTIwIDU4LjY2IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0IyQjJCMiIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgxNTAgNTQuMDIgNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjQkFCOEI5IiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKDE4MCA1MCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNDMkMwQzEiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTE1MCA0NS45OCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNDQkNCQ0IiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTEyMCA0MS4zNCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNEMkQyRDIiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTkwIDM1IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0RBREFEQSIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgtNjAgMjQuMDIgNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjRTJFMkUyIiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKC0zMCAtNS45OCA2NSkiLz48L3N2Zz4=) no-repeat;background-size:100%}.weui-loading.weui-loading_transparent{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 100 100'%3E%3Cpath fill='none' d='M0 0h100v100H0z'/%3E%3Crect xmlns='http://www.w3.org/2000/svg' width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.56)' rx='5' ry='5' transform='translate(0 -30)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.5)' rx='5' ry='5' transform='rotate(30 105.98 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.43)' rx='5' ry='5' transform='rotate(60 75.98 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.38)' rx='5' ry='5' transform='rotate(90 65 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.32)' rx='5' ry='5' transform='rotate(120 58.66 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.28)' rx='5' ry='5' transform='rotate(150 54.02 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.25)' rx='5' ry='5' transform='rotate(180 50 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.2)' rx='5' ry='5' transform='rotate(-150 45.98 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.17)' rx='5' ry='5' transform='rotate(-120 41.34 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.14)' rx='5' ry='5' transform='rotate(-90 35 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.1)' rx='5' ry='5' transform='rotate(-60 24.02 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.03)' rx='5' ry='5' transform='rotate(-30 -5.98 65)'/%3E%3C/svg%3E")}@-webkit-keyframes a{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes a{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.weui-badge{display:inline-block;padding:.15em .4em;min-width:8px;border-radius:18px;background-color:#e64340;color:#fff;line-height:1.2;text-align:center;font-size:12px;vertical-align:middle}.weui-badge_dot{padding:.4em;min-width:0}.weui-loadmore{width:65%;margin:1.5em auto;line-height:1.6em;font-size:14px;text-align:center}.weui-loadmore__tips{display:inline-block;vertical-align:middle}.weui-loadmore_line{border-top:1px solid #e5e5e5;margin-top:2.4em}.weui-loadmore__tips_in-line{position:relative;top:-.9em;padding:0 .55em;background-color:#fff;color:#999}.weui-loadmore__tips_in-dot{position:relative;padding:0 .16em;width:4px;height:1.6em}.weui-loadmore__tips_in-dot:before{content:" ";position:absolute;top:50%;left:50%;margin-top:-1px;margin-left:-2px;width:4px;height:4px;border-radius:50%;background-color:#e5e5e5}.weui-panel{background-color:#fff;margin-top:10px;position:relative;overflow:hidden}.weui-panel:first-child{margin-top:0}.weui-panel:before{top:0;border-top:1rpx solid #e5e5e5}.weui-panel:after,.weui-panel:before{content:" ";position:absolute;left:0;right:0;height:1px;color:#e5e5e5}.weui-panel:after{bottom:0;border-bottom:1rpx solid #e5e5e5}.weui-panel__hd{padding:14px 15px 10px;color:#999;font-size:13px;position:relative}.weui-panel__hd:after{content:" ";position:absolute;left:0;bottom:0;right:0;height:1px;border-bottom:1rpx solid #e5e5e5;color:#e5e5e5;left:15px}.weui-media-box{padding:15px;position:relative}.weui-media-box:before{content:" ";position:absolute;left:0;top:0;right:0;height:1px;border-top:1rpx solid #e5e5e5;color:#e5e5e5;left:15px}.weui-media-box:first-child:before{display:none}.weui-media-box__title{font-weight:400;font-size:17px;width:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;word-wrap:break-word;word-break:break-all}.weui-media-box__desc{color:#999;font-size:13px;line-height:1.2;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.weui-media-box__info{margin-top:15px;padding-bottom:5px;font-size:13px;color:#cecece;line-height:1em;list-style:none;overflow:hidden}.weui-media-box__info__meta{float:left;padding-right:1em}.weui-media-box__info__meta_extra{padding-left:1em;border-left:1px solid #cecece}.weui-media-box__title_in-text{margin-bottom:8px}.weui-media-box_appmsg{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.weui-media-box__thumb{width:100%;height:100%;vertical-align:top}.weui-media-box__hd_in-appmsg{margin-right:.8em;width:60px;height:60px;line-height:60px;text-align:center}.weui-media-box__bd_in-appmsg{-webkit-box-flex:1;-webkit-flex:1;flex:1;min-width:0}.weui-media-box_small-appmsg{padding:0}.weui-cells_in-small-appmsg{margin-top:0}.weui-cells_in-small-appmsg:before{display:none}.weui-progress{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.weui-progress__bar{-webkit-box-flex:1;-webkit-flex:1;flex:1}.weui-progress__opr{margin-left:15px;font-size:0}.weui-navbar{display:-webkit-box;display:-webkit-flex;display:flex;position:absolute;z-index:500;top:0;width:100%;border-bottom:1rpx solid #ccc}.weui-navbar__item{position:relative;display:block;-webkit-box-flex:1;-webkit-flex:1;flex:1;padding:13px 0;text-align:center;font-size:0}.weui-navbar__item.weui-bar__item_on{color:#1aad19}.weui-navbar__slider{position:absolute;content:" ";left:0;bottom:0;width:6em;height:3px;background-color:#1aad19;-webkit-transition:-webkit-transform .3s;transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s,-webkit-transform .3s}.weui-navbar__title{display:inline-block;font-size:15px;max-width:8em;width:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal}.weui-tab{position:relative;height:100%}.weui-tab__panel{box-sizing:border-box;height:100%;padding-top:50px;overflow:auto;-webkit-overflow-scrolling:touch}.weui-search-bar{position:relative;padding:8px 10px;display:-webkit-box;display:-webkit-flex;display:flex;box-sizing:border-box;background-color:#efeff4;border-top:1rpx solid #d7d6dc;border-bottom:1rpx solid #d7d6dc}.weui-icon-search{margin-right:8px;font-size:inherit}.weui-icon-search_in-box{position:absolute;left:10px;top:7px}.weui-search-bar__text{display:inline-block;font-size:14px;vertical-align:middle}.weui-search-bar__form{position:relative;-webkit-box-flex:1;-webkit-flex:auto;flex:auto;border-radius:5px;background:#fff;border:1rpx solid #e6e6ea}.weui-search-bar__box{position:relative;padding-left:30px;padding-right:30px;width:100%;box-sizing:border-box;z-index:1}.weui-search-bar__input{height:28px;line-height:28px;font-size:14px}.weui-icon-clear{position:absolute;top:0;right:0;padding:7px 8px;font-size:0}.weui-search-bar__label{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;border-radius:3px;text-align:center;color:#9b9b9b;background:#fff;line-height:28px}.weui-search-bar__cancel-btn{margin-left:10px;line-height:28px;color:#09bb07;white-space:nowrap} -------------------------------------------------------------------------------- /wxapp-mi-mall/modules/showDetail.js: -------------------------------------------------------------------------------- 1 | const showDetail=(e)=>{ 2 | const id=e.currentTarget.dataset.pid; 3 | console.log(id); 4 | wx.navigateTo({ 5 | url: `/pages/goods/show?id=${id}` 6 | }) 7 | }; 8 | export default showDetail; -------------------------------------------------------------------------------- /wxapp-mi-mall/modules/showcDetail.js: -------------------------------------------------------------------------------- 1 | const showcDetail=(e)=>{ 2 | const id=e.currentTarget.dataset.cid; 3 | console.log(id); 4 | wx.navigateTo({ 5 | url: `/pages/goods/show?id=${id}` 6 | }) 7 | }; 8 | export default showcDetail; -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/addr/addr.js: -------------------------------------------------------------------------------- 1 | // pages/address/address.js 2 | Page({ 3 | 4 | /** 5 | * 页面的初始数据 6 | */ 7 | data: { 8 | receiverName: "张三", 9 | mobile: "15770768970", 10 | addressDetail: "上海市奉贤区", 11 | postCode: "336600", 12 | isDisabled: false, 13 | isComplete: false, 14 | buttonTitle: "保存" 15 | }, 16 | formSubmit(e) { 17 | const addrInfo = e.detail.value; 18 | let {receiverName,mobile,addressDetail,postCode}=addrInfo; 19 | if(receiverName==""||mobile==""||addressDetail==""||postCode==""){ 20 | this.data.isComplete=false; 21 | wx.showModal({ 22 | title:"提示", 23 | content:"请完善信息", 24 | showCancel:false 25 | }); 26 | }else if(!/^[1][3,4,5,7,8]\d{9}$/.test(mobile)){ 27 | wx.showModal({ 28 | title:"提示", 29 | content:"手机号格式不规范", 30 | showCancel:false 31 | }); 32 | }else if(!/^[0-9]{6}$/.test(postCode)){ 33 | wx.showModal({ 34 | title:"提示", 35 | content:"邮政编码不规范", 36 | showCancel:false 37 | }); 38 | }else{ 39 | this.data.isComplete=true; 40 | wx.setStorageSync('addrInfo', addrInfo); 41 | 42 | } 43 | this.setData({ 44 | isDisabled: true, 45 | isComplete: this.data.isComplete 46 | // buttonTitle: "修改" 47 | }); 48 | }, 49 | updateAddr(e){ 50 | this.setData({ 51 | isDisabled:false, 52 | isComplete:false, 53 | buttonTitle: "保存" 54 | }); 55 | }, 56 | /** 57 | * 生命周期函数--监听页面加载 58 | */ 59 | onLoad: function (options) { 60 | let addrInfo=wx.getStorageSync("addrInfo"); 61 | console.log(addrInfo); 62 | let {receiverName,mobile,addressDetail,postCode}=addrInfo; 63 | this.setData({ 64 | receiverName:receiverName||this.data.receiverName, 65 | mobile:mobile||this.data.mobile, 66 | addressDetail:addressDetail||this.data.addressDetail, 67 | postCode:postCode||this.data.postCode, 68 | isDisabled: true, 69 | isComplete:true, 70 | buttonTitle: "修改" 71 | }); 72 | }, 73 | 74 | /** 75 | * 生命周期函数--监听页面初次渲染完成 76 | */ 77 | onReady: function () { 78 | 79 | }, 80 | 81 | /** 82 | * 生命周期函数--监听页面显示 83 | */ 84 | onShow: function () { 85 | 86 | }, 87 | 88 | /** 89 | * 生命周期函数--监听页面隐藏 90 | */ 91 | onHide: function () { 92 | 93 | }, 94 | 95 | /** 96 | * 生命周期函数--监听页面卸载 97 | */ 98 | onUnload: function () { 99 | 100 | }, 101 | 102 | /** 103 | * 页面相关事件处理函数--监听用户下拉动作 104 | */ 105 | onPullDownRefresh: function () { 106 | 107 | }, 108 | 109 | /** 110 | * 页面上拉触底事件的处理函数 111 | */ 112 | onReachBottom: function () { 113 | 114 | }, 115 | 116 | /** 117 | * 用户点击右上角分享 118 | */ 119 | onShareAppMessage: function () { 120 | 121 | } 122 | }) -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/addr/addr.json: -------------------------------------------------------------------------------- 1 | { 2 | "backgroundTextStyle": "light", 3 | "navigationBarBackgroundColor": "#fff", 4 | "navigationBarTitleText": "地址管理", 5 | "navigationBarTextStyle": "black" 6 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/addr/addr.wxml: -------------------------------------------------------------------------------- 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 | 31 | 32 |
-------------------------------------------------------------------------------- /wxapp-mi-mall/pages/addr/addr.wxss: -------------------------------------------------------------------------------- 1 | /* pages/addr/addr.wxss */ 2 | 3 | .block { 4 | background: #fff; 5 | } 6 | 7 | .list_item { 8 | display: flex; 9 | align-items: center; 10 | border-top: 1px solid #efefef; 11 | padding: 35rpx 20rpx; 12 | } 13 | 14 | .list_item .title { 15 | margin-right: 20rpx; 16 | font-size: 12pt; 17 | } 18 | 19 | .list_item .input { 20 | flex: 1; 21 | } 22 | 23 | .input input { 24 | font-size: 12pt; 25 | color: #333; 26 | } 27 | 28 | .btn_box { 29 | margin-top: 64rpx; 30 | padding: 0 24rpx; 31 | } 32 | .button.type_org{ 33 | color: #fff; 34 | background: #ff6700; 35 | } 36 | .btn_disabled{ 37 | color: #fff; 38 | background: #ff6700; 39 | opacity: 0.7; 40 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/cart/cart.js: -------------------------------------------------------------------------------- 1 | // pages/cart/cart.js 2 | const app = getApp(); 3 | 4 | Page({ 5 | 6 | /** 7 | * 页面的初始数据 8 | */ 9 | data: { 10 | cart_list: [], 11 | totalPrice: 0, 12 | selectAllStatus: false, 13 | startX: 0, //开始坐标 14 | startY: 0 15 | }, 16 | goIndex() { 17 | wx.switchTab({ 18 | url: "../index/index" 19 | }) 20 | }, 21 | selectList(e) { 22 | let selectAllStatus = this.data.selectAllStatus; 23 | const index = e.currentTarget.dataset.index; 24 | let cart_list = this.data.cart_list; 25 | // console.log(cart_list[index].selected); 26 | const selected = cart_list[index].selected; 27 | cart_list[index].selected = !selected; 28 | console.log(selected); 29 | //购物车列表里的条目只要有一个取消，全选就取消 30 | const symbol = cart_list.some(cart => { 31 | return cart.selected === false; 32 | }); 33 | if (symbol) { 34 | this.data.selectAllStatus = false; 35 | } else { 36 | this.data.selectAllStatus = true; 37 | } 38 | 39 | this.setData({ 40 | cart_list, 41 | selectAllStatus: this.data.selectAllStatus 42 | }); 43 | this.getTotalPrice(); 44 | }, 45 | getTotalPrice() { 46 | let cart_list = this.data.cart_list; 47 | let totalPrice = 0; 48 | for (let i = 0; i < cart_list.length; i++) { 49 | if (cart_list[i].selected) { 50 | totalPrice += parseInt(cart_list[i].select_num) * parseInt(cart_list[i].price); 51 | } 52 | } 53 | console.log(totalPrice); 54 | this.setData({ 55 | totalPrice 56 | }); 57 | }, 58 | selectAll(e) { 59 | let selectAllStatus = this.data.selectAllStatus; 60 | selectAllStatus = !selectAllStatus; 61 | let cart_list = this.data.cart_list; 62 | for (let i = 0; i < cart_list.length; i++) { 63 | cart_list[i].selected = selectAllStatus; 64 | } 65 | this.setData({ 66 | cart_list, 67 | selectAllStatus 68 | }); 69 | this.getTotalPrice(); 70 | }, 71 | 72 | touchstart: function (e) { 73 | this.data.cart_list.map(item => { 74 | if (item.isTouchMove) { 75 | item.isTouchMove = false; 76 | } 77 | }) 78 | this.setData({ 79 | startX: e.changedTouches[0].clientX, 80 | startY: e.changedTouches[0].clientY, 81 | cart_list: this.data.cart_list 82 | }) 83 | }, 84 | //滑动事件处理 85 | touchmove(e) { 86 | var 87 | index = e.currentTarget.dataset.index, //当前索引 88 | startX = this.data.startX, //开始X坐标 89 | startY = this.data.startY, //开始Y坐标 90 | touchMoveX = e.changedTouches[0].clientX, //滑动变化坐标 91 | touchMoveY = e.changedTouches[0].clientY, //滑动变化坐标 92 | //获取滑动角度 93 | angle = this.angle({ 94 | X: startX, 95 | Y: startY 96 | }, { 97 | X: touchMoveX, 98 | Y: touchMoveY 99 | }); 100 | this.data.cart_list.forEach(function (v, i) { 101 | v.isTouchMove = false 102 | //滑动超过30度角 return 103 | if (Math.abs(angle) > 30) return; 104 | if (i == index) { 105 | if (touchMoveX > startX) //右滑 106 | v.isTouchMove = false 107 | else //左滑 108 | v.isTouchMove = true 109 | } 110 | }) 111 | //更新数据 112 | this.setData({ 113 | cart_list: this.data.cart_list 114 | }) 115 | }, 116 | angle(start, end) { 117 | var X = end.X - start.X, 118 | Y = end.Y - start.Y 119 | //返回角度 /Math.atan()返回数字的反正切值 120 | return 360 * Math.atan(Y / X) / (2 * Math.PI); 121 | }, 122 | delCartItem(e) { 123 | const index=e.currentTarget.dataset.index; 124 | console.log(index); 125 | this.data.cart_list.splice(index, 1); 126 | wx.clearStorageSync("select_num"); 127 | this.setData({ 128 | cart_list: this.data.cart_list 129 | }); 130 | }, 131 | /** 132 | * 生命周期函数--监听页面加载 133 | */ 134 | onLoad: function (options) { 135 | 136 | }, 137 | 138 | /** 139 | * 生命周期函数--监听页面初次渲染完成 140 | */ 141 | onReady: function () { 142 | 143 | }, 144 | 145 | /** 146 | * 生命周期函数--监听页面显示 147 | */ 148 | onShow: function () { 149 | const attr_item = wx.getStorageSync('attr_item'); 150 | console.log(attr_item) 151 | // return 152 | let cart_list = this.data.cart_list; 153 | // arr = [attr_item, ...arr] 154 | cart_list = [...attr_item]; 155 | // arr.push(temp); 156 | console.log(cart_list); 157 | const select_num = cart_list.map(item => { 158 | return item.select_num; 159 | }) 160 | // console.log(select_num); 161 | let goods_sum = 0; 162 | for (let i = 0, len = select_num.length; i < len; i++) { 163 | goods_sum += select_num[i]; 164 | } 165 | wx.setStorageSync('goods_sum', goods_sum); 166 | console.log(goods_sum); 167 | // console.log(temp) 168 | this.setData({ 169 | cart_list 170 | }); 171 | console.log(this.data.cart_list); 172 | }, 173 | 174 | /** 175 | * 生命周期函数--监听页面隐藏 176 | */ 177 | onHide: function () { 178 | 179 | }, 180 | 181 | /** 182 | * 生命周期函数--监听页面卸载 183 | */ 184 | onUnload: function () { 185 | 186 | }, 187 | 188 | /** 189 | * 页面相关事件处理函数--监听用户下拉动作 190 | */ 191 | onPullDownRefresh: function () { 192 | 193 | }, 194 | 195 | /** 196 | * 页面上拉触底事件的处理函数 197 | */ 198 | onReachBottom: function () { 199 | 200 | }, 201 | 202 | /** 203 | * 用户点击右上角分享 204 | */ 205 | onShareAppMessage: function () { 206 | 207 | } 208 | }) -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/cart/cart.json: -------------------------------------------------------------------------------- 1 | { 2 | "backgroundTextStyle": "light", 3 | "navigationBarBackgroundColor": "#fff", 4 | "navigationBarTitleText": "购物车", 5 | "navigationBarTextStyle": "black" 6 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/cart/cart.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 购物车还是空的 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 18 | 20 | {{item.goods_name}} {{item.memory}} 21 | {{item.color}} 22 | {{item.select_num}}× 23 | {{item.price}} 24 | 删除 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 全选 34 | 35 | 合计： 36 | {{totalPrice}}元 37 | 38 | 结算 39 | 40 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/cart/cart.wxss: -------------------------------------------------------------------------------- 1 | /* pages/cart/cart.wxss */ 2 | .empty-cart{ 3 | display: flex; 4 | flex-direction: column; 5 | align-items: center; 6 | } 7 | .empty-cart .cart-icon{ 8 | display: flex; 9 | flex-direction: row; 10 | justify-content: center; 11 | align-items: center; 12 | width: 190rpx; 13 | height: 190rpx; 14 | margin-top: 100rpx; 15 | border-radius: 50%; 16 | background: #d6d6d6; 17 | } 18 | .cart-icon image{ 19 | width: 80rpx; 20 | height: 80rpx; 21 | } 22 | .btn-warn,.prompt{ 23 | margin-top: 80rpx; 24 | } 25 | .btn-warn{ 26 | width: 580rpx; 27 | letter-spacing: 4rpx; 28 | } 29 | 30 | /*购物车结算操作*/ 31 | .user-operation{ 32 | width: 100%; 33 | height: 100rpx; 34 | line-height: 100rpx; 35 | display: flex; 36 | flex-direction: row; 37 | justify-content: space-between; 38 | align-items: center; 39 | position: fixed; 40 | left: 0; 41 | bottom: 0; 42 | } 43 | .select-all,.total-price,.btn-primary.pay{ 44 | flex: 1; 45 | font-size: 12pt; 46 | text-align: center; 47 | } 48 | 49 | .select-all icon{ 50 | position: absolute; 51 | left: 30rpx; 52 | top: 20rpx; 53 | } 54 | .total-price text{ 55 | font-size: 12pt; 56 | padding: 20rpx; 57 | color: #ff6700; 58 | } 59 | .btn-primary.pay{ 60 | flex: 1; 61 | font-size: 14pt; 62 | color: #fff; 63 | background: #ff6700; 64 | } 65 | 66 | /*购物车列表样式*/ 67 | .cart-box{ 68 | width: 100%; 69 | margin-top: 12rpx; 70 | background: #fff; 71 | } 72 | .cart-list{ 73 | width: 100%; 74 | display: flex; 75 | flex-direction: column; 76 | justify-content: center; 77 | align-items: center; 78 | } 79 | .cart-item{ 80 | height: 150rpx; 81 | width: 100%; 82 | display: flex; 83 | flex-direction: row; 84 | justify-content: space-around; 85 | align-items: center; 86 | font-size: 11pt; 87 | border-top: 1rpx solid #dcdcdc; 88 | } 89 | .cart-item icon{ 90 | margin-left: -140rpx; 91 | } 92 | .cart-item text{ 93 | display: inline-block; 94 | margin-left: 10rpx; 95 | } 96 | .cart-item .item-price{ 97 | color: #ff6700; 98 | } 99 | .cart-list image{ 100 | width: 100rpx; 101 | height: 100rpx; 102 | display: inline-block; 103 | } 104 | .del-cart-item { 105 | background-color: #ff6700; 106 | width: 150rpx; 107 | height: 150rpx; 108 | display: flex; 109 | flex-direction: column; 110 | align-items: center; 111 | justify-content: center; 112 | color: #fff; 113 | -webkit-transform: translateX(150rpx); 114 | transform: translateX(150rpx); 115 | -webkit-transition: all 0.4s; 116 | transition: all 0.4s; 117 | } 118 | .cart-content { 119 | width: 100%; 120 | display: flex; 121 | flex-direction: row; 122 | justify-content: space-around; 123 | align-items: center; 124 | margin-right:-150rpx; 125 | -webkit-transition: all 0.4s; 126 | transition: all 0.4s; 127 | -webkit-transform: translateX(150rpx); 128 | transform: translateX(150rpx); 129 | margin-left: -150rpx 130 | } 131 | .touch-move-active .cart-content, 132 | .touch-move-active .del-cart-item { 133 | -webkit-transform: translateX(0); 134 | transform: translateX(0); 135 | } 136 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/categories/categories.js: -------------------------------------------------------------------------------- 1 | // pages/categories/categories.js 2 | const app=getApp(); 3 | 4 | Page({ 5 | 6 | /** 7 | * 页面的初始数据 8 | */ 9 | data: { 10 | cate_nav_list:[ 11 | {name:"新品",id:"new"}, 12 | {name:"手机",id:"phone"}, 13 | {name:"电视",id:"tv"}, 14 | {name:"电脑",id:"laptop"}, 15 | {name:"家电",id:"appliance"}, 16 | {name:"路由",id:"router"}, 17 | {name:"智能",id:"smart"}, 18 | {name:"儿童",id:"kids"}, 19 | {name:"灯具",id:"lignts"}, 20 | {name:"电源",id:"adapter"}, 21 | {name:"耳机",id:"headset"}, 22 | {name:"音箱",id:"voicebox"}, 23 | {name:"生活",id:"life"}, 24 | {name:"服务",id:"service"}, 25 | {name:"米粉卡",id:"card"} 26 | ], 27 | curIndex:0, 28 | toView:"new", 29 | detail:[] 30 | }, 31 | 32 | /** 33 | * 生命周期函数--监听页面加载 34 | */ 35 | switchCategory(e){ 36 | // console.log(e.currentTarget.dataset.id); 37 | const curIndex=e.currentTarget.dataset.index?e.currentTarget.dataset.index:0; 38 | this.setData({ 39 | toView:e.currentTarget.dataset.id, 40 | curIndex 41 | }); 42 | }, 43 | onLoad: function (options) { 44 | const detail=app.globalData.category; 45 | this.setData({ 46 | detail 47 | }); 48 | }, 49 | 50 | /** 51 | * 生命周期函数--监听页面初次渲染完成 52 | */ 53 | onReady: function () { 54 | 55 | }, 56 | 57 | /** 58 | * 生命周期函数--监听页面显示 59 | */ 60 | onShow: function () { 61 | 62 | }, 63 | 64 | /** 65 | * 生命周期函数--监听页面隐藏 66 | */ 67 | onHide: function () { 68 | 69 | }, 70 | 71 | /** 72 | * 生命周期函数--监听页面卸载 73 | */ 74 | onUnload: function () { 75 | 76 | }, 77 | 78 | /** 79 | * 页面相关事件处理函数--监听用户下拉动作 80 | */ 81 | onPullDownRefresh: function () { 82 | 83 | }, 84 | 85 | /** 86 | * 页面上拉触底事件的处理函数 87 | */ 88 | onReachBottom: function () { 89 | 90 | }, 91 | 92 | /** 93 | * 用户点击右上角分享 94 | */ 95 | onShareAppMessage: function () { 96 | 97 | } 98 | }) -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/categories/categories.json: -------------------------------------------------------------------------------- 1 | { 2 | "backgroundTextStyle": "light", 3 | "navigationBarBackgroundColor": "#fff", 4 | "navigationBarTitleText": "小米商城", 5 | "navigationBarTextStyle": "black" 6 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/categories/categories.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 6 | {{item.name}} 7 | 8 | 9 | 10 | 11 | 12 | 15 | {{item.cate_name}} 16 | 17 | 18 | 19 | {{cateList.item_name}} 20 | 21 | 22 | 23 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/categories/categories.wxss: -------------------------------------------------------------------------------- 1 | /* pages/categories/categories.wxss */ 2 | page,.main{ 3 | height: 100vh; 4 | } 5 | .main{ 6 | display: flex; 7 | flex-direction: row; 8 | height: 100%; 9 | width: 100%; 10 | background: #fff; 11 | } 12 | .category-left{ 13 | display: flex; 14 | flex-direction: column; 15 | width: 140rpx; 16 | border-right: 1px solid #dcdcdc; 17 | text-align: center; 18 | } 19 | .cate-name{ 20 | display: inline-block; 21 | margin-top: 40rpx; 22 | font-size: 10pt; 23 | } 24 | .cate-name.on{ 25 | font-size: 12pt; 26 | color: #ff4a00; 27 | } 28 | 29 | 30 | 31 | .category-right{ 32 | display: flex; 33 | flex-direction: column; 34 | } 35 | .cate-content{ 36 | /* border: 1px solid #000; */ 37 | margin-top: 40rpx; 38 | } 39 | .cate-list-content{ 40 | margin-top: 40rpx; 41 | height: 100vh; 42 | } 43 | .cate-list-content:nth-child(1){ 44 | margin-top: 0; 45 | } 46 | .cate-content .header{ 47 | height: 90rpx; 48 | line-height: 90rpx; 49 | font-size: 11pt; 50 | text-align: center; 51 | } 52 | 53 | .cate-list{ 54 | display: flex; 55 | flex-direction: row; 56 | /* justify-content: space-between; */ 57 | flex-wrap: wrap; 58 | /* border: 1px solid #ff4a00; */ 59 | /* height: 300rpx; */ 60 | /* margin-top: 90rpx; */ 61 | } 62 | .cate-item { 63 | display: flex; 64 | flex-direction: column; 65 | align-items: center; 66 | width: 150rpx; 67 | height: 150rpx; 68 | /* margin-top: 30rpx; 69 | margin-bottom: 30rpx; */ 70 | margin: 14rpx 26rpx; 71 | /* border: 1px solid #f00; */ 72 | } 73 | .cate-item image{ 74 | display: inline-block; 75 | width: 120rpx; 76 | height: 120rpx; 77 | } 78 | .cate-item text{ 79 | display: inline-block; 80 | font-size: 24rpx; 81 | margin-top: 16rpx; 82 | } 83 | .banner{ 84 | width: 500rpx; 85 | height: 200rpx; 86 | margin: 0 auto; 87 | } 88 | .banner image{ 89 | width: 100%; 90 | height: 100%; 91 | } 92 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/channel/computer/computer.js: -------------------------------------------------------------------------------- 1 | // pages/channel/computer/computer.js 2 | import showDetail from "../../../modules/showDetail"; 3 | const app=getApp(); 4 | 5 | Page({ 6 | 7 | /** 8 | * 页面的初始数据 9 | */ 10 | data: { 11 | slides:[], 12 | cover:[], 13 | goods_list:[] 14 | }, 15 | showDetail, 16 | /** 17 | * 生命周期函数--监听页面加载 18 | */ 19 | onLoad: function (options) { 20 | 21 | }, 22 | 23 | /** 24 | * 生命周期函数--监听页面初次渲染完成 25 | */ 26 | onReady: function () { 27 | this.setData({ 28 | slides:app.globalData.computer.pc_slides, 29 | cover:app.globalData.computer.cover, 30 | goods_list:app.globalData.computer.goods_list 31 | }); 32 | }, 33 | 34 | /** 35 | * 生命周期函数--监听页面显示 36 | */ 37 | onShow: function () { 38 | 39 | }, 40 | 41 | /** 42 | * 生命周期函数--监听页面隐藏 43 | */ 44 | onHide: function () { 45 | 46 | }, 47 | 48 | /** 49 | * 生命周期函数--监听页面卸载 50 | */ 51 | onUnload: function () { 52 | 53 | }, 54 | 55 | /** 56 | * 页面相关事件处理函数--监听用户下拉动作 57 | */ 58 | onPullDownRefresh: function () { 59 | 60 | }, 61 | 62 | /** 63 | * 页面上拉触底事件的处理函数 64 | */ 65 | onReachBottom: function () { 66 | 67 | }, 68 | 69 | /** 70 | * 用户点击右上角分享 71 | */ 72 | onShareAppMessage: function () { 73 | 74 | } 75 | }) -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/channel/computer/computer.json: -------------------------------------------------------------------------------- 1 | { 2 | "backgroundTextStyle": "light", 3 | "navigationBarBackgroundColor": "#fff", 4 | "navigationBarTitleText": "电脑频道", 5 | "navigationBarTextStyle": "black" 6 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/channel/computer/computer.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/channel/computer/computer.wxss: -------------------------------------------------------------------------------- 1 | /* pages/channel/computer/computer.wxss */ 2 | 3 | @import "../../../templates/slide/slide.wxss"; 4 | @import "../../../templates/goods_list/goods_list.wxss"; 5 | @import "../../../templates/cover/cover.wxss"; 6 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/channel/phone/phone.js: -------------------------------------------------------------------------------- 1 | // pages/phone/phone.js 2 | import showDetail from "../../../modules/showDetail"; 3 | const app=getApp(); 4 | 5 | Page({ 6 | 7 | /** 8 | * 页面的初始数据 9 | */ 10 | data: { 11 | slides:[], 12 | goods_list:[] 13 | }, 14 | // showDetail(e){ 15 | // console.log(e.currentTarget.dataset.pid); 16 | // }, 17 | showDetail, 18 | /** 19 | * 生命周期函数--监听页面加载 20 | */ 21 | onLoad: function (options) { 22 | 23 | }, 24 | 25 | /** 26 | * 生命周期函数--监听页面初次渲染完成 27 | */ 28 | onReady: function () { 29 | // console.log(app.globalData.phone.goods_list); 30 | this.setData({ 31 | slides:app.globalData.phone.phone_slides, 32 | goods_list:app.globalData.phone.goods_list 33 | }); 34 | }, 35 | 36 | /** 37 | * 生命周期函数--监听页面显示 38 | */ 39 | onShow: function () { 40 | 41 | }, 42 | 43 | /** 44 | * 生命周期函数--监听页面隐藏 45 | */ 46 | onHide: function () { 47 | 48 | }, 49 | 50 | /** 51 | * 生命周期函数--监听页面卸载 52 | */ 53 | onUnload: function () { 54 | 55 | }, 56 | 57 | /** 58 | * 页面相关事件处理函数--监听用户下拉动作 59 | */ 60 | onPullDownRefresh: function () { 61 | 62 | }, 63 | 64 | /** 65 | * 页面上拉触底事件的处理函数 66 | */ 67 | onReachBottom: function () { 68 | 69 | }, 70 | 71 | /** 72 | * 用户点击右上角分享 73 | */ 74 | onShareAppMessage: function () { 75 | 76 | } 77 | }) -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/channel/phone/phone.json: -------------------------------------------------------------------------------- 1 | { 2 | "backgroundTextStyle": "light", 3 | "navigationBarBackgroundColor": "#fff", 4 | "navigationBarTitleText": "手机频道", 5 | "navigationBarTextStyle": "black" 6 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/channel/phone/phone.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/channel/phone/phone.wxss: -------------------------------------------------------------------------------- 1 | /* pages/phone/phone.wxss */ 2 | @import "../../../templates/slide/slide.wxss"; 3 | @import "../../../templates/goods_list/goods_list.wxss"; 4 | 5 | 6 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/channel/tv/tv.js: -------------------------------------------------------------------------------- 1 | // pages/tv/tv.js 2 | import showDetail from "../../../modules/showDetail"; 3 | const app=getApp(); 4 | 5 | Page({ 6 | 7 | /** 8 | * 页面的初始数据 9 | */ 10 | data: { 11 | slides:[], 12 | goods_list:[] 13 | }, 14 | showDetail, 15 | /** 16 | * 生命周期函数--监听页面加载 17 | */ 18 | onLoad: function (options) { 19 | 20 | }, 21 | 22 | /** 23 | * 生命周期函数--监听页面初次渲染完成 24 | */ 25 | onReady: function () { 26 | this.setData({ 27 | slides:app.globalData.tv.tv_slides, 28 | goods_list:app.globalData.tv.goods_list 29 | }); 30 | }, 31 | 32 | /** 33 | * 生命周期函数--监听页面显示 34 | */ 35 | onShow: function () { 36 | 37 | }, 38 | 39 | /** 40 | * 生命周期函数--监听页面隐藏 41 | */ 42 | onHide: function () { 43 | 44 | }, 45 | 46 | /** 47 | * 生命周期函数--监听页面卸载 48 | */ 49 | onUnload: function () { 50 | 51 | }, 52 | 53 | /** 54 | * 页面相关事件处理函数--监听用户下拉动作 55 | */ 56 | onPullDownRefresh: function () { 57 | 58 | }, 59 | 60 | /** 61 | * 页面上拉触底事件的处理函数 62 | */ 63 | onReachBottom: function () { 64 | 65 | }, 66 | 67 | /** 68 | * 用户点击右上角分享 69 | */ 70 | onShareAppMessage: function () { 71 | 72 | } 73 | }) -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/channel/tv/tv.json: -------------------------------------------------------------------------------- 1 | { 2 | "backgroundTextStyle": "light", 3 | "navigationBarBackgroundColor": "#fff", 4 | "navigationBarTitleText": "电视频道", 5 | "navigationBarTextStyle": "black" 6 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/channel/tv/tv.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/channel/tv/tv.wxss: -------------------------------------------------------------------------------- 1 | /* pages/tv/tv.wxss */ 2 | @import "../../../templates/slide/slide.wxss"; 3 | @import "../../../templates/goods_list/goods_list.wxss"; -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/discovery/discovery.js: -------------------------------------------------------------------------------- 1 | // pages/discovery/discovery.js 2 | const app = getApp(); 3 | 4 | Page({ 5 | data: { 6 | videos:[], 7 | }, 8 | onLoad: function (options) { 9 | // 生命周期函数--监听页面加载 10 | const videos=app.globalData.discovery; 11 | this.setData({ 12 | videos 13 | }); 14 | } 15 | }) -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/discovery/discovery.json: -------------------------------------------------------------------------------- 1 | { 2 | "backgroundTextStyle": "light", 3 | "navigationBarBackgroundColor": "#fff", 4 | "navigationBarTitleText": "小米商城", 5 | "navigationBarTextStyle": "black" 6 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/discovery/discovery.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 10 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/discovery/discovery.wxss: -------------------------------------------------------------------------------- 1 | /* pages/discovery/discovery.wxss */ 2 | .cards { 3 | background: #fff; 4 | } 5 | 6 | .card { 7 | background: #ffffff; 8 | margin-bottom: 10px; 9 | padding:6rpx; 10 | transition: 0.5s all; 11 | box-shadow:0 0 20rpx #ccc; 12 | } 13 | 14 | .card.hover { 15 | box-shadow: 0 70rpx 90rpx rgba(0, 0, 0, 0.06); 16 | } 17 | 18 | .card image { 19 | position: relative; 20 | } 21 | 22 | .card image, 23 | .card video { 24 | height: 36vh; 25 | width: 100%; 26 | } 27 | 28 | .card .content { 29 | height: 18vh; 30 | display: flex; 31 | flex-direction: column; 32 | justify-content: center; 33 | align-items: center; 34 | } 35 | .content .header{ 36 | font-size: 13pt; 37 | color: #313131; 38 | } 39 | .content .description{ 40 | margin-top: 20rpx; 41 | font-size: 10pt; 42 | color: #ccc; 43 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/goods/show.js: -------------------------------------------------------------------------------- 1 | // pages/goods/show.js 2 | const app=getApp(); 3 | 4 | Page({ 5 | 6 | /** 7 | * 页面的初始数据 8 | */ 9 | data: { 10 | goods:[], 11 | selected:true, 12 | selected1:false, 13 | goods_num:"" 14 | }, 15 | selectBrief(e){ 16 | this.setData({ 17 | selected:true, 18 | selected1:false 19 | }); 20 | }, 21 | selectParameter(e){ 22 | this.setData({ 23 | selected:false, 24 | selected1:true 25 | }); 26 | }, 27 | //点击加入购物车按钮跳到商品属性选择页面 28 | toSelect(e){ 29 | const id=e.currentTarget.dataset.id; 30 | wx.navigateTo({ 31 | url:`../selectGoods/selectGoods?id=${id}` 32 | }); 33 | }, 34 | goCart(){ 35 | wx.switchTab({ 36 | url: "../cart/cart" 37 | }) 38 | }, 39 | previewImage(e){ 40 | const index=e.currentTarget.dataset.index; //获取swiper里的图片的下标 41 | const slide=this.data.goods.goods_slides; //获取商品轮播图 42 | const imgList=[]; //定义一个数组来存放轮播图的url 43 | // console.log(slide); 44 | slide.map(item=>{ 45 | imgList.push(item.slide_url); 46 | }); 47 | wx.previewImage({ 48 | current: imgList[index], // 当前显示图片的链接，不填则默认为 urls 的第一张 49 | urls: imgList 50 | }) 51 | }, 52 | /** 53 | * 生命周期函数--监听页面加载 54 | */ 55 | onLoad: function (options) { 56 | console.log(options); 57 | const id=options.id; 58 | console.log(id); 59 | const goods=app.globalData.goodsDetail.filter(item=>{ 60 | return item.id==id; 61 | }); 62 | console.log(goods); 63 | this.setData({ 64 | goods:goods[0] 65 | }); 66 | }, 67 | 68 | /** 69 | * 生命周期函数--监听页面初次渲染完成 70 | */ 71 | onReady: function () { 72 | this.setData({ 73 | 74 | }); 75 | 76 | }, 77 | 78 | /** 79 | * 生命周期函数--监听页面显示 80 | */ 81 | //把用户选好的商品规格从缓存拿出来 82 | onShow: function () { 83 | const goods_num=wx.getStorageSync('goods_sum'); 84 | this.setData({ 85 | goods_num 86 | }); 87 | }, 88 | 89 | /** 90 | * 生命周期函数--监听页面隐藏 91 | */ 92 | onHide: function () { 93 | 94 | }, 95 | 96 | /** 97 | * 生命周期函数--监听页面卸载 98 | */ 99 | onUnload: function () { 100 | 101 | }, 102 | 103 | /** 104 | * 页面相关事件处理函数--监听用户下拉动作 105 | */ 106 | onPullDownRefresh: function () { 107 | 108 | }, 109 | 110 | /** 111 | * 页面上拉触底事件的处理函数 112 | */ 113 | onReachBottom: function () { 114 | 115 | }, 116 | 117 | /** 118 | * 用户点击右上角分享 119 | */ 120 | onShareAppMessage: function () { 121 | 122 | } 123 | }) -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/goods/show.json: -------------------------------------------------------------------------------- 1 | { 2 | "backgroundTextStyle": "light", 3 | "navigationBarBackgroundColor": "#f9f9f9", 4 | "navigationBarTitleText": "商品详情", 5 | "navigationBarTextStyle": "black" 6 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/goods/show.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | {{goods.header}} 18 | {{goods.description}} 19 | {{goods.meta}} 20 | 21 | 22 | 23 | 24 | 25 | 促销 26 | 赠品 27 | 赠米粉卡 28 | 29 | 30 | 31 | 已选 32 | {{goods.header}} {{goods.default[0]}} {{goods.default[1]}} 33 | ×{{goods.default[2]}} 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 7天无理由退货 42 | 43 | 44 | 45 | 15天质量问题换货 46 | 47 | 48 | 49 | 365天保修 50 | 51 | 52 | 53 | 54 | 55 | 概述 56 | 参数 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | {{goods_num}} 69 | 70 | 71 | 加入购物车 72 | 立即购买 73 | 74 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/goods/show.wxss: -------------------------------------------------------------------------------- 1 | /* pages/goods/show.wxss */ 2 | 3 | .goods-swiper .slide { 4 | width: 100%; 5 | height: 792rpx; 6 | } 7 | 8 | .goods-swiper .slide-image { 9 | width: 100%; 10 | display: block; 11 | } 12 | 13 | .weui-cells:nth-child(1) { 14 | margin-top: 0; 15 | } 16 | 17 | .weui-cell__bd view { 18 | margin-top: 10rpx; 19 | } 20 | 21 | .weui-cell__bd .title { 22 | margin-top: 0; 23 | font-size: 12pt; 24 | } 25 | 26 | .weui-cell__bd .desp { 27 | overflow: hidden; 28 | text-overflow: ellipsis; 29 | white-space: nowrap; 30 | font-size: 9pt; 31 | color: #666; 32 | } 33 | 34 | .weui-cell__bd .meta { 35 | font-size: 12pt; 36 | font-weight: bold; 37 | color: #ff4a00; 38 | } 39 | 40 | .select .weui-cell__bd { 41 | padding: 30rpx 14rpx; 42 | } 43 | 44 | .weui-cells.select { 45 | margin-top: 10rpx; 46 | } 47 | 48 | .on-sale text{ 49 | display: inline-block; 50 | margin-left: 10rpx; 51 | font-size: 11pt; 52 | } 53 | .on-sale text:first-child{ 54 | margin-left: 30rpx; 55 | } 56 | .on-sale text:nth-child(2){ 57 | margin-left: 40rpx; 58 | padding: 0 20rpx; 59 | color: #ff6700; 60 | border: 1px solid #ff6700; 61 | border-radius: 4rpx; 62 | } 63 | 64 | .weui-cell__bd.selected { 65 | padding: 14rpx; 66 | } 67 | 68 | .weui-cell__bd.selected text { 69 | display: inline-block; 70 | margin-left: 30rpx; 71 | font-size: 11pt; 72 | } 73 | 74 | .weui-cell__bd.selected text:nth-child(1) { 75 | margin-left: 0; 76 | } 77 | 78 | .weui-cell__subtitle, 79 | .weui_cell__num { 80 | font-size: 10pt; 81 | color: #9c9c9c; 82 | } 83 | 84 | .weui-cell_promise { 85 | padding: 10rpx 36rpx; 86 | } 87 | 88 | .weui-cell__bd.intro { 89 | overflow: hidden; 90 | white-space: nowrap; 91 | text-overflow: ellipsis; 92 | font-size: 9pt; 93 | } 94 | 95 | .weui-cell__hd.success image { 96 | width: 40rpx; 97 | height: 40rpx; 98 | vertical-align: middle; 99 | } 100 | 101 | .user-operation { 102 | display: flex; 103 | flex-direction: row; 104 | align-items: center; 105 | position: fixed; 106 | bottom: 0; 107 | left: 0; 108 | width: 100%; 109 | height: 100rpx; 110 | z-index: 2; 111 | border-top: 1px solid #efefef; 112 | } 113 | 114 | .cart { 115 | flex: 1; 116 | height: 100rpx; 117 | background: #fff; 118 | } 119 | 120 | .cart image { 121 | width: 60rpx; 122 | height: 60rpx; 123 | position: relative; 124 | top: 18rpx; 125 | left: 20rpx; 126 | } 127 | .cart .badge{ 128 | display: inline-block; 129 | width: 36rpx; 130 | height: 36rpx; 131 | line-height: 36rpx; 132 | position: absolute; 133 | top: 10rpx; 134 | left: 60rpx; 135 | font-size: 11px; 136 | color: #fff; 137 | text-align: center; 138 | z-index: 2; 139 | background: #ff4a00; 140 | border-radius: 50%; 141 | } 142 | .add-cart, 143 | .btn-buy-now { 144 | flex: 3; 145 | height: 100rpx; 146 | line-height: 100rpx; 147 | text-align: center; 148 | color: #fff; 149 | background: #ff6700; 150 | } 151 | 152 | .btn-buy-now { 153 | background: #ea5f39; 154 | } 155 | 156 | .goods-intro .tab-select{ 157 | display: flex; 158 | flex-direction: row; 159 | justify-content: center; 160 | align-items: center; 161 | height: 80rpx; 162 | margin-top: 14rpx; 163 | background: #fff; 164 | } 165 | .brief,.parameter{ 166 | flex: 1; 167 | font-size: 10pt; 168 | text-align: center; 169 | } 170 | .tab-select text{ 171 | padding: 16rpx; 172 | } 173 | .on{ 174 | color: #ff6700; 175 | border-bottom: 2px solid #ff6700; 176 | } 177 | .goods-intro image{ 178 | display: block; 179 | width: 100%; 180 | } 181 | .parameter-info,.brief-info{ 182 | display: none; 183 | } 184 | .show{ 185 | display: block; 186 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/index/index.js: -------------------------------------------------------------------------------- 1 | //index.js 2 | //获取应用实例 3 | import showDetail from "../../modules/showDetail"; 4 | import showcDetail from "../../modules/showcDetail"; 5 | const app = getApp() 6 | 7 | Page({ 8 | data: { 9 | index_slides:[], 10 | indicator_dots:true, 11 | autoplay:true, 12 | interval:2000, 13 | duration:1000, 14 | nav_data:[], 15 | index_activity:[], 16 | index_block:[], 17 | isTap:false, 18 | isLoading:false 19 | }, 20 | onLoad(){ 21 | const index_slides=app.globalData.index_slides, 22 | nav_data=app.globalData.nav_data, 23 | index_activity=app.globalData.index_activity, 24 | index_block=app.globalData.index_block, 25 | sectionList=index_block.map((section)=>{ 26 | return section.section; 27 | }) 28 | console.log(sectionList); 29 | this.setData({ 30 | index_slides, 31 | nav_data, 32 | index_activity, 33 | index_block, 34 | }); 35 | 36 | }, 37 | onShow(e){ 38 | this.setData({ 39 | isTap:false 40 | }); 41 | }, 42 | //事件处理函数 43 | toSearch(e){ 44 | this.setData({ 45 | isTap:true 46 | }); 47 | wx.navigateTo({ 48 | url: "../search/search" 49 | }) 50 | }, 51 | // showDetail(e){ 52 | // const id=e.currentTarget.dataset.pid; 53 | // console.log(id); 54 | // } 55 | showDetail, 56 | showcDetail 57 | }) 58 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/index/index.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | {{item.nav_title}} 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | {{product.header}} 62 | {{product.description}} 63 | {{product.meta}} 64 | {{product.discount}} 65 | 66 | 67 | 68 | 69 | 70 | 71 | 到底啦 72 | 73 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/index/index.wxss: -------------------------------------------------------------------------------- 1 | /**index.wxss**/ 2 | .section{ 3 | width: 100%; 4 | } 5 | .searchBar{ 6 | display: flex; 7 | justify-content: center; 8 | height: 100rpx; 9 | background: #ff6700; 10 | } 11 | .searchBar .searBar-box{ 12 | display: inline-block; 13 | width: 95%; 14 | height: 60rpx; 15 | margin-top: 26rpx; 16 | border-radius: 40rpx; 17 | background: #fff; 18 | } 19 | .searBar-box.tap{ 20 | background: rgba(255,247,231,.9); 21 | } 22 | .search-plac{ 23 | text-align: center; 24 | font-size: 11pt; 25 | margin-top: 4rpx; 26 | } 27 | .searBar-box .search-icon{ 28 | position: absolute; 29 | left: 36%; 30 | top: 35rpx; 31 | width: 44rpx; 32 | height: 44rpx; 33 | } 34 | 35 | 36 | 37 | .section-swiper .slide{ 38 | width: 100%; 39 | height: 380rpx; 40 | } 41 | .section-swiper .slide-image{ 42 | width: 100%; 43 | display: block; 44 | } 45 | 46 | 47 | .navBar{ 48 | display: -webkit-box; 49 | display: -webkit-flex; 50 | display: flex; 51 | flex-direction: row; 52 | justify-content: center; 53 | align-items: center; 54 | height: 160rpx; 55 | background: #fff; 56 | } 57 | .nav-list{ 58 | display: -webkit-box; 59 | display: -webkit-flex; 60 | display: flex; 61 | justify-content: center; 62 | align-items: center; 63 | } 64 | .nav-item{ 65 | display: -webkit-box; 66 | display: -webkit-flex; 67 | display: flex; 68 | flex-direction: column; 69 | align-items: center; 70 | flex: 1; 71 | margin: 0 36rpx; 72 | } 73 | .nav-item .item-img{ 74 | display: inline-block; 75 | width: 80rpx; 76 | height: 80rpx; 77 | } 78 | .nav-item .item-text{ 79 | font-size: 26rpx; 80 | color:#999; 81 | } 82 | 83 | 84 | /* activity style */ 85 | .activity{ 86 | display: flex; 87 | flex-direction: column; 88 | margin-top: 6rpx; 89 | } 90 | .activity.up{ 91 | display: flex; 92 | flex-direction: row; 93 | height: 490rpx; 94 | width: 100%; 95 | background: #fff; 96 | } 97 | .left-list{ 98 | height: 490rpx; 99 | width: 358rpx; 100 | } 101 | .left-list image{ 102 | display: inline-block; 103 | width: 358rpx; 104 | margin: 4rpx 4rpx 0 0; 105 | } 106 | .right-list{ 107 | display: flex; 108 | flex-direction: column; 109 | height: 490rpx; 110 | flex: 1; 111 | } 112 | .right-list image{ 113 | display: inline-block; 114 | height: 238rpx; 115 | width: 390rpx; 116 | margin: 4rpx 0 0 4rpx; 117 | } 118 | 119 | 120 | /* block style */ 121 | .section.block{ 122 | display: flex; 123 | flex-direction: column; 124 | align-items: center; 125 | } 126 | .section.cover{ 127 | display: inline-block; 128 | height: 440rpx; 129 | margin-top: -4rpx; 130 | } 131 | .cover-img{ 132 | width: 100%; 133 | } 134 | .goods-list{ 135 | display: flex; 136 | flex-direction: row; 137 | flex-wrap: wrap; 138 | justify-content: space-around; 139 | align-items: center; 140 | margin-top: 0rpx; 141 | background: #fff; 142 | } 143 | .goods-item{ 144 | width: 360rpx; 145 | margin-bottom: 30rpx; 146 | } 147 | .goods-item:nth-child(1),.goods-item:nth-child(2){ 148 | margin-top: 8rpx; 149 | } 150 | .goods-item .goods-img{ 151 | position: relative; 152 | width: 360rpx; 153 | height: 360rpx; 154 | box-shadow: 0 0 6rpx #dcdcdc; 155 | } 156 | 157 | .goods-img.new:before{ /*新品标签样式*/ 158 | position: absolute; 159 | left: 0; 160 | top: 0; 161 | width: 100rpx; 162 | height: 40rpx; 163 | line-height: 40rpx; 164 | content: "新品"; 165 | color: #fff; 166 | font-size: 9pt; 167 | text-align: center; 168 | background: #8CC64A; 169 | } 170 | .goods-img.on-sale:before{ /*立减标签样式*/ 171 | position: absolute; 172 | left: 0; 173 | top: 0; 174 | width: 100rpx; 175 | height: 40rpx; 176 | line-height: 40rpx; 177 | content: "立减"; 178 | font-size: 9pt; 179 | color: #fff; 180 | text-align: center; 181 | background: #ec6055; 182 | } 183 | .goods-item text{ 184 | line-height: 40rpx; 185 | word-spacing: 10rpx; 186 | } 187 | .goods-item text:nth-child(1),.goods-item text:nth-child(2),.goods-item text:nth-child(3){ 188 | display: block; 189 | margin-left: 30rpx; 190 | } 191 | .goods-item .title{ 192 | font-size: 11pt; 193 | } 194 | .goods-item .desp{ 195 | overflow: hidden; 196 | text-overflow: ellipsis; 197 | white-space: nowrap; 198 | font-size: 9pt; 199 | color: #666; 200 | } 201 | .goods-item .meta{ 202 | margin-left: 30rpx; 203 | font-size: 11pt; 204 | color: #ff4a00; 205 | } 206 | .goods-item .discount{ 207 | display: inline-block; 208 | margin-left: 10rpx; 209 | font-size: 9pt; 210 | color: #666; 211 | text-decoration: line-through; 212 | } 213 | 214 | 215 | .bottom-line{ 216 | display: flex; 217 | height: 100rpx; 218 | justify-content: center; 219 | align-items: center; 220 | } 221 | .bottom-line text{ 222 | font-size: 10pt; 223 | color: #666; 224 | } 225 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/logs/logs.js: -------------------------------------------------------------------------------- 1 | //logs.js 2 | const util = require('../../utils/util.js') 3 | 4 | Page({ 5 | data: { 6 | logs: [] 7 | }, 8 | onLoad: function () { 9 | this.setData({ 10 | logs: (wx.getStorageSync('logs') || []).map(log => { 11 | return util.formatTime(new Date(log)) 12 | }) 13 | }) 14 | } 15 | }) 16 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/logs/logs.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "查看启动日志" 3 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/logs/logs.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | {{index + 1}}. {{log}} 5 | 6 | 7 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/logs/logs.wxss: -------------------------------------------------------------------------------- 1 | .log-list { 2 | display: flex; 3 | flex-direction: column; 4 | padding: 40rpx; 5 | } 6 | .log-item { 7 | margin: 10rpx; 8 | } 9 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/mine/mine.js: -------------------------------------------------------------------------------- 1 | // pages/mine/mine.js 2 | Page({ 3 | 4 | /** 5 | * 页面的初始数据 6 | */ 7 | data: { 8 | 9 | }, 10 | 11 | /** 12 | * 生命周期函数--监听页面加载 13 | */ 14 | onLoad: function (options) { 15 | 16 | }, 17 | 18 | /** 19 | * 生命周期函数--监听页面初次渲染完成 20 | */ 21 | onReady: function () { 22 | 23 | }, 24 | 25 | /** 26 | * 生命周期函数--监听页面显示 27 | */ 28 | onShow: function () { 29 | 30 | }, 31 | 32 | /** 33 | * 生命周期函数--监听页面隐藏 34 | */ 35 | onHide: function () { 36 | 37 | }, 38 | 39 | /** 40 | * 生命周期函数--监听页面卸载 41 | */ 42 | onUnload: function () { 43 | 44 | }, 45 | 46 | /** 47 | * 页面相关事件处理函数--监听用户下拉动作 48 | */ 49 | onPullDownRefresh: function () { 50 | 51 | }, 52 | 53 | /** 54 | * 页面上拉触底事件的处理函数 55 | */ 56 | onReachBottom: function () { 57 | 58 | }, 59 | 60 | /** 61 | * 用户点击右上角分享 62 | */ 63 | onShareAppMessage: function () { 64 | 65 | } 66 | }) -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/mine/mine.json: -------------------------------------------------------------------------------- 1 | { 2 | "backgroundTextStyle": "light", 3 | "navigationBarBackgroundColor": "#fff", 4 | "navigationBarTextStyle": "black" 5 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/mine/mine.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 云中玉卷 10 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 我的订单 27 | 28 | 29 | 30 | 31 | 32 | 我的收货地址 33 | 34 | 35 | 36 | 37 | 38 | 我的优惠券 39 | 40 | 41 | 42 | 43 | 44 | 我的F码 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 设置 53 | 54 | 55 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/mine/mine.wxss: -------------------------------------------------------------------------------- 1 | /* pages/mine/mine.wxss */ 2 | .weui-cells { 3 | margin-top: 18rpx; 4 | font-size: 12pt; 5 | } 6 | .weui-cell.head { 7 | padding: 8px 14px; 8 | } 9 | 10 | .weui-cell__hd.head image{ 11 | width: 120rpx; 12 | height: 120rpx; 13 | margin-right: 16px; 14 | margin-left: 0; 15 | vertical-align: middle; 16 | } 17 | 18 | .weui-cell__hd image { 19 | width: 70rpx; 20 | height: 70rpx; 21 | margin-right: 18px; 22 | margin-left: 5rpx; 23 | vertical-align: middle; 24 | } 25 | .weui-cell__ft .qrCode image{ 26 | width: 60rpx; 27 | height: 60rpx; 28 | } 29 | .weui-cell__bd .account{ 30 | width: 180rpx; 31 | height: 46rpx; 32 | line-height: 46rpx; 33 | margin-top: 8rpx; 34 | text-align: center; 35 | font-size: 10pt; 36 | color: #333; 37 | background: #ebebeb; 38 | border-radius: 6rpx; 39 | } 40 | 41 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/search/search.js: -------------------------------------------------------------------------------- 1 | // pages/search/search.js 2 | import showDetail from "../../modules/showDetail"; 3 | const app=getApp(); 4 | 5 | Page({ 6 | 7 | /** 8 | * 页面的初始数据 9 | */ 10 | data: { 11 | goods_list:[], 12 | search_list:[], 13 | is_hidden:true 14 | }, 15 | 16 | /** 17 | * 生命周期函数--监听页面加载 18 | */ 19 | onLoad: function (options) { 20 | 21 | }, 22 | searchInput(e){ 23 | // console.log(e.detail.value); 24 | wx.setStorageSync('keywords',e.detail.value); //存入搜索关键字 25 | let search_list=this.getList(e.detail.value); 26 | if(e.detail.value==""){ 27 | search_list=[]; 28 | this.data.is_hidden=true; 29 | }else{ 30 | this.data.is_hidden=false; 31 | } 32 | this.setData({ 33 | search_list, 34 | is_hidden:this.data.is_hidden 35 | }); 36 | }, 37 | search(e){ 38 | //按关键字筛选商品，如果关键字匹配到商品名称，则返回该商品列表 39 | const keywords=wx.getStorageSync('keywords'); 40 | wx.showLoading({ 41 | title: '请稍等', 42 | }); 43 | setTimeout(()=>{ 44 | this.setData({ 45 | goods_list:this.getList(keywords), 46 | is_hidden:true 47 | }); 48 | wx.hideLoading(); 49 | },500); 50 | }, 51 | showDetail, 52 | showItemDetail(e){ 53 | 54 | //按关键字筛选商品，如果关键字匹配到商品名称，则返回该商品列表 55 | const header=e.currentTarget.dataset.header.toLowerCase(); 56 | console.log(header); 57 | wx.showLoading({ 58 | title: '请稍等', 59 | }) 60 | setTimeout(()=>{ 61 | wx.hideLoading() 62 | this.setData({ 63 | goods_list:this.getList(header), 64 | is_hidden:true 65 | }); 66 | },500) 67 | }, 68 | getList(attr){ 69 | return app.globalData.phone.goods_list.filter(item=>{ 70 | return item.header.toString().toLowerCase().indexOf(attr)>-1; 71 | }); 72 | }, 73 | /** 74 | * 生命周期函数--监听页面初次渲染完成 75 | */ 76 | onReady: function () { 77 | 78 | }, 79 | 80 | /** 81 | * 生命周期函数--监听页面显示 82 | */ 83 | onShow: function () { 84 | 85 | }, 86 | 87 | /** 88 | * 生命周期函数--监听页面隐藏 89 | */ 90 | onHide: function () { 91 | 92 | }, 93 | 94 | /** 95 | * 生命周期函数--监听页面卸载 96 | */ 97 | onUnload: function () { 98 | 99 | }, 100 | 101 | /** 102 | * 页面相关事件处理函数--监听用户下拉动作 103 | */ 104 | onPullDownRefresh: function () { 105 | 106 | }, 107 | 108 | /** 109 | * 页面上拉触底事件的处理函数 110 | */ 111 | onReachBottom: function () { 112 | 113 | }, 114 | 115 | /** 116 | * 用户点击右上角分享 117 | */ 118 | onShareAppMessage: function () { 119 | 120 | } 121 | }) -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/search/search.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarBackgroundColor": "#fff", 3 | "navigationBarTitleText": "小米商城", 4 | "navigationBarTextStyle": "black" 5 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/search/search.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 搜索 11 | 12 | 13 | 14 | {{item.header}} 15 | 16 | 17 | 18 | 19 | 20 | 21 | 红米Note5 22 | 23 | 24 | 小米MIX2 25 | 26 | 27 | 小米MIX2S 28 | 29 | 30 | 小米笔记本Pro 31 | 32 | 33 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/search/search.wxss: -------------------------------------------------------------------------------- 1 | /* pages/search/search.wxss */ 2 | @import "../../templates/goods_list/goods_list.wxss"; 3 | page{ 4 | background: #fff; 5 | } 6 | .weui-search-bar{ 7 | background: #ff6700; 8 | } 9 | .weui-search-bar__cancel-btn{ 10 | color: #fff; 11 | font-size: 12pt; 12 | } 13 | 14 | .search-tages{ 15 | display: flex; 16 | flex-direction: row; 17 | flex-wrap: wrap; 18 | justify-content: center; 19 | align-items: center; 20 | } 21 | .search-tages text{ 22 | display: inline-block; 23 | height: 50rpx; 24 | line-height: 50rpx; 25 | font-size: 10pt; 26 | padding: 0 10rpx; 27 | margin: 30rpx 0 0 10rpx; 28 | background: #fff; 29 | border: 1rpx solid #d6d6d6; 30 | } 31 | 32 | /*搜索下拉框*/ 33 | .search-list{ 34 | width: 100%; 35 | /* height: 50vh; */ 36 | display: flex; 37 | flex-direction: column; 38 | position: fixed; 39 | z-index: 2; 40 | background: #fff; 41 | border-bottom: 1rpx solid #eee; 42 | } 43 | .search-list .search-item{ 44 | display: inline-block; 45 | width: 100%; 46 | height: 80rpx; 47 | line-height: 80rpx; 48 | padding: 8rpx 30rpx; 49 | border-bottom: 1rpx solid #eee; 50 | font-size: 10pt; 51 | } 52 | .search-list .search-item:last-child{ 53 | border-bottom: none; 54 | } 55 | .search-list.hidden{ 56 | display: none; 57 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/selectGoods/selectGoods.js: -------------------------------------------------------------------------------- 1 | // pages/selectGoods/selectGoods.js 2 | const app = getApp(); 3 | Page({ 4 | 5 | /** 6 | * 页面的初始数据 7 | */ 8 | data: { 9 | goods_attrSelect: [], 10 | curcIndex: 0, 11 | curvIndex: 0, 12 | select_num: 1, 13 | color:"", 14 | cover_img:"", 15 | memory:"", 16 | price:"" 17 | }, 18 | selectVersion(e) { 19 | const version = e.detail.value; 20 | // console.log(version); 21 | const memory = version.split(",")[0]; 22 | const price = version.split(",")[1]; 23 | // console.log(price); 24 | // wx.setStorageSync('version', version); 25 | wx.setStorageSync('memory', memory); 26 | wx.setStorageSync('price', price); 27 | this.setData({ 28 | memory, 29 | price 30 | }); 31 | }, 32 | selectColor(e) { 33 | let color = e.detail.value; 34 | let cover_img=this.data.goods_attrSelect[0].goods_slides[0].slide_url; 35 | // console.log(cover_img); 36 | wx.setStorageSync('color', color); 37 | wx.setStorageSync('cover', cover_img); 38 | this.setData({ 39 | color, 40 | cover_img 41 | }); 42 | }, 43 | colorHasSelected(e) { 44 | const curcIndex = e.currentTarget.dataset.index ? e.currentTarget.dataset.index : 0; 45 | console.log(curcIndex); 46 | this.setData({ 47 | curcIndex 48 | }); 49 | }, 50 | versionHasSelected(e) { 51 | const curvIndex = e.currentTarget.dataset.index ? e.currentTarget.dataset.index : 0; 52 | console.log(curvIndex); 53 | this.setData({ 54 | curvIndex 55 | }); 56 | }, 57 | minusCount(e) { 58 | let select_num = this.data.select_num; 59 | select_num--; 60 | if (select_num < 1) { 61 | return; 62 | } 63 | this.setData({ 64 | select_num 65 | }); 66 | wx.setStorageSync('select_num', select_num); 67 | }, 68 | addCount(e) { 69 | let select_num = this.data.select_num; 70 | select_num++; 71 | if (select_num > 5) { 72 | return; 73 | } 74 | this.setData({ 75 | select_num 76 | }); 77 | wx.setStorageSync('select_num', select_num); 78 | }, 79 | submit(e) { 80 | const pre_item = wx.getStorageSync('attr_item'); 81 | console.log(pre_item); 82 | const temp = { 83 | 'goods_name': wx.getStorageSync('goods_name'), 84 | 'memory': wx.getStorageSync('memory'), 85 | 'price': wx.getStorageSync('price'), 86 | 'color': wx.getStorageSync('color'), 87 | // 'version': wx.getStorageSync('version'), 88 | 'select_num': wx.getStorageSync('select_num'), 89 | 'cover': wx.getStorageSync('cover'), 90 | 'selected': false, 91 | 'isTouchMove': false 92 | } 93 | wx.setStorageSync('attr_item', [temp, ...pre_item]); 94 | wx.showToast({ 95 | title: '已加入购物车', 96 | icon: 'success', 97 | duration: 3000, 98 | success() { 99 | setTimeout(() => { 100 | wx.navigateBack({ 101 | url: "../goods/show" 102 | }); 103 | }, 1000) 104 | } 105 | }); 106 | }, 107 | /** 108 | * 生命周期函数--监听页面加载 109 | */ 110 | onLoad: function (options) { 111 | const id = options.id; 112 | console.log(id); 113 | const goods_attrSelect = app.globalData.goodsDetail.filter(item => { 114 | return item.id == id; 115 | }); 116 | console.log(goods_attrSelect); 117 | wx.setStorageSync("goods_name", goods_attrSelect[0].header); 118 | this.setData({ 119 | goods_attrSelect, 120 | color:goods_attrSelect[0].default[1], 121 | memory:goods_attrSelect[0].default[0], 122 | price:goods_attrSelect[0].default[3] 123 | }); 124 | }, 125 | 126 | /** 127 | * 生命周期函数--监听页面初次渲染完成 128 | */ 129 | onReady: function () { 130 | 131 | }, 132 | 133 | /** 134 | * 生命周期函数--监听页面显示 135 | */ 136 | onShow: function () { 137 | const version = wx.getStorageSync('version') 138 | // this.getGoods(version) 139 | console.log(version) 140 | wx.setStorageSync('select_num', this.data.select_num); 141 | // wx.setStorageSync('color', this.data.color); 142 | // wx.setStorageSync('memory', this.data.memory); 143 | // wx.setStorageSync('price', this.data.price); 144 | }, 145 | 146 | /** 147 | * 生命周期函数--监听页面隐藏 148 | */ 149 | onHide: function () { 150 | 151 | }, 152 | 153 | /** 154 | * 生命周期函数--监听页面卸载 155 | */ 156 | onUnload: function () { 157 | 158 | }, 159 | 160 | /** 161 | * 页面相关事件处理函数--监听用户下拉动作 162 | */ 163 | onPullDownRefresh: function () { 164 | 165 | }, 166 | 167 | /** 168 | * 页面上拉触底事件的处理函数 169 | */ 170 | onReachBottom: function () { 171 | 172 | }, 173 | 174 | /** 175 | * 用户点击右上角分享 176 | */ 177 | onShareAppMessage: function () { 178 | 179 | } 180 | }) -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/selectGoods/selectGoods.json: -------------------------------------------------------------------------------- 1 | { 2 | "backgroundTextStyle": "light", 3 | "navigationBarBackgroundColor": "#f9f9f9", 4 | "navigationBarTitleText": "选择商品", 5 | "navigationBarTextStyle": "black" 6 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/selectGoods/selectGoods.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | {{item.header}} {{memory}} {{color}} 11 | {{price}} 12 | 13 | 14 | 15 | 16 | 促销 17 | 赠品 18 | 赠米粉卡 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 版本 27 | 28 | 29 | 30 | 31 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 颜色 47 | 48 | 49 | 50 | 51 | 52 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 购买数量 65 | 66 | 67 | 68 | 69 | 70 | {{select_num?select_num:1}} 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 确定 80 | -------------------------------------------------------------------------------- /wxapp-mi-mall/pages/selectGoods/selectGoods.wxss: -------------------------------------------------------------------------------- 1 | /* pages/selectGoods/selectGoods.wxss */ 2 | 3 | .weui-cells:nth-child(1) { 4 | margin-top: 0; 5 | } 6 | 7 | .weui-cells { 8 | margin-top: 10rpx; 9 | } 10 | 11 | .weui-cell { 12 | padding-top: 30rpx; 13 | padding-bottom: 30rpx; 14 | } 15 | 16 | /*顶部cell样式*/ 17 | 18 | .weui-cell__hd.head { 19 | border: 1px solid #dcdcdc; 20 | border-radius: 4rpx; 21 | } 22 | 23 | .weui-cell__hd.head image { 24 | width: 160rpx; 25 | height: 160rpx; 26 | vertical-align: middle; 27 | } 28 | 29 | .preview .weui-cell__bd { 30 | margin-left: 20rpx; 31 | } 32 | 33 | .weui-cell__bd .meta { 34 | margin-top: 10rpx; 35 | font-size: 11pt; 36 | color: #ff6700; 37 | } 38 | 39 | .subtitle { 40 | font-size: 11pt; 41 | color: #9c9c9c; 42 | } 43 | 44 | /*促销样式*/ 45 | 46 | .on-sale text { 47 | display: inline-block; 48 | margin-left: 10rpx; 49 | font-size: 11pt; 50 | } 51 | 52 | .on-sale text:first-child { 53 | margin-left: 0; 54 | } 55 | 56 | .on-sale text:nth-child(2) { 57 | margin-left: 40rpx; 58 | padding: 0 20rpx; 59 | color: #ff6700; 60 | border: 1px solid #ff6700; 61 | border-radius: 4rpx; 62 | } 63 | 64 | /*版本选择样式*/ 65 | 66 | .weui-cell.attr-version { 67 | display: flex; 68 | flex-direction: column; 69 | justify-content: center; 70 | align-items: flex-start; 71 | width: 100%; 72 | } 73 | 74 | .select-version { 75 | display: flex; 76 | flex-direction: column; 77 | } 78 | 79 | .select-version label { 80 | display: flex; 81 | justify-content: space-between; 82 | align-items: center; 83 | width: 634rpx; 84 | margin-top: 14rpx; 85 | font-size: 11pt; 86 | padding: 16rpx 26rpx; 87 | border-radius: 6rpx; 88 | border: 1px solid #dcdcdc; 89 | } 90 | 91 | /*颜色选择样式*/ 92 | 93 | .weui-cell.attr-color { 94 | display: flex; 95 | flex-direction: column; 96 | justify-content: center; 97 | align-items: flex-start; 98 | } 99 | 100 | .select-color { 101 | display: flex; 102 | flex-direction: row; 103 | justify-content: space-around; 104 | } 105 | 106 | .select-color label { 107 | display: inline-block; 108 | width: 96rpx; 109 | padding: 16rpx 30rpx; 110 | margin: 8rpx; 111 | font-size: 11pt; 112 | text-align: center; 113 | border: 1px solid #dcdcdc; 114 | border-radius: 6rpx; 115 | } 116 | 117 | .select-color label:nth-child(1) { 118 | margin-left: 0; 119 | } 120 | .select-color label.on{ 121 | color: #ff6700; 122 | border: 1px solid #ff6700; 123 | } 124 | .select-version label.on{ 125 | color: #ff6700; 126 | border: 1px solid #ff6700; 127 | } 128 | /*数量选择样式*/ 129 | 130 | .select-number { 131 | display: flex; 132 | flex-direction: row; 133 | justify-content: center; 134 | align-items: center; 135 | width: 240rpx; 136 | margin-left: 310rpx; 137 | border: 1px solid #dcdcdc; 138 | border-radius: 6rpx; 139 | } 140 | 141 | .select-number view { 142 | flex: 1; 143 | text-align: center; 144 | padding: 16rpx; 145 | } 146 | 147 | .select-number view:first-child { 148 | border-right: 1px solid #dcdcdc; 149 | } 150 | 151 | .select-number view:last-child { 152 | border-left: 1px solid #dcdcdc; 153 | } 154 | 155 | .select-number image { 156 | width: 32rpx; 157 | height: 32rpx; 158 | } 159 | 160 | .btn-primary { 161 | position: fixed; 162 | bottom: 0; 163 | left: 0; 164 | width: 100%; 165 | height: 100rpx; 166 | line-height: 100rpx; 167 | text-align: center; 168 | color: #fff; 169 | background: #ff6700; 170 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/project.config.json: -------------------------------------------------------------------------------- 1 | { 2 | "description": "项目配置文件。", 3 | "packOptions": { 4 | "ignore": [] 5 | }, 6 | "setting": { 7 | "urlCheck": true, 8 | "es6": true, 9 | "postcss": true, 10 | "minified": true, 11 | "newFeature": true 12 | }, 13 | "compileType": "miniprogram", 14 | "libVersion": "2.0.8", 15 | "appid": "wx3e1c43af939ed19f", 16 | "projectname": "wxapp-mi-mall", 17 | "isGameTourist": false, 18 | "condition": { 19 | "search": { 20 | "current": -1, 21 | "list": [] 22 | }, 23 | "conversation": { 24 | "current": -1, 25 | "list": [] 26 | }, 27 | "game": { 28 | "currentL": -1, 29 | "list": [] 30 | }, 31 | "miniprogram": { 32 | "current": -1, 33 | "list": [] 34 | } 35 | } 36 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/templates/cover/cover.wxml: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /wxapp-mi-mall/templates/cover/cover.wxss: -------------------------------------------------------------------------------- 1 | .cover { 2 | display: flex; 3 | flex-direction: column; 4 | margin-top: 10rpx; 5 | background: #fff; 6 | } 7 | 8 | .cover .cate-title { 9 | width: 100%; 10 | height: 90rpx; 11 | } 12 | 13 | .cover .cover_list { 14 | display: flex; 15 | flex-direction: column; 16 | /* border: 1px solid #000; */ 17 | } 18 | .item-desp { 19 | display: flex; 20 | flex-direction: row; 21 | flex-wrap: wrap; 22 | justify-content: space-between; 23 | align-items: center; 24 | /* border: 1px solid #f00; */ 25 | padding:0 30rpx; 26 | background:#fff; 27 | } 28 | 29 | .cover-item { 30 | width: 100%; 31 | /* border: 1px solid #00f; */ 32 | } 33 | 34 | .cover-item image { 35 | width: 100%; 36 | height: 376rpx; 37 | } 38 | 39 | .cover-item text { 40 | display: inline-block; 41 | line-height: 40rpx; 42 | /* margin-top: 16rpx; */ 43 | word-spacing: 10rpx; 44 | } 45 | .cover-item text:nth-child(3),.cover-item text:nth-child(4){ 46 | margin-top: 0; 47 | padding: 8rpx; 48 | } 49 | .cover-item .title { 50 | font-size: 13pt; 51 | } 52 | 53 | .cover-item .desp { 54 | overflow: hidden; 55 | text-overflow: ellipsis; 56 | white-space: nowrap; 57 | font-size: 9pt; 58 | color: #666; 59 | } 60 | 61 | .cover-item .meta { 62 | margin-left: 30rpx; 63 | font-size: 11pt; 64 | color: #ff4a00; 65 | } 66 | 67 | .cover-item .discount { 68 | display: inline-block; 69 | margin-left: 10rpx; 70 | font-size: 9pt; 71 | color: #666; 72 | text-decoration: line-through; 73 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/templates/goods_list/goods_list.wxml: -------------------------------------------------------------------------------- 1 | 15 | -------------------------------------------------------------------------------- /wxapp-mi-mall/templates/goods_list/goods_list.wxss: -------------------------------------------------------------------------------- 1 | .goods-list{ 2 | display: flex; 3 | flex-direction: row; 4 | flex-wrap: wrap; 5 | justify-content: space-between; 6 | align-items: center; 7 | margin-top: 0rpx; 8 | padding: 10rpx; 9 | background: #fff; 10 | } 11 | .goods-item{ 12 | width: 360rpx; 13 | margin-bottom: 30rpx; 14 | } 15 | .goods-item:nth-child(1),.goods-item:nth-child(2){ 16 | margin-top: 8rpx; 17 | } 18 | .goods-item .goods-img{ 19 | position: relative; 20 | width: 360rpx; 21 | height: 360rpx; 22 | box-shadow: 0 0 6rpx #dcdcdc; 23 | } 24 | 25 | .goods-img.new:before{ /*新品标签样式*/ 26 | position: absolute; 27 | width: 100rpx; 28 | height: 40rpx; 29 | line-height: 40rpx; 30 | content: "新品"; 31 | color: #fff; 32 | font-size: 9pt; 33 | text-align: center; 34 | background: #8CC64A; 35 | } 36 | .goods-img.on-sale:before{ /*立减标签样式*/ 37 | position: absolute; 38 | left: 0; 39 | top: 0; 40 | width: 100rpx; 41 | height: 40rpx; 42 | line-height: 40rpx; 43 | content: "立减"; 44 | font-size: 9pt; 45 | color: #fff; 46 | text-align: center; 47 | background: #ec6055; 48 | } 49 | .goods-item text{ 50 | line-height: 40rpx; 51 | word-spacing: 10rpx; 52 | } 53 | .goods-item text:nth-child(1),.goods-item text:nth-child(2),.goods-item text:nth-child(3){ 54 | display: block; 55 | margin-left: 30rpx; 56 | } 57 | .goods-item .title{ 58 | overflow: hidden; 59 | text-overflow: ellipsis; 60 | white-space: nowrap; 61 | font-size: 11pt; 62 | } 63 | .goods-item .desp{ 64 | overflow: hidden; 65 | text-overflow: ellipsis; 66 | white-space: nowrap; 67 | font-size: 9pt; 68 | color: #666; 69 | } 70 | .goods-item .meta{ 71 | margin-left: 30rpx; 72 | font-size: 11pt; 73 | color: #ff4a00; 74 | } 75 | .goods-item .discount{ 76 | display: inline-block; 77 | margin-left: 10rpx; 78 | font-size: 9pt; 79 | color: #666; 80 | text-decoration: line-through; 81 | } 82 | -------------------------------------------------------------------------------- /wxapp-mi-mall/templates/slide/slide.wxml: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /wxapp-mi-mall/templates/slide/slide.wxss: -------------------------------------------------------------------------------- 1 | .section-swiper .slide{ 2 | width: 100%; 3 | height: 380rpx; 4 | } 5 | .section-swiper .slide-image{ 6 | width: 100%; 7 | display: block; 8 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/utils/mock.js: -------------------------------------------------------------------------------- 1 | export default { 2 | index_slides: [{ 3 | id: 1, 4 | slide_url: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/37dfdc929ee9a4313facb0b23ebcd721.jpg?thumb=1&w=720&h=360" 5 | }, 6 | { 7 | id: 2, 8 | slide_url: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/b51889744910df7979a2f672434da84e.jpg?thumb=1&w=720&h=360" 9 | }, 10 | { 11 | id: 100001, 12 | slide_url: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/a0ff3dc30027f3b615bfe03f1d306ee5.jpg?thumb=1&w=720&h=360" 13 | }, 14 | { 15 | id: 31, 16 | slide_url: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/2320573b3be643e29f5270a97e1a9c1d.jpg?thumb=1&w=720&h=360" 17 | } 18 | ], 19 | nav_data: [{ 20 | nav_urls: "../channel/phone/phone", 21 | nav_img: "../../assets/nav_img/phone.png", 22 | nav_title: "手机" 23 | }, 24 | { 25 | nav_urls: "../channel/tv/tv", 26 | nav_img: "../../assets/nav_img/tv.png", 27 | nav_title: "电视" 28 | }, 29 | { 30 | nav_urls: "../channel/computer/computer", 31 | nav_img: "../../assets/nav_img/computer.png", 32 | nav_title: "电脑" 33 | }, 34 | { 35 | nav_urls: "", 36 | nav_img: "../../assets/nav_img/router.png", 37 | nav_title: "智能" 38 | }, 39 | { 40 | nav_urls: "", 41 | nav_img: "../../assets/nav_img/news.png", 42 | nav_title: "新品" 43 | } 44 | ], 45 | index_activity: [{ 46 | id: 3, 47 | img_url: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/d90dc8f6466deb4b0a17d9d4b8ba4a6a.jpg?thumb=1&w=358&h=508" 48 | }, { 49 | id: 65, 50 | img_url: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/bb4e6198ae2f99f158109b217064f703.jpg?thumb=1&w=358&h=252", 51 | }, { 52 | id: 31, 53 | img_url: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/b3fa7ac28fa7dd9b02d816ef564c27cd.jpg?thumb=1&w=358&h=252", 54 | }], 55 | index_block: [{ 56 | id: 5, 57 | img_url: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/b162f2466c25260f7c4c7daae2748546.jpg?thumb=1&w=720&h=440", 58 | section: [{ 59 | id: 4, 60 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/c0bd24d4f71813791c2987e4bf41696d.jpg?thumb=1&w=360&h=360", 61 | header: "红米5A,轻巧长续航", 62 | description: "高通骁龙处理器", 63 | meta: "569元", 64 | discount: "599元", 65 | is_new: false, 66 | on_sale: true 67 | }, 68 | { 69 | id: 5, 70 | goods_cover: "https://i8.mifile.cn/v1/a1/e7853ea5-1260-6cb2-91ed-2c539a87db0a!360x360.webp", 71 | header: "红米5,4GB+32GB", 72 | description: "千元全面屏", 73 | meta: "999元", 74 | discount: "1099元", 75 | is_new: false, 76 | on_sale: true 77 | }, 78 | { 79 | id: 1, 80 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/850d316b25648c9862c7c22aefba9280.jpg?thumb=1&w=360&h=360", 81 | header: "红米Note5,4GB+64GB", 82 | description: "1.4μm大像素AI双摄", 83 | meta: "1399元", 84 | discount: "", 85 | is_new: false 86 | }, 87 | { 88 | id: 6, 89 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/8612f157af2c116b7e3fc47356cdb7be.jpg?thumb=1&w=360&h=360", 90 | header: "红米自拍手机S2", 91 | description: "1600万像素自拍手机", 92 | meta: "999元", 93 | discount: "", 94 | is_new: true 95 | } 96 | ] 97 | }, 98 | { 99 | id: 7, 100 | img_url: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/4948d78d63db71278fd194e8d7ead35d.jpg?thumb=1&w=720&h=440", 101 | section: [{ 102 | id: 8, 103 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/5603273010ab9182a1527cfab5cd2a9e.jpg?thumb=1&w=360&h=360", 104 | header: "小米5X变焦双摄", 105 | description: "5.5''大屏轻薄全金属", 106 | meta: "1299元", 107 | discount: "1499元", 108 | is_new: false, 109 | on_sale: true 110 | }, 111 | { 112 | id: 9, 113 | goods_cover: "https://i8.mifile.cn/v1/a1/7d04d143-a95c-0c1c-7c37-1ee23ae9906e!360x360.webp", 114 | header: "小米MIX2 全陶瓷 黑色", 115 | description: "Unibody 全陶瓷", 116 | meta: "3699元", 117 | discount: "4699元", 118 | is_new: false, 119 | on_sale: true 120 | }, 121 | { 122 | id: 10, 123 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/bb34c2bb89ecd66885e2ac15e6278d71.jpg?thumb=1&w=360&h=360", 124 | header: "红米Note5,6GB+64GB", 125 | description: "1.4μm大像素AI双摄", 126 | meta: "1699元", 127 | discount: "", 128 | is_new: false 129 | }, 130 | { 131 | id: 11, 132 | goods_cover: "https://i8.mifile.cn/v1/a1/d5c8ea24-5290-46e0-8064-7634b4cbad70!360x360.webp", 133 | header: "小米Max2 大屏大电量", 134 | description: "6.44''大屏,5300mAh大电量", 135 | meta: "1299元", 136 | discount: "1399元", 137 | is_new: false, 138 | on_sale: true 139 | } 140 | ] 141 | }, 142 | { 143 | id: 31, 144 | img_url: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/122b6425e2a48a41dd0409467a84de87.jpg?thumb=1&w=720&h=440", 145 | section: [{ 146 | id: 200, 147 | goods_cover: "https://i8.mifile.cn/v1/a1/83236155-6190-abba-e76c-e2a488fb3350!360x360.webp", 148 | header: "TS防蓝光护目镜", 149 | description: "35%蓝光阻隔率,超轻材质", 150 | meta: "99元", 151 | discount: "", 152 | is_new: false 153 | }, 154 | { 155 | id: 201, 156 | goods_cover: "https://i8.mifile.cn/v1/a1/095e2d20-0a05-1649-7ffe-8f88e3e6c5b5!360x360.webp", 157 | header: "米家声波电动牙刷", 158 | description: "高效能磁悬浮声波马达", 159 | meta: "199元", 160 | discount: "", 161 | is_new: false 162 | }, 163 | { 164 | id: 66, 165 | goods_cover: "https://i8.mifile.cn/v1/a1/d60cc88b-b88f-752c-0e01-59738fd51dc7!360x360.webp", 166 | header: "小米智能摄像1S", 167 | description: "1080高清画质,安全看家", 168 | meta: "99元", 169 | discount: "", 170 | is_new: false 171 | }, 172 | { 173 | id: 202, 174 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/97bdebaac4f524b9dfdfe6981815ead4.jpg?thumb=1&w=360&h=360", 175 | header: "尼龙偏光太阳镜", 176 | description: "尼龙偏光镜片", 177 | meta: "199元", 178 | discount: "", 179 | is_new: false 180 | } 181 | ] 182 | }, 183 | { 184 | id: 67, 185 | img_url: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/cb15f9bbe18147bd00895fecc444a343.jpg?thumb=1&w=720&h=440", 186 | section: [{ 187 | id: 68, 188 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/67b72f719a7832c34d095f0fe57014b8.png?thumb=1&w=360&h=360", 189 | header: "小米小爱音箱mini", 190 | description: "能听会说的人工智能音箱", 191 | meta: "169元", 192 | discount: "", 193 | is_new: true 194 | }, 195 | { 196 | id: 69, 197 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/4900b70b3ffd893d6c130f0b741fa6f1.jpg?thumb=1&w=360&h=360", 198 | header: "小米蓝牙项圈耳机", 199 | description: "项圈式设计/轻量化亲肤材质", 200 | meta: "299元", 201 | discount: "", 202 | is_new: true 203 | }, 204 | { 205 | id: 70, 206 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/aeec7ffbd05dcf06ceec3b4ee4726905.jpeg?thumb=1&w=360&h=360", 207 | header: "米家LED吸顶灯", 208 | description: "用光线,还原理想生活", 209 | meta: "399元", 210 | discount: "", 211 | is_new: true 212 | }, 213 | { 214 | id: 71, 215 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/ffe8610a808d8254fb5d37b141d0bf5f.jpg?thumb=1&w=360&h=360", 216 | header: "小米路由器4", 217 | description: "双频双核 更快更稳定", 218 | meta: "199元", 219 | discount: "", 220 | is_new: true 221 | } 222 | ] 223 | }, 224 | { 225 | id: 72, 226 | img_url: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/a236a6942d9b4dade1e321154c526a0f.jpg?thumb=1&w=720&h=440", 227 | section: [{ 228 | id: 73, 229 | goods_cover: "https://i8.mifile.cn/v1/a1/0518c80c-a1a5-af45-0898-a4e07b3d5a9f!360x360.webp", 230 | header: "小米AI音箱", 231 | description: "能播音乐、讲故事、查路况、设闹钟、还能控制智能设备", 232 | meta: "299元", 233 | discount: "", 234 | is_new: false 235 | }, 236 | { 237 | id: 74, 238 | goods_cover: "https://i8.mifile.cn/v1/a1/81aed22a-ec72-e3ac-1016-f03dbd595e41!360x360.webp", 239 | header: "小米运动蓝牙耳机mini", 240 | description: "迷你机身，小如蚕豆", 241 | meta: "169元", 242 | discount: "", 243 | is_new: false 244 | }, 245 | { 246 | id: 74, 247 | goods_cover: "https://i8.mifile.cn/v1/a1/567af3c5-083c-e19d-e7ea-10805b66029d!360x360.webp", 248 | header: "小米路由器3A", 249 | description: "一台路由器满足全家上网需求", 250 | meta: "139元", 251 | discount: "", 252 | is_new: false 253 | }, 254 | { 255 | id: 75, 256 | goods_cover: "https://i8.mifile.cn/v1/a1/a3b0fd45-5ab5-bc2d-9a54-4bb4c5e148b4!360x360.webp", 257 | header: "小米空气净化器2S", 258 | description: "经典再升级,好空气看得见", 259 | meta: "899元", 260 | discount: "", 261 | is_new: true 262 | } 263 | ] 264 | } 265 | ], 266 | category: [ 267 | { 268 | id: "new", 269 | banner: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/bb5cfaa54a1bf61c85539226f5049de1.jpg?thumb=1&w=500&h=200", 270 | cate_name: "新品", 271 | cate_list: [{ 272 | item_img: "https://i8.mifile.cn/b2c-mimall-media/cae1e9af28aebb1d0e065cbdc08d8f66!120x120.png", 273 | item_name: "小米8" 274 | }, 275 | { 276 | item_img: "https://i8.mifile.cn/b2c-mimall-media/745cd6cbffce6a1c1c1cafbd5abbfed0!120x120.png", 277 | item_name: "黑鲨游戏手机" 278 | }, 279 | { 280 | item_img: "https://i8.mifile.cn/b2c-mimall-media/dc6165304dcced2a3b2cc574e4af9b4a!120x120.png", 281 | item_name: "小米8SE" 282 | }, 283 | { 284 | item_img: "https://i8.mifile.cn/b2c-mimall-media/06cabb01bbe4ac5c819ee101e4446a16!120x120.png", 285 | item_name: "小米MIX2S" 286 | }, 287 | { 288 | item_img: "https://i8.mifile.cn/b2c-mimall-media/95e18c104b398643101805287a00ad2b!120x120.png", 289 | item_name: "小米MIX2" 290 | }, 291 | { 292 | item_img: "https://i8.mifile.cn/b2c-mimall-media/7bb843bdb8e1f61f4567f1e2acb43262!120x120.png", 293 | item_name: "小米Note3" 294 | } 295 | ] 296 | }, 297 | { 298 | id: "phone", 299 | banner: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/711275806886438be20e33ec943a904a.jpg?thumb=1&w=500&h=200", 300 | cate_name: "手机", 301 | cate_list: [{ 302 | item_img: "https://i8.mifile.cn/b2c-mimall-media/06cabb01bbe4ac5c819ee101e4446a16!120x120.png", 303 | item_name: "小米MIX2S" 304 | }, 305 | { 306 | item_img: "https://i8.mifile.cn/b2c-mimall-media/745cd6cbffce6a1c1c1cafbd5abbfed0!120x120.png", 307 | item_name: "黑鲨游戏手机" 308 | }, 309 | { 310 | item_img: "https://i8.mifile.cn/b2c-mimall-media/74049580f582c72efdde7c80fbdbd223!120x120.jpg", 311 | item_name: "红米S2" 312 | }, 313 | { 314 | item_img: "https://i8.mifile.cn/b2c-mimall-media/870f95a2aaca2bda576cf1d5d8b56934!120x120.png", 315 | item_name: "小米6X" 316 | }, 317 | { 318 | item_img: "https://i8.mifile.cn/b2c-mimall-media/95e18c104b398643101805287a00ad2b!120x120.png", 319 | item_name: "小米MIX2" 320 | }, 321 | { 322 | item_img: "https://i8.mifile.cn/b2c-mimall-media/7bb843bdb8e1f61f4567f1e2acb43262!120x120.png", 323 | item_name: "小米Note3" 324 | } 325 | ] 326 | }, 327 | { 328 | id: "tv", 329 | banner: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/1e455b4b51610ea7b2e6958a4c3aa612.jpg?thumb=1&w=500&h=200", 330 | cate_name: "电视", 331 | cate_list: [{ 332 | item_img: "https://i8.mifile.cn/b2c-mimall-media/ae525d6481ad090edc97ac64ed93e048!120x120.png", 333 | item_name: "32-40英寸" 334 | }, 335 | { 336 | item_img: "https://i8.mifile.cn/b2c-mimall-media/de645bfe55dd46d3fc5ec78a8755a644!120x120.jpg", 337 | item_name: "43英寸" 338 | }, 339 | { 340 | item_img: "https://i8.mifile.cn/b2c-mimall-media/efb682b76a29411fd26d990971992c3e!120x120.png", 341 | item_name: "49-50英寸" 342 | }, 343 | { 344 | item_img: "https://i8.mifile.cn/b2c-mimall-media/a68d31ccb3ac07f289abc39a5682f334!120x120.png", 345 | item_name: "55英寸" 346 | }, 347 | { 348 | item_img: "https://i8.mifile.cn/b2c-mimall-media/976a7cf20fc4d2c72be96c0a7ded63d1!120x120.png", 349 | item_name: "65英寸" 350 | } 351 | ] 352 | }, 353 | { 354 | id: "laptop", 355 | banner: "https://i8.mifile.cn/v1/a1/efdcf401-f553-aef7-1751-43854b6f4a20!500x200.webp", 356 | cate_name: "电脑", 357 | cate_list: [{ 358 | item_img: "https://i8.mifile.cn/b2c-mimall-media/ccad3ac9a43a21a606a392cf6a14b091!120x120.jpg", 359 | item_name: "游戏本" 360 | }, 361 | { 362 | item_img: "https://i8.mifile.cn/b2c-mimall-media/0643559b70964014c1d672cc783121d2!120x120.jpg", 363 | item_name: "笔记本15.6''" 364 | }, 365 | { 366 | item_img: "https://i8.mifile.cn/v1/a1/8a9485f0-3b11-9d50-cbaa-1ee1cc0936cd!120x120.png", 367 | item_name: "笔记本13.3''" 368 | }, 369 | { 370 | item_img: "https://i8.mifile.cn/v1/a1/78e8a82a-1ef7-453b-5a07-d8394081ae2e!120x120.png", 371 | item_name: "笔记本12.5''" 372 | } 373 | ] 374 | }, 375 | { 376 | id: "appliance", 377 | banner: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/17dbc837b82de528f8f4abf4ede0753a.jpg?thumb=1&w=500&h=200", 378 | cate_name: "家电", 379 | cate_list: [{ 380 | item_img: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/a9370fface3457e13c0db169f650fa05.png?thumb=1&w=120&h=120", 381 | item_name: "电饭煲" 382 | }, 383 | { 384 | item_img: "https://i1.mifile.cn/v1/a1/T1hyAgB_VT1R4cSCrK!120x120.png", 385 | item_name: "净水器" 386 | }, 387 | { 388 | item_img: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/41c838f5587ef2e6d0a8e1a18a86bace.png?thumb=1&w=120&h=120", 389 | item_name: "净化器" 390 | }, 391 | { 392 | item_img: "https://i8.mifile.cn/v1/a1/101e2128-624d-ce9f-973f-50b868f8036a!120x120.png", 393 | item_name: "扫地机器人" 394 | }, 395 | { 396 | item_img: "https://i8.mifile.cn/b2c-mimall-media/fcc4ecc8a1f9c02387b4bd3658d2dea0!120x120.jpg", 397 | item_name: "米家投影仪" 398 | }, 399 | { 400 | item_img: "https://i8.mifile.cn/v1/a1/91cd8c44-11ca-79bd-429f-de882bdeaf3b!120x120.png", 401 | item_name: "电水壶" 402 | } 403 | ] 404 | }, 405 | { 406 | id: "router", 407 | banner: "https://i8.mifile.cn/v1/a1/efdcf401-f553-aef7-1751-43854b6f4a20!500x200.webp", 408 | cate_name: "电脑", 409 | cate_list: [{ 410 | item_img: "https://i8.mifile.cn/b2c-mimall-media/ccad3ac9a43a21a606a392cf6a14b091!120x120.jpg", 411 | item_name: "游戏本" 412 | }, 413 | { 414 | item_img: "https://i8.mifile.cn/b2c-mimall-media/0643559b70964014c1d672cc783121d2!120x120.jpg", 415 | item_name: "笔记本15.6''" 416 | }, 417 | { 418 | item_img: "https://i8.mifile.cn/v1/a1/8a9485f0-3b11-9d50-cbaa-1ee1cc0936cd!120x120.png", 419 | item_name: "笔记本13.3''" 420 | }, 421 | { 422 | item_img: "https://i8.mifile.cn/v1/a1/78e8a82a-1ef7-453b-5a07-d8394081ae2e!120x120.png", 423 | item_name: "笔记本12.5''" 424 | } 425 | ] 426 | } 427 | ], 428 | phone: { 429 | phone_slides: [{ 430 | id: 3, 431 | slide_url: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/f6503426aa32ed960b51475585013208.jpg?thumb=1&w=720&h=360" 432 | }, 433 | { 434 | id: 2, 435 | slide_url: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/9129d21aed81442ca895893ada045f6b.jpg?thumb=1&w=720&h=360" 436 | } 437 | ], 438 | goods_list: [{ 439 | id: 4, 440 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/c0bd24d4f71813791c2987e4bf41696d.jpg?thumb=1&w=360&h=360", 441 | header: "红米5A,轻巧长续航", 442 | description: "高通骁龙处理器", 443 | meta: "569元", 444 | discount: "599元", 445 | is_new: false, 446 | on_sale: true, 447 | prop: "500元-1000元" 448 | }, 449 | { 450 | id: 5, 451 | goods_cover: "https://i8.mifile.cn/v1/a1/e7853ea5-1260-6cb2-91ed-2c539a87db0a!360x360.webp", 452 | header: "红米5,4GB+32GB", 453 | description: "千元全面屏", 454 | meta: "999元", 455 | discount: "1099元", 456 | is_new: false, 457 | on_sale: true, 458 | prop: "500元-1000元" 459 | }, 460 | { 461 | id: 1, 462 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/850d316b25648c9862c7c22aefba9280.jpg?thumb=1&w=360&h=360", 463 | header: "红米Note5,4GB+64GB", 464 | description: "1.4μm大像素AI双摄", 465 | meta: "1399元", 466 | discount: "", 467 | is_new: false, 468 | prop: "1000元-2000元" 469 | }, 470 | { 471 | id: 6, 472 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/8612f157af2c116b7e3fc47356cdb7be.jpg?thumb=1&w=360&h=360", 473 | header: "红米自拍手机S2", 474 | description: "1600万像素自拍手机", 475 | meta: "999元", 476 | discount: "", 477 | is_new: true, 478 | prop: "500元-1000元" 479 | }, 480 | { 481 | id: 10, 482 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/bb34c2bb89ecd66885e2ac15e6278d71.jpg?thumb=1&w=360&h=360", 483 | header: "红米Note5,6GB+64GB", 484 | description: "1.4μm大像素AI双摄", 485 | meta: "1699元", 486 | discount: "", 487 | is_new: false, 488 | prop: "1000元-2000元" 489 | }, 490 | { 491 | id: 9, 492 | goods_cover: "https://i8.mifile.cn/v1/a1/7d04d143-a95c-0c1c-7c37-1ee23ae9906e!360x360.webp", 493 | header: "小米MIX2 全陶瓷 黑色", 494 | description: "Unibody 全陶瓷", 495 | meta: "3699元", 496 | discount: "4699元", 497 | is_new: false, 498 | on_sale: true, 499 | prop: "3000元-4000元" 500 | }, 501 | { 502 | id: 11, 503 | goods_cover: "https://i8.mifile.cn/v1/a1/d5c8ea24-5290-46e0-8064-7634b4cbad70!360x360.webp", 504 | header: "小米Max2 大屏大电量", 505 | description: "6.44''大屏,5300mAh大电量", 506 | meta: "1299元", 507 | discount: "1399元", 508 | is_new: false, 509 | on_sale: true, 510 | prop: "1000元-2000元" 511 | }, 512 | { 513 | id: 12, 514 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/53d32c5e55cba00b473b48908c571f02.jpg?thumb=1&w=360&h=360", 515 | header: "小米MIX 2S", 516 | description: "骁龙845旗舰处理器,AI双摄", 517 | meta: "3299元", 518 | discount: "", 519 | is_new: false, 520 | on_sale: false, 521 | prop: "3000元-4000元" 522 | } 523 | ] 524 | }, 525 | tv: { 526 | tv_slides: [{ 527 | id: 32, 528 | slide_url: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/10604493bd0a6ee1c199d3de719fe2b9.jpg?thumb=1&w=720&h=360" 529 | }, 530 | { 531 | id: 33, 532 | slide_url: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/1278e5f5a95b65dc691e5828dd07c37b.jpg?thumb=1&w=720&h=360" 533 | } 534 | ], 535 | goods_list: [{ 536 | id: 33, 537 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/1ead740b0b821cc3fe5f9f8161cc4fa3.jpg?thumb=1&w=360&h=360", 538 | header: "55''电视4s曲面", 539 | description: "4K曲面屏，金属机身", 540 | meta: "3299元", 541 | discount: "", 542 | is_new: true, 543 | on_sale: false, 544 | prop: "55寸" 545 | }, 546 | { 547 | id: 34, 548 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/1dc556d954f0bf0961cb292168e48470.jpg?thumb=1&w=360&h=360", 549 | header: "小米电视4X 55英寸", 550 | description: "4K HDR,人工智能语言", 551 | meta: "2499元", 552 | discount: "2799元", 553 | is_new: true, 554 | on_sale: true, 555 | prop: "55寸" 556 | }, 557 | { 558 | id: 35, 559 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/1ead740b0b821cc3fe5f9f8161cc4fa3.jpg?thumb=1&w=360&h=360", 560 | header: "55''电视4s曲面", 561 | description: "4K曲面屏，金属机身", 562 | meta: "3299元", 563 | discount: "", 564 | is_new: true, 565 | on_sale: false, 566 | prop: "55寸" 567 | }, 568 | { 569 | id: 36, 570 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/1ead740b0b821cc3fe5f9f8161cc4fa3.jpg?thumb=1&w=360&h=360", 571 | header: "55''电视4s曲面", 572 | description: "4K曲面屏，金属机身", 573 | meta: "3299元", 574 | discount: "", 575 | is_new: true, 576 | on_sale: false, 577 | prop: "55寸" 578 | } 579 | ] 580 | }, 581 | computer: { 582 | pc_slides: [{ 583 | id: 51, 584 | slide_url: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/0bfdd8acf9f162f49cb66af4b11aff64.jpg?thumb=1&w=720&h=360" 585 | }, 586 | { 587 | id: 52, 588 | slide_url: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/9c915442df846aac8edd187c77dce7a9.jpg?thumb=1&w=720&h=360" 589 | }, 590 | { 591 | id: 53, 592 | slide_url: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/b526966d7edc958f00b64ea7a5d5a334.jpg?thumb=1&w=720&h=360" 593 | } 594 | ], 595 | cover: [{ 596 | cover_title:"https://i8.mifile.cn/v1/a1/77812e55-c125-d282-15e2-652f1ca10f17!720x80.webp", 597 | cover_list: [{ 598 | id: 51, 599 | cover_img: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/3bf3eaae2e188422e76a20ac28bb5476.jpg?thumb=1&w=720&h=360", 600 | header: "游戏本 15.6''i5 8GB GTX 1050Ti", 601 | description: "电竞级性能怪兽，冷酷到底的散热系统", 602 | meta: "5999元", 603 | discount: "" 604 | }, 605 | { 606 | id: 52, 607 | cover_img: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/5e2b058695f8405c9ce6bd5ab1be828f.jpg?thumb=1&w=720&h=360", 608 | header: "游戏本 15.6'' i7 GTX 1060 16GB", 609 | description: "电竞级性能怪兽，冷酷到底的散热系统", 610 | meta: "8999元", 611 | discount: "" 612 | } 613 | ], 614 | }, 615 | { 616 | cover_title:"https://i8.mifile.cn/v1/a1/94f27f95-5aef-0d25-e9ca-b9c6777dd9c8!720x80.webp", 617 | cover_list:[ 618 | { 619 | id: 53, 620 | cover_img: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/f68685201bbaebc03a16ea5bfa308eb2.jpg?thumb=1&w=720&h=360", 621 | header: "13.3''笔记本 四核i7 2G 独显 银色", 622 | description: "四核增强版，带独立显卡的轻薄笔记本", 623 | meta: "5999元", 624 | discount: "" 625 | }, 626 | { 627 | id: 54, 628 | cover_img: "https://i8.mifile.cn/v1/a1/21647f78-b335-55c1-2a1d-83c273624436!720x360.webp", 629 | header: "15.6''笔记本Pro i5 8GB", 630 | description: "更强悍的专业笔记本,全金属强化机身", 631 | meta: "4999元", 632 | discount: "5599元" 633 | } 634 | ] 635 | }], 636 | 637 | goods_list: [ 638 | { 639 | id: 55, 640 | goods_cover: "https://i8.mifile.cn/v1/a1/28bf863f-1c2d-52b8-a2e5-186dfcbaad1e!360x360.webp", 641 | header: "12.5''笔记本Air 256GB", 642 | description: "轻薄长续航，金属机身", 643 | meta: "3999元", 644 | discount: "", 645 | is_new: false, 646 | on_sale: false, 647 | prop: "12.5寸" 648 | }, 649 | { 650 | id: 56, 651 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/a08206511288288a084b0461fc3aa4e0.jpg?thumb=1&w=360&h=360", 652 | header: "13.3''笔记本四核i7 独显", 653 | description: "带独立显卡的轻薄笔记本", 654 | meta: "5999元", 655 | discount: "", 656 | is_new: false, 657 | on_sale: false, 658 | prop: "13.3寸" 659 | }, 660 | { 661 | id: 57, 662 | goods_cover: "https://i8.mifile.cn/v1/a1/82488d9e-b7ec-c845-e9d7-4e03f5c5e272!360x360.webp", 663 | header: "15.6''笔记本i7 8GB", 664 | description: "全新高新能独显", 665 | meta: "5999元", 666 | discount: "6399元", 667 | is_new: false, 668 | on_sale: true, 669 | prop: "15.6寸" 670 | }, 671 | { 672 | id: 58, 673 | goods_cover: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/3b06702e8e7421404c8c6b0446bfbf3d.jpg?thumb=1&w=360&h=360", 674 | header: "游戏本15.6'' i7 8GB", 675 | description: "i7标压处理器", 676 | meta: "7999元", 677 | discount: "", 678 | is_new: false, 679 | on_sale: false, 680 | prop: "15.6寸" 681 | } 682 | ] 683 | }, 684 | goodsDetail:[ 685 | { 686 | id:1, 687 | goods_slides:[ 688 | { 689 | id:10001, 690 | slide_url:"https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/6efc52e32da7595519d9907cc124a50c.jpg?thumb=1&w=720&h=792" 691 | }, 692 | { 693 | id:10002, 694 | slide_url:"https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/2764f1f61a5a7691ee5f4998e6e83666.jpg?thumb=1&w=720&h=792" 695 | }, 696 | { 697 | id:10003, 698 | slide_url:"https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/9b0900deeb89fb9b2ee8faa239a27380.jpg?thumb=1&w=720&h=792" 699 | }, 700 | { 701 | id:10004, 702 | slide_url:"https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/9362d30184248bf9145c6786529fd23b.jpg?thumb=1&w=720&h=792" 703 | } 704 | ], 705 | header:"红米Note5", 706 | description:"骁龙636 八核处理器/1.4μm大像素AI双摄/1300万柔光自拍", 707 | meta:"1399元", 708 | default:["4GB+64GB","黑色",1,"1399元"], 709 | attr_list:{ 710 | version:[ 711 | {name:"4GB+64GB",value:["4GB+64GB","1399元"]}, 712 | {name:"3GB+32GB",value:["3GB+32GB","1099元"]}, 713 | {name:"6GB+64GB",value:["6GB+64GB","1699元"]} 714 | ], 715 | color:[ 716 | {name:"gold",value:"金色"}, 717 | {name:"black",value:"黑色"}, 718 | {name:"rosegold",value:"玫瑰金"}, 719 | {name:"magicblue",value:"魔力蓝"} 720 | ] 721 | }, 722 | intro_img:[ 723 | "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/63bcf275fd8393325c6f343b3c89e5c9.jpg?w=1080&h=1735", 724 | "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/bfb8f59814fa33003e94451eeaba0f9f.jpg?w=1080&h=1397", 725 | "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/202a31934625738bb2e10dcdd2d28118.jpg?w=1080&h=1800" 726 | ], 727 | parameter_img:[ 728 | "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/2b1d86380567e3092d577c5698ca025a.jpg?w=1080&h=1238", 729 | "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/8dfb79b2c0ba1a1752964d96ea4ea8fb.jpg?w=1080&h=889", 730 | "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/56c4549d3ff8af86909967947df9abdc.jpg?w=1080&h=1202", 731 | "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/df29e079ea99085bd54d0434f11cd133.jpg?w=1080&h=2469" 732 | ] 733 | }, 734 | { 735 | id:4, 736 | goods_slides:[ 737 | { 738 | id:40001, 739 | slide_url:"https://i8.mifile.cn/v1/a1/9c989247-4871-f667-ede0-4ac233e9c410!720x792.webp" 740 | }, 741 | { 742 | id:40002, 743 | slide_url:"https://i8.mifile.cn/v1/a1/93684422-b7af-34dd-fbaa-8feb576cdd55!720x792.webp" 744 | }, 745 | { 746 | id:40003, 747 | slide_url:"https://i8.mifile.cn/v1/a1/8f89e97c-495e-4432-168e-e257340d854b!720x792.webp" 748 | }, 749 | { 750 | id:40004, 751 | slide_url:"https://i8.mifile.cn/v1/a1/0017106d-af70-0e60-d0e2-e5d0dc24b7c5!720x792.webp" 752 | } 753 | ], 754 | header:"红米5A", 755 | description:"8天超长待机/137g轻巧机身/高通骁龙处理器", 756 | meta:"599元", 757 | default:["2GB+16GB","铂银灰",1,"599元"], 758 | attr_list:{ 759 | version:[ 760 | {name:"2GB+16GB",value:["2GB+16GB","599元"]}, 761 | {name:"3GB+32GB",value:["3GB+32GB","699元"]} 762 | ], 763 | color:[ 764 | {name:"grey",value:"铂银灰"}, 765 | {name:"gold",value:"香槟金"}, 766 | {name:"pink",value:"樱花粉"}, 767 | {name:"skyblue",value:"浅蓝色"} 768 | ] 769 | }, 770 | intro_img:[ 771 | "https://img.alicdn.com/imgextra/i3/1714128138/TB2E9cUiqagSKJjy0FhXXcrbFXa_!!1714128138.jpg", 772 | "https://img.alicdn.com/imgextra/i2/1714128138/TB2n6XdiPuhSKJjSspmXXcQDpXa_!!1714128138.jpg" 773 | ], 774 | parameter_img:[ 775 | "https://img.alicdn.com/imgextra/i2/1714128138/TB2LjddiPuhSKJjSspmXXcQDpXa_!!1714128138.jpg", 776 | "https://img.alicdn.com/imgextra/i1/1714128138/TB2uL9iqkOWBuNjSsppXXXPgpXa_!!1714128138.jpg" 777 | ] 778 | }, 779 | { 780 | id:5, 781 | goods_slides:[ 782 | { 783 | id:50001, 784 | slide_url:"https://i8.mifile.cn/v1/a1/7dc38112-bbf4-f3fa-db39-5f4674f9d0d4!720x792.webp" 785 | }, 786 | { 787 | id:50002, 788 | slide_url:"https://i8.mifile.cn/v1/a1/7d040eee-5569-5074-864d-8c03f073e8c8!720x792.webp" 789 | }, 790 | { 791 | id:50003, 792 | slide_url:"https://i8.mifile.cn/v1/a1/e3980743-9d5d-0a8a-9dab-0a37c8b98ef5!720x792.webp" 793 | }, 794 | { 795 | id:5004, 796 | slide_url:"https://i8.mifile.cn/v1/a1/60acd23a-cd84-700d-a7fe-6bb31e5ff71b!720x792.webp" 797 | } 798 | ], 799 | header: "红米5", 800 | description: "千元全面屏", 801 | meta: "999元", 802 | default:["4GB+32GB","黑",1,"999元"], 803 | attr_list:{ 804 | version:[ 805 | {name:"4GB+32GB",value:["4GB+32GB","999元"]}, 806 | {name:"3GB+32GB",value:["3GB+32GB","799元"]}, 807 | {name:"2GB+16GB",value:["2GB+16GB","699元"]} 808 | ], 809 | color:[ 810 | {name:"black",value:"黑"}, 811 | {name:"gold",value:"金"}, 812 | {name:"rosegold",value:"玫瑰金"}, 813 | {name:"skyblue",value:"浅蓝色"} 814 | ] 815 | }, 816 | intro_img:[ 817 | "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/2132c260499c16d1869eb626e474bf6f.jpg?w=1080&h=1911", 818 | "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/5a2b607dedce85d0c297390a1333c092.jpg?w=1080&h=1088", 819 | "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/e46176f155fb31199d39d34a3bd4cf22.jpg?w=1080&h=1920" 820 | ], 821 | parameter_img:[ 822 | "https://i8.mifile.cn/v1/a1/84598e4e-5d4e-46fa-52a4-2fa38b05ec7c.webp?w=1080&h=1349", 823 | "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/6cca4e894e086aa86292f75acd45c783.jpg?w=1080&h=2241" 824 | ] 825 | }, 826 | { 827 | id: 6, 828 | goods_slides:[ 829 | { 830 | id:60001, 831 | slide_url:"https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/36d1b5b0527d8cff72748285ca4e4673.jpg?thumb=1&w=720&h=792" 832 | }, 833 | { 834 | id:60002, 835 | slide_url:"https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/4dc566fd1b772e635e1fea5d7779c62e.jpg?thumb=1&w=720&h=792" 836 | }, 837 | { 838 | id:60003, 839 | slide_url:"https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/090e0ffa1d3fb9f26c1cfd530144dc32.jpg?thumb=1&w=720&h=792" 840 | }, 841 | { 842 | id:6004, 843 | slide_url:"https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/c214fed553480400b4b6600666907f40.jpg?thumb=1&w=720&h=792" 844 | } 845 | ], 846 | header: "红米S2", 847 | description: "1600万像素自拍手机", 848 | meta: "999元", 849 | default:["4GB+32GB","香槟金",1,"999元"], 850 | attr_list:{ 851 | version:[ 852 | {name:"4GB+32GB",value:["4GB+32GB","999元"]}, 853 | {name:"4GB+64GB",value:["4GB+64GB","1299元"]} 854 | ], 855 | color:[ 856 | {name:"gold",value:"香槟金"}, 857 | {name:"rosegold",value:"玫瑰金"}, 858 | {name:"grey",value:"铂银灰"} 859 | ] 860 | }, 861 | intro_img:[ 862 | "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/589cab2d8aa1f7e5b805dba1b23cbb7b.jpg?w=1080&h=1920", 863 | "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/33a832d53ad9fa3fc5eac771276194ac.jpg?w=1080&h=1440" 864 | ], 865 | parameter_img:[ 866 | "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/9b554b28a9ae5e41b7e17f25b8f8524d.jpg?w=1080&h=1232", 867 | "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/9779491fe66188e1111e6a744993dc3e.jpg?w=1080&h=903" 868 | ] 869 | }, 870 | { 871 | id:8, 872 | goods_slides:[ 873 | { 874 | id:80001, 875 | slide_url:"https://i8.mifile.cn/v1/a1/2da996b7-4b5d-0b42-917d-fdb27db12dc9!720x792.webp" 876 | }, 877 | { 878 | id:80002, 879 | slide_url:"https://i8.mifile.cn/v1/a1/090d6b69-5d8b-2895-85f2-13c22577bede!720x792.webp" 880 | }, 881 | { 882 | id:80003, 883 | slide_url:"https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/16c29ae096d0d35eaa8a2139b6ed2bd1.jpg?thumb=1&w=720&h=792" 884 | }, 885 | { 886 | id:8004, 887 | slide_url:"https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/a5b5500ba1f1a1ed3eade6d83ccd64b4.jpg?thumb=1&w=720&h=792" 888 | } 889 | ], 890 | header: "小米5X", 891 | description: "5.5''大屏轻薄全金属", 892 | meta: "1299元", 893 | default:["4GB+32GB","香槟金",1,"1299元"], 894 | attr_list:{ 895 | version:[ 896 | {name:"4GB+32GB",value:["4GB+32GB","1299元"]}, 897 | {name:"4GB+64GB",value:["4GB+64GB","1499元"]} 898 | ], 899 | color:[ 900 | {name:"gold",value:"金色"}, 901 | {name:"rosegold",value:"玫瑰金"}, 902 | {name:"black",value:"黑色"}, 903 | {name:"red",value:"红色"} 904 | ] 905 | }, 906 | intro_img:[ 907 | "https://i8.mifile.cn/v1/a1/65328196-4db1-0c70-9b7a-8811842117e2.jpg?w=1080&h=1920&s=145.8", 908 | "https://i8.mifile.cn/v1/a1/a746ef21-21fb-0151-c08d-3b461f46a194.jpg?w=1080&h=1920&s=158.1" 909 | ], 910 | parameter_img:[ 911 | "https://i8.mifile.cn/v1/a1/7ec89f6e-b542-3ddb-6433-cf5928cb1263.jpg?w=1080&h=1400&s=107.4", 912 | "https://i8.mifile.cn/v1/a1/9195687e-c747-0bee-a58a-c7badf1e3e52.jpg?w=720&h=1913&s=86.4" 913 | ] 914 | }, 915 | { 916 | id:9, 917 | goods_slides:[ 918 | { 919 | id:90001, 920 | slide_url:"https://i8.mifile.cn/v1/a1/2ec6acfd-6d81-0bbd-191c-830b91802564!720x792.webp" 921 | }, 922 | { 923 | id:90002, 924 | slide_url:"https://i8.mifile.cn/v1/a1/59508b3c-fdb4-70b3-1364-d2260478617c!720x792.webp" 925 | }, 926 | { 927 | id:90003, 928 | slide_url:"https://i8.mifile.cn/v1/a1/ec11c5fb-df45-f78b-90a4-f6012d865830!720x792.webp" 929 | }, 930 | { 931 | id:9004, 932 | slide_url:"https://i8.mifile.cn/v1/a1/2aa2177d-6b9c-70d2-9d71-9bf5679e2eba!720x792.webp" 933 | } 934 | ], 935 | header: "小米MIX2 陶瓷", 936 | description: "Unibody 全陶瓷", 937 | meta: "3699元", 938 | default:["6GB+64GB","黑色",1,"2599元"], 939 | attr_list:{ 940 | version:[ 941 | {name:"6GB+64GB",value:["6GB+64GB","2599元"]}, 942 | {name:"全陶瓷尊享版",value:["全陶瓷尊享版","3499元"]} 943 | ], 944 | color:[ 945 | {name:"black",value:"黑色"} 946 | ] 947 | }, 948 | intro_img:[ 949 | "https://i8.mifile.cn/v1/a1/c5f6d8bb-dbdb-901f-38fc-4cf7aea1fb86.jpg?w=1080&h=1924&s=177.7", 950 | "https://cdn.cnbj0.fds.api.mi-img.com/b2c-mimall-media/c580424ff305584b2287c124bbae8fad.jpg?w=1080&h=1549" 951 | ], 952 | parameter_img:[ 953 | "https://i8.mifile.cn/v1/a1/dbd53e91-75eb-d9e9-0969-326a41435a34.jpg?w=1080&h=1287&s=148.5", 954 | "https://i8.mifile.cn/v1/a1/0ba33fbe-65c9-424a-f1dc-ca219c89a224.jpg?w=1080&h=1623&s=123.5" 955 | ] 956 | } 957 | ], 958 | 959 | 960 | 961 | discovery: [ 962 | { 963 | header: '小米8，一部与众不同的手机', 964 | description: "透明探索版，将科技与美学完美结合", 965 | video: 'https://v.mifile.cn/b2c-mimall-media/ed921294fb62caf889d40502f5b38147.mp4', 966 | image: "https://i1.mifile.cn/a4/xmad_15278351912522_frJQc.jpg", 967 | duration_raw: 74 968 | }, 969 | { 970 | header: '小米MIX 2S，一面科技 一面艺术', 971 | description: "艺术品般陶瓷机身，惊艳、璀璨", 972 | video: 'https://v.mifile.cn/b2c-mimall-media/53fc775dd6b29ecd8df3e2ea35129766.mp4', 973 | image: 'https://i1.mifile.cn/a4/xmad_15278359339164_dDTJC.jpg', 974 | duration_raw: 75, 975 | }, 976 | { 977 | header: '天生丽质的小米6X', 978 | description: "让你一见倾心", 979 | video: 'https://v.mifile.cn/b2c-mimall-media/4c2ab855040d19a0680cb2064097a313.mp4', 980 | image: 'https://i1.mifile.cn/a4/xmad_15278359181775_apkZK.jpg', 981 | duration_raw: 63, 982 | }, 983 | { 984 | header: '生活中无所不在的小爱同学', 985 | description: "一句话搞定手机复杂操作", 986 | video: 'https://v.mifile.cn/b2c-mimall-media/69f7b9881f4ed7123f0d473dcd44d621.mp4', 987 | image: 'https://i1.mifile.cn/a4/xmad_15278358912266_LDHfI.jpg', 988 | duration_raw: 119, 989 | }, 990 | { 991 | header: '小米7年工艺探索之路', 992 | description: "听雷总讲述小米7年工艺探索之路", 993 | video: 'https://v.mifile.cn/b2c-mimall-media/dd431020c9e7bb06a89b6959fa91f97d.mp4', 994 | image: 'https://i1.mifile.cn/a4/cms_14925886078012_gvjFI.jpg', 995 | duration_raw: 168, 996 | }, 997 | { 998 | header: '小米接连斩获国际顶尖设计大奖', 999 | description: "小米接连斩获国际顶尖设计大奖", 1000 | video: 'https://v.mifile.cn/b2c-mimall-media/226dcc759c574b2ddb4d3b1bb4b33de5.mp4', 1001 | image: 'https://i1.mifile.cn/a4/cms_14919861676287_BZesj.jpg', 1002 | duration_raw: 258, 1003 | }, 1004 | { 1005 | 1006 | header: '米兔故事机，能讲故事还能微信互动', 1007 | description: "漂亮的米兔故事机，能讲故事还能微信互动", 1008 | video: 'https://v.mifile.cn/b2c-mimall-media/70ac74dc4a256364fa8e38bed37d4fb8.mp4', 1009 | image: 'https://i1.mifile.cn/a4/cms_14800668624625_HOUlf.jpg', 1010 | duration_raw: 118, 1011 | }, 1012 | { 1013 | header: '菲利普·斯塔克的设计哲学', 1014 | description: "菲利普·斯塔克的设计哲学", 1015 | video: 'https://v.mifile.cn/b2c-mimall-media/0cba092e7b9b0460f5f294bb2fc8345b.mp4', 1016 | image: 'https://i1.mifile.cn/a4/cms_1478139217532_zibhc.jpg', 1017 | duration_raw: 199, 1018 | } 1019 | ] 1020 | } -------------------------------------------------------------------------------- /wxapp-mi-mall/utils/util.js: -------------------------------------------------------------------------------- 1 | const formatTime = date => { 2 | const year = date.getFullYear() 3 | const month = date.getMonth() + 1 4 | const day = date.getDate() 5 | const hour = date.getHours() 6 | const minute = date.getMinutes() 7 | const second = date.getSeconds() 8 | 9 | return [year, month, day].map(formatNumber).join('/') + ' ' + [hour, minute, second].map(formatNumber).join(':') 10 | } 11 | 12 | const formatNumber = n => { 13 | n = n.toString() 14 | return n[1] ? n : '0' + n 15 | } 16 | module.exports = { 17 | formatTime: formatTime 18 | } 19 | --------------------------------------------------------------------------------