From 0a88dcd28ace3720a9735c1956efc1a95742d45a Mon Sep 17 00:00:00 2001 From: li tong bao <2903733959@qq.com> Date: Wed, 20 Apr 2022 11:08:45 +0800 Subject: [PATCH] =?UTF-8?q?--=E5=A2=9E=E5=8A=A0=E5=9C=B0=E5=9D=80=E7=AE=A1?= =?UTF-8?q?=E7=90=86=E9=A1=B5=E9=9D=A2=20--=E7=BC=96=E8=BE=91=E5=9C=B0?= =?UTF-8?q?=E5=9D=80=E9=A1=B5=E9=9D=A2=20--=E5=9C=B0=E5=9D=80=E5=88=97?= =?UTF-8?q?=E8=A1=A8=E7=BB=84=E4=BB=B6=20--=E4=B8=AA=E4=BA=BA=E8=B5=84?= =?UTF-8?q?=E6=96=99=E7=BC=96=E8=BE=91=E9=A1=B5=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app.config.ts | 12 +++ src/components/AddressList/index.scss | 75 +++++++++++++ src/components/AddressList/index.tsx | 53 ++++++++++ src/components/address/index.module.scss | 6 +- src/pages/addAddress/index.config.ts | 3 + src/pages/addAddress/index.scss | 64 ++++++++++++ src/pages/addAddress/index.tsx | 76 ++++++++++++++ src/pages/addressManager/index.config.ts | 3 + src/pages/addressManager/index.scss | 3 + src/pages/addressManager/index.tsx | 15 +++ src/pages/userEdit/index.scss | 127 +++++++++++++++++++++++ src/pages/userEdit/index.tsx | 82 ++++++++++++++- 12 files changed, 511 insertions(+), 8 deletions(-) create mode 100644 src/components/AddressList/index.scss create mode 100644 src/components/AddressList/index.tsx create mode 100644 src/pages/addAddress/index.config.ts create mode 100644 src/pages/addAddress/index.scss create mode 100644 src/pages/addAddress/index.tsx create mode 100644 src/pages/addressManager/index.config.ts create mode 100644 src/pages/addressManager/index.scss create mode 100644 src/pages/addressManager/index.tsx diff --git a/src/app.config.ts b/src/app.config.ts index d3cc194..487ef1c 100644 --- a/src/app.config.ts +++ b/src/app.config.ts @@ -59,6 +59,18 @@ export default { pages: [ "index" ] + }, + { + root: "pages/addressManager", + pages: [ + "index" + ] + }, + { + root: "pages/addAddress", + pages: [ + "index" + ] } ] } diff --git a/src/components/AddressList/index.scss b/src/components/AddressList/index.scss new file mode 100644 index 0000000..bbb4a69 --- /dev/null +++ b/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%); + } +} \ No newline at end of file diff --git a/src/components/AddressList/index.tsx b/src/components/AddressList/index.tsx new file mode 100644 index 0000000..c999aa8 --- /dev/null +++ b/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 ( + + + { + Array.from({length:15}).map((item,index)=>{ + return( + props.onSelect&&props.onSelect(item,index)} className="address-list"> + + XL纺织 + 默认 + {/* 1656488999 */} + + + + **省**市**区**街道****仓库 + 181****9790 + + 1 + + + ); + }) + } + + + + ) +} + +export default AddressList; \ No newline at end of file diff --git a/src/components/address/index.module.scss b/src/components/address/index.module.scss index a19253c..49b5975 100644 --- a/src/components/address/index.module.scss +++ b/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; } } diff --git a/src/pages/addAddress/index.config.ts b/src/pages/addAddress/index.config.ts new file mode 100644 index 0000000..367665a --- /dev/null +++ b/src/pages/addAddress/index.config.ts @@ -0,0 +1,3 @@ +export default { + navigationBarTitleText: '新增收货地址' +} diff --git a/src/pages/addAddress/index.scss b/src/pages/addAddress/index.scss new file mode 100644 index 0000000..b77fdba --- /dev/null +++ b/src/pages/addAddress/index.scss @@ -0,0 +1,64 @@ +.add-address{ + + .form-list{ + display: flex; + justify-content: space-between; + margin: 30px 30px 0; + } + .form-list-label{ + font-size: 28px; + font-weight: 700; + color: #000000; + margin-top: 20px; + } + .form-list-right{ + width: 506px; + min-height: 80px; + background: #f6f6f6; + border-radius: 20px; + padding: 10px 20px; + box-sizing: border-box; + font-size: 26px; + font-weight: 400; + display: flex;justify-content: space-between; + align-items: center; + } + .form-list-right input,.form-list-right textarea{ + flex: 0 0 auto; + min-height: 100%; + width: 100%; + color: #000000; + } + .form-list-right textarea{ + height: 186px; + border-radius: 10px; + } + .form-list-right .phcolor{ + color: #ababab; + } + .form-list-right-placeholder{ + color: #ababab; + } + .form-list-right-enter{ + + } + .add-address-default{ + display: flex;align-items: center;justify-content: space-between; + margin: 70px 30px 0; + font-size: 26px; + font-weight: 700; + color: #000000; + } + + .add-address-save{ + 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; + margin: 620px auto 0; + } +} \ No newline at end of file diff --git a/src/pages/addAddress/index.tsx b/src/pages/addAddress/index.tsx new file mode 100644 index 0000000..7ed107f --- /dev/null +++ b/src/pages/addAddress/index.tsx @@ -0,0 +1,76 @@ + +import Address from "@/components/address" +import { Button, Input, Text, Textarea, View } from "@tarojs/components" +import { useState } from "react" +import "./index.scss" + +export default ()=>{ + const [showSiteModal, setShowSiteModal] = useState(false); + const handleSelectSite = ()=>{ + setShowSiteModal(true); + } + + // 保存 + const [formData, setFormData] = useState({ + aa: "", + bb:"", + cc:"", + dd:"" + }) + const handleSave = ()=>{ + + } + + return ( + + + + + + + 设为默认地址 + 1 + + + +
setShowSiteModal(false)} show={showSiteModal}/> + + ) +} + +// 表单列表 +const FromList = (props:ListParams)=>{ + const {type="input",value=""} = props; + + return ( + + {props.label} + + { + props.children??( + type=="input"?: + type=="textarea"?