From b2920edd2e328124758db10dbf4af57272693a01 Mon Sep 17 00:00:00 2001 From: li-guang <153605324@qq.com> Date: Thu, 17 Dec 2020 16:38:22 +0800 Subject: [PATCH] 订单当前客户页面 --- hive-app/pages/workbench/selectProduct.vue | 82 +++++++++++++++++++++++++++++++++-------- 1 files changed, 66 insertions(+), 16 deletions(-) diff --git a/hive-app/pages/workbench/selectProduct.vue b/hive-app/pages/workbench/selectProduct.vue index 0e9dd98..51308ab 100644 --- a/hive-app/pages/workbench/selectProduct.vue +++ b/hive-app/pages/workbench/selectProduct.vue @@ -12,29 +12,41 @@ </view> </scroll-view> <scroll-view class="list-right" scroll-y> - <view class="flex flex-v list-right-row"> - <text class="flex justify-start font-14">肽妍氨基酸平衡基础洁面乳</text> - <text class="flex justify-start font-14 red mt-10">¥400.00</text> - <view class="flex align-center justify-end mt-10"> - <button class="blue-btn-circle mr-10">-</button> - <text>1</text> - <button class="blue-btn-circle ml-10 mr-0">+</button> + <view class="flex align-center list-right-row"> + <image class="product-img mr-5" mode="aspectFill" src="../../static/images/product.jpg"></image> + <view> + <text class="flex justify-start font-12">肽妍氨基酸平衡基础洁面乳</text> + <text class="font-10 gray flex justify-start">物品描述</text> + <view class="flex justify-between align-center mt-15"> + <text class="flex justify-start font-12 red mt-10">¥400.00</text> + <view class="flex align-center justify-end mt-10"> + <text class="blue-btn-circle mr-10">-</text> + <text class="font-12">1</text> + <text class="blue-btn-circle ml-10 mr-0">+</text> + </view> + </view> </view> </view> - <view class="flex flex-v list-right-row"> - <text class="flex justify-start font-14">肽妍氨基酸平衡基础洁面乳</text> - <text class="flex justify-start font-14 red mt-10">¥400.00</text> - <view class="flex align-center justify-end mt-10"> - <button class="blue-btn-circle mr-10">-</button> - <text>1</text> - <button class="blue-btn-circle ml-10 mr-0">+</button> + <view class="flex align-center list-right-row"> + <image class="product-img mr-5" mode="aspectFill" src="../../static/images/product.jpg"></image> + <view> + <text class="flex justify-start font-12">肽妍氨基酸平衡基础洁面乳</text> + <text class="font-10 gray flex justify-start">物品描述</text> + <view class="flex justify-between align-center mt-15"> + <text class="flex justify-start font-12 red mt-10">¥400.00</text> + <view class="flex align-center justify-end mt-10"> + <text class="blue-btn-circle mr-10">-</text> + <text class="font-12">1</text> + <text class="blue-btn-circle ml-10 mr-0">+</text> + </view> + </view> </view> </view> </scroll-view> </view> <view class="shopping flex align-center justify-between"> <view class="flex align-center"> - <view class="shopping-icon iconfont icongouwuche gray"> + <view class="shopping-icon iconfont icongouwuche gray" @click="openShoppingCart"> <view class="shopping-icon-num flex align-center justify-center"> <text class="font-10">19</text> </view> @@ -43,14 +55,31 @@ </view> <button class="blue-btn btn mr-0" @click="linkTo('./confirmOrder')">提交订单</button> </view> + <uni-popup ref="popup" type="bottom"> + <view class="popup-content"> + <view class="popup-header flex justify-between"> + <text class="font-16 blue">已选商品</text> + <view class="flex align-center"> + <text class="icon iconfont iconlajixiang_huaban1 gray"></text> + <text class="font-16 gray">清空</text> + </view> + <view> + <image src="../../static/images/product.jpg"></image> + <view></view> + </view> + </view> + </view> + </uni-popup> </view> </template> <script> import searchBar from '../../components/searchBar/index.vue'; + import uniPopup from '@/components/uni-popup/uni-popup.vue' export default { components:{ - searchBar + searchBar, + uniPopup }, data(){ return{ @@ -67,6 +96,9 @@ }, active(index){ this.select=index + }, + openShoppingCart(){ + this.$refs.popup.open() } } } @@ -115,8 +147,13 @@ .list-right-row:not(:first-child){ margin-top: 10px; } + .product-img{ + width: 81px; + height: 81px; + } .shopping{ padding: 20px 10px; + box-shadow:0 6px 100px rgba(237,234,244,1); } .shopping-icon{ font-size: 25px; @@ -137,4 +174,17 @@ line-height: 30px; font-size: 14px; } + .popup-content{ + background: #FFFFFF; + border-top-left-radius: 8px; + border-top-right-radius: 8px; + padding: 10px; + } + .icon{ + font-size: 20px; + } + .popup-header{ + padding: 0 5px 10px; + border-bottom: 1px solid #EDEAF4; + } </style> -- Gitblit v1.9.1