LAPTOP-2OQMQSSM\ASUS il y a 7 mois
Parent
commit
2fbaff526a
3 fichiers modifiés avec 124 ajouts et 108 suppressions
  1. 16 1
      common/css/common.css
  2. 32 39
      pages-takeout/new-shop.vue
  3. 76 68
      pages/index/index.vue

+ 16 - 1
common/css/common.css

@@ -572,6 +572,10 @@ text {
   background-color: #FF3333;
 }
 
+.bgc-FE6B2C {
+  background-color: #FE6B2C;
+}
+
 .bgc-FCEDED {
   background-color: #FCEDED;
 }
@@ -580,6 +584,11 @@ text {
   background-color: #FAE5E2;
 }
 
+.bgc-F7F8FA {
+  background-color: #F7F8FA;
+}
+
+
 .bgc-F5811E {
   background-color: #F5811E;
 }
@@ -700,6 +709,10 @@ text {
   padding: 32rpx;
 }
 
+.pr-8 {
+  padding-right: 8rpx;
+}
+
 .pr-14 {
   padding-right: 14rpx;
 }
@@ -751,7 +764,9 @@ text {
 .pb-36 {
   padding-bottom: 36rpx;
 }
-
+.pb-130 {
+  padding-bottom: 130rpx;
+}
 .plr-12 {
   padding: 0 12rpx;
 }

+ 32 - 39
pages-takeout/new-shop.vue

@@ -48,8 +48,8 @@
     </view>
 
     <!-- <view class="bgc-f sticky-nav" :style="{ height: navBgType?`calc(100vh - ${newNavHeight}rpx - ${48}rpx)`:'auto'}"> -->
-    <view class="bgc-f">
-      <view class="menu-box box-border-box align-items-flex-start" v-if="shopType === 1">
+    <view class="bgc-F7F8FA">
+      <view class="menu-box box-border-box align-items-flex-start pb-130" v-if="shopType === 1">
 
         <view class="menu-box-left" :style="{top: newNavHeight + 'rpx'}">
           <view class="menu-box-left-box"
@@ -63,7 +63,7 @@
           </view>
         </view>
 
-        <view class="menu-box-only">
+        <view class="menu-box-only bgc-f">
           <view class="" v-for="(item,i) in categoryData" :key="i" :id="'scroll'+ item.type">
             <view class="fs-28 fw-600 fc-3 sticky-nav bgc-f p-20 box-border-box" :style="{top: newNavHeight + 'rpx'}">
               {{item.name}}
@@ -113,24 +113,22 @@
       <ShopInfo style="height: 100%;" :shopId='shop_id' v-else-if="shopType === 2"></ShopInfo>
     </view>
 
-    <!--    <view v-if="shopType === 1" class="shop-buttom-money box-border-box" @click="openBuyCrad()">
-      <view class="shop-buttom-money-1 flex-justify-space align-items-center">
-        <image src="@/static/img/takeout/buy-icon.png" mode="scaleToFill"></image>
-        <view class="shop-buttom-num fs-24 fc-f text-align-center">{{cartData.total_num}}</view>
-        <view class="">
-          <view class="">
-            <span class="fw-600 fs-24 fc-f">¥</span>
-            <span class="fw-600 fs-44 fc-f">{{cartData.total_price}}</span>
+    <view v-if="shopType === 1" class="shop-buttom-money box-border-box" @click="openBuyCrad()">
+      <view class="shop-buttom-money-1 bgc-f flex-justify-space align-items-center pl-24 box-border-box pr-8">
+        <view class="align-items-center">
+          <image class="gwc-img mr-36" src="@/static/img/order-food/gwc-img.png" mode="scaleToFill"></image>
+          <view class="shop-buttom-num bgc-FE6B2C fs-24 fc-f text-align-center">{{cartData.total_num}}</view>
+          <view class="align-items-baseline">
+            <view class="fw-600 fs-28 fc-3 mr-4">¥</view>
+            <view class="fw-600 fs-48 fc-3">{{cartData.total_price}}</view>
           </view>
-          <view class="fs-24 fc-ADADAD" v-if="delivery_money<=0">免配送</view>
-          <view class="fs-24 fc-f" v-else>配送费¥{{delivery_money}}</view>
         </view>
-        <view v-if="cartData.is_place_order===1" class="shop-buttom-money-2 text-align-center fc-f fs-32 fw-600"
+        
+        <view class="shop-buttom-money-2 text-align-center fc-f fs-32 fw-600 b-rad-200"
           @click.stop="toConfirmOrder()">去结算
         </view>
-        <view v-else class="err-msg fs-32 fw-600 fc-f mr-30" @click.stop="mustBut">{{cartData.err_msg}}</view>
       </view>
-    </view> -->
+    </view>
   </view>
 </template>
 
@@ -531,7 +529,7 @@
           if (this.shopType == 1) {
             this.shopTypeBsLeft = 12
           } else if (this.shopType == 2) {
-            this.shopTypeBsLeft = 166
+            this.shopTypeBsLeft = 150
           } else {
             this.shopTypeBsLeft = 160 * 2
           }
@@ -759,9 +757,13 @@
 
   .shop-buttom-money {
     width: 100%;
-    height: 140rpx;
+    // height: 140rpx;
     background: rgba(255, 255, 255, 0.8);
-    padding: 20rpx 24rpx;
+    padding-left: 24rpx;
+    padding-right: 24rpx;
+    padding-bottom: calc(env(safe-area-inset-bottom) + 12rpx);
+    padding-top: 22rpx;
+    // padding: 20rpx 24rpx;
     position: fixed;
     left: 0;
     bottom: 0;
@@ -772,19 +774,18 @@
     width: 32rpx;
     height: 32rpx;
     line-height: 32rpx;
-    background: #FB3D03;
     border-radius: 50%;
     position: absolute;
-    top: 36rpx;
-    left: 82rpx;
+    top: 0rpx;
+    left: 85rpx;
+    border: 1rpx solid #FFFFFF;
   }
 
   .shop-buttom-money-2 {
     width: 200rpx;
-    height: 100rpx;
-    line-height: 100rpx;
-    background: #41ABF5;
-    border-radius: 0rpx 200rpx 200rpx 0rpx;
+    height: 80rpx;
+    line-height: 80rpx;
+    background: linear-gradient(270deg, #FF3333 0%, #FE6122 100%);
   }
 
   .info-box-top {}
@@ -835,21 +836,13 @@
 
   .shop-buttom-money-1 {
     width: 100%;
-    height: 100%;
-    background: #333333;
-    border-radius: 200rpx;
-    box-sizing: border-box;
-    padding-left: 136rpx;
-    // padding-right: 32rpx;
+    height: 96rpx;
     position: relative;
+  }
 
-    image {
-      position: absolute;
-      bottom: 0;
-      left: 8rpx;
-      width: 128rpx;
-      height: 128rpx;
-    }
+  .gwc-img {
+    width: 88rpx;
+    height: 88rpx;
   }
 
   .head-box {

+ 76 - 68
pages/index/index.vue

@@ -1,46 +1,47 @@
 <template>
-	<view class="flex-common-css">
-		<Nav :leftShow='false' :customNav='true' title="" bgckgroundBox='#EF1F0C'></Nav>
-		<view class="flex-1 flex-direction iPhone-bottom box-border-box">
-			<image class="qd-bg" src="@/static/img/order-food/qd-bg.png"  mode=""></image>
-			<view class="order-food-box p-0-32 box-border-box">
-				<view class="order-food p-32 box-border-box bgc-f b-rad-24" @click="login()">
-					<view class="b-FFD7CC bc-FFEDE9-FFF1EE b-rad-24 p-20-32 box-border-box align-items-center flex-justify-space">
-						<view class="flex-direction">
-							<view class="align-items-center mb-8">
-								<view class="fs-36 fc-3 fw-600">
-									堂食扫码点餐
-								</view>
-								<image class="right-h" src="@/static/img/order-food/right-h.png" mode=""></image>
-							</view>
-							<view class="fs-28 fc-9">
-								自助下单方便快捷
-							</view>
-						</view>
-						<image class="zh-img" src="@/static/img/order-food/zh-img.png" mode=""></image>
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
+  <view class="flex-common-css">
+    <Nav :leftShow='false' :customNav='true' title="" bgckgroundBox='#EF1F0C'></Nav>
+    <view class="flex-1 flex-direction iPhone-bottom box-border-box">
+      <image class="qd-bg" src="@/static/img/order-food/qd-bg.png" mode=""></image>
+      <view class="order-food-box p-0-32 box-border-box">
+        <view class="order-food p-32 box-border-box bgc-f b-rad-24" @click="login()">
+          <view class="b-FFD7CC bc-FFEDE9-FFF1EE b-rad-24 p-20-32 box-border-box align-items-center flex-justify-space">
+            <view class="flex-direction">
+              <view class="align-items-center mb-8">
+                <view class="fs-36 fc-3 fw-600">
+                  堂食扫码点餐
+                </view>
+                <image class="right-h" src="@/static/img/order-food/right-h.png" mode=""></image>
+              </view>
+              <view class="fs-28 fc-9">
+                自助下单方便快捷
+              </view>
+            </view>
+            <image class="zh-img" src="@/static/img/order-food/zh-img.png" mode=""></image>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	import {appletLogin} from "@/api/member";
+  import {
+    appletLogin
+  } from "@/api/member";
   import tools from "@/service/tools";
 
   export default {
-		components: {},
-		data() {
-			return {}
-		},
-		onLoad(data) {
+    components: {},
+    data() {
+      return {}
+    },
+    onLoad(data) {
       this.login()
     },
-		mounted() {},
-		methods: {
-      login(){
-
+    mounted() {},
+    methods: {
+      login() {
         uni.login({
           provider: "weixin",
           success: (loginRes) => {
@@ -52,43 +53,50 @@
           },
         });
       },
-      appletLogin(code){
-        appletLogin({'code':code}).then(res=>{
-
+      appletLogin(code) {
+        appletLogin({
+          'code': code
+        }).then(res => {
+          this.goToUrl()
         })
       },
-			goToUrl(shop_id) {
-				uni.reLaunch({
-					url: '/pages-takeout/shop?shop_id=' + shop_id
-				});
-			}
-		}
-	}
+      goToUrl(shop_id) {
+        uni.reLaunch({
+          url: '/pages-takeout/shop?shop_id=' + shop_id
+        });
+      }
+    }
+  }
 </script>
 
 <style lang="scss" scoped>
-.qd-bg{
-	width: 100%;
-	height: 696rpx;
-}
-.order-food-box{
-	position: relative;
-}
-.order-food{
-	width: calc(100% - 64rpx);
-	position: absolute;
-	left: 32rpx;
-	top: -90rpx;
-}
-.bc-FFEDE9-FFF1EE{
-	background: linear-gradient( 90deg, #FFEDE9 0%, #FFF1EE 100%);
-}
-.zh-img {
-	width: 148rpx;
-	height: 148rpx;
-}
-.right-h{
-	width: 40rpx;
-	height: 40rpx;
-}
+  .qd-bg {
+    width: 100%;
+    height: 696rpx;
+  }
+
+  .order-food-box {
+    position: relative;
+  }
+
+  .order-food {
+    width: calc(100% - 64rpx);
+    position: absolute;
+    left: 32rpx;
+    top: -90rpx;
+  }
+
+  .bc-FFEDE9-FFF1EE {
+    background: linear-gradient(90deg, #FFEDE9 0%, #FFF1EE 100%);
+  }
+
+  .zh-img {
+    width: 148rpx;
+    height: 148rpx;
+  }
+
+  .right-h {
+    width: 40rpx;
+    height: 40rpx;
+  }
 </style>