index.vue
3.59 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
<template>
<view class="pb50">
<view style="padding:0 30rpx;">
<uni-segmented-control :current="current" :values="items" @clickItem="onClickItem" styleType="button" activeColor="#15CFAB"></uni-segmented-control>
</view>
<view>
<view class="active" v-for="(item, index) in showList" :key="index" @click="goDetail(item)">
<swiper class="activeSwiper" circular :autoplay="autoplay">
<swiper-item v-for="(pic,index) in item.photos?.split(',')" :key="index">
<image class="cover" mode="aspectFill" :src="pic"></image>
</swiper-item>
</swiper>
<view class="name">{{item.name}}</view>
<view class="pp" style="display: flex;">培训时间：{{item.trainStart.substring(0, 10)}} — {{item.trainEnd.substring(0, 10)}}</view>
<view class="pp" style="display: flex;">报道时间：{{item.reportDate.substring(0, 10)}}</view>
<view class="pp" style="display: flex;">主办单位：{{item.organizer}}</view>
<view class="pp" style="display: flex;">承办单位：{{item.address}}</view>
<view class="pp" style="display: flex;">培训地点：{{item.address}}</view>
<button class="btn btn1">点击进入</button>
</view>
</view>
</view>
<view class="nodata" v-if="showList.length==0">
<image mode="aspectFit" src="/static/nodata.png"></image>
<text> 暂无活动</text>
</view>
</template>
<script setup>
import { reactive, toRefs, getCurrentInstance } from 'vue';
import * as hotel from '@/common/hotel.js';
import {onShow,onShareAppMessage,onShareTimeline,onPullDownRefresh} from '@dcloudio/uni-app';
import _ from 'lodash';
const app = getApp();
const { proxy } = getCurrentInstance();
const data = reactive({
showList: [],
list: [],
list0: [],
list1: [],
query: {},
autoplay:true,
items: ['全部', '进行中', '已过期'],
current: 1
});
const { showList,list,list0,list1,query,autoplay,items,current } = toRefs(data);
onShow(option =>{
if (app.globalData.isLogin) {
getList();
} else {
app.firstLoadCallback = () => {
getList();
};
}
})
onPullDownRefresh(() => {
getList();
});
function getList(){
list0.value = []
list1.value = []
hotel.getTrainList().then(res => {
list.value = res.rows
for(var n of list.value){
if(n.status == 0){
list0.value.push(n)
}
if(n.status == 1){
list1.value.push(n)
}
}
getShowList(current.value)
});
}
function goDetail(item){
let path = `/pages_hotel/hotel/detail?id=${item.trainId}`;
uni.navigateTo({
url: path
});
}
function onClickItem(e){
if(current.value != e.currentIndex){
current.value = e.currentIndex
}
getShowList(e.currentIndex)
}
function getShowList(n){
switch (n){
case 0:
showList.value = list.value
break;
case 1:
showList.value = list0.value
break;
case 2:
showList.value = list1.value
break;
}
}
</script>
<style lang="scss" scoped>
.iconSquera{width: 40rpx;height: 40rpx;}
.topSearch{ display: flex; align-items: center;background: #fff;}
.active{background:#fff;width: 700rpx;margin:30rpx auto 30rpx;box-shadow: 0rpx 0rpx 27rpx 0rpx #DEDEDE;
border-radius:20rpx 20rpx;position: relative;padding: 0 0 30rpx;
.cover{width: 700rpx;height: 320rpx;}
.name{font-size: 32rpx;padding:10rpx 15rpx 0;
color: #000000;}
.pp{padding:0 15rpx;margin: 6rpx 0;
color: #595959;
font-size: 28rpx;}
.btn1{position: absolute; right: 20rpx; bottom: 20rpx; width: 200rpx; line-height: 30px; height: 60rpx; font-size: 30rpx;}
}
.activeSwiper{height: 320rpx;}
.myEnter{position: fixed;right: 0;bottom: 10%;
image{width: 150rpx;height: 150rpx;}
}
.pb50{padding-bottom: 50rpx;}
</style>