index.vue 3.0 KB

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