This commit is contained in:
张慢慢
2021-05-24 13:56:00 +08:00
commit a7995d90bc
208 changed files with 13143 additions and 0 deletions

View File

@@ -0,0 +1,240 @@
/*
* 本时生活
*/
const app = getApp()
Page({
/**
* 页面的初始数据
*/
data: {
addressInfo: '',
type : '', //类型
addressId : '',
defaultVal :'',
name : '',
mobile : '',
address : '',
//省份选择
areas : [],
areaSn : '',
areaIndex : 0,
//市级选择
cityList : [],
cityId : 0,
cityIndex : 0,
//区域选择
regiList : [],
regiId : 0,
regiIndex : 0,
cityLayer : false
},
/**
* 生命周期函数--监听页面加载
*/
onLoad (options) {
this.setData({
type : options.type
})
if (options.type == 'Add') {
wx.setNavigationBarTitle({
title: '添加收货地址'
})
// 获取位置
wx.getLocation({
type: 'gcj02',
success: res=> {
this.setData({
longitude : res.longitude,
latitude : res.latitude
})
// 解析坐标
getApp().qqmapsdk.reverseGeocoder({
location: {
latitude : res.latitude,
longitude : res.longitude
},
success: res=>{
if(res.message == "query ok"){
let addressInfo = res.result.address_component
let areaIndex = this.data.areas.findIndex(val => val.name == addressInfo.province)
this.setData({
areaIndex : areaIndex
})
this.getProvince()
}else{
wx.showToast({
title: res.message,
icon : 'none'
})
}
}
})
}
})
this.getProvince()
} else if (options.type == 'Compile') {
wx.setNavigationBarTitle({
title: '编辑收货地址'
})
this.setData({
addressId: options.id
})
this.getUserAddress()
}
},
/**
* 获取收货人信息
*/
getUserAddress(){
wx.$api.address.edit(this.data.addressId).then(res=>{
let areasValue = res.data.provinces.findIndex(val=> val.name == res.data.address.province_name),
cityValue = res.data.cities.findIndex(val=> val.name == res.data.address.city_name),
regiValue = res.data.districts.findIndex(val=> val.name == res.data.address.district_name)
this.setData({
name : res.data.address.name,
mobile : res.data.address.mobile,
areas : res.data.provinces,
cityList : res.data.cities,
regiList : res.data.districts,
areaIndex : areasValue,
cityIndex : cityValue,
regiIndex : regiValue,
areaSn : res.data.address.province_id,
cityId : res.data.address.city_id,
regiId : res.data.address.district_id,
address : res.data.address.address,
defaultList : res.data.address,
isDefault : res.data.address.is_default
})
})
},
/**
* 获取省信息
*/
getProvince() {
wx.$api.address.create().then(res=>{
let areaArr = res.data.provinces,
areaIndex = this.data.areaIndex
this.citylist(areaArr[areaIndex].code)
this.setData({
areaSn : areaArr[areaIndex].code,
areas : areaArr
})
})
},
/**
* 所在省份
*/
areasChange(e) {
let area = this.data.areas,
index = e.detail.value,
atcode = area[index].code
if (index != this.data.areaIndex) {
this.setData({
areaIndex : index,
areaSn : atcode
})
// 获取市级列表
this.citylist(atcode)
}
},
/**
* 市级列表
*/
citylist(code) {
wx.$api.address.children(code).then(res=>{
let cityArr = res.data
this.regilist(cityArr[0].code)
this.setData({
cityId : cityArr[0].code,
cityList : cityArr,
cityIndex : 0
})
})
},
/**
* 市级下拉筛选
*/
city(e) {
let city = this.data.cityList,
index = e.detail.value,
citycode = city[index].code
if (index != this.data.areaIndex) {
this.setData({
cityIndex: index,
cityId : citycode
})
// 获取市级列表
this.regilist(citycode)
}
},
/**
* 区列表
*/
regilist(areaCode) {
wx.$api.address.children(areaCode).then(res=>{
this.setData({
regiList : res.data,
regiId : res.data[0].code,
regiIndex : 0
})
})
},
/**
* 区下拉筛选
*/
regi(e) {
let newIndex = e.detail.value
this.setData({
regiIndex : newIndex,
regiId : this.data.regiList[newIndex].code
})
},
/**
* 保存信息
*/
siteform(e) {
if(this.data.type == 'Compile') {
// 编辑地址
wx.$api.address.keep(this.data.addressId, e.detail.value.name, e.detail.value.mobile, this.data.areaSn, this.data.cityId, this.data.regiId, e.detail.value.address).then(res=>{
wx.navigateBack()
})
} else {
// 创建地址
wx.$api.address.add(e.detail.value.name, e.detail.value.mobile, this.data.areaSn, this.data.cityId, this.data.regiId, e.detail.value.address, this.data.defaultVal).then(res=>{
wx.navigateBack()
})
}
},
/**
* 设为默认地址
*/
addressDefault(e) {
let val = e.detail.value
this.setData({
defaultVal: val
})
}
})

View File

@@ -0,0 +1,3 @@
{
"usingComponents": {}
}

View File

@@ -0,0 +1,71 @@
<form bindsubmit="siteform" class="site-form">
<view class="site-input">
<label>收货人</label>
<input placeholder="请输入收货人姓名" name="name" value="{{name}}"></input>
</view>
<view class="site-input">
<label>手机号码</label>
<input placeholder="请输入手机号码" name="mobile" type="number" value="{{mobile}}"></input>
</view>
<view class="site-input">
<label>所在省份</label>
<picker bindchange="areasChange" value="{{areaIndex}}" range="{{areas}}" range-key="name" name="province_id">
<view class="picker">
{{areas[areaIndex].name}}
</view>
<image src="/static/icon/rightsArrow.png"></image>
</picker>
</view>
<view class="site-input">
<label>所在城市</label>
<picker bindchange="city" value="{{cityIndex}}" range="{{cityList}}" range-key="name" class="conneColor" name="city_id">
<view class="picker">
{{cityList[cityIndex].name}}
</view>
<image src="/static/icon/rightsArrow.png"></image>
</picker>
</view>
<view class="site-input">
<label>所在区域</label>
<picker bindchange="regi" value="{{regiIndex}}" range="{{regiList}}" range-key="name" class="conneColor" name="district_id">
<view class="picker">
{{regiList[regiIndex].name}}
</view>
<image src="/static/icon/rightsArrow.png"></image>
</picker>
</view>
<view class="site-input">
<label>收货地址</label>
<input placeholder="请输入详细地址" name="address" value="{{address}}"></input>
</view>
<view class="site-switch" wx-if="{{type != 'Compile'}}">
<text>设置默认地址</text>
<switch style='zoom:.6;' bindchange="addressDefault" color="#f57e32"/>
</view>
<view class="site-btn">
<button form-type="submit" size="mini">保存</button>
</view>
<view class="pickerView-back {{cityLayer? 'active':''}}" bindtap="cityLayer"></view>
<view class="pickerView-layer {{cityLayer? 'active':''}}">
<view class="pickerView-btn">
<view class="pickerView-cancel" bindtap="cityLayer">取消</view>
<view class="pickerView-determine" bindtap="cityDetermine">确定</view>
</view>
<picker-view class="pickerView" mask-class="pickerView-mask" value="{{pickerValue}}" indicator-class="pickerView-indicator" bindchange="pickerCity">
<picker-view-column>
<view class="pickerView-name nowrap" wx:for="{{provinceArr}}" wx:key="province">{{item.name}}</view>
</picker-view-column>
<picker-view-column>
<view class="pickerView-name nowrap" wx:for="{{cityArr}}" wx:key="city">{{item.name}}</view>
</picker-view-column>
<picker-view-column>
<view class="pickerView-name nowrap" wx:for="{{districtArr}}" wx:key="district">{{item.name}}</view>
</picker-view-column>
</picker-view>
</view>
</form>

View File

@@ -0,0 +1,148 @@
/**
* 亿时代
*/
.site-form {
background: white;
display: block;
}
.site-btn {
padding: 20rpx 30rpx;
}
.site-input {
padding: 0 30rpx 0 200rpx;
position: relative;
line-height: 90rpx;
min-height: 90rpx;
}
.site-input label {
position: absolute;
left: 30rpx;
top: 0;
}
.site-input input {
height: 90rpx;
}
.site-input image {
width: 38rpx;
height: 38rpx;
position: absolute;
right: 20rpx;
top: calc(50% - 19rpx);
}
.conneColor {
width: calc(100%- 100rpx);
}
.site-input::before {
position: absolute;
bottom: 0;
left: 30rpx;
right: 0;
height: 1rpx;
content: "";
background: #e4e6f2;
}
.site-input:last-child::before {
display: none;
}
.tui-picker-detail {
width: 33%;
}
.site-btn button[size="mini"] {
width: 100%;
background: #f57e32;
height: 80rpx;
line-height: 80rpx;
font-size: 30rpx;
color: white;
padding: 0;
}
/* pickerView */
.pickerView-back {
background: rgba(0, 0, 0, .3);
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: none;
}
.pickerView-back.active {
display: block;
}
.pickerView-layer {
position: fixed;
bottom: -571rpx;
left: 0;
width: 100%;
background: white;
transition: all .3s;
}
.pickerView-layer.active {
bottom: 0;
}
.pickerView-btn {
line-height: 90rpx;
font-size: 30rpx;
padding: 0 30rpx;
display: flex;
justify-content: space-between;
}
.pickerView {
height: 480rpx;
padding: 0 10rpx;
}
.pickerView-name {
line-height: 80rpx;
padding: 0 20rpx;
text-align: center;
}
.pickerView-mask {
border-top: solid 1rpx #e4e6f2;
}
.pickerView-indicator {
height: 80rpx;
}
.pickerView-determine {
color: #f57e32;
}
.pickerView-cancel {
color: #747788;
}
.site-switch {
font-size: 32rpx;
margin: 30rpx;
display: flex;
line-height: 40rpx;
}
.site-switch text {
flex: 1;
}
.site-switch-active {
color: #797979;
}