Style:界面细节调整
This commit is contained in:
@@ -183,7 +183,6 @@
|
||||
.title {
|
||||
width: 160rpx;
|
||||
padding: 16rpx;
|
||||
border-right: 2rpx solid #D2D2D2;
|
||||
color: #ADADAD;
|
||||
}
|
||||
}
|
||||
@@ -195,6 +194,7 @@
|
||||
.value {
|
||||
width: 100%;
|
||||
padding: 16rpx;
|
||||
border-left: 2rpx solid #D2D2D2;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -843,6 +843,8 @@ page {
|
||||
}
|
||||
|
||||
.goodWrapper .item .text {
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
width: 5.37*100rpx;
|
||||
position: relative;
|
||||
}
|
||||
@@ -866,7 +868,6 @@ page {
|
||||
|
||||
.goodWrapper .item .text .money {
|
||||
font-size: 0.26*100rpx;
|
||||
margin-top: 0.17*100rpx;
|
||||
}
|
||||
|
||||
.goodWrapper .item .text .evaluate {
|
||||
|
||||
+77
-38
@@ -1,39 +1,57 @@
|
||||
<template>
|
||||
<view class="orderGoods">
|
||||
<view v-if="title.length>0" class="total acea-row row-middle" >
|
||||
<view class="acea-row row-left row-middle" style="position: relative;">
|
||||
<image style="width: 32rpx;height: 32rpx;margin-right: 12rpx;" src="http://admin-api.xdd618.com/file/pic/20210807230759738342.png" mode=""></image>
|
||||
<text class="title">{{title}}</text>
|
||||
<!-- <text class="pink-dot"></text> -->
|
||||
</view>
|
||||
</view>
|
||||
<view v-else class="total">共{{ cartInfo.length }}件商品</view>
|
||||
<view
|
||||
v-if="title.length > 0"
|
||||
class="total acea-row row-middle"
|
||||
>
|
||||
<view
|
||||
style="position: relative;"
|
||||
class="acea-row row-left row-middle"
|
||||
>
|
||||
<image
|
||||
style="width: 32rpx;height: 32rpx;margin-right: 12rpx;"
|
||||
src="http://admin-api.xdd618.com/file/pic/20210807230759738342.png" mode=""
|
||||
/>
|
||||
<text class="title">
|
||||
{{ title }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
v-else
|
||||
class="total"
|
||||
>共{{ cartInfo.length }}件商品</view>
|
||||
<view class="goodWrapper">
|
||||
<view class="item acea-row row-between-wrapper" style="flex-wrap: nowrap;" v-for="cart in cartInfo" :key="cart.id">
|
||||
<view
|
||||
v-for="cart in cartInfo"
|
||||
:key="cart.id"
|
||||
class="item acea-row row-between-wrapper"
|
||||
style="flex-wrap: nowrap;"
|
||||
>
|
||||
<view class="pictrue" style="margin-right: 20rpx;">
|
||||
<image :src="cart.productInfo.image" class="image" />
|
||||
</view>
|
||||
<view class="text">
|
||||
<view class="acea-row row-between-wrapper">
|
||||
<view class="name line1">{{ cart.productInfo.storeName }}</view>
|
||||
<!-- <view class="num">x {{ cart.cartNum }}</view> -->
|
||||
<view class="name line1 one-t">{{ cart.productInfo.storeName }}</view>
|
||||
</view>
|
||||
<!-- <view
|
||||
class="attr line1"
|
||||
v-if="cart.productInfo.attrInfo"
|
||||
>{{ cart.productInfo.attrInfo.sku }}</view> -->
|
||||
<view class="acea-row row-middle row-between">
|
||||
<view
|
||||
class="attr"
|
||||
style="height: 38rpx;line-height:38rpx;background-color: #FFF3F2;border-radius: 19rpx;padding: 4rpx 20rpx;"
|
||||
v-if="cart.productInfo.attrInfo"
|
||||
>规格:{{ cart.productInfo.attrInfo.sku }}</view>
|
||||
<view v-if="evaluate == 3" class="evaluate" style="bottom: 0 !important;position: relative;height: 36rpx !important;width: 90rpx !important;line-height: 36rpx !important;font-size: 32rpx;border-radius: 18rpx;" @click="routerGo(cart)">评价</view>
|
||||
</view>
|
||||
<view class="acea-row row-middle row-between attr-wrap">
|
||||
<view
|
||||
v-if="cart.productInfo.attrInfo"
|
||||
class="attr more-t"
|
||||
>
|
||||
规格:{{ cart.productInfo.attrInfo.sku }}
|
||||
</view>
|
||||
<view
|
||||
v-if="evaluate == 3"
|
||||
class="evaluate"
|
||||
@click="routerGo(cart)"
|
||||
>评价</view>
|
||||
</view>
|
||||
<view class="money font-color-lightred acea-row row-between">
|
||||
<text>¥{{ cart.truePrice }}</text>
|
||||
<text class="num" style="margin-left: 10rpx;">x{{ cart.cartNum }}</text>
|
||||
</view>
|
||||
<text>¥{{ cart.truePrice }}</text>
|
||||
<text class="num">x{{ cart.cartNum }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -68,21 +86,42 @@ export default {
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
.pink-dot{
|
||||
width:24rpx;
|
||||
height:24rpx;
|
||||
background:rgba(255,86,74,0.4);
|
||||
border-radius:50%;
|
||||
position: absolute;
|
||||
z-index: 0;
|
||||
bottom: 24rpx;
|
||||
right: -12rpx;
|
||||
}
|
||||
|
||||
.title{
|
||||
font-size:26rpx;
|
||||
color:#080F1A;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.goodWrapper .item .pictrue {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
}
|
||||
.goodWrapper .item .pictrue .image {
|
||||
display: block;
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
}
|
||||
.attr-wrap {
|
||||
position: relative;
|
||||
min-height: 80rpx;
|
||||
margin-top: 8rpx;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.text .attr {
|
||||
max-width: calc(100% - 130rpx);
|
||||
margin: 0 !important;
|
||||
padding: 4rpx 20rpx;
|
||||
border-radius: 19rpx;
|
||||
line-height:38rpx;
|
||||
box-sizing: border-box;
|
||||
background-color: #FFF3F2;
|
||||
}
|
||||
.evaluate {
|
||||
position: relative;
|
||||
top: 0;
|
||||
height: 36rpx;
|
||||
width: 90rpx;
|
||||
border-radius: 36rpx !important;
|
||||
line-height: 36rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<view class="pkg-product-list">
|
||||
<view class="first-half">
|
||||
<view class="search-box flex jc-between ai-center">
|
||||
<input type="text" v-model="keyword" placeholder="搜索商品" placeholder-style="color:#949494" @confirm="search">
|
||||
<input type="text" v-model="keyword" placeholder="搜索内容" placeholder-style="color:#949494" @confirm="search">
|
||||
<image class="icon" :src="webUrl+'/20220903142935869059.png'" mode="scaleToFill" @click="search"></image>
|
||||
</view>
|
||||
|
||||
|
||||
@@ -193,6 +193,7 @@ export default {
|
||||
}
|
||||
|
||||
.img-top {
|
||||
display: block;
|
||||
width: 100vw;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user