index.vue 3.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  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. <view class="zhuti shangpin" style="margin-bottom: 170px !important;padding-bottom:70px">
  6. <tm-sheet :padding="[0, 0]" class="jiaoxi xiao">
  7. <view v-for="item in test">
  8. <tm-checkbox style="float: left;padding:2px !important;margin-top:9%;" v-model="item.checked" label=""></tm-checkbox>
  9. <tm-cartCellListFood class="shuliang" :typeclick="typeclick" :mdata="item" :cart-num.sync="item.buy"></tm-cartCellListFood>
  10. </view>
  11. </tm-sheet>
  12. </view>
  13. <view class="dibu">
  14. <!-- <tm-listitem title="优惠券"></tm-listitem> -->
  15. <tm-listitem class="liebiao" value="免费" :round="24" :shadow="12" title="邮费" :show-right-icon="false"></tm-listitem>
  16. <tm-listitem class="liebiao jiageList" value="¥529" :round="24" :shadow="12" title="价格" :show-right-icon="false"></tm-listitem>
  17. <tm-button theme="primary" :round="24" block class="mt-50 logincla">立即付款</tm-button>
  18. </view>
  19. <!-- 弹出层消息 -->
  20. <tm-message ref="toast"></tm-message>
  21. </view>
  22. </template>
  23. <script>
  24. import{myRequest} from '@/api/request.js'
  25. export default {
  26. data() {
  27. return {
  28. beizu:'',
  29. test: [{
  30. img: '../../static/img/83.png',
  31. title: '丝缎质感纹理风衣',
  32. label: '黑色 - 6518/320',
  33. size:'S',
  34. price: '1299',
  35. id: 3,
  36. buy: 0,
  37. itemId: 0,
  38. checked:false,
  39. },{
  40. img: '../../static/img/84.png',
  41. title: '产品3(任选)',
  42. size:'S',
  43. label: '这个产品是只有几个融会',
  44. price: 36.2,
  45. id: 3,
  46. buy: 0,
  47. itemId: 0,
  48. checked:false
  49. }],
  50. typeclick:2,//1加入购物车,2购物车
  51. };
  52. },
  53. onLoad() {
  54. },
  55. created() {
  56. this.sys = uni.getSystemInfoSync();
  57. },
  58. methods: {
  59. },
  60. }
  61. </script>
  62. <style lang="scss">
  63. /deep/ .tm-menubars .body{
  64. background-color: #1b1b1b !important;
  65. }
  66. /deep/ .jiaoxi{margin:0 !important;padding: 8px !important;}
  67. /deep/ .shangpin .white.bk{background-color:#1b1b1b!important;}
  68. /deep/ .shangpin .tm-cartCellListFood{ padding: 0px 0px 15px 0px !important;
  69. margin-top: 5px !important;margin-bottom: 20px !important;
  70. border-bottom: 1px solid #303030;}
  71. /deep/ .shangpin .border-t-1.bk{border-top:1px solid #1b1b1b!important;}
  72. /deep/ .shangpin .title{color: white !important;}
  73. /deep/ .shangpin .text-red{color: white !important;}
  74. /deep/ .shangpin .round-3{width:90px !important;height:90px !important;}
  75. /deep/ .shangpin .tm-cartCellListFood-img{width:90px !important;height:90px !important;}
  76. /deep/ .shuliang .text-size-n{color: white !important;}
  77. .dibu{background: #0D0D0D;position: fixed;bottom:0px;width: 100%;}
  78. /deep/ .liebiao .grey-darken-4.bk{background: #0D0D0D !important;padding: 0px;margin: 0px;
  79. width: 100%;border-radius: 0px !important;}
  80. .logincla{width: 88%;margin:0 auto;margin-top:20px;margin-bottom:30px;}
  81. /deep/ .jiageList .d-inline-block{font-size: 18px !important;color: white !important;}
  82. </style>