game/src/components/invite-view.wpy
2019-03-26 14:49:37 +08:00

108 lines
2.4 KiB
Plaintext

<style lang="less">
.invite-view {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 3;
}
.invite-view .background {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #000000;
opacity: 0.6;
}
.invite-view .invite-main {
position: absolute;
width: 100%;
height: 700rpx;
left: 0;
top: 50%;
margin-top: -350rpx;
}
.invite-view .invite-main .main-back-img {
position: absolute;
top: 0;
left: 35rpx;
width: 680rpx;
height: 700rpx
}
.invite-view .invite-main .main-content {
position: absolute;
height: 372rpx;
left: 86rpx;
width: 578rpx;
bottom: 43rpx;
}
.invite-view .invite-main .main-content .main-scroll {
white-space: nowrap;
display: flex;
flex-flow: row;
flex-direction: row;
height: 100%;
width: 520rpx;
margin-left: 29rpx;
}
.invite-view .invite-main .main-content .main-scroll .one-btn {
display: inline-block;
margin-right: 20rpx;
}
.invite-view .invite-main .main-close-btn {
position: absolute;
width: 40px;
height: 40px;
right: 10px;
top: 0;
}
</style>
<template>
<view class="invite-view {{ config.hide ? 'hidden' : ''}}">
<view class="background" @tap="hideMe"></view>
<view class="invite-main">
<image class="main-back-img" src="{{backImg}}"></image>
<view class="main-close-btn" @tap="hideMe"></view>
<view class="main-content">
<scroll-view class="main-scroll" scroll-x="true">
<repeat for="{{btnList}}" item="b">
<view class="one-btn">
<inviteBtn :btnObj.sync="b" @inviteBtnClick.user="inviteBtnClick"></inviteBtn>
</view>
</repeat>
</scroll-view>
</view>
</view>
</view>
</template>
<script>
import wepy from 'wepy'
import images from '../common/images';
import inviteBtn from './one-invite-btn';
export default class InviteView extends wepy.component {
props = {
config: {
hide: true,
},
btnList: []
}
components = {
inviteBtn: inviteBtn
};
data = {
backImg: images.invite_back,
}
methods = {
hideMe: function() {
this.$emit('needHideMe')
},
inviteBtnClick: function(index) {
this.$emit('inviteBtnClick', index);
}
};
}
</script>