|
|
@@ -1,37 +1,44 @@
|
|
|
<template>
|
|
|
- <mobile-frame :frameStyle="frameStyle" @toPath="toPath">
|
|
|
+ <mobile-frame>
|
|
|
<view class="main">
|
|
|
<view class="one">
|
|
|
- <uni-forms ref="form" :modelValue="form" :rules="rules" label-width="auto">
|
|
|
+ <uni-forms ref="form" v-model="form" :rules="rules" label-width="auto">
|
|
|
<uni-forms-item label="收货人" name="name">
|
|
|
<uni-easyinput type="text" v-model="form.name" placeholder="请输入收货人" />
|
|
|
</uni-forms-item>
|
|
|
<uni-forms-item label="联系电话" name="phone">
|
|
|
- <uni-easyinput type="text" v-model="form.phone" placeholder="请输入联系电话" />
|
|
|
+ <uni-easyinput type="number" v-model="form.phone" placeholder="请输入联系电话" />
|
|
|
</uni-forms-item>
|
|
|
- <uni-forms-item label="所在地区" name="deptname">
|
|
|
- <uni-data-picker placeholder="请选择省,市,区/街道" popup-title="选择省,市,区/街道" :localdata="provincial"
|
|
|
- @change="onchange" class="local">
|
|
|
- </uni-data-picker>
|
|
|
- <text class="localicon iconfont icon-dingweixiao"
|
|
|
- @click="tolocation('/pagesMy/address/location')">定位</text>
|
|
|
+ <uni-forms-item label="地图选点" v-if="is_wx==true">
|
|
|
+ <button type="default" size="mini" class="toLoacl" @click="toLocaltion()">地图选点</button>
|
|
|
</uni-forms-item>
|
|
|
- <uni-forms-item label="详细地址" name="address">
|
|
|
- <uni-easyinput type="text" v-model="form.address" placeholder="请输入所在小区/大厦/学校" />
|
|
|
+ <uni-forms-item label="所在省份" name="province">
|
|
|
+ <picker class="picker" mode="selector" :range="provinceList" @change="proChange" range-key="value">
|
|
|
+ <view>{{form.province||'请选择所在省份'}}</view>
|
|
|
+ </picker>
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="所在市" name="city">
|
|
|
+ <picker class="picker" mode="selector" :range="cityList" @change="cityChange" range-key="value">
|
|
|
+ <view>{{form.city||'请选择所在市'}}</view>
|
|
|
+ </picker>
|
|
|
</uni-forms-item>
|
|
|
- <uni-forms-item label="楼牌号" name="num">
|
|
|
- <uni-easyinput type="text" v-model="form.num" placeholder="请输入楼牌号" />
|
|
|
+ <uni-forms-item label="所在区" name="area">
|
|
|
+ <picker class="picker" mode="selector" :range="areaList" @change="areaChange" range-key="value">
|
|
|
+ <view>{{form.area||'请选择所在区'}}</view>
|
|
|
+ </picker>
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="详细地址" name="address">
|
|
|
+ <uni-easyinput type="textarea" v-model="form.address" placeholder="请输入详细地址" />
|
|
|
</uni-forms-item>
|
|
|
- <uni-forms-item label="设为默认" name="true">
|
|
|
- <switch :checked="check" @change="switchChange" />
|
|
|
+ <uni-forms-item label="是否默认" name="is_default">
|
|
|
+ <switch color="#FB1438" :checked="form.is_default=='1'?true:false" @change="defaChange" />
|
|
|
</uni-forms-item>
|
|
|
</uni-forms>
|
|
|
<view class="btn">
|
|
|
- <button type="primary" @click="onSubmit('form')" size="small">提交保存</button>
|
|
|
+ <button type="primary" size="mini" @click="onSubmit('form')">提交保存</button>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
-
|
|
|
</mobile-frame>
|
|
|
</template>
|
|
|
|
|
|
@@ -39,9 +46,9 @@
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
- frameStyle: {
|
|
|
- useBar: false
|
|
|
- },
|
|
|
+ is_wx: true,
|
|
|
+ user: {},
|
|
|
+ id: '',
|
|
|
form: {},
|
|
|
rules: {
|
|
|
name: {
|
|
|
@@ -57,10 +64,22 @@
|
|
|
tel: true
|
|
|
}]
|
|
|
},
|
|
|
- deptname: {
|
|
|
+ province: {
|
|
|
rules: [{
|
|
|
required: true,
|
|
|
- errorMessage: '请输入机构名称'
|
|
|
+ errorMessage: '请选择所在省'
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ city: {
|
|
|
+ rules: [{
|
|
|
+ required: true,
|
|
|
+ errorMessage: '请选择所在市'
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ area: {
|
|
|
+ rules: [{
|
|
|
+ required: false,
|
|
|
+ errorMessage: '请选择所在区'
|
|
|
}]
|
|
|
},
|
|
|
address: {
|
|
|
@@ -70,69 +89,185 @@
|
|
|
}]
|
|
|
},
|
|
|
},
|
|
|
- provincial: [],
|
|
|
- check: false,
|
|
|
+ provinceList: [ //所在省份
|
|
|
+ {
|
|
|
+ code: '1',
|
|
|
+ value: '吉林省',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ code: '2',
|
|
|
+ value: '辽宁省',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ code: '3',
|
|
|
+ value: '黑龙江省',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ cityList: [ //所在市
|
|
|
+ {
|
|
|
+ code: '1-1',
|
|
|
+ value: '长春市',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ code: '2-1',
|
|
|
+ value: '大连市',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ code: '3-1',
|
|
|
+ value: '哈尔滨市',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ areaList: [ //所在区
|
|
|
+ {
|
|
|
+ code: '1-1-1',
|
|
|
+ value: '朝阳区'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ code: '2-1-1',
|
|
|
+ value: '开发区'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ code: '3-1-1',
|
|
|
+ value: '发展区'
|
|
|
+ },
|
|
|
+ ]
|
|
|
+
|
|
|
};
|
|
|
},
|
|
|
onLoad: function(e) {
|
|
|
- console.log(e);
|
|
|
+ const that = this;
|
|
|
+ that.$set(that, `id`, e && e.id || '');
|
|
|
+ that.watchLogin();
|
|
|
+ },
|
|
|
+ onShow: function() {
|
|
|
+ const that = this;
|
|
|
+ that.searchplatform();
|
|
|
+ that.searchLocal();
|
|
|
+ },
|
|
|
+ onUnload: function() {
|
|
|
+ const chooseLocation = requirePlugin('chooseLocation');
|
|
|
+ chooseLocation.setLocation(null);
|
|
|
},
|
|
|
- onShow: function() {},
|
|
|
methods: {
|
|
|
- toPath(e) {
|
|
|
- if (e && e.route) uni.redirectTo({
|
|
|
- url: `/${e.route}`
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
- // 是否设为默认地址
|
|
|
- switchChange(e) {
|
|
|
+ // 监听用户是否登录
|
|
|
+ watchLogin() {
|
|
|
const that = this;
|
|
|
- const {
|
|
|
- value
|
|
|
- } = e.detail;
|
|
|
- that.$set(that, `check`, value);
|
|
|
+ uni.getStorage({
|
|
|
+ key: 'token',
|
|
|
+ success: async function(res) {
|
|
|
+ let user = that.$jwt(res.data);
|
|
|
+ if (user) {
|
|
|
+ that.$set(that, `user`, user);
|
|
|
+ if (that.id) {
|
|
|
+ let arr = await that.$api(`/address/${that.id}`, 'GET')
|
|
|
+ if (arr.errcode == '0') {
|
|
|
+ that.$set(that, `form`, arr.data)
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ that.$set(that, `form`, {
|
|
|
+ name: user.name || '',
|
|
|
+ phone: user.phone || ''
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ fail: function(err) {
|
|
|
+ uni.reLaunch({
|
|
|
+ url: '/pages/login/index'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
- // 选择城市
|
|
|
- onchange() {},
|
|
|
// 定位
|
|
|
- tolocation(route, e) {
|
|
|
+ toLocaltion() {
|
|
|
+ const that = this;
|
|
|
+ const key = that.$config.txlocalKey;
|
|
|
+ const referer = that.$config.txlocalReferer;
|
|
|
uni.navigateTo({
|
|
|
- url: `${route}`
|
|
|
- })
|
|
|
+ url: `plugin://chooseLocation/index?key=${key}&referer=${referer}`
|
|
|
+ });
|
|
|
},
|
|
|
- // 提交保存
|
|
|
- onSubmit() {
|
|
|
+ searchLocal() {
|
|
|
+ const that = this;
|
|
|
+ const chooseLocation = requirePlugin('chooseLocation');
|
|
|
+ const location = chooseLocation.getLocation();
|
|
|
+ if (location) {
|
|
|
+ that.$set(that.form, `province`, location.province || '');
|
|
|
+ that.$set(that.form, `city`, location.city || '');
|
|
|
+ that.$set(that.form, `area`, location.district || '');
|
|
|
+ that.$set(that.form, `address`, location.address || '');
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 选择省份
|
|
|
+ proChange(e) {
|
|
|
+ const that = this;
|
|
|
+ let data = that.provinceList[e.detail.value];
|
|
|
+ if (data) {
|
|
|
+ that.$set(that.form, `province`, data.value)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 选择区
|
|
|
+ areaChange(e) {
|
|
|
const that = this;
|
|
|
- let data = that.form;
|
|
|
- data = {
|
|
|
- ...data,
|
|
|
- check: that.check
|
|
|
+ let data = that.areaList[e.detail.value];
|
|
|
+ if (data) {
|
|
|
+ that.$set(that.form, `area`, data.value)
|
|
|
}
|
|
|
- console.log(data);
|
|
|
- // this.$refs.form.validate().then(async (res) => {
|
|
|
- // let arr;
|
|
|
- // if (data._id) {
|
|
|
- // arr = await that.$api(``, 'POST', data)
|
|
|
- // } else {
|
|
|
- // arr = await that.$api(``, 'POST', data)
|
|
|
- // }
|
|
|
- // if (arr.errcode == '0') {
|
|
|
- // uni.showToast({
|
|
|
- // title: `维护信息成功`,
|
|
|
- // icon: 'success',
|
|
|
- // duration: 2000
|
|
|
- // });
|
|
|
- // that.back()
|
|
|
- // } else {
|
|
|
- // uni.showToast({
|
|
|
- // title: arr.errmsg,
|
|
|
- // icon: 'error',
|
|
|
- // duration: 2000
|
|
|
- // })
|
|
|
- // }
|
|
|
- // })
|
|
|
},
|
|
|
+ // 选择市
|
|
|
+ cityChange(e) {
|
|
|
+ const that = this;
|
|
|
+ let data = that.cityList[e.detail.value];
|
|
|
+ if (data) {
|
|
|
+ that.$set(that.form, `city`, data.value)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 是否默认
|
|
|
+ defaChange(e) {
|
|
|
+ const that = this;
|
|
|
+ let value = e.detail.value == true ? '1' : '0';
|
|
|
+ that.$set(that.form, `is_default`, value)
|
|
|
+ },
|
|
|
+ // 提交保存
|
|
|
+ onSubmit(ref) {
|
|
|
+ const that = this;
|
|
|
+ let id = that.id;
|
|
|
+ let user = that.user;
|
|
|
+ that.$refs[ref].validate().then(async params => {
|
|
|
+ params.customer = user.id;
|
|
|
+ let res;
|
|
|
+ if (id) res = await that.$api(`/address/${id}`, 'POST', params)
|
|
|
+ else res = await that.$api(`/address`, 'POST', params);
|
|
|
+ if (res.errcode == '0') {
|
|
|
+ uni.showToast({
|
|
|
+ title: '维护信息成功',
|
|
|
+ icon: 'none'
|
|
|
+ })
|
|
|
+ uni.navigateBack({
|
|
|
+ delta: 1
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ uni.showToast({
|
|
|
+ title: res.errmsg,
|
|
|
+ icon: 'none'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 查询平台
|
|
|
+ searchplatform() {
|
|
|
+ const that = this;
|
|
|
+ uni.getStorage({
|
|
|
+ key: 'system',
|
|
|
+ success: function(res) {
|
|
|
+ if (res.data.uniPlatform == 'mp-weixin') {
|
|
|
+ that.$set(that, `is_wx`, true)
|
|
|
+ } else {
|
|
|
+ that.$set(that, `is_wx`, false)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
@@ -147,40 +282,44 @@
|
|
|
.one {
|
|
|
padding: 2vw;
|
|
|
|
|
|
- .uni-input {
|
|
|
- border: #f1f1ff 1px solid;
|
|
|
- padding: 2vw 2vw;
|
|
|
- border-radius: 1vw;
|
|
|
+ .toLoacl {
|
|
|
+ margin: 1vw 0 0 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .picker {
|
|
|
+ border: 1px solid #3333;
|
|
|
+ border-radius: 5px;
|
|
|
+ padding: 2vw;
|
|
|
}
|
|
|
|
|
|
.btn {
|
|
|
text-align: center;
|
|
|
|
|
|
button {
|
|
|
- margin: 0 2vw 2vw 2vw;
|
|
|
+ width: 30%;
|
|
|
+ font-size: 14px;
|
|
|
background-color: var(--f35BColor);
|
|
|
- color: var(--fffColor);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .uni-forms-item {
|
|
|
- margin-bottom: 6vw !important;
|
|
|
- display: flex;
|
|
|
- flex-direction: row;
|
|
|
- }
|
|
|
+ // .uni-forms-item {
|
|
|
+ // margin-bottom: 6vw !important;
|
|
|
+ // display: flex;
|
|
|
+ // flex-direction: row;
|
|
|
+ // }
|
|
|
|
|
|
- .local {
|
|
|
- .uni-data-tree {
|
|
|
- width: 60vw;
|
|
|
- }
|
|
|
+ // .local {
|
|
|
+ // .uni-data-tree {
|
|
|
+ // width: 60vw;
|
|
|
+ // }
|
|
|
|
|
|
- }
|
|
|
+ // }
|
|
|
|
|
|
- .localicon {
|
|
|
- position: absolute;
|
|
|
- right: 0;
|
|
|
- top: 5px;
|
|
|
- }
|
|
|
+ // .localicon {
|
|
|
+ // position: absolute;
|
|
|
+ // right: 0;
|
|
|
+ // top: 5px;
|
|
|
+ // }
|
|
|
</style>
|
