--我的页面完成设置图标

--表单组件input类型完成后面图标
This commit is contained in:
li tong bao
2022-04-28 18:13:36 +08:00
parent c6c3b8e21c
commit 08acb37769
12 changed files with 123 additions and 56 deletions
+1 -1
View File
@@ -43,7 +43,7 @@ export default ()=>{
<View className="add-address">
<FromList value={formData["aa"]} label="联系人" placeholder="请输入收货人姓名"/>
<FromList value={formData["bb"]} label="联系方式" placeholder="请输入收货人姓名"/>
<FromList value={formData["cc"]} onClick={handleSelectSite} label="收地址" type="select" placeholder="请选择/省/市/区"/>
<FromList value={formData["cc"]} onClick={handleSelectSite} label="收货地址" type="select" placeholder="请选择/省/市/区"/>
<FromList value={formData["dd"]} label="详细地址" type="textarea" placeholder="请输入详细地址(街道、门牌号等)"/>
<View className="add-address-default">
<Text>设为默认地址</Text>
+1 -1
View File
@@ -50,7 +50,7 @@ export default ()=>{
</FromList>
<FromList value={formData["bb"]} label="联系人" placeholder="请输入收货人姓名"/>
<FromList value={formData["bb"]} label="联系方式" placeholder="请输入收货人姓名"/>
<FromList value={formData["cc"]} onClick={handleSelectSite} label="收地址" type="select" placeholder="请选择/省/市/区"/>
<FromList value={formData["cc"]} onClick={handleSelectSite} label="收货地址" type="select" placeholder="请选择/省/市/区"/>
<FromList value={formData["dd"]} label="详细地址" type="textarea" placeholder="请输入详细地址(街道、门牌号等)"/>
+16
View File
@@ -60,6 +60,22 @@
}
.card-info-right{
font-size: 26px;
display: flex;align-items: flex-end;
}
.setup-icon{
position: relative;
padding-bottom: 10px;
}
.icon-wrapper{
font-size: 60px;
}
.icon-point{
width: 8px;
height: 8px;
border-radius: 50%;
background: #ff0000;
position: absolute;
right: 0;top: 0;
}
.card-main-title{
+10 -2
View File
@@ -1,6 +1,7 @@
import { View,Image,Text } from "@tarojs/components"
import { View,Image,Text, Navigator } from "@tarojs/components"
import { memo } from "react"
import styles from './index.module.scss'
import classnames from "classnames";
export default () => {
@@ -29,7 +30,14 @@ const Header = memo(()=>{
</View>
</View>
<View className={styles['card-info-right']}>
1
<Navigator hoverClass="none" url="/pages/userEdit/index" className={styles['setup-icon']}>
<View className={classnames(
styles['icon-wrapper'],
'iconfont',
'icon-shezhi',
)}></View>
<View className={styles['icon-point']}></View>
</Navigator>
</View>
</View>
<View className={styles['card-main']}>
+4 -2
View File
@@ -80,8 +80,10 @@ const UserEditList = memo((props:any)=>{
// popup内容
const PopupContent = memo((props:any)=>{
const [value, setValue] = useState("");
// popup输入长度
const handleTextareaInput = (ev:any)=>{
setValue(ev.detail.value.slice(0,20));
}
// 重置
const handleTextareaReset = ()=>{
@@ -91,8 +93,8 @@ const PopupContent = memo((props:any)=>{
<Popup onClose={()=>props.setPopupShow(false)} title="修改昵称" show={props.show}>
<View className="user-edit-popup-content">
<View className="user-edit-popup-input">
<Textarea value={props.value} onInput={handleTextareaInput} maxlength={20}/>
<Text>{props.value.length}/20</Text>
<Textarea value={value} onInput={handleTextareaInput} maxlength={20}/>
<Text>{value.length}/20</Text>
</View>
<Text className="user-edit-popup-tips">请设置2-20个字符,由中文、英文、数字、-和_组成</Text>
<View className="user-edit-popup-operation">
+5 -2
View File
@@ -27,7 +27,7 @@ const WeightList = memo((props:Params)=>{
setRefreshState(false);
},500)
}
const data = Array.from({length:15});
const data = Array.from({length:0});
return (
<View className="weight-list-scroll-view">
@@ -54,7 +54,10 @@ const WeightList = memo((props:Params)=>{
</View>
);
}):
<View className="weight-list-no-data">暂未添加地址</View>
<View className="weight-list-no-data">
<View>您末添加任何码单信息</View>
正在使用平台默认码单信息
</View>
}
</ScrollView>
<Navigator url="/pages/weightListAdd/index?type=add" hoverClass="none" className="add-weight-list">添加新码单信息</Navigator>
+20
View File
@@ -7,6 +7,26 @@
font-size: 26px;
font-weight: 700;
color: #000000;
padding-right: 20px;
box-sizing: border-box;
}
.add-address-default-active{
width: 50px;
height: 50px;
background: #007aff;
border-radius: 50%;
display: flex;align-items: center;
justify-content: center;
font-size: 45px;
color: white;
box-sizing: border-box;
}
.add-address-default-noactive{
width: 50px;
height: 50px;
border: 2px solid #707070;
border-radius: 50%;
box-sizing: border-box;
}
.add-address-save{
+9 -2
View File
@@ -20,11 +20,13 @@ export default ()=>{
aa: "",
bb:"",
cc:"",
dd:""
dd:"",
ee: 0
})
const handleSave = ()=>{
Taro.navigateBack();
}
const handleSelectDefault = ()=>setFormData({...formData ,ee: formData.ee?0:1});
return (
<View className="add-address">
@@ -33,7 +35,12 @@ export default ()=>{
<FromList value={formData["bb"]} label="联系方式" placeholder="请输入码单显示联系号码"/>
<View className="add-address-default">
<Text>设为默认地址</Text>
<View>1</View>
<View onClick={handleSelectDefault}>
{
formData.ee?<View className="add-address-default-active">✓</View>
:<View className="add-address-default-noactive"></View>
}
</View>
</View>
<Button hoverClass="none" className="add-address-save" onClick={handleSave}>保存</Button>