227 lines
4.9 KiB
Vue
227 lines
4.9 KiB
Vue
<template>
|
|
<view class="wrap">
|
|
<uni-nav-bar @clickLeft="goBack()" height="110upx" leftWidth="200upx" leftText="考试列表" leftIcon="left" border
|
|
backgroundColor="#2cade8" color="#fff" fixed statusBar shadow></uni-nav-bar>
|
|
<view class="my-top-search-nav">
|
|
<!-- 主体 导航栏 -->
|
|
<view class="tabbar-title">
|
|
<view :class="{'text-title':true, 'active':type==='attend'}" @click="changeList('attend')">可参与</view>
|
|
<view :class="{'text-title':true, 'active':type==='my'}" @click="changeList('my')">我的</view>
|
|
</view>
|
|
</view>
|
|
<view class="content" v-if="examList.length>0">
|
|
<view class="item-wrap" v-for="(item,index) in examList" :key="item.id">
|
|
<view class="duty-item">
|
|
<view class="top-info">
|
|
<view class="info-title">{{item.name}}-{{item.paper_name}}</view>
|
|
</view>
|
|
<view class="center-info">
|
|
<view class="info-details">试卷总分：{{item.paper_total_score}} </view>
|
|
<view class="info-details">合格分数：{{item.paper_pass_score}} </view>
|
|
<view class="info-details">开启时间：{{item.open_time}} </view>
|
|
<view class="info-details">结束时间：{{item.close_time}} </view>
|
|
<view class="info-details">考试机会：{{item.chance}} </view>
|
|
</view>
|
|
<view class="bottom-btns" v-if="type === 'attend'">
|
|
<u-button v-if="tabIndex==0" class="bottom-btn" type="primary" @click="attendExam(item)">我要参加</u-button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view v-if="isBottom" class="bottomText"> 已经到底了</view>
|
|
</view>
|
|
<view class="content" v-else>
|
|
<view style="text-align: center;"> 暂无数据</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'ticket',
|
|
data() {
|
|
return {
|
|
params: {
|
|
can_attend:true,
|
|
is_my:true,
|
|
page:1
|
|
},
|
|
tabBars:[
|
|
{name:'可参与',
|
|
id:'attend'},
|
|
{name:'我的',
|
|
id:'my'},
|
|
],
|
|
type:'attend',
|
|
examList: [],
|
|
tabIndex:0,
|
|
isLoading: false,
|
|
refreshText: "",
|
|
loadingText: '加载中...',
|
|
isBottom:false,
|
|
}
|
|
},
|
|
// onLoad(params) {
|
|
// setTimeout(()=>{
|
|
// this.getExamList('attend');
|
|
// },350)
|
|
// },
|
|
//上拉加载
|
|
onReachBottom() {
|
|
if (this.isBottom) {} else {
|
|
this.params.page += 1;
|
|
this.getexamList(this.type);
|
|
}
|
|
},
|
|
onShow() {
|
|
this.examList = [];
|
|
this.getExamList();
|
|
},
|
|
//下拉刷新
|
|
onPullDownRefresh() {
|
|
this.params.page = 1;
|
|
this.examList = [];
|
|
this.getExamList();
|
|
},
|
|
methods: {
|
|
getExamList(type) {
|
|
let that = this;
|
|
if(type=='attend'){
|
|
that.params.can_attend = true;
|
|
}else{
|
|
that.params.can_attend = false;
|
|
}
|
|
that.isLoading = true;
|
|
|
|
that.$u.api.getExamList(that.query).then(res=>{
|
|
console.log(res)
|
|
if(res.results&&res.results.length>0){
|
|
that.isBottom = false;
|
|
console.log('有数据')
|
|
that.examList = that.examList.concat(res.results)
|
|
}
|
|
}).catch(()=>{
|
|
console.log('没有数据')
|
|
that.isBottom = true;
|
|
})
|
|
},
|
|
changeList(index) {
|
|
// debugger;
|
|
this.type = index;
|
|
this.examList = [];
|
|
this.params.page = 1;
|
|
if (index === 'attend') {
|
|
this.params.can_attend = true;
|
|
} else if (index === 'my') {
|
|
this.params.can_attend = false;
|
|
}
|
|
this.getExamList(index);
|
|
|
|
},
|
|
//参加考试
|
|
attendExam(val){
|
|
console.log('currentExam',val)
|
|
uni.setStorageSync('currentExam', val)
|
|
uni.navigateTo({
|
|
url:"/pages/exam/preview"
|
|
})
|
|
},
|
|
|
|
goBack() {
|
|
uni.navigateBack({
|
|
delta: 1
|
|
})
|
|
},
|
|
searchHandle() {
|
|
this.params.page = 1;
|
|
this.examList = [];
|
|
this.getExamList()
|
|
},
|
|
resetSearch() {
|
|
this.params.page = 1;
|
|
this.params.search = "";
|
|
this.examList = [];
|
|
this.getExamList();
|
|
},
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.empty-view {
|
|
height: 120upx;
|
|
}
|
|
|
|
>>>.uni-navbar__header,
|
|
>>>.uni-status-bar{
|
|
background-image: linear-gradient(270deg,
|
|
#0ca7ee 0%,
|
|
#005aff 100%,
|
|
#2a8cff 100%,
|
|
#54bdff 100%),
|
|
linear-gradient(#e60012,
|
|
#e60012);
|
|
}
|
|
page{
|
|
height: 100%;
|
|
}
|
|
.wrap{
|
|
height: 100%;
|
|
background-color: #f3fbff;
|
|
}
|
|
.content {
|
|
padding: 14upx;
|
|
padding-top: 120upx;
|
|
}
|
|
|
|
.item-wrap {
|
|
margin-bottom: 14upx;
|
|
}
|
|
|
|
.duty-item {
|
|
width: 720upx;
|
|
background-color: #ffffff;
|
|
border-radius: 10upx;
|
|
margin: 0 auto;
|
|
padding: 24upx 21upx;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.info-title {
|
|
font-family: PingFang-SC-Medium;
|
|
font-size: 30upx;
|
|
line-height: 72upx;
|
|
color: #3d3d3d;
|
|
flex: 1;
|
|
border-bottom: 1upx solid #efefef;
|
|
margin-bottom: 10upx;
|
|
}
|
|
|
|
|
|
.info-details {
|
|
font-size: 28upx;
|
|
line-height: 50upx;
|
|
color: #5b5b5b;
|
|
}
|
|
|
|
.bottom-btns {
|
|
text-align: center;
|
|
font-family: PingFang-SC-Medium;
|
|
font-size: 28upx;
|
|
line-height: 83upx;
|
|
display: flex;
|
|
}
|
|
|
|
.bottom-btn {
|
|
flex: 1;
|
|
width: 50%;
|
|
margin: 20upx 25vw 0 25vw;
|
|
border-right: 1upx solid #eeeeee;
|
|
}
|
|
.bottomText{
|
|
font-size: 20upx;
|
|
text-align: center;
|
|
height: 50upx;
|
|
}
|
|
</style>
|