Module.vue 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137
  1. <template>
  2. <view id="module" class="xcx-module-container">
  3. <div class="header-title" v-for="(item,index) in obj.controlList" v-if="item.title.s" :key="index">
  4. <conTitle v-if="item.type==1 && item.check " :title="item" :name="obj.name" :prev="true"/>
  5. </div>
  6. <div :style="'height:'+height+'px'" v-if="obj.controlList[0].title.s"></div>
  7. <view class="section-module" v-for="(element, index) in obj.moduleList" :key="index">
  8. <view class="xcx-module-item" :class="selectIndex === index ? 'on' : ''">
  9. <template v-if="!prev">
  10. <span class="xline"></span>
  11. <span class="xline"></span>
  12. <span class="xline"></span>
  13. <span class="xline"></span>
  14. </template>
  15. <moduleNav :module="element" v-if="element.type == 1" />
  16. <moduleDuo :module="element" v-if="element.type == 2" />
  17. <modlueTuwen :module="element" v-if="element.type == 3" />
  18. <modlueGoods :module="element" v-if="element.type == 4"/>
  19. <modlueTuijian :module="element" v-if="element.type == 5" />
  20. <modlueMsGoods :module="element" v-if="element.type == 6"/>
  21. <modluePtGoods :module="element" v-if="element.type == 7"/>
  22. <modlueYyGoods :module="element" v-if="element.type == 8"/>
  23. <!-- #ifdef MP-WEIXIN -->
  24. <modlueAd :module="element" v-if="element.type == 9"/>
  25. <!-- #endif -->
  26. <template v-if="element.type == 10">
  27. <modlueStore v-if="element.base.s==0" :module="element" />
  28. <!-- #ifdef MP-ALIPAY -->
  29. <template v-if="element.base.s==1">
  30. <slot name='getCoupon'></slot>
  31. </template>
  32. <template v-if="element.base.s==2">
  33. <mkt v-if="canIUse" mode="AUTOMATIC" boothCode="MERCHANT_SELF_TINYAPP" :cityCode="cityCode" version="2" class='mkt'/>
  34. </template>
  35. <!-- #endif -->
  36. </template>
  37. </view>
  38. </view>
  39. <view style="height: 100rpx;"></view>
  40. </view>
  41. </template>
  42. <script>
  43. import moduleNav from './module/nav.vue';
  44. import moduleDuo from './module/duo.vue';
  45. import modlueTuwen from './module/tuwen.vue';
  46. import modlueGoods from './module/goods.vue';
  47. import modlueTuijian from './module/tuijian.vue';
  48. import conTitle from './module/contitle.vue';
  49. import modlueMsGoods from './module/ms_goods.vue';
  50. import modluePtGoods from './module/pt_goods.vue';
  51. import modlueYyGoods from './module/yy_goods.vue';
  52. import modlueAd from './module/ad.vue';
  53. import modlueStore from './module/store.vue';
  54. import {
  55. mapState,
  56. mapGetters,
  57. mapMutations
  58. } from 'vuex'
  59. export default {
  60. name: 'module',
  61. props: {
  62. obj:{
  63. type: Object,
  64. default: () => []
  65. },
  66. 'prev': {
  67. default: false
  68. },
  69. cityCode:{
  70. type:[Number,String],
  71. default:0
  72. }
  73. },
  74. created() {
  75. var _this = this;
  76. uni.getSystemInfo({
  77. success: function(e) {
  78. // #ifdef MP-WEIXIN
  79. var custom = uni.getMenuButtonBoundingClientRect();
  80. _this.height = custom.bottom + custom.top - e.statusBarHeight;
  81. // #endif
  82. // #ifdef MP-ALIPAY
  83. var custom = e.titleBarHeight;
  84. _this.height = custom+e.statusBarHeight;
  85. // #endif
  86. }
  87. })
  88. },
  89. components: {
  90. moduleNav,
  91. moduleDuo,
  92. modlueTuwen,
  93. modlueGoods,
  94. modlueTuijian,
  95. conTitle,modlueMsGoods,modluePtGoods,modlueYyGoods,
  96. modlueAd
  97. ,modlueStore
  98. },
  99. data() {
  100. return {
  101. // #ifdef MP-ALIPAY
  102. canIUse: my.canIUse('mkt'),
  103. // #endif
  104. placeholder: false,
  105. selectIndex: '', //选中
  106. activeIndex: '', //当前活动active
  107. height: 60,
  108. };
  109. },
  110. activated() {
  111. // console.log(this.moduleList)
  112. },
  113. computed: {
  114. ...mapState(['systemInfo', 'setColor', 'store_id', 'userInfo', 'teen_index', 'address'])
  115. },
  116. onLoad() {
  117. },
  118. };
  119. </script>
  120. <style>
  121. .header-title{
  122. position: fixed;
  123. top: 0;
  124. left: 0;
  125. width: 100%;
  126. z-index: 999;
  127. }
  128. </style>