🐞 fix(ID1001148添加地址,选择默认后,地址的编辑按钮显示错位,手机号换行):

This commit is contained in:
czm 2023-01-13 21:54:39 +08:00
parent a20333691f
commit e0ce4f5b56
2 changed files with 19 additions and 12 deletions

View File

@ -11,7 +11,7 @@
} }
.address-list { .address-list {
width: 704px; width: 704px;
height: 156px; // height: 156px;
background: #ffffff; background: #ffffff;
border-radius: 20px; border-radius: 20px;
box-shadow: 2px 4px 12px 0px rgba(0, 0, 0, 0.16); box-shadow: 2px 4px 12px 0px rgba(0, 0, 0, 0.16);
@ -20,6 +20,7 @@
margin: 18px auto 0; margin: 18px auto 0;
border: 1px solid #ffffff; border: 1px solid #ffffff;
border: 1px solid rgba(0, 0, 0, 0.16); border: 1px solid rgba(0, 0, 0, 0.16);
position: relative;
} }
.address-active { .address-active {
border: 1px solid #68b4ff; border: 1px solid #68b4ff;
@ -59,6 +60,13 @@
} }
.address-edit { .address-edit {
padding: 10px; padding: 10px;
position: absolute;
margin: auto;
top: 0;
right: 20px;
bottom: 0;
display: flex;
align-items: center;
} }
.address-edit .icon-bianji { .address-edit .icon-bianji {
font-size: 40px; font-size: 40px;
@ -69,13 +77,13 @@
font-weight: 400; font-weight: 400;
color: #3c3c3c; color: #3c3c3c;
display: flex; display: flex;
width: 100%; width: 80%;
} }
.address-list-info view { .address-list-info view {
max-width: 60%; // max-width: 60%;
text-overflow: ellipsis; // text-overflow: ellipsis;
overflow: hidden; // overflow: hidden;
white-space: nowrap; // white-space: nowrap;
} }
.address-list-bottom { .address-list-bottom {
display: flex; display: flex;

View File

@ -94,20 +94,19 @@ const AddressList = (props: Params) => {
<View key={item.id} onLongPress={() => handleDelete(item)} onClick={() => handleSelect(item, index)} className={`address-list ${focusId == item.id && 'address-active'}`}> <View key={item.id} onLongPress={() => handleDelete(item)} onClick={() => handleSelect(item, index)} className={`address-list ${focusId == item.id && 'address-active'}`}>
<View className="address-user"> <View className="address-user">
{item.name} {item.name}
<Text className="address-list-phone">{item.phone.replace(item.phone.substring(3, 7), '****')}</Text>
{ {
item.is_default item.is_default && <Text className="address-list-default"></Text>
? <Text className="address-list-default"></Text>
: <Text className="address-list-phone">{item.phone.replace(item.phone.substring(3, 7), '****')}</Text>
} }
</View> </View>
<View className="address-list-bottom"> <View className="address-list-bottom">
<View className="address-list-info"> <View className="address-list-info">
<View>{item.province_name + item.city_name + item.district_name} <View className="address-list-info_title">{item.province_name + item.city_name + item.district_name}
{/* {item.address_detail} */} {/* {item.address_detail} */}
</View> </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(3, 7), '****')}</Text>
} } */}
</View> </View>
<Navigator onClick={e => e.stopPropagation()} url={`/pages/addressAdd/index?type=edit&id=${item.id}`} hoverClass="none" className="address-edit"> <Navigator onClick={e => e.stopPropagation()} url={`/pages/addressAdd/index?type=edit&id=${item.id}`} hoverClass="none" className="address-edit">
<Text className="iconfont icon-bianji"></Text> <Text className="iconfont icon-bianji"></Text>