fe / YOHOBUYPC · Commits

Go to a project

Authored by yyq
Commit 92a81dbe060d122b69628e8a107de60d2d3f5a8f 1 parent f7a045e4

4 level

Inline Side-by-side
Showing 5 changed files with 102 additions and 24 deletions
@@ -125,6 +125,9 @@ @@ -125,6 +125,9 @@
125 <select id="area"> 125 <select id="area">
126 <option value="0">请选择区县</option> 126 <option value="0">请选择区县</option>
127 </select> 127 </select>
  128 + <select id="street">
  129 + <option value="0">请选择乡镇／街道</option>
  130 + </select>
128 <input type="text" value="{{address}}" name="address"> 131 <input type="text" value="{{address}}" name="address">
129 </dd> 132 </dd>
130 <dd> 133 <dd>
@@ -15,6 +15,8 @@ @@ -15,6 +15,8 @@
15 </select> 15 </select>
16 <select name="county"> 16 <select name="county">
17 </select> 17 </select>
  18 + <select name="street">
  19 + </select>
18 <span class="error"><i class="order-icon icon-error"></i><b>请填写完整的省市区信息</b></span> 20 <span class="error"><i class="order-icon icon-error"></i><b>请填写完整的省市区信息</b></span>
19 </li> 21 </li>
20 <li> 22 <li>
@@ -4,7 +4,7 @@ @@ -4,7 +4,7 @@
4 * @date: 2016/02/24 4 * @date: 2016/02/24
5 */ 5 */
6 6
7 -var $ = require('yoho.jquery'), 7 +var $ = require('yoho-jquery'),
8 dialog = require('../common/dialog'), 8 dialog = require('../common/dialog'),
9 Alert = dialog.Alert; 9 Alert = dialog.Alert;
10 10
@@ -19,6 +19,9 @@ var address = { @@ -19,6 +19,9 @@ var address = {
19 // 地区的控件ID 19 // 地区的控件ID
20 areaDomId: 'areaCode', 20 areaDomId: 'areaCode',
21 21
  22 + // 乡镇、街道的控件ID
  23 + streetsDomId: 'streetsCode',
  24 +
22 initDomIds: function(domOptions) { 25 initDomIds: function(domOptions) {
23 var the = this; 26 var the = this;
24 27
@@ -31,6 +34,9 @@ var address = { @@ -31,6 +34,9 @@ var address = {
31 if (domOptions.areaDomId !== undefined) { 34 if (domOptions.areaDomId !== undefined) {
32 the.areaDomId = domOptions.areaDomId; 35 the.areaDomId = domOptions.areaDomId;
33 } 36 }
  37 + if (domOptions.streetsDomId !== undefined) {
  38 + the.streetsDomId = domOptions.streetsDomId;
  39 + }
34 }, 40 },
35 41
36 // 初始化地址数据 42 // 初始化地址数据
@@ -43,7 +49,12 @@ var address = { @@ -43,7 +49,12 @@ var address = {
43 var active, 49 var active,
44 val, 50 val,
45 nId, 51 nId,
46 - selecter; 52 + selecter,
  53 + selectAll;
  54 +
  55 + if (!$toDom.length) {
  56 + return;
  57 + }
47 58
48 $toDom.empty(); 59 $toDom.empty();
49 60
@@ -67,10 +78,14 @@ var address = { @@ -67,10 +78,14 @@ var address = {
67 } 78 }
68 79
69 $toDom.append('<option value="0">' + defaultValue + '</option>'); 80 $toDom.append('<option value="0">' + defaultValue + '</option>');
  81 + if (toDomId === the.streetsDomId) {
  82 + allCode === pCode ? selectAll = 'selected' : selectAll = '';
  83 + $toDom.append('<option value="' + pCode + '" ' + selectAll + '>*全部</option>');
  84 + }
70 for (i in jsonData.options) { 85 for (i in jsonData.options) {
71 if (jsonData.options[i]) { 86 if (jsonData.options[i]) {
72 val = jsonData.options[i]; 87 val = jsonData.options[i];
73 - point = (toDomId === the.areaDomId && val.is_support === 'Y') ? '*' : ''; 88 + point = (toDomId === the.streetsDomId && val.is_support === 'Y') ? '*' : '';
74 nId = val.value; 89 nId = val.value;
75 selecter = ''; 90 selecter = '';
76 91
@@ -99,8 +114,9 @@ var address = { @@ -99,8 +114,9 @@ var address = {
99 return; 114 return;
100 } 115 }
101 116
102 - the.loadAreaData(pCode, the.cityDomId, '请选择城市', pCode); 117 + the.loadAreaData(pCode, the.cityDomId, '请选择城市');
103 $('#' + the.areaDomId).hide(); 118 $('#' + the.areaDomId).hide();
  119 + $('#' + the.streetsDomId).hide().empty();
104 the.showAreaSel(domOptions.dispDomId); 120 the.showAreaSel(domOptions.dispDomId);
105 }); 121 });
106 122
@@ -111,12 +127,21 @@ var address = { @@ -111,12 +127,21 @@ var address = {
111 return; 127 return;
112 } 128 }
113 129
114 - the.loadAreaData(pCode, the.areaDomId, '请选择区县', pCode); 130 + the.loadAreaData(pCode, the.areaDomId, '请选择区县');
115 $('#' + the.areaDomId).show(); 131 $('#' + the.areaDomId).show();
  132 + $('#' + the.streetsDomId).hide().empty();
116 the.showAreaSel(domOptions.dispDomId); 133 the.showAreaSel(domOptions.dispDomId);
117 }); 134 });
118 135
119 $('#' + the.areaDomId).change(function() { 136 $('#' + the.areaDomId).change(function() {
  137 + var pCode = $('#' + the.areaDomId).val();
  138 +
  139 + if (pCode === '0') {
  140 + return;
  141 + }
  142 +
  143 + the.loadAreaData(pCode, the.streetsDomId, '请选择乡镇/街道');
  144 + $('#' + the.streetsDomId).show();
120 the.showAreaSel(domOptions.dispDomId); 145 the.showAreaSel(domOptions.dispDomId);
121 }); 146 });
122 147
@@ -149,12 +174,11 @@ var address = { @@ -149,12 +174,11 @@ var address = {
149 } 174 }
150 }, 175 },
151 176
152 - loadAllData: function(areaCode, domOptions) { 177 + loadAllData: function(areaCode, domOptions, isInit) {
153 var the = this; 178 var the = this;
154 179
155 the.initDomIds(domOptions); 180 the.initDomIds(domOptions);
156 areaCode += ''; 181 areaCode += '';
157 -  
158 if (areaCode < 91) { 182 if (areaCode < 91) {
159 the.loadAreaData(0, the.provinceDomId, '请选择省份', ''); 183 the.loadAreaData(0, the.provinceDomId, '请选择省份', '');
160 $('#' + the.areaDomId).hide(); 184 $('#' + the.areaDomId).hide();
@@ -168,10 +192,22 @@ var address = { @@ -168,10 +192,22 @@ var address = {
168 the.loadAreaData(0, the.provinceDomId, '请选择省份', areaCode); 192 the.loadAreaData(0, the.provinceDomId, '请选择省份', areaCode);
169 the.loadAreaData(areaCode.substr(0, 2), the.cityDomId, '请选择城市', areaCode); 193 the.loadAreaData(areaCode.substr(0, 2), the.cityDomId, '请选择城市', areaCode);
170 the.loadAreaData(areaCode.substr(0, 4), the.areaDomId, '请选择区县', areaCode); 194 the.loadAreaData(areaCode.substr(0, 4), the.areaDomId, '请选择区县', areaCode);
  195 + the.loadAreaData(areaCode.substr(0, 6), the.streetsDomId, '请选择乡镇/街道', areaCode);
171 $('#' + this.areaDomId).show(); 196 $('#' + this.areaDomId).show();
  197 + $('#' + this.streetsDomId).show();
  198 + } else if (areaCode.length === 9) {
  199 + the.loadAreaData(0, the.provinceDomId, '请选择省份', areaCode);
  200 + the.loadAreaData(areaCode.substr(0, 2), the.cityDomId, '请选择城市', areaCode);
  201 + the.loadAreaData(areaCode.substr(0, 4), the.areaDomId, '请选择区县', areaCode);
  202 + the.loadAreaData(areaCode.substr(0, 6), the.streetsDomId, '请选择乡镇/街道', areaCode);
  203 + $('#' + this.areaDomId).show();
  204 + $('#' + this.streetsDomId).show();
172 } 205 }
  206 +
  207 + if (isInit) {
173 the.bindAreaChange(domOptions); 208 the.bindAreaChange(domOptions);
174 } 209 }
  210 + }
175 }; 211 };
176 212
177 module.exports = address; 213 module.exports = address;
@@ -28,7 +28,7 @@ var html = $tpl.html(); @@ -28,7 +28,7 @@ var html = $tpl.html();
28 var active; 28 var active;
29 var dialogMessage = '<p class="message-title"><i class="order-icon {{messageIcon}}"></i>{{messageTitle}}</p><p class="message-summary">{{messageSummary}}</p>'; 29 var dialogMessage = '<p class="message-title"><i class="order-icon {{messageIcon}}"></i>{{messageTitle}}</p><p class="message-summary">{{messageSummary}}</p>';
30 var $dialogEdit = $('#edit-dialog-tpl'); 30 var $dialogEdit = $('#edit-dialog-tpl');
31 -var $addressManage, $province, $city, $county, $selectList, $name, $phone, $address, $telCode, $tel, isProvinceChecked = false; 31 +var $addressManage, $province, $city, $county, $street, $selectList, $name, $phone, $address, $telCode, $tel, isProvinceChecked = false;
32 32
33 function cancelFactory(id) { 33 function cancelFactory(id) {
34 var options = { 34 var options = {
@@ -260,6 +260,7 @@ function newAddress(id) { @@ -260,6 +260,7 @@ function newAddress(id) {
260 $province = $addressManage.find('select[name="province"]'); 260 $province = $addressManage.find('select[name="province"]');
261 $city = $addressManage.find('select[name="city"]'); 261 $city = $addressManage.find('select[name="city"]');
262 $county = $addressManage.find('select[name="county"]'); 262 $county = $addressManage.find('select[name="county"]');
  263 + $street = $addressManage.find('select[name="street"]');
263 $selectList = $addressManage.find('select[name="province"],select[name="city"]'); 264 $selectList = $addressManage.find('select[name="province"],select[name="city"]');
264 $name = $addressManage.find('.inp[name="name"]'); 265 $name = $addressManage.find('.inp[name="name"]');
265 $phone = $addressManage.find('.inp[name="phone"]'); 266 $phone = $addressManage.find('.inp[name="phone"]');
@@ -298,26 +299,35 @@ function newAddress(id) { @@ -298,26 +299,35 @@ function newAddress(id) {
298 getAddress({ 299 getAddress({
299 id: cityId, 300 id: cityId,
300 type: 'getCounty', 301 type: 'getCounty',
  302 + selectId: '' + codeId[0] + codeId[1] + codeId[2]
  303 + }, function() {
  304 + var countyId = $county.val();
  305 +
  306 + //如果获取的县有默认选中项则获取乡镇／街道
  307 + if (countyId !== '0') {
  308 + getAddress({
  309 + id: countyId,
  310 + type: 'getStreet',
301 selectId: code 311 selectId: code
302 }); 312 });
303 } 313 }
304 }); 314 });
  315 + }
  316 + });
305 } else { 317 } else {
306 $addressManage.find('select[name="city"]').html('<option value="0">请选择城市</option>'); 318 $addressManage.find('select[name="city"]').html('<option value="0">请选择城市</option>');
307 $addressManage.find('select[name="county"]').html('<option value="0">请选择区县</option>'); 319 $addressManage.find('select[name="county"]').html('<option value="0">请选择区县</option>');
  320 + $street.html('<option value="0">请选择乡镇／街道</option>');
308 } 321 }
309 }); 322 });
310 323
311 // 发生change事件时获取下一级地址 324 // 发生change事件时获取下一级地址
312 $selectList.change(function() { 325 $selectList.change(function() {
313 -  
314 var $this = $(this); 326 var $this = $(this);
315 327
316 if ($this.attr('name') === 'province') { 328 if ($this.attr('name') === 'province') {
317 -  
318 if ($this.val() === '0') { 329 if ($this.val() === '0') {
319 $addressManage.find('select[name="city"]').html('<option value="0">请选择城市</option>'); 330 $addressManage.find('select[name="city"]').html('<option value="0">请选择城市</option>');
320 - $addressManage.find('select[name="county"]').html('<option value="0">请选择区县</option>');  
321 } else { 331 } else {
322 getAddress({ 332 getAddress({
323 id: $this.val(), 333 id: $this.val(),
@@ -325,12 +335,12 @@ function newAddress(id) { @@ -325,12 +335,12 @@ function newAddress(id) {
325 }, function() { 335 }, function() {
326 isProvinceChecked = true; 336 isProvinceChecked = true;
327 }); 337 });
328 - $addressManage.find('select[name="county"]').html('<option value="0">请选择区县</option>');  
329 } 338 }
  339 + $addressManage.find('select[name="county"]').html('<option value="0">请选择区县</option>');
  340 + $street.html('<option value="0">请选择乡镇／街道</option>');
330 } 341 }
331 342
332 if ($this.attr('name') === 'city' && isProvinceChecked) { 343 if ($this.attr('name') === 'city' && isProvinceChecked) {
333 -  
334 if ($this.val() === '0') { 344 if ($this.val() === '0') {
335 $addressManage.find('select[name="county"]').html('<option value="0">请选择区县</option>'); 345 $addressManage.find('select[name="county"]').html('<option value="0">请选择区县</option>');
336 } else { 346 } else {
@@ -339,8 +349,21 @@ function newAddress(id) { @@ -339,8 +349,21 @@ function newAddress(id) {
339 type: 'getCounty' 349 type: 'getCounty'
340 }); 350 });
341 } 351 }
  352 + $street.html('<option value="0">请选择乡镇／街道</option>');
  353 + }
  354 +
  355 + if ($this.attr('name') === 'county' && isProvinceChecked) {
  356 + if ($this.val() === '0') {
  357 + $street.html('<option value="0">请选择乡镇／街道</option>');
  358 + } else {
  359 + getAddress({
  360 + id: $this.val(),
  361 + type: 'getStreet'
  362 + });
  363 + }
342 } 364 }
343 }); 365 });
  366 +
344 $name.on('blur', function() { 367 $name.on('blur', function() {
345 validate.name($.trim($name.val())); 368 validate.name($.trim($name.val()));
346 }); 369 });
@@ -352,9 +375,9 @@ function newAddress(id) { @@ -352,9 +375,9 @@ function newAddress(id) {
352 }); 375 });
353 $tel.on('blur', function() { 376 $tel.on('blur', function() {
354 validate.tel($.trim($telCode.val()), $.trim($tel.val())); 377 validate.tel($.trim($telCode.val()), $.trim($tel.val()));
355 - })  
356 - $county.on('change', function() {  
357 - validate.city($province.val(), $city.val(),$county.val()); 378 + });
  379 + $street.on('change', function() {
  380 + validate.city($province.val(), $city.val(), $county.val(), $(this).val());
358 }) 381 })
359 } 382 }
360 /** 383 /**
@@ -380,6 +403,8 @@ function getAddress(d, callback) { @@ -380,6 +403,8 @@ function getAddress(d, callback) {
380 403
381 //url = 'getCounty'; 404 //url = 'getCounty';
382 $obj = $county; 405 $obj = $county;
  406 + } else if (d.type === 'getStreet') {
  407 + $obj = $street;
383 } 408 }
384 409
385 $.ajax({ 410 $.ajax({
@@ -402,11 +427,11 @@ function getAddress(d, callback) { @@ -402,11 +427,11 @@ function getAddress(d, callback) {
402 427
403 // 构建select下拉选项 428 // 构建select下拉选项
404 function structureOption($obj, data, selectId) { 429 function structureOption($obj, data, selectId) {
405 -  
406 var i, 430 var i,
407 optionHtml = '', 431 optionHtml = '',
408 defaultOption, 432 defaultOption,
409 isStar = ''; 433 isStar = '';
  434 + var countyId;
410 435
411 for (i = 0; i < data.length; i++) { 436 for (i = 0; i < data.length; i++) {
412 437
@@ -431,6 +456,15 @@ function structureOption($obj, data, selectId) { @@ -431,6 +456,15 @@ function structureOption($obj, data, selectId) {
431 456
432 } else if ($obj.attr('name') === 'county') { 457 } else if ($obj.attr('name') === 'county') {
433 defaultOption = '<option value="0">请选择区县</option>'; 458 defaultOption = '<option value="0">请选择区县</option>';
  459 + } else if ($obj.attr('name') === 'street') {
  460 + selectId += '';
  461 + countyId = selectId.substr(0, 6);
  462 +
  463 + defaultOption = '<option value="0">请选择乡镇／街道</option>';
  464 +
  465 + if (countyId) {
  466 + defaultOption += '<option value="' + countyId + '">全部</option>';
  467 + }
434 } 468 }
435 469
436 $obj.html(defaultOption + optionHtml); 470 $obj.html(defaultOption + optionHtml);
@@ -442,6 +476,7 @@ function saveAddress(id) { @@ -442,6 +476,7 @@ function saveAddress(id) {
442 province = $province.val(), 476 province = $province.val(),
443 city = $city.val(), 477 city = $city.val(),
444 county = $county.val(), 478 county = $county.val(),
  479 + street = $street.val(),
445 address = $address.val(), 480 address = $address.val(),
446 phone = $phone.val(), 481 phone = $phone.val(),
447 telCode = $telCode.val(), 482 telCode = $telCode.val(),
@@ -456,14 +491,14 @@ function saveAddress(id) { @@ -456,14 +491,14 @@ function saveAddress(id) {
456 var postData = { 491 var postData = {
457 orderCode: id, 492 orderCode: id,
458 userName: name, 493 userName: name,
459 - areaCode: county, 494 + areaCode: street,
460 address: address, 495 address: address,
461 mobile: phone, 496 mobile: phone,
462 phoneCode: telCode, 497 phoneCode: telCode,
463 phoneNum: tel 498 phoneNum: tel
464 }; 499 };
465 var validate = validateForm(); 500 var validate = validateForm();
466 - if (!validate.name(name) || !validate.city(province, city, county) || !validate.address(address) || !validate.mobile(phone) || !validate.tel(telCode, tel)) { 501 + if (!validate.name(name) || !validate.city(province, city, county, street) || !validate.address(address) || !validate.mobile(phone) || !validate.tel(telCode, tel)) {
467 return; 502 return;
468 } 503 }
469 504
@@ -510,8 +545,8 @@ function validateForm() { @@ -510,8 +545,8 @@ function validateForm() {
510 return true; 545 return true;
511 } 546 }
512 }, 547 },
513 - city: function(province, city, county) {  
514 - if (province === '0' || city === '0' || county === '0') { 548 + city: function(province, city, county, street) {
  549 + if (province === '0' || city === '0' || county === '0' || street === '0') {
515 $err_province.html(_error_html); 550 $err_province.html(_error_html);
516 $err_province.find('b').html('请填写完整的省市区信息'); 551 $err_province.find('b').html('请填写完整的省市区信息');
517 $err_province.show(); 552 $err_province.show();
@@ -13,7 +13,8 @@ var $goodsTable = $('#goods-table'), @@ -13,7 +13,8 @@ var $goodsTable = $('#goods-table'),
13 $refundType = $('input[name="refund-type"]'), 13 $refundType = $('input[name="refund-type"]'),
14 $province = $('#province'), 14 $province = $('#province'),
15 $city = $('#city'), 15 $city = $('#city'),
16 - $areaCode = $('#area'), 16 + $area = $('#area'),
  17 + $street = $('#street'),
17 $bankNameSpan = $('#bank-name-span'), 18 $bankNameSpan = $('#bank-name-span'),
18 $bankId = $('#bank-id'); 19 $bankId = $('#bank-id');
19 20
@@ -116,7 +117,8 @@ if ($refundInfo.length) { @@ -116,7 +117,8 @@ if ($refundInfo.length) {
116 117
117 defaultArea = defaultArea ? defaultArea : ''; 118 defaultArea = defaultArea ? defaultArea : '';
118 Addr.loadAllData(defaultArea, { 119 Addr.loadAllData(defaultArea, {
119 - areaDomId: 'area' 120 + areaDomId: 'area',
  121 + streetsDomId: 'street'
120 }); 122 });
121 123
122 // 页面获取size列表数据 124 // 页面获取size列表数据
@@ -379,7 +381,7 @@ function packExchangeInfo() { @@ -379,7 +381,7 @@ function packExchangeInfo() {
379 verifyTip = '请填写收货人姓名'; 381 verifyTip = '请填写收货人姓名';
380 } 382 }
381 383
382 - res.areaCode = $areaCode.val(); 384 + res.areaCode = $street.val();
383 if (!verifyTip && !res.areaCode * 1) { 385 if (!verifyTip && !res.areaCode * 1) {
384 verifyTip = '请选择地区'; 386 verifyTip = '请选择地区';
385 } 387 }