index.vue 3.9 KB

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