frame2.html 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536
  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>
  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/style.css" />
  11. <link rel="stylesheet" type="text/css" href="../css/swiper.min.css" />
  12. <style>
  13. body{background:#f2f2f2;}
  14. .swiper-container {
  15. width: 100%;
  16. height: 100%;
  17. }
  18. .swiper-slide{
  19. text-align: center;
  20. /*height: 0.76rem;*/
  21. line-height: 0.5rem;
  22. font-size: 0.28rem;
  23. }
  24. .swiper-slide span {
  25. white-space: nowrap;
  26. overflow: hidden;
  27. text-overflow: ellipsis;
  28. }
  29. .active, .active span{
  30. color: #d9251c;
  31. }
  32. .active span {
  33. border-bottom: 0.1em solid;
  34. }
  35. .bottom-line{
  36. border-bottom:1px solid #e8e8e8;
  37. }
  38. .border-none{
  39. text-align:center;font-size: 0.28rem;
  40. }
  41. .border-none p{
  42. color:#999999;
  43. }
  44. .border-none-img{
  45. margin-top: 3rem;
  46. width: 1.73rem;
  47. height: auto;
  48. }
  49. .order-list-right {
  50. width: 4.7rem;
  51. }
  52. .order-list-right p {
  53. font-size: 0.22rem;
  54. color: #999;
  55. /*height: 1.04rem;*/
  56. }
  57. span.font-rem11 {
  58. overflow: hidden;
  59. text-overflow: ellipsis;
  60. display: -webkit-box;
  61. -webkit-line-clamp: 3;
  62. -webkit-box-orient: vertical;
  63. }
  64. p.font-size-18 {
  65. color: #666;
  66. height: auto;
  67. font-size: 0.28rem;
  68. }
  69. .h5 {
  70. background: #f2f2f2;
  71. margin: 0 0 0 -0.32rem;
  72. width: 7.5rem;
  73. /*margin-top: 0.5em;*/
  74. height: 0.2rem;
  75. }
  76. .h5:first-child {
  77. padding-top: 1.8rem;
  78. }
  79. .fixedtop {
  80. position: fixed;
  81. top: 0;
  82. z-index: 1;
  83. }
  84. section.nav {
  85. position: fixed;
  86. width: 100%;
  87. z-index: 1;
  88. }
  89. .weui-btn_primary, .weui-btn_primary:not(.weui-btn_disabled):active {
  90. background-color: #d9251c;
  91. }
  92. .top0 {
  93. padding-top: 0;
  94. margin-top: 0;
  95. }
  96. .border-none-imgx{
  97. margin-top: 3rem;
  98. width: 3rem !important;
  99. height: 3rem !important;
  100. }
  101. .weui-gallery.nologin {
  102. text-align: center;
  103. font-size: 0.28rem;
  104. background-color: #fff;
  105. }
  106. </style>
  107. <script>
  108. (function(w, d, m) {
  109. function r() {
  110. var t = 100,
  111. o = 750,
  112. e = d.documentElement.clientWidth || w.innerWidth,
  113. n = m.max(m.min(e, 480), 320),
  114. h = 50;
  115. 320 >= n && (h = m.floor(n / o * t * .99)),
  116. n > 320 && 362 >= n && (h = m.floor(n / o * t * 1)),
  117. n > 362 && 375 >= n && (h = m.floor(n / o * t * 1)),
  118. n > 375 && (h = m.floor(n / o * t * .97)),
  119. d.querySelector("html").style.fontSize = (e/7.5) + "px"
  120. };
  121. r();
  122. w.onresize = function() {
  123. r()
  124. }
  125. })(window, document, Math);
  126. </script>
  127. </head>
  128. <body>
  129. <div class="weui-gallery nologin" style="display: none;">
  130. <img src="../image/notfound.png" class="border-none-imgx">
  131. <p style="padding-bottom: 0.3rem;">登录后可查看订单</p>
  132. <a href="javascript:redirectLogin();" class="weui-btn weui-btn_mini weui-btn_primary">登录</a>
  133. </div>
  134. <div class="topbar"></div>
  135. <header class="back-header bottom-line">
  136. <ul>
  137. <li class="padding-20"></li>
  138. <li class="back-header-title">我的订单</li>
  139. <li class="more-btn"></li>
  140. </ul>
  141. </header>
  142. <section class="nav padding-top white-back" style="margin-top: 0.2rem;">
  143. <div class="swiper-container">
  144. <div class="swiper-wrapper">
  145. <div class="swiper-slide active" state="100" state_as="all"><span>全部</span></div>
  146. <div class="swiper-slide" state="10" state_as="waiting"><span>待付款</span></div>
  147. <div class="swiper-slide" state="20,30" state_as="payed"><span>处理中</span></div>
  148. <div class="swiper-slide" state="40" state_as="complete"><span>已收货</span></div>
  149. <div class="swiper-slide" state="0" state_as="cancel"><span>已取消</span></div>
  150. <div class="swiper-slide" state="50" state_as="refund"><span>退换/售后</span></div>
  151. </div>
  152. </div>
  153. </section>
  154. <section class="order-list white-back" id="order-list">
  155. </section>
  156. <section class="border-none kong">
  157. <img src="../image/border_none.png" class="border-none-img" />
  158. <p>去买点什么</p>
  159. </section>
  160. <section class="border-none nologin mask-hidden">
  161. <img src="../image/notfound.png" class="border-none-img">
  162. <p style="padding-bottom: 0.3rem;">登录后可查看订单</p>
  163. <a href="javascript:redirectLogin();" class="weui-btn weui-btn_mini weui-btn_primary">登录</a>
  164. </section>
  165. <div class="back-h10" style="height: 2rem;"></div>
  166. <div class="back-top mask-hidden" id="fix1"></div>
  167. </body>
  168. <script type="text/javascript" src="../script/api.js"></script>
  169. <script type="text/javascript" src="../script/swiper.min.js"></script>
  170. <script type="text/javascript" src="../script/jquery.min.js"></script>
  171. <script type="text/javascript" src="../script/imagesloaded.pkgd.min.js"></script>
  172. <script type="text/javascript" src="../script/jquery.tap.js"></script>
  173. <script type="text/javascript">
  174. var _state = 'all';
  175. var _minid = '';
  176. var lastpage = false;
  177. var _htmlstatus = false;
  178. var _page = '1';
  179. apiready = function() {
  180. setFixStatusBar();
  181. getRouteData();
  182. api.addEventListener({
  183. name: 'scrolltobottom',
  184. extra: {
  185. threshold: 200
  186. }
  187. }, function(ret, err) {
  188. getRouteData();
  189. });
  190. api.addEventListener({
  191. name:'resume'
  192. }, function(ret, err){
  193. _minid = '';
  194. // $(".order-list").empty();
  195. _htmlstatus = true;
  196. lastpage = false;
  197. _page = '1';
  198. $(".border-none.kong").addClass("mask-hidden");
  199. getRouteData();
  200. });
  201. api.addEventListener({
  202. name:'viewappear'
  203. }, function(ret, err){
  204. _minid = '';
  205. // $(".order-list").empty();
  206. _htmlstatus = true;
  207. lastpage = false;
  208. _page = '1';
  209. $(".border-none.kong").addClass("mask-hidden");
  210. getRouteData();
  211. });
  212. };
  213. function getRouteData() {
  214. if (lastpage) {
  215. return false;
  216. }
  217. $.ajax({
  218. url: siteurl + 'v2/order/orders',//'?do=getorder',
  219. data: {
  220. memberid: $api.getStorage("memberid"),
  221. minid: _minid,
  222. state: _state,
  223. page: _page
  224. },
  225. headers: { "X-TOKEN": $api.getStorage("accesstoken") },
  226. dataType: 'json',
  227. type: 'post',
  228. success: function(datas) {
  229. if (datas.result) {
  230. var _html = '';
  231. console.log(JSON.stringify(datas.data.order_list))
  232. if (datas.data.order_list.length > 0) {
  233. $.each(datas.data.order_list, function(index, item) {
  234. _html += '<div class="h5"></div><div class="order-dtl-btn" storeid="' + item.store_id + '" state="' + item.order_state + '" keyid="' + item.order_id + '"><div class="order-list-title font-rem11" storeid="' + item.store_id + '" state="' + item.order_state + '" keyid="' + item.order_id + '"><img src="' + siteurl + 'uploads/home/store/' + item.storeid + '/' + item.store_avatar + '"/> ' + item.store_name + '<span class="order-list-status font-rem11">' + item.status + '</span></div>';
  235. if (typeof(item.goods) !== 'undefined') {
  236. $.each(item.goods, function(index2, item2) {
  237. var arr = item2.goods_name.split(" ");
  238. var name_arr = arr[0];
  239. var size_arr = item2.goods_name.replace(name_arr, "");
  240. _html += '<div class="order-list-goods" state="' + item.order_state +'" order_id="' + item.order_id + '" goods_commonid="'+item2.goods_commonid+'" storeid="' + item.store_id + '" keyid="' + item2.goods_id + '"><ul><li><img src="' + siteurl + "uploads/home/store/goods/" + item2.goods_image.substr(0, item2.goods_image.indexOf("\_")) + "/" + item2.goods_image + '"/></li>';
  241. _html += '<li class="order-list-right"><span class="font-rem11">' + name_arr + '</span><p>' + size_arr + ' x' + item2.goods_num + '</p>';
  242. _html += '<p class="font-size-18">¥' + item2.goods_price + '</p></li>';
  243. _html += '</ul></div><div class="h2"></div>';
  244. });
  245. }
  246. if (item.evaluation_state == 1) {
  247. _html += '<div class="order-list-title" style="border-bottom:none;">合计:¥' + item.order_amount + '</div></div>';
  248. } else {
  249. if(item.order_state == 60){
  250. _html += '<div class="order-list-title" style="border-bottom:none;">合计:¥' + item.order_amount + '</div></div>';
  251. }else{
  252. _html += '<div class="order-list-title" style="border-bottom:none;">合计:¥' + item.order_amount + '<span class="order-list-action" state="' + item.order_state + '" keyid="' + item.order_id + '" shippingtype="' + item.shipping_type + '">' + item.operate + '</span></div></div>';
  253. }
  254. }
  255. });
  256. // console.log(_htmlstatus,_state)
  257. // console.log(datas)
  258. if ( _htmlstatus ) {
  259. $(".order-list").html(_html);
  260. _htmlstatus = false;
  261. }else{
  262. $(".order-list").append(_html);
  263. }
  264. if (datas.data.order_list.length > 0) {
  265. // _minid = datas[datas.length - 1].order_id;
  266. _page++;
  267. }
  268. $(".border-none.kong").addClass("mask-hidden");
  269. } else {
  270. // console.log(_htmlstatus,_state)
  271. // console.log(datas)
  272. lastpage = true;
  273. // api.toast({ msg: '没有更多数据...' });
  274. if ( _htmlstatus ) {
  275. $(".order-list").empty();
  276. $(".border-none.kong").removeClass("mask-hidden");
  277. }
  278. }
  279. $(".weui-gallery.nologin").hide();
  280. } else {
  281. if (datas.code == 2000) {
  282. $(".weui-gallery.nologin").show();
  283. } else {
  284. errcode(datas, datas.code);
  285. }
  286. }
  287. function_name();
  288. }
  289. });
  290. }
  291. var swiper = new Swiper('.swiper-container', {
  292. slidesPerView: 5,
  293. spaceBetween: 10,
  294. pagination: {
  295. el: '.swiper-pagination',
  296. clickable: true,
  297. },
  298. });
  299. function redirectLogin() {
  300. api.openWin({
  301. name: 'login',
  302. url: '../login.html',
  303. bounces: false,
  304. pageParam: {
  305. keyid: true
  306. }
  307. });
  308. }
  309. ////
  310. $(".order-list").on("tap", ".order-list-title.font-rem11", function() {
  311. var _keyid = $(this).attr("storeid");
  312. console.log(_keyid)
  313. api.openWin({
  314. name: 'hoteldtl',
  315. url: './home/hoteldtl.html',
  316. bounces: false,
  317. pageParam: {
  318. keyid: _keyid
  319. }
  320. });
  321. return false;
  322. })
  323. ////
  324. $(".order-list").on("tap", ".order-dtl-btnx", function() {
  325. var _keyid = $(this).attr("keyid");
  326. var _state = $(this).attr("state");
  327. console.log(_keyid)
  328. api.openWin({
  329. name: 'orderdtl',
  330. url: './order/orderdtl.html',
  331. bounces: false,
  332. pageParam: {
  333. keyid: _keyid,
  334. state: $(this).attr("state")
  335. }
  336. });
  337. return false;
  338. })
  339. ////
  340. $(".order-list").on("tap", ".order-list-goods", function() {
  341. var _keyid = $(this).attr("order_id");
  342. var _state = $(this).attr("state");
  343. console.log(_keyid)
  344. api.openWin({
  345. name: 'orderdtl',
  346. url: './order/orderdtl.html',
  347. bounces: false,
  348. pageParam: {
  349. keyid: _keyid,
  350. state: $(this).attr("state")
  351. }
  352. });
  353. return false;
  354. })
  355. $(".order-list").on("tap", ".order-list-goodsxx", function() {
  356. var _keyid = $(this).attr("keyid");
  357. var _storeid = $(this).attr("storeid");
  358. var _goods_commonid = $(this).attr("goods_commonid");
  359. api.openWin({
  360. name: 'showgoods',
  361. url: './home/showgoods.html',
  362. bounces: false,
  363. pageParam: {
  364. keyid: _goods_commonid,
  365. storeid: _storeid,
  366. }
  367. });
  368. return false;
  369. })
  370. ///
  371. $(".order-list").on("tap", ".order-list-action", function() {
  372. var _state = $(this).attr("state");
  373. var _keyid = $(this).attr("keyid");
  374. var _shippingtype = $(this).attr("shippingtype");
  375. if (_state == 10) {
  376. api.openWin({
  377. name: 'paymode',
  378. url: './home/paymode.html',
  379. bounces: false,
  380. pageParam: {
  381. keyid: _keyid
  382. }
  383. });
  384. }
  385. if (_state == 20) {
  386. if (_shippingtype == 0) {
  387. api.openWin({
  388. name: 'urge',
  389. url: './order/urge.html',
  390. bounces: false,
  391. pageParam: {
  392. keyid: _keyid
  393. }
  394. });
  395. } else {
  396. api.openWin({
  397. name: 'contacthotel',
  398. url: './order/contacthotel.html',
  399. bounces: false,
  400. pageParam: {
  401. keyid: _keyid
  402. }
  403. });
  404. }
  405. }
  406. if (_state == 30) {
  407. api.confirm({
  408. title: '是否确认收货',
  409. buttons: ['取消', '确定']
  410. }, function(ret, err) {
  411. var index = ret.buttonIndex;
  412. if (index == 2) {
  413. $.ajax({
  414. url: siteurl + 'v2/order/confirm',//'?do=orderconfirm',
  415. data: {
  416. memberid: $api.getStorage("memberid"),
  417. order_id: _keyid
  418. },
  419. headers: { "X-TOKEN": $api.getStorage("accesstoken") },
  420. dataType: 'json',
  421. type: 'post',
  422. success: function(datas) {
  423. if (datas.result) {
  424. refreshData();
  425. api.toast({ msg: '操作成功!' });
  426. } else {
  427. errcode(datas, datas.code);
  428. }
  429. }
  430. });
  431. }
  432. })
  433. }
  434. if (_state == 40) {
  435. api.openWin({
  436. name: 'evaluate',
  437. url: './order/evaluate.html',
  438. bounces: false,
  439. pageParam: {
  440. keyid: _keyid
  441. }
  442. });
  443. }
  444. if (_state == 0) {
  445. api.confirm({
  446. title: '是否要删除订单',
  447. buttons: ['取消', '确定']
  448. }, function(ret, err) {
  449. var index = ret.buttonIndex;
  450. if (index == 2) {
  451. $.ajax({
  452. url: siteurl + 'v2/order/drop',//'?do=orderdel',
  453. data: {
  454. memberid: $api.getStorage("memberid"),
  455. order_id: _keyid
  456. },
  457. headers: { "X-TOKEN": $api.getStorage("accesstoken") },
  458. dataType: 'json',
  459. type: 'post',
  460. success: function(datas) {
  461. refreshData();
  462. if (datas.result) {
  463. api.toast({ msg: '操作成功!' });
  464. } else {
  465. errcode(datas, datas.code);
  466. }
  467. }
  468. });
  469. }
  470. })
  471. }
  472. return false;
  473. })
  474. $(".swiper-slide").on("tap", function() {
  475. $(".swiper-slide").removeClass("active");
  476. $(this).addClass("active");
  477. _state = $(this).attr("state_as");
  478. _minid = '';
  479. _page = '1';
  480. // $(".order-list").empty();
  481. lastpage = false;
  482. _htmlstatus = true;
  483. $(".border-none.kong").addClass("mask-hidden");
  484. getRouteData();
  485. return false;
  486. })
  487. function refreshData() {
  488. _state = $(".swiper-slide.active").attr("state_as");
  489. _minid = '';
  490. _page = '1';
  491. // $(".order-list").empty();
  492. _htmlstatus = true;
  493. lastpage = false;
  494. $(".border-none.kong").addClass("mask-hidden");
  495. getRouteData();
  496. return false;
  497. }
  498. $(".back-top").on("tap", function() {
  499. $('html , body').animate({ scrollTop: 0 }, 'slow');
  500. return false;
  501. });
  502. $.fn.fixedDiv = function(actCls) {
  503. var that = $(this),
  504. offsetTop = that.offset().top,
  505. scrollTop;
  506. function fix() {
  507. scrollTop = $(document).scrollTop();
  508. if (scrollTop > offsetTop) {
  509. that.removeClass(actCls);
  510. } else {
  511. that.addClass(actCls);
  512. }
  513. }
  514. fix();
  515. $(window).scroll(fix);
  516. }
  517. $('#fix1').fixedDiv('mask-hidden')
  518. </script>
  519. </html>