|
@@ -6,22 +6,33 @@
|
|
|
<view class="label">
|
|
|
收货人
|
|
|
</view>
|
|
|
- <input type="text" value="胡一天" class="input" placeholder="请填写收货人姓名" placeholder-class="placeholder" />
|
|
|
+ <input type="text" v-model="params.name" class="input" placeholder="请填写收货人姓名" placeholder-class="placeholder" />
|
|
|
</view>
|
|
|
<view class="item">
|
|
|
<view class="label">
|
|
|
手机号码
|
|
|
</view>
|
|
|
- <input type="text" value="14589645897" class="input" placeholder="请填写手机号码"
|
|
|
+ <input type="text" v-model="params.phone" class="input" placeholder="请填写手机号码"
|
|
|
placeholder-class="placeholder" />
|
|
|
</view>
|
|
|
<view class="item">
|
|
|
<view class="label">
|
|
|
所在地区
|
|
|
</view>
|
|
|
- <picker class="picker" mode="multiSelector" range-key="name" @change="bindPickerChange"
|
|
|
- @columnchange="bindColumnchange" :value="addressPickerValue" :range="addressPickerData">
|
|
|
- <input class="input" disabled :value="addressPickerValueStr" placeholder="省、市、区、街道"
|
|
|
+ <picker
|
|
|
+ class="picker"
|
|
|
+ mode="multiSelector"
|
|
|
+ range-key="short_name"
|
|
|
+ @change="bindPickerChange"
|
|
|
+ @columnchange="bindColumnchange"
|
|
|
+ :value="addressPickerValue"
|
|
|
+ :range="addressPickerData"
|
|
|
+ >
|
|
|
+ <input
|
|
|
+ class="input"
|
|
|
+ disabled
|
|
|
+ :value="addressPickerValueStr"
|
|
|
+ placeholder="省、市、区、街道"
|
|
|
placeholder-class="placeholder" />
|
|
|
</picker>
|
|
|
<image src="../../../static/back-icon2.png" class="back-icon" mode="widthFix"></image>
|
|
@@ -30,62 +41,209 @@
|
|
|
<view class="label">
|
|
|
详细地址
|
|
|
</view>
|
|
|
- <textarea class="textarea" value="昆仑花园二单元2号楼404" placeholder="小区楼栋/乡村名称"
|
|
|
+ <textarea class="textarea" v-model="params.detail" placeholder="小区楼栋/乡村名称"
|
|
|
placeholder-class="placeholder" />
|
|
|
</view>
|
|
|
<view class="item">
|
|
|
<view class="row-between">
|
|
|
设为默认地址
|
|
|
- <switch checked="true" style="transform: scale(0.5);" color="#F2501A" @change="" />
|
|
|
+ <switch :checked="select" style="transform: scale(0.5);" color="#F2501A" @change="switchChange" />
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="btn-box">
|
|
|
- <button type="default" class="active">保存</button>
|
|
|
+ <button type="default" class="active" @tap="setDeliveryAddress()">保存</button>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import {getCityData} from './city.js';
|
|
|
- const {cityData ,cityMap} = getCityData();
|
|
|
- const province = cityMap[0];
|
|
|
- let city = cityMap[province[0].code];
|
|
|
- let area = cityMap[city[0].code];
|
|
|
+ import {
|
|
|
+ areaGetAreaChildrenByID,
|
|
|
+ userManageGetDeliveryAddressDetail,
|
|
|
+ userManageSetDeliveryAddress
|
|
|
+ } from '../../../common/service.js';
|
|
|
+ import { validatorFun } from '../../../common/utils/util';
|
|
|
+
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
- select: true,
|
|
|
+ select: false,
|
|
|
+
|
|
|
+ params: {
|
|
|
+ id: 0, // 收货地址记录id(不传值是添加)
|
|
|
+ pro_name: '', // 省名
|
|
|
+ city_name: '', // 市名
|
|
|
+ county_name: '', // 县区名
|
|
|
+ street_name: '', // 街道
|
|
|
+ detail: '', // 详细地址
|
|
|
+ phone: '', // 联系电话
|
|
|
+ name: '', // 联系人
|
|
|
+ is_mr: 0, // 是否是默认(0不默认,1默认)
|
|
|
+ },
|
|
|
|
|
|
// 地址
|
|
|
- addressPickerData: [province, city, area],
|
|
|
- addressPickerValue: [0, 0, 0],
|
|
|
+ addressPickerData: [[], [], [], []],
|
|
|
+ addressPickerDataNames: [[], [], [], []],
|
|
|
+ addressPickerValue: [0, 0, 0, 0],
|
|
|
addressPickerValueStr: '',
|
|
|
}
|
|
|
+ },
|
|
|
+ onLoad(option) {
|
|
|
+ const id = parseInt(option.id || 0);
|
|
|
+ if (id > 0) {
|
|
|
+ this.params.id = id;
|
|
|
+ this.getDetail();
|
|
|
+ } else {
|
|
|
+ this.getAreaChildrenByID();
|
|
|
+ }
|
|
|
},
|
|
|
- methods: {
|
|
|
+ methods: {
|
|
|
+ setDeliveryAddress() {
|
|
|
+ const params = this.params;
|
|
|
+ const errList = validatorFun(params, [
|
|
|
+ ['name', ['notNull', '请输入收货人']],
|
|
|
+ ['phone', ['notNull', '请输入手机号码'], ['isMobile', '请输入正确手机号']],
|
|
|
+ ['pro_name', ['notNull', '请输入选择所在地区']],
|
|
|
+ ['city_name', ['notNull', '请输入选择所在地区']],
|
|
|
+ ['county_name', ['notNull', '请输入选择所在地区']],
|
|
|
+ ['street_name', ['notNull', '请输入选择所在地区']],
|
|
|
+ ['detail', ['notNull', '请输入详细地址']],
|
|
|
+ ]);
|
|
|
+ if (errList.length > 0) {
|
|
|
+ return uni.showToast({
|
|
|
+ icon: 'none',
|
|
|
+ title: errList[0].errMsg,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ userManageSetDeliveryAddress({
|
|
|
+ data: params,
|
|
|
+ success: ({code, msg, data}) => {
|
|
|
+ if (code == 1) {
|
|
|
+ uni.navigateBack({
|
|
|
+ delta: 1,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ uni.showToast({
|
|
|
+ icon: 'none',
|
|
|
+ title: msg,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getDetail() {
|
|
|
+ userManageGetDeliveryAddressDetail({
|
|
|
+ data: { id: this.params.id },
|
|
|
+ success: ({code, msg, data})=> {
|
|
|
+ if (code == 1) {
|
|
|
+ const {
|
|
|
+ id,
|
|
|
+ pro_id,
|
|
|
+ city_id,
|
|
|
+ county_id,
|
|
|
+ pro_name,
|
|
|
+ city_name,
|
|
|
+ county_name,
|
|
|
+ street_name,
|
|
|
+ detail,
|
|
|
+ phone,
|
|
|
+ name,
|
|
|
+ is_mr,
|
|
|
+ } = data;
|
|
|
+ this.params = {
|
|
|
+ id,
|
|
|
+ pro_name,
|
|
|
+ city_name,
|
|
|
+ county_name,
|
|
|
+ street_name,
|
|
|
+ detail,
|
|
|
+ phone,
|
|
|
+ name,
|
|
|
+ is_mr,
|
|
|
+ };
|
|
|
+ const arr = [
|
|
|
+ pro_name,
|
|
|
+ city_name,
|
|
|
+ county_name,
|
|
|
+ street_name,
|
|
|
+ ];
|
|
|
+ this.select = is_mr == 1;
|
|
|
+ this.addressPickerValueStr = arr.join(' ');
|
|
|
+ let count = 0;
|
|
|
+ const fn = (id2 = 0, idx2, level = 1) => {
|
|
|
+ const name = arr.splice(0, 1)[0];
|
|
|
+ this.getAreaChildrenByID(id2, idx2, level, level, () => {
|
|
|
+ const idx = this.addressPickerDataNames[level - 1].indexOf(name);
|
|
|
+ if ( arr.length > 0 ) {
|
|
|
+ let id3 = this.addressPickerData[level - 1][idx].id;
|
|
|
+ fn(id3, idx, level + 1);
|
|
|
+ } else {
|
|
|
+ this.getAreaChildrenByID(0, idx, level + 1, level);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ fn();
|
|
|
+ } else {
|
|
|
+ uni.showToast({
|
|
|
+ icon: 'none',
|
|
|
+ title: msg,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ switchChange(e) {
|
|
|
+ this.select = e.detail.value;
|
|
|
+ this.params.is_mr = e.detail.value ? 1 : 0;
|
|
|
+ },
|
|
|
+ getAreaChildrenByID(id = 0, idx = 0, level = 1, maxLevel = 4, callback) {
|
|
|
+ const list = [...this.addressPickerData];
|
|
|
+ const listIds = [...this.addressPickerDataNames];
|
|
|
+ const vals = [...this.addressPickerValue];
|
|
|
+ vals[level - 2] = idx;
|
|
|
+ const fn = (id = 0, level2 = 1) => {
|
|
|
+ if (level2 > maxLevel) {
|
|
|
+ this.$set(this, 'addressPickerData', list);
|
|
|
+ this.$set(this, 'addressPickerDataNames', listIds);
|
|
|
+ this.$set(this, 'addressPickerValue', vals);
|
|
|
+ callback && callback();
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ areaGetAreaChildrenByID({
|
|
|
+ data: {id},
|
|
|
+ success: ({code, msg, data}) => {
|
|
|
+ if (code == 1) {
|
|
|
+ list[level2 - 1] = data.list;
|
|
|
+ listIds[level2 - 1] = data.list.map(item => item.name);
|
|
|
+ vals[level2 - 1] = 0;
|
|
|
+ fn(data.list[0].id, level2 + 1);
|
|
|
+ } else {
|
|
|
+ uni.showToast({
|
|
|
+ icon: 'none',
|
|
|
+ title: msg,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ };
|
|
|
+ fn(id, level);
|
|
|
+ },
|
|
|
selectedDefault: function() {
|
|
|
this.select = !this.select;
|
|
|
},
|
|
|
bindPickerChange(e) {
|
|
|
- const [pIdx, cIdx, aIdx] = e.detail.value;
|
|
|
- this.addressPickerValue = e.detail;
|
|
|
- this.addressPickerValueStr = `${province[pIdx].name} ${city[cIdx].name} ${area[aIdx].name}`;
|
|
|
+ const [pIdx, cIdx, aIdx, sIdx] = e.detail.value;
|
|
|
+ const [province, city, area, street] = this.addressPickerData;
|
|
|
+ this.addressPickerValue = e.detail.value;
|
|
|
+ this.addressPickerValueStr = `${province[pIdx].name} ${city[cIdx].name} ${area[aIdx].name} ${street[sIdx].name}`;
|
|
|
+ this.params.pro_name = province[pIdx].name;
|
|
|
+ this.params.city_name = city[cIdx].name;
|
|
|
+ this.params.county_name = area[aIdx].name;
|
|
|
+ this.params.street_name= street[sIdx].name;
|
|
|
},
|
|
|
bindColumnchange(e) {
|
|
|
const {column, value} = e.detail;
|
|
|
- if (column === 0) {
|
|
|
- const code = this.addressPickerData[column][value].code;
|
|
|
- city = cityMap[code];
|
|
|
- area = cityMap[city[0].code];
|
|
|
- this.addressPickerData[1] = city;
|
|
|
- this.addressPickerData[2] = area;
|
|
|
- }
|
|
|
- if (column === 1) {
|
|
|
- const code = this.addressPickerData[column][value].code;
|
|
|
- area = cityMap[code];
|
|
|
- this.addressPickerData[2] = area;
|
|
|
- }
|
|
|
+ this.getAreaChildrenByID(this.addressPickerData[column][value].id, value, column + 2);
|
|
|
},
|
|
|
}
|
|
|
}
|