| + + | +
+
+ |
+ + + {{productName}} + + | +￥{{productPrice}} | +{{productTotalPrice}} + | ++ - + + + + | ++ 删除 + | +
哪里不对了，刷新下试试吧
'); + } + + +}; + +$(function(){ + page.init(); +}); diff --git a/src/page/cart/index.string b/src/page/cart/index.string new file mode 100644 index 0000000000000000000000000000000000000000..d1dfc952d22242f54676890bb856f1e34cae5f1a --- /dev/null +++ b/src/page/cart/index.string @@ -0,0 +1,92 @@ + {{#notEmpty}} +| + + | +商品信息 | +单价 | +数量 | +合计 | +操作 | +
|---|
| + + | +
+
+ |
+ + + {{productName}} + + | +￥{{productPrice}} | +{{productTotalPrice}} + | ++ - + + + + | ++ 删除 + | +
+ 您的购物车空空如也, + 立即去购物 +
+ {{/notEmpty}} diff --git a/src/page/common/footer/index.css b/src/page/common/footer/index.css new file mode 100644 index 0000000000000000000000000000000000000000..9e834900f369b8e645e9e2846a1dd8ec9b688ac3 --- /dev/null +++ b/src/page/common/footer/index.css @@ -0,0 +1,23 @@ + + +/* +* @Author: root +* @Date: 2017-11-04 22:42:03 +* @Last Modified by: root +* @Last Modified time: 2017-11-16 21:42:24 +*/ +.footer{ + padding-bottom: 10px; +} +.footer .links{ + text-align: center; + color: #666; + line-height: 30px; +} +.footer .links .link{ + padding:0 10px; +} +.footer .copyright{ + text-align: center; + line-height: 30px; +} \ No newline at end of file diff --git a/src/page/common/header/index.css b/src/page/common/header/index.css new file mode 100644 index 0000000000000000000000000000000000000000..ac0c407d82a7f3cb5bd119301eecd24d43b1af62 --- /dev/null +++ b/src/page/common/header/index.css @@ -0,0 +1,48 @@ +/* +* @Author: root +* @Date: 2017-11-05 13:34:24 +* @Last Modified by: root +* @Last Modified time: 2017-11-16 22:01:53 +*/ +/*通用头部导航*/ +.header .logo{ + position: absolute; + left: 50px; + top: 33px; + display: block; + font-size: 38px; + font-weight: bolder; + color: #c60023; + text-decoration: none; +} + +.header .search-con{ + /*顺时针方向*/ + padding: 40px 0 30px 250px; +} +.header .search-con .search-input{ + width: 550px; + height:40px; + line-height: 40px; + padding-left: 10px; + font-size: 15px; + border: 2px solid #c60023; + /*去掉input输入框的样式*/ + outline: none; +} +.header .search-con .search-btn{ + position: absolute; + width: 120px; + height:44px; +} + +/*面包屑导航*/ +.crumb{ + margin-bottom: 15px; + height: 50px; + line-height: 50px; + background: #eee; + color: #888; + font-size: 14px; + border-top: 2px solid #c60023; +} \ No newline at end of file diff --git a/src/page/common/header/index.js b/src/page/common/header/index.js new file mode 100644 index 0000000000000000000000000000000000000000..b52628327ab311e7e53eee779ed4f31acf7f53e7 --- /dev/null +++ b/src/page/common/header/index.js @@ -0,0 +1,54 @@ +/* +* @Author: root +* @Date: 2017-11-05 13:34:13 +* @Last Modified by: root +* @Last Modified time: 2017-11-26 18:10:44 +*/ +'use strict' +require('./index.css'); + +var _util = require('util/util.js'); + +// 通用页面头部 +var header = { + init : function(){ + this.onload(); + this.bindEvent(); + }, + //数据回填 + onload : function(){ + var keyword = _util.getUrlParam('keyword'); + //数据存在则回填数据 + if (keyword) { + $('#search-input').val(keyword); + } + //如果keyword为空则直接返回首页 + + } + , + //点击事件 + bindEvent : function(){ + //点击搜索按钮以后，做搜索提交 + var _this = this; + $("#search-btn").click(function(){ + _this.seachSumit(); + }); + //输入回车后做提交 + $("#search-input").keyup(function(e){ + if (e.keyCode) { + //判断是否是回车 + if (e.keyCode===13) { + _this.searchSubmit(); + } + } + }); + }, + //搜索的提交 + seachSumit : function(){ + var keyword = $.trim($('#search-input').val()); + window.location.href = './list.html?keyword='+keyword+''; + } +}; + + +header.init(); \ No newline at end of file diff --git a/src/page/common/index.js b/src/page/common/index.js new file mode 100644 index 0000000000000000000000000000000000000000..f3da3f48d4191ff03b4b68af90b14d3ae55d50e0 --- /dev/null +++ b/src/page/common/index.js @@ -0,0 +1,12 @@ +/* +* @Author: root +* @Date: 2017-10-30 21:59:04 +* @Last Modified by: root +* @Last Modified time: 2017-11-04 22:50:43 +*/ +'use strict' +require('./layout.css'); +//图标加载 +require('node_modules/font-awesome/css/font-awesome.min.css'); + +require('./footer/index.css'); \ No newline at end of file diff --git a/src/page/common/layout.css b/src/page/common/layout.css new file mode 100644 index 0000000000000000000000000000000000000000..ab1bfc81eb5fa0e3c94474e39f81c0c9e9025866 --- /dev/null +++ b/src/page/common/layout.css @@ -0,0 +1,111 @@ +/* +* @Author: root +* @Date: 2017-11-02 22:33:47 +* @Last Modified by: root +* @Last Modified time: 2017-11-16 22:29:57 +*/ +/* css reset*/ +*{ + margin: 0; + padding: 0; +} +body{ + background: #f6f6f6; + font: 12px/1.5 tahoma,arial,Microsoft YaHei,sans-serif; +} +li{ + list-style: none;; +} +img{ + display: block; + bottom: none ; +} +label{ + cursor: pointer; +} +input[type='checbox']{ + cursor: pointer; +} +/*定宽布局*/ +.w{ + width: 1080px; + margin: 0px auto; + position: relative; + overflow: hidden; + +} + +/* panel */ +.panel{ + padding: 10px; + margin-bottom: 10px; + background: #fff; + +} +.panel .panel-title{ + padding: 10px; + font-size: 14px; + color: #666; + font-weight: bold; + border-bottom: 1px solid #eee; + overflow: hidden; +} +.panel .panel-body{ + padding: 10px; + overflow: hidden; +} + +.large .w{ + width: 1600px; +} +/*全局通用样式*/ +.hide{ + display: none; +} +/*超链样式*/ +.link{ + color:#999; + cursor: pointer; + text-decoration:none; +} +.link:hover{ + color: #e80012; +} +.link-text{ + color: #999; + text-decoration: none; +} +/* btn */ +.btn{ + display: inline-block; + padding: 0 20px; + height: 40px; + line-height: 40px; + vertical-align: middle; + border: none; + background: #c60023; + font-size:17px; + font-weight: bold; + color: #fff; + outline:none; + cursor: pointer; + text-decoration: none; +} +.btn-mini{ + height: 25px; + line-height: 25px; + font-size: 12px; + padding: 0 10px; +} +/* loading */ +.loading{ + margin:10px auto; + display: block; + width: 100px; + height: 100px; + background:url(../../image/loading.gif) no-repeat; + /*border:1px solid #ddd;*/ + border-radius: 5px; + opacity: .6; +} + diff --git a/src/page/common/nav-side/index.css b/src/page/common/nav-side/index.css new file mode 100644 index 0000000000000000000000000000000000000000..dc66f634eaa1f4c4a365308d620091baa7036cd8 --- /dev/null +++ b/src/page/common/nav-side/index.css @@ -0,0 +1,30 @@ + +/* +* @Author: root +* @Date: 2017-11-05 16:18:28 +* @Last Modified by: root +* @Last Modified time: 2017-12-06 23:19:07 +*/ +/*导航主体*/ +.nav-side { + float: left; + width: 130px; + min-height: 100px; + +} +.nav-side .nav-item { + line-height: 25px; + font-size: 13px; +} + +.nav-side .nav-item .link{ + color: #888; +} +.nav-side .nav-item.active .link{ + color: #c60023; +} +/*右侧内容区*/ +.content.with-nav { + float: left; + width: 950px; +} diff --git a/src/page/common/nav-side/index.js b/src/page/common/nav-side/index.js new file mode 100644 index 0000000000000000000000000000000000000000..ac5d49ede079dcdef3121b1f4566d63af75f6f48 --- /dev/null +++ b/src/page/common/nav-side/index.js @@ -0,0 +1,43 @@ +/* +* @Author: root +* @Date: 2017-11-05 16:16:48 +* @Last Modified by: root +* @Last Modified time: 2017-11-05 18:37:47 +*/ +'use strict'; +require('./index.css'); +var _util = require('util/util.js'); +var templateIndex = require('./index.string'); +// 导航 +var navSide = { + option : { + name : '', + navList : [ + {name : 'user-center', desc : '个人中心', href: './user-center.html'}, + {name : 'order-list', desc : '我的订单', href: './order-list.html'}, + {name : 'user-pass-update', desc : '修改密码', href: './user-pass-update.html'}, + {name : 'about', desc : '关于SHOP', href: './about.html'} + ] + }, + init : function(option){ + $.extend(this.option,option); + this.renderNav(); + }, + // 渲染导航菜单 + renderNav : function(){ + // 计算active数据 + for(var i = 0, iLength = this.option.navList.length; i < iLength; i++){ + if(this.option.navList[i].name === this.option.name){ + this.option.navList[i].isActive = true; + } + }; + // 渲染list数据 + var navHtml = _util.renderHtml(templateIndex, { + navList : this.option.navList + }); + // 把html放入容器 + $('.nav-side').html(navHtml); + } +}; + +module.exports = navSide; \ No newline at end of file diff --git a/src/page/common/nav-side/index.string b/src/page/common/nav-side/index.string new file mode 100644 index 0000000000000000000000000000000000000000..150f1d8ba04424e8015fe51937cb19a244a1ef6b --- /dev/null +++ b/src/page/common/nav-side/index.string @@ -0,0 +1,10 @@ +{{#navList}} +{{#isActive}} +此商品太淘气，找不到了
'); + }); + }, + filter : function(data){ + data.subImages = data.subImages.split(','); + } + +}; + +$(function(){ + page.init(); +}); diff --git a/src/page/detail/index.string b/src/page/detail/index.string new file mode 100644 index 0000000000000000000000000000000000000000..aa2f979adff9fb016918b8e16c37df501d5f7802 --- /dev/null +++ b/src/page/detail/index.string @@ -0,0 +1,45 @@ +{{subtitle}}
+很抱歉，实在找不到您要的商品。
+{{/list}} \ No newline at end of file diff --git a/src/page/module.js b/src/page/module.js new file mode 100644 index 0000000000000000000000000000000000000000..d971ee013eac1ab40c7edccbad8700864e006034 --- /dev/null +++ b/src/page/module.js @@ -0,0 +1,10 @@ + /* +* @Author: root +* @Date: 2017-10-30 21:55:15 +* @Last Modified by: root +* @Last Modified time: 2017-11-05 13:41:56 +*/ +'use strict'; +module.exports = { + test:1234 +} \ No newline at end of file diff --git a/src/page/order-confirm/address-list.string b/src/page/order-confirm/address-list.string new file mode 100644 index 0000000000000000000000000000000000000000..606829ae5b7ac2439e977f5598761ee80428b98b --- /dev/null +++ b/src/page/order-confirm/address-list.string @@ -0,0 +1,25 @@ +{{#list}} +{{#isActive}} +地址加载失败，请刷新后重新
'); + }); + }, + //加载商品清单 + loadProductList : function(){ + var _this = this; + $('.product-con').html(''); + //获取地址列表 + _order.getProductList(function(res){ + var productListHtml = _utils.renderHtml(templateProduct,res); + $('.product-con').html(productListHtml); + },function(errMsg){ + $('.product-con').html('商品信息加载失败，请刷新后重新
'); + }); + }, + //处理地址列表选中状态 + addressFilter : function(){ + if(this.data.selectAddressId){ + var selectAddressFlag = false; + for(var i=0,length = data.list.length;i'+errMsg+'
'); + }); + },//数据的适配 + dataFilter : function(data){ + data.needPay = data.status == 10; + data.isCancelable = data.status == 10; + + } + +}; +$(function(){ + page.init(); +}); \ No newline at end of file diff --git a/src/page/order-detail/index.string b/src/page/order-detail/index.string new file mode 100644 index 0000000000000000000000000000000000000000..df8f72d0e9b8cbf781df5728a4cff4e8c6468f98 --- /dev/null +++ b/src/page/order-detail/index.string @@ -0,0 +1,70 @@ +| + | 商品信息 | +单价 | +数量 | +小计 | +
|---|---|---|---|---|
|
+
+ |
+ + {{productName}} + | +￥{{currentUnitPrice}} | +{{quantity}} | +￥{{totalPrice}} | +
+ 订单总价: + ￥{{payment}} +
+加载订单失败，请刷新后看看
'); + }); + }, + //加载分页信息 + loadPagination : function(pageInfo){ + var _this = this; + this.pagination ? '' : (this.pagination = new Pagination()); + this.pagination.render($.extend({}, pageInfo, { + container: $('.pagination'), + onSelectPage: function (pageNum) { + _this.data.listParam.pageNum = pageNum; + _this.loadOrderList(); + } + })); + } + +}; +$(function(){ + page.init(); +}); \ No newline at end of file diff --git a/src/page/order-list/index.string b/src/page/order-list/index.string new file mode 100644 index 0000000000000000000000000000000000000000..4a8eb46b460ed699875b6f2dbc975552e3e81206 --- /dev/null +++ b/src/page/order-list/index.string @@ -0,0 +1,54 @@ +| + | 商品信息 | +单价 | +数量 | +小计 | +
|---|
| + + 订单号 + + {{orderNo}} + + + {{createTime}} + 收件人：{{receiverName}} + + 订单状态：{{statusDesc}} + + + 订单总价： + ￥{{payment}} + + + 查看详情 + + + | +||||
|
+
+ |
+ + {{productName}} + | +￥{{currentUnitPrice}} | +{{quantity}} | +￥{{totalPrice}} | +
您暂时还没有订单
+{{/list}} diff --git a/src/page/payment/index.css b/src/page/payment/index.css new file mode 100644 index 0000000000000000000000000000000000000000..edf35dcfb461477f078b12db99d814c3fbdc87e3 --- /dev/null +++ b/src/page/payment/index.css @@ -0,0 +1,32 @@ +/* +* @Author: root +* @Date: 2017-12-09 13:21:46 +* @Last Modified by: root +* @Last Modified time: 2017-12-09 13:40:22 +*/ +.page-wrap{ + background: #fff; + pading:10px 0 25px 0; +} +.payment-tips{ + height: 40px; + line-height:40px; + font-size: 18px; + font-weight: bold; + color: #666; + text-align: center; +} +.payment-tips.enhance{ + color: #c60023; +} +.img-con{ + margin:0 auto; + width: 300px; + height: 300px; + background: #fff; + border:1px solid #ddd; +} +.img-con .qr-code{ + width: 100%; + height: 100%; +} \ No newline at end of file diff --git a/src/page/payment/index.js b/src/page/payment/index.js new file mode 100644 index 0000000000000000000000000000000000000000..0ec025373ecc0b3e933be5502c01ef122d97eaed --- /dev/null +++ b/src/page/payment/index.js @@ -0,0 +1,60 @@ +/* +* @Author: root +* @Date: 2017-12-09 13:21:38 +* @Last Modified by: root +* @Last Modified time: 2017-12-09 14:20:16 +*/ +'use strict'; +require('./index.css'); +require('page/common/nav/index.js'); +require('page/common/header/index.js'); +var _utils = require('util/util.js'); +var _payment = require('service/payment-service.js'); +var templateIndex = require('./index.string'); + +var page = { + data : { + orderNumber : _utils.getUrlParam('orderNumber') + }, + init : function(){ + this.onload(); + + }, + onload : function(){ + + //加载loadPaymentInfo数据 + this.loadPaymentInfo(); + }, + //加载订单列表 + loadPaymentInfo : function(){ + var paymentHtml = '', + _this = this, + $pageWrap = $('.page-wrap'); + //$pageWrap.html(''); + _payment.getPaymentInfo(this.data.orderNumber,function(res){ + + paymentHtml = _utils.renderHtml(templateIndex,res); + //渲染html + $pageWrap.html(paymentHtml); + _this.listenOrderStatus(); + },function(errMsg){ + $pageWrap.html(''+errMsg+'
'); + }); + }, + //监听订单状态 + listenOrderStatus : function(){ + var _this = this; + this.paymentTimer = window.setInterval(function(){ + _payment.getPaymentStatus(_this.data.orderNumber,function(res){ + if(res == true){ + window.location.href + = './result.html?type=payment&orderNumber='+_this.data.orderNumber; + } + }); + },5e3) + } + +}; +$(function(){ + page.init(); +}); diff --git a/src/page/payment/index.string b/src/page/payment/index.string new file mode 100644 index 0000000000000000000000000000000000000000..e9f69dce85addc7f0a11cac96d1a52f91a5887a3 --- /dev/null +++ b/src/page/payment/index.string @@ -0,0 +1,6 @@ +订单提交成功，请尽快支付！定单号：{{orderNo}}
+请使用支付宝App扫描如下二维码进行支付:
+←→
').find(".arrows span").click(function(){e.isFunction(n[this.className])&&n[this.className]()})}if(e.event.swipe){this.el.on("swipeleft",n.prev).on("swiperight",n.next)}};this.move=function(t,r){if(!this.items.eq(t).length)t=0;if(t<0)t=this.items.length-1;var i=this.items.eq(t);var s={height:i.outerHeight()};var o=r?5:this.opts.speed;if(!this.ul.is(":animated")){n.el.find(".dot:eq("+t+")").addClass("active").siblings().removeClass("active");this.el.animate(s,o)&&this.ul.animate(e.extend({left:"-"+t+"00%"},s),o,function(i){n.current=t;e.isFunction(n.opts.complete)&&!r&&n.opts.complete(n.el)})}};this.start=function(){n.interval=setInterval(function(){n.move(n.current+1)},n.opts.delay)};this.stop=function(){n.interval=clearInterval(n.interval);return n};this.keys=function(t){var r=t.which;var i={37:n.prev,39:n.next,27:n.stop};if(e.isFunction(i[r])){i[r]()}};this.next=function(){return n.stop().move(n.current+1)};this.prev=function(){return n.stop().move(n.current-1)};this.dots=function(){var t='%>)
+
+ %>)
+
+ %>)
+
+ %>)
+
+ %>)
+
+ %>)
+
+ %>)
+
+ %>)
+
+ %>)
+
+ %>)
+
+ %>)
+
+ %>)
+
+ %>)
+
+ %>)
+
+ %>)
+
+ %>)
+
+ %>)
+
+ %>)
+
+ %>)
+
+ %>)
+
+ 
+ 
+ 
+ 
+ 
+ %>)
+ %>)
+ %>)
+ %>)
+ %>)
+