|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
<template>
|
|
|
- <view :style="{ height: windowHeight + 'px' }">
|
|
|
|
|
- <!-- <view style="display: flex; justify-content: flex-end">
|
|
|
|
|
|
|
+ <view :style="{ height: windowHeight + 'px' }">
|
|
|
|
|
+ <!-- <view style="display: flex; justify-content: flex-end">
|
|
|
<view class="view0 step1"></view>
|
|
<view class="view0 step1"></view>
|
|
|
</view>
|
|
</view>
|
|
|
<view class="view1 step2"></view>
|
|
<view class="view1 step2"></view>
|
|
@@ -11,889 +11,899 @@
|
|
|
<view style="display: flex; justify-content: flex-end">
|
|
<view style="display: flex; justify-content: flex-end">
|
|
|
<view class="view6 step7"></view>
|
|
<view class="view6 step7"></view>
|
|
|
</view> -->
|
|
</view> -->
|
|
|
- <z-paging :use-custom-refresher="false" ref="paging" v-model="dataList" :auto="false"
|
|
|
|
|
- :style="{ height: windowHeight - 80 + 'px' }" :show-scrollbar="false" :refresher-enabled="true"
|
|
|
|
|
- @refresherrefresh="onRefresh" @refresherrestore="onRefresherRestore" @query="queryList"
|
|
|
|
|
- :fixed="true" :safe-area-inset-bottom="true" :loading-more-enabled="true"
|
|
|
|
|
- :loading-more-no-more-text="'没有更多了'" :loading-more-loading-text="'加载中...'"
|
|
|
|
|
- :loading-more-fail-text="'加载失败，点击重试'" :loading-more-default-text="'上拉加载更多'"
|
|
|
|
|
- :loading-more-loading-style="{ color: '#999' }"
|
|
|
|
|
- :loading-more-no-more-style="{ color: '#999' }"
|
|
|
|
|
- :loading-more-fail-style="{ color: '#999' }"
|
|
|
|
|
- :loading-more-default-style="{ color: '#999' }">
|
|
|
|
|
- <template #top>
|
|
|
|
|
- <page-navbar>
|
|
|
|
|
- <template #navCenter>
|
|
|
|
|
- <view class="top" style="display: flex">
|
|
|
|
|
- <!-- 手动选择城市功能隐藏 -->
|
|
|
|
|
- <!-- <view class="topBox" @click="lhSelectCityFun"> -->
|
|
|
|
|
- <view class="topBox" @click="lhSelectCityFun">
|
|
|
|
|
- <text style="
|
|
|
|
|
|
|
+ <z-paging :use-custom-refresher="false" ref="paging" v-model="dataList" :auto="false"
|
|
|
|
|
+ :style="{ height: windowHeight - 80 + 'px' }" :show-scrollbar="false" :refresher-enabled="true"
|
|
|
|
|
+ @refresherrefresh="onRefresh" @refresherrestore="onRefresherRestore" @query="queryList" :fixed="true"
|
|
|
|
|
+ :safe-area-inset-bottom="true" :loading-more-enabled="true" :loading-more-no-more-text="'没有更多了'"
|
|
|
|
|
+ :loading-more-loading-text="'加载中...'" :loading-more-fail-text="'加载失败，点击重试'"
|
|
|
|
|
+ :loading-more-default-text="'上拉加载更多'" :loading-more-loading-style="{ color: '#999' }"
|
|
|
|
|
+ :loading-more-no-more-style="{ color: '#999' }" :loading-more-fail-style="{ color: '#999' }"
|
|
|
|
|
+ :loading-more-default-style="{ color: '#999' }">
|
|
|
|
|
+ <template #top>
|
|
|
|
|
+ <page-navbar>
|
|
|
|
|
+ <template #navCenter>
|
|
|
|
|
+ <view class="top" style="display: flex">
|
|
|
|
|
+ <!-- 手动选择城市功能隐藏 -->
|
|
|
|
|
+ <!-- <view class="topBox" @click="lhSelectCityFun"> -->
|
|
|
|
|
+ <view class="topBox" @click="lhSelectCityFun">
|
|
|
|
|
+ <text style="
|
|
|
margin-left: 10rpx;
|
|
margin-left: 10rpx;
|
|
|
margin-right: 20rpx;
|
|
margin-right: 20rpx;
|
|
|
font-size: 44rpx;
|
|
font-size: 44rpx;
|
|
|
font-weight: 600;
|
|
font-weight: 600;
|
|
|
">
|
|
">
|
|
|
- {{ currentCity }}
|
|
|
|
|
- </text>
|
|
|
|
|
- <!-- <image src="@/static/home/home-bom.png"
|
|
|
|
|
|
|
+ {{ currentCity }}
|
|
|
|
|
+ </text>
|
|
|
|
|
+ <!-- <image src="@/static/home/home-bom.png"
|
|
|
style="width: 36rpx; height: 36rpx;margin-left: 15rpx;margin-right: 30rpx;"></image> -->
|
|
style="width: 36rpx; height: 36rpx;margin-left: 15rpx;margin-right: 30rpx;"></image> -->
|
|
|
- </view>
|
|
|
|
|
- <view class="weather">
|
|
|
|
|
- <p>
|
|
|
|
|
- {{ weather.weather }}<i :class="'qi-' + weather.icon"></i>️{{
|
|
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="weather">
|
|
|
|
|
+ <p>
|
|
|
|
|
+ {{ weather.weather }}<i :class="'qi-' + weather.icon"></i>️{{
|
|
|
weather.temp
|
|
weather.temp
|
|
|
}}
|
|
}}
|
|
|
- </p>
|
|
|
|
|
- <p>{{ getDayOfWeek }}</p>
|
|
|
|
|
- </view>
|
|
|
|
|
- </view>
|
|
|
|
|
- <view class="search" @click="goPage('/pages/index/Search')">
|
|
|
|
|
- <uv-input placeholder="🔥 潮玩大作战 派对季重磅开启!" border="none"
|
|
|
|
|
- :custom-style="{ background: '#fff', paddingLeft: '25rpx' }" shape="circle">
|
|
|
|
|
- <image class="testImg" src="@/static/home/icon-hot.png" style="width: 22rpx; height: 30rpx"></image>
|
|
|
|
|
-
|
|
|
|
|
- <template #suffix>
|
|
|
|
|
- <view class="input-box">
|
|
|
|
|
- <image src="@/static/icon/search.png" style="width: 32rpx; height: 32rpx">
|
|
|
|
|
- </image>
|
|
|
|
|
- </view>
|
|
|
|
|
- </template>
|
|
|
|
|
- </uv-input>
|
|
|
|
|
- </view>
|
|
|
|
|
- </template>
|
|
|
|
|
- </page-navbar>
|
|
|
|
|
- </template>
|
|
|
|
|
- <z-paging-cell class="benner-box">
|
|
|
|
|
- <sortble :default-sorts="['uvSwiper', 'classModel', 'uvSwiperCard']">
|
|
|
|
|
- <template #uvSwiper>
|
|
|
|
|
- <uv-swiper :list="bannerList" :autoplay="true" circular :interval="5000" indicator indicator-mode="dot"
|
|
|
|
|
- height="200" radius="0"></uv-swiper>
|
|
|
|
|
- </template>
|
|
|
|
|
-
|
|
|
|
|
- <template #classModel>
|
|
|
|
|
- <view class="classModel">
|
|
|
|
|
- <image src="@/static/home/benner-iconBom.png" class="benner-iconBom" mode=""></image>
|
|
|
|
|
- <image src="@/static/home/benner-icontop.png" class="benner-icontop" mode=""></image>
|
|
|
|
|
- <view class="benner-box benner-left-box" @click="goPage('/pages/my/job')">
|
|
|
|
|
- <view class="text1"> 获取奖励 </view>
|
|
|
|
|
- <view class="btn"> 立即前往 </view>
|
|
|
|
|
- </view>
|
|
|
|
|
- <view class="benner-box benner-right-box" ref="classModel1">
|
|
|
|
|
- <view class="guard">
|
|
|
|
|
- <view class="text"> 潮玩IP </view>
|
|
|
|
|
- </view>
|
|
|
|
|
- <view class="match">
|
|
|
|
|
- <view class="text"> 社交 </view>
|
|
|
|
|
- </view>
|
|
|
|
|
- </view>
|
|
|
|
|
- </view>
|
|
|
|
|
- </template>
|
|
|
|
|
- </sortble>
|
|
|
|
|
- </z-paging-cell>
|
|
|
|
|
- <z-paging-cell style="background: #fff">
|
|
|
|
|
- <view class="tab-nav">
|
|
|
|
|
- <view v-for="(tab, index) in tabs" :key="index" :class="['tab-item', currentTab === index ? 'active' : '']"
|
|
|
|
|
- @click="switchTab(index)">
|
|
|
|
|
- {{ tab }}
|
|
|
|
|
- <view class="indicator-triangle"> </view>
|
|
|
|
|
- </view>
|
|
|
|
|
- </view>
|
|
|
|
|
-
|
|
|
|
|
- <!-- 根据当前标签显示不同样式的列表 -->
|
|
|
|
|
- <!-- 关注列表 - 类似my.vue -->
|
|
|
|
|
- <view v-show="currentTab === 0" class="follow-list">
|
|
|
|
|
- <block v-if="followList.length > 0">
|
|
|
|
|
- <w-waterfall :data="followList">
|
|
|
|
|
- <template v-slot:content="{ item, width }">
|
|
|
|
|
- <card :item="formatItem(item)" :width="width" :custom-style="{ background: '#fff' }" textColor="#000">
|
|
|
|
|
- </card>
|
|
|
|
|
- </template>
|
|
|
|
|
- </w-waterfall>
|
|
|
|
|
- </block>
|
|
|
|
|
- <view class="no-data" v-else-if="!isLoadingFollow">
|
|
|
|
|
- <text>暂无关注数据</text>
|
|
|
|
|
- </view>
|
|
|
|
|
- </view>
|
|
|
|
|
-
|
|
|
|
|
- <!-- 推荐列表 - 瀑布流样式 -->
|
|
|
|
|
- <template>
|
|
|
|
|
- <w-waterfall v-show="currentTab === 1 && recommendList.length > 0" :data="recommendList">
|
|
|
|
|
- <template v-slot:content="{ item, width }">
|
|
|
|
|
- <card :item="formatItem(item)" :width="width" :custom-style="{ background: '#fff' }" textColor="#000">
|
|
|
|
|
- </card>
|
|
|
|
|
- </template>
|
|
|
|
|
- </w-waterfall>
|
|
|
|
|
- <view class="no-data" v-if="
|
|
|
|
|
- currentTab === 1 &&
|
|
|
|
|
- recommendList.length === 0 &&
|
|
|
|
|
- !isLoadingRecommend
|
|
|
|
|
- ">
|
|
|
|
|
- <text>暂无推荐数据</text>
|
|
|
|
|
- </view>
|
|
|
|
|
- </template>
|
|
|
|
|
-
|
|
|
|
|
- <!-- 探索列表 - 热点新闻已经有现成的热搜资讯组件，只需添加新闻列表 -->
|
|
|
|
|
- <template>
|
|
|
|
|
- <view v-if="currentTab === 2" class="hot-topics">
|
|
|
|
|
- <view class="hot-topics-header">
|
|
|
|
|
- <image class="hot-topics-title" src="@/static/home/hot-topics-title.png" mode=""></image>
|
|
|
|
|
- </view>
|
|
|
|
|
- <swiper class="hot-topics-swiper" :current="currentTopicPage" @change="handleTopicPageChange">
|
|
|
|
|
- <swiper-item v-for="(page, pageIndex) in topicPages" :key="pageIndex">
|
|
|
|
|
- <view class="hot-topics-list">
|
|
|
|
|
- <view v-for="(topic, index) in page" :key="index" class="topic-item"
|
|
|
|
|
- @click="goToArticleDetail(topic.id)">
|
|
|
|
|
- <view class="hot-topics-left">
|
|
|
|
|
- <image v-if="pageIndex * 4 + index == 0" src="@/static/icon/icon-first.png"
|
|
|
|
|
- class="topic-index topic-index-img" mode=""></image>
|
|
|
|
|
- <image v-else-if="pageIndex * 4 + index == 1" src="@/static/icon/icon-second.png"
|
|
|
|
|
- class="topic-index topic-index-img" mode=""></image>
|
|
|
|
|
- <image v-else-if="pageIndex * 4 + index == 2" src="@/static/icon/icon-third.png"
|
|
|
|
|
- class="topic-index topic-index-img" mode=""></image>
|
|
|
|
|
- <text v-else class="topic-index">{{
|
|
|
|
|
|
|
+ </p>
|
|
|
|
|
+ <p>{{ getDayOfWeek }}</p>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="search" @click="goPage('/pages/index/Search')">
|
|
|
|
|
+ <uv-input placeholder="🔥 潮玩大作战 派对季重磅开启!" border="none"
|
|
|
|
|
+ :custom-style="{ background: '#fff', paddingLeft: '25rpx' }" shape="circle">
|
|
|
|
|
+ <image class="testImg" src="@/static/home/icon-hot.png"
|
|
|
|
|
+ style="width: 22rpx; height: 30rpx"></image>
|
|
|
|
|
+
|
|
|
|
|
+ <template #suffix>
|
|
|
|
|
+ <view class="input-box">
|
|
|
|
|
+ <image src="@/static/icon/search.png" style="width: 32rpx; height: 32rpx">
|
|
|
|
|
+ </image>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </uv-input>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </page-navbar>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <z-paging-cell class="benner-box">
|
|
|
|
|
+ <sortble :default-sorts="['uvSwiper', 'classModel', 'uvSwiperCard']">
|
|
|
|
|
+ <template #uvSwiper>
|
|
|
|
|
+ <uv-swiper :list="bannerList" :autoplay="true" circular :interval="5000" indicator
|
|
|
|
|
+ indicator-mode="dot" height="200" radius="0"></uv-swiper>
|
|
|
|
|
+ </template>
|
|
|
|
|
+
|
|
|
|
|
+ <template #classModel>
|
|
|
|
|
+ <view class="classModel">
|
|
|
|
|
+ <image src="@/static/home/benner-iconBom.png" class="benner-iconBom" mode=""></image>
|
|
|
|
|
+ <image src="@/static/home/benner-icontop.png" class="benner-icontop" mode=""></image>
|
|
|
|
|
+ <view class="benner-box benner-left-box" @click="goPage('/pages/my/job')">
|
|
|
|
|
+ <view class="text1"> 获取奖励 </view>
|
|
|
|
|
+ <view class="btn"> 立即前往 </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="benner-box benner-right-box" ref="classModel1">
|
|
|
|
|
+ <view class="guard">
|
|
|
|
|
+ <view class="text"> 潮玩IP </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="match">
|
|
|
|
|
+ <view class="text"> 社交 </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </sortble>
|
|
|
|
|
+ </z-paging-cell>
|
|
|
|
|
+ <z-paging-cell style="background: #fff">
|
|
|
|
|
+ <view class="tab-nav">
|
|
|
|
|
+ <view v-for="(tab, index) in tabs" :key="index"
|
|
|
|
|
+ :class="['tab-item', currentTab === index ? 'active' : '']" @click="switchTab(index)">
|
|
|
|
|
+ {{ tab }}
|
|
|
|
|
+ <view class="indicator-triangle"> </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+ <!-- 根据当前标签显示不同样式的列表 -->
|
|
|
|
|
+ <!-- 关注列表 - 类似my.vue -->
|
|
|
|
|
+ <view v-show="currentTab === 0" class="follow-list">
|
|
|
|
|
+ <block v-if="followList.length > 0">
|
|
|
|
|
+ <w-waterfall :data="followList">
|
|
|
|
|
+ <template v-slot:content="{ item, width }">
|
|
|
|
|
+ <card :item="formatItem(item)" :width="width" :custom-style="{ background: '#fff' }"
|
|
|
|
|
+ textColor="#000">
|
|
|
|
|
+ </card>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </w-waterfall>
|
|
|
|
|
+ </block>
|
|
|
|
|
+ <view class="no-data" v-else-if="!isLoadingFollow">
|
|
|
|
|
+ <text>暂无关注数据</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+ <!-- 推荐列表 - 瀑布流样式 -->
|
|
|
|
|
+ <template>
|
|
|
|
|
+ <w-waterfall v-show="currentTab === 1 && recommendList.length > 0" :data="recommendList">
|
|
|
|
|
+ <template v-slot:content="{ item, width }">
|
|
|
|
|
+ <card :item="formatItem(item)" :width="width" :custom-style="{ background: '#fff' }"
|
|
|
|
|
+ textColor="#000">
|
|
|
|
|
+ </card>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </w-waterfall>
|
|
|
|
|
+ <view class="no-data"
|
|
|
|
|
+ v-if=" currentTab === 1 && recommendList.length === 0 && !isLoadingRecommend ">
|
|
|
|
|
+ <text>暂无推荐数据</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </template>
|
|
|
|
|
+
|
|
|
|
|
+ <!-- 探索列表 - 热点新闻已经有现成的热搜资讯组件，只需添加新闻列表 -->
|
|
|
|
|
+ <template>
|
|
|
|
|
+ <view v-if="currentTab === 2" class="hot-topics">
|
|
|
|
|
+ <view class="hot-topics-header">
|
|
|
|
|
+ <image class="hot-topics-title" src="@/static/home/hot-topics-title.png" mode=""></image>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <swiper class="hot-topics-swiper" :current="currentTopicPage" @change="handleTopicPageChange">
|
|
|
|
|
+ <swiper-item v-for="(page, pageIndex) in topicPages" :key="pageIndex">
|
|
|
|
|
+ <view class="hot-topics-list">
|
|
|
|
|
+ <view v-for="(topic, index) in page" :key="index" class="topic-item"
|
|
|
|
|
+ @click="goToArticleDetail(topic.id)">
|
|
|
|
|
+ <view class="hot-topics-left">
|
|
|
|
|
+ <image v-if="pageIndex * 4 + index == 0" src="@/static/icon/icon-first.png"
|
|
|
|
|
+ class="topic-index topic-index-img" mode=""></image>
|
|
|
|
|
+ <image v-else-if="pageIndex * 4 + index == 1"
|
|
|
|
|
+ src="@/static/icon/icon-second.png" class="topic-index topic-index-img"
|
|
|
|
|
+ mode=""></image>
|
|
|
|
|
+ <image v-else-if="pageIndex * 4 + index == 2"
|
|
|
|
|
+ src="@/static/icon/icon-third.png" class="topic-index topic-index-img"
|
|
|
|
|
+ mode=""></image>
|
|
|
|
|
+ <text v-else class="topic-index">{{
|
|
|
pageIndex * 4 + index + 1
|
|
pageIndex * 4 + index + 1
|
|
|
}}</text>
|
|
}}</text>
|
|
|
|
|
|
|
|
- <view class="topic-content toe">
|
|
|
|
|
- {{ topic.title }}
|
|
|
|
|
- </view>
|
|
|
|
|
- <image v-if="topic.isHot" src="@/static/icon/icon-hot.png" class="hot-tag" mode=""></image>
|
|
|
|
|
- </view>
|
|
|
|
|
- <text class="topic-participants">{{ topic.num_like }}人正在热议</text>
|
|
|
|
|
- </view>
|
|
|
|
|
- </view>
|
|
|
|
|
- </swiper-item>
|
|
|
|
|
- </swiper>
|
|
|
|
|
- <view class="indicator-dots">
|
|
|
|
|
- <view v-for="i in 2" :key="i" :class="['dot', currentTopicPage === i - 1 ? 'active' : '']">
|
|
|
|
|
- </view>
|
|
|
|
|
- </view>
|
|
|
|
|
- </view>
|
|
|
|
|
- <view v-show="currentTab === 2 && newsList.length > 0" class="news-list">
|
|
|
|
|
- <w-waterfall v-show="currentTab === 2 && newsList.length > 0" :data="newsList">
|
|
|
|
|
- <template v-slot:content="{ item, width }">
|
|
|
|
|
- <card :item="formatItem(item)" :width="width" goLink="/pages/index/articleDetail?id="
|
|
|
|
|
- :custom-style="{ background: '#fff' }" textColor="#000"></card>
|
|
|
|
|
- </template>
|
|
|
|
|
- </w-waterfall>
|
|
|
|
|
- </view>
|
|
|
|
|
-
|
|
|
|
|
- <view class="no-data" v-if="currentTab === 2 && newsList.length === 0 && !isLoadingNews">
|
|
|
|
|
- <text>暂无新闻数据</text>
|
|
|
|
|
- </view>
|
|
|
|
|
- </template>
|
|
|
|
|
-
|
|
|
|
|
- </z-paging-cell>
|
|
|
|
|
- <view class="blankHeight"></view>
|
|
|
|
|
- </z-paging>
|
|
|
|
|
- <tabbar-vue :tabbars="tabbars" :currentIndex="0" ref="tabbar"></tabbar-vue>
|
|
|
|
|
-
|
|
|
|
|
- <!-- 添加浮动按钮 -->
|
|
|
|
|
- <view v-if="currentTab === 2" class="float-btn" @click="goToMake">
|
|
|
|
|
- <image src="/static/home/release-btn.png" class="float-btn-icon"></image>
|
|
|
|
|
- </view>
|
|
|
|
|
-
|
|
|
|
|
- <!-- <novice-guidance :step="step"></novice-guidance> -->
|
|
|
|
|
- <lhSelectCity style="height: 100vh" class="lhSelectCity" :currentCity="currentCity" :windowHeight="windowHeight"
|
|
|
|
|
- :hotCitys="hotCitys" @onSelect="City" v-if="lhSelectCityFalg" @closeLhSelectCityFun="closeLhSelectCityFun()" />
|
|
|
|
|
- </view>
|
|
|
|
|
|
|
+ <view class="topic-content toe">
|
|
|
|
|
+ {{ topic.title }}
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <image v-if="topic.isHot" src="@/static/icon/icon-hot.png" class="hot-tag"
|
|
|
|
|
+ mode=""></image>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <text class="topic-participants">{{ topic.num_like }}人正在热议</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </swiper-item>
|
|
|
|
|
+ </swiper>
|
|
|
|
|
+ <view class="indicator-dots">
|
|
|
|
|
+ <view v-for="i in 2" :key="i" :class="['dot', currentTopicPage === i - 1 ? 'active' : '']">
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view v-show="currentTab === 2 && newsList.length > 0" class="news-list">
|
|
|
|
|
+ <w-waterfall v-show="currentTab === 2 && newsList.length > 0" :data="newsList">
|
|
|
|
|
+ <template v-slot:content="{ item, width }">
|
|
|
|
|
+ <card :item="formatItem(item)" :width="width" goLink="/pages/index/articleDetail?id="
|
|
|
|
|
+ :custom-style="{ background: '#fff' }" textColor="#000"></card>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </w-waterfall>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+ <view class="no-data" v-if="currentTab === 2 && newsList.length === 0 && !isLoadingNews">
|
|
|
|
|
+ <text>暂无新闻数据</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </template>
|
|
|
|
|
+
|
|
|
|
|
+ </z-paging-cell>
|
|
|
|
|
+ <view class="blankHeight"></view>
|
|
|
|
|
+ </z-paging>
|
|
|
|
|
+ <tabbar-vue :tabbars="tabbars" :currentIndex="0" ref="tabbar"></tabbar-vue>
|
|
|
|
|
+
|
|
|
|
|
+ <!-- 添加浮动按钮 -->
|
|
|
|
|
+ <view v-if="currentTab === 2" class="float-btn" @click="goToMake">
|
|
|
|
|
+ <image src="/static/home/release-btn.png" class="float-btn-icon"></image>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+ <!-- <novice-guidance :step="step"></novice-guidance> -->
|
|
|
|
|
+ <lhSelectCity style="height: 100vh" class="lhSelectCity" :currentCity="currentCity" :windowHeight="windowHeight"
|
|
|
|
|
+ :hotCitys="hotCitys" @onSelect="City" v-if="lhSelectCityFalg"
|
|
|
|
|
+ @closeLhSelectCityFun="closeLhSelectCityFun()" />
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+ <wu-app-update></wu-app-update>
|
|
|
|
|
+ </view>
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
<script>
|
|
|
-import sortble from "@/components/sortble/sortble.vue";
|
|
|
|
|
-import tabbarVue from "@/components/tabbar/tabbar.vue";
|
|
|
|
|
-import pageNavbar from "@/components/page-navbar/page-navbar.vue";
|
|
|
|
|
-import wWaterfall from "@/components/w-waterfall/w-waterfall.vue";
|
|
|
|
|
-import tabbar from "@/mixins/tabbar";
|
|
|
|
|
-import card from "@/components/card/card.vue";
|
|
|
|
|
-import lhSelectCity from "@/components/lh-select-city/index.vue";
|
|
|
|
|
-import { getStorage, setStorage, removeStorage } from "@/common/util.js";
|
|
|
|
|
-// import noviceGuidance from "@/components/novice-guidance/index.vue";
|
|
|
|
|
-export default {
|
|
|
|
|
- components: {
|
|
|
|
|
- sortble,
|
|
|
|
|
- tabbarVue,
|
|
|
|
|
- pageNavbar,
|
|
|
|
|
- wWaterfall,
|
|
|
|
|
- lhSelectCity,
|
|
|
|
|
- card,
|
|
|
|
|
- // noviceGuidance
|
|
|
|
|
- },
|
|
|
|
|
- mixins: [tabbar],
|
|
|
|
|
- data() {
|
|
|
|
|
- return {
|
|
|
|
|
- step: {
|
|
|
|
|
- name: "workbenchSet5",
|
|
|
|
|
- guideList: [
|
|
|
|
|
- {
|
|
|
|
|
- el: ".step1",
|
|
|
|
|
- tips: "这里是第一步的介绍~",
|
|
|
|
|
- next: "下一步",
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- el: ".step2",
|
|
|
|
|
- tips: "这里是第二步的介绍~",
|
|
|
|
|
- next: "下一步",
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- el: ".step3",
|
|
|
|
|
- tips: "这里是第三步的介绍~",
|
|
|
|
|
- next: "下一步",
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- el: ".step4",
|
|
|
|
|
- tips: "这里是第四步的介绍~",
|
|
|
|
|
- next: "下一步",
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- el: ".step5",
|
|
|
|
|
- tips: "这里是第五步的介绍~",
|
|
|
|
|
- next: "下一步",
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- el: ".step6",
|
|
|
|
|
- tips: "这里是第六步的介绍~",
|
|
|
|
|
- next: "下一步",
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- el: ".step7",
|
|
|
|
|
- tips: "最后一步啦~",
|
|
|
|
|
- next: "完成",
|
|
|
|
|
- },
|
|
|
|
|
- ],
|
|
|
|
|
- },
|
|
|
|
|
- windowHeight: uni.getWindowInfo().windowHeight,
|
|
|
|
|
- bannerList: [
|
|
|
|
|
- "../../static/dome/home-swper.png",
|
|
|
|
|
- "../../static/dome/home-swper.png",
|
|
|
|
|
- "../../static/dome/home-swper.png",
|
|
|
|
|
- ],
|
|
|
|
|
- cardList: [
|
|
|
|
|
- {
|
|
|
|
|
- img: "/static/img/img-1.png",
|
|
|
|
|
- bgimg: "/static/image/bg-2.png",
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- img: "/static/img/img-3.png",
|
|
|
|
|
- bgimg: "/static/image/bg-3.png",
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
- img: "/static/img/img-2.png",
|
|
|
|
|
- bgimg: "/static/image/bg-1.png",
|
|
|
|
|
- },
|
|
|
|
|
- ],
|
|
|
|
|
- list: [], // 瀑布流全部数据
|
|
|
|
|
- dataList: [],
|
|
|
|
|
- tabs: ["关注", "推荐", "探索"],
|
|
|
|
|
- currentTab: 1,
|
|
|
|
|
- currentTopicPage: 0,
|
|
|
|
|
- followList: [], // 关注列表数据
|
|
|
|
|
- recommendList: [], // 推荐列表数据
|
|
|
|
|
- exploreList: [], // 探索列表数据
|
|
|
|
|
- hotNewsList: [], // 热点新闻数据
|
|
|
|
|
- newsList: [], // 新闻列表数据
|
|
|
|
|
- followOffset: 0, // 关注列表偏移量
|
|
|
|
|
- recommendOffset: 0, // 推荐列表偏移量
|
|
|
|
|
- exploreOffset: 0, // 探索列表偏移量
|
|
|
|
|
- newsOffset: 0, // 新闻列表偏移量
|
|
|
|
|
- hasMoreFollow: true, // 是否有更多关注列表数据
|
|
|
|
|
- hasMoreRecommend: true, // 是否有更多推荐列表数据
|
|
|
|
|
- hasMoreExplore: true, // 是否有更多探索列表数据
|
|
|
|
|
- hasMoreNews: true, // 是否有更多新闻列表数据
|
|
|
|
|
- isLoadingFollow: false, // 是否正在加载关注列表
|
|
|
|
|
- isLoadingRecommend: false, // 是否正在加载推荐列表
|
|
|
|
|
- isLoadingExplore: false, // 是否正在加载探索列表
|
|
|
|
|
- isLoadingNews: false, // 是否正在加载新闻列表
|
|
|
|
|
- hotTopics: [],
|
|
|
|
|
- lhSelectCityFalg: false,
|
|
|
|
|
- hotCitys: [
|
|
|
|
|
- "杭州",
|
|
|
|
|
- "天津",
|
|
|
|
|
- "北京",
|
|
|
|
|
- "上海",
|
|
|
|
|
- "深圳",
|
|
|
|
|
- "广州",
|
|
|
|
|
- "成都",
|
|
|
|
|
- "重庆",
|
|
|
|
|
- "厦门",
|
|
|
|
|
- ],
|
|
|
|
|
- currentCity: "北京",
|
|
|
|
|
- windowHeight: "",
|
|
|
|
|
- weather: {
|
|
|
|
|
- city: "",
|
|
|
|
|
- weather: "",
|
|
|
|
|
- temp: "0℃",
|
|
|
|
|
- icon: 101,
|
|
|
|
|
- },
|
|
|
|
|
- isContentRecommendation: true,
|
|
|
|
|
- };
|
|
|
|
|
- },
|
|
|
|
|
-
|
|
|
|
|
- computed: {
|
|
|
|
|
- getDayOfWeek() {
|
|
|
|
|
- const days = [
|
|
|
|
|
- "星期日",
|
|
|
|
|
- "星期一",
|
|
|
|
|
- "星期二",
|
|
|
|
|
- "星期三",
|
|
|
|
|
- "星期四",
|
|
|
|
|
- "星期五",
|
|
|
|
|
- "星期六",
|
|
|
|
|
- ];
|
|
|
|
|
- const today = new Date();
|
|
|
|
|
- const dayOfWeek = days[today.getDay()];
|
|
|
|
|
- return dayOfWeek;
|
|
|
|
|
- },
|
|
|
|
|
- currentList() {
|
|
|
|
|
- switch (this.currentTab) {
|
|
|
|
|
- case 0:
|
|
|
|
|
- return this.followList;
|
|
|
|
|
- case 1:
|
|
|
|
|
- return this.recommendList; // 使用专门的推荐列表
|
|
|
|
|
- case 2:
|
|
|
|
|
- return this.exploreList;
|
|
|
|
|
- default:
|
|
|
|
|
- return [];
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
- topicPages() {
|
|
|
|
|
- const pages = [];
|
|
|
|
|
- for (let i = 0; i < this.hotTopics.length; i += 4) {
|
|
|
|
|
- pages.push(this.hotTopics.slice(i, i + 4));
|
|
|
|
|
- }
|
|
|
|
|
- return pages;
|
|
|
|
|
- },
|
|
|
|
|
- },
|
|
|
|
|
- onLoad() {
|
|
|
|
|
- let that = this;
|
|
|
|
|
- // 计算出可用高度
|
|
|
|
|
- this.windowHeight = uni.getSystemInfoSync().windowHeight + "px";
|
|
|
|
|
- // 不在onLoad中直接加载数据，避免与z-paging组件重复请求
|
|
|
|
|
- // 让z-paging组件通过queryList方法控制数据加载
|
|
|
|
|
- this.getWeather();
|
|
|
|
|
- this.queryList();
|
|
|
|
|
- },
|
|
|
|
|
- onShow() {
|
|
|
|
|
- var isContentRecommendation = getStorage("isContentRecommendation");
|
|
|
|
|
- console.log(isContentRecommendation, "isContentRecommendation");
|
|
|
|
|
- if (isContentRecommendation != "false") {
|
|
|
|
|
- isContentRecommendation = true;
|
|
|
|
|
- } else {
|
|
|
|
|
- isContentRecommendation = false;
|
|
|
|
|
- }
|
|
|
|
|
- this.isContentRecommendation = isContentRecommendation;
|
|
|
|
|
-
|
|
|
|
|
- if (isContentRecommendation == false) {
|
|
|
|
|
- this.tabs = ["关注"];
|
|
|
|
|
- this.currentTab = 0;
|
|
|
|
|
- this.queryList();
|
|
|
|
|
- } else {
|
|
|
|
|
- this.tabs = ["关注", "推荐", "探索"];
|
|
|
|
|
- this.currentTab = 1;
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
- // 修改触底加载方法
|
|
|
|
|
- onReachBottom() {
|
|
|
|
|
- console.log('触底加载更多');
|
|
|
|
|
- // 根据当前标签页加载更多数据
|
|
|
|
|
- switch (this.currentTab) {
|
|
|
|
|
- case 0:
|
|
|
|
|
- if (this.hasMoreFollow && !this.isLoadingFollow) {
|
|
|
|
|
- this.loadFollowList();
|
|
|
|
|
- }
|
|
|
|
|
- break;
|
|
|
|
|
- case 1:
|
|
|
|
|
- if (this.hasMoreRecommend && !this.isLoadingRecommend) {
|
|
|
|
|
- this.loadRecommendList();
|
|
|
|
|
- }
|
|
|
|
|
- break;
|
|
|
|
|
- case 2:
|
|
|
|
|
- if (this.hasMoreNews && !this.isLoadingNews) {
|
|
|
|
|
- this.loadNewsList();
|
|
|
|
|
- }
|
|
|
|
|
- break;
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
-
|
|
|
|
|
- // 下拉刷新数据
|
|
|
|
|
- methods: {
|
|
|
|
|
- getWeather(city) {
|
|
|
|
|
- uni.request({
|
|
|
|
|
- url: this.$apiHost + "/Index/getAreaInfo",
|
|
|
|
|
- data: {
|
|
|
|
|
- uuid: getApp().globalData.uuid,
|
|
|
|
|
- skey: getApp().globalData.skey,
|
|
|
|
|
- city: city || (this.currentCity == "北京" ? "" : this.currentCity),
|
|
|
|
|
- },
|
|
|
|
|
- header: {
|
|
|
|
|
- "content-type": "application/json",
|
|
|
|
|
- sign: getApp().globalData.headerSign,
|
|
|
|
|
- },
|
|
|
|
|
- success: (res) => {
|
|
|
|
|
- console.log(this.weather, "天气数据", res.data);
|
|
|
|
|
- if (res.data.city) {
|
|
|
|
|
- this.currentCity = res.data.city;
|
|
|
|
|
- this.weather = res.data;
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
- complete: () => { },
|
|
|
|
|
- fail: (e) => { },
|
|
|
|
|
- });
|
|
|
|
|
- },
|
|
|
|
|
- lhSelectCityFun() {
|
|
|
|
|
- this.lhSelectCityFalg = true;
|
|
|
|
|
- },
|
|
|
|
|
- // 选中事件
|
|
|
|
|
- City(city) {
|
|
|
|
|
- this.currentCity = city;
|
|
|
|
|
- setTimeout(() => {
|
|
|
|
|
- this.lhSelectCityFalg = false;
|
|
|
|
|
- }, 300);
|
|
|
|
|
- },
|
|
|
|
|
- closeLhSelectCityFun() {
|
|
|
|
|
- this.lhSelectCityFalg = false;
|
|
|
|
|
- },
|
|
|
|
|
- queryList() {
|
|
|
|
|
- // 根据当前标签刷新数据
|
|
|
|
|
- switch (this.currentTab) {
|
|
|
|
|
- case 0:
|
|
|
|
|
- // 重置关注列表
|
|
|
|
|
- this.followList = [];
|
|
|
|
|
- this.followOffset = 0;
|
|
|
|
|
- this.hasMoreFollow = true;
|
|
|
|
|
- this.loadFollowList();
|
|
|
|
|
- break;
|
|
|
|
|
- case 1:
|
|
|
|
|
- // 重置推荐列表
|
|
|
|
|
- this.recommendList = [];
|
|
|
|
|
- this.recommendOffset = 0;
|
|
|
|
|
- this.hasMoreRecommend = true;
|
|
|
|
|
- this.loadRecommendList();
|
|
|
|
|
- break;
|
|
|
|
|
- case 2:
|
|
|
|
|
- // 重置热点新闻和新闻列表
|
|
|
|
|
- this.hotNewsList = [];
|
|
|
|
|
- this.newsList = [];
|
|
|
|
|
- this.newsOffset = 0;
|
|
|
|
|
- this.hasMoreNews = true;
|
|
|
|
|
- // 加载热点新闻和新闻列表
|
|
|
|
|
- this.loadHotNews();
|
|
|
|
|
- this.loadNewsList();
|
|
|
|
|
- break;
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
-
|
|
|
|
|
- switchTab(index) {
|
|
|
|
|
- if (this.currentTab === index) return;
|
|
|
|
|
- this.currentTab = index;
|
|
|
|
|
-
|
|
|
|
|
- // 重置当前标签页的数据
|
|
|
|
|
- switch (index) {
|
|
|
|
|
- case 0:
|
|
|
|
|
- this.followList = [];
|
|
|
|
|
- this.followOffset = 0;
|
|
|
|
|
- this.hasMoreFollow = true;
|
|
|
|
|
- break;
|
|
|
|
|
- case 1:
|
|
|
|
|
- this.recommendList = [];
|
|
|
|
|
- this.recommendOffset = 0;
|
|
|
|
|
- this.hasMoreRecommend = true;
|
|
|
|
|
- break;
|
|
|
|
|
- case 2:
|
|
|
|
|
- this.newsList = [];
|
|
|
|
|
- this.hotTopics = [];
|
|
|
|
|
- this.newsOffset = 0;
|
|
|
|
|
- this.hasMoreNews = true;
|
|
|
|
|
- break;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- // 加载新标签页的数据
|
|
|
|
|
- this.loadTabData(index);
|
|
|
|
|
- },
|
|
|
|
|
- loadTabData(index) {
|
|
|
|
|
- switch (index) {
|
|
|
|
|
- case 0:
|
|
|
|
|
- this.loadFollowList();
|
|
|
|
|
- break;
|
|
|
|
|
- case 1:
|
|
|
|
|
- this.loadRecommendList();
|
|
|
|
|
- break;
|
|
|
|
|
- case 2:
|
|
|
|
|
- this.loadHotNews();
|
|
|
|
|
- this.loadNewsList();
|
|
|
|
|
- break;
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
- // 修改关注列表加载方法
|
|
|
|
|
- loadFollowList() {
|
|
|
|
|
- if (this.isLoadingFollow) return;
|
|
|
|
|
- this.isLoadingFollow = true;
|
|
|
|
|
-
|
|
|
|
|
- // 保存当前列表数据
|
|
|
|
|
- const currentList = [...this.followList];
|
|
|
|
|
-
|
|
|
|
|
- uni.request({
|
|
|
|
|
- url: this.$apiHost + "/Work/getlist",
|
|
|
|
|
- data: {
|
|
|
|
|
- uuid: getApp().globalData.uuid,
|
|
|
|
|
- skey: getApp().globalData.skey,
|
|
|
|
|
- type: "attention",
|
|
|
|
|
- offset: this.followOffset,
|
|
|
|
|
- },
|
|
|
|
|
- header: {
|
|
|
|
|
- "content-type": "application/json",
|
|
|
|
|
- sign: getApp().globalData.headerSign,
|
|
|
|
|
- },
|
|
|
|
|
- success: (res) => {
|
|
|
|
|
- console.log("关注列表数据:", res.data);
|
|
|
|
|
- if (res.data.success == "yes" && res.data.list && res.data.list.length > 0) {
|
|
|
|
|
- // 使用 Vue.set 确保响应式更新
|
|
|
|
|
- if (this.followOffset === 0) {
|
|
|
|
|
- this.followList = res.data.list;
|
|
|
|
|
- } else {
|
|
|
|
|
- // 使用 Vue.set 更新数组，避免数据闪烁
|
|
|
|
|
- this.followList = currentList.concat(res.data.list);
|
|
|
|
|
- }
|
|
|
|
|
- this.followOffset += res.data.list.length;
|
|
|
|
|
- this.hasMoreFollow = res.data.list.length >= 20;
|
|
|
|
|
- } else {
|
|
|
|
|
- this.hasMoreFollow = false;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- // 使用 nextTick 确保数据更新后再通知组件
|
|
|
|
|
- this.$nextTick(() => {
|
|
|
|
|
- if (this.$refs.paging) {
|
|
|
|
|
- this.$refs.paging.complete(this.followList);
|
|
|
|
|
- }
|
|
|
|
|
- });
|
|
|
|
|
- },
|
|
|
|
|
- complete: () => {
|
|
|
|
|
- this.isLoadingFollow = false;
|
|
|
|
|
- },
|
|
|
|
|
- fail: (e) => {
|
|
|
|
|
- console.log("请求关注列表失败:", e);
|
|
|
|
|
- this.isLoadingFollow = false;
|
|
|
|
|
- if (this.$refs.paging) {
|
|
|
|
|
- this.$refs.paging.complete(false);
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
- });
|
|
|
|
|
- },
|
|
|
|
|
- // 修改推荐列表加载方法
|
|
|
|
|
- loadRecommendList() {
|
|
|
|
|
- if (this.isLoadingRecommend) return;
|
|
|
|
|
- this.isLoadingRecommend = true;
|
|
|
|
|
-
|
|
|
|
|
- // 保存当前列表数据
|
|
|
|
|
- const currentList = [...this.recommendList];
|
|
|
|
|
-
|
|
|
|
|
- uni.request({
|
|
|
|
|
- url: this.$apiHost + "/Work/getlist",
|
|
|
|
|
- data: {
|
|
|
|
|
- uuid: getApp().globalData.uuid,
|
|
|
|
|
- skey: getApp().globalData.skey,
|
|
|
|
|
- type: "recommend",
|
|
|
|
|
- offset: this.recommendOffset,
|
|
|
|
|
- },
|
|
|
|
|
- header: {
|
|
|
|
|
- "content-type": "application/json",
|
|
|
|
|
- sign: getApp().globalData.headerSign,
|
|
|
|
|
- },
|
|
|
|
|
- success: (res) => {
|
|
|
|
|
- console.log("推荐列表数据:", res.data);
|
|
|
|
|
- if (res.data.success == "yes" && res.data.list && res.data.list.length > 0) {
|
|
|
|
|
- if (this.recommendOffset === 0) {
|
|
|
|
|
- this.recommendList = res.data.list;
|
|
|
|
|
- } else {
|
|
|
|
|
- this.recommendList = currentList.concat(res.data.list);
|
|
|
|
|
- }
|
|
|
|
|
- this.recommendOffset += res.data.list.length;
|
|
|
|
|
- this.hasMoreRecommend = res.data.list.length >= 20;
|
|
|
|
|
- } else {
|
|
|
|
|
- this.hasMoreRecommend = false;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- this.$nextTick(() => {
|
|
|
|
|
- if (this.$refs.paging) {
|
|
|
|
|
- this.$refs.paging.complete(this.recommendList);
|
|
|
|
|
- }
|
|
|
|
|
- });
|
|
|
|
|
- },
|
|
|
|
|
- complete: () => {
|
|
|
|
|
- this.isLoadingRecommend = false;
|
|
|
|
|
- },
|
|
|
|
|
- fail: (e) => {
|
|
|
|
|
- console.log("请求推荐列表失败:", e);
|
|
|
|
|
- this.isLoadingRecommend = false;
|
|
|
|
|
- if (this.$refs.paging) {
|
|
|
|
|
- this.$refs.paging.complete(false);
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
- });
|
|
|
|
|
- },
|
|
|
|
|
- loadHotNews() {
|
|
|
|
|
- if (this.isLoadingExplore) return;
|
|
|
|
|
- this.isLoadingExplore = true;
|
|
|
|
|
-
|
|
|
|
|
- uni.request({
|
|
|
|
|
- url: this.$apiHost + "/Article/getlist",
|
|
|
|
|
- data: {
|
|
|
|
|
- uuid: getApp().globalData.uuid,
|
|
|
|
|
- skey: getApp().globalData.skey,
|
|
|
|
|
- type: "hot",
|
|
|
|
|
- },
|
|
|
|
|
- header: {
|
|
|
|
|
- "content-type": "application/json",
|
|
|
|
|
- sign: getApp().globalData.headerSign,
|
|
|
|
|
- },
|
|
|
|
|
- success: (res) => {
|
|
|
|
|
- console.log("热点新闻数据:", res.data);
|
|
|
|
|
- if (res.data.success == "yes" && res.data.list && res.data.list.length > 0) {
|
|
|
|
|
- this.hotNewsList = res.data.list;
|
|
|
|
|
- this.hotTopics = this.hotNewsList.map((item, index) => ({
|
|
|
|
|
- id: item.id,
|
|
|
|
|
- title: item.title || "热门话题",
|
|
|
|
|
- num_like: item.num_like || 0,
|
|
|
|
|
- isHot: index % 2 === 0,
|
|
|
|
|
- }));
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
- complete: () => {
|
|
|
|
|
- this.isLoadingExplore = false;
|
|
|
|
|
- },
|
|
|
|
|
- fail: (e) => {
|
|
|
|
|
- console.log("请求热点新闻失败:", e);
|
|
|
|
|
- this.isLoadingExplore = false;
|
|
|
|
|
- },
|
|
|
|
|
- });
|
|
|
|
|
- },
|
|
|
|
|
- // 修改新闻列表加载方法
|
|
|
|
|
- loadNewsList() {
|
|
|
|
|
- if (this.isLoadingNews) return;
|
|
|
|
|
- this.isLoadingNews = true;
|
|
|
|
|
-
|
|
|
|
|
- // 保存当前列表数据
|
|
|
|
|
- const currentList = [...this.newsList];
|
|
|
|
|
-
|
|
|
|
|
- uni.request({
|
|
|
|
|
- url: this.$apiHost + "/Article/getlist",
|
|
|
|
|
- data: {
|
|
|
|
|
- uuid: getApp().globalData.uuid,
|
|
|
|
|
- skey: getApp().globalData.skey,
|
|
|
|
|
- type: "list",
|
|
|
|
|
- offset: this.newsOffset,
|
|
|
|
|
- },
|
|
|
|
|
- header: {
|
|
|
|
|
- "content-type": "application/json",
|
|
|
|
|
- sign: getApp().globalData.headerSign,
|
|
|
|
|
- },
|
|
|
|
|
- success: (res) => {
|
|
|
|
|
- console.log("新闻列表数据:", res.data);
|
|
|
|
|
- if (res.data.success == "yes" && res.data.list && res.data.list.length > 0) {
|
|
|
|
|
- if (this.newsOffset === 0) {
|
|
|
|
|
- this.newsList = res.data.list;
|
|
|
|
|
- } else {
|
|
|
|
|
- this.newsList = currentList.concat(res.data.list);
|
|
|
|
|
- }
|
|
|
|
|
- this.newsOffset += res.data.list.length;
|
|
|
|
|
- this.hasMoreNews = res.data.list.length >= 20;
|
|
|
|
|
- } else {
|
|
|
|
|
- this.hasMoreNews = false;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- this.$nextTick(() => {
|
|
|
|
|
- if (this.$refs.paging) {
|
|
|
|
|
- this.$refs.paging.complete(this.newsList);
|
|
|
|
|
- }
|
|
|
|
|
- });
|
|
|
|
|
- },
|
|
|
|
|
- complete: () => {
|
|
|
|
|
- this.isLoadingNews = false;
|
|
|
|
|
- },
|
|
|
|
|
- fail: (e) => {
|
|
|
|
|
- console.log("请求新闻列表失败:", e);
|
|
|
|
|
- this.isLoadingNews = false;
|
|
|
|
|
- if (this.$refs.paging) {
|
|
|
|
|
- this.$refs.paging.complete(false);
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
- });
|
|
|
|
|
- },
|
|
|
|
|
- handleTopicPageChange(e) {
|
|
|
|
|
- this.currentTopicPage = e.detail.current;
|
|
|
|
|
- },
|
|
|
|
|
-
|
|
|
|
|
- formatItem(item) {
|
|
|
|
|
- console.log("item:", item);
|
|
|
|
|
-
|
|
|
|
|
-
|
|
|
|
|
- let img = "";
|
|
|
|
|
- if (item.images) {
|
|
|
|
|
- img = item.images.split("|")[0];
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- // 处理接口返回的数据，使其适配card组件
|
|
|
|
|
- return {
|
|
|
|
|
- id: item.id,
|
|
|
|
|
- allowEdit: false,
|
|
|
|
|
- nickname: item.nickname,
|
|
|
|
|
- avator: item.avator,
|
|
|
|
|
- num_like: item.num_like,
|
|
|
|
|
- num_view: item.num_view,
|
|
|
|
|
- image: img || item.img_url || item.image, // 优先使用images字段
|
|
|
|
|
- w: item.width,
|
|
|
|
|
- h: item.height,
|
|
|
|
|
- title: item.title || "",
|
|
|
|
|
- desc: item.desc || "",
|
|
|
|
|
- userID: item.userID || 0,
|
|
|
|
|
- backgroundColor: "#f6f6f6",
|
|
|
|
|
- };
|
|
|
|
|
- },
|
|
|
|
|
- downloadAndProcessImage(imageUrl, width = 10, height = 10) {
|
|
|
|
|
- return new Promise((resolve, reject) => {
|
|
|
|
|
- uni.downloadFile({
|
|
|
|
|
- url: imageUrl,
|
|
|
|
|
- success: (downloadResult) => {
|
|
|
|
|
- if (downloadResult.statusCode === 200) {
|
|
|
|
|
- const tempFilePath = downloadResult.tempFilePath;
|
|
|
|
|
- const ctx = uni.createCanvasContext("myCanvas", this);
|
|
|
|
|
- ctx.drawImage(tempFilePath, 0, 0, width, height);
|
|
|
|
|
- ctx.draw(false, () => {
|
|
|
|
|
- uni.canvasGetImageData({
|
|
|
|
|
- canvasId: "myCanvas",
|
|
|
|
|
- x: 0,
|
|
|
|
|
- y: 0,
|
|
|
|
|
- width: width,
|
|
|
|
|
- height: height,
|
|
|
|
|
- success: (res) => {
|
|
|
|
|
- const data = res.data;
|
|
|
|
|
- let r = 0,
|
|
|
|
|
- g = 0,
|
|
|
|
|
- b = 0;
|
|
|
|
|
- for (let i = 0; i < data.length; i += 4) {
|
|
|
|
|
- r += data[i];
|
|
|
|
|
- g += data[i + 1];
|
|
|
|
|
- b += data[i + 2];
|
|
|
|
|
- }
|
|
|
|
|
- const count = width * height;
|
|
|
|
|
- r = Math.floor(r / count);
|
|
|
|
|
- g = Math.floor(g / count);
|
|
|
|
|
- b = Math.floor(b / count);
|
|
|
|
|
- resolve({
|
|
|
|
|
- r,
|
|
|
|
|
- g,
|
|
|
|
|
- b,
|
|
|
|
|
- });
|
|
|
|
|
- },
|
|
|
|
|
- fail: (err) => {
|
|
|
|
|
- reject(err);
|
|
|
|
|
- },
|
|
|
|
|
- });
|
|
|
|
|
- });
|
|
|
|
|
- } else {
|
|
|
|
|
- reject(new Error("下载图像失败"));
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
- fail: (err) => {
|
|
|
|
|
- reject(err);
|
|
|
|
|
- },
|
|
|
|
|
- });
|
|
|
|
|
- });
|
|
|
|
|
- },
|
|
|
|
|
- goToArticleDetail(id) {
|
|
|
|
|
- if (!id) {
|
|
|
|
|
- uni.showToast({
|
|
|
|
|
- title: "文章ID不存在",
|
|
|
|
|
- icon: "none",
|
|
|
|
|
- });
|
|
|
|
|
- return;
|
|
|
|
|
- }
|
|
|
|
|
- // uni.$emit("check_login", () => {
|
|
|
|
|
- uni.navigateTo({
|
|
|
|
|
- url: "/pages/index/articleDetail?id=" + id,
|
|
|
|
|
- });
|
|
|
|
|
- // });
|
|
|
|
|
- },
|
|
|
|
|
- goWork(item) {
|
|
|
|
|
- console.log("skeylogin", "xxx");
|
|
|
|
|
- uni.$emit("check_login", () => {
|
|
|
|
|
- uni.navigateTo({
|
|
|
|
|
- url: "/pages/index/workDetail?id=" + item.id,
|
|
|
|
|
- });
|
|
|
|
|
- });
|
|
|
|
|
- },
|
|
|
|
|
- goToMake() {
|
|
|
|
|
- console.log("skeylogin", "xxx2");
|
|
|
|
|
- uni.$emit("check_login", () => {
|
|
|
|
|
- uni.navigateTo({
|
|
|
|
|
- // 生成个人形象
|
|
|
|
|
- // url: "/pages/make/make",
|
|
|
|
|
- url: "/pages/make/fabuArticle?id=-1",
|
|
|
|
|
- });
|
|
|
|
|
- });
|
|
|
|
|
- },
|
|
|
|
|
- goPage(page) {
|
|
|
|
|
- uni.$emit("check_login", () => {
|
|
|
|
|
- uni.navigateTo({
|
|
|
|
|
- url: page,
|
|
|
|
|
- });
|
|
|
|
|
- });
|
|
|
|
|
- },
|
|
|
|
|
- // 修改下拉刷新方法
|
|
|
|
|
- onRefresh() {
|
|
|
|
|
- console.log('下拉刷新开始');
|
|
|
|
|
- // 重置所有数据
|
|
|
|
|
- this.followList = [];
|
|
|
|
|
- this.recommendList = [];
|
|
|
|
|
- this.newsList = [];
|
|
|
|
|
- this.hotTopics = [];
|
|
|
|
|
-
|
|
|
|
|
- // 重置偏移量
|
|
|
|
|
- this.followOffset = 0;
|
|
|
|
|
- this.recommendOffset = 0;
|
|
|
|
|
- this.newsOffset = 0;
|
|
|
|
|
-
|
|
|
|
|
- // 重置加载状态
|
|
|
|
|
- this.hasMoreFollow = true;
|
|
|
|
|
- this.hasMoreRecommend = true;
|
|
|
|
|
- this.hasMoreNews = true;
|
|
|
|
|
-
|
|
|
|
|
- // 根据当前标签页加载数据
|
|
|
|
|
- this.loadTabData(this.currentTab);
|
|
|
|
|
- },
|
|
|
|
|
-
|
|
|
|
|
- // 下拉刷新恢复
|
|
|
|
|
- onRefresherRestore() {
|
|
|
|
|
- console.log('下拉刷新恢复');
|
|
|
|
|
- },
|
|
|
|
|
- },
|
|
|
|
|
-};
|
|
|
|
|
|
|
+ import sortble from "@/components/sortble/sortble.vue";
|
|
|
|
|
+ import tabbarVue from "@/components/tabbar/tabbar.vue";
|
|
|
|
|
+ import pageNavbar from "@/components/page-navbar/page-navbar.vue";
|
|
|
|
|
+ import wWaterfall from "@/components/w-waterfall/w-waterfall.vue";
|
|
|
|
|
+ import tabbar from "@/mixins/tabbar";
|
|
|
|
|
+ import card from "@/components/card/card.vue";
|
|
|
|
|
+ import lhSelectCity from "@/components/lh-select-city/index.vue";
|
|
|
|
|
+ import {
|
|
|
|
|
+ getStorage,
|
|
|
|
|
+ setStorage,
|
|
|
|
|
+ removeStorage
|
|
|
|
|
+ } from "@/common/util.js";
|
|
|
|
|
+ // import noviceGuidance from "@/components/novice-guidance/index.vue";
|
|
|
|
|
+ export default {
|
|
|
|
|
+ components: {
|
|
|
|
|
+ sortble,
|
|
|
|
|
+ tabbarVue,
|
|
|
|
|
+ pageNavbar,
|
|
|
|
|
+ wWaterfall,
|
|
|
|
|
+ lhSelectCity,
|
|
|
|
|
+ card,
|
|
|
|
|
+ // noviceGuidance
|
|
|
|
|
+ },
|
|
|
|
|
+ mixins: [tabbar],
|
|
|
|
|
+ data() {
|
|
|
|
|
+ return {
|
|
|
|
|
+ step: {
|
|
|
|
|
+ name: "workbenchSet5",
|
|
|
|
|
+ guideList: [{
|
|
|
|
|
+ el: ".step1",
|
|
|
|
|
+ tips: "这里是第一步的介绍~",
|
|
|
|
|
+ next: "下一步",
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ el: ".step2",
|
|
|
|
|
+ tips: "这里是第二步的介绍~",
|
|
|
|
|
+ next: "下一步",
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ el: ".step3",
|
|
|
|
|
+ tips: "这里是第三步的介绍~",
|
|
|
|
|
+ next: "下一步",
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ el: ".step4",
|
|
|
|
|
+ tips: "这里是第四步的介绍~",
|
|
|
|
|
+ next: "下一步",
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ el: ".step5",
|
|
|
|
|
+ tips: "这里是第五步的介绍~",
|
|
|
|
|
+ next: "下一步",
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ el: ".step6",
|
|
|
|
|
+ tips: "这里是第六步的介绍~",
|
|
|
|
|
+ next: "下一步",
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ el: ".step7",
|
|
|
|
|
+ tips: "最后一步啦~",
|
|
|
|
|
+ next: "完成",
|
|
|
|
|
+ },
|
|
|
|
|
+ ],
|
|
|
|
|
+ },
|
|
|
|
|
+ windowHeight: uni.getWindowInfo().windowHeight,
|
|
|
|
|
+ bannerList: [
|
|
|
|
|
+ "../../static/dome/home-swper.png",
|
|
|
|
|
+ "../../static/dome/home-swper.png",
|
|
|
|
|
+ "../../static/dome/home-swper.png",
|
|
|
|
|
+ ],
|
|
|
|
|
+ cardList: [{
|
|
|
|
|
+ img: "/static/img/img-1.png",
|
|
|
|
|
+ bgimg: "/static/image/bg-2.png",
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ img: "/static/img/img-3.png",
|
|
|
|
|
+ bgimg: "/static/image/bg-3.png",
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ img: "/static/img/img-2.png",
|
|
|
|
|
+ bgimg: "/static/image/bg-1.png",
|
|
|
|
|
+ },
|
|
|
|
|
+ ],
|
|
|
|
|
+ list: [], // 瀑布流全部数据
|
|
|
|
|
+ dataList: [],
|
|
|
|
|
+ tabs: ["关注", "推荐", "探索"],
|
|
|
|
|
+ currentTab: 1,
|
|
|
|
|
+ currentTopicPage: 0,
|
|
|
|
|
+ followList: [], // 关注列表数据
|
|
|
|
|
+ recommendList: [], // 推荐列表数据
|
|
|
|
|
+ exploreList: [], // 探索列表数据
|
|
|
|
|
+ hotNewsList: [], // 热点新闻数据
|
|
|
|
|
+ newsList: [], // 新闻列表数据
|
|
|
|
|
+ followOffset: 0, // 关注列表偏移量
|
|
|
|
|
+ recommendOffset: 0, // 推荐列表偏移量
|
|
|
|
|
+ exploreOffset: 0, // 探索列表偏移量
|
|
|
|
|
+ newsOffset: 0, // 新闻列表偏移量
|
|
|
|
|
+ hasMoreFollow: true, // 是否有更多关注列表数据
|
|
|
|
|
+ hasMoreRecommend: true, // 是否有更多推荐列表数据
|
|
|
|
|
+ hasMoreExplore: true, // 是否有更多探索列表数据
|
|
|
|
|
+ hasMoreNews: true, // 是否有更多新闻列表数据
|
|
|
|
|
+ isLoadingFollow: false, // 是否正在加载关注列表
|
|
|
|
|
+ isLoadingRecommend: false, // 是否正在加载推荐列表
|
|
|
|
|
+ isLoadingExplore: false, // 是否正在加载探索列表
|
|
|
|
|
+ isLoadingNews: false, // 是否正在加载新闻列表
|
|
|
|
|
+ hotTopics: [],
|
|
|
|
|
+ lhSelectCityFalg: false,
|
|
|
|
|
+ hotCitys: [
|
|
|
|
|
+ "杭州",
|
|
|
|
|
+ "天津",
|
|
|
|
|
+ "北京",
|
|
|
|
|
+ "上海",
|
|
|
|
|
+ "深圳",
|
|
|
|
|
+ "广州",
|
|
|
|
|
+ "成都",
|
|
|
|
|
+ "重庆",
|
|
|
|
|
+ "厦门",
|
|
|
|
|
+ ],
|
|
|
|
|
+ currentCity: "北京",
|
|
|
|
|
+ windowHeight: "",
|
|
|
|
|
+ weather: {
|
|
|
|
|
+ city: "",
|
|
|
|
|
+ weather: "",
|
|
|
|
|
+ temp: "0℃",
|
|
|
|
|
+ icon: 101,
|
|
|
|
|
+ },
|
|
|
|
|
+ isContentRecommendation: true,
|
|
|
|
|
+ };
|
|
|
|
|
+ },
|
|
|
|
|
+
|
|
|
|
|
+ computed: {
|
|
|
|
|
+ getDayOfWeek() {
|
|
|
|
|
+ const days = [
|
|
|
|
|
+ "星期日",
|
|
|
|
|
+ "星期一",
|
|
|
|
|
+ "星期二",
|
|
|
|
|
+ "星期三",
|
|
|
|
|
+ "星期四",
|
|
|
|
|
+ "星期五",
|
|
|
|
|
+ "星期六",
|
|
|
|
|
+ ];
|
|
|
|
|
+ const today = new Date();
|
|
|
|
|
+ const dayOfWeek = days[today.getDay()];
|
|
|
|
|
+ return dayOfWeek;
|
|
|
|
|
+ },
|
|
|
|
|
+ currentList() {
|
|
|
|
|
+ switch (this.currentTab) {
|
|
|
|
|
+ case 0:
|
|
|
|
|
+ return this.followList;
|
|
|
|
|
+ case 1:
|
|
|
|
|
+ return this.recommendList; // 使用专门的推荐列表
|
|
|
|
|
+ case 2:
|
|
|
|
|
+ return this.exploreList;
|
|
|
|
|
+ default:
|
|
|
|
|
+ return [];
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ topicPages() {
|
|
|
|
|
+ const pages = [];
|
|
|
|
|
+ for (let i = 0; i < this.hotTopics.length; i += 4) {
|
|
|
|
|
+ pages.push(this.hotTopics.slice(i, i + 4));
|
|
|
|
|
+ }
|
|
|
|
|
+ return pages;
|
|
|
|
|
+ },
|
|
|
|
|
+ },
|
|
|
|
|
+ onLoad() {
|
|
|
|
|
+ let that = this;
|
|
|
|
|
+ // 计算出可用高度
|
|
|
|
|
+ this.windowHeight = uni.getSystemInfoSync().windowHeight + "px";
|
|
|
|
|
+ // 不在onLoad中直接加载数据，避免与z-paging组件重复请求
|
|
|
|
|
+ // 让z-paging组件通过queryList方法控制数据加载
|
|
|
|
|
+ this.getWeather();
|
|
|
|
|
+ this.queryList();
|
|
|
|
|
+ },
|
|
|
|
|
+ onShow() {
|
|
|
|
|
+ var isContentRecommendation = getStorage("isContentRecommendation");
|
|
|
|
|
+ console.log(isContentRecommendation, "isContentRecommendation");
|
|
|
|
|
+ if (isContentRecommendation != "false") {
|
|
|
|
|
+ isContentRecommendation = true;
|
|
|
|
|
+ } else {
|
|
|
|
|
+ isContentRecommendation = false;
|
|
|
|
|
+ }
|
|
|
|
|
+ this.isContentRecommendation = isContentRecommendation;
|
|
|
|
|
+
|
|
|
|
|
+ if (isContentRecommendation == false) {
|
|
|
|
|
+ this.tabs = ["关注"];
|
|
|
|
|
+ this.currentTab = 0;
|
|
|
|
|
+ this.queryList();
|
|
|
|
|
+ } else {
|
|
|
|
|
+ this.tabs = ["关注", "推荐", "探索"];
|
|
|
|
|
+ this.currentTab = 1;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ uni.$emit('check_update');
|
|
|
|
|
+ },
|
|
|
|
|
+ // 修改触底加载方法
|
|
|
|
|
+ onReachBottom() {
|
|
|
|
|
+ console.log('触底加载更多');
|
|
|
|
|
+ // 根据当前标签页加载更多数据
|
|
|
|
|
+ switch (this.currentTab) {
|
|
|
|
|
+ case 0:
|
|
|
|
|
+ if (this.hasMoreFollow && !this.isLoadingFollow) {
|
|
|
|
|
+ this.loadFollowList();
|
|
|
|
|
+ }
|
|
|
|
|
+ break;
|
|
|
|
|
+ case 1:
|
|
|
|
|
+ if (this.hasMoreRecommend && !this.isLoadingRecommend) {
|
|
|
|
|
+ this.loadRecommendList();
|
|
|
|
|
+ }
|
|
|
|
|
+ break;
|
|
|
|
|
+ case 2:
|
|
|
|
|
+ if (this.hasMoreNews && !this.isLoadingNews) {
|
|
|
|
|
+ this.loadNewsList();
|
|
|
|
|
+ }
|
|
|
|
|
+ break;
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+
|
|
|
|
|
+ // 下拉刷新数据
|
|
|
|
|
+ methods: {
|
|
|
|
|
+ getWeather(city) {
|
|
|
|
|
+ uni.request({
|
|
|
|
|
+ url: this.$apiHost + "/Index/getAreaInfo",
|
|
|
|
|
+ data: {
|
|
|
|
|
+ uuid: getApp().globalData.uuid,
|
|
|
|
|
+ skey: getApp().globalData.skey,
|
|
|
|
|
+ city: city || (this.currentCity == "北京" ? "" : this.currentCity),
|
|
|
|
|
+ },
|
|
|
|
|
+ header: {
|
|
|
|
|
+ "content-type": "application/json",
|
|
|
|
|
+ sign: getApp().globalData.headerSign,
|
|
|
|
|
+ },
|
|
|
|
|
+ success: (res) => {
|
|
|
|
|
+ console.log(this.weather, "天气数据", res.data);
|
|
|
|
|
+ if (res.data.city) {
|
|
|
|
|
+ this.currentCity = res.data.city;
|
|
|
|
|
+ this.weather = res.data;
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ complete: () => {},
|
|
|
|
|
+ fail: (e) => {},
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ lhSelectCityFun() {
|
|
|
|
|
+ this.lhSelectCityFalg = true;
|
|
|
|
|
+ },
|
|
|
|
|
+ // 选中事件
|
|
|
|
|
+ City(city) {
|
|
|
|
|
+ this.currentCity = city;
|
|
|
|
|
+ setTimeout(() => {
|
|
|
|
|
+ this.lhSelectCityFalg = false;
|
|
|
|
|
+ }, 300);
|
|
|
|
|
+ },
|
|
|
|
|
+ closeLhSelectCityFun() {
|
|
|
|
|
+ this.lhSelectCityFalg = false;
|
|
|
|
|
+ },
|
|
|
|
|
+ queryList() {
|
|
|
|
|
+ // 根据当前标签刷新数据
|
|
|
|
|
+ switch (this.currentTab) {
|
|
|
|
|
+ case 0:
|
|
|
|
|
+ // 重置关注列表
|
|
|
|
|
+ this.followList = [];
|
|
|
|
|
+ this.followOffset = 0;
|
|
|
|
|
+ this.hasMoreFollow = true;
|
|
|
|
|
+ this.loadFollowList();
|
|
|
|
|
+ break;
|
|
|
|
|
+ case 1:
|
|
|
|
|
+ // 重置推荐列表
|
|
|
|
|
+ this.recommendList = [];
|
|
|
|
|
+ this.recommendOffset = 0;
|
|
|
|
|
+ this.hasMoreRecommend = true;
|
|
|
|
|
+ this.loadRecommendList();
|
|
|
|
|
+ break;
|
|
|
|
|
+ case 2:
|
|
|
|
|
+ // 重置热点新闻和新闻列表
|
|
|
|
|
+ this.hotNewsList = [];
|
|
|
|
|
+ this.newsList = [];
|
|
|
|
|
+ this.newsOffset = 0;
|
|
|
|
|
+ this.hasMoreNews = true;
|
|
|
|
|
+ // 加载热点新闻和新闻列表
|
|
|
|
|
+ this.loadHotNews();
|
|
|
|
|
+ this.loadNewsList();
|
|
|
|
|
+ break;
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+
|
|
|
|
|
+ switchTab(index) {
|
|
|
|
|
+ if (this.currentTab === index) return;
|
|
|
|
|
+ this.currentTab = index;
|
|
|
|
|
+
|
|
|
|
|
+ // 重置当前标签页的数据
|
|
|
|
|
+ switch (index) {
|
|
|
|
|
+ case 0:
|
|
|
|
|
+ this.followList = [];
|
|
|
|
|
+ this.followOffset = 0;
|
|
|
|
|
+ this.hasMoreFollow = true;
|
|
|
|
|
+ break;
|
|
|
|
|
+ case 1:
|
|
|
|
|
+ this.recommendList = [];
|
|
|
|
|
+ this.recommendOffset = 0;
|
|
|
|
|
+ this.hasMoreRecommend = true;
|
|
|
|
|
+ break;
|
|
|
|
|
+ case 2:
|
|
|
|
|
+ this.newsList = [];
|
|
|
|
|
+ this.hotTopics = [];
|
|
|
|
|
+ this.newsOffset = 0;
|
|
|
|
|
+ this.hasMoreNews = true;
|
|
|
|
|
+ break;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ // 加载新标签页的数据
|
|
|
|
|
+ this.loadTabData(index);
|
|
|
|
|
+ },
|
|
|
|
|
+ loadTabData(index) {
|
|
|
|
|
+ switch (index) {
|
|
|
|
|
+ case 0:
|
|
|
|
|
+ this.loadFollowList();
|
|
|
|
|
+ break;
|
|
|
|
|
+ case 1:
|
|
|
|
|
+ this.loadRecommendList();
|
|
|
|
|
+ break;
|
|
|
|
|
+ case 2:
|
|
|
|
|
+ this.loadHotNews();
|
|
|
|
|
+ this.loadNewsList();
|
|
|
|
|
+ break;
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ // 修改关注列表加载方法
|
|
|
|
|
+ loadFollowList() {
|
|
|
|
|
+ if (this.isLoadingFollow) return;
|
|
|
|
|
+ this.isLoadingFollow = true;
|
|
|
|
|
+
|
|
|
|
|
+ // 保存当前列表数据
|
|
|
|
|
+ const currentList = [...this.followList];
|
|
|
|
|
+
|
|
|
|
|
+ uni.request({
|
|
|
|
|
+ url: this.$apiHost + "/Work/getlist",
|
|
|
|
|
+ data: {
|
|
|
|
|
+ uuid: getApp().globalData.uuid,
|
|
|
|
|
+ skey: getApp().globalData.skey,
|
|
|
|
|
+ type: "attention",
|
|
|
|
|
+ offset: this.followOffset,
|
|
|
|
|
+ },
|
|
|
|
|
+ header: {
|
|
|
|
|
+ "content-type": "application/json",
|
|
|
|
|
+ sign: getApp().globalData.headerSign,
|
|
|
|
|
+ },
|
|
|
|
|
+ success: (res) => {
|
|
|
|
|
+ console.log("关注列表数据:", res.data);
|
|
|
|
|
+ if (res.data.success == "yes" && res.data.list && res.data.list.length > 0) {
|
|
|
|
|
+ // 使用 Vue.set 确保响应式更新
|
|
|
|
|
+ if (this.followOffset === 0) {
|
|
|
|
|
+ this.followList = res.data.list;
|
|
|
|
|
+ } else {
|
|
|
|
|
+ // 使用 Vue.set 更新数组，避免数据闪烁
|
|
|
|
|
+ this.followList = currentList.concat(res.data.list);
|
|
|
|
|
+ }
|
|
|
|
|
+ this.followOffset += res.data.list.length;
|
|
|
|
|
+ this.hasMoreFollow = res.data.list.length >= 20;
|
|
|
|
|
+ } else {
|
|
|
|
|
+ this.hasMoreFollow = false;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ // 使用 nextTick 确保数据更新后再通知组件
|
|
|
|
|
+ this.$nextTick(() => {
|
|
|
|
|
+ if (this.$refs.paging) {
|
|
|
|
|
+ this.$refs.paging.complete(this.followList);
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ complete: () => {
|
|
|
|
|
+ this.isLoadingFollow = false;
|
|
|
|
|
+ },
|
|
|
|
|
+ fail: (e) => {
|
|
|
|
|
+ console.log("请求关注列表失败:", e);
|
|
|
|
|
+ this.isLoadingFollow = false;
|
|
|
|
|
+ if (this.$refs.paging) {
|
|
|
|
|
+ this.$refs.paging.complete(false);
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ // 修改推荐列表加载方法
|
|
|
|
|
+ loadRecommendList() {
|
|
|
|
|
+ if (this.isLoadingRecommend) return;
|
|
|
|
|
+ this.isLoadingRecommend = true;
|
|
|
|
|
+
|
|
|
|
|
+ // 保存当前列表数据
|
|
|
|
|
+ const currentList = [...this.recommendList];
|
|
|
|
|
+
|
|
|
|
|
+ uni.request({
|
|
|
|
|
+ url: this.$apiHost + "/Work/getlist",
|
|
|
|
|
+ data: {
|
|
|
|
|
+ uuid: getApp().globalData.uuid,
|
|
|
|
|
+ skey: getApp().globalData.skey,
|
|
|
|
|
+ type: "recommend",
|
|
|
|
|
+ offset: this.recommendOffset,
|
|
|
|
|
+ },
|
|
|
|
|
+ header: {
|
|
|
|
|
+ "content-type": "application/json",
|
|
|
|
|
+ sign: getApp().globalData.headerSign,
|
|
|
|
|
+ },
|
|
|
|
|
+ success: (res) => {
|
|
|
|
|
+ console.log("推荐列表数据:", res.data);
|
|
|
|
|
+ if (res.data.success == "yes" && res.data.list && res.data.list.length > 0) {
|
|
|
|
|
+ if (this.recommendOffset === 0) {
|
|
|
|
|
+ this.recommendList = res.data.list;
|
|
|
|
|
+ } else {
|
|
|
|
|
+ this.recommendList = currentList.concat(res.data.list);
|
|
|
|
|
+ }
|
|
|
|
|
+ this.recommendOffset += res.data.list.length;
|
|
|
|
|
+ this.hasMoreRecommend = res.data.list.length >= 20;
|
|
|
|
|
+ } else {
|
|
|
|
|
+ this.hasMoreRecommend = false;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ this.$nextTick(() => {
|
|
|
|
|
+ if (this.$refs.paging) {
|
|
|
|
|
+ this.$refs.paging.complete(this.recommendList);
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ complete: () => {
|
|
|
|
|
+ this.isLoadingRecommend = false;
|
|
|
|
|
+ },
|
|
|
|
|
+ fail: (e) => {
|
|
|
|
|
+ console.log("请求推荐列表失败:", e);
|
|
|
|
|
+ this.isLoadingRecommend = false;
|
|
|
|
|
+ if (this.$refs.paging) {
|
|
|
|
|
+ this.$refs.paging.complete(false);
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ loadHotNews() {
|
|
|
|
|
+ if (this.isLoadingExplore) return;
|
|
|
|
|
+ this.isLoadingExplore = true;
|
|
|
|
|
+
|
|
|
|
|
+ uni.request({
|
|
|
|
|
+ url: this.$apiHost + "/Article/getlist",
|
|
|
|
|
+ data: {
|
|
|
|
|
+ uuid: getApp().globalData.uuid,
|
|
|
|
|
+ skey: getApp().globalData.skey,
|
|
|
|
|
+ type: "hot",
|
|
|
|
|
+ },
|
|
|
|
|
+ header: {
|
|
|
|
|
+ "content-type": "application/json",
|
|
|
|
|
+ sign: getApp().globalData.headerSign,
|
|
|
|
|
+ },
|
|
|
|
|
+ success: (res) => {
|
|
|
|
|
+ console.log("热点新闻数据:", res.data);
|
|
|
|
|
+ if (res.data.success == "yes" && res.data.list && res.data.list.length > 0) {
|
|
|
|
|
+ this.hotNewsList = res.data.list;
|
|
|
|
|
+ this.hotTopics = this.hotNewsList.map((item, index) => ({
|
|
|
|
|
+ id: item.id,
|
|
|
|
|
+ title: item.title || "热门话题",
|
|
|
|
|
+ num_like: item.num_like || 0,
|
|
|
|
|
+ isHot: index % 2 === 0,
|
|
|
|
|
+ }));
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ complete: () => {
|
|
|
|
|
+ this.isLoadingExplore = false;
|
|
|
|
|
+ },
|
|
|
|
|
+ fail: (e) => {
|
|
|
|
|
+ console.log("请求热点新闻失败:", e);
|
|
|
|
|
+ this.isLoadingExplore = false;
|
|
|
|
|
+ },
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ // 修改新闻列表加载方法
|
|
|
|
|
+ loadNewsList() {
|
|
|
|
|
+ if (this.isLoadingNews) return;
|
|
|
|
|
+ this.isLoadingNews = true;
|
|
|
|
|
+
|
|
|
|
|
+ // 保存当前列表数据
|
|
|
|
|
+ const currentList = [...this.newsList];
|
|
|
|
|
+
|
|
|
|
|
+ uni.request({
|
|
|
|
|
+ url: this.$apiHost + "/Article/getlist",
|
|
|
|
|
+ data: {
|
|
|
|
|
+ uuid: getApp().globalData.uuid,
|
|
|
|
|
+ skey: getApp().globalData.skey,
|
|
|
|
|
+ type: "list",
|
|
|
|
|
+ offset: this.newsOffset,
|
|
|
|
|
+ },
|
|
|
|
|
+ header: {
|
|
|
|
|
+ "content-type": "application/json",
|
|
|
|
|
+ sign: getApp().globalData.headerSign,
|
|
|
|
|
+ },
|
|
|
|
|
+ success: (res) => {
|
|
|
|
|
+ console.log("新闻列表数据:", res.data);
|
|
|
|
|
+ if (res.data.success == "yes" && res.data.list && res.data.list.length > 0) {
|
|
|
|
|
+ if (this.newsOffset === 0) {
|
|
|
|
|
+ this.newsList = res.data.list;
|
|
|
|
|
+ } else {
|
|
|
|
|
+ this.newsList = currentList.concat(res.data.list);
|
|
|
|
|
+ }
|
|
|
|
|
+ this.newsOffset += res.data.list.length;
|
|
|
|
|
+ this.hasMoreNews = res.data.list.length >= 20;
|
|
|
|
|
+ } else {
|
|
|
|
|
+ this.hasMoreNews = false;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ this.$nextTick(() => {
|
|
|
|
|
+ if (this.$refs.paging) {
|
|
|
|
|
+ this.$refs.paging.complete(this.newsList);
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ complete: () => {
|
|
|
|
|
+ this.isLoadingNews = false;
|
|
|
|
|
+ },
|
|
|
|
|
+ fail: (e) => {
|
|
|
|
|
+ console.log("请求新闻列表失败:", e);
|
|
|
|
|
+ this.isLoadingNews = false;
|
|
|
|
|
+ if (this.$refs.paging) {
|
|
|
|
|
+ this.$refs.paging.complete(false);
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ handleTopicPageChange(e) {
|
|
|
|
|
+ this.currentTopicPage = e.detail.current;
|
|
|
|
|
+ },
|
|
|
|
|
+
|
|
|
|
|
+ formatItem(item) {
|
|
|
|
|
+ console.log("item:", item);
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+ let img = "";
|
|
|
|
|
+ if (item.images) {
|
|
|
|
|
+ img = item.images.split("|")[0];
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ // 处理接口返回的数据，使其适配card组件
|
|
|
|
|
+ return {
|
|
|
|
|
+ id: item.id,
|
|
|
|
|
+ allowEdit: false,
|
|
|
|
|
+ nickname: item.nickname,
|
|
|
|
|
+ avator: item.avator,
|
|
|
|
|
+ num_like: item.num_like,
|
|
|
|
|
+ num_view: item.num_view,
|
|
|
|
|
+ image: img || item.img_url || item.image, // 优先使用images字段
|
|
|
|
|
+ w: item.width,
|
|
|
|
|
+ h: item.height,
|
|
|
|
|
+ title: item.title || "",
|
|
|
|
|
+ desc: item.desc || "",
|
|
|
|
|
+ userID: item.userID || 0,
|
|
|
|
|
+ backgroundColor: "#f6f6f6",
|
|
|
|
|
+ };
|
|
|
|
|
+ },
|
|
|
|
|
+ downloadAndProcessImage(imageUrl, width = 10, height = 10) {
|
|
|
|
|
+ return new Promise((resolve, reject) => {
|
|
|
|
|
+ uni.downloadFile({
|
|
|
|
|
+ url: imageUrl,
|
|
|
|
|
+ success: (downloadResult) => {
|
|
|
|
|
+ if (downloadResult.statusCode === 200) {
|
|
|
|
|
+ const tempFilePath = downloadResult.tempFilePath;
|
|
|
|
|
+ const ctx = uni.createCanvasContext("myCanvas", this);
|
|
|
|
|
+ ctx.drawImage(tempFilePath, 0, 0, width, height);
|
|
|
|
|
+ ctx.draw(false, () => {
|
|
|
|
|
+ uni.canvasGetImageData({
|
|
|
|
|
+ canvasId: "myCanvas",
|
|
|
|
|
+ x: 0,
|
|
|
|
|
+ y: 0,
|
|
|
|
|
+ width: width,
|
|
|
|
|
+ height: height,
|
|
|
|
|
+ success: (res) => {
|
|
|
|
|
+ const data = res.data;
|
|
|
|
|
+ let r = 0,
|
|
|
|
|
+ g = 0,
|
|
|
|
|
+ b = 0;
|
|
|
|
|
+ for (let i = 0; i < data.length; i +=
|
|
|
|
|
+ 4) {
|
|
|
|
|
+ r += data[i];
|
|
|
|
|
+ g += data[i + 1];
|
|
|
|
|
+ b += data[i + 2];
|
|
|
|
|
+ }
|
|
|
|
|
+ const count = width * height;
|
|
|
|
|
+ r = Math.floor(r / count);
|
|
|
|
|
+ g = Math.floor(g / count);
|
|
|
|
|
+ b = Math.floor(b / count);
|
|
|
|
|
+ resolve({
|
|
|
|
|
+ r,
|
|
|
|
|
+ g,
|
|
|
|
|
+ b,
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ fail: (err) => {
|
|
|
|
|
+ reject(err);
|
|
|
|
|
+ },
|
|
|
|
|
+ });
|
|
|
|
|
+ });
|
|
|
|
|
+ } else {
|
|
|
|
|
+ reject(new Error("下载图像失败"));
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ fail: (err) => {
|
|
|
|
|
+ reject(err);
|
|
|
|
|
+ },
|
|
|
|
|
+ });
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ goToArticleDetail(id) {
|
|
|
|
|
+ if (!id) {
|
|
|
|
|
+ uni.showToast({
|
|
|
|
|
+ title: "文章ID不存在",
|
|
|
|
|
+ icon: "none",
|
|
|
|
|
+ });
|
|
|
|
|
+ return;
|
|
|
|
|
+ }
|
|
|
|
|
+ // uni.$emit("check_login", () => {
|
|
|
|
|
+ uni.navigateTo({
|
|
|
|
|
+ url: "/pages/index/articleDetail?id=" + id,
|
|
|
|
|
+ });
|
|
|
|
|
+ // });
|
|
|
|
|
+ },
|
|
|
|
|
+ goWork(item) {
|
|
|
|
|
+ console.log("skeylogin", "xxx");
|
|
|
|
|
+ uni.$emit("check_login", () => {
|
|
|
|
|
+ uni.navigateTo({
|
|
|
|
|
+ url: "/pages/index/workDetail?id=" + item.id,
|
|
|
|
|
+ });
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ goToMake() {
|
|
|
|
|
+ console.log("skeylogin", "xxx2");
|
|
|
|
|
+ uni.$emit("check_login", () => {
|
|
|
|
|
+ uni.navigateTo({
|
|
|
|
|
+ // 生成个人形象
|
|
|
|
|
+ // url: "/pages/make/make",
|
|
|
|
|
+ url: "/pages/make/fabuArticle?id=-1",
|
|
|
|
|
+ });
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ goPage(page) {
|
|
|
|
|
+ uni.$emit("check_login", () => {
|
|
|
|
|
+ uni.navigateTo({
|
|
|
|
|
+ url: page,
|
|
|
|
|
+ });
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ // 修改下拉刷新方法
|
|
|
|
|
+ onRefresh() {
|
|
|
|
|
+ console.log('下拉刷新开始');
|
|
|
|
|
+ // 重置所有数据
|
|
|
|
|
+ this.followList = [];
|
|
|
|
|
+ this.recommendList = [];
|
|
|
|
|
+ this.newsList = [];
|
|
|
|
|
+ this.hotTopics = [];
|
|
|
|
|
+
|
|
|
|
|
+ // 重置偏移量
|
|
|
|
|
+ this.followOffset = 0;
|
|
|
|
|
+ this.recommendOffset = 0;
|
|
|
|
|
+ this.newsOffset = 0;
|
|
|
|
|
+
|
|
|
|
|
+ // 重置加载状态
|
|
|
|
|
+ this.hasMoreFollow = true;
|
|
|
|
|
+ this.hasMoreRecommend = true;
|
|
|
|
|
+ this.hasMoreNews = true;
|
|
|
|
|
+
|
|
|
|
|
+ // 根据当前标签页加载数据
|
|
|
|
|
+ this.loadTabData(this.currentTab);
|
|
|
|
|
+ },
|
|
|
|
|
+
|
|
|
|
|
+ // 下拉刷新恢复
|
|
|
|
|
+ onRefresherRestore() {
|
|
|
|
|
+ console.log('下拉刷新恢复');
|
|
|
|
|
+ },
|
|
|
|
|
+ },
|
|
|
|
|
+ };
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
|
<style lang="scss">
|
|
<style lang="scss">
|
|
|
-@import "index.scss";
|
|
|
|
|
-
|
|
|
|
|
-// 添加过渡效果样式
|
|
|
|
|
-.fade-enter-active,
|
|
|
|
|
-.fade-leave-active {
|
|
|
|
|
- transition: opacity 0.3s;
|
|
|
|
|
-}
|
|
|
|
|
-
|
|
|
|
|
-.fade-enter,
|
|
|
|
|
-.fade-leave-to {
|
|
|
|
|
- opacity: 0;
|
|
|
|
|
-}
|
|
|
|
|
-
|
|
|
|
|
-// 确保列表项有最小高度，避免闪烁
|
|
|
|
|
-.list-item {
|
|
|
|
|
- min-height: 200rpx;
|
|
|
|
|
- background: #fff;
|
|
|
|
|
- margin-bottom: 20rpx;
|
|
|
|
|
- border-radius: 12rpx;
|
|
|
|
|
- overflow: hidden;
|
|
|
|
|
-}
|
|
|
|
|
|
|
+ @import "index.scss";
|
|
|
|
|
+
|
|
|
|
|
+ // 添加过渡效果样式
|
|
|
|
|
+ .fade-enter-active,
|
|
|
|
|
+ .fade-leave-active {
|
|
|
|
|
+ transition: opacity 0.3s;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .fade-enter,
|
|
|
|
|
+ .fade-leave-to {
|
|
|
|
|
+ opacity: 0;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ // 确保列表项有最小高度，避免闪烁
|
|
|
|
|
+ .list-item {
|
|
|
|
|
+ min-height: 200rpx;
|
|
|
|
|
+ background: #fff;
|
|
|
|
|
+ margin-bottom: 20rpx;
|
|
|
|
|
+ border-radius: 12rpx;
|
|
|
|
|
+ overflow: hidden;
|
|
|
|
|
+ }
|
|
|
</style>
|
|
</style>
|
|
|
<style>
|
|
<style>
|
|
|
-@import "@/style/qweather-icons.css";
|
|
|
|
|
-</style>
|
|
|
|
|
|
|
+ @import "@/style/qweather-icons.css";
|
|
|
|
|
+</style>
|
