index.vue 1.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. <template>
  2. <view class="activity-index">
  3. <nav-bar title="同期活动" @init="onInitNavbar"></nav-bar>
  4. <u-scroll-view :tabbar-conflict="true">
  5. <view class="main-container">
  6. <view class="activity-head">
  7. <view class="activity-head-title">同期活动</view>
  8. <view class="activity-head-desc">今年慕尼黑上海电子生产设备展将围绕四大行业主题开展共计9场同期论坛,论坛围绕工业机器人、柔性制造、储能与新能源、汽车线束、智能座舱、智能制造、TGV先进材料、封装、胶粘剂、新能源汽车等热门话题展开更多探讨与交流。</view>
  9. </view>
  10. <van-empty v-if="activityList.length === 0" description="暂无数据" />
  11. <view v-else class="activity-list">
  12. <template v-for="(item, index) in activityList">
  13. <activity-item :item="item" :key="index" />
  14. </template>
  15. </view>
  16. <!-- <disclaimer-text></disclaimer-text> -->
  17. </view>
  18. </u-scroll-view>
  19. </view>
  20. </template>
  21. <script>
  22. import NavBar from '@/components/layout/nav-bar'
  23. import UScrollView from '@/components/common/u-scroll-view'
  24. import ActivityItem from '@/pages/activity/components/activity-item.vue'
  25. import DisclaimerText from '@/components/disclaimer-text/index.vue'
  26. export default {
  27. options: {
  28. styleIsolation: 'shared'
  29. },
  30. components: {
  31. NavBar,
  32. UScrollView,
  33. ActivityItem,
  34. DisclaimerText
  35. },
  36. data() {
  37. return {
  38. activityList: [{ favourited: true }, {}, {}],
  39. }
  40. },
  41. created() {},
  42. methods: {
  43. }
  44. }
  45. </script>
  46. <style lang="scss">
  47. .activity-head{
  48. color: #333333;
  49. .activity-head-title{
  50. font-weight: bold;
  51. font-size: $fontSize6;
  52. line-height: 49rpx;
  53. }
  54. .activity-head-desc{
  55. margin-top: 20rpx;
  56. font-size: $fontSize3;
  57. line-height: 40rpx;
  58. }
  59. .activity-favourites-text{
  60. white-space: nowrap;
  61. }
  62. }
  63. .activity-list{
  64. display: grid;
  65. grid-template-columns: 1fr;
  66. grid-row-gap: 30rpx;
  67. margin-top: 40rpx;
  68. color: #333333;
  69. }
  70. </style>