|
|
@@ -1,218 +1,1296 @@
|
|
|
<template>
|
|
|
- <view class="flex-col" :style="{height: winHeight + 'px'}">
|
|
|
- <!-- #ifdef MP -->
|
|
|
- <view class="cart_nav">
|
|
|
- <nav-bar iconColor='#fff' ref="navBarRef" navTitle="游戏搭子" backgroundColor="#FF6702" :isBackgroundColor="false">
|
|
|
- </nav-bar>
|
|
|
- </view>
|
|
|
- <!-- #endif -->
|
|
|
- <view class='newsList tui-skeleton flex-col' style="background-color: #fff;flex: 1;">
|
|
|
- <view class='nav flex-around-center'>
|
|
|
- <view class='item flex-center' v-for="(item,index) in navList" :key="index" :class='active==item.id?"on":""' @click='tabSelect(item.id, index)'>
|
|
|
- <view class="line1">{{item.name}}</view>
|
|
|
- <view class='line' v-show="active==item.id"></view>
|
|
|
+ <view :data-theme="theme" class="discover_index">
|
|
|
+ <view class="page_con" :style="{height: windowHeight + 'px'}">
|
|
|
+ <view class="discover-header relative z-999">
|
|
|
+ <!-- #ifdef APP || MP -->
|
|
|
+ <view class="mp-header" :style="{ height: navH + 'rpx'}">
|
|
|
+ <view class="sys-head" :style="{ height: sysHeight+'px' }"></view>
|
|
|
+ <view class="select_nav flex justify-center align-center" id="home" :style="{top: sysHeight+6+'px'}">
|
|
|
+ <text class="iconfont icon-fanhui2 px-20" @tap="returns"></text>
|
|
|
+ <image @click="goUser" class="avatar" :src="userInfo.avatar ? userInfo.avatar : urlDomain+'crmebimage/presets/morenT.png'">
|
|
|
+ </image>
|
|
|
+ <!-- <text class="iconfont icon-gengduo5 px-20" @tap.stop="showNav"></text> -->
|
|
|
+ <text class="nav_line"></text>
|
|
|
+ </view>
|
|
|
+ <view class="nav_title" :style="{ height: '80rpx',lineHeight: '80rpx', color: '#fff'}">
|
|
|
+ 游戏搭子
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- #endif -->
|
|
|
+ <view class="discover-navTab acea-row row-middle bg--w111-fff" style="margin: 4rpx 0;">
|
|
|
+ <view class="acea-row row-center-wrapper" :style="[textBoxStyle]">
|
|
|
+ <view style="margin-right: 52rpx;" :class="tabActive == 0 ? 'on' : ''" class="nav-item pb-10" @click="tabActive=0;showCateDrawer = false">本校</view>
|
|
|
+ <view :class="tabActive == 1 ? 'on' : ''" class="nav-item pb-10" @click="tabActive=1;">同城</view>
|
|
|
+ </view>
|
|
|
+ <!-- #ifndef MP -->
|
|
|
+ <view style="width: 32rpx;"></view>
|
|
|
+ <!-- #endif -->
|
|
|
+ </view>
|
|
|
+ <!-- 话题分类 -->
|
|
|
+ <view class="longTab mb-10" scroll-y enhanced>
|
|
|
+ <view class="flex h-116">
|
|
|
+ <view class="flex-1 h-full flex-center longTab-item" :style="{background: index === tabClick ? 'rgba(255, 102, 0, 1)' : '#fff', color: index === tabClick ? '#fff' : ''}"
|
|
|
+ v-for="(item, index) in categoryList" :key="index" :id="'id' + index" @click.stop="selectMenu(item, index, true)">
|
|
|
+ <view class="flex-center">
|
|
|
+ <image class="mr-20 h-38" :style="{width: item.width}" :src="index === tabClick ? item.iconXz : item.iconWx"
|
|
|
+ mode="aspectFit"></image>
|
|
|
+ <view class="wall-font f-s-24 f-w-500">{{item.name}}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class='search acea-row '>
|
|
|
+ <view class='input acea-row row-middle'>
|
|
|
+ <text class='iconfont icon-sousuo2'></text>
|
|
|
+ <input class="placeholder" type='text' v-model='searchValue' placeholder='搜索好物' placeholder-class='placeholder'
|
|
|
+ confirm-type="search" @confirm="searchBut()"></input>
|
|
|
+ </view>
|
|
|
+ <view class='bnt' @tap='searchBut'>搜索</view>
|
|
|
</view>
|
|
|
+ <!-- banner轮播图 -->
|
|
|
+ <view class="mb-10" v-if="bannerList.length">
|
|
|
+ <swiper :indicator-dots="true" :autoplay="true" :interval="2500" :duration="500" circular="true">
|
|
|
+ <block v-for="(item,index) in bannerList" :key='item.id'>
|
|
|
+ <swiper-item>
|
|
|
+ <view class="swiper-item">
|
|
|
+ <image class="banner-img" :src="item.imageUrl" mode="scaleToFill" />
|
|
|
+ </view>
|
|
|
+ </swiper-item>
|
|
|
+ </block>
|
|
|
+ </swiper>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="discover-boxsss">
|
|
|
+ <scroll-view @scroll="scrollLeft" scroll-y="true" :show-scrollbar="false" class="scroll-view h-full" id="goods"
|
|
|
+ refresher-enabled="true" :refresher-threshold="100" :refresher-triggered="triggeredDiscover" @refresherrefresh="onRefreshDiscover"
|
|
|
+ @refresherpulling="onPulling" @refresherrestore="onRestore" @refresherabort="onAbort">
|
|
|
+ <view class="goods padbottom">
|
|
|
+ <view class="goods-wrap flex-1" id="goods" v-if="discoverList[tabClick] && discoverList[tabClick].goods.length">
|
|
|
+ <view>
|
|
|
+ <WaterfallsFlow :column="true" v-if="discoverList[tabClick].goods.length" :wfList="discoverList[tabClick].goods"
|
|
|
+ :fromType="1" :isDazi="true">
|
|
|
+ </WaterfallsFlow>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class='loadingicon acea-row row-center-wrapper'>
|
|
|
+ <text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{discoverList[tabClick] &&discoverList[tabClick].goods.length>0?loadTitle:''}}
|
|
|
+ </view>
|
|
|
+ <view class="empty-boxs noContent" v-if="discoverList[tabClick] && discoverList[tabClick].goods.length == 0 && !loading">
|
|
|
+ <emptyPage title="暂无内容~" mTop="13%" :imgSrc="urlDomain+'crmebimage/presets/noguanzhu.png'">
|
|
|
+ </emptyPage>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="footerBottoms"></view>
|
|
|
+ </view>
|
|
|
+ </scroll-view>
|
|
|
</view>
|
|
|
- <view class='list' style="flex: 1;">
|
|
|
- <template v-if="active == 1">
|
|
|
- </template>
|
|
|
- <template v-if="active == 2">
|
|
|
- </template>
|
|
|
+ <view class="publish" @click="publish" :class="bottomNavigationIsCustom?'bottom':''">
|
|
|
+ <image class="w-116 h-116" src="/static/img/ic-fatie.png" mode=""></image>
|
|
|
</view>
|
|
|
+
|
|
|
</view>
|
|
|
+ <!-- <pageFooter v-if="isShowFooter"></pageFooter> -->
|
|
|
+
|
|
|
+ <!-- 评论 -->
|
|
|
+ <uni-popup type="bottom" ref="comment">
|
|
|
+ <view :style="'width: '+ windowWidth +'px; background-color: #fff; border-top-left-radius: 10px; border-top-right-radius: 10px;'">
|
|
|
+ <discoverComment v-if="showComment" @getReplyNum="getReplyNum" :noteId="noteDetails.id" :noteDetails="noteDetails"
|
|
|
+ @close="close">
|
|
|
+ </discoverComment>
|
|
|
+ </view>
|
|
|
+ </uni-popup>
|
|
|
+ <!-- 商品列表 -->
|
|
|
+ <uni-popup type="bottom" ref="goods">
|
|
|
+ <mentioned v-if="popupShow" :list="proList" @close="popup" class=""></mentioned>
|
|
|
+ </uni-popup>
|
|
|
+ <!-- 学校 -->
|
|
|
+ <uni-popup ref="schoolRef" :is-mask-click="false">
|
|
|
+ <view class="w-full flex-center" :style="{height: windowHeight + 'px'}">
|
|
|
+ <navigator hover-class='none' url='/pages/discover/discover_user/index'>
|
|
|
+ <image src="/static/img/ic-school.png" mode="heightFix" style="height: 694rpx;width: 616rpx;"></image>
|
|
|
+ </navigator>
|
|
|
+ </view>
|
|
|
+ </uni-popup>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- // +----------------------------------------------------------------------
|
|
|
- // | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
|
|
|
- // +----------------------------------------------------------------------
|
|
|
- // | Copyright (c) 2016~2025 https://www.crmeb.com All rights reserved.
|
|
|
- // +----------------------------------------------------------------------
|
|
|
- // | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
|
|
|
- // +----------------------------------------------------------------------
|
|
|
- // | Author: CRMEB Team <admin@crmeb.com>
|
|
|
- // +----------------------------------------------------------------------
|
|
|
- import navBar from '@/components/navBar';
|
|
|
- import animationType from '@/utils/animationType.js'
|
|
|
- import tuiSkeleton from '@/components/base/tui-skeleton.vue';
|
|
|
import {
|
|
|
- getAddressList
|
|
|
- } from '@/api/user.js';
|
|
|
+ mapGetters
|
|
|
+ } from "vuex";
|
|
|
+ import {
|
|
|
+ toLogin
|
|
|
+ } from '@/libs/login.js';
|
|
|
+ import {
|
|
|
+ BACK_URL
|
|
|
+ } from '@/config/cache';
|
|
|
+ import {
|
|
|
+ communityCategoryListApi,
|
|
|
+ recommendAuthorListApi,
|
|
|
+ discoverListApi,
|
|
|
+ followListApi,
|
|
|
+ getCommunityInfo
|
|
|
+ } from '@/api/discover.js';
|
|
|
+ import {
|
|
|
+ discoverFollowAuthor,
|
|
|
+ } from '@/libs/follow.js';
|
|
|
+ import {
|
|
|
+ tokenIsExistApi
|
|
|
+ } from '@/api/api.js';
|
|
|
+ import {
|
|
|
+ silenceBindingSpread,
|
|
|
+ getUserSpread
|
|
|
+ } from '@/utils/index.js';
|
|
|
+ import onShare from "@/mixins/onShare";
|
|
|
+ import discoverComment from '@/components/discoverComment/index.vue';
|
|
|
+ import animationType from '@/utils/animationType.js'
|
|
|
+ import pageFooter from "@/components/pageFooter/index.vue";
|
|
|
+ import navBar from '@/components/navBar';
|
|
|
+ import emptyPage from '@/components/emptyPage.vue';
|
|
|
+ import easyLoadimage from '@/components/base/easy-loadimage.vue';
|
|
|
+ import WaterfallsFlow from '@/components/WaterfallsFlow/WaterfallsFlow.vue'
|
|
|
+ import WaterfallsFlowItem from '@/components/discoverFlowItem/discoverFlowItem.vue'
|
|
|
+ import discoverDetails from '@/components/discoverDetails/index.vue'
|
|
|
+ import mentioned from '@/components/mentioned.vue';
|
|
|
+ import TitleBox from '@/components/titleBox/index.vue';
|
|
|
let app = getApp();
|
|
|
+ let sysHeight = uni.getSystemInfoSync().statusBarHeight;
|
|
|
export default {
|
|
|
+ mixins: [onShare],
|
|
|
components: {
|
|
|
- tuiSkeleton,
|
|
|
- navBar
|
|
|
+ pageFooter,
|
|
|
+ navBar,
|
|
|
+ emptyPage,
|
|
|
+ easyLoadimage,
|
|
|
+ WaterfallsFlowItem,
|
|
|
+ WaterfallsFlow,
|
|
|
+ discoverDetails,
|
|
|
+ discoverComment,
|
|
|
+ mentioned,
|
|
|
+ TitleBox
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters(['globalData', 'isLogin', 'userInfo', 'bottomNavigationIsCustom']),
|
|
|
+ headerBoxStyle() {
|
|
|
+ return {
|
|
|
+ // #ifndef MP
|
|
|
+ paddingTop: '4rpx',
|
|
|
+ // #endif
|
|
|
+ // #ifdef MP
|
|
|
+ paddingTop: this.marTop + "px",
|
|
|
+ marginRight: this.statusWidth + this.searchRight + 'px',
|
|
|
+ // #endif
|
|
|
+ }
|
|
|
+ },
|
|
|
+ textBoxStyle() {
|
|
|
+ return {
|
|
|
+ // #ifdef MP
|
|
|
+ width: '100%',
|
|
|
+ height: this.searchHeight + 'rpx',
|
|
|
+ // lineHeight: this.searchHeight + 'rpx',
|
|
|
+ // #endif
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(options) {
|
|
|
+ //分销码
|
|
|
+ getUserSpread(options);
|
|
|
+
|
|
|
+ this.windowWidth = uni.getSystemInfoSync().screenWidth; //获取屏幕宽度
|
|
|
+ tokenIsExistApi().then(res => {
|
|
|
+ this.tokenIsExist = res.data;
|
|
|
+ if (this.tokenIsExist && this.isLogin) {
|
|
|
+ this.getFollowList();
|
|
|
+ setTimeout(() => {
|
|
|
+ if (this.noteRecommendList.length === 0 || this.loadendfollow) this
|
|
|
+ .getRecommendAuthorList();
|
|
|
+ }, 500)
|
|
|
+ }
|
|
|
+ if (!this.tokenIsExist) {
|
|
|
+ this.$store.commit('UPDATE_LOGIN', '');
|
|
|
+ this.$store.commit('UPDATE_USERINFO', {});
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.getDiscoverList();
|
|
|
+ // this.getCommunityCategoryList();
|
|
|
+
|
|
|
+ this._freshing = false;
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
- winHeight: 0,
|
|
|
- isNodes: 0, //控制什么时候开始抓取元素节点,只要数值改变就重新抓取
|
|
|
- autoplay: true,
|
|
|
+ searchValue: '',
|
|
|
+ returnShow: false,
|
|
|
+ urlDomain: this.$Cache.get("imgHost"),
|
|
|
+ sysHeight: sysHeight,
|
|
|
+ navH: '',
|
|
|
+ windowWidth: 0, //获取屏幕宽度🌟💗
|
|
|
+ interval: 3000,
|
|
|
+ swiperHeight: 0,
|
|
|
+ listMarTop: 0,
|
|
|
+ tabClick: 0, //设置导航点击了哪一个
|
|
|
+ tabLeft: 0, //设置下划线位置
|
|
|
+ isLeft: 0, //导航栏下划线位置
|
|
|
+ isWidth: 0, //每个导航栏占位
|
|
|
+ tabActive: 1, // 顶部关注、发现切换
|
|
|
+ windowHeight: 0,
|
|
|
+ theme: app.globalData.theme,
|
|
|
+ marTop: 0,
|
|
|
+ categoryList: [{
|
|
|
+ id: 1,
|
|
|
+ width: '51rpx',
|
|
|
+ iconXz: '/static/img/ic-dazi-pwgl.png',
|
|
|
+ iconWx: '/static/img/ic-dazi-pwbl.png',
|
|
|
+ name: '游戏搭子'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 2,
|
|
|
+ width: '38rpx',
|
|
|
+ iconXz: '/static/img/ic-dazi-dlgl.png',
|
|
|
+ iconWx: '/static/img/ic-dazi-dlbl.png',
|
|
|
+ name: '代练'
|
|
|
+ },
|
|
|
+ ], //分类列表
|
|
|
+ categoryId: 0, //分类id
|
|
|
+ swiperCurrent: 0, //分类索引
|
|
|
+ isScroll: false, //是否是滑动
|
|
|
+ params: { //推荐作者
|
|
|
+ page: 1,
|
|
|
+ limit: 10
|
|
|
+ },
|
|
|
+ followParams: { //关注内容
|
|
|
+ page: 1,
|
|
|
+ limit: 10
|
|
|
+ },
|
|
|
+ noteRecommendList: [], //关注内容
|
|
|
+ loadendfollow: false, //关注内容
|
|
|
+ loadingfollow: false, //关注内容
|
|
|
+ where: {
|
|
|
+ categoryId: 0,
|
|
|
+ page: 1,
|
|
|
+ limit: 10
|
|
|
+ },
|
|
|
+ loadend: false,
|
|
|
+ loading: false,
|
|
|
+ loadTitle: '加载更多',
|
|
|
+ loadTitleFollow: '加载更多',
|
|
|
+ onnnn: {
|
|
|
+ good: [{
|
|
|
+ authorId: 1
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ discoverList: {}, //内容信息
|
|
|
+ authorList: [], //推荐作者列表
|
|
|
+ isOpenRefresh: true, // 是否开启下拉
|
|
|
+ triggered: false,
|
|
|
+ triggeredDiscover: false,
|
|
|
+ isShow: false, //加载完成
|
|
|
+ tokenIsExist: false, //校验token是否有效,true为有效，false为无效
|
|
|
+ isRefresher: false, //下拉刷新状态
|
|
|
+ noteDetails: {}, //内容详情
|
|
|
+ popupShow: false, //商品弹窗
|
|
|
+ showComment: false, //评论弹窗
|
|
|
+ proList: [], //提到的商品
|
|
|
+ isShowFooter: true,
|
|
|
+ loadingAuthor: false, //推荐作者
|
|
|
+ showCateDrawer: false, //分类下拉展示
|
|
|
+ searchRight: 0,
|
|
|
+ statusWidth: 0,
|
|
|
+ searchHeight: 0,
|
|
|
+ bannerList: [],
|
|
|
+ wallHeadline: [],
|
|
|
navList: [{
|
|
|
+ id: 0,
|
|
|
+ name: '默认'
|
|
|
+ }, {
|
|
|
id: 1,
|
|
|
- name: '本校'
|
|
|
+ name: '评论'
|
|
|
}, {
|
|
|
id: 2,
|
|
|
- name: '同城'
|
|
|
+ name: '点赞'
|
|
|
+ }, {
|
|
|
+ id: 3,
|
|
|
+ name: '有图'
|
|
|
}],
|
|
|
- active: 1,
|
|
|
- scrollLeft: 0,
|
|
|
- addressItem: {}
|
|
|
- };
|
|
|
+ active: 0,
|
|
|
+ }
|
|
|
},
|
|
|
- onLoad() {
|
|
|
- let that = this;
|
|
|
- uni.getSystemInfo({
|
|
|
- success: function(res) {
|
|
|
- that.winHeight = res.windowHeight
|
|
|
- },
|
|
|
+ // 滚动监听
|
|
|
+ onPageScroll(e) {
|
|
|
+ // 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件
|
|
|
+ uni.$emit('scroll');
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ this.getHandInfo();
|
|
|
+ // this.reFresh()
|
|
|
+ this.showCateDrawer = false;
|
|
|
+ this.getTokenIsExist();
|
|
|
+ //分销绑定
|
|
|
+ silenceBindingSpread(this.isLogin, this.globalData.spread);
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.$nextTick(function() {
|
|
|
+ const query = uni.createSelectorQuery().in(this);
|
|
|
+ query.select('.discover-header').boundingClientRect(data => {
|
|
|
+ // #ifndef H5
|
|
|
+ this.listMarTop = data.height
|
|
|
+ // #endif
|
|
|
+ // #ifdef H5
|
|
|
+ this.listMarTop = data.height
|
|
|
+ // #endif
|
|
|
+ }).exec();
|
|
|
});
|
|
|
- this.getaddressInfo()
|
|
|
},
|
|
|
- /**
|
|
|
- * 生命周期函数--监听页面显示
|
|
|
- */
|
|
|
- onShow: function() {
|
|
|
- let that = this;
|
|
|
- uni.$on('addressItem', function(res) {
|
|
|
- that.$set(that, 'addressItem', res);
|
|
|
+ created() {
|
|
|
+ var pages = getCurrentPages();
|
|
|
+ this.returnShow = pages.length === 1 ? false : true;
|
|
|
+ var that = this;
|
|
|
+ // 获取设备宽度
|
|
|
+ uni.getSystemInfo({
|
|
|
+ success(e) {
|
|
|
+ that.isWidth = e.windowWidth / 6;
|
|
|
+ that.windowHeight = e.windowHeight;
|
|
|
+ that.swiperHeight = that.windowHeight - 205
|
|
|
+ that.$set(that, 'swiperHeight', that.windowHeight - 55);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ // #ifdef MP || APP-PLUS
|
|
|
+ // 获取导航高度；
|
|
|
+ this.navH = this.globalData.navHeight;
|
|
|
+ // #endif
|
|
|
+ // #ifdef H5
|
|
|
+ this.navH = 80;
|
|
|
+ // #endif
|
|
|
+ that.getNavH()
|
|
|
+
|
|
|
+ // #ifdef MP
|
|
|
+ const res = uni.getMenuButtonBoundingClientRect()
|
|
|
+ const jnHeight = res.height //胶囊高度
|
|
|
+ const statusHeight = res.top //胶囊距离顶部
|
|
|
+ const statusRight = res.right //胶囊右边界坐标
|
|
|
+ this.statusWidth = res.width
|
|
|
+ this.searchHeight = 96
|
|
|
+ console.log('999', statusHeight, this.sysHeight);
|
|
|
+ this.marTop = statusHeight - this.sysHeight
|
|
|
+ //搜索框宽度计算
|
|
|
+ uni.getSystemInfo({
|
|
|
+ success: res => {
|
|
|
+ this.searchRight = res.windowWidth - statusRight
|
|
|
+ }
|
|
|
})
|
|
|
+ // #endif
|
|
|
+ },
|
|
|
+ //uniapp小程序用deep重写组件样式不生效
|
|
|
+ options: {
|
|
|
+ styleIsolation: 'shared'
|
|
|
},
|
|
|
methods: {
|
|
|
- tabSelect(active, e) {
|
|
|
- this.active = active;
|
|
|
+ searchBut() {
|
|
|
+ console.log(this.searchValue)
|
|
|
+ },
|
|
|
+ returns: function() {
|
|
|
+ if (this.returnShow) {
|
|
|
+ uni.navigateBack(-1);
|
|
|
+ } else {
|
|
|
+ uni.switchTab({
|
|
|
+ url: '/pages/index/index'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getHandInfo() {
|
|
|
+ getCommunityInfo().then(res => {
|
|
|
+ this.bannerList = res.data.banner
|
|
|
+ this.wallHeadline = res.data.headline
|
|
|
+ console.log(res.data, 111111111111111)
|
|
|
+ if (!res.data.school) {
|
|
|
+ this.$refs.schoolRef.open('top')
|
|
|
+ } else {
|
|
|
+ this.$refs.schoolRef.close()
|
|
|
+ }
|
|
|
+ }).catch(err => {
|
|
|
+ console.log(err)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getNavH(marTop) {
|
|
|
+ // #ifdef H5
|
|
|
+ this.marTop = 30;
|
|
|
+ // #endif
|
|
|
+ // #ifdef APP
|
|
|
+ this.marTop = marTop - 60;
|
|
|
+ // #endif
|
|
|
+ },
|
|
|
+ getPro(item) {
|
|
|
+ this.noteDetails = item;
|
|
|
+ this.proList = item.productList;
|
|
|
+ this.$refs.goods.open('bottom');
|
|
|
+ this.popupShow = true;
|
|
|
+ setTimeout(() => {
|
|
|
+ if (!this.bottomNavigationIsCustom) {
|
|
|
+ uni.hideTabBar();
|
|
|
+ } else {
|
|
|
+ this.isShowFooter = false;
|
|
|
+ }
|
|
|
+ }, 50)
|
|
|
+ },
|
|
|
+ popup() {
|
|
|
+ if (!this.bottomNavigationIsCustom) {
|
|
|
+ uni.showTabBar();
|
|
|
+ } else {
|
|
|
+ this.isShowFooter = true;
|
|
|
+ }
|
|
|
+ setTimeout(() => {
|
|
|
+ this.$refs.goods.close();
|
|
|
+ this.popupShow = false;
|
|
|
+ }, 100)
|
|
|
+
|
|
|
+ },
|
|
|
+ close() {
|
|
|
+ if (!this.bottomNavigationIsCustom) {
|
|
|
+ uni.showTabBar();
|
|
|
+ } else {
|
|
|
+ this.isShowFooter = true;
|
|
|
+ }
|
|
|
+ setTimeout(() => {
|
|
|
+ this.$refs.comment.close();
|
|
|
+ this.showComment = false;
|
|
|
+ }, 100);
|
|
|
+ },
|
|
|
+ getReplyNum(n) {
|
|
|
+ this.noteDetails.replyNum = n;
|
|
|
+ },
|
|
|
+ getComment(item) {
|
|
|
+ this.noteDetails = item;
|
|
|
+ this.$refs.comment.open('bottom');
|
|
|
+ this.showComment = true;
|
|
|
+ setTimeout(() => {
|
|
|
+ if (!this.bottomNavigationIsCustom) {
|
|
|
+ uni.hideTabBar();
|
|
|
+ } else {
|
|
|
+ this.isShowFooter = false;
|
|
|
+ }
|
|
|
+ }, 50)
|
|
|
+ },
|
|
|
+ //校验token是否有效,true为有效，false为无效
|
|
|
+ getTokenIsExist() {
|
|
|
+ tokenIsExistApi().then(res => {
|
|
|
+ this.tokenIsExist = res.data;
|
|
|
+ if (!this.tokenIsExist) {
|
|
|
+ this.$store.commit('UPDATE_LOGIN', '');
|
|
|
+ this.$store.commit('UPDATE_USERINFO', {});
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 去推荐作者个人主人
|
|
|
+ goAuthor(item) {
|
|
|
+ // #ifdef MP || H5
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pages/discover/discover_user/index?id=${item.authorId}`
|
|
|
+ })
|
|
|
+ // #endif
|
|
|
+ // #ifdef APP-PLUS
|
|
|
+ uni.navigateTo({
|
|
|
+ animationType: animationType.type,
|
|
|
+ animationDuration: animationType.duration,
|
|
|
+ url: `/pages/discover/discover_user/index?id=${item.authorId}`
|
|
|
+ })
|
|
|
+ // #endif
|
|
|
+ },
|
|
|
+ // 自定义下拉刷新被中止
|
|
|
+ onAbort() {
|
|
|
+ console.error("onAbort");
|
|
|
+ },
|
|
|
+ onPulling(e) {
|
|
|
+ if (e.detail.deltaY < 0) return // 防止上滑页面也触发下拉
|
|
|
+ if (this.tabActive == 1) {
|
|
|
+ this.triggeredDiscover = true;
|
|
|
+ } else {
|
|
|
+ this.triggered = true;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 下拉刷新触发
|
|
|
+ refresherpullingFun() {
|
|
|
+ this.isRefresher = true
|
|
|
+ },
|
|
|
+ onRefreshDiscover() {
|
|
|
+ if (this._freshing) return;
|
|
|
+ this._freshing = true;
|
|
|
+ setTimeout(() => {
|
|
|
+ this._freshing = false;
|
|
|
+ this.discoverList = {}
|
|
|
+ this.getDiscoverList();
|
|
|
+ this.triggeredDiscover = false;
|
|
|
+ uni.stopPullDownRefresh();
|
|
|
+ this._freshing = false;
|
|
|
+ }, 1000)
|
|
|
},
|
|
|
- /*
|
|
|
- * 获取默认收货地址或者获取某条地址信息
|
|
|
+ onRefresh() {
|
|
|
+ if (this._freshing) return;
|
|
|
+ this._freshing = true;
|
|
|
+ setTimeout(() => {
|
|
|
+ this.loadendfollow = false;
|
|
|
+ this.loadend = false;
|
|
|
+ this.noteRecommendList = [];
|
|
|
+ this.followParams.page = 1;
|
|
|
+ this.authorList = [];
|
|
|
+ this.params.page = 1;
|
|
|
+ this.getFollowList();
|
|
|
+ setTimeout(() => {
|
|
|
+ if (this.noteRecommendList.length === 0 || this.loadendfollow) this
|
|
|
+ .getRecommendAuthorList();
|
|
|
+ }, 400)
|
|
|
+ this.triggered = false
|
|
|
+ uni.stopPullDownRefresh();
|
|
|
+ this._freshing = false;
|
|
|
+ }, 1000)
|
|
|
+ },
|
|
|
+ onRestore() {
|
|
|
+ this.triggeredDiscover = false;
|
|
|
+ },
|
|
|
+ //关注内容
|
|
|
+ getFollowList() {
|
|
|
+ if (this.loadendfollow) {
|
|
|
+ this.triggered = false;
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this.loadingfollow = true;
|
|
|
+ followListApi(this.followParams).then(res => {
|
|
|
+ this.$set(this.followParams, 'page', this.followParams.page + 1);
|
|
|
+ this.loadendfollow = this.followParams.page > res.data.totalPage;
|
|
|
+ this.loadTitleFollow = this.loadendfollow ? '' : '加载更多';
|
|
|
+ this.noteRecommendList = this.noteRecommendList.concat(res.data.list || []);
|
|
|
+ this.loadingfollow = false
|
|
|
+ this.triggered = false;
|
|
|
+ }).catch(err => {
|
|
|
+ this.loadingfollow = false;
|
|
|
+ this.triggered = false;
|
|
|
+ uni.showToast({
|
|
|
+ title: err,
|
|
|
+ icon: 'none'
|
|
|
+ })
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 关注作者
|
|
|
+ followAuthor(item) {
|
|
|
+ if (this.isLogin) {
|
|
|
+ discoverFollowAuthor(item.authorId).then(() => {
|
|
|
+ this.$set(item, 'isConcerned', !item.isConcerned);
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ toLogin();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //回退页面之后重新加载页面
|
|
|
+ reFresh() {
|
|
|
+ this.loading = true
|
|
|
+ this.discoverList = {};
|
|
|
+ this.getDiscoverList();
|
|
|
+ },
|
|
|
+ //发布内容
|
|
|
+ publish() {
|
|
|
+ if (this.isLogin) {
|
|
|
+ // #ifdef MP || H5
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pages/discover/discover_release/index?dazi=${true}`
|
|
|
+ })
|
|
|
+ // #endif
|
|
|
+ // #ifdef APP-PLUS
|
|
|
+ uni.navigateTo({
|
|
|
+ animationType: animationType.type,
|
|
|
+ animationDuration: animationType.duration,
|
|
|
+ url: `/pages/discover/discover_release/index?dazi=${true}`
|
|
|
+ })
|
|
|
+ // #endif
|
|
|
+ } else {
|
|
|
+ toLogin();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 发现列表滑动中用到的方法
|
|
|
*/
|
|
|
- getaddressInfo: function() {
|
|
|
- getAddressList().then(res => {
|
|
|
- console.log('地址', res)
|
|
|
- if (res.code = 200) {
|
|
|
- if (res.data.length !== 0) {
|
|
|
- this.addressItem = res.data.find(item => item.isDefault === true) || {} // this.addressItem = res.data[0];
|
|
|
- } else {
|
|
|
- this.addressItem = {}
|
|
|
- }
|
|
|
- console.log('默认地址', this.addressItem)
|
|
|
+ followScroll() {
|
|
|
+ uni.$emit('scroll');
|
|
|
+ },
|
|
|
+ onTouchmoveRecommend(e) {
|
|
|
+ if (!this.loadendfollow) this.getFollowList();
|
|
|
+ if (this.loadendfollow && !this.loadend) this.getRecommendAuthorList();
|
|
|
+ },
|
|
|
+ onTouchmove(e) {
|
|
|
+ this.getDiscoverList();
|
|
|
+ },
|
|
|
+ scrollLeft: function(e) {
|
|
|
+ uni.$emit('scroll');
|
|
|
+ if (e.detail.scrollTop > e.detail.scrollHeight - 1500) {
|
|
|
+ this.getDiscoverList();
|
|
|
+ }
|
|
|
+ this.swiperHeight = this.windowHeight - 55
|
|
|
+ },
|
|
|
+ swiperChange(e) {
|
|
|
+ let {
|
|
|
+ current,
|
|
|
+ source,
|
|
|
+ currentItemId
|
|
|
+ } = e.detail;
|
|
|
+ if (source === 'autoplay' || source === 'touch') {
|
|
|
+ this.categoryId = currentItemId;
|
|
|
+ this.swiperCur = current
|
|
|
+ this.selectMenu(this.categoryList[this.swiperCur], this.swiperCur, false)
|
|
|
+ if (this.categoryList.length > 3) {
|
|
|
+ var tempIndex = this.swiperCur - 2;
|
|
|
+ tempIndex = tempIndex <= 0 ? 0 : tempIndex;
|
|
|
+ let tabLeft = (this.swiperCur - 2) * this.isWidth; //设置下划线位置
|
|
|
+ this.$nextTick(function() {
|
|
|
+ this.$set(this, 'tabLeft', tabLeft);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /*******************发现列表滑动中用到的方法结束*********************/
|
|
|
+
|
|
|
+ // 去个人主人
|
|
|
+ goUser() {
|
|
|
+ if (!this.isLogin) {
|
|
|
+ this.openAuto();
|
|
|
+ } else {
|
|
|
+ // #ifdef MP || H5
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/discover/discover_user/index'
|
|
|
+ })
|
|
|
+ // #endif
|
|
|
+ // #ifdef APP-PLUS
|
|
|
+ uni.navigateTo({
|
|
|
+ animationType: animationType.type,
|
|
|
+ animationDuration: animationType.duration,
|
|
|
+ url: '/pages/discover/discover_user/index'
|
|
|
+ })
|
|
|
+ // #endif
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 打开授权
|
|
|
+ openAuto() {
|
|
|
+ this.$Cache.set(BACK_URL, '')
|
|
|
+ toLogin();
|
|
|
+ },
|
|
|
+ //发现列表
|
|
|
+ getDiscoverList() {
|
|
|
+ let that = this;
|
|
|
+ this.isShow = false;
|
|
|
+ if (!this.discoverList[this.categoryId]) {
|
|
|
+ this.$set(this.discoverList, this.categoryId, {
|
|
|
+ where: {
|
|
|
+ ...this.where,
|
|
|
+ categoryId: this.categoryId,
|
|
|
+ secondType: this.active
|
|
|
+ },
|
|
|
+ goods: []
|
|
|
+ })
|
|
|
+ }
|
|
|
+ const data = this.discoverList[this.categoryId];
|
|
|
+ const cateId = this.categoryId;
|
|
|
+ if (data.loading || data.loadend) {
|
|
|
+ this.triggeredDiscover = false;
|
|
|
+ return
|
|
|
+ };
|
|
|
+ data.loading = true
|
|
|
+ this.loading = true
|
|
|
+ this.loadTitle = '';
|
|
|
+ if (data.where.categoryId === 0) data.where.categoryId = ''
|
|
|
+ discoverListApi(data.where).then(res => {
|
|
|
+ data.loadend = res.data.list.length < that.where.limit;
|
|
|
+ if (data.where.page == 1) {
|
|
|
+ data.goods = [];
|
|
|
}
|
|
|
+ this.loadTitle = data.loadend ? '没有了' : '加载更多';
|
|
|
+ data.goods.push.apply(data.goods, res.data.list);
|
|
|
+ data.where.page = data.where.page + 1;
|
|
|
+ that.$nextTick(() => {
|
|
|
+ that.$set(that.discoverList, cateId, {
|
|
|
+ ...data
|
|
|
+ });
|
|
|
+
|
|
|
+ });
|
|
|
+ data.loading = false;
|
|
|
+ this.loading = false;
|
|
|
+ this.triggeredDiscover = false;
|
|
|
+ this.$forceUpdate()
|
|
|
+ console.log(that.discoverList)
|
|
|
+ }).catch(err => {
|
|
|
+ data.loading = false;
|
|
|
+ this.loading = false;
|
|
|
+ uni.showToast({
|
|
|
+ title: err,
|
|
|
+ icon: 'none'
|
|
|
+ })
|
|
|
+ this.$set(this.discoverList, cateId, data);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //推荐作者列表
|
|
|
+ getRecommendAuthorList() {
|
|
|
+ if (this.loadend) return;
|
|
|
+ this.loading = true
|
|
|
+ recommendAuthorListApi(this.params).then(res => {
|
|
|
+ this.$set(this.params, 'page', this.params.page + 1);
|
|
|
+ this.loadend = this.params.page > res.data.totalPage;
|
|
|
+ this.authorList = this.authorList.concat(res.data.list || []);
|
|
|
+ this.loadTitle = this.loadend ? '没有了' : '加载更多';
|
|
|
+ this.loading = false
|
|
|
})
|
|
|
- }
|
|
|
+ },
|
|
|
+ //分类列表
|
|
|
+ getCommunityCategoryList() {
|
|
|
+ let data = [{
|
|
|
+ name: "全部",
|
|
|
+ id: '-1',
|
|
|
+ icon: '/static/img/ic-wall-type--1.png'
|
|
|
+ }];
|
|
|
+ communityCategoryListApi().then(res => {
|
|
|
+ this.categoryList = Array.from(new Set([...data, ...res.data]));
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ // 点击列表头部
|
|
|
+ selectMenu(item, index, isScroll) {
|
|
|
+ if (this.tabClick == index) return
|
|
|
+ this.active = 0
|
|
|
+ this.triggeredDiscover = false;
|
|
|
+ this.categoryId = item.id;
|
|
|
+ this.swiperCurrent = index;
|
|
|
+ this.isScroll = isScroll;
|
|
|
+ this.tabClick = index; //设置导航点击了哪一个
|
|
|
+ this.isLeft = index * this.isWidth; //设置下划线位置
|
|
|
+ this.where.categoryId = item.id;
|
|
|
+ this.showCateDrawer = false
|
|
|
+ this.getDiscoverList();
|
|
|
+ },
|
|
|
+ tabSelect(active, e) {
|
|
|
+ if (this.active == active) return
|
|
|
+ this.active = active;
|
|
|
+ this.triggeredDiscover = false;
|
|
|
+ this.discoverList[this.categoryId].loading = false
|
|
|
+ this.discoverList[this.categoryId].loadend = false
|
|
|
+ this.discoverList[this.categoryId].where.page = 1
|
|
|
+ this.discoverList[this.categoryId].where.secondType = active
|
|
|
+ this.getDiscoverList();
|
|
|
+ },
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
-<style lang="scss">
|
|
|
- .courie {
|
|
|
- padding: 14rpx 24rpx 0 24rpx;
|
|
|
- font-weight: 500;
|
|
|
- font-size: 23rpx;
|
|
|
- color: $bg-color-primary;
|
|
|
- background-color: #fff;
|
|
|
+<style lang="scss" scoped>
|
|
|
+ /deep/.wf-page {
|
|
|
+ background-color: #fff !important;
|
|
|
+ }
|
|
|
|
|
|
- image {
|
|
|
- width: 46rpx;
|
|
|
- height: 46rpx;
|
|
|
- margin-right: 15rpx;
|
|
|
- }
|
|
|
+ .discover_video_icon {
|
|
|
+ top: 50% !important;
|
|
|
+ left: 50% !important;
|
|
|
+ right: 0 !important;
|
|
|
+ -webkit-transform: translate(-50%, -50%);
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
}
|
|
|
|
|
|
- .newsList .swiper {
|
|
|
- width: 100%;
|
|
|
- position: relative;
|
|
|
- box-sizing: border-box;
|
|
|
- padding: 0 30rpx;
|
|
|
+ .mp-header {
|
|
|
+ background-color: $bg-color-primary;
|
|
|
+ }
|
|
|
+
|
|
|
+ .select_nav {
|
|
|
+ width: 170rpx !important;
|
|
|
+ height: 60rpx !important;
|
|
|
+ border-radius: 33rpx;
|
|
|
+ // background: rgba(255, 255, 255, 0.6);
|
|
|
+ // border: 1rpx solid rgba(0, 0, 0, 0.1);
|
|
|
+ color: #000;
|
|
|
+ position: fixed;
|
|
|
+ font-size: 18px;
|
|
|
+ line-height: 58rpx;
|
|
|
+ z-index: 1000;
|
|
|
+ left: 14rpx;
|
|
|
}
|
|
|
|
|
|
- .newsList .swiper swiper {
|
|
|
+ .nav_title {
|
|
|
+ // width: 200rpx;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 36rpx;
|
|
|
+ position: fixed;
|
|
|
+ text-align: center;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ margin: auto;
|
|
|
+ }
|
|
|
+
|
|
|
+ .banner-img {
|
|
|
width: 100%;
|
|
|
- height: 365rpx;
|
|
|
- position: relative;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .newsTitle {
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 21rpx;
|
|
|
+ color: #646464;
|
|
|
}
|
|
|
|
|
|
- .newsList .swiper .slide-image {
|
|
|
+ .active-topic {
|
|
|
+ @include main_color(theme);
|
|
|
+ @include coupons_light_color(theme);
|
|
|
+ @include coupons_border_color(theme);
|
|
|
+ }
|
|
|
+
|
|
|
+ .padbottom {
|
|
|
+ /* #ifndef H5 */
|
|
|
+ padding-bottom: calc(100rpx+ constant(safe-area-inset-bottom)) !important; ///兼容 IOS<11.2/
|
|
|
+ padding-bottom: calc(100rpx + env(safe-area-inset-bottom)) !important;
|
|
|
+ /* #endif */
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottom {
|
|
|
+ bottom: 218rpx !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .footerBottoms {
|
|
|
width: 100%;
|
|
|
- height: 335rpx;
|
|
|
- border-radius: 14rpx;
|
|
|
+ /* #ifndef H5 */
|
|
|
+ height: calc(200rpx+ constant(safe-area-inset-bottom)) !important; ///兼容 IOS<11.2/
|
|
|
+ height: calc(200rpx + env(safe-area-inset-bottom)) !important;
|
|
|
+ /* #endif */
|
|
|
+ /* #ifdef H5 */
|
|
|
+ height: calc(100rpx+ constant(safe-area-inset-bottom)) !important; ///兼容 IOS<11.2/
|
|
|
+ height: calc(100rpx + env(safe-area-inset-bottom)) !important;
|
|
|
+ /* #endif */
|
|
|
}
|
|
|
|
|
|
- // #ifdef MP-WEIXIN
|
|
|
- .newsList .swiper .wx-swiper-dot {
|
|
|
- width: 12rpx !important;
|
|
|
- height: 12rpx !important;
|
|
|
- border-radius: 0;
|
|
|
- transform: rotate(-45deg);
|
|
|
- transform-origin: 0 100%;
|
|
|
+ .discover_index {
|
|
|
+ /deep/.no-border {
|
|
|
+ bottom: 40rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/.author-list {
|
|
|
+ padding-left: 24rpx;
|
|
|
+ padding-right: 24rpx;
|
|
|
+ }
|
|
|
+
|
|
|
}
|
|
|
|
|
|
- .newsList .swiper .wx-swiper-dot~.wx-swiper-dot {
|
|
|
- margin-left: 5rpx;
|
|
|
+ .menu {
|
|
|
+ // padding: 20rpx 34rpx 0 34rpx;
|
|
|
+ // box-sizing: border-box;
|
|
|
+ width: 100%;
|
|
|
}
|
|
|
|
|
|
- .newsList .swiper .wx-swiper-dots.wx-swiper-dots-horizontal {
|
|
|
- margin-bottom: -15rpx;
|
|
|
+ .page_con {
|
|
|
+ // position: fixed;
|
|
|
+ top: 0;
|
|
|
+ right: 0;
|
|
|
+ bottom: 0;
|
|
|
+ left: 0;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
}
|
|
|
|
|
|
- // #endif
|
|
|
- // #ifdef APP-PLUS || H5
|
|
|
- .newsList .swiper .uni-swiper-dot {
|
|
|
- width: 12rpx !important;
|
|
|
- height: 12rpx !important;
|
|
|
- border-radius: 0;
|
|
|
- transform: rotate(-45deg);
|
|
|
- transform-origin: 0 100%;
|
|
|
+ .empty-boxs {
|
|
|
+ margin: auto;
|
|
|
}
|
|
|
|
|
|
- .newsList .swiper .uni-swiper-dot~.uni-swiper-dot {
|
|
|
- margin-left: 5rpx;
|
|
|
+ .goods {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding: 24rpx 24rpx 0 24rpx;
|
|
|
+ background: #ffffff;
|
|
|
}
|
|
|
|
|
|
- .newsList .swiper .uni-swiper-dots.uni-swiper-dots-horizontal {
|
|
|
- margin-bottom: -15rpx;
|
|
|
+ .publish {
|
|
|
+ position: fixed;
|
|
|
+ z-index: 999;
|
|
|
+ width: 100rpx;
|
|
|
+ height: 100rpx;
|
|
|
+ opacity: 1;
|
|
|
+ border-radius: 50%;
|
|
|
+ bottom: 142rpx;
|
|
|
+ right: 24rpx;
|
|
|
+ color: #fff;
|
|
|
+ line-height: 100rpx;
|
|
|
+ text-align: center;
|
|
|
+ @include linear-gradient(theme);
|
|
|
+
|
|
|
+ .iconfont {
|
|
|
+ font-size: 50rpx;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
- // #endif
|
|
|
- .newsList .nav {
|
|
|
- padding: 0 100rpx;
|
|
|
+ .main {
|
|
|
width: 100%;
|
|
|
- height: 96rpx;
|
|
|
- white-space: nowrap;
|
|
|
- box-sizing: border-box;
|
|
|
- padding-top: 43rpx;
|
|
|
- border-top-right-radius: 23rpx;
|
|
|
- background-color: #fff;
|
|
|
}
|
|
|
|
|
|
- .newsList .nav .item {
|
|
|
- // max-width: 156rpx;
|
|
|
- display: inline-block;
|
|
|
- font-size: 32rpx;
|
|
|
- color: #999;
|
|
|
+ .author {
|
|
|
+ &-item {
|
|
|
+ padding-bottom: 40rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ &-title {
|
|
|
+ height: 120rpx;
|
|
|
+ line-height: 120rpx;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #333333;
|
|
|
+
|
|
|
+ .iconfont {
|
|
|
+ font-size: 170rpx;
|
|
|
+ color: #454545;
|
|
|
+ }
|
|
|
+
|
|
|
+ .lefticon {
|
|
|
+ transform: rotate(180deg);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .name {
|
|
|
+ margin: 0 28rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ &-head {
|
|
|
+ width: 80rpx;
|
|
|
+ height: 80rpx;
|
|
|
+ border-radius: 50%;
|
|
|
+ overflow: hidden;
|
|
|
+
|
|
|
+ image {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ margin-right: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ &-name {
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-family: PingFang SC-Medium, PingFang SC;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #282828;
|
|
|
+ }
|
|
|
+
|
|
|
+ &-sign,
|
|
|
+ &-fans {
|
|
|
+ font-size: 22rpx;
|
|
|
+ font-family: PingFang SC-Regular, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
+
|
|
|
+ &-sign {
|
|
|
+ width: 370rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ &-pictrue {
|
|
|
+ width: 222rpx;
|
|
|
+ height: 222rpx;
|
|
|
+ border-radius: 10px 10px 10px 10px;
|
|
|
+ opacity: 1;
|
|
|
+ margin-right: 18rpx;
|
|
|
+
|
|
|
+
|
|
|
+ /deep/image,
|
|
|
+ /deep/.easy-loadimage,
|
|
|
+ uni-image {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ border-radius: 10px 10px 10px 10px;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &-pictrue:nth-of-type(3n) {
|
|
|
+ margin-right: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .noContent {
|
|
|
+ /deep/.empty-box {
|
|
|
+ padding-top: 80rpx !important;
|
|
|
+
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
- .newsList .nav .item.on {
|
|
|
+ .btn {
|
|
|
+ width: 440rpx;
|
|
|
+ height: 86rpx;
|
|
|
+ line-height: 86rpx;
|
|
|
+ text-align: center;
|
|
|
+ border-radius: 43rpx 43rpx 43rpx 43rpx;
|
|
|
+ opacity: 1;
|
|
|
+ border: 1px solid #E93323;
|
|
|
+ font-size: 32rpx;
|
|
|
+ margin: auto;
|
|
|
+ font-family: PingFang SC-Medium, PingFang SC;
|
|
|
+ @include main_color(theme);
|
|
|
+ @include coupons_border_color(theme);
|
|
|
font-weight: 600;
|
|
|
- font-size: 35rpx;
|
|
|
- color: #141414;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .cart_nav {
|
|
|
+ /deep/.nav_title {
|
|
|
+ font-size: 36rpx;
|
|
|
+ color: #333333;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .discover {
|
|
|
+ &-header {
|
|
|
+ background-size: cover;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+
|
|
|
+ .title {
|
|
|
+ font-size: 36rpx;
|
|
|
+ color: #333333;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &-navTab {
|
|
|
+ padding: 0 34rpx 0 34rpx;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+ .icon-xiazai5 {
|
|
|
+ color: #333;
|
|
|
+ }
|
|
|
+
|
|
|
+ .nav-item {
|
|
|
+ display: inline-block;
|
|
|
+ font-weight: 500;
|
|
|
+ font-size: 31rpx;
|
|
|
+ color: #B2B2B2;
|
|
|
+
|
|
|
+ &.on {
|
|
|
+ font-weight: 600;
|
|
|
+ font-size: 35rpx;
|
|
|
+ color: #141414;
|
|
|
+ border-bottom: 5rpx solid;
|
|
|
+ border-image: linear-gradient(90deg, #BC86FF 0%, #914CE7 100%);
|
|
|
+ border-image-slice: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .release_btn {
|
|
|
+ width: 58rpx;
|
|
|
+ height: 58rpx;
|
|
|
+ border-radius: 100%;
|
|
|
+ background-image: linear-gradient(126deg, var(--view-bntColor21) 0%, var(--view-bntColor22) 100%);
|
|
|
+ color: #fff;
|
|
|
+ position: absolute;
|
|
|
+ top: 20rpx;
|
|
|
+ left: 0;
|
|
|
+
|
|
|
+ .iconfont {
|
|
|
+ font-size: 28rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &-box {
|
|
|
+ flex: 1;
|
|
|
+ min-height: 83vh;
|
|
|
+ height: auto;
|
|
|
+ width: 100%;
|
|
|
+ background-color: #fff;
|
|
|
+ left: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .avatar {
|
|
|
+ width: 64rpx;
|
|
|
+ height: 64rpx;
|
|
|
+ border-radius: 50%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .h96 {
|
|
|
+ height: 96rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .h36 {
|
|
|
+ /* #ifdef H5 */
|
|
|
+ height: 28rpx;
|
|
|
+ /* #endif */
|
|
|
+ /* #ifndef H5 */
|
|
|
+ height: 18rpx;
|
|
|
+ /* #endif */
|
|
|
+ }
|
|
|
+
|
|
|
+ .longTab {
|
|
|
+ width: 100%;
|
|
|
+ margin-top: 14rpx;
|
|
|
+
|
|
|
+ // background: #fff;
|
|
|
+ // border-radius: 16rpx 16rpx 0 0;
|
|
|
+
|
|
|
+ .longTab-item {
|
|
|
+ /*解决ios上滑动不流畅*/
|
|
|
+ -webkit-overflow-scrolling: touch;
|
|
|
+ position: relative;
|
|
|
+ border-radius: 15rpx;
|
|
|
+ margin: 0 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .longItem {
|
|
|
+ height: 50upx;
|
|
|
+ display: inline-block;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #999999;
|
|
|
+ // margin-right: 56rpx;
|
|
|
+
|
|
|
+ text {
|
|
|
+ display: block;
|
|
|
+ max-width: 326rpx;
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:last-child {
|
|
|
+ margin-right: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ /*解决ios上滑动不流畅*/
|
|
|
+ -webkit-overflow-scrolling: touch;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ &.click {
|
|
|
+ background: $bg-color-primary;
|
|
|
+ // font-weight: bold;
|
|
|
+ // font-size: 34rpx;
|
|
|
+ // @include main_color(theme);
|
|
|
+
|
|
|
+ // &::after {
|
|
|
+ // content: "";
|
|
|
+ // display: block;
|
|
|
+ // width: 40rpx;
|
|
|
+ // height: 5rpx;
|
|
|
+ // @include main_bg_color(theme);
|
|
|
+ // display: flex;
|
|
|
+ // position: absolute;
|
|
|
+ // left: 50%;
|
|
|
+ // margin-left: -22rpx;
|
|
|
+ // bottom: -8rpx;
|
|
|
+ // }
|
|
|
+
|
|
|
+ // .underline {
|
|
|
+ // opacity: 1;
|
|
|
+ // }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .underlineBox {
|
|
|
+ height: 3px;
|
|
|
+ width: 20%;
|
|
|
+ display: flex;
|
|
|
+ align-content: center;
|
|
|
+ justify-content: center;
|
|
|
+
|
|
|
+ .underline {
|
|
|
+ opacity: 0;
|
|
|
+ width: 60rpx;
|
|
|
+ height: 4rpx;
|
|
|
+ background-color: #e93323;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .author-fans {
|
|
|
+ font-size: 24rpx !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .container {
|
|
|
+ overflow: hidden;
|
|
|
+ /* 隐藏超出部分 */
|
|
|
+ }
|
|
|
+
|
|
|
+ .swiper {
|
|
|
+ display: flex;
|
|
|
+ /* 使用flex布局 */
|
|
|
+ animation: scrollRight 10s linear infinite;
|
|
|
+ /* 应用动画 */
|
|
|
+ }
|
|
|
+
|
|
|
+ .swiper-item {
|
|
|
+ flex-shrink: 0;
|
|
|
+ /* 不允许缩小 */
|
|
|
+ width: 100%;
|
|
|
+ /* 每个item占满一行 */
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ @keyframes scrollRight {
|
|
|
+ from {
|
|
|
+ transform: translateX(100%);
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 从右向左移动 */
|
|
|
+ to {
|
|
|
+ transform: translateX(-100%);
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 移出视图 */
|
|
|
}
|
|
|
|
|
|
- .newsList .nav .item~.item {
|
|
|
- margin-left: 46rpx;
|
|
|
+ .wall-nav {
|
|
|
+ font-weight: 500;
|
|
|
+ font-size: 23rpx;
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
+
|
|
|
+ .wall-nav~.wall-nav {
|
|
|
+ margin-left: 38rpx;
|
|
|
}
|
|
|
|
|
|
- .newsList .nav .item .line {
|
|
|
- // width: 24rpx;
|
|
|
- height: 10rpx;
|
|
|
- border-radius: 6rpx;
|
|
|
- margin: 10rpx auto 0 auto;
|
|
|
- background: linear-gradient( 90deg, #BC86FF 0%, #914CE7 100%);
|
|
|
+ .wall-nav-on {
|
|
|
+ font-weight: 600;
|
|
|
+ font-size: 27rpx;
|
|
|
+ color: #141414;
|
|
|
}
|
|
|
|
|
|
- .newsList .nav .item .line1 {
|
|
|
+ .discover-boxsss {
|
|
|
+ // box-sizing: border-box;
|
|
|
+ background-color: #fff;
|
|
|
+ width: 100%;
|
|
|
+ flex: 1;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+
|
|
|
+ .wall-font {
|
|
|
font-weight: 500;
|
|
|
font-size: 31rpx;
|
|
|
- color: #B2B2B2;
|
|
|
+ }
|
|
|
+
|
|
|
+ .search {
|
|
|
+ margin: 0 20rpx;
|
|
|
+ background-color: #fff;
|
|
|
+ // padding: 0rpx 10rpx 10rpx 38rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .search .input {
|
|
|
+ width: 590rpx;
|
|
|
+ // background-color: #f7f7f7;
|
|
|
+ border-radius: 33rpx;
|
|
|
+ padding: 0 24rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ height: 66rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .search .input input {
|
|
|
+ width: 460rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .search .input .iconfont {
|
|
|
+ color: #000;
|
|
|
+ font-size: 35rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .search .bnt {
|
|
|
+ text-align: center;
|
|
|
+ height: 66rpx;
|
|
|
+ line-height: 66rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #282828;
|
|
|
+ margin-left: 24rpx;
|
|
|
}
|
|
|
</style>
|
ZZ