1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
<!--
* @Author: jiangzaicheng jiangzaicheng_jzc@163.com
* @Date: 2022-07-05 14:05:30
* @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
* @LastEditTime: 2022-07-22 18:18:30
* @FilePath: \mcep-h5\src\views\main\MainView.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
<div class="d-page d-flex flex-column" style=" background-color: #ebedf0">
<div class="rarl">
<person-bar :title="tatleName" :param="param" :login="true" style="width:100%;height: calc(35vh);">
</person-bar>
</div>
<div style="margin-top: 160px; position: absolute; width: 100%">
<van-row span="24">
<van-col span="8" style="text-align: center; color: #FFFFFF; font-weight: 600">2456</van-col>
<van-col span="8" style="text-align: center; color: #FFFFFF; font-weight: 600">12</van-col>
<van-col span="8" style="text-align: center; color: #FFFFFF; font-weight: 600">10</van-col>
</van-row>
<van-row span="24">
<van-col span="8" style="text-align: center; color: #FFFFFF">我的积分</van-col>
<van-col span="8" style="text-align: center; color: #FFFFFF">卡券</van-col>
<van-col span="8" style="text-align: center; color: #FFFFFF">特权</van-col>
</van-row>
</div>
<div>
<card-bar class="card"></card-bar>
<!-- <uncard-bar class="card"></uncard-bar> -->
</div>
<div class="prudect">
<little-bar :litterParam="litterParam" @litterParamClick="litterParamClick"></little-bar>
</div>
</div>
</template>
<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
import { ProductData } from '@/model/entity/ProductData'
@Component({
name: "MyPage",
})
export default class MyPage extends Vue {
tatleName = "个人中心"
loginFlag = true;
param: any = {}
//判断是否登录
created() {
//判断登录登陆状态
//this.loginFlag=localStorage.getItem("loginFlag")
if (this.loginFlag) {
this.param = {
name: "孙旭东",
live: "二星级",
grow: "531"
}
} else {
this.param = {
name: "登录/注册"
}
}
}
//列表信息
litterParam: any = [{
productname: "个人信息",
//个人信息
img: "#icon-a-gerenxinxi16x16px",
flag: "PersonLod"
},
{
productname: "我的贷款",
//图片信息
img: "#icon-a-wodedaikuan16x16px",
flag: "AccommodMain"
},
{
productname: "兑换记录",
//图片信息
img: "#icon-a-duihuanjilu16x16px",
flag: "ExchangeRecord",
},
{
productname: "合作企业",
//图片信息
img: "#icon-a-hezuoqiye16x16px",
flag: "CooperationBusiness",
}]
//点击事件
litterParamClick(item: any) {
if (item.flag === "PersonLod") {
this.$router.push({
name: "PersonLod"
//参数
})
} else if (item.flag === "AccommodMain") {
this.$router.push({
name: "AccommodMain"
//参数
})
} else if ( item.flag === "ExchangeRecord") {
this.$router.push({
name: "ExchangeRecord"
})
} else if ( item.flag === "CooperationBusiness") {
this.$router.push({
name: "CooperationBusiness"
})
}
}
}
</script>
<style scoped lang="scss">
.roll {
background: #ecf9ff;
}
.card {
position: absolute;
top: 30%;
left: 3%;
right: 3%;
width: 90%;
height: 20%;
margin: 2% auto;
border-radius: 15px;
display: flex;
font-weight: 400;
font-style: normal
}
.titleName {
float: inline-end;
height: 34px;
margin: 7px auto 0px 8px;
border-radius: 12px;
color: #a2d2f4;
}
.icon {
width: 90px;
height: 90px;
}
.prudect {
background: white;
height: 100-35vh;
}
</style>