--增加地址管理页面

--编辑地址页面
--地址列表组件
--个人资料编辑页面

src/components/AddressList/index.scss

@@ -0,0 +1,75 @@
+.address-scroll-view{
+  height: 100%;
+  box-sizing: border-box;
+  position: relative;
+  scroll-view{
+    height: 100%;
+    box-sizing: border-box;
+  }
+  
+  .address-list{
+    width: 704px;
+    height: 156px;
+    background: #ffffff;
+    border-radius: 20px;
+    box-shadow: 2px 4px 12px 0px rgba(0,0,0,0.16); 
+    padding: 30px;
+    box-sizing: border-box;
+    margin: 18px auto 0;
+  }
+  .address-list:hover{
+    border: 1px solid #68b4ff;
+    box-shadow: 0px 0px 10px 0px rgba(0,122,255,0.27); 
+  }
+  .address-list:last-child{
+    margin-bottom: 300px;
+  }
+  .address-user{
+    font-size: 28px;
+    font-family: Microsoft YaHei, Microsoft YaHei-Bold;
+    font-weight: 700;
+    text-align: left;
+    color: #000000;
+    display: flex;align-items: center;
+  }
+  .address-list-default{
+    width: 58px;
+    height: 28px;
+    background: #cde5ff;
+    border-radius: 6px;
+    font-size: 20px;
+    font-weight: 400;
+    text-align: center;
+    color: #007aff;
+    margin-left: 30px;
+
+  }
+  .address-list-phone{
+    font-size: 24px;
+    font-weight: 400;
+    color: #ababab;
+    margin-left: 30px;
+  }
+
+  .address-list-info{
+    font-size: 24px;
+    font-weight: 400;
+    color: #3c3c3c;
+  }
+  .address-list-bottom{
+    display: flex;justify-content: space-between;
+    margin-top: 18px;
+  }
+  .add-address{
+    width: 668px;
+    height: 82px;
+    background: #007aff;
+    border-radius: 40px;
+    font-size: 32px;
+    font-weight: 400;
+    color: #ffffff;
+    display: flex;align-items: center;justify-content: center;
+    position: absolute;bottom: 8%;left: 50%;
+    transform: translateX(-50%);
+  }
+}

src/components/AddressList/index.tsx

@@ -0,0 +1,53 @@
+
+import { Button, ScrollView, Text, View } from "@tarojs/components"
+import { useState } from "react"
+import "./index.scss"
+
+interface Params{
+  refresherEnabled?: boolean,//是否开启刷新
+  onSelect?: (item:any,index:number)=>void,//列表选择
+
+}
+
+// 地址列表
+const AddressList = (props:Params)=>{
+  // 处理刷新
+  const [refreshState, setRefreshState] = useState(false);
+  const handleRefresh = ()=>{
+    setRefreshState(true);
+    setTimeout(()=>{
+      setRefreshState(false);
+    },3000)
+    
+  }
+
+  return (
+    <View className="address-scroll-view">
+      <ScrollView scrollY refresherEnabled={props.refresherEnabled} enhanced refresherTriggered={refreshState} onRefresherRefresh={handleRefresh}>
+        {
+          Array.from({length:15}).map((item,index)=>{
+            return(
+              <View onClick={()=>props.onSelect&&props.onSelect(item,index)} className="address-list">
+                <View className="address-user">
+                  XL纺织
+                  <Text className="address-list-default">默认</Text>
+                  {/* <Text className="address-list-phone">1656488999</Text> */}
+                </View>
+                <View className="address-list-bottom">
+                  <View className="address-list-info">
+                    **省**市**区**街道****仓库
+                    <Text className="address-list-phone">181****9790</Text>
+                  </View>
+                  <View className="address-edit">1</View>
+                </View>
+              </View>
+            );
+          })
+        }
+      </ScrollView>
+      <Button hoverClass="none" className="add-address">添加收货地址</Button>
+    </View>
+  )
+}
+
+export default AddressList;

src/components/address/index.module.scss

@@ -15,7 +15,7 @@
         margin-top: 10px;
         font-size: $font_size_medium;
         border-bottom: 1px solid $color_font_two;
-        color: $common_title_font_color;
+        color: $color_font_two;
         position: relative;
         .address_item{
             padding: 0 20px;
@@ -37,7 +37,7 @@
         height: 600px;
         .address_scroll_list{
             padding: 0 20px;
-            font-size: $common_main_font_size2;
+            font-size: $font_size;
             .address_list_item{
                 padding: 20px 0;
                 display: flex;
@@ -54,6 +54,6 @@
         
     }
     .addresst_select{
-        color:$color_font_two;
+        color:$color_font_one;
     }
 }