From 53ad1e956838a9b5a21380a6b20e6f4f90f37f7e Mon Sep 17 00:00:00 2001
From: songbingqi <2272578756@qq.com>
Date: Tue, 21 Jun 2022 01:23:24 +0800
Subject: [PATCH] 修改 店铺选择 页面

---
 menuSubPackage/pages/areaSelect/areaSelect.vue | 163 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-----------------------------------------------------
 pages.json                                     |   2 +-
 pages/menu/menu.vue                            |   7 +++++++
 pages/mine/mine.vue                            |   4 ++++
 static/imgs/qupinchang.png                     | Bin 0 -> 1318 bytes
 5 files changed, 122 insertions(+), 54 deletions(-)
 create mode 100644 static/imgs/qupinchang.png

diff --git a/menuSubPackage/pages/areaSelect/areaSelect.vue b/menuSubPackage/pages/areaSelect/areaSelect.vue
index b220f43..6735f3e 100644
--- a/menuSubPackage/pages/areaSelect/areaSelect.vue
+++ b/menuSubPackage/pages/areaSelect/areaSelect.vue
@@ -1,17 +1,36 @@
 <template>
     <view ew class="product-list">
+        <view class="provice_city">
+            <view class="text">
+                <text>{{areaName.proviceName}}-</text>
+                <text v-show="areaName.proviceName!=areaName.cityName">{{areaName.cityName}}-</text>
+                <text>{{areaName.disName}}</text>
+            </view>
+            <view class="icon">
+                <image :style="{'height':'100%','width':'100%'}"  :src="'../../../static/imgs/jiantouhei.png'" />
+            </view>
+        </view>
         <div v-for="item in list" :key="item.id" @click="selectedShop(item)" class="shop_item">
             <div class="header">
                 <h3>{{ item.name }}</h3>
-                <span v-if="item.distance && item.distance!=-1">距离 {{ item.distance }}</span>
+                <view class="adressBox">
+                    <view>
+                        <u-icon class="map" name="map" color="#999999" size="14"></u-icon>
+                    </view>
+                    <view class="address">{{ item.address }}</view>
+                </view>
+                <view class="timeBox">
+                    <view>
+                        <u-icon name="clock" color="#999999" size="14"></u-icon>
+                    </view>
+                    <view class="time">{{ item.startTime }} - {{ item.endTime }}</view>
+                </view>
             </div>
+            <view class="line"></view>
             <div class="dec">
-                <div class="address">{{ item.address }}</div>
-                <a class="xaidan">去下单</a>
-            </div>
-            <div class="time">
-                <u-icon name="clock" color="#2979ff" size="16"></u-icon>
-                <div>营业时间:{{ item.startTime }} - {{ item.endTime }}</div>
+                <view :style="{'height':'34rpx'}" v-show="item.distance && item.distance!=-1"></view>
+                <view class="goshop"></view>
+                <view :style="{'height':'34rpx'}" class="distance" v-show="item.distance && item.distance!=-1">距离 {{ item.distance }}</view>
             </div>
         </div>
     </view>
@@ -25,11 +44,13 @@ export default {
         return {
             show: true,
             columns: [],
-            list: []
+            list: [],
+            areaName:{}
         }
     },
     onShow() {
         this.list = uni.getStorageSync('shops');
+        this.areaName = uni.getStorageSync('areaName')
     },
     methods: {
         selectedShop(item) {
@@ -42,72 +63,108 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.product-list{
+    background: #F2F2F2;
+    height:100vh ;
+    overflow: auto;
+}
+
+.provice_city{
+    height: 62rpx;
+    background: #FFFFFF;
+    display: flex;
+    justify-content: flex-start;
+    padding: 12rpx 32rpx;
+    align-items: center;
+    .text{
+        font-size: 26rpx;
+        font-family: PingFangSC-Semibold, PingFang SC;
+        font-weight: 600;
+        color: #000000;
+        line-height: 36rpx;
+    }
+    .icon {
+        width: 22rpx;
+        margin-left: 16rpx;
+        height: 24rpx;
+        display: flex;
+        align-items: center;
+    }
+}
 .shop_item {
     width: 90%;
-    height: 264rpx;
+    min-height: 264rpx;
     background: #FFFFFF;
-    border-radius: 10rpx;
-    border: 2rpx solid #006ECF;
-    padding: 32rpx;
+    border: 1px solid #003AE9;
+    padding: 25rpx 32rpx;
     box-sizing: border-box;
     margin: 30rpx auto;
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
 
     .header {
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-
+        margin-right: 30rpx;
         h3 {
             font-size: 28rpx;
             font-family: PingFangSC-Medium, PingFang SC;
             font-weight: 500;
-            color: #000000;
+            color: #333333;
         }
-
-        span {
-            font-size: 24rpx;
-            font-family: PingFangSC-Regular, PingFang SC;
-            font-weight: 400;
-            color: #666666;
+        .adressBox{
+            width: 348rpx;
+            margin-top: 14rpx;
+            display: flex;
+            justify-content: flex-start;
+            .address{
+                margin-left: 12rpx;
+                font-size: 24rpx;
+                font-family: PingFangSC-Regular, PingFang SC;
+                font-weight: 400;
+                color: #999999;
+            }
+        }
+        .timeBox{
+            margin-top: 11rpx;
+            display: flex;
+            align-items: center;
+            justify-content: flex-start;
+            .time{
+                margin-left: 12rpx;
+                font-size: 24rpx;
+                font-family: ArialMT;
+                color: #999999;
+            }
         }
     }
-
+    .line {
+        height: 146rpx;
+        border: 1rpx solid #979797;
+    }
     .dec {
+        margin-left: 43rpx;
         display: flex;
-        justify-content: space-between;
-        margin-top: 22rpx;
-
-        .address {
-            font-size: 24rpx;
-            font-family: PingFangSC-Regular, 
+        flex-direction: column;
+        height: 146rpx;
+        justify-content: space-around;
+        view{
+            vertical-align: baseline;
+        }
+        .goshop {
+            width: 167rpx;
+            height: 64rpx;
+		    background: url('@/static/imgs/qupinchang.png') center center no-repeat;
         }
 
-        .xaidan {
+        .distance {
             font-size: 24rpx;
-            font-family: PingFangSC-Medium, PingFang SC;
-            font-weight: 500;
-            color: #FFFFFF;
-            width: 150rpx;
-			min-width: 150rpx;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #999999;
             text-align: center;
-            height: 40rpx;
-            line-height: 40rpx;
-            background: #006ECF;
-            border-radius: 6px;
-            display: block;
-            margin-left: 20rpx;
+            line-height: 50rpx;
         }
-    }
-
-    .time {
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        font-size: 20rpx;
-        font-family: PingFangSC-Regular, PingFang SC;
-        font-weight: 400;
-        color: #333333;
-        margin-top: 30rpx;
+     
     }
 }
 </style>
\ No newline at end of file
diff --git a/pages.json b/pages.json
index 64b7fe8..572d658 100644
--- a/pages.json
+++ b/pages.json
@@ -42,7 +42,7 @@
         {
           "path": "pages/areaSelect/areaSelect",
           "style": {
-            "navigationBarTitleText": "",
+            "navigationBarTitleText": "选择门店",
             "enablePullDownRefresh": false
           }
         }
diff --git a/pages/menu/menu.vue b/pages/menu/menu.vue
index 83e3f75..b933fe6 100644
--- a/pages/menu/menu.vue
+++ b/pages/menu/menu.vue
@@ -188,10 +188,17 @@ export default {
 		changeHandler() { },
 		confirm(res) {
 			const { value } = res;
+			console.log(value)
+			const areaName = {
+				proviceName:value[0]&&value[0].name,
+				cityName:value[1]&&value[1].name,
+				disName:value[2]&&value[2].name
+			}
 			const shops = value[2].shops;
 			this.show = false;
 			// console.log(shops);
 			uni.setStorageSync('shops', shops);
+			uni.setStorageSync('areaName', areaName);
 			uni.navigateTo({ url: '/menuSubPackage/pages/areaSelect/areaSelect' })
 		},
 		// 手机号授权登录
diff --git a/pages/mine/mine.vue b/pages/mine/mine.vue
index d6963cb..8a0d03e 100644
--- a/pages/mine/mine.vue
+++ b/pages/mine/mine.vue
@@ -167,6 +167,7 @@ button::after {
 }
 
 .mod11 {
+	border-radius: 0rpx;
 	box-sizing: border-box;
 	padding: 32rpx;
 	width: 686rpx;
@@ -195,6 +196,9 @@ button::after {
 		border-radius: 50%;
 	}
 }
+.mod11::after{
+	border-radius: 0rpx;
+}
 
 .contents {
 	display: flex;
diff --git a/static/imgs/qupinchang.png b/static/imgs/qupinchang.png
new file mode 100644
index 0000000..4add2eb
Binary files /dev/null and b/static/imgs/qupinchang.png differ
--
libgit2 0.26.0