选择地址

src/components/iphLeftMenu.vue

@@ -4,7 +4,7 @@
  * @Author: dream
  * @Date: 2021-03-27 14:13:43
  * @LastEditors: dream
- * @LastEditTime: 2021-03-28 13:42:16
+ * @LastEditTime: 2021-03-31 14:16:45
 -->
 <template>
 	<scroll-view class="left-menu-main" scroll-y>
@@ -18,15 +18,15 @@
     <view
       class="menu-bar"
       :style="{
-        height: `${bar.height}rpx`,
-        top: `${bar.top}rpx`
+        height: `${bar.height}px`,
+        top: `${bar.top}px`
       }"
     ></view>
     <view
       class="menu-content-bar"
       :style="{
-        height: `${contentBar.height}rpx`,
-        top: `${contentBar.top}rpx`
+        height: `${contentBar.height}px`,
+        top: `${contentBar.top}px`
       }"
     ></view>
   </scroll-view>
@@ -48,12 +48,12 @@ export default {
   data () {
     return {
       bar: {
-        top: 32,
-        height: 28
+        top: 16,
+        height: 14
       },
       contentBar: {
         top: 0,
-        height: 92
+        height: 46
       }
     }
   },
@@ -71,15 +71,15 @@ export default {
           scrollOffset: true
         }, res => {
           if (data) {
-            this.bar.top = (data.top - res.top + res.scrollTop + 16) * 2
-            this.bar.height = (data.height - 32) * 2
-            this.contentBar.top = (data.top - res.top + res.scrollTop) * 2
-            this.contentBar.height = data.height * 2
+            this.bar.top = data.top - res.top + res.scrollTop + 16
+            this.bar.height = data.height - 32
+            this.contentBar.top = data.top - res.top + res.scrollTop
+            this.contentBar.height = data.height
           } else {
-            this.bar.top = 32
-            this.bar.height = 28
+            this.bar.top = 16
+            this.bar.height = 14
             this.contentBar.top = 0
-            this.contentBar.height = 92
+            this.contentBar.height = 46
           }
         }).exec()
       }).exec()

src/pageSubs/address/list.vue

@@ -4,29 +4,110 @@
  * @Author: dream
  * @Date: 2021-03-26 14:15:06
  * @LastEditors: dream
- * @LastEditTime: 2021-03-26 14:15:55
+ * @LastEditTime: 2021-03-31 15:42:04
 -->
 <template>
-	<view>Address List</view>
+	<view class="address-list-main" :style="{paddingBottom: `${pagePaddingBottom}px`}">
+    <block v-for="(item, index) in addressList" :key="index">
+      <view class="address-card iph-bg-fff u-m-b-16">
+        <view class="u-flex">
+          <view class="default-tip" v-if="item.isDefault">默认</view>
+          <view class="u-flex-1 u-font-30 u-line-42 text-weight-500">{{item.name}}</view>
+          <view class="u-font-28 u-line-40 text-weight-500">{{item.phone}}</view>
+        </view>
+        <view class="address u-border-bottom u-m-t-16 u-p-b-32 u-line-1">{{item.address}}</view>
+        <view class="u-flex u-row-between u-m-t-18">
+          <u-checkbox v-model="item.isDefault" shape="circle" icon-size="28" :label-disabled="false">
+            <text class="u-m-l-24 u-font-22 u-line-32">设为默认地址</text>
+          </u-checkbox>
+          <view class="u-flex u-row-right">
+            <view class="oper-icon iph-icon-del"></view>
+            <view class="oper-icon u-m-l-62 iph-icon-update"></view>
+          </view>
+        </view>
+      </view>
+    </block>
+    <iph-fixed-bottom @getHeight="getFooterHeight">
+      <navigator class="footer iph-bg-fff" url="./add">
+        <button class="add-address-btn">添加收货地址</button>
+      </navigator >
+    </iph-fixed-bottom>
+  </view>
 </template>
 
 <script>
+import iphFixedBottom from '@/components/iphFixedBottom.vue'
 export default {
+  components: { iphFixedBottom },
   name: 'addressList',
   data () {
     return {
-
+      pagePaddingBottom: 0,
+      addressList: [{
+        isDefault: true,
+        name: '周科钧',
+        phone: '137*****033',
+        address: '浙江省杭州市滨江区滨康路619号德邦电子3幢509慕玛披萨电子3幢509慕玛披萨'
+      }, {
+        isDefault: false,
+        name: '周科钧',
+        phone: '137*****033',
+        address: '浙江省杭州市滨江区滨康路619号德邦电子3幢509慕玛披萨电子3幢509慕玛披萨'
+      }]
     }
   },
-  onLoad () {
-
-  },
   methods: {
-
+    getFooterHeight (val) {
+      this.pagePaddingBottom = val
+    }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-
+.address-list-main {
+  .address-card {
+    padding: 32px;
+    .default-tip {
+      margin-right: 16px;
+      padding: 0 8px;
+      border-radius: 4px;
+      line-height: 26px;
+      font-size: 18px;
+      color: $iph-standby-text;
+      background-color: $u-type-primary;
+    }
+    .address {
+      color: $iph-desc-text;
+    }
+    .oper-icon {
+      width: 40px;
+      height: 40px;
+    }
+    /deep/ .u-checkbox {
+      width: 100%;
+      .u-checkbox__label {
+        padding: 0;
+        width: 100%;
+        color: $iph-base-text;
+      }
+      .u-checkbox__icon-wrap--circle {
+        width: 28px !important;
+        height: 28px !important;
+        line-height: 44px;
+      }
+    }
+  }
+  .footer {
+    padding: 24px;
+    .add-address-btn {
+      padding: 22px 0;
+      font-size: 32px;
+      line-height: 44px;
+      color: $iph-standby-text;
+      background-color: $u-type-primary;
+      border-radius: 8px;
+    }
+  }
+}
 </style>

src/pages.json

@@ -77,7 +77,7 @@
     "pages": [{
       "path": "list",
 			"style": {
-				"navigationBarTitleText": "收货地址"
+				"navigationBarTitleText": "选择收货地址"
 			}
     }, {
       "path": "add",

src/pages/goods/goods.vue

@@ -4,7 +4,7 @@
  * @Author: dream
  * @Date: 2021-03-25 15:55:15
  * @LastEditors: dream
- * @LastEditTime: 2021-03-30 14:03:29
+ * @LastEditTime: 2021-03-31 14:10:13
 -->
 <template>
 	<view class="goods-main">
@@ -51,6 +51,7 @@ export default {
   name: 'goods',
   data () {
     return {
+      searchHeight: 0, // 搜索区域高度
       currentCateVal: 1,
       cateList: [{
         value: 1,
@@ -85,10 +86,18 @@ export default {
   computed: {
     mainHeight () {
       const system = this.$store.state.systemStore.systemInfo
-      const height = system.windowHeight - system.statusBarHeight - 106
+      const height = system.windowHeight - system.statusBarHeight - this.searchHeight - 48
       return height
     }
   },
+  onReady () {
+    const view = uni.createSelectorQuery().in(this).select('.goods-search-area')
+    view.fields({
+      size: true
+    }, data => {
+      this.searchHeight = data.height
+    }).exec()
+  },
   methods: {
     toGoodDetail () {
       uni.navigateTo({
@@ -109,6 +118,7 @@ export default {
     box-sizing: border-box;
     width: 100%;
     .main-left {
+      box-sizing: border-box;
       height: 100%;
     }
     .main-right {

src/pages/shopcat/shopcat.vue

@@ -7,7 +7,7 @@
  * @LastEditTime: 2021-03-30 15:58:55
 -->
 <template>
-	<view class="shopcat-main" :style="{ paddingBottom: `${pagePaddingBottom}px`}">
+	<view class="shopcat-main" :style="{paddingBottom: `${pagePaddingBottom}px`}">
     <view class="shop-header iph-bg-fff u-border-bottom">
       <u-checkbox class="checkall" v-model="checkedAll" icon-size="28" shape="circle" :label-disabled="false">
         <view class="u-flex u-m-l-32">

src/uni.scss

@@ -106,3 +106,13 @@ $iph-btn-disabel-bg: #999999;
   background: url('~@/static/common/icon_zt_right.png') no-repeat center center;
   background-size: contain;
 }
+
+.iph-icon-del {
+  background: url('~@/static/common/icon_dz_delete.png') no-repeat center center;
+  background-size: contain;
+}
+
+.iph-icon-update {
+  background: url('~@/static/common/icon_dz_bj.png') no-repeat center center;
+  background-size: contain;
+}