|
|
@@ -1,172 +1,20 @@
|
|
|
-<template>
|
|
|
- <view :style="vuex_skin">
|
|
|
- <view style="padding: 30rpx 30rpx 10rpx;">
|
|
|
- <u-swiper :list="swiperList" border-radius="12" height="300"></u-swiper>
|
|
|
- </view>
|
|
|
- <view class="">
|
|
|
- <view class="cu-list grid col-4 no-border" style="border-radius:20rpx ;">
|
|
|
- <view class="cu-item" @click.stop="$jump(item.path)" v-for="(item,index) in gridList"
|
|
|
- :key="index">
|
|
|
- <view class="grid-icon">
|
|
|
- <image style="width: 88rpx;height: 88rpx;" :src="item.icon" />
|
|
|
- </view>
|
|
|
- <text style="color: #222222;font-size: 26rpx;">{{item.name}}</text>
|
|
|
- <view class="cu-tag bg-red badge" v-if="item.count>0">{{item.count}}</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="" style="height: 20rpx;background-color: #f8f8f8"></view>
|
|
|
- <view style="padding: 30rpx 30rpx 0">
|
|
|
- <u-search placeholder="搜索关键词或编号" height="70" @search="searchWorks" v-model="keyword" :show-action="false"></u-search>
|
|
|
- </view>
|
|
|
- <view class="padding-30">
|
|
|
- <view class="text-bold" style="font-size: 34rpx;">
|
|
|
- {{vuex_page_interface_show.indexTitle}}
|
|
|
- </view>
|
|
|
- <view @click="$jump('/pages/activity/activityDetail?id='+item.id)" class="card shadow" v-for="(item,index) in worksList" :key="item.id">
|
|
|
- <view v-if="index==0" class="center bg-img rank-tag" style="background-image: url(../../static/icon/ph1.png)">
|
|
|
- <text>1</text>
|
|
|
- </view>
|
|
|
- <view v-if="index==1" class="center bg-img rank-tag" style="background-image: url(../../static/icon/ph2.png)">
|
|
|
- <text>2</text>
|
|
|
- </view>
|
|
|
- <view v-if="index==2" class="center bg-img rank-tag" style="background-image: url(../../static/icon/ph3.png)">
|
|
|
- <text>3</text>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="left">
|
|
|
- <image :src="item.imgUrl" mode=""></image>
|
|
|
- </view>
|
|
|
- <view class="right">
|
|
|
- <view class="flex-direction flex">
|
|
|
- <text class="title">{{item.title}}</text>
|
|
|
- <rich-text class="desc text-cut-2" :nodes="decodeURIComponent(item.content)"></rich-text>
|
|
|
- </view>
|
|
|
- <view class="bottom">
|
|
|
- <view class="flex margin-top-10">
|
|
|
- <image class="center" style="width: 30rpx;height: 30rpx;" src="../../static/icon/remen.png">
|
|
|
- </image>
|
|
|
- <text style="color: #353535;margin-left: 6rpx;font-size:28rpx;">{{item.voteCount}}</text>
|
|
|
- </view>
|
|
|
- <view class="cu-btn round sm line-base">
|
|
|
- 去助力
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
+<template></template>
|
|
|
<script>
|
|
|
export default {
|
|
|
- name: '',
|
|
|
- async mounted() {
|
|
|
- console.log(2);
|
|
|
- await this.initWorksList();
|
|
|
+ async onLoad(props) {
|
|
|
+ const { path } = props;
|
|
|
+ await this.initParams();
|
|
|
+ this.$jump( path || '/pages/index/home');
|
|
|
},
|
|
|
+
|
|
|
methods :{
|
|
|
- async initWorksList(){
|
|
|
- const { defaultActiveId:activeId }= this.$store.state['vuex_active_setting'];
|
|
|
- this.$api.activity.getWorksList({ activeId }).then(res => {
|
|
|
- this.worksList = res.data.data;
|
|
|
- });
|
|
|
- },
|
|
|
- searchWorks(value){
|
|
|
- this.$api.activity.searchWork(value).then(res => {
|
|
|
- this.worksList = res.data.data;
|
|
|
- })
|
|
|
+ async initParams(){
|
|
|
+ const {ACTIVE_SETTING,PAGE_INTERFACE_SHOW} = (await this.$api.platform.getPlatformParams({
|
|
|
+ keys: 'ACTIVE_SETTING,PAGE_INTERFACE_SHOW'
|
|
|
+ })).data.data;
|
|
|
+ this.$u.vuex('vuex_active_setting', JSON.parse(ACTIVE_SETTING));
|
|
|
+ this.$u.vuex('vuex_page_interface_show', JSON.parse(PAGE_INTERFACE_SHOW));
|
|
|
}
|
|
|
},
|
|
|
- data() {
|
|
|
- return {
|
|
|
- worksList: [],
|
|
|
- swiperList: ['https://guosen-bucket-ldt.obs.cn-south-1.myhuaweicloud.com:443/70c8b355db774f85ab9f8d4f6289df69-banner.jpg'],
|
|
|
- gridList: [{
|
|
|
- icon: '/static/grid/jieshao.png',
|
|
|
- name: "活动介绍",
|
|
|
- path:"/pages/introduce/introduce"
|
|
|
- }, {
|
|
|
- icon: '/static/grid/baoming.png',
|
|
|
- name: "我要代言",
|
|
|
- },
|
|
|
- {
|
|
|
- icon: '/static/grid/rank.png',
|
|
|
- name: "排行榜",
|
|
|
- path:"/pages/rank/rank"
|
|
|
- },
|
|
|
- {
|
|
|
- icon: '/static/grid/more.png',
|
|
|
- name: "更多活动",
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
- }
|
|
|
};
|
|
|
-</script>
|
|
|
-
|
|
|
-<style>
|
|
|
- page {
|
|
|
- background-color: #FFFFFF;
|
|
|
- }
|
|
|
-</style>
|
|
|
-
|
|
|
-<style lang="scss" scoped>
|
|
|
- .shadow {
|
|
|
- box-shadow: #f8f8f8 0px 0px 10rpx 10rpx
|
|
|
- }
|
|
|
-
|
|
|
- .rank-tag {
|
|
|
- color: #FFFFFF;
|
|
|
- width: 40rpx;
|
|
|
- height: 46rpx;
|
|
|
- position: absolute;
|
|
|
- left: 10rpx;
|
|
|
- top: 0rpx;
|
|
|
- z-index: 999;
|
|
|
- }
|
|
|
- .card {
|
|
|
- position: relative;
|
|
|
- margin-top: 30rpx;
|
|
|
- border-radius: 10rpx;
|
|
|
- padding: 15rpx;
|
|
|
- display: flex;
|
|
|
-
|
|
|
- .left {
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- image {
|
|
|
- width: 210rpx;
|
|
|
- height: 210rpx;
|
|
|
- border-radius: 10rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .right {
|
|
|
- margin-left: 20rpx;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: space-between;
|
|
|
-
|
|
|
- .title {
|
|
|
- font-weight: 800;
|
|
|
- color: #353535;
|
|
|
- font-size: 32rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .desc {
|
|
|
- color: #888888;
|
|
|
- line-height: 40rpx;
|
|
|
- padding-top: 20rpx;
|
|
|
- font-size: 26rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .bottom {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-</style>
|
|
|
+</script>
|
lianghanqiang