From 3827f7fb0da9843253e7285a920cb1dbed9ca0d7 Mon Sep 17 00:00:00 2001 From: queenwuli <942534046@qq.com> Date: Mon, 14 Dec 2020 14:52:17 +0800 Subject: [PATCH] gx --- hive-app/pages/workbench/index.vue | 56 +++++++++++++++++++++++++++++++++++++------------------- 1 files changed, 37 insertions(+), 19 deletions(-) diff --git a/hive-app/pages/workbench/index.vue b/hive-app/pages/workbench/index.vue index 963776b..69cc4f7 100644 --- a/hive-app/pages/workbench/index.vue +++ b/hive-app/pages/workbench/index.vue @@ -10,17 +10,18 @@ <text class="icon gray iconfont iconsousuo mr-15"></text> <text class="icon gray iconfont iconjiahao" @click.stop="isShow=!isShow"></text> </view> - <view class="popup-content" v-show="isShow"> - <view> - <text class="icon iconfont iconjiahao mr-5"></text> - <text>新增会员</text> - </view> - <view class="mt-10"> - <text class="icon iconfont iconsaomiao mr-5"></text> - <text>扫一扫</text> - </view> - </view> </view> + <popover class="popup-content" v-show="isShow"> + <view class="triangle"></view> + <view class="popup-item flex align-center"> + <text class="icon white iconfont iconjiahao mr-5"></text> + <text class="white font-14 popup-content-text">新增会员</text> + </view> + <view class="popup-item flex align-center"> + <text class="icon white iconfont iconsaomiao mr-5"></text> + <text class="white font-14 popup-content-text">扫一扫</text> + </view> + </popover> <view class="condition flex justify-between"> <view class="flex flex-v align-center"> <text class="font-17 white">0</text> @@ -146,7 +147,11 @@ </template> <script> + import popover from "../../components/popover/index.vue" export default{ + components:{ + popover + }, data(){ return{ isShow:false @@ -171,9 +176,6 @@ text-align: center; font-family: texticons; } - page{ - background: #F8F8F8; - } .container{ padding: 0 10px; } @@ -190,6 +192,7 @@ padding: 15px 0; border-radius: 4px; margin: 10px 0; + box-shadow:0 6px 6px rgba(237,234,244,0.5); } .title{ font-size: 14px; @@ -205,12 +208,27 @@ width: 25%; } .popup-content{ - background: #FFFFFF; - border: 1px solid #ABB1CC; - padding: 10px; - border-radius: 4px; position: absolute; - right: 10px; - top: 35px; + right: 9px; + top: 48px; + padding-left: 10px; + } + .triangle{ + width: 0; + height: 0; + border-width: 0 10px 10px; + border-style: solid; + border-color: transparent transparent #4c4c4c; + position: absolute; + top:-8px; + right: 5px; + } + .popup-content-text{ + width: 100%; + border-bottom: 1px solid gray; + padding: 10px 10px 10px 0; + } + .popup-content .popup-item:nth-last-of-type(1) .popup-content-text{ + border-bottom: 0; } </style> -- Gitblit v1.9.1