index.vue 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134
  1. <template>
  2. <view :style="{ minHeight: sys.windowHeight + 'px' }"
  3. :class="[$tm.vx.state().tmVuetify.black ? 'black' : ' ']">
  4. <tm-menubars title="我的订单" :shadow="0" :showback="true"></tm-menubars>
  5. <tm-tabs align="center" class="qiehuan1" v-model="activeIndex" :list="list2" range-key="title" @change="changeTab"></tm-tabs>
  6. <div class="zhuti shangpin">
  7. <tm-sheet class="jiaoxi" style="" v-for="item in test">
  8. <tm-cartCellListFood class="shuliang" :typeclick="typeclick" :mdata="item" :cart-num.sync="item.buy"></tm-cartCellListFood>
  9. </tm-sheet>
  10. </div>
  11. <!-- 弹出层消息 -->
  12. <tm-message ref="toast"></tm-message>
  13. </view>
  14. </template>
  15. <script>
  16. import{myRequest} from '@/api/request.js'
  17. export default {
  18. data() {
  19. return {
  20. list2:[ '全部','待付款','已付款','已完成'],
  21. activeIndex:0,
  22. test: [
  23. {
  24. img: '../../static/img/83.png',
  25. title: '丝缎质感纹理风衣',
  26. label: '黑色 - 6518/320',
  27. size:'S',
  28. price: '1299',
  29. id: 3,
  30. buy: 0,
  31. itemId: 0,
  32. checked:false,
  33. status:0
  34. },{
  35. img: '../../static/img/84.png',
  36. title: '产品3(任选)',
  37. size:'S',
  38. label: '这个产品是只有几个融会',
  39. price: 36.2,
  40. id: 3,
  41. buy: 0,
  42. itemId: 0,
  43. checked:false,
  44. status:0
  45. }],
  46. typeclick:4,//1加入购物车,2购物车
  47. };
  48. },
  49. onLoad() {
  50. },
  51. created() {
  52. if(!uni.getStorageSync("token")){
  53. uni.navigateTo({
  54. url: "/pages/login/index",
  55. })
  56. }
  57. this.sys = uni.getSystemInfoSync();
  58. this.getOrderList(-1);
  59. },
  60. methods: {
  61. // 切换tab
  62. changeTab(e){
  63. this.activeIndex=e;
  64. let sel=0;
  65. if(e==0){
  66. sel=-1;
  67. }else if(e==1){
  68. sel=0;
  69. }else if(e==2){
  70. sel=1;
  71. }else if(e==3){
  72. sel=2;
  73. }
  74. this.getOrderList(sel)
  75. },
  76. // 获取订单列表
  77. getOrderList(index){
  78. let that=this;
  79. myRequest({
  80. url:'/api/Order/orderList',
  81. method:'post',
  82. data:{type:index}
  83. }).then(res=>{
  84. if (res.data.code == 200) {
  85. if (res.data.data.length != 0) {
  86. that.test = [];
  87. for (let i = 0; i < res.data.data.data.length; i++) {
  88. var obj = {
  89. img: res.data.data.data[i].goods_image,
  90. title: res.data.data.data[i].goods_name,
  91. // label: '黑色 - 6518/320',
  92. // size:'S',
  93. price: res.data.data.data[i].pay_money,
  94. id: res.data.data.data[i].id,
  95. buy: res.data.data.data[i].goods_num,
  96. itemId: res.data.data.data[i].id,
  97. checked: false,
  98. goods_id:res.data.data.data[i].goods_id,
  99. orderStatus:res.data.data.data[i].order_status,
  100. orderNo:res.data.data.data[i].order_sn
  101. };
  102. that.test.push(obj)
  103. }
  104. }else {
  105. that.test = [];
  106. }
  107. }
  108. console.log(res.data.data.data,'订单列表');
  109. })
  110. }
  111. },
  112. }
  113. </script>
  114. <style lang="scss">
  115. /deep/ .tm-menubars .body{
  116. background-color: #1b1b1b !important;
  117. }
  118. /deep/ .qiehuan1 .text-primary{color: white !important;}
  119. /deep/ .qiehuan1 .tm-tabs-wk{border-top: 1px solid #262628;}
  120. /deep/ .shuliang .text-size-n{color: white !important;}
  121. /deep/ .shangpin .white.bk{background-color:#1b1b1b!important;}
  122. /deep/ .shangpin .tm-cartCellListFood{padding: 0px 0px 15px 0px !important;
  123. margin-top: 5px !important;margin-bottom: 20px !important;
  124. border-bottom: 1px solid #1B1B1B;}
  125. /deep/ .shangpin .border-t-1.bk{border-top:1px solid #1b1b1b!important;}
  126. /deep/ .shangpin .title{color: white !important;}
  127. /deep/ .shangpin .text-red{color: white !important;}
  128. /deep/ .shangpin .round-3{width:90px !important;height:90px !important;}
  129. /deep/ .shangpin .tm-cartCellListFood-img{width:90px !important;height:90px !important;}
  130. /deep/ .shuliang .text-size-n{color: white !important;}
  131. /deep/ .jiaoxi{margin:0 !important;padding: 8px !important;margin-top: 10px !important;}
  132. </style>