parent
f6fc4710a0
commit
d88bbdedc7
File diff suppressed because one or more lines are too long
@ -1,239 +1,239 @@ |
|||||||
<template> |
<template> |
||||||
<view> |
<view> |
||||||
<view class="content"> |
<view class="content"> |
||||||
<view class="list"> |
<view class="list"> |
||||||
<view class="row" v-for="(row,index) in addressList" :key="index" @tap="select(row)"> |
<view class="row" v-for="(row,index) in addressList" :key="index" @tap="select(row)"> |
||||||
<view class="left"> |
<view class="left"> |
||||||
<view class="head"> |
<view class="head"> |
||||||
{{row.head}} |
{{row.head}} |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
<view class="center"> |
<view class="center"> |
||||||
<view class="name-tel"> |
<view class="name-tel"> |
||||||
<view class="name">{{row.name}}</view> |
<view class="name">{{row.name}}</view> |
||||||
<view class="tel">{{row.tel}}</view> |
<view class="tel">{{row.tel}}</view> |
||||||
<view class="default" v-if="row.isDefault"> |
<view class="default" v-if="row.isDefault"> |
||||||
默认 |
默认 |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
<view class="address"> |
<view class="address"> |
||||||
{{row.address.region.label}} {{row.address.detailed}} |
{{row.address.region.label}} {{row.address.detailed}} |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
<view class="right"> |
<view class="right"> |
||||||
<view class="icon bianji" @tap.stop="edit(row)"> |
<view class="icon bianji" @tap.stop="edit(row)"> |
||||||
|
|
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
<view class="add"> |
<view class="add"> |
||||||
<view class="btn" @tap="add"> |
<view class="btn" @tap="add"> |
||||||
<view class="icon tianjia"></view>新增地址 |
<view class="icon tianjia"></view>新增地址 |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
</template> |
</template> |
||||||
<script> |
<script> |
||||||
export default { |
export default { |
||||||
data() { |
data() { |
||||||
return { |
return { |
||||||
isSelect:false, |
isSelect:false, |
||||||
addressList:[ |
addressList:[ |
||||||
{id:1,name:"大黑哥",head:"大",tel:"18816881688",address:{region:{"label":"广东省-深圳市-福田区","value":[18,2,1],"cityCode":"440304"},detailed:'深南大道1111号无名摩登大厦6楼A2'},isDefault:true}, |
{id:1,name:"大黑哥",head:"大",tel:"18816881688",address:{region:{"label":"广东省-深圳市-福田区","value":[18,2,1],"cityCode":"440304"},detailed:'深南大道1111号无名摩登大厦6楼A2'},isDefault:true}, |
||||||
{id:2,name:"大黑哥",head:"大",tel:"15812341234",address:{region:{"label":"广东省-深圳市-福田区","value":[18,2,1],"cityCode":"440304"},detailed:'深北小道2222号有名公寓502'},isDefault:false}, |
{id:2,name:"大黑哥",head:"大",tel:"15812341234",address:{region:{"label":"广东省-深圳市-福田区","value":[18,2,1],"cityCode":"440304"},detailed:'深北小道2222号有名公寓502'},isDefault:false}, |
||||||
{id:3,name:"老大哥",head:"老",tel:"18155467897",address:{region:{"label":"广东省-深圳市-福田区","value":[18,2,1],"cityCode":"440304"},detailed:'深南大道1111号无名摩登大厦6楼A2'},isDefault:false}, |
{id:3,name:"老大哥",head:"老",tel:"18155467897",address:{region:{"label":"广东省-深圳市-福田区","value":[18,2,1],"cityCode":"440304"},detailed:'深南大道1111号无名摩登大厦6楼A2'},isDefault:false}, |
||||||
{id:4,name:"王小妹",head:"王",tel:"13425654895",address:{region:{"label":"广东省-深圳市-福田区","value":[18,2,1],"cityCode":"440304"},detailed:'深南大道1111号无名摩登大厦6楼A2'},isDefault:false}, |
{id:4,name:"王小妹",head:"王",tel:"13425654895",address:{region:{"label":"广东省-深圳市-福田区","value":[18,2,1],"cityCode":"440304"},detailed:'深南大道1111号无名摩登大厦6楼A2'},isDefault:false}, |
||||||
] |
] |
||||||
}; |
}; |
||||||
}, |
}, |
||||||
onShow() { |
onShow() { |
||||||
|
|
||||||
uni.getStorage({ |
uni.getStorage({ |
||||||
key:'delAddress', |
key:'delAddress', |
||||||
success: (e) => { |
success: (e) => { |
||||||
let len = this.addressList.length; |
let len = this.addressList.length; |
||||||
if(e.data.hasOwnProperty('id')){ |
if(e.data.hasOwnProperty('id')){ |
||||||
for(let i=0;i<len;i++){ |
for(let i=0;i<len;i++){ |
||||||
if(this.addressList[i].id==e.data.id){ |
if(this.addressList[i].id==e.data.id){ |
||||||
this.addressList.splice(i,1); |
this.addressList.splice(i,1); |
||||||
break; |
break; |
||||||
} |
} |
||||||
} |
} |
||||||
} |
} |
||||||
uni.removeStorage({ |
uni.removeStorage({ |
||||||
key:'delAddress' |
key:'delAddress' |
||||||
}) |
}) |
||||||
} |
} |
||||||
}) |
}) |
||||||
uni.getStorage({ |
uni.getStorage({ |
||||||
key:'saveAddress', |
key:'saveAddress', |
||||||
success: (e) => { |
success: (e) => { |
||||||
let len = this.addressList.length; |
let len = this.addressList.length; |
||||||
if(e.data.hasOwnProperty('id')){ |
if(e.data.hasOwnProperty('id')){ |
||||||
for(let i=0;i<len;i++){ |
for(let i=0;i<len;i++){ |
||||||
if(this.addressList[i].id==e.data.id){ |
if(this.addressList[i].id==e.data.id){ |
||||||
this.addressList.splice(i,1,e.data); |
this.addressList.splice(i,1,e.data); |
||||||
break; |
break; |
||||||
} |
} |
||||||
} |
} |
||||||
}else{ |
}else{ |
||||||
let lastid = this.addressList[len-1]; |
let lastid = this.addressList[len-1]; |
||||||
lastid++; |
lastid++; |
||||||
e.data.id = lastid; |
e.data.id = lastid; |
||||||
this.addressList.push(e.data); |
this.addressList.push(e.data); |
||||||
} |
} |
||||||
uni.removeStorage({ |
uni.removeStorage({ |
||||||
key:'saveAddress' |
key:'saveAddress' |
||||||
}) |
}) |
||||||
} |
} |
||||||
}) |
}) |
||||||
}, |
}, |
||||||
onLoad(e) { |
onLoad(e) { |
||||||
if(e.type=='select'){ |
if(e.type=='select'){ |
||||||
this.isSelect = true; |
this.isSelect = true; |
||||||
} |
} |
||||||
}, |
}, |
||||||
methods:{ |
methods:{ |
||||||
edit(row){ |
edit(row){ |
||||||
uni.setStorage({ |
uni.setStorage({ |
||||||
key:'address', |
key:'address', |
||||||
data:row, |
data:row, |
||||||
success() { |
success() { |
||||||
uni.navigateTo({ |
uni.navigateTo({ |
||||||
url:"edit/edit?type=edit" |
url:"edit/edit?type=edit" |
||||||
}) |
}) |
||||||
} |
} |
||||||
}); |
}); |
||||||
|
|
||||||
}, |
}, |
||||||
add(){ |
add(){ |
||||||
uni.navigateTo({ |
uni.navigateTo({ |
||||||
url:"edit/edit?type=add" |
url:"edit/edit?type=add" |
||||||
}) |
}) |
||||||
}, |
}, |
||||||
select(row){ |
select(row){ |
||||||
//是否需要返回地址(从订单确认页跳过来选收货地址) |
//是否需要返回地址(从订单确认页跳过来选收货地址) |
||||||
if(!this.isSelect){ |
if(!this.isSelect){ |
||||||
return ; |
return ; |
||||||
} |
} |
||||||
uni.setStorage({ |
uni.setStorage({ |
||||||
key:'selectAddress', |
key:'selectAddress', |
||||||
data:row, |
data:row, |
||||||
success() { |
success() { |
||||||
uni.navigateBack(); |
uni.navigateBack(); |
||||||
} |
} |
||||||
}) |
}) |
||||||
} |
} |
||||||
} |
} |
||||||
} |
} |
||||||
</script> |
</script> |
||||||
|
|
||||||
<style lang="scss"> |
<style lang="scss"> |
||||||
view{ |
view{ |
||||||
display: flex; |
display: flex; |
||||||
} |
} |
||||||
.icon { |
.icon { |
||||||
// &.bianji { |
// &.bianji { |
||||||
// &:before{content:"\e61b";} |
// &:before{content:"\e61b";} |
||||||
// } |
// } |
||||||
// &.tianjia { |
// &.tianjia { |
||||||
// &:before{content:"\e81a";} |
// &:before{content:"\e81a";} |
||||||
// } |
// } |
||||||
} |
} |
||||||
.add{ |
.add{ |
||||||
position: fixed; |
position: fixed; |
||||||
bottom: 0; |
bottom: 0; |
||||||
width: 100%; |
width: 100%; |
||||||
height: 120upx; |
height: 120upx; |
||||||
justify-content: center; |
justify-content: center; |
||||||
align-items: center; |
align-items: center; |
||||||
.btn{ |
.btn{ |
||||||
box-shadow: 0upx 5upx 10upx rgba(0,0,0,0.4); |
box-shadow: 0upx 5upx 10upx rgba(0,0,0,0.4); |
||||||
width: 70%; |
width: 70%; |
||||||
height: 80upx; |
height: 80upx; |
||||||
border-radius: 80upx; |
border-radius: 80upx; |
||||||
background-color: #f06c7a; |
background-color: #0083f5; |
||||||
color: #fff; |
color: #fff; |
||||||
justify-content: center; |
justify-content: center; |
||||||
align-items: center; |
align-items: center; |
||||||
.icon{ |
.icon{ |
||||||
height: 80upx; |
height: 80upx; |
||||||
color: #fff; |
color: #fff; |
||||||
font-size: 30upx; |
font-size: 30upx; |
||||||
justify-content: center; |
justify-content: center; |
||||||
align-items: center; |
align-items: center; |
||||||
} |
} |
||||||
font-size: 30upx; |
font-size: 30upx; |
||||||
} |
} |
||||||
} |
} |
||||||
.list{ |
.list{ |
||||||
flex-wrap: wrap; |
flex-wrap: wrap; |
||||||
.row{ |
.row{ |
||||||
width: 96%; |
width: 96%; |
||||||
padding: 20upx 2%; |
padding: 20upx 2%; |
||||||
.left{ |
.left{ |
||||||
width: 90upx; |
width: 90upx; |
||||||
flex-shrink: 0; |
flex-shrink: 0; |
||||||
align-items: center; |
align-items: center; |
||||||
.head{ |
.head{ |
||||||
width: 70upx; |
width: 70upx; |
||||||
height: 70upx; |
height: 70upx; |
||||||
background:linear-gradient(to right,#ccc,#aaa); |
background:linear-gradient(to right,#ccc,#aaa); |
||||||
color: #fff; |
color: #fff; |
||||||
justify-content: center; |
justify-content: center; |
||||||
align-items: center; |
align-items: center; |
||||||
border-radius: 60upx; |
border-radius: 60upx; |
||||||
font-size: 35upx; |
font-size: 35upx; |
||||||
} |
} |
||||||
} |
} |
||||||
.center{ |
.center{ |
||||||
width: 100%; |
width: 100%; |
||||||
flex-wrap: wrap; |
flex-wrap: wrap; |
||||||
.name-tel{ |
.name-tel{ |
||||||
width: 100%; |
width: 100%; |
||||||
align-items: baseline; |
align-items: baseline; |
||||||
.name{ |
.name{ |
||||||
font-size: 34upx; |
font-size: 34upx; |
||||||
} |
} |
||||||
.tel{ |
.tel{ |
||||||
margin-left: 30upx; |
margin-left: 30upx; |
||||||
font-size: 24upx; |
font-size: 24upx; |
||||||
color: #777; |
color: #777; |
||||||
} |
} |
||||||
.default{ |
.default{ |
||||||
|
|
||||||
font-size: 22upx; |
font-size: 22upx; |
||||||
|
|
||||||
background-color: #f06c7a; |
background-color: #0083f5; |
||||||
color: #fff; |
color: #fff; |
||||||
padding: 0 18upx; |
padding: 0 18upx; |
||||||
border-radius: 24upx; |
border-radius: 24upx; |
||||||
margin-left: 20upx; |
margin-left: 20upx; |
||||||
} |
} |
||||||
} |
} |
||||||
.address{ |
.address{ |
||||||
width: 100%; |
width: 100%; |
||||||
font-size: 24upx; |
font-size: 24upx; |
||||||
align-items: baseline; |
align-items: baseline; |
||||||
color: #777; |
color: #777; |
||||||
} |
} |
||||||
} |
} |
||||||
.right{ |
.right{ |
||||||
flex-shrink: 0; |
flex-shrink: 0; |
||||||
align-items: center; |
align-items: center; |
||||||
margin-left: 20upx; |
margin-left: 20upx; |
||||||
.icon{ |
.icon{ |
||||||
justify-content: center; |
justify-content: center; |
||||||
align-items: center; |
align-items: center; |
||||||
width: 80upx; |
width: 80upx; |
||||||
height: 60upx; |
height: 60upx; |
||||||
border-left: solid 1upx #aaa; |
border-left: solid 1upx #aaa; |
||||||
font-size: 40upx; |
font-size: 40upx; |
||||||
color: #777; |
color: #777; |
||||||
} |
} |
||||||
} |
} |
||||||
} |
} |
||||||
} |
} |
||||||
</style> |
</style> |
||||||
|
@ -1,261 +1,261 @@ |
|||||||
<template> |
<template> |
||||||
<view> |
<view> |
||||||
<view class="content"> |
<view class="content"> |
||||||
<view class="row"> |
<view class="row"> |
||||||
<view class="nominal"> |
<view class="nominal"> |
||||||
收件人 |
收件人 |
||||||
</view> |
</view> |
||||||
<view class="input"> |
<view class="input"> |
||||||
<input placeholder="请输入收件人姓名" type="text" v-model="name" /> |
<input placeholder="请输入收件人姓名" type="text" v-model="name" /> |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
<view class="row"> |
<view class="row"> |
||||||
<view class="nominal"> |
<view class="nominal"> |
||||||
电话号码 |
电话号码 |
||||||
</view> |
</view> |
||||||
<view class="input"> |
<view class="input"> |
||||||
<input placeholder="请输入收件人电话号码" type="text" v-model="tel" /> |
<input placeholder="请输入收件人电话号码" type="text" v-model="tel" /> |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
<view class="row"> |
<view class="row"> |
||||||
<view class="nominal"> |
<view class="nominal"> |
||||||
所在地区 |
所在地区 |
||||||
</view> |
</view> |
||||||
<view class="input" @tap="chooseCity"> |
<view class="input" @tap="chooseCity"> |
||||||
{{region.label}} |
{{region.label}} |
||||||
</view> |
</view> |
||||||
|
|
||||||
</view> |
</view> |
||||||
<view class="row"> |
<view class="row"> |
||||||
<view class="nominal"> |
<view class="nominal"> |
||||||
详细地址 |
详细地址 |
||||||
</view> |
</view> |
||||||
<view class="input"> |
<view class="input"> |
||||||
<textarea v-model="detailed" auto-height="true" placeholder="输入详细地址"></textarea> |
<textarea v-model="detailed" auto-height="true" placeholder="输入详细地址"></textarea> |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
<view class="row"> |
<view class="row"> |
||||||
<view class="nominal"> |
<view class="nominal"> |
||||||
设置默认地址 |
设置默认地址 |
||||||
</view> |
</view> |
||||||
<view class="input switch"> |
<view class="input switch"> |
||||||
<switch color="#f06c7a" :checked="isDefault" @change=isDefaultChange /> |
<switch color="#0083f5" :checked="isDefault" @change=isDefaultChange /> |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
<view class="row" v-if="editType=='edit'" @tap="del"> |
<view class="row" v-if="editType=='edit'" @tap="del"> |
||||||
<view class="del"> |
<view class="del"> |
||||||
删除收货地址 |
删除收货地址 |
||||||
</view> |
</view> |
||||||
</view> |
</view> |
||||||
|
</view> |
||||||
|
<view class="save" @tap="save"> |
||||||
|
<view class="btn"> |
||||||
|
保存地址 |
||||||
|
</view> |
||||||
</view> |
</view> |
||||||
<view class="save" @tap="save"> |
|
||||||
<view class="btn"> |
|
||||||
保存地址 |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
<mpvue-city-picker :themeColor="themeColor" ref="mpvueCityPicker" :pickerValueDefault="cityPickerValue" @onCancel="onCancel" @onConfirm="onConfirm"></mpvue-city-picker> |
<mpvue-city-picker :themeColor="themeColor" ref="mpvueCityPicker" :pickerValueDefault="cityPickerValue" @onCancel="onCancel" @onConfirm="onConfirm"></mpvue-city-picker> |
||||||
</view> |
</view> |
||||||
</template> |
</template> |
||||||
|
|
||||||
<script> |
<script> |
||||||
import mpvueCityPicker from '@/components/mpvue-citypicker/mpvueCityPicker.vue' |
import mpvueCityPicker from '@/components/mpvue-citypicker/mpvueCityPicker.vue' |
||||||
export default { |
export default { |
||||||
components: { |
components: { |
||||||
mpvueCityPicker |
mpvueCityPicker |
||||||
}, |
}, |
||||||
data() { |
data() { |
||||||
return { |
return { |
||||||
editType:'edit', |
editType:'edit', |
||||||
id:'', |
id:'', |
||||||
name:'', |
name:'', |
||||||
tel:'', |
tel:'', |
||||||
detailed:'', |
detailed:'', |
||||||
isDefault:false, |
isDefault:false, |
||||||
cityPickerValue: [0, 0, 1], |
cityPickerValue: [0, 0, 1], |
||||||
themeColor: '#007AFF', |
themeColor: '#007AFF', |
||||||
region:{label:"请点击选择地址",value:[],cityCode:""} |
region:{label:"请点击选择地址",value:[],cityCode:""} |
||||||
}; |
}; |
||||||
}, |
}, |
||||||
methods: { |
methods: { |
||||||
onCancel(e) { |
onCancel(e) { |
||||||
console.log(e) |
console.log(e) |
||||||
}, |
}, |
||||||
chooseCity() { |
chooseCity() { |
||||||
this.$refs.mpvueCityPicker.show() |
this.$refs.mpvueCityPicker.show() |
||||||
}, |
}, |
||||||
onConfirm(e) { |
onConfirm(e) { |
||||||
this.region = e; |
this.region = e; |
||||||
this.cityPickerValue = e.value; |
this.cityPickerValue = e.value; |
||||||
}, |
}, |
||||||
isDefaultChange(e){ |
isDefaultChange(e){ |
||||||
this.isDefault = e.detail.value; |
this.isDefault = e.detail.value; |
||||||
}, |
}, |
||||||
del(){ |
del(){ |
||||||
uni.showModal({ |
uni.showModal({ |
||||||
title: '删除提示', |
title: '删除提示', |
||||||
content: '你将删除这个收货地址', |
content: '你将删除这个收货地址', |
||||||
success: (res)=>{ |
success: (res)=>{ |
||||||
if (res.confirm) { |
if (res.confirm) { |
||||||
uni.setStorage({ |
uni.setStorage({ |
||||||
key:'delAddress', |
key:'delAddress', |
||||||
data:{id:this.id}, |
data:{id:this.id}, |
||||||
success() { |
success() { |
||||||
uni.navigateBack(); |
uni.navigateBack(); |
||||||
} |
} |
||||||
}) |
}) |
||||||
} else if (res.cancel) { |
} else if (res.cancel) { |
||||||
console.log('用户点击取消'); |
console.log('用户点击取消'); |
||||||
} |
} |
||||||
} |
} |
||||||
}); |
}); |
||||||
|
|
||||||
}, |
}, |
||||||
save(){ |
save(){ |
||||||
let data={"name":this.name,"head":this.name.substr(0,1),"tel":this.tel,"address":{"region":this.region,"detailed":this.detailed},"isDefault":this.isDefault} |
let data={"name":this.name,"head":this.name.substr(0,1),"tel":this.tel,"address":{"region":this.region,"detailed":this.detailed},"isDefault":this.isDefault} |
||||||
if(this.editType=='edit'){ |
if(this.editType=='edit'){ |
||||||
data.id = this.id |
data.id = this.id |
||||||
} |
} |
||||||
if(!data.name){ |
if(!data.name){ |
||||||
uni.showToast({title:'请输入收件人姓名',icon:'none'}); |
uni.showToast({title:'请输入收件人姓名',icon:'none'}); |
||||||
return ; |
return ; |
||||||
} |
} |
||||||
if(!data.tel){ |
if(!data.tel){ |
||||||
uni.showToast({title:'请输入收件人电话号码',icon:'none'}); |
uni.showToast({title:'请输入收件人电话号码',icon:'none'}); |
||||||
return ; |
return ; |
||||||
} |
} |
||||||
if(!data.address.detailed){ |
if(!data.address.detailed){ |
||||||
uni.showToast({title:'请输入收件人详细地址',icon:'none'}); |
uni.showToast({title:'请输入收件人详细地址',icon:'none'}); |
||||||
return ; |
return ; |
||||||
} |
} |
||||||
if(data.address.region.value.length==0){ |
if(data.address.region.value.length==0){ |
||||||
uni.showToast({title:'请选择收件地址',icon:'none'}); |
uni.showToast({title:'请选择收件地址',icon:'none'}); |
||||||
return ; |
return ; |
||||||
} |
} |
||||||
uni.showLoading({ |
uni.showLoading({ |
||||||
title:'正在提交' |
title:'正在提交' |
||||||
}) |
}) |
||||||
//实际应用中请提交ajax,模板定时器模拟提交效果 |
//实际应用中请提交ajax,模板定时器模拟提交效果 |
||||||
setTimeout(()=>{ |
setTimeout(()=>{ |
||||||
uni.setStorage({ |
uni.setStorage({ |
||||||
key:'saveAddress', |
key:'saveAddress', |
||||||
data:data, |
data:data, |
||||||
success() { |
success() { |
||||||
uni.hideLoading(); |
uni.hideLoading(); |
||||||
uni.navigateBack(); |
uni.navigateBack(); |
||||||
} |
} |
||||||
}) |
}) |
||||||
},300) |
},300) |
||||||
|
|
||||||
|
|
||||||
} |
} |
||||||
}, |
}, |
||||||
onLoad(e) { |
onLoad(e) { |
||||||
//获取传递过来的参数 |
//获取传递过来的参数 |
||||||
|
|
||||||
this.editType = e.type; |
this.editType = e.type; |
||||||
if(e.type=='edit'){ |
if(e.type=='edit'){ |
||||||
uni.getStorage({ |
uni.getStorage({ |
||||||
key:'address', |
key:'address', |
||||||
success: (e) => { |
success: (e) => { |
||||||
this.id = e.data.id; |
this.id = e.data.id; |
||||||
this.name = e.data.name; |
this.name = e.data.name; |
||||||
this.tel = e.data.tel; |
this.tel = e.data.tel; |
||||||
this.detailed = e.data.address.detailed; |
this.detailed = e.data.address.detailed; |
||||||
this.isDefault = e.data.isDefault; |
this.isDefault = e.data.isDefault; |
||||||
this.cityPickerValue = e.data.address.region.value; |
this.cityPickerValue = e.data.address.region.value; |
||||||
this.region = e.data.address.region; |
this.region = e.data.address.region; |
||||||
} |
} |
||||||
}) |
}) |
||||||
} |
} |
||||||
|
|
||||||
}, |
}, |
||||||
onBackPress() { |
onBackPress() { |
||||||
if (this.$refs.mpvueCityPicker.showPicker) { |
if (this.$refs.mpvueCityPicker.showPicker) { |
||||||
this.$refs.mpvueCityPicker.pickerCancel(); |
this.$refs.mpvueCityPicker.pickerCancel(); |
||||||
return true; |
return true; |
||||||
} |
} |
||||||
}, |
}, |
||||||
onUnload() { |
onUnload() { |
||||||
if (this.$refs.mpvueCityPicker.showPicker) { |
if (this.$refs.mpvueCityPicker.showPicker) { |
||||||
this.$refs.mpvueCityPicker.pickerCancel() |
this.$refs.mpvueCityPicker.pickerCancel() |
||||||
} |
} |
||||||
} |
} |
||||||
}; |
}; |
||||||
</script> |
</script> |
||||||
<style lang="scss"> |
<style lang="scss"> |
||||||
|
|
||||||
.save{ |
.save{ |
||||||
view{ |
view{ |
||||||
display: flex; |
display: flex; |
||||||
} |
} |
||||||
position: fixed; |
position: fixed; |
||||||
bottom: 0; |
bottom: 0; |
||||||
width: 100%; |
width: 100%; |
||||||
height: 120upx; |
height: 120upx; |
||||||
display: flex; |
display: flex; |
||||||
justify-content: center; |
justify-content: center; |
||||||
align-items: center; |
align-items: center; |
||||||
.btn{ |
.btn{ |
||||||
box-shadow: 0upx 5upx 10upx rgba(0,0,0,0.4); |
box-shadow: 0upx 5upx 10upx rgba(0,0,0,0.4); |
||||||
width: 70%; |
width: 70%; |
||||||
height: 80upx; |
height: 80upx; |
||||||
border-radius: 80upx; |
border-radius: 80upx; |
||||||
background-color: #f06c7a; |
background-color: #0083f5; |
||||||
color: #fff; |
color: #fff; |
||||||
justify-content: center; |
justify-content: center; |
||||||
align-items: center; |
align-items: center; |
||||||
.icon{ |
.icon{ |
||||||
height: 80upx; |
height: 80upx; |
||||||
color: #fff; |
color: #fff; |
||||||
font-size: 30upx; |
font-size: 30upx; |
||||||
justify-content: center; |
justify-content: center; |
||||||
align-items: center; |
align-items: center; |
||||||
} |
} |
||||||
font-size: 30upx; |
font-size: 30upx; |
||||||
} |
} |
||||||
} |
} |
||||||
.content{ |
.content{ |
||||||
display: flex; |
display: flex; |
||||||
flex-wrap: wrap; |
flex-wrap: wrap; |
||||||
view{ |
view{ |
||||||
display: flex; |
display: flex; |
||||||
} |
} |
||||||
.row{ |
.row{ |
||||||
width: 94%; |
width: 94%; |
||||||
|
|
||||||
margin: 0 3%; |
margin: 0 3%; |
||||||
border-top: solid 1upx #eee; |
border-top: solid 1upx #eee; |
||||||
.nominal{ |
.nominal{ |
||||||
width: 30%; |
width: 30%; |
||||||
height: 120upx; |
height: 120upx; |
||||||
font-weight: 200; |
font-weight: 200; |
||||||
font-size: 30upx; |
font-size: 30upx; |
||||||
align-items: center; |
align-items: center; |
||||||
} |
} |
||||||
.input{ |
.input{ |
||||||
width: 70%; |
width: 70%; |
||||||
padding: 20upx 0; |
padding: 20upx 0; |
||||||
align-items: center; |
align-items: center; |
||||||
font-size: 30upx; |
font-size: 30upx; |
||||||
&.switch{ |
&.switch{ |
||||||
justify-content: flex-end; |
justify-content: flex-end; |
||||||
} |
} |
||||||
.textarea{ |
.textarea{ |
||||||
margin: 20upx 0; |
margin: 20upx 0; |
||||||
min-height: 120upx; |
min-height: 120upx; |
||||||
} |
} |
||||||
} |
} |
||||||
.del{ |
.del{ |
||||||
width: 100%; |
width: 100%; |
||||||
height: 100upx; |
height: 100upx; |
||||||
justify-content: center; |
justify-content: center; |
||||||
align-items: center; |
align-items: center; |
||||||
font-size: 36upx; |
font-size: 36upx; |
||||||
color: #f06c7a; |
color: #0083f5; |
||||||
background-color: rgba(255,0,0,0.05); |
background-color: rgba(255,0,0,0.05); |
||||||
border-bottom: solid 1upx #eee; |
border-bottom: solid 1upx #eee; |
||||||
} |
} |
||||||
} |
} |
||||||
} |
} |
||||||
|
|
||||||
</style> |
</style> |
||||||
|
File diff suppressed because one or more lines are too long
After Width: | Height: | Size: 716 B |
Loading…
Reference in new issue