.showView{ | .showView{ | ||||
position: relative; | position: relative; | ||||
height: calc(100vh - 153rpx); | height: calc(100vh - 153rpx); | ||||
background-color: #ffffff | |||||
background-color: #ffffff; | |||||
overflow: scroll; | |||||
} | } |
*/ | */ | ||||
data: { | data: { | ||||
imgUrl: app.globalData.urlStatic,//图片路径 | imgUrl: app.globalData.urlStatic,//图片路径 | ||||
maskShow: true, | |||||
taskShow: true, | |||||
maskShow: false, | |||||
taskShow: false, | |||||
taskName:'集齐启辰星【大灯】碎片', | taskName:'集齐启辰星【大灯】碎片', | ||||
taskImgUrl:'https://www.jiyou-tech.com/2020/496_qichen/static/star/everyday/taskImg1.png', | taskImgUrl:'https://www.jiyou-tech.com/2020/496_qichen/static/star/everyday/taskImg1.png', | ||||
isSign:true, | isSign:true, | ||||
isShare:false, | isShare:false, | ||||
picturlList: ['picturePuzzle1', 'picturePuzzle1','picturePuzzle1'], | |||||
picturlCurrent:0, | |||||
}, | }, | ||||
/** | /** | ||||
* 关闭任务窗 | * 关闭任务窗 | ||||
isShare: true | isShare: true | ||||
}) | }) | ||||
}, | }, | ||||
/** | |||||
* 下个碎片 | |||||
*/ | |||||
nextPicturl(){ | |||||
var max = this.data.picturlList.length-1; | |||||
var current = this.data.picturlCurrent + 1; | |||||
if (current <= max){ | |||||
this.setData({ | |||||
picturlCurrent: current | |||||
}) | |||||
} | |||||
}, | |||||
//上一个碎片 | |||||
prevPicturl(){ | |||||
var current = this.data.picturlCurrent - 1; | |||||
if (current >= 0) { | |||||
this.setData({ | |||||
picturlCurrent: current | |||||
}) | |||||
} | |||||
}, | |||||
/** | /** | ||||
* 生命周期函数--监听页面加载 | * 生命周期函数--监听页面加载 |
{ | { | ||||
"usingComponents": {} | |||||
"usingComponents": { | |||||
"tabBar": "../component/tabBar/index" | |||||
} | |||||
} | } |
<view class="centerTitle">外观模块</view> | <view class="centerTitle">外观模块</view> | ||||
<view class="rightTitle">内饰</view> | <view class="rightTitle">内饰</view> | ||||
</view> | </view> | ||||
<view class="swiperBox"> | |||||
<swiper current="{{picturlCurrent}}"> | |||||
<block wx:for="{{picturlList}}" wx:key="*this"> | |||||
<swiper-item> | |||||
<view class="fragmentBox"> | |||||
<image class="fragmentComplete" src="{{imgUrl+'/star/everyday/'+item+'.png'}}"></image> | |||||
</view> | |||||
</swiper-item> | |||||
</block> | |||||
</swiper> | |||||
<image class="arrowBtn" style="left:-30rpx;" src="{{imgUrl+'/star/everyday/arrowLeftBtn.png'}}" bindtap="prevPicturl"></image> | |||||
<image class="arrowBtn" style="right:-30rpx;" src="{{imgUrl+'/star/everyday/arrowRightBtn.png'}}" bindtap="nextPicturl"></image> | |||||
</view> | |||||
<view class="btnBox"> | |||||
<view class="btn" style="margin-right:20rpx;">星探任务</view> | |||||
<view class="btn select" style="margin-left:20rpx;">每日任务</view> | |||||
</view> | |||||
<view class="mask" wx:if="{{maskShow}}"> | <view class="mask" wx:if="{{maskShow}}"> | ||||
<view class="taskBox" wx:if="{{taskShow}}"> | <view class="taskBox" wx:if="{{taskShow}}"> | ||||
<text class="closeBtn" style="right:-35rpx;top:-50rpx;" bindtap="hiddenTask"></text> | <text class="closeBtn" style="right:-35rpx;top:-50rpx;" bindtap="hiddenTask"></text> | ||||
</view> | </view> | ||||
</view> | </view> | ||||
</view> | </view> | ||||
</view> | |||||
</view> | |||||
<tabBar></tabBar> |
height: 38rpx; | height: 38rpx; | ||||
line-height: 38rpx; | line-height: 38rpx; | ||||
} | } | ||||
.swiperBox{ | |||||
position: relative; | |||||
width: 615rpx; | |||||
height: 424rpx; | |||||
margin: 24rpx auto 0 auto; | |||||
} | |||||
.swiperBox>swiper{ | |||||
width: 100%; | |||||
height: 100%; | |||||
} | |||||
.swiperBox>.arrowBtn{ | |||||
position: absolute; | |||||
width: 13rpx; | |||||
height: 29rpx; | |||||
top: 50%; | |||||
transform: translateY(-50%); | |||||
} | |||||
.fragmentBox{ | |||||
position: relative; | |||||
width: 100%; | |||||
height: 100%; | |||||
border-radius: 26rpx; | |||||
} | |||||
.fragmentBox>.fragmentComplete{ | |||||
width: 100%; | |||||
height: 100%; | |||||
} | |||||
.btnBox{ | |||||
position: relative; | |||||
width: 615rpx; | |||||
height: 49rpx; | |||||
text-align: center; | |||||
margin: 48rpx auto 0 auto; | |||||
} | |||||
.btnBox>.btn{ | |||||
display: inline-block; | |||||
width: 279rpx; | |||||
height: 100%; | |||||
line-height: 49rpx; | |||||
text-align: center; | |||||
border: 1rpx solid #345489; | |||||
box-sizing: border-box; | |||||
font-size: 21rpx; | |||||
color: #333333; | |||||
border-radius: 15rpx; | |||||
} | |||||
.btnBox>.btn.select{ | |||||
background-color: #345489; | |||||
color: #ffffff; | |||||
} | |||||
.mask { | .mask { | ||||
position: absolute; | position: absolute; |
{ | { | ||||
"usingComponents": {} | |||||
"usingComponents": { | |||||
"tabBar": "../component/tabBar/index" | |||||
} | |||||
} | } |
<text class="closeBtn" style="right:-40rpx;top:-45rpx;" bindtap="hiddenRule"></text> | <text class="closeBtn" style="right:-40rpx;top:-45rpx;" bindtap="hiddenRule"></text> | ||||
</view> | </view> | ||||
</view> | </view> | ||||
</view> | |||||
</view> | |||||
<tabBar></tabBar> |