selectaddress.html 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
  6. <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
  7. <title>title</title>
  8. <link rel="stylesheet" type="text/css" href="../../css/api.css" />
  9. <link rel="stylesheet" type="text/css" href="../../css/weui.min.css" />
  10. <link rel="stylesheet" type="text/css" href="../../css/iconfont.css" />
  11. <link rel="stylesheet" type="text/css" href="../../css/style.css?v=1.2" />
  12. <style>
  13. body{background: #F2F2F2;}
  14. .addr-room{
  15. font-size: 0.28rem;
  16. color:#666666;
  17. width:100%;
  18. position:relative;
  19. }
  20. .addr-room-realname{
  21. width: 6.2rem;
  22. overflow: hidden;
  23. padding: 0.28rem 0;
  24. }
  25. .border-none {
  26. text-align: center;
  27. font-size: 0.28rem;
  28. }
  29. .border-none-img {
  30. margin-top: 3rem;
  31. width: 1.73rem;
  32. height: auto;
  33. }
  34. .addr-room-realname p {
  35. padding-top: 0.2rem;
  36. }
  37. .addr-room-check{
  38. position:absolute;
  39. right:0px;
  40. top: 50%;
  41. -webkit-transform: translateY(-50%);
  42. -ms-transform: translateY(-50%);
  43. transform: translateY(-50%);
  44. }
  45. .addr-room img{
  46. width: 0.44rem;
  47. vertical-align:middle;
  48. }
  49. .addr-default{
  50. color:#A13532;
  51. border:1px solid #A13532;
  52. border-radius:3px;
  53. font-size:13px;
  54. margin-left:5px;
  55. padding-left:3px;
  56. padding-right:3px;
  57. }
  58. #addr-list{
  59. width:100%;
  60. }
  61. .buy-btn{
  62. width:100%;
  63. height: 1rem;
  64. background:#ffffff;
  65. border-top:1px solid #e8e8e8;
  66. position:fixed;
  67. bottom:0px;
  68. }
  69. .buy-btn li{
  70. float:left;
  71. /*width:50%;*/
  72. height: 1rem;
  73. line-height: 1rem;
  74. text-align:center;
  75. font-size: 0.28rem;
  76. border-right:1px solid #e8e8e8;
  77. box-sizing:border-box;
  78. }
  79. li.buy-btn-left{
  80. width: 5.3rem;
  81. text-align: left;
  82. padding-left: 0.2rem;
  83. }
  84. .to-del{
  85. color:#ffffff;
  86. background: #D9251C;
  87. }
  88. .to-del span{
  89. color:#ffffff;
  90. }
  91. .check-all{
  92. width: 0.4rem;
  93. height: 0.4rem;
  94. vertical-align: middle;
  95. }
  96. .buycar-null{
  97. width:100%;text-align:center;background:#f2f2f2;
  98. }
  99. .buycar-null img{
  100. width:60px;
  101. }
  102. .weui-swiped-btn .iconfont {
  103. font-size: 0.48rem;
  104. color: #d9251c;
  105. }
  106. .weui-swiped-btn_warn {
  107. background-color: rgb(255, 255, 255);
  108. }
  109. </style>
  110. <script>
  111. (function(w, d, m) {
  112. function r() {
  113. var t = 100,
  114. o = 750,
  115. e = d.documentElement.clientWidth || w.innerWidth,
  116. n = m.max(m.min(e, 480), 320),
  117. h = 50;
  118. 320 >= n && (h = m.floor(n / o * t * .99)),
  119. n > 320 && 362 >= n && (h = m.floor(n / o * t * 1)),
  120. n > 362 && 375 >= n && (h = m.floor(n / o * t * 1)),
  121. n > 375 && (h = m.floor(n / o * t * .97)),
  122. d.querySelector("html").style.fontSize = (e/7.5) + "px"
  123. };
  124. r();
  125. w.onresize = function() {
  126. r()
  127. }
  128. })(window, document, Math);
  129. </script>
  130. </head>
  131. <body>
  132. <div class="topbar"></div>
  133. <header class="back-header back-header-bottom">
  134. <ul>
  135. <li class="padding-20 back-btn"><img class="back-header-ico" src="../../image/nav_button_back_default.png" /></li>
  136. <li class="back-header-title">我的地址</li>
  137. <li class="more-btn">管理</li>
  138. </ul>
  139. </header>
  140. <div class="back-h10"></div>
  141. <div id="addr-list"></div>
  142. <section class="border-none">
  143. <img src="../../image/address.png" class="border-none-img" />
  144. <p>地址为空</p>
  145. </section>
  146. <section style="position:fixed;bottom:10px;width:100%;">
  147. <div class="m-bottom ">添加地址</div>
  148. </section>
  149. <div class="buy-btn mask-hidden" id="buy-cancel">
  150. <ul>
  151. <li class="buy-btn-left" style="width:70%;"><img src="../../image/checkun.png" class="check-all" /> 全选</span></li>
  152. <li class="to-del" style="width:30%;border-right:none;"><span class="to-pay-text">删除</span><span class="pay-total"></span></li>
  153. </ul>
  154. </div>
  155. </body>
  156. <script type="text/javascript" src="../../script/api.js"></script>
  157. <script type="text/javascript" src="../../script/jquery.min.js"></script>
  158. <script type="text/javascript" src="../../script/jquery.tap.js"></script>
  159. <script type="text/javascript">
  160. var _memberid = '';
  161. var _isselect = false;
  162. var _page = '1';
  163. apiready = function() {
  164. _isselect = api.pageParam.isselect;
  165. _isselect ? $(".more-btn").html('') : '';
  166. setFixStatusBar();
  167. getRouteData();
  168. api.addEventListener({
  169. name:'swipeup'
  170. }, function(ret, err){
  171. getRouteData();
  172. });
  173. };
  174. function getRouteData() {
  175. $.ajax({
  176. url: siteurl + 'v1/member/address',
  177. data: {
  178. memberid: $api.getStorage("memberid")
  179. },
  180. headers: { "X-TOKEN": $api.getStorage("accesstoken") },
  181. dataType: 'json',
  182. type: 'post',
  183. success: function(datas) {
  184. if (datas.result) {
  185. if (datas.data.address_list.length > 0) {
  186. var _html = '';
  187. $.each(datas.data.address_list, function(index, item) {
  188. _html += '<section class="white-back" addressid=' + item.address_id + '><div class="addr-room"><div class="addr-room-realname">' + item.address_realname + '';
  189. _html += '&nbsp;&nbsp;' + item.address_mob_phone + '';
  190. _html += ' <p>' + item.area_info + ' ' + item.address_detail + '</p><span address_id=' + item.address_id + ' address_realname="' + item.address_realname + '" address_detail="' + item.address_detail + '" address_mob_phone="' + item.address_mob_phone + '" area_info="' + item.area_info +'" area_id="' + item.area_id + '" class="addr-room-check"><img class="check-btn mask-hidden" src="../../image/checkun.png"/><a class="weui-swiped-btn weui-swiped-btn_warn" href="javascript:;"><span class="iconfont">&#xe606;</span></a></span></div>';
  191. _html += '</section><div class="back-h50"></div>';
  192. })
  193. if (_page == 1) {
  194. $("#addr-list").html(_html);
  195. } else {
  196. $("#addr-list").append(_html);
  197. }
  198. $(".border-none").addClass("mask-hidden");
  199. } else {
  200. $(".border-none").html("<p style='background: #f2f2f2;margin: 0 -0.32rem;'>加载完成</p>");
  201. }
  202. } else {
  203. errcode(datas, datas.code);
  204. }
  205. }
  206. });
  207. }
  208. function refreshData() {
  209. $("#addr-list").empty();
  210. getRouteData();
  211. }
  212. $(".m-bottom").on("tap", function() {
  213. api.openWin({
  214. name: 'addaddress',
  215. url: './addaddress.html',
  216. bounces: false
  217. });
  218. return false;
  219. });
  220. $("#addr-list").on("tap", ".weui-swiped-btn_warn", function() {
  221. var _keyid = $(this).parent(".addr-room-check").attr("address_id");
  222. var _phone = $(this).parent(".addr-room-check").attr("address_mob_phone");
  223. var _name = $(this).parent(".addr-room-check").attr("address_realname");
  224. var _detail = $(this).parent(".addr-room-check").attr("address_detail");
  225. var _info = $(this).parent(".addr-room-check").attr("area_info");
  226. var _area_id = $(this).parent(".addr-room-check").attr("area_id");
  227. // console.log(_keyid)
  228. api.openWin({
  229. name: 'addaddress',
  230. url: './addaddress.html',
  231. bounces: false,
  232. pageParam: {
  233. keyid: _keyid,
  234. phone: _phone,
  235. name: _name,
  236. detail: _detail,
  237. info: _info,
  238. area_id: _area_id
  239. }
  240. });
  241. return false;
  242. });
  243. $("#addr-list").on("tap", ".addr-room", function() {
  244. var _imgsrc = $(this).find("img");
  245. if (_isselect) {
  246. $(".addr-room").find("img").attr("src", '../../image/checkun.png');
  247. }
  248. _imgsrc.attr("src", _imgsrc.attr("src") == '../../image/checkun.png' ? '../../image/checked.png' : '../../image/checkun.png');
  249. /////选择地址
  250. getcheckall();
  251. var address_realname = $(this).find(".addr-room-check").attr("address_realname");
  252. var address_mob_phone = $(this).find(".addr-room-check").attr("address_mob_phone");
  253. var area_info = $(this).find(".addr-room-check").attr("area_info");
  254. var address_id = $(this).find(".addr-room-check").attr("address_id");
  255. var address_detail = $(this).find(".addr-room-check").attr("address_detail");
  256. if (_isselect) {
  257. console.log('asdfasdf')
  258. api.execScript({
  259. name: 'postaddr',
  260. script: 'getAddress("' + address_realname + '","' + address_mob_phone + '","' + area_info + '","' + address_id + '","' + address_detail + '");'
  261. });
  262. toast_loding_show();
  263. setTimeout(function() { api.closeWin(); }, 1000);
  264. $(".more-btn").html("");
  265. }
  266. return false;
  267. });
  268. var isEdit = false;
  269. $(".more-btn").on("tap", function() {
  270. if (!isEdit) {
  271. $(".more-btn").html("取消");
  272. $(".m-bottom").addClass("mask-hidden");
  273. $(".buy-btn").removeClass("mask-hidden");
  274. $(".check-btn").removeClass("mask-hidden");
  275. $(".weui-swiped-btn_warn").addClass("mask-hidden");
  276. isEdit = true;
  277. } else {
  278. $(".more-btn").html("管理");;
  279. $(".m-bottom").removeClass("mask-hidden");
  280. $(".buy-btn").addClass("mask-hidden");
  281. $(".check-btn").addClass("mask-hidden");
  282. $(".weui-swiped-btn_warn").removeClass("mask-hidden");
  283. isEdit = false;
  284. }
  285. getcheckall();
  286. return false;
  287. })
  288. $(".check-all").on("tap", function() {
  289. if ($(this).attr("src") == "../../image/checkun.png") {
  290. $(this).attr("src", "../../image/checked.png");
  291. $(".check-btn").attr("src", "../../image/checked.png");
  292. } else {
  293. $(this).attr("src", "../../image/checkun.png");
  294. $(".check-btn").attr("src", "../../image/checkun.png");
  295. }
  296. getcheckall();
  297. return false;
  298. })
  299. function getcheckall(){
  300. var no = $(".addr-room").length;
  301. var nox = $(".addr-room [src$='checkun.png']").length;
  302. var noc = $(".addr-room [src$='checked.png']").length;
  303. // console.log(no,nox,noc)
  304. if (no == noc) {
  305. $(".check-all").attr("src", "../../image/checked.png");
  306. } else {
  307. $(".check-all").attr("src", "../../image/checkun.png");
  308. }
  309. }
  310. $(".to-del").on("tap", function() {
  311. api.confirm({
  312. title: '删除收件地址',
  313. msg: '是否要删除选中的收件地址?',
  314. buttons: ['确定', '取消']
  315. }, function(ret, err) {
  316. var index = ret.buttonIndex;
  317. if (index == 1) {
  318. $(".white-back").each(function() {
  319. if ($(this).find("img").attr("src") == "../../image/checked.png") {
  320. var _addressid = $(this).attr("addressid");
  321. $.ajax({
  322. url: siteurl + 'v1/member/address_drop',
  323. data: {
  324. address_ids: _addressid
  325. },
  326. headers: { "X-TOKEN": $api.getStorage("accesstoken") },
  327. dataType: 'json',
  328. type: 'post',
  329. success: function(datas) {
  330. if (datas.result) {
  331. refreshData();
  332. api.toast({ msg: '删除成功!' });
  333. } else {
  334. errcode(datas, datas.code);
  335. }
  336. }
  337. });
  338. }
  339. })
  340. }
  341. });
  342. return false;
  343. })
  344. </script>
  345. </html>