<template>
|
<!-- 购物车 -->
|
<view class="popup-content">
|
<view class="popup-header flex justify-between">
|
<text class="blue">已选商品</text>
|
<view class="flex align-center">
|
<view class="popup-header-icon iconfont iconlajixiang_huaban1 gray"></view>
|
<text class="gray font-14">清空</text>
|
</view>
|
</view>
|
<view class="popup-row flex align-center"v-for="item in 3">
|
<image class="popup-row-img" mode="aspectFill" src="../../../static/images/product.jpg"></image>
|
<view class="popup-row-right">
|
<text class="flex justify-start font-12">肽妍氨基酸平衡基础洁面乳</text>
|
<view class="flex justify-between align-center">
|
<text class="flex justify-start font-12 red">￥400.00</text>
|
<view class="flex align-center justify-end">
|
<text class="iconfont iconjian blue-outline-btn-circle mr-10 center"></text>
|
<text>1</text>
|
<text class="iconfont iconjia blue-btn-circle ml-10 center"></text>
|
</view>
|
</view>
|
</view>
|
</view>
|
<view class="popup-end flex align-center justify-between">
|
<view class="flex align-center">
|
<view class="shopping-icon iconfont iconicongouwuche gray" @click="openShoppingCart">
|
<view class="shopping-icon-num flex align-center justify-center">
|
<text class="font-10">19</text>
|
</view>
|
</view>
|
<text class="font-14 blue ml-10">¥110.00</text>
|
</view>
|
<button class="blue-btn btn mr-0" @click="linkTo('./confirmOrder')">提交订单</button>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
</script>
|
|
<style>
|
.shopping{
|
padding: 10px 10px;
|
box-shadow:0 6px 100px rgba(237,234,244,1);
|
}
|
.shopping-icon{
|
font-size: 28px;
|
position: relative;
|
}
|
.shopping-icon-num{
|
width: 20px;
|
height: 20px;
|
background: #518EFF;
|
border-radius: 50%;
|
color: #FFFFFF;
|
position: absolute;
|
right: -10px;
|
top: -10px;
|
}
|
.btn{
|
border-radius: 20px;
|
line-height: 34px;
|
padding: 0 24px;
|
font-size: 14px;
|
}
|
.popup-content{
|
background: #FFFFFF;
|
border-top-left-radius: 8px;
|
border-top-right-radius: 8px;
|
padding: 0 10px;
|
}
|
.popup-header{
|
padding: 10px 0;
|
border-bottom: 1px solid #EDEAF4;
|
font-size: 16px;
|
}
|
.popup-header-icon{
|
font-size: 22px;
|
vertical-align: middle;
|
}
|
.popup-row{
|
padding: 10px 0;
|
}
|
.popup-row-img{
|
width: 40px;
|
height: 40px;
|
margin-right: 10px;
|
}
|
.popup-row-right{
|
width: 100%;
|
}
|
.popup-end{
|
padding: 10px 0;
|
}
|
</style>
|
