94c1e6a3
liuqimichale
微信公众号 个人页面集合
|
1
2
3
4
5
6
|
<template>
<div>
<div class="person-bg">
<div class="person-ifo">
<div class="person-pic"></div>
<ul class="person-con">
|
5e52ed7c
刘淇
个人中心
|
7
8
9
10
|
<li></li>
<li style="padding-top: 20px;font-size: 20px;">{{phoneNum}}</li>
<!--<li>账户余额: <span>¥100.00</span></li>-->
<!--<li>我的卡券:<span>20张</span></li>-->
|
94c1e6a3
liuqimichale
微信公众号 个人页面集合
|
11
12
13
14
|
</ul>
</div>
</div>
|
5e52ed7c
刘淇
个人中心
|
15
|
<!--<mt-cell title="会员卡" is-link :to="{ name: 'cardList' }"></mt-cell>-->
|
94c1e6a3
liuqimichale
微信公众号 个人页面集合
|
16
|
|
5e52ed7c
刘淇
个人中心
|
17
|
<!--<mt-cell title="车辆管理" is-link :to="{ name: 'myCars' }"></mt-cell>-->
|
94c1e6a3
liuqimichale
微信公众号 个人页面集合
|
18
|
|
5e52ed7c
刘淇
个人中心
|
19
|
<!--<mt-cell title="车辆管理" is-link :to="{ name: 'parkNotes' }"></mt-cell>-->
|
94c1e6a3
liuqimichale
微信公众号 个人页面集合
|
20
|
|
5e52ed7c
刘淇
个人中心
|
21
|
<!--<mt-cell title="建议反馈" is-link :to="{ name: 'suggestionBack' }"></mt-cell>-->
|
94c1e6a3
liuqimichale
微信公众号 个人页面集合
|
22
|
|
5e52ed7c
刘淇
个人中心
|
23
24
25
26
27
|
<van-cell-group>
<van-cell v-for="i in navList" :key="i.title" :title="i.title" size="large" is-link @click="toNextPage(i.path)"/>
</van-cell-group>
|
6ea1f7ef
刘淇
个人中心
|
28
|
<div class="leftRightPadding" style="margin-top: 34px" v-if="phoneNum">
|
5e52ed7c
刘淇
个人中心
|
29
|
<!--<mt-button type="danger" size="large"></mt-button>-->
|
6ea1f7ef
刘淇
个人中心
|
30
|
<!--<van-button type="info" block>退出账户</van-button>-->
|
5e52ed7c
刘淇
个人中心
|
31
32
33
|
</div>
<div class="leftRightPadding" style="margin-top: 34px" v-else>
<van-button type="info" block @click="toBindingPage">登录绑定</van-button>
|
94c1e6a3
liuqimichale
微信公众号 个人页面集合
|
34
35
36
37
38
39
|
</div>
</div>
</template>
<script>
|
5e52ed7c
刘淇
个人中心
|
40
|
|
6ea1f7ef
刘淇
个人中心
|
41
|
import { getTokenByOpenId } from "@/api/getUserIfo";
|
94c1e6a3
liuqimichale
微信公众号 个人页面集合
|
42
|
export default {
|
5e52ed7c
刘淇
个人中心
|
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
|
name: "selfNav",
data() {
return {
navList: [
{
title: "会员卡", path: "cardList"
},
{
title: "车辆管理", path: "myCars"
},
{
title: "停车记录", path: "parkNotes"
},
{
title: "建议反馈", path: "suggestionBack"
}
],
openId: "",
|
6ea1f7ef
刘淇
个人中心
|
61
|
phoneNum: ""//手机号
|
5e52ed7c
刘淇
个人中心
|
62
63
|
};
},
|
94a4ee91
刘淇
宣化 聚合支付
|
64
65
66
67
|
created() {
},
|
5e52ed7c
刘淇
个人中心
|
68
|
mounted() {
|
6ea1f7ef
刘淇
个人中心
|
69
70
71
72
73
|
// this.openId = this.$utils.openId;
// if (this.openId) {
// this.getTokenAndphoneNum();
// }
// console.log(this.openId);
|
94a4ee91
刘淇
宣化 聚合支付
|
74
|
|
6ea1f7ef
刘淇
个人中心
|
75
76
|
this.phoneNum = this.$utils.userPhoneNum
console.log(this.$utils.userPhoneNum)
|
5e52ed7c
刘淇
个人中心
|
77
78
79
|
},
methods: {
toNextPage(path) {
|
6ea1f7ef
刘淇
个人中心
|
80
|
if (this.phoneNum) {
|
5e52ed7c
刘淇
个人中心
|
81
82
83
84
85
86
|
this.$router.push({
name: path
}
);
} else {
this.$toast("请先登录");
|
e7ca4bcb
刘淇
会员卡
|
87
88
89
90
|
// this.$router.push({
// name: "binDing"
// }
// );
|
5e52ed7c
刘淇
个人中心
|
91
92
93
94
95
96
97
98
|
}
},
toBindingPage() {
this.$router.push({
name: "binDing"
}
);
},
|
6ea1f7ef
刘淇
个人中心
|
99
|
getTokenAndphoneNum() {
|
5e52ed7c
刘淇
个人中心
|
100
|
let jsondata = {
|
6ea1f7ef
刘淇
个人中心
|
101
102
103
104
|
openid: this.$utils.openId
};
jsondata.sign = this.$utils.signObject(jsondata);
console.log("停车记录传参 " + JSON.stringify(jsondata));
|
5e52ed7c
刘淇
个人中心
|
105
|
getTokenByOpenId(jsondata).then(response => {
|
6ea1f7ef
刘淇
个人中心
|
106
107
108
109
|
console.log(response);
this.phoneNum = response.data.phoneNum;
console.log(response.data.token);
});
|
5e52ed7c
刘淇
个人中心
|
110
111
112
|
}
}
};
|
94c1e6a3
liuqimichale
微信公众号 个人页面集合
|
113
114
115
116
117
118
119
120
121
122
123
124
125
126
|
</script>
<style scoped lang="scss">
.person-bg {
height: 160px;
background: url("../../assets/images/mySelf/selfNavBg.png") no-repeat;
background-size: 100% 100%;
}
.person-ifo {
padding: $commonLeftRightPadding;
padding-top: 45px;
display: flex;
color: #ffbfbf;
|
5e52ed7c
刘淇
个人中心
|
127
|
.person-pic {
|
94c1e6a3
liuqimichale
微信公众号 个人页面集合
|
128
129
130
131
132
133
|
width: 64px;
height: 64px;
margin-right: 15px;
background: url("../../assets/images/mySelf/photoBG.png") no-repeat;
}
}
|
5e52ed7c
刘淇
个人中心
|
134
135
136
|
.person-con {
span {
|
94c1e6a3
liuqimichale
微信公众号 个人页面集合
|
137
138
139
140
141
|
font-size: 16px;
font-weight: bold;
}
}
|
5e52ed7c
刘淇
个人中心
|
142
|
|
94c1e6a3
liuqimichale
微信公众号 个人页面集合
|
143
|
</style>
|