Skip to content

Commit ef60074

Browse files
author
alistar
committed
complete profile
1 parent 74f767a commit ef60074

File tree

10 files changed

+738
-8
lines changed

10 files changed

+738
-8
lines changed

‎src/page/profile/children/children/address.vue

Lines changed: 98 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,98 @@
1+
<template>
2+
<div class="rating_page">
3+
<head-top head-title="编辑地址" go-back='true'>
4+
<span slot="edit" class="edit" @click="editThing">{{editText}}</span>
5+
</head-top>
6+
<section class="address">
7+
<ul class="addresslist">
8+
<li v-for="(item,index) in removeAddress" :key="index">
9+
<div>
10+
<p>{{item.address}}</p>
11+
<p><span>{{item.phone}}</span><span v-if="item.phonepk">、{{item.phonepk}}</span></p>
12+
</div>
13+
<div class="deletesite" v-if="deletesite">
14+
<span @click="deleteSite(index, item)">x</span>
15+
</div>
16+
</li>
17+
</ul>
18+
<router-link to='/profile/info/address/add'>
19+
<div class="addsite">
20+
<span>新增地址</span>
21+
<span class="addsvg">
22+
<svg fill="#d8d8d8">
23+
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#arrow-right"></use>
24+
</svg>
25+
</span>
26+
</div>
27+
</router-link>
28+
</section>
29+
<transition name="router-slid" mode="out-in">
30+
<router-view></router-view>
31+
</transition>
32+
</div>
33+
</template>
34+
35+
<script>
36+
import headTop from '@/components/header/head'
37+
import { getImgPath } from '@/components/common/mixin'
38+
import { mapState, mapActions } from 'vuex'
39+
// import { getAddressList, deleteAddress } from 'src/service/getData'
40+
41+
export default {
42+
data () {
43+
return {
44+
deletesite: false, // 是否编辑状态
45+
editText: '编辑',
46+
adressList: [] // 地址列表
47+
}
48+
},
49+
mounted () {
50+
this.initData()
51+
},
52+
mixins: [getImgPath],
53+
components: {
54+
headTop
55+
},
56+
computed: {
57+
...mapState(['userInfo', 'removeAddress'])
58+
},
59+
methods: {
60+
...mapActions(['saveAddress']),
61+
// 初始化信息
62+
initData () {
63+
if (this.userInfo && this.userInfo.user_id) {
64+
this.saveAddress()
65+
}
66+
},
67+
// 编辑
68+
editThing () {
69+
if (this.editText === '编辑') {
70+
this.editText = '完成'
71+
this.deletesite = true
72+
} else {
73+
this.editText = '编辑'
74+
this.deletesite = false
75+
}
76+
},
77+
// 删除地址
78+
async deleteSite (index, item) {
79+
if (this.userInfo && this.userInfo.user_id) {
80+
// await deleteAddress(this.userInfo.user_id, item.id)
81+
this.$axios.post('/v1/users/' + this.userInfo.user_id + '/addresses/' + item.id, {}).then((res) => {
82+
this.removeAddress.splice(index, 1)
83+
})
84+
}
85+
}
86+
},
87+
watch: {
88+
userInfo: function (value) {
89+
if (value && value.user_id) {
90+
this.initData()
91+
}
92+
}
93+
}
94+
}
95+
</script>
96+
<style lang='scss' scoped>
97+
@import "../../../../style/address.scss";
98+
</style>

‎src/page/profile/children/children/children/add.vue

Lines changed: 175 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,175 @@
1+
<template>
2+
<div class="rating_page">
3+
<head-top head-title="新增地址" go-back='true'></head-top>
4+
<section class="adddetail">
5+
<form action="" v-on:submit.prevent>
6+
<section class="ui-padding-block">
7+
<div class="input-new">
8+
<input type="text" placeholder="请填写你的姓名" :class="{verifies:verify}" v-model="message" @input="inputThing">
9+
<p v-if="verify">请填写您的姓名</p>
10+
</div>
11+
<router-link to='/profile/info/address/add/addDetail' class="add-detail">
12+
<div class="input-new">
13+
<input type="text" placeholder="小区/写字楼/学校等" readonly="readonly" v-model="addAddress" />
14+
</div>
15+
</router-link>
16+
<div class="input-new">
17+
<input type="text" placeholder="请填写详细送餐地址" :class="{verifies:verifythree}" @input="inputThingthree" v-model="mesthree"/>
18+
<p v-if="verifythree">{{sendaddress}}</p>
19+
</div>
20+
<div class="input-new">
21+
<input type="text" placeholder="请填写能够联系到您的手机号" :class="{verifies:verifyfour}" v-model="telenum" @input="inputThingfour" />
22+
<p v-if="verifyfour">{{telephone}}</p>
23+
</div>
24+
<div class="input-new">
25+
<input type="text" placeholder="备用联系电话（选填）" v-model="standbytelenum" @input="inputThingfive" />
26+
<p v-if="verifyfive">{{standbytele}}</p>
27+
</div>
28+
</section>
29+
<section class="addbutton">
30+
<button :class="{butopacity:butpart}" @click.prevent="submitThing">新增地址</button>
31+
</section>
32+
</form>
33+
</section>
34+
<transition name="router-slid" mode="out-in">
35+
<router-view></router-view>
36+
</transition>
37+
<alert-tip v-if="showAlert" @closeTip="showAlert = false" :alertText="alertText"></alert-tip>
38+
</div>
39+
</template>
40+
41+
<script>
42+
import headTop from '@/components/header/head'
43+
import { getImgPath } from '@/components/common/mixin'
44+
import { mapState, mapMutations } from 'vuex'
45+
// import { postAddAddress } from '@/service/getData'
46+
import alertTip from '@/components/common/alertTip'
47+
48+
export default {
49+
data () {
50+
return {
51+
verify: false, // 姓名
52+
verifytwo: false, // 备注
53+
verifythree: false, // 地址
54+
verifyfour: false, // 电话
55+
verifyfive: false, // 备用电话
56+
butpart: false, // 新增地址按钮的透明度
57+
sendaddress: '', // 地址
58+
message: '', // 信息
59+
mesthree: '', // 送餐地址
60+
telenum: '', // 手机号
61+
telephone: '', // 手机号提示
62+
standbytele: '', // 备用手机号提示
63+
standbytelenum: '', // 备用手机号
64+
addSearch: false, // 添加搜索地址
65+
newAddress: {}, // 增加数组的元素
66+
showAlert: false, // 弹出框
67+
alertText: null // 弹出信息
68+
}
69+
},
70+
mixins: [getImgPath],
71+
components: {
72+
headTop,
73+
alertTip
74+
},
75+
computed: {
76+
...mapState([
77+
'userInfo',
78+
'addAddress',
79+
'removeAddress',
80+
'newAddress',
81+
'geohash'
82+
])
83+
},
84+
methods: {
85+
...mapMutations(['ADD_ADDRESS']),
86+
inputThing () {
87+
!this.message ? (this.verify = true) : (this.verify = false)
88+
this.bindThing()
89+
},
90+
// 输入地址
91+
inputThingthree () {
92+
this.verifythree = true
93+
if (this.mesthree.length === 0) {
94+
this.sendaddress = '请详细填写送餐地址'
95+
} else if (this.mesthree.length > 0 && this.mesthree.length <= 2) {
96+
this.sendaddress = '送餐地址太短了，不能辨识'
97+
} else {
98+
this.sendaddress = ''
99+
this.verifythree = false
100+
}
101+
this.bindThing()
102+
},
103+
// 输入手机号
104+
inputThingfour () {
105+
this.verifyfour = true
106+
if (/^[1][358][0-9]{9}$/.test(this.telenum)) {
107+
this.verifyfour = false
108+
} else if (this.telenum === '') {
109+
this.telephone = '手机号不能为空'
110+
} else {
111+
this.telephone = '请输入正确的手机号'
112+
}
113+
this.bindThing()
114+
},
115+
// 输入备注手机号
116+
inputThingfive () {
117+
this.verifyfive = true
118+
if (
119+
/^[1][358][0-9]{9}$/.test(this.standbytelenum) ||
120+
this.standbytelenum === ''
121+
) {
122+
this.verifyfive = false
123+
} else {
124+
this.standbytele = '请输入正确的手机号'
125+
}
126+
this.bindThing()
127+
},
128+
bindThing () {
129+
if (this.message && this.mesthree && !this.verifyfour) {
130+
this.butpart = true
131+
} else {
132+
this.butpart = false
133+
}
134+
},
135+
// 保存地址
136+
submitThing () {
137+
let data = {
138+
userId: this.userInfo.user_id,
139+
address: this.mesthree,
140+
address_detail: this.addAddress,
141+
geohash: this.geohash,
142+
name: this.message,
143+
phone: this.telenum,
144+
phone_bk: this.standbytelenum,
145+
poi_type: 0,
146+
sex: 1,
147+
tag: '公司',
148+
tag_type: 4
149+
}
150+
this.$axios.post('/v1/users/' + this.userInfo.user_id + '/addresses', data).then((res) => {
151+
if (res.message) {
152+
this.showAlert = true
153+
this.alertText = res.message
154+
} else if (this.butpart) {
155+
// 保存的地址存入vuex
156+
this.ADD_ADDRESS({
157+
name: this.message,
158+
address: this.mesthree,
159+
address_detail: this.addAddress,
160+
geohash: 'wtw37r7cxep4',
161+
phone: this.telenum,
162+
phone_bk: this.standbytelenum,
163+
poi: this.addAddress,
164+
poi_type: 0
165+
})
166+
this.$router.go(-1)
167+
}
168+
})
169+
}
170+
}
171+
}
172+
</script>
173+
<style lang='scss'>
174+
@import "../../../../../style/add.scss";
175+
</style>

‎src/page/profile/children/children/children/children/addDetail.vue

Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
<template>
2+
<div class="rating_page">
3+
<head-top head-title="搜索地址" go-back='true'></head-top>
4+
<section>
5+
<div class="add-detail">
6+
<input type="text" placeholder="请输入小区/写字楼/学校等" v-model="inputAdress">
7+
<button @click="inputThing">确认</button>
8+
</div>
9+
<div class="warnpart">为了满足商家的送餐要求，建议您从列表中选择地址</div>
10+
<div class="point" v-show="warning">
11+
<p>找不到地址？</p>
12+
<p>请尝试输入小区、写字楼或学校名</p>
13+
<p>详细地址（如门牌号）可稍后输入哦。</p>
14+
</div>
15+
</section>
16+
<section class="poisearch-container" v-show="adressList">
17+
<ul>
18+
<li v-for="(item, index) in adressList" @click="listClick(index)" :key="index">
19+
<p>{{item.name}}</p>
20+
<p>{{item.address}}</p>
21+
</li>
22+
</ul>
23+
</section>
24+
</div>
25+
</template>
26+
27+
<script>
28+
import headTop from '@/components/header/head'
29+
import { getImgPath } from '@/components/common/mixin'
30+
import { searchNearby } from '@/service/getData'
31+
import { mapMutations, mapState } from 'vuex'
32+
export default {
33+
data () {
34+
return {
35+
warning: true,
36+
inputAdress: '',
37+
adressList: [] // 地址列表
38+
}
39+
},
40+
created () {
41+
this.inputAdress = this.addAddress ? this.addAddress : this.inputAdress
42+
},
43+
mounted () {
44+
// getSearchAddress(this.inputAdress).then(res => {
45+
// this.adressList=res
46+
// this.warning=true
47+
// if(this.adressList.length > 0){
48+
// this.warning=false
49+
// if(this.inputAdress == ''){
50+
// this.adressList=[]
51+
// this.warning=true
52+
// }
53+
// }
54+
// })
55+
},
56+
mixins: [getImgPath],
57+
components: {
58+
headTop
59+
},
60+
computed: {
61+
...mapState(['addAddress'])
62+
},
63+
methods: {
64+
...mapMutations(['SAVE_ADDDETAIL']),
65+
// 搜索地址
66+
inputThing () {
67+
searchNearby(this.inputAdress).then(res => {
68+
this.adressList = res
69+
this.warning = true
70+
if (this.adressList.length > 0) {
71+
this.warning = false
72+
if (this.inputAdress === '') {
73+
this.adressList = []
74+
this.warning = true
75+
}
76+
}
77+
})
78+
},
79+
// 选择地址
80+
listClick (index) {
81+
this.SAVE_ADDDETAIL(this.adressList[index].name)
82+
this.$router.go(-1)
83+
}
84+
}
85+
}
86+
</script>
87+
<style lang='scss'>
88+
@import "../../../../../../style/adddetail.scss";
89+
</style>

0 commit comments

Comments
 (0)