界面优化
This commit is contained in:
DESKTOP-GMUNQ1B\k
parent
bfc6e0b415
commit
bf0e339fe8
27
pages.json
27
pages.json
@ -109,20 +109,19 @@
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/payment/get_payment",
|
||||
"style": {
|
||||
"navigationBarTitleText": "面对面收款",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/payment/settlement",
|
||||
"style": {
|
||||
"navigationBarTitleText": "支付",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/payment/get_payment",
|
||||
"style": {
|
||||
"navigationBarTitleText": "面对面收款",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/payment/settlement",
|
||||
"style": {
|
||||
"navigationBarTitleText": "支付"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/news_list/index",
|
||||
"style": {
|
||||
|
||||
@ -1,20 +1,16 @@
|
||||
<template>
|
||||
<view class="container" v-if="merchantInfo">
|
||||
<view style="height: var(--status-bar-height);"></view>
|
||||
|
||||
<view class="v-navbar">
|
||||
<u-navbar title="面对面收款" :autoBack="true" :fixed="false" bgColor="transparent" leftIconColor="#fff"
|
||||
:titleStyle="{color:'#fff',fontWeight:'bold',fontSize:'32rpx'}">
|
||||
<u-navbar title="面对面收款" :safeAreaInsetTop="false" :fixed="false" :autoBack="true" bgColor="transparent"
|
||||
leftIconColor="#fff" :titleStyle="{color:'#fff',fontWeight:'bold',fontSize:'34rpx'}">
|
||||
</u-navbar>
|
||||
</view>
|
||||
|
||||
<view class="v-desc">
|
||||
<view class="v-desc-main">付款给商家</view>
|
||||
<view class="v-desc-sub">{{merchantInfo.merchant.mer_name}}</view>
|
||||
</view>
|
||||
|
||||
<!-- 店铺图片 -->
|
||||
<view class="v-shop-img">
|
||||
<view>
|
||||
<view class="v-desc-main">付款给商家</view>
|
||||
<view class="v-desc-sub">{{merchantInfo.merchant.mer_name}}</view>
|
||||
</view>
|
||||
<u-image :showLoading="true" :src="merchantInfo.merchant.mer_avatar" width="182rpx" height="182rpx"
|
||||
:radius="10" />
|
||||
</view>
|
||||
@ -39,6 +35,10 @@
|
||||
<view class="v-wrap-desc-sub">即买即用</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="v-btn-wrap">
|
||||
<view class="v-btn" @click="submitOrder">提交订单</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -77,7 +77,7 @@
|
||||
},
|
||||
|
||||
onLoad(opt) {
|
||||
this.getProductInfoByMerid(opt.mer_id);
|
||||
this.getProductInfoByMerid(opt.mer_id || 31);
|
||||
},
|
||||
|
||||
methods: {
|
||||
@ -177,23 +177,27 @@
|
||||
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: #FCE9B2;
|
||||
background-color: #FCDFAD;
|
||||
}
|
||||
|
||||
.container {
|
||||
position: relative;
|
||||
height: 100vh;
|
||||
background-image: url("https://lihai001.oss-cn-chengdu.aliyuncs.com/def/c582c202402291601584806.webp");
|
||||
background-size: 100% auto;
|
||||
background-repeat: no-repeat;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.v-navbar {
|
||||
margin-bottom: 54rpx;
|
||||
}
|
||||
padding-top: var(--status-bar-height);
|
||||
|
||||
.v-desc {
|
||||
margin-left: 30rpx;
|
||||
margin-bottom: 124rpx;
|
||||
position: absolute;
|
||||
top: 196rpx;
|
||||
z-index: 10;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
padding: 0 20rpx;
|
||||
background: transparent;
|
||||
|
||||
.v-desc-main {
|
||||
margin-bottom: 30rpx;
|
||||
@ -209,49 +213,11 @@
|
||||
}
|
||||
}
|
||||
|
||||
.v-qrcode {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-bottom: 158rpx;
|
||||
}
|
||||
|
||||
.v-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 690rpx;
|
||||
height: 100rpx;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0rpx 3rpx 12rpx 1rpx rgba(255, 94, 12, 0.32);
|
||||
border-radius: 55rpx 55rpx 55rpx 55rpx;
|
||||
margin: 0 auto;
|
||||
|
||||
image {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
margin-right: 6rpx;
|
||||
}
|
||||
|
||||
text {
|
||||
font-weight: 600;
|
||||
font-size: 32rpx;
|
||||
color: #FF5E0C;
|
||||
line-height: 16rpx;
|
||||
text-align: center;
|
||||
font-style: normal;
|
||||
text-transform: none;
|
||||
margin-top: 2rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.v-shop-img {
|
||||
position: absolute;
|
||||
top: 196rpx;
|
||||
right: 40rpx;
|
||||
}
|
||||
|
||||
.v-con {
|
||||
position: relative;
|
||||
position: absolute;
|
||||
top: 436rpx;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 710rpx;
|
||||
height: 1166rpx;
|
||||
background: linear-gradient(180deg, #FEB992 0%, #FFFFFF 31%, #FFFFFF 100%);
|
||||
@ -269,10 +235,6 @@
|
||||
line-height: 16rpx;
|
||||
}
|
||||
|
||||
/deep/.u-text__value--tips {
|
||||
color: #2E2E2E;
|
||||
}
|
||||
|
||||
.v-con-input {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -324,10 +286,21 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.v-btn-wrap {
|
||||
position: fixed;
|
||||
z-index: 11;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 140rpx;
|
||||
background-color: #FCDFAD;
|
||||
|
||||
.v-btn {
|
||||
position: absolute;
|
||||
bottom: 96rpx;
|
||||
width: 650rpx;
|
||||
height: 100rpx;
|
||||
line-height: 100rpx;
|
||||
@ -338,6 +311,7 @@
|
||||
font-weight: 600;
|
||||
font-size: 32rpx;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
|
||||
&:active {
|
||||
opacity: .8;
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
<template>
|
||||
<view :style="viewColor">
|
||||
<view style="height: var(--status-bar-height);"></view>
|
||||
<view class='order-submission'>
|
||||
<!-- 商品信息 -->
|
||||
<view class="storeinfo-wrapper">
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user