Commit 5e7d1237 by songbingqi

修改首页样式效果

parent ba390777
<template> <template>
<div> <div>
<u-popup :show="show" :round="10" mode="bottom" @close="close" :safeAreaInsetBottom="false"> <u-popup :show="show" :round="10" mode="bottom" @close="close" :safeAreaInsetBottom="false" zIndex="10078" >
<view class="bigBox" :style="{'height':'90vh'}"> <view class="bigBox" :style="{'height':'94vh'}">
<div class="order_flow" > <div class="order_flow" >
<div class="code">取单码 {{ orderInfo.orderNum }}</div> <div class="code">取单码 {{ orderInfo.orderNum }}</div>
<!-- <image mode="scaleToFill" :src="qrCode" class="qr_code"></image> --> <!-- <image mode="scaleToFill" :src="qrCode" class="qr_code"></image> -->
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
<image mode="aspectFit" :src="'/static/imgs/erweimazhedang.png'" class="qr"></image> <image mode="aspectFit" :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"> <div class="flow_describe" :style="{'padding-top':(!showMask)?'48rpx':'80rpx'}">
<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>
...@@ -89,7 +89,7 @@ export default { ...@@ -89,7 +89,7 @@ export default {
if(this.showMask) { if(this.showMask) {
this.qrCode = ''; this.qrCode = '';
} else { } else {
this.qrCode = path; this.qrCode = 'https://t7.baidu.com/it/u=192737963,550444895&fm=218&app=126&size=f242,150&n=0&f=PNG?s=18AAE7177DCBF747466A567D03008078&sec=1656608400&t=2fa7a10f21b5f54a2aefd0fde2db3bb9';
} }
}, },
jsonParse(json) { jsonParse(json) {
...@@ -146,18 +146,19 @@ export default { ...@@ -146,18 +146,19 @@ export default {
background: #F7F7F7; background: #F7F7F7;
border-radius: 10px 10px 0px 0px; border-radius: 10px 10px 0px 0px;
overflow: auto; overflow: auto;
z-index: 10078 !important;
} }
.order_flow { .order_flow {
background: #FFFFFF; background: #FFFFFF;
margin: 32rpx; margin: 32rpx;
padding-top: 40rpx; padding-top: 54rpx;
padding-bottom: 25rpx; padding-bottom: 60rpx;
.status_text { .status_text {
font-size: 28rpx; font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC; font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500; font-weight: 500;
color: #333333; color: #666666;
text-align: center; text-align: center;
} }
.code { .code {
...@@ -180,7 +181,7 @@ export default { ...@@ -180,7 +181,7 @@ export default {
height: 347rpx; height: 347rpx;
width: 353rpx; width: 353rpx;
display: block; display: block;
margin: 70rpx auto; margin: 72rpx auto;
position: relative; position: relative;
padding-bottom: 40rpx; padding-bottom: 40rpx;
margin-bottom: 0rpx; margin-bottom: 0rpx;
...@@ -204,7 +205,6 @@ export default { ...@@ -204,7 +205,6 @@ export default {
.flow_describe { .flow_describe {
width: 100%; width: 100%;
height: 300rpx; height: 300rpx;
padding-top: 48rpx;
padding-left: 31rpx; padding-left: 31rpx;
.title { .title {
...@@ -215,7 +215,7 @@ export default { ...@@ -215,7 +215,7 @@ export default {
} }
.flow_img { .flow_img {
padding:36rpx 32rpx 0rpx 32rpx; padding:18rpx 32rpx 0rpx 32.83rpx;
width: 590rpx; width: 590rpx;
height: 244rpx; height: 244rpx;
display: block; display: block;
...@@ -227,14 +227,15 @@ export default { ...@@ -227,14 +227,15 @@ export default {
margin-top: 100rpx; margin-top: 100rpx;
background: #FFFFFF; background: #FFFFFF;
margin: 32rpx; margin: 32rpx;
padding: 25rpx 31rpx; padding: 26rpx 32rpx 32rpx 24rpx;
.title{ .title{
font-size: 28rpx; font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC; font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500; font-weight: 500;
color: #333333; color: #333333;
padding-bottom: 24rpx; padding-bottom: 24rpx;
border-bottom: 1px solid #ECECEC; border-bottom: 2rpx solid #ECECEC;
letter-spacing: 1rpx;
} }
.text { .text {
margin-top: 18rpx; margin-top: 18rpx;
...@@ -242,7 +243,7 @@ export default { ...@@ -242,7 +243,7 @@ export default {
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400; font-weight: 400;
color: #999999; color: #999999;
line-height: 48rpx; line-height: 50rpx;
} }
} }
.customer_service { .customer_service {
......
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
<view class="addbox"> <view class="addbox">
<image v-if="getSku(item).state==1" @click.stop="getallNum(item, category)" class="add" :src="'../../static/imgs/jiahao.png'" /> <image v-if="getSku(item).state==1" @click.stop="getallNum(item, category)" class="add" :src="'../../static/imgs/jiahao.png'" />
<!-- <u-icon class="add" name="plus-circle-fill" color="#0050F6" @click.stop="getallNum(item, category)" size="22"></u-icon> --> <!-- <u-icon class="add" name="plus-circle-fill" color="#0050F6" @click.stop="getallNum(item, category)" size="22"></u-icon> -->
<div v-if="getSku(item).state!=1" style="color: #858585;font-size: 20rpx;">已售罄</div> <div v-if="getSku(item).state!=1" style="color: #858585;font-size: 20rpx;margin-top:16rpx">已售罄</div>
</view> </view>
</view> </view>
</view> </view>
...@@ -605,7 +605,7 @@ export default { ...@@ -605,7 +605,7 @@ export default {
height: 100%; height: 100%;
width: 4rpx; width: 4rpx;
position: absolute; position: absolute;
right: 0rpx; right: 5rpx;
box-sizing:border-box; box-sizing:border-box;
top: 0; top: 0;
background: #0050F6; background: #0050F6;
......
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
</u-checkbox-group> --> </u-checkbox-group> -->
<view> <view>
<image :src="item.pics.thumbnailApplet || item.pics.thumbnail" <image :src="item.pics.thumbnailApplet || item.pics.thumbnail"
style="width: 120rpx;height: 120rpx;margin-top: 4rpx"></image> style="width: 120rpx;height: 120rpx;margin-top: 4.24rpx"></image>
</view> </view>
</view> </view>
<view class="size"> <view class="size">
...@@ -41,7 +41,7 @@ ...@@ -41,7 +41,7 @@
</text> </text>
</view> </view>
<view class="goods-price"> <view class="goods-price">
<text class="price-discount">{{ Utils.isInteger(item.sku.discount) }}</text> <text class="price-discount"><text class="moneyLog"></text>{{ Utils.isInteger(item.sku.discount) }}</text>
<text class="price-x" v-show="item.sku.price!=item.sku.discount"></text> <text class="price-x" v-show="item.sku.price!=item.sku.discount"></text>
<text class="price-xx" v-show="item.sku.price!=item.sku.discount">{{ Utils.isInteger(item.sku.price) }}</text> <text class="price-xx" v-show="item.sku.price!=item.sku.discount">{{ Utils.isInteger(item.sku.price) }}</text>
</view> </view>
...@@ -278,7 +278,7 @@ export default { ...@@ -278,7 +278,7 @@ export default {
.header { .header {
padding:24.87rpx 31.78rpx 22.3rpx 31.54rpx; padding:24.87rpx 31.78rpx 22.3rpx 31.54rpx;
display: flex; display: flex;
border-bottom: 1px solid #ECECEC; border-bottom: 1rpx solid #ECECEC;
.left { .left {
flex: 1; flex: 1;
...@@ -323,7 +323,7 @@ export default { ...@@ -323,7 +323,7 @@ export default {
&-detail { &-detail {
display: flex; display: flex;
padding: 30rpx 26rpx 30rpx 32rpx; padding: 30rpx 25.87rpx 30rpx 32rpx;
background-color: #fff; background-color: #fff;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
...@@ -386,7 +386,7 @@ export default { ...@@ -386,7 +386,7 @@ export default {
.goods-price { .goods-price {
margin-top: 24rpx; margin-top: 24rpx;
.price-discount{ .moneyLog {
height: 38rpx; height: 38rpx;
font-size: 24rpx; font-size: 24rpx;
font-family: Futura-Medium, Futura; font-family: Futura-Medium, Futura;
...@@ -394,8 +394,17 @@ export default { ...@@ -394,8 +394,17 @@ export default {
color: #333333; color: #333333;
line-height: 30rpx; line-height: 30rpx;
} }
.price-discount{
height: 38rpx;
font-size: 28rpx;
font-family: Futura-Medium, Futura;
font-weight: 500;
color: #333333;
line-height: 30rpx;
}
.price-x { .price-x {
margin-left: 6rpx; margin-left: 4.2rpx;
font-size: 20rpx; font-size: 20rpx;
font-family: ArialMT; font-family: ArialMT;
line-height: 22rpx; line-height: 22rpx;
...@@ -435,14 +444,12 @@ export default { ...@@ -435,14 +444,12 @@ export default {
} }
.num { .num {
height: 28rpx;
font-size: 32rpx; font-size: 32rpx;
font-family: ArialMT; font-family: ArialMT;
color: #000000; color: #000000;
line-height: 28rpx; line-height: 28rpx;
margin-left: 26rpx; margin-left: 26rpx;
margin-right: 26rpx; margin-right: 22rpx;
font-weight: bold;
} }
.add { .add {
width: 40rpx; width: 40rpx;
...@@ -487,7 +494,7 @@ export default { ...@@ -487,7 +494,7 @@ export default {
left: 0; left: 0;
box-shadow: 0px -4px 8px 0px rgba(102, 102, 102, 0.1); box-shadow: 0px -4px 8px 0px rgba(102, 102, 102, 0.1);
display: flex; display: flex;
z-index: 99999; z-index: 10076;
align-items: center; align-items: center;
&-left { &-left {
......
...@@ -74,7 +74,7 @@ ...@@ -74,7 +74,7 @@
left: 0; left: 0;
width: 100%; width: 100%;
height: 100rpx; height: 100rpx;
z-index: 99999; z-index: 10076;
background: #FFFFFF; background: #FFFFFF;
border-top: 2rpx solid #FFFFFF; border-top: 2rpx solid #FFFFFF;
} }
......
...@@ -451,7 +451,7 @@ export default { ...@@ -451,7 +451,7 @@ export default {
justify-content: flex-start; justify-content: flex-start;
.info { .info {
padding-left: 34rpx; padding-left: 34.48rpx;
.first { .first {
height: 44rpx; height: 44rpx;
...@@ -460,7 +460,7 @@ export default { ...@@ -460,7 +460,7 @@ export default {
font-weight: 600; font-weight: 600;
color: #666666; color: #666666;
line-height: 44rpx; line-height: 44rpx;
margin-top: 40rpx; margin-top: 44rpx;
.first-code{ .first-code{
font-family: Arial, Helvetica SC; font-family: Arial, Helvetica SC;
font-size: 28rpx; font-size: 28rpx;
...@@ -469,7 +469,7 @@ export default { ...@@ -469,7 +469,7 @@ export default {
} }
.second { .second {
margin-top: 20rpx; margin-top: 12rpx;
width: 400rpx; width: 400rpx;
font-size: 24rpx; font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
...@@ -492,7 +492,7 @@ export default { ...@@ -492,7 +492,7 @@ export default {
.line { .line {
width: 4rpx; width: 4rpx;
height: 104rpx; height: 104rpx;
border-right: 2rpx solid #f8f5f8; border-right: 1rpx solid #E8E8E8;
position: absolute; position: absolute;
left: 510rpx; left: 510rpx;
box-shadow: -2px -4px 8px 0px rgba(102, 102, 102, 0.1); box-shadow: -2px -4px 8px 0px rgba(102, 102, 102, 0.1);
......
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