--我的页面修改
This commit is contained in:
parent
83a5393949
commit
dc30fc43c4
@ -6,6 +6,9 @@
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
scroll-view>view{
|
||||
display: flex;flex-direction: column;
|
||||
}
|
||||
|
||||
.address-list{
|
||||
width: 704px;
|
||||
@ -25,7 +28,7 @@
|
||||
.address-list:first-child{
|
||||
margin-top: 0;
|
||||
}
|
||||
.address-list:last-child{
|
||||
.address-list-last{
|
||||
margin-bottom: 300px;
|
||||
}
|
||||
.address-user{
|
||||
@ -62,6 +65,13 @@
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
color: #3c3c3c;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
}
|
||||
.address-list-info view{
|
||||
width: 50%;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;white-space: nowrap;
|
||||
}
|
||||
.address-list-bottom{
|
||||
display: flex;justify-content: space-between;
|
||||
|
||||
@ -81,26 +81,28 @@ const AddressList = memo((props:Params)=>{
|
||||
return (
|
||||
<View className="address-scroll-view">
|
||||
<ScrollView scrollY refresherEnabled={props.refresherEnabled} enhanced refresherTriggered={refreshState} onRefresherRefresh={handleRefresh}>
|
||||
<View>
|
||||
{
|
||||
state?.data?.list?.length>0?
|
||||
state?.data?.list?.map((item,index)=>{
|
||||
// data.length>0?
|
||||
// data.map((item,index)=>{
|
||||
return(
|
||||
<View onLongPress={()=>handleDelete(item)} onClick={()=>handleSelect(item,index)} className={`address-list ${focusId==item.id&&'address-active'}`}>
|
||||
<View onLongPress={()=>handleDelete(item)} onClick={()=>handleSelect(item,index)} className={`address-list ${index+1==state?.data?.list?.length&&'address-list-last'} ${focusId==item.id&&'address-active'}`}>
|
||||
<View className="address-user">
|
||||
{item.name}
|
||||
{
|
||||
item.is_default?<Text className="address-list-default">默认</Text>:
|
||||
<Text className="address-list-phone">{item.phone}</Text>
|
||||
<Text className="address-list-phone">{item.phone.replace(item.phone.substring(4,7), "****")}</Text>
|
||||
}
|
||||
</View>
|
||||
<View className="address-list-bottom">
|
||||
<View className="address-list-info">
|
||||
{/* **省**市**区**街道****仓库 */}
|
||||
{item.province_name+item.city_name+item.district_name} {item.address_detail}
|
||||
<View>{item.province_name+item.city_name+item.district_name}
|
||||
{/* {item.address_detail} */}
|
||||
</View>
|
||||
{
|
||||
item.is_default&&<Text className="address-list-phone">{item.phone.replace(item.phone.substring(3,7), "****")}</Text>
|
||||
item.is_default&&<Text className="address-list-phone">{item.phone.replace(item.phone.substring(4,7), "****")}</Text>
|
||||
}
|
||||
</View>
|
||||
<Navigator url={`/pages/addressAdd/index?type=edit&id=${item.id}`} hoverClass="none" className="address-edit">
|
||||
@ -112,6 +114,7 @@ const AddressList = memo((props:Params)=>{
|
||||
}):
|
||||
<View className="address-no-data">暂未添加地址</View>
|
||||
}
|
||||
</View>
|
||||
</ScrollView>
|
||||
{addButtonEnabled&&<Navigator url="/pages/addressAdd/index?type=add" hoverClass="none" className="add-address">添加收货地址</Navigator>}
|
||||
</View>
|
||||
|
||||
@ -40,6 +40,8 @@
|
||||
font-weight: 400;
|
||||
color: #ffffff;
|
||||
display: flex;align-items: center;justify-content: center;
|
||||
margin: 620px auto 0;
|
||||
// margin: 620px auto 0;
|
||||
position: fixed;left: 50%;bottom: 50px;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
}
|
||||
@ -54,7 +54,10 @@ export default ()=>{
|
||||
})
|
||||
const rules = {
|
||||
name: [{
|
||||
message: "请输入收货人姓名"
|
||||
message: "请输入正确收货人姓名",
|
||||
validator: (value:any, rule:any)=>{ // 自定义验证，返回true表示匹配到了(错误)
|
||||
return value.length>5;
|
||||
}
|
||||
}],
|
||||
phone: [{
|
||||
message: "请输入正确的电话号码", regex: /^1[3|5|6|9|2|8|7]\d{9}$/
|
||||
|
||||
@ -41,7 +41,7 @@ export default ()=>{
|
||||
const credit_quota_used_line = convertPrice(formatPriceDiv(result.data.credit_quota_used_line));
|
||||
const credit_quota_line = convertPrice(formatPriceDiv(result.data.credit_quota_line));
|
||||
const credit_quota_available_line = convertPrice(formatPriceDiv(result.data.credit_quota_available_line));
|
||||
const progress = (credit_quota_available_line[0] / credit_quota_line[0] * 100).toFixed(0);
|
||||
const progress = ((credit_quota_available_line[0]??0) / (credit_quota_line[0]??0) * 100).toFixed(0);
|
||||
|
||||
switch(Number(result.data.quota_status)){
|
||||
case 0://暂未开通
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
height: 560px;
|
||||
position: relative;
|
||||
.card-main{
|
||||
margin-top: 33%;
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
.header-card{
|
||||
@ -137,9 +137,6 @@
|
||||
position: absolute;top: -10px;right: 0;
|
||||
}
|
||||
|
||||
.assets{
|
||||
|
||||
}
|
||||
.assets-title{
|
||||
font-size: 28px;
|
||||
font-weight: 700;
|
||||
@ -195,4 +192,118 @@
|
||||
.card-main-list-content-item-right text{
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.auth{
|
||||
margin-top: 115px;
|
||||
}
|
||||
.auth-top{
|
||||
display: flex;align-items: center;justify-content: space-between;
|
||||
}
|
||||
.auth-status{
|
||||
padding: 0 10px;
|
||||
height: 30px;
|
||||
background: #dddddd;
|
||||
border-radius: 10px 4px 0px 0px;
|
||||
display: flex;align-items: center;justify-content: center;
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
color: #707070;
|
||||
}
|
||||
.auth-tips{
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
color: #007aff;
|
||||
}
|
||||
.auth-tips text{
|
||||
font-size: 17px;
|
||||
}
|
||||
.auth-company{
|
||||
height: 70px;
|
||||
width: 100%;
|
||||
background: #f6f6f6;
|
||||
border: 2px solid #f0f0f0;
|
||||
border-radius: 0px 10px 10px 10px;
|
||||
font-size: 26px;
|
||||
font-weight: 700;
|
||||
color: #707070;
|
||||
display: flex;align-items: center;justify-content: center;
|
||||
}
|
||||
|
||||
.modal{
|
||||
background: rgba(0,0,0,0.6);
|
||||
position: fixed;inset: 0;
|
||||
display: flex;justify-content: center;align-items: center;
|
||||
}
|
||||
.modal-content{
|
||||
width: 598px;
|
||||
background: #ffffff;
|
||||
border-radius: 10px;
|
||||
animation: enlargeK 0.2s linear;
|
||||
overflow: hidden;
|
||||
}
|
||||
@keyframes enlargeK {
|
||||
0%{
|
||||
transform: scale(0);
|
||||
}
|
||||
100%{
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
.modal-title{
|
||||
font-size: 32px;
|
||||
font-weight: 700;
|
||||
text-align: center;
|
||||
color: #000000;
|
||||
margin-bottom: 58px;
|
||||
padding-top: 48px;
|
||||
}
|
||||
.modal-letter{
|
||||
font-size: 26px;
|
||||
font-weight: 400;
|
||||
color: #707070;
|
||||
padding: 0 30px;
|
||||
line-height: 50px;
|
||||
}
|
||||
.modal-letter-text{
|
||||
text-indent: 60px;
|
||||
}
|
||||
.modal-letter-beginn{
|
||||
font-size: 28px;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
.modal-letter-end{
|
||||
font-size: 26px;
|
||||
font-weight: 400;
|
||||
text-align: right;
|
||||
margin-top: 61px;
|
||||
}
|
||||
.modal-button{
|
||||
display: flex;
|
||||
border-top: 1px solid #DDDDDD;
|
||||
margin-top: 45px;
|
||||
}
|
||||
.modal-button button, .modal-button view{
|
||||
display: flex;align-items: center;justify-content: center;
|
||||
width: 50%;
|
||||
height: 90px;
|
||||
background-color: white;
|
||||
}
|
||||
.modal-button button{
|
||||
font-size: 26px;
|
||||
font-weight: 400;
|
||||
color: #707070;
|
||||
border-radius: 0;
|
||||
border-right: 1px solid #DDDDDD;
|
||||
}
|
||||
.modal-button button::after{
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
.modal-button view{
|
||||
font-size: 26px;
|
||||
font-weight: 400;
|
||||
color: #007aff;
|
||||
}
|
||||
}
|
||||
@ -1,4 +1,4 @@
|
||||
import { View, Image, Text, Navigator } from "@tarojs/components"
|
||||
import { View, Image, Text, Navigator, Button } from "@tarojs/components"
|
||||
import { memo, useEffect, useState } from "react"
|
||||
import styles from './index.module.scss'
|
||||
import classnames from "classnames";
|
||||
@ -12,6 +12,33 @@ export default () => {
|
||||
<Header />
|
||||
<Assets />
|
||||
<Main />
|
||||
<Modal/>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
const Modal = ()=>{
|
||||
const handleContent = ()=>{
|
||||
console.log(111);
|
||||
|
||||
}
|
||||
const handleouter = ()=>{
|
||||
console.log(222);
|
||||
|
||||
}
|
||||
return(
|
||||
<View style={{display: "none"}} onClick={handleouter} className={styles['modal']}>
|
||||
<View className={styles['modal-content']} onClick={e=>e.stopPropagation()}>
|
||||
<View className={styles['modal-title']}>首次登录提醒</View>
|
||||
<View className={styles['modal-letter']}>
|
||||
<View className={styles['modal-letter-beginn']}>To: 万丰园纺织科技</View>
|
||||
<View className={styles['modal-letter-text']}>尊敬的老朋友，欢迎你使用小程序商城；由于您是我们长期合作的伙伴，你的组织已自动为你生成，关联后可查看历史订单哟。</View>
|
||||
<View className={styles['modal-letter-end']}>信息错误请联系客服</View>
|
||||
</View>
|
||||
<View className={styles['modal-button']}>
|
||||
<Button hoverClass="none" openType="concat">联系客服</Button>
|
||||
<View>我知道</View>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
@ -68,6 +95,18 @@ const Header = memo(() => {
|
||||
</Navigator>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles['auth']}>
|
||||
<View className={styles['auth-top']}>
|
||||
<View className={styles['auth-status']}>
|
||||
<Text>1</Text>
|
||||
认证不通过
|
||||
</View>
|
||||
<View className={styles['auth-tips']}>重新认证 <Text className="iconfont icon-a-moreback"/></View>
|
||||
</View>
|
||||
<View className={styles['auth-company']}>
|
||||
佛山市带生纺织品有限公司
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles['card-main']}>
|
||||
<View className={styles['card-main-title']}>
|
||||
<View>订单</View>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user