Commit df14d135 by 宋冰琦

修复取单页面样式

parent 30009c0f
<template> <template>
<div> <div>
<u-popup :show="show" :round="10" mode="bottom" @close="close" zIndex="10078" :customStyle="popupStyle"> <u-popup :show="show" :round="10" mode="bottom" :safeAreaInsetBottom="false" @close="close" zIndex="10078" :customStyle="popupStyle">
<view class="bigBox" :style="{'margin-top':'-20rpx'}" @touchstart="start" @touchmove.stop.prevent="move" @touchend="end" ref="op"> <view class="bigBox" :style="{'margin-top':'-20rpx'}" @touchstart.stop.prevent="start" @touchmove.stop.prevent="move" @touchend.stop.prevent="end" ref="op">
<scroll-view class="scroll-view" :scroll-y="true"> <scroll-view class="scroll-view" :scroll-y="true">
<div class="order_flow" > <div class="order_flow" >
<div class="code">取单码 {{ orderInfo.orderNum }}</div> <div class="code">取单码 {{ orderInfo.orderNum }}</div>
...@@ -12,8 +12,8 @@ ...@@ -12,8 +12,8 @@
<div class="qr_code" v-else> <div class="qr_code" v-else>
<image :src="'/static/imgs/erweimazhedang.png'" class="qr"></image> <image :src="'/static/imgs/erweimazhedang.png'" class="qr"></image>
</div> </div>
<view class="status_text" v-if="showMask">——制作完成后才能扫哦——</view> <!-- <view class="status_text" v-if="showMask">——制作完成后才能扫哦——</view> -->
<div class="flow_describe" :style="{'padding-top':(!showMask)?'48rpx':'80rpx'}"> <div class="flow_describe">
<view class="title">扫码流程</view> <view class="title">扫码流程</view>
<image :mode="'aspectFit'" class="flow_img" :src="'/static/imgs/saomaliucheng.png'"></image> <image :mode="'aspectFit'" class="flow_img" :src="'/static/imgs/saomaliucheng.png'"></image>
</div> </div>
...@@ -108,19 +108,14 @@ export default { ...@@ -108,19 +108,14 @@ export default {
this.close() this.close()
}else{ }else{
console.log('滑动了:'+val + ',回到顶部') console.log('滑动了:'+val + ',回到顶部')
this.popupStyle['animationDuration'] = '2s'; this.popupStyle.transform = 'translateY(0px)'
this.popupStyle.transform = 'translate(0rpx, 0rpx)'
} }
// this.popupStyle.top = val+'rpx'
// if(val<-300){
// this.close()
// }
}, },
close() { close() {
this.show = false; this.show = false;
}, },
open(data, path) { open(data, path) {
this.popupStyle.transform = 'translate(0rpx, 0rpx)' this.popupStyle.transform = 'translateY(0px)'
this.show = true; this.show = true;
this.orderInfo = data; this.orderInfo = data;
// console.log("order:"+JSON.stringify(this.orderInfo)); // console.log("order:"+JSON.stringify(this.orderInfo));
...@@ -198,7 +193,7 @@ export default { ...@@ -198,7 +193,7 @@ export default {
background: #FFFFFF; background: #FFFFFF;
margin: 32rpx; margin: 32rpx;
padding-top: 54rpx; padding-top: 54rpx;
padding-bottom: 60rpx; padding-bottom: 62rpx;
.status_text { .status_text {
font-size: 28rpx; font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC; font-family: PingFangSC-Medium, PingFang SC;
...@@ -215,22 +210,24 @@ export default { ...@@ -215,22 +210,24 @@ export default {
} }
.qr_code_readly{ .qr_code_readly{
margin: 20rpx auto; margin: 20rpx auto;
width: 510rpx; margin-top: 38rpx;
height: 510rpx; margin-bottom: 66rpx;
width: 474.6rpx;
height: 476rpx;
.qr { .qr {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
} }
.qr_code { .qr_code {
height: 350rpx; height: 468rpx;
width: 350rpx; width: 470rpx;
display: block; display: block;
margin: 72rpx auto; margin: 42rpx auto;
position: relative; position: relative;
padding-bottom: 40rpx; padding-bottom: 70rpx;
margin-bottom: 0rpx; margin-bottom: 0rpx;
margin-left: 170rpx; margin-left: 107rpx;
.status_text { .status_text {
font-size: 28rpx; font-size: 28rpx;
......
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
<div v-if="qrShow&&!isBuild" class="qr_code" > <div v-if="qrShow&&!isBuild" class="qr_code" >
<image mode="aspectFit" :src="'/static/imgs/erweimazhedang.png'" class="qr" /> <image mode="aspectFit" :src="'/static/imgs/erweimazhedang.png'" class="qr" />
</div> </div>
<view class="scan_tips" v-if="qrTextShow">——制作完成后才能扫哦——</view> <!-- <view class="scan_tips" v-if="qrTextShow">——制作完成后才能扫哦——</view> -->
<canvas v-if="qrShow" class="canvas-code" canvas-id="myQrcode" style="background:#fff;width: 200px;height: 200px; display:block; left:-800rpx;position:absolute;" /> <canvas v-if="qrShow" class="canvas-code" canvas-id="myQrcode" style="background:#fff;width: 200px;height: 200px; display:block; left:-800rpx;position:absolute;" />
<div v-if="qrShow" class="flow_describe"> <div v-if="qrShow" class="flow_describe">
<view class="title">扫码流程</view> <view class="title">扫码流程</view>
...@@ -435,7 +435,7 @@ export default { ...@@ -435,7 +435,7 @@ export default {
.order_flow { .order_flow {
background: #FFFFFF; background: #FFFFFF;
margin: 32rpx; margin: 32rpx;
padding-top: 56rpx; padding-top: 55.01rpx;
.code { .code {
text-align: center; text-align: center;
...@@ -443,7 +443,6 @@ export default { ...@@ -443,7 +443,6 @@ export default {
font-family: PingFangSC-Semibold, PingFang SC; font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600; font-weight: 600;
color: #333333; color: #333333;
padding-bottom: 20rpx;
} }
.status_text { .status_text {
...@@ -455,14 +454,14 @@ export default { ...@@ -455,14 +454,14 @@ export default {
} }
.qr_code { .qr_code {
height: 351rpx; height: 474rpx;
width: 355rpx; width: 470rpx;
display: block; display: block;
margin-top: 48rpx; margin-top: 36.99rpx;
position: relative; position: relative;
padding-bottom: 40rpx; padding-bottom: 40rpx;
margin-bottom: 0rpx; margin-bottom: 0rpx;
margin-left: 170rpx; margin-left: 108rpx;
.qr { .qr {
width: 100%; width: 100%;
...@@ -480,8 +479,10 @@ export default { ...@@ -480,8 +479,10 @@ export default {
} }
.realQrcodeBox{ .realQrcodeBox{
margin: 0 auto; margin: 0 auto;
width: 510rpx; width: 474.6rpx;
height: 510rpx; margin-top: 38rpx;
margin-bottom: 37rpx;
height: 476rpx;
image{ image{
width: 100%; width: 100%;
height: 100%; height: 100%;
...@@ -490,10 +491,10 @@ export default { ...@@ -490,10 +491,10 @@ export default {
} }
.flow_describe { .flow_describe {
padding-top: 50rpx; padding-top: 29rpx;
padding-left: 32rpx; padding-left: 32rpx;
padding-right: 32rpx; padding-right: 32rpx;
padding-bottom: 58rpx; padding-bottom: 60rpx;
.title { .title {
height: 40rpx; height: 40rpx;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment