123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173 |
- <template>
- <view class="more">
- <view class="supplier_login"><login-menu ref="login-menu" :menuList="menuList" @scrollPage="scrollPage" /></view>
- <view class="more-bg">
- <image src="https://static.caimei365.com/app/img/supplier-login/growth/banner.png" mode=""></image>
- </view>
- <view class="container">
- <view class="tabs">
- <view class="tab" :class="params.type === i.id ? 'active' : ''" v-for="i in activeTabs" :key="i.id" @click="handlerTabs(i)">
- {{ i.title }}
- </view>
- </view>
- <view class="growth-module-list">
- <active-team-com v-for="i in dataList" :key="i.id" :module="i" :active="params.type" @playVideo="playVideo"/>
- </view>
- </view>
- <cm-video :show="showVideo" @closeClick="closeVideo" :videoObj="videoObj" />
- </view>
- </template>
- <script>
- import LoginMenu from './components/supplier-loginMenu.vue'
- import activeTeamCom from './components/activeTeamCom.vue'
- import CmVideo from './components/caimei-video.vue'
- export default {
- components: {
- LoginMenu,
- activeTeamCom,
- CmVideo
- },
- data () {
- return {
- menuList: [
- {
- id: 0,
- title: '营销服务'
- },
- {
- id: 1,
- title: '解决方案'
- },
- {
- id: 2,
- title: '运营产品'
- },
- {
- id: 3,
- title: '营销工具'
- },
- {
- id: 4,
- title: '成功案例'
- },
- {
- id: 5,
- title: '关于采美'
- },
- {
- id: 6,
- title: '增长社区'
- }
- ],
- activeMenu: '',
- isActive: 6,
- activeTabs: [
- {
- id: 2,
- title: '美业企谈'
- },
- {
- id: 3,
- title: '干货知识'
- }
- ],
- dataList: [],
- showVideo: false,
- videoObj: {},
- params: {
- pageSize: 10,
- pageNum: 1,
- type: 2,
- source: 2
- },
- hasNextPage: false
- }
- },
- onLoad (option) {
- this.handlerInit()
- this.params.type = Number(option.active)
- this.getSupplierLanding(this.params.type)
- },
- onPullDownRefresh() {
- if (this.hasNextPage) {
- this.getSupplierLanding(this.params.type)
- }
- uni.stopPullDownRefresh()
- },
- methods: {
- // 滚动事件
- scrollPage($event) {
- this.activeMenu = $event
- uni.$emit('handlerChangeLink', $event)
- uni.navigateBack({ delta: 1 })
- },
- // init
- handlerInit () {
- this.$refs['login-menu'].activeMenu = 'item6'
- this.$refs['login-menu'].isActive = 6
- },
- handlerTabs ($event) {
- this.params.type = $event.id
- this.params.pageNum = 1
- this.dataList = []
- this.getSupplierLanding(this.params.type)
- },
- async getSupplierLanding(active) {
- try {
- const { data } = await this.UserService.supplierMoreList(this.params)
- this.dataList = [...this.dataList, ...data.list]
- } catch (error) {
- console.log(error)
- }
- },
- // 视频播放
- playVideo($event) {
- this.videoObj = $event
- this.showVideo = true
- },
- // 视频关闭
- closeVideo() {
- this.showVideo = false
- },
- }
- }
- </script>
- <style scoped lang="scss">
- .more {
- .more-bg {
- padding-top: 110rpx;
- height: 360rpx;
- image {
- width: 100%;
- height: 100%;
- }
- }
- .container {
- padding: 70rpx 33rpx;
- box-sizing: border-box;
- .tabs {
- padding-bottom: 30rpx;
- align-items: center;
- display: flex;
- box-sizing: border-box;
- .tab {
- color: #666666;
- font-size: 32rpx;
- margin-right: 56rpx;
- &.active {
- color: #333333;
- font-weight: bold;
- border-bottom: 3rpx solid #FF5B00;
- }
- }
- }
- .growth-module-list {
- display: grid;
- grid-template-columns: repeat(2, 1fr);
- grid-gap: 20rpx;
- }
- }
- }
- </style>
|