|
|
@@ -10,85 +10,106 @@
|
|
|
</view>
|
|
|
<view class="flex justify-center align-center padding-bottom">
|
|
|
<view class="search">
|
|
|
- <u-search @search="searchWorks" search-icon="/static/rank/search.png" :show-action="false" bg-color="#fff"
|
|
|
- style="width: 100%;" placeholder-color="#CCCCCC"></u-search>
|
|
|
+ <u-search @search="searchWorks" search-icon="/static/rank/search.png" :show-action="false"
|
|
|
+ bg-color="#fff" style="width: 100%;" placeholder-color="#CCCCCC"></u-search>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <block v-for="(item, index) in rankList" :key="item.id">
|
|
|
- <block v-if="index == 0 || index == 1 || index == 2">
|
|
|
- <view class=" flex align-center"
|
|
|
- style="height: 230rpx;position: relative;margin: 10rpx 20rpx 20rpx 20rpx;"
|
|
|
- :class="index == 0 ? 'first' : index == 1 ? 'second' : index == 2 ? 'third' : '' ">
|
|
|
- <u-image width="220" height="220" mode="aspectFill" border-radius="10" :src="item.imgUrl"></u-image>
|
|
|
- <view class="flex justify-between container" style="width: 100%;">
|
|
|
- <view class="left" style="width: 95%;">
|
|
|
- <view class="name text-cut ">{{item.title}}</view>
|
|
|
- <view class="padding-tb-sm text-sm center"
|
|
|
- style="color: #888888;justify-content: flex-start">
|
|
|
- <u-avatar :src="item.userImg?item.userImg:'/static/icon/unlogin.png'" size="56"></u-avatar>
|
|
|
- <text class="margin-left-10">{{item.username || '暂无信息'}}</text>
|
|
|
- </view>
|
|
|
+ <mescroll-body ref="mescrollRef" @init="mescrollInit" :down="downOption" :up="upOption" @down="downCallback"
|
|
|
+ @up="upCallback">
|
|
|
+ <block v-for="(item, index) in rankList" :key="item.id">
|
|
|
+ <block v-if="index == 0 || index == 1 || index == 2">
|
|
|
+ <view class=" flex align-center"
|
|
|
+ style="height: 230rpx;position: relative;margin: 10rpx 20rpx 20rpx 20rpx;"
|
|
|
+ :class="index == 0 ? 'first' : index == 1 ? 'second' : index == 2 ? 'third' : '' ">
|
|
|
+ <u-image width="220" height="220" mode="aspectFill" border-radius="10" :src="item.imgUrl">
|
|
|
+ </u-image>
|
|
|
+ <view class="flex justify-between container" style="width: 100%;">
|
|
|
+ <view class="left" style="width: 95%;">
|
|
|
+ <view class="padding-top-20 " style="display: flex;">
|
|
|
+ <view class="center ">
|
|
|
+ <view class="cu-tag sm bg-red light radius">
|
|
|
+ 编号:{{item.productNo}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="center">
|
|
|
+ <text class="name text-cut-1">{{item.title}}111111111111</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="padding-tb-sm text-sm center"
|
|
|
+ style="color: #888888;justify-content: flex-start">
|
|
|
+ <u-avatar :src="item.userImg?item.userImg:'/static/icon/unlogin.png'" size="56">
|
|
|
+ </u-avatar>
|
|
|
+ <text class="margin-left-10">{{item.username || '暂无信息'}}</text>
|
|
|
+ </view>
|
|
|
|
|
|
- <view class="flex justify-between">
|
|
|
- <view class="hot-value center" style="justify-content: flex-start;">
|
|
|
- <image src="../../static/rank/hot.png" style="width: 36rpx;height: 36rpx;"
|
|
|
- mode=""></image>
|
|
|
- <text>{{item.voteCount}}</text>
|
|
|
+ <view class="flex justify-between">
|
|
|
+ <view class="hot-value center" style="justify-content: flex-start;">
|
|
|
+ <image src="../../static/rank/hot.png" style="width: 36rpx;height: 36rpx;"
|
|
|
+ mode=""></image>
|
|
|
+ <text>{{item.voteCount}}</text>
|
|
|
+ </view>
|
|
|
+ <button @click.stop="$jump('/pages/activity/activityDetail?id='+item.id+'&isCustomBack=false')"
|
|
|
+ class="cu-btn round bg-base sm text-white"
|
|
|
+ style="padding: 20rpx 38rpx;margin-bottom: 30rpx;">
|
|
|
+ <text>去投票</text>
|
|
|
+ </button>
|
|
|
</view>
|
|
|
- <button
|
|
|
- @click.stop="$jump('/pages/activity/activityDetail?id='+item.id)"
|
|
|
- class="cu-btn round bg-base sm text-white"
|
|
|
- style="padding: 20rpx 38rpx;margin-bottom: 30rpx;">
|
|
|
- <text>去投票</text>
|
|
|
- </button>
|
|
|
</view>
|
|
|
</view>
|
|
|
- </view>
|
|
|
|
|
|
- <view class="" style="position: absolute;right: -16rpx;top: -16rpx;">
|
|
|
- <image v-if="index==0" style="width: 70rpx;height: 70rpx;" src="../../static/rank/no1.png"
|
|
|
- mode=""></image>
|
|
|
- <image v-if="index==1" style="width: 70rpx;height: 70rpx;" src="../../static/rank/no2.png"
|
|
|
- mode=""></image>
|
|
|
- <image v-if="index==2" style="width: 70rpx;height: 70rpx;" src="../../static/rank/no3.png"
|
|
|
- mode=""></image>
|
|
|
+ <view class="" style="position: absolute;right: -16rpx;top: -16rpx;">
|
|
|
+ <image v-if="index==0" style="width: 70rpx;height: 70rpx;"
|
|
|
+ src="../../static/rank/no1.png" mode=""></image>
|
|
|
+ <image v-if="index==1" style="width: 70rpx;height: 70rpx;"
|
|
|
+ src="../../static/rank/no2.png" mode=""></image>
|
|
|
+ <image v-if="index==2" style="width: 70rpx;height: 70rpx;"
|
|
|
+ src="../../static/rank/no3.png" mode=""></image>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
- </view>
|
|
|
- </block>
|
|
|
- <view v-else class="flex margin-20">
|
|
|
- <view class="center text-bold text-lg" style="margin:0 20rpx;">
|
|
|
- <text>{{index + 1}}</text>
|
|
|
- </view>
|
|
|
- <view class=" flex align-center "
|
|
|
- style="background-color: #FFFFFF;border-radius: 20rpx;height: 200rpx;width: 95%;">
|
|
|
- <u-image width="190" height="190" border-radius="10" :src="item.imgUrl"></u-image>
|
|
|
- <view class="flex justify-between container" style="width: 100%;">
|
|
|
- <view class="left" style="width: 95%;">
|
|
|
- <view class="name text-cut "
|
|
|
- style="font-size: 28rpx;font-weight: 600;padding-top: 20rpx;width: 430rpx;">{{item.title}}</view>
|
|
|
- <view class="padding-top-20 text-sm center"
|
|
|
- style="color: #888888;justify-content: flex-start">
|
|
|
- <u-avatar :src="item.userImg?item.userImg:'/static/icon/unlogin.png'" size="56"></u-avatar>
|
|
|
- <text class="margin-left-10">{{item.username || '暂无信息'}}</text>
|
|
|
- </view>
|
|
|
- <view class="flex justify-between">
|
|
|
- <view class="hot-value center" style="justify-content: flex-start;">
|
|
|
- <image src="../../static/rank/hot.png" style="width: 36rpx;height: 36rpx;"
|
|
|
- mode=""></image>
|
|
|
- <text>{{item.voteCount}}</text>
|
|
|
+ </block>
|
|
|
+ <view v-else class="flex margin-20">
|
|
|
+ <view class="center text-bold text-lg" style="margin:0 20rpx;">
|
|
|
+ <text>{{index + 1}}</text>
|
|
|
+ </view>
|
|
|
+ <view class=" flex align-center "
|
|
|
+ style="background-color: #FFFFFF;border-radius: 20rpx;height: 200rpx;width: 95%;">
|
|
|
+ <u-image width="190" height="190" border-radius="10" :src="item.imgUrl"></u-image>
|
|
|
+ <view class="flex justify-between container" style="width: 100%;">
|
|
|
+ <view class="left" style="width: 95%;">
|
|
|
+ <view class="flex" style="padding-top: 20rpx;width: 430rpx;">
|
|
|
+ <view class="cu-tag sm bg-red light radius">
|
|
|
+ 编号:{{item.productNo}}
|
|
|
+ </view>
|
|
|
+ <view class="name text-cut-1" style="font-size: 28rpx;font-weight: 600;">
|
|
|
+ {{item.title}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="padding-top-20 text-sm center"
|
|
|
+ style="color: #888888;justify-content: flex-start">
|
|
|
+ <u-avatar :src="item.userImg?item.userImg:'/static/icon/unlogin.png'" size="56">
|
|
|
+ </u-avatar>
|
|
|
+ <text class="margin-left-10">{{item.username || '暂无信息'}}</text>
|
|
|
+ </view>
|
|
|
+ <view class="flex justify-between">
|
|
|
+ <view class="hot-value center" style="justify-content: flex-start;">
|
|
|
+ <image src="../../static/rank/hot.png" style="width: 36rpx;height: 36rpx;"
|
|
|
+ mode=""></image>
|
|
|
+ <text>{{item.voteCount}}</text>
|
|
|
+ </view>
|
|
|
+ <button @click.stop="$jump('/pages/activity/activityDetail?id='+item.id+'&isCustomBack=false')"
|
|
|
+ class="cu-btn round bg-base sm text-white"
|
|
|
+ style="padding: 20rpx 38rpx;margin-bottom: 30rpx;">
|
|
|
+ <text>去投票</text>
|
|
|
+ </button>
|
|
|
</view>
|
|
|
- <button
|
|
|
- @click.stop="$jump('/pages/activity/activityDetail?id='+item.id)"
|
|
|
- class="cu-btn round bg-base sm text-white"
|
|
|
- style="padding: 20rpx 38rpx;margin-bottom: 30rpx;">
|
|
|
- <text>去投票</text>
|
|
|
- </button>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- </view>
|
|
|
- </block>
|
|
|
+ </block>
|
|
|
+ </mescroll-body>
|
|
|
+
|
|
|
+
|
|
|
</view>
|
|
|
|
|
|
<loading ref="loading" type="3" theme="2" />
|
|
|
@@ -96,13 +117,22 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+ import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
|
|
|
import back from '@/components/back.vue'
|
|
|
export default {
|
|
|
- components:{
|
|
|
+ mixins: [MescrollMixin],
|
|
|
+ components: {
|
|
|
back
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
+ downOption:{
|
|
|
+ auto:false
|
|
|
+ },
|
|
|
+ upOption:{
|
|
|
+ use:false
|
|
|
+ },
|
|
|
+
|
|
|
loading: true,
|
|
|
navbarShow: false,
|
|
|
rankList: [],
|
|
|
@@ -140,13 +170,28 @@
|
|
|
this.getList(0);
|
|
|
},
|
|
|
methods: {
|
|
|
- getList(page){
|
|
|
- const { defaultActiveId:activeId ,rankTotal }= this.$store.state['vuex_active_setting'];
|
|
|
- this.$api.activity.getWorksList({ activeId , start: page,end: page+rankTotal }).then(res => {
|
|
|
- this.rankList.push(...res.data.data);
|
|
|
- });
|
|
|
+ downCallback(mescroll){
|
|
|
+ setTimeout(async ()=>{
|
|
|
+ await this.getList(0)
|
|
|
+ mescroll.endSuccess(this.rankList.length);
|
|
|
+ },1000)
|
|
|
+ },
|
|
|
+ upCallback(mescroll) {
|
|
|
+ console.log(mescroll);
|
|
|
+ },
|
|
|
+ async getList(page) {
|
|
|
+ const {
|
|
|
+ defaultActiveId: activeId,
|
|
|
+ rankTotal
|
|
|
+ } = this.$store.state['vuex_active_setting'];
|
|
|
+ let res=await this.$api.activity.getWorksList({
|
|
|
+ activeId,
|
|
|
+ start: page,
|
|
|
+ end: page + rankTotal
|
|
|
+ })
|
|
|
+ this.rankList=res.data.data
|
|
|
},
|
|
|
- searchWorks(value){
|
|
|
+ searchWorks(value) {
|
|
|
this.$api.activity.searchWork(value).then(res => {
|
|
|
this.rankList = res.data.data;
|
|
|
})
|
|
|
@@ -198,7 +243,6 @@
|
|
|
padding-left: 20upx;
|
|
|
|
|
|
.name {
|
|
|
- padding-top: 30rpx;
|
|
|
font-size: 32upx;
|
|
|
font-family: PingFang SC;
|
|
|
font-weight: 800;
|