cart.js 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. // page/component/new-pages/cart/cart.js
  2. Page({
  3. data: {
  4. carts:[], // 购物车列表
  5. hasList:false, // 列表是否有数据
  6. totalPrice:0, // 总价,初始为0
  7. selectAllStatus:true, // 全选状态,默认全选
  8. obj:{
  9. name:"hello"
  10. }
  11. },
  12. onShow() {
  13. this.setData({
  14. hasList: true,
  15. carts:[
  16. {id:1,title:'新鲜芹菜 半斤',image:'/image/s5.png',num:4,price:0.01,selected:true},
  17. {id:2,title:'素米 500g',image:'/image/s6.png',num:1,price:0.03,selected:true}
  18. ]
  19. });
  20. this.getTotalPrice();
  21. },
  22. /**
  23. * 当前商品选中事件
  24. */
  25. selectList(e) {
  26. const index = e.currentTarget.dataset.index;
  27. let carts = this.data.carts;
  28. const selected = carts[index].selected;
  29. carts[index].selected = !selected;
  30. this.setData({
  31. carts: carts
  32. });
  33. this.getTotalPrice();
  34. },
  35. /**
  36. * 删除购物车当前商品
  37. */
  38. deleteList(e) {
  39. const index = e.currentTarget.dataset.index;
  40. let carts = this.data.carts;
  41. carts.splice(index,1);
  42. this.setData({
  43. carts: carts
  44. });
  45. if(!carts.length){
  46. this.setData({
  47. hasList: false
  48. });
  49. }else{
  50. this.getTotalPrice();
  51. }
  52. },
  53. /**
  54. * 购物车全选事件
  55. */
  56. selectAll(e) {
  57. let selectAllStatus = this.data.selectAllStatus;
  58. selectAllStatus = !selectAllStatus;
  59. let carts = this.data.carts;
  60. for (let i = 0; i < carts.length; i++) {
  61. carts[i].selected = selectAllStatus;
  62. }
  63. this.setData({
  64. selectAllStatus: selectAllStatus,
  65. carts: carts
  66. });
  67. this.getTotalPrice();
  68. },
  69. /**
  70. * 绑定加数量事件
  71. */
  72. addCount(e) {
  73. const index = e.currentTarget.dataset.index;
  74. let carts = this.data.carts;
  75. let num = carts[index].num;
  76. num = num + 1;
  77. carts[index].num = num;
  78. this.setData({
  79. carts: carts
  80. });
  81. this.getTotalPrice();
  82. },
  83. /**
  84. * 绑定减数量事件
  85. */
  86. minusCount(e) {
  87. const index = e.currentTarget.dataset.index;
  88. const obj = e.currentTarget.dataset.obj;
  89. let carts = this.data.carts;
  90. let num = carts[index].num;
  91. if(num <= 1){
  92. return false;
  93. }
  94. num = num - 1;
  95. carts[index].num = num;
  96. this.setData({
  97. carts: carts
  98. });
  99. this.getTotalPrice();
  100. },
  101. /**
  102. * 计算总价
  103. */
  104. getTotalPrice() {
  105. let carts = this.data.carts; // 获取购物车列表
  106. let total = 0;
  107. for(let i = 0; i<carts.length; i++) { // 循环列表得到每个数据
  108. if(carts[i].selected) { // 判断选中才会计算价格
  109. total += carts[i].num * carts[i].price; // 所有价格加起来
  110. }
  111. }
  112. this.setData({ // 最后赋值到data中渲染到页面
  113. carts: carts,
  114. totalPrice: total.toFixed(2)
  115. });
  116. }
  117. })