Authored by ccbikai

地址管理优化

@@ -16,10 +16,34 @@ var $action = $('.action'), @@ -16,10 +16,34 @@ var $action = $('.action'),
16 $area = $('.area'), 16 $area = $('.area'),
17 $footer = $('#yoho-footer'), 17 $footer = $('#yoho-footer'),
18 $confim = $('.confim-mask'), 18 $confim = $('.confim-mask'),
  19 + $pageWrap = $('.page-wrap'),
  20 + $backBtn = $('.nav-back'),
19 isSubmiting, 21 isSubmiting,
20 deleteId, 22 deleteId,
  23 + currentPage = 'address',
21 newArea = []; 24 newArea = [];
22 25
  26 +// 清除原有链接
  27 +$backBtn.attr('href', 'javascript:void(0);');
  28 +
  29 +// 自定义事件
  30 +$backBtn.on('touchend', function(e) {
  31 + console.log(currentPage);
  32 + if (currentPage === 'edit') {
  33 + $pageWrap.hide();
  34 + $pageWrap.first().show();
  35 + e.preventDefault();
  36 + currentPage = 'address';
  37 + } else if (currentPage === 'list') {
  38 + $pageWrap.hide();
  39 + $editAddressPage.show();
  40 + e.preventDefault();
  41 + currentPage = 'edit';
  42 + } else {
  43 + window.history.go(-1);
  44 + }
  45 +});
  46 +
23 function editAddress(data) { 47 function editAddress(data) {
24 data = data || {}; 48 data = data || {};
25 $addressForm.find('[name="id"]').val(data.id || ''); 49 $addressForm.find('[name="id"]').val(data.id || '');
@@ -28,7 +52,10 @@ function editAddress(data) { @@ -28,7 +52,10 @@ function editAddress(data) {
28 $addressForm.find('[name="area_code"]').val(data.areaCode || ''); 52 $addressForm.find('[name="area_code"]').val(data.areaCode || '');
29 $addressForm.find('[name="area"]').val(data.area || ''); 53 $addressForm.find('[name="area"]').val(data.area || '');
30 $addressForm.find('[name="address"]').val(data.address || ''); 54 $addressForm.find('[name="address"]').val(data.address || '');
  55 +
  56 + currentPage = 'edit';
31 $footer.hide(); 57 $footer.hide();
  58 + $pageWrap.hide();
32 $editAddressPage.show(); 59 $editAddressPage.show();
33 } 60 }
34 61
@@ -128,11 +155,15 @@ $addressForm.on('submit', function() { @@ -128,11 +155,15 @@ $addressForm.on('submit', function() {
128 // 省市区 155 // 省市区
129 $area.on('touchend', function() { 156 $area.on('touchend', function() {
130 $footer.hide(); 157 $footer.hide();
  158 + $pageWrap.hide();
131 $addressListPage.show(); 159 $addressListPage.show();
  160 + currentPage = 'list';
132 }); 161 });
133 162
134 $addressListPage.on('touchend', '.address', function() { 163 $addressListPage.on('touchend', '.address', function() {
135 - newArea.push($(this).children('.caption').text()); 164 + var caption = $(this).children('.caption').text();
  165 +
  166 + newArea.push(caption);
136 $(this).siblings().hide(); 167 $(this).siblings().hide();
137 $(this).children('ul').show(); 168 $(this).children('ul').show();
138 return false; 169 return false;
@@ -143,11 +174,13 @@ $addressListPage.on('touchend', '.address', function() { @@ -143,11 +174,13 @@ $addressListPage.on('touchend', '.address', function() {
143 $('[name="area"]').val(newArea.join(' ')); 174 $('[name="area"]').val(newArea.join(' '));
144 $('[name="area_code"]').val($(this).data('id')); 175 $('[name="area_code"]').val($(this).data('id'));
145 176
  177 + $editAddressPage.show();
  178 + currentPage = 'edit';
  179 +
146 // 恢复默认的三级选择 180 // 恢复默认的三级选择
147 $addressListPage.hide(); 181 $addressListPage.hide();
148 $addressListPage.find('ul').hide(); 182 $addressListPage.find('ul').hide();
149 $addressListPage.children('ul').show().children('li').show(); 183 $addressListPage.children('ul').show().children('li').show();
150 - $footer.show();  
151 newArea = []; 184 newArea = [];
152 return false; 185 return false;
153 }); 186 });
@@ -99,9 +99,6 @@ @@ -99,9 +99,6 @@
99 } 99 }
100 100
101 .my-edit-address-page { 101 .my-edit-address-page {
102 - position: absolute;  
103 - bottom: 0;  
104 - top: 0;  
105 width: 100%; 102 width: 100%;
106 color: #d0d0d0; 103 color: #d0d0d0;
107 background: #f0f0f0; 104 background: #f0f0f0;
@@ -175,9 +172,6 @@ @@ -175,9 +172,6 @@
175 } 172 }
176 173
177 .my-address-list-page { 174 .my-address-list-page {
178 - position: absolute;  
179 - bottom: 0;  
180 - top: 0;  
181 width: 100%; 175 width: 100%;
182 color: #444; 176 color: #444;
183 background: #fff; 177 background: #fff;
1 {{> layout/header}} 1 {{> layout/header}}
2 <div class="my-address-page yoho-page"> 2 <div class="my-address-page yoho-page">
  3 + <div class="page-wrap">
3 {{# address}} 4 {{# address}}
4 <div class="address-item"> 5 <div class="address-item">
5 <span class="name">{{consignee}}</span> 6 <span class="name">{{consignee}}</span>
@@ -30,6 +31,7 @@ @@ -30,6 +31,7 @@
30 </div> 31 </div>
31 </div> 32 </div>
32 </div> 33 </div>
  34 + </div>
33 {{> me/address/edit-address}} 35 {{> me/address/edit-address}}
34 {{> me/address/address-list}} 36 {{> me/address/address-list}}
35 </div> 37 </div>
1 -<div class="my-address-list-page hide"> 1 +<div class="my-address-list-page page-wrap hide">
2 <ul class="address-list"> 2 <ul class="address-list">
3 {{# addressList}} 3 {{# addressList}}
4 <li class="address"> 4 <li class="address">
1 -<div class="my-edit-address-page hide"> 1 +<div class="my-edit-address-page page-wrap hide">
2 <form class="edit-address"> 2 <form class="edit-address">
3 <input type="hidden" name="id" value=""> 3 <input type="hidden" name="id" value="">
4 <label class="username"> 4 <label class="username">