xyf.picker.js 6.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209
  1. var AREA_LIST = [{
  2. value: 'school',
  3. label: '学校'
  4. }, {
  5. value: 'apartment',
  6. label: '公寓'
  7. }, {
  8. value: 'workshop',
  9. label: '厂房'
  10. }, {
  11. value: 'others',
  12. label: '其他'
  13. }];
  14. function CreateCitySelect(option, callback) {
  15. var cityPicker
  16. var areaPicker
  17. function initUI() {
  18. //地区
  19. cityPicker = new mui.PopPicker({
  20. layer: 3
  21. });
  22. var showCity = document.getElementById('location');
  23. var districtId = document.getElementById('districtId');
  24. showCity.addEventListener('tap', function (event) {
  25. cityPicker.show(function (items) {
  26. showCity.value = (items[0] || {}).text + " " + (items[1] || {}).text + " " + (items[2] || {}).text;
  27. districtId.value = items[2].value;
  28. });
  29. }, false);
  30. //地址类型
  31. areaPicker = new mui.PopPicker();
  32. var showArea = document.getElementById('area');
  33. var addressType = document.getElementById('addressType');
  34. showArea.addEventListener('tap', function (event) {
  35. areaPicker.show(function (items) {
  36. showArea.value = (items[0] || {}).text;
  37. addressType.value = (items[0] || {}).value;
  38. });
  39. }, false);
  40. }
  41. function setAreaTypeData() {
  42. sendRequest({
  43. url: '/common/getAddressType',
  44. type: "GET",
  45. data: {},
  46. success: function (res) {
  47. if (res.result === 1) {
  48. AREA_LIST = res.payload.dataList
  49. for(var index in AREA_LIST){
  50. var item = AREA_LIST[index];
  51. item.text = item.label
  52. }
  53. areaPicker.setData(AREA_LIST);
  54. // 当地址类型初始化完成后,调用回调,待优化,地址类型和地址分开最好
  55. if(callback){
  56. callback()
  57. }
  58. }
  59. }
  60. })
  61. }
  62. function setAddressData() {
  63. if (window.cityData3) {
  64. } else {
  65. return;
  66. }
  67. cityPicker.setData(cityData3);//加载cityData json数据
  68. }
  69. function setAddressSelected(option) {
  70. var addressComponents = option.addressComponents;
  71. var areaId = option.areaId;
  72. var idMap = {};
  73. if (addressComponents) {
  74. //地址新增页面
  75. idMap = getIdMapByDistrict(addressComponents) || {};
  76. //由于地图数据更新快,或是我们使用的数据不全,有一定几率找不到地区信息,不用渲染到界面
  77. if (!$.isEmptyObject(idMap)) {
  78. $("#location").val(idMap.province + " " + idMap.city + " " + idMap.district);
  79. $("#districtId").val(idMap.aid);
  80. }
  81. } else if (areaId) {
  82. //地址修改页面
  83. idMap = getIdMapByAreaId(areaId) || {};
  84. }
  85. if (idMap.pindex) {
  86. cityPicker.pickers[0].setSelectedIndex(idMap.pindex);
  87. }
  88. //级联下拉框似乎有bug,需要延迟执行一次
  89. setTimeout(function () {
  90. if (idMap.cindex) {
  91. cityPicker.pickers[1].setSelectedIndex(idMap.cindex);
  92. }
  93. setTimeout(function () {
  94. if (idMap.aindex) {
  95. cityPicker.pickers[2].setSelectedIndex(idMap.aindex);
  96. }
  97. }, 300)
  98. }, 333)
  99. }
  100. initUI();
  101. setAddressData();
  102. setAddressSelected(option);
  103. setAreaTypeData();
  104. return {
  105. setAddressSelected: setAddressSelected
  106. }
  107. }
  108. /***根据第三级地址的id,找到地址的所有信息省、市、线**/
  109. function getIdMapByAreaId(areaId) {
  110. var list1 = window.cityData3;//所有省
  111. for (var index1 in list1) {
  112. var pid = list1[index1].value;
  113. var ptext = list1[index1].text;
  114. var list2 = list1[index1].children;//省下市
  115. if (list2) {
  116. for (var index2 in list2) {
  117. var cid = list2[index2].value;
  118. var ctext = list2[index2].text;
  119. var list3 = list2[index2].children;//市下区或县
  120. if (list3) {
  121. for (var index3 in list3) {
  122. var item = list3[index3];
  123. var aid = item.value;
  124. var atext = item.text;
  125. if (aid == areaId) {
  126. return {
  127. province: ptext,
  128. city: ctext,
  129. district: atext,
  130. pindex: index1,
  131. cindex: index2,
  132. aindex: index3,
  133. pid: pid,
  134. cid: cid,
  135. aid: aid
  136. }
  137. }
  138. }
  139. }
  140. }
  141. }
  142. }
  143. }
  144. /***根据百度地图提供的地址信息找到地址数据的省、市、线*/
  145. function getIdMapByDistrict(addressComponents) {
  146. var province = addressComponents.province;
  147. var city = addressComponents.city;
  148. var district = addressComponents.district;
  149. var list1 = window.cityData3;//所有省
  150. for (var index1 in list1) {
  151. var pid = list1[index1].value;
  152. var ptext = list1[index1].text;
  153. var list2 = list1[index1].children;//省下市
  154. if (province === ptext && list2) {
  155. for (var index2 in list2) {
  156. var cid = list2[index2].value;
  157. var ctext = list2[index2].text;
  158. var list3 = list2[index2].children;//市下区或县
  159. if (city === ctext && list3) {
  160. for (var index3 in list3) {
  161. var item = list3[index3];
  162. var aid = item.value;
  163. var atext = item.text;
  164. if (district === atext) {
  165. return {
  166. province: ptext,
  167. city: ctext,
  168. district: atext,
  169. pindex: parseInt(index1),
  170. cindex: parseInt(index2),
  171. aindex: parseInt(index3),
  172. pid: pid,
  173. cid: cid,
  174. aid: aid
  175. }
  176. }
  177. }
  178. break;
  179. }
  180. }
  181. break;
  182. }
  183. }
  184. uplog && uplog({level: "error", short_message: "异常:未找到地区信息", full_message: addressComponents});
  185. }