recharge

www/webapp/o2o/css/recharge.css

@@ -5,14 +5,39 @@
 .spa-page-recharge .rechange-input{
 
 }
+
+.spa-page-recharge .list-content{
+  align-content:flex-start;
+}
+
 .spa-page-recharge .media{
-  width: 33.33%;
-  text-align: center;
+  margin: 3%;
+  float: left;
+  height: 6rem;
   padding: 15px;
+  width: 27.33%;
+  cursor: pointer;
   font-size: 13px;
-  border:1px solid;
+  border: 1px solid;
+  text-align: center;
 }
+.spa-page-recharge .media.on{
+  border: 1px solid red;
+}
+.spa-page-recharge .media input{
+  margin: 0;
+  padding: 0;
+  width: 100%;
+  height: 45px;
+  margin-top: 10%;
+}
+.spa-page-recharge .media .input-title{
 
+}
+.spa-page-recharge .media .rechange-desc{
+  margin-top: 1rem;
+  font-size: 14px;
+}
 .spa-page-recharge .btn-add-recharge{
   clear: both;
 }

www/webapp/o2o/dist/js/page/rechargee.js

@@ -1 +1 @@
-define(["$","template","IScroll","recharge","native","config","user"],function(e,t,n,r,i,s,o){function a(t){t.preventDefault(),e(document).trigger("spa:navigate",{hash:u,pushData:{dontNeedReload:!0}})}var u;return{title:"充值规则",body:"",init:function(t,n){var i=this,s=e(document);i.on("swipeRight",function(e){a.call(this,e)}),e.newTouch(".back-button",function(e){a.call(this,e)},i),i.on("tapBackButton",function(e){a.call(this,e)}),e.newTouch(".pay-agreement",function(e){e.preventDefault(),s.trigger("spa:navigate",{hash:"activity-text",pushData:{needReload:!0}})},i),e.newTouch(".pay-rule",function(e){e.preventDefault(),s.trigger("spa:navigate",{hash:"activity-rule",pushData:{needReload:!0}})},i),e.newTouch(".btn-add-recharge",function(t){t.preventDefault(),s.trigger("spa:openloader");var n=e(this).attr("data-value");r.addRechargeorder({user_id:o.id,value:"1",recharge_id:e(this).attr("data-id")},function(e){s.trigger("spa:closeloader"),e.success&&(o.orders[1].data.push({id:e.data._id.$id,products:[{product:{name:"充值"+n+"元"}}],final_price:e.data.price}),s.trigger("spa:navigate",{hash:"pay",pushData:{isRecharge:!0,orderID:e.data._id.$id,backHash:"recharge"}}))})},i),n.resolve()},beforeopen:function(e,t){var n=e.pushData;u=n.backHash?n.backHash:"",t.resolve()},afteropen:function(i,o){var u=this,a=e(document);i.pushData.dontNeedReload||(a.trigger("spa:openloader"),r.getRechargeList(function(r){a.trigger("spa:closeloader");if(r.success){var o=t("recharge/index",{showNavBar:!s.isWX,recharges:r.data});e(".spa-page-body",u).html(o);var f=e(".btn-add-recharge").attr("data-index");for(var l=f;l<2;l++);setTimeout(function(){i.scroll=new n("#rechargeScroll")},500)}})),o.resolve()},beforeclose:function(e,t){t.resolve()}}});
+define(["$","template","IScroll","recharge","native","config","user"],function(e,t,n,r,i,s,o){function a(t){t.preventDefault(),e(document).trigger("spa:navigate",{hash:u,pushData:{dontNeedReload:!0}})}var u;return{title:"充值规则",body:"",init:function(t,n){var i=this,s=e(document);i.on("swipeRight",function(e){a.call(this,e)}),e.newTouch(".back-button",function(e){a.call(this,e)},i),i.on("tapBackButton",function(e){a.call(this,e)}),e.newTouch(".pay-agreement",function(e){e.preventDefault(),s.trigger("spa:navigate",{hash:"activity-text",pushData:{needReload:!0}})},i),e.newTouch(".pay-rule",function(e){e.preventDefault(),s.trigger("spa:navigate",{hash:"activity-rule",pushData:{needReload:!0}})},i),e.newTouch(".media",function(t){t.preventDefault();if(e(this).hasClass("on"))return;e(this).addClass("on"),e(this).siblings().removeClass("on"),e(".rechange-input",i).blur()},i),e.newTouch(".btn-add-recharge",function(t){t.preventDefault(),e(".rechange-input",i).blur(),s.trigger("spa:openloader");var n=e(".media.on").attr("data-value"),u=e(".rechange-input").val();r.addRechargeorder({user_id:o.id,value:u,recharge_id:e(".media.on").attr("data-id")},function(e){s.trigger("spa:closeloader"),e.success&&(o.orders[1].data.push({id:e.data._id.$id,products:[{product:{name:"充值"+n+"元"}}],final_price:e.data.price}),s.trigger("spa:navigate",{hash:"pay",pushData:{isRecharge:!0,orderID:e.data._id.$id,backHash:"recharge"}}))})},i),n.resolve()},beforeopen:function(e,t){var n=e.pushData;u=n.backHash?n.backHash:"",t.resolve()},afteropen:function(i,o){var u=this,a=e(document);i.pushData.dontNeedReload||(a.trigger("spa:openloader"),r.getRechargeList(function(r){a.trigger("spa:closeloader");if(r.success){var o=t("recharge/index",{showNavBar:!s.isWX,recharges:r.data});e(".spa-page-body",u).html(o);var f=e(".btn-add-recharge").attr("data-index");for(var l=f;l<2;l++);setTimeout(function(){i.scroll=new n("#rechargeScroll")},500)}})),o.resolve()},beforeclose:function(e,t){t.resolve()}}});

www/webapp/o2o/js/page/pay.js

@@ -130,6 +130,9 @@ define(['$', 'template', 'api', 'native', 'config', 'user'], function ($, templa
                     }
                 }
             }
+            if(orderType=='充值1元'){
+              orderType="其他数额充值";
+            }
             var tpl = template('pay/index', {
                 showNavBar: !config.isWX && !config.isChubao,
                 wxPub: true,

www/webapp/o2o/js/page/rechargee.js

@@ -58,15 +58,32 @@ define(['$', 'template', 'IScroll', 'recharge', 'native', 'config', 'user'], fun
 					}
 				});
 			}, $view);
+			// 样式切换
+			$.newTouch('.media',function (event) {
+				event.preventDefault();
+				/* on代表这一条的选中状态。如果已经选中了，就return。this的作用域是这一条extra。 */
+				if ($(this).hasClass('on')) return;
+				/* 如果没有on状态，加上on。 */
+				$(this).addClass('on');
+				/* 删掉其他选择框的on状态 */
+				$(this).siblings().removeClass('on');
+				// 使input失去焦点
+				$('.rechange-input', $view).blur();
+			},$view);
 			// 点击充值
 			$.newTouch('.btn-add-recharge', function (event) {
 				event.preventDefault();
+				// 使input失去焦点
+				$('.rechange-input', $view).blur();
+				// 加载过度动画
 				$doc.trigger('spa:openloader');
-				var value = $(this).attr('data-value');
+				var value = $('.media.on').attr('data-value');
+				// 获取input值
+				var inputVal=$('.rechange-input').val();
 				recharge.addRechargeorder({
 					user_id: user.id,
-					value:'1',
-					recharge_id: $(this).attr('data-id')
+					value:inputVal,
+					recharge_id: $('.media.on').attr('data-id')
 				}, function (res) {
 					$doc.trigger('spa:closeloader');
 					if (res.success) {

www/webapp/o2o/tpl/recharge/index.html

@@ -12,13 +12,15 @@
             <div class="scroller">
                 <img class="ad-hide" src="http://odulvej8l.bkt.clouddn.com/%E5%85%85%E5%80%BC%E5%8D%A1.jpg"
                      style="width: 100%;">
-                <ul class="ad-hide list-content list-recharge box" style="padding-top: 5px;padding-bottom: 5px">
+                <ul class="ad-hide list-content list-recharge" style="padding-top: 5px;padding-bottom: 5px">
                   {{ each recharges as recharge i }}
                       <li class="media" data-id="{{ recharge.id }}" data-value="{{ recharge.denomination }}"  data-index="{{ i }}">
                           {{ if recharge.denomination === 1 }}
+                            <div class="input-title">其他数额</div>
                             <input type="text" name="" value="" class="rechange-input">
                           {{ else }}
                             <div>充值{{ recharge.denomination }}元</div>
+                            <div class="rechange-desc">{{ recharge.desc }}</div>
                           {{ /if }}
                       </li>
                   {{ /each }}