You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
122 lines
2.6 KiB
122 lines
2.6 KiB
<template>
|
|
<view class="">
|
|
<view class="po-ra" v-if="orderType == 2">
|
|
<scroll-view class="settle-goods" scroll-x="true" >
|
|
<view class="settle-con">
|
|
<view class="settle-img" v-for="item in goodsData.images">
|
|
<image class="st-img" :src="item" mode="aspectFill"></image>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</scroll-view>
|
|
<view class="fix-soon fcor666">
|
|
<view class="fix-price">
|
|
<!-- <text class="fontwig6 fcor333 marb5"> ¥215</text> -->
|
|
<text>共{{goodsData.images.length}}件
|
|
<text class="icon-ymt to-right font14 fcor666"></text>
|
|
</text>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
|
<view class="settle-con" v-if="orderType == 1">
|
|
<view class="settle-img" >
|
|
<image class="st-img" :src="goodsData.images[0]" mode="aspectFill"></image>
|
|
</view>
|
|
<view class="settle-msg">
|
|
<view class="settle-title marb5">
|
|
<text>云南高山荷兰豆160g</text>
|
|
<text class="font14 fcor666">共一件</text>
|
|
</view>
|
|
<view class="settle-title">
|
|
<text>¥2.99</text>
|
|
<text class="font14 fcor666">×1</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data(){
|
|
return{
|
|
goodsData:{
|
|
"images": ["https://d1.shopxo.vip/static/upload/images/goods/2019/01/14/1547451274847894.jpg","https://d1.shopxo.vip/static/upload/images/goods/2019/01/14/1547451274847894.jpg","https://d1.shopxo.vip/static/upload/images/goods/2019/01/14/1547451274847894.jpg","https://d1.shopxo.vip/static/upload/images/goods/2019/01/14/1547451274847894.jpg","https://d1.shopxo.vip/static/upload/images/goods/2019/01/14/1547451274847894.jpg"],
|
|
},
|
|
}
|
|
},
|
|
props:{ //1单个商品，2多个商品
|
|
orderType:{
|
|
type:Number,
|
|
default:2,
|
|
}
|
|
},
|
|
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.po-ra{
|
|
position: relative;
|
|
}
|
|
.settle-goods{
|
|
width: auto;
|
|
}
|
|
.settle-con{
|
|
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
align-items: center;
|
|
|
|
.settle-img{
|
|
font-size: 0;
|
|
margin-left: 10px;
|
|
.st-img{
|
|
width: 82px;
|
|
height: 82px;
|
|
}
|
|
}
|
|
|
|
.settle-msg{
|
|
flex: 1;
|
|
padding: 0 10px;
|
|
.settle-title{
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
}
|
|
|
|
|
|
}
|
|
.fix-soon{
|
|
position: absolute;
|
|
right: 0;
|
|
top:0;
|
|
width: 82px ;
|
|
height: 82px;
|
|
// line-height: 82px;
|
|
opacity: 0.8;
|
|
background-color: #ffffff;
|
|
text-align: center;
|
|
}
|
|
|
|
|
|
.fix-price{
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
&>text{
|
|
width: 100%;
|
|
}
|
|
}
|
|
</style> |