<template> <view class="box" style="position: relative;"> <image @click="back" class="bg_back" src="https://lihai001.oss-cn-chengdu.aliyuncs.com/public/uploads/new_activity/back.png"></image> <view class="li" @click="navSw('/pages/index/index')"> <u--image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/edf53202401271436507555.png" width="690rpx" height="200rpx" style="position: absolute;" /> <view class="btn"> 我是居民用户 </view> </view> <view class="li" style="margin-top: 50rpx;" @click="navgo('/pages/helpPeople/formTable')"> <u--image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/8489c202401271437055619.png" width="690rpx" height="200rpx" style="position: absolute;" /> <view class="btn"> 我是农民用户 </view> </view> </view> </template> <script> export default { methods: { back() { uni.navigateBack(); }, navgo(url) { uni.navigateTo({ url }) }, navSw(url) { uni.switchTab({ url: url }) } } } </script> <style lang='scss' scoped> .box { width: 750rpx; height: 1624rpx; background-image: url('https://lihai001.oss-cn-chengdu.aliyuncs.com/def/9c4b4202401271437449183.png'); background-size: 100% 100%; padding-top: 500rpx; } .li { margin: 0rpx auto; width: 690rpx; height: 200rpx; background-size: 100% 100%; position: relative; .btn { z-index: 999; position: absolute; width: 287rpx; height: 76rpx; border-radius: 40rpx 40rpx 40rpx 40rpx; opacity: 1; border: 2rpx solid #FF5E0C; text-align: center; line-height: 76rpx; color: #FF5E0C; font-size: 34rpx; right: 50rpx; bottom: 50rpx; } } .bg_back { height: 34rpx; width: 20rpx; position: absolute; top: calc(var(--status-bar-height) + 30rpx); left: 30rpx; } </style>