From a3885b6c56388f509dce290dbd2b9e6009e04647 Mon Sep 17 00:00:00 2001 From: queenwuli <942534046@qq.com> Date: Mon, 14 Dec 2020 14:51:05 +0800 Subject: [PATCH] gx --- hive-app/pages/workbench/index.vue | 101 ++++++++++++++++++++++++++++++++++++-------------- 1 files changed, 72 insertions(+), 29 deletions(-) diff --git a/hive-app/pages/workbench/index.vue b/hive-app/pages/workbench/index.vue index d6b8d68..963776b 100644 --- a/hive-app/pages/workbench/index.vue +++ b/hive-app/pages/workbench/index.vue @@ -5,32 +5,42 @@ <view class="status_bar"></view> <!-- #endif --> <view class="header flex align-center justify-between"> - <text class="font-18">HIVE</text> + <text class="font-18 dark-gray">HIVE</text> <view> - <image class="header-icon mr-15" src="../../static/images/search.png"></image> - <image class="header-icon" src="../../static/images/add.png"></image> + <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> - <view class="status-bar flex justify-between mt-15"> + <view class="condition flex justify-between"> <view class="flex flex-v align-center"> - <text class="font-18 white">0</text> - <text class="font-16 white">预约</text> + <text class="font-17 white">0</text> + <text class="font-15 white mt-10">预约</text> </view> <view class="flex flex-v align-center"> - <text class="font-18 white">2</text> - <text class="font-16 white">进行中</text> + <text class="font-17 white">2</text> + <text class="font-15 white mt-10">进行中</text> </view> <view class="flex flex-v align-center"> - <text class="font-18 white">5</text> - <text class="font-16 white">代付款</text> + <text class="font-17 white">5</text> + <text class="font-15 white mt-10">代付款</text> </view> <view class="flex flex-v align-center"> - <text class="font-18 white">15</text> - <text class="font-16 white">欠款</text> + <text class="font-17 white">15</text> + <text class="font-15 white mt-10">欠款</text> </view> </view> <view class="content-item mt-10"> - <text class="font-14 font-gray">订单</text> + <text class="title">订单</text> <view class="flex align-center mt-10"> <view class="flex flex-v align-center list-item"> <image class="content-icon" src="../../static/images/order1.png"></image> @@ -51,7 +61,7 @@ </view> </view> <view class="content-item mt-10"> - <text class="font-14 font-gray">项目/服务</text> + <text class="title">项目/服务</text> <view class="flex align-center mt-10"> <view class="flex flex-v align-center list-item"> <image class="content-icon" src="../../static/images/sever1.png"></image> @@ -72,7 +82,7 @@ </view> </view> <view class="content-item mt-10"> - <text class="font-14 font-gray">代办</text> + <text class="title">代办</text> <view class="flex align-center mt-10"> <view class="flex flex-v align-center list-item"> <image class="content-icon" src="../../static/images/commission1.png"></image> @@ -89,7 +99,7 @@ </view> </view> <view class="content-item mt-10"> - <text class="font-14 font-gray">仓库</text> + <text class="title">仓库</text> <view class="flex align-center mt-10"> <view class="flex flex-v align-center list-item"> <image class="content-icon" src="../../static/images/warehouse1.png"></image> @@ -102,7 +112,7 @@ </view> </view> <view class="content-item"> - <text class="font-14 font-gray">报表</text> + <text class="title">报表</text> <view class="flex align-center mt-10"> <view class="flex flex-v align-center list-item"> <image class="content-icon" src="../../static/images/statement1.png"></image> @@ -121,7 +131,7 @@ <text class="font-12 mt-10 font-dark">产品报表</text> </view> </view> - <view class="flex align-center mt-10"> + <view class="flex align-center mt-15"> <view class="flex flex-v align-center list-item"> <image class="content-icon" src="../../static/images/statement5.png"></image> <text class="font-12 mt-10 font-dark">库存预警</text> @@ -136,38 +146,71 @@ </template> <script> + export default{ + data(){ + return{ + isShow:false + } + }, + onLoad() { + document.addEventListener('click', () => { + this.isShow = false + }, false) + }, + methods:{ + appear(){ + + } + } + } </script> <style> + .icon { + font-size: 18px; + text-align: center; + font-family: texticons; + } page{ background: #F8F8F8; } .container{ - padding: 0 8px; + padding: 0 10px; } .header{ - padding: 10px 5px; + padding: 12px 5px; } - .header-icon{ - width: 20px; - height: 20px; - } - .status-bar{ + .condition{ background-color: #518EFF; - padding: 16px 30px; + padding: 15px 30px; border-radius: 4px; } .content-item{ background: #FFFFFF; - padding:16px; + padding: 15px 0; border-radius: 4px; margin: 10px 0; } + .title{ + font-size: 14px; + color: #666666; + padding-left: 15px; + padding-bottom: 5px; + } .content-icon{ - width: 32px; - height: 32px; + width: 30px; + height: 30px; } .list-item{ width: 25%; } + .popup-content{ + background: #FFFFFF; + border: 1px solid #ABB1CC; + padding: 10px; + border-radius: 4px; + position: absolute; + right: 10px; + top: 35px; + } </style> -- Gitblit v1.9.1