123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110 |
- <template>
- <view class="step1">
- <view class="step1-from">
- <view class="title">填写邀请码</view>
- <view class="input-item" style="margin-top: 180upx;">
- <input type="text" placeholder="请输入邀请码" v-model="invite_code">
- <view class="scan">
- <image src="../../static/images/scan.png" mode="scaleToFill" style="width: 46upx;height: 45upx;"></image>
- </view>
- </view>
- <view class="button-item" style="margin-top: 220upx;">
- <navigator :url="'/pages/register/step2?invite_code='+invite_code" open-type="navigate">
- <button class="next">下一步</button>
- </navigator>
- </view>
- </view>
- </view>
- </template>
- <script>
- export default {
- data() {
- return {
- invite_code:""
- }
- },
- methods: {
- }
- }
- </script>
- <style lang="scss" scoped>
- .step1 {
- background: $primary-color;
- height: 100vh;
- width: 750rpx;
- overflow: hidden;
- }
- .step1-from {
- margin: auto;
- width: 600upx;
- height: 700upx;
- background-color: white;
- border-radius: 20rpx;
- padding: 72upx;
- padding-top: 40upx;
- box-sizing: border-box;
- position: relative;
- z-index: 2;
- margin-top: 200upx;
- &::after {
- content: "";
- background: url(../../static/images/login/box-bottom.png) no-repeat;
- background-size: contain;
- width: 564upx;
- height: 30upx;
- display: block;
- position: absolute;
- bottom: -30upx;
- left: 18upx;
- z-index: -1;
- }
- .title {
- font-size: 30upx;
- color: #999999;
- font-weight: bold;
- text-align: center;
- margin-bottom: 80upx;
- }
- }
- .input-item {
- display: flex;
- position: relative;
- margin-bottom: 30upx;
- border-bottom: 2upx solid $primary-color;
- .scan {
- position: absolute;
- top: 0;
- right: 0;
- }
- input {
- flex-grow: 1;
- font-size: 30upx;
- text-align: center;
- padding: 5upx 55upx;
- }
- }
- .next {
- height: 80upx;
- border: 2upx solid $primary-color;
- line-height: 80upx;
- margin: 30upx 0;
- font-size: 32upx;
- background: $primary-color;
- color: white;
- &::after {
- border: none;
- }
- }
- </style>
|