Browse Source

扫码支付页面--数字键盘内容提交

master
W夏日 2 years ago
parent
commit
3635e27883
  1. 139
      agentApp/pages/payment/payment.vue
  2. BIN
      agentApp/static/page/del.png

139
agentApp/pages/payment/payment.vue

@ -52,6 +52,55 @@
查看活动规则 查看活动规则
</view> </view>
</view> </view>
<view class="pac-list">
<view class="pl-left">
<view class="pleft-num">
<button class="p-num">
1
</button>
<button class="p-num">
2
</button>
<button class="p-num">
3
</button>
<button class="p-num p-mar">
4
</button>
<button class="p-num p-mar">
5
</button>
<button class="p-num p-mar">
6
</button>
<button class="p-num p-mar">
7
</button>
<button class="p-num p-mar">
8
</button>
<button class="p-num p-mar">
9
</button>
</view>
<view class="pleft-btom">
<button class="p-num pu-zero">
0
</button>
<button class="p-num">
.
</button>
</view>
</view>
<view class="pl-right">
<button class="p-num pr-del">
</button>
<button class="p-num pr-sure">
确定
</button>
</view>
</view>
</view> </view>
</view> </view>
</template> </template>
@ -167,10 +216,10 @@ export default {
height: 60rpx; height: 60rpx;
.pr-num { .pr-num {
font-size: 30px;
line-height: 60rpx;
min-height: 60rpx;
height: 60rpx;
font-size: 34px;
line-height: 70rpx;
min-height: 70rpx;
height: 70rpx;
color: #454545; color: #454545;
} }
} }
@ -220,5 +269,87 @@ export default {
cursor: pointer; cursor: pointer;
} }
} }
.pac-list {
display: flex;
justify-content: space-between;
position: absolute;
width: 100%;
left: 0;
right: 0;
bottom: 0;
padding: 14rpx;
height: 415rpx;
background: #f7f7f7;
box-sizing: border-box;
.pl-left {
width: 537rpx;
}
.p-num {
display: flex;
justify-content: center;
align-items: center;
height: 88rpx;
margin: 0;
border: none;
border-radius: 5rpx;
background: #fff;
font-size: 18px;
color: #454545;
font-weight: bold;
&:after {
border: none;
}
}
.pleft-num {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
.p-num {
width: 170rpx;
&.p-mar {
margin-top: 14rpx;
}
}
}
.pleft-btom {
display: flex;
justify-content: space-between;
margin-top: 14rpx;
.p-num {
width: 170rpx;
}
.pu-zero {
width: 354rpx;
margin-right: 14rpx;
}
}
.pl-right {
width: 170rpx;
.pr-del {
background: #fff url(../../static/page/del.png) no-repeat center center;
background-size: 48rpx 34rpx;
}
.pr-sure {
flex: 1;
height: 290rpx;
margin-top: 14rpx;
color: #caf2d8;
background: #ace4c1;
}
}
}
} }
</style> </style>

BIN
agentApp/static/page/del.png

After

Width: 48  |  Height: 34  |  Size: 556 B

Loading…
Cancel
Save