You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
<template> <view class="app-container" style="background-color: #ededed;"> <view class="pam-content"> <view class="pam-shop"> <view class="pam-mess"> <view class="picon"> <img src="../../static/page/people.png" style="width: 110rpx;height: 110rpx;" alt="" srcset="" /> </view> <view class="pam-address"> <view class="pname"> 付款给李姐烧烤(普罗旺斯店) </view> <view class="paddre"> 广西南宁市江南区波尔多庄园2-109号商铺 </view> </view> </view> <view class="pam-local"> <img src="../../static/page/location.png" style="width: 30rpx;height: 36rpx;" alt="" srcset="" /> </view>
</view> <view class="pam-main"> <view class="pm-title"> 付款金额(元) </view> <view class="pm-write"> <view class="font"> ¥ </view> <view class="num"> <input type="text" class="pr-num" placeholder="请输入金额" placeholder-style="color: #cfcfcf;" /> </view> </view> <view class="pfooter u-border-top"> 向商家询问支付金额 </view> </view> <view class="pac-cont"> <view class="pac-left"> <view class="pcfont"> 支付金额给商户 </view> <view class="pcline">
</view> <view class="pc-aplay"> 支付宝支付 </view> </view> <view class="pac-link"> 查看活动规则 </view> </view> </view> </view></template>
<script>export default { data() { return {
} }, methods: {
}}</script>
<style lang="scss">.uni-page-body { background: #ededed;}
.pam-content { padding-top: 100rpx; padding-left: 30rpx; padding-right: 30rpx;
.pam-shop { display: flex; justify-content: space-between;
.pam-mess { display: flex; height: 110rpx;
.picon { width: 110rpx; height: 110rpx; }
.pam-address { margin-left: 20rpx;
.pname { margin-top: 15rpx; color: #454545; font-size: 16px; line-height: 1.5; font-weight: bold; }
.paddre { margin-top: 5rpx; color: #666; font-size: 12px; line-height: 1.5; } } }
.pam-local { width: 30rpx; height: 36rpx; margin-top: 60rpx; } }
.pam-main { margin-top: 97rpx; padding-top: 30rpx; height: 380rpx; background: #fff; box-sizing: border-box;
.pm-title { padding-left: 40rpx; color: #454545; font-size: 15px; line-height: 1.5; }
.pfooter { margin-top: 60rpx; padding-left: 40rpx; padding-top: 40rpx; color: #666; font-size: 12px; line-height: 1.5; }
.u-border-bottom, .u-border-top { border-color: #eee !important; }
.pm-write { display: flex; height: 60rpx; padding-left: 40rpx; margin-top: 70rpx;
.font { height: 60rpx; line-height: 60rpx; font-size: 15px; color: #454545; font-weight: bold; }
.num { margin-left: 20rpx; line-height: 60rpx; height: 60rpx;
.pr-num { font-size: 30px; line-height: 60rpx; min-height: 60rpx; height: 60rpx; color: #454545; } } } }
.pac-cont { display: flex; justify-content: space-between; align-items: center; margin-top: 30rpx;
.pac-left { display: flex;
.pcfont { font-size: 12px; color: #666; height: 30rpx; line-height: 30rpx; }
.pcline { height: 28rpx; width: 2rpx; margin-left: 20rpx; background: #ccc; }
.pc-aplay { padding-left: 40rpx; margin-left: 20rpx; font-size: 12px; height: 30rpx; line-height: 30rpx; color: #999; background: url(../../static/page/aplay.png) no-repeat left center; background-size: 30rpx 30rpx; } }
.pac-link { color: #1783FF; font-size: 12px; height: 30rpx; line-height: 30rpx; cursor: pointer; } }}</style>
|