EvaluateDetail.vue
3.08 KB
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
<template>
<div class="evaluateDetail">
<div class="nav">
<van-nav-bar title="评价" left-arrow :fixed="true" @click-left="onClickLeft" />
</div>
<ul class="list">
<li v-for="(n, i) in list" :key="n.id">
<div class="info">
<img :src="n.faceUrl ? n.faceUrl : require('../assets/boy.png')" alt="" />
<div class="name">
<h3>{{ n.name }}</h3>
<p>{{ n.intime.substring(0, 10) }}</p>
</div>
</div>
<div class="cont">{{ n.evaluation }}</div>
<div class="imgs">
<img @click="previewImg(i, j)" v-for="(k, j) in n.imgList" :key="k.id" :src="k.imgUrl" alt="" />
</div>
<div class="star oh" v-show="n.userType == 1">
<div class="fl">我对课程的评分</div>
<div class="fr">
<van-rate v-model="n.courseScore" readonly void-icon="star" void-color="#eee" />
<span>{{ n.courseScore }}.0</span>
</div>
</div>
<div class="star oh" v-show="n.userType == 1">
<div class="fl">我对基地的评分</div>
<div class="fr">
<van-rate v-model="n.baseScore" readonly void-icon="star" void-color="#eee" />
<span>{{ n.baseScore }}.0</span>
</div>
</div>
</li>
</ul>
<van-image-preview v-model="show" :startPosition="imgIndex" :closeable="true" :images="images"></van-image-preview>
</div>
</template>
<script>
export default {
data() {
return {
list: '',
userInfo: '',
show: false,
images: [],
imgIndex: 0,
}
},
created() {
var userInfo = localStorage.getItem('userInfo')
if (userInfo) {
this.userInfo = JSON.parse(userInfo)
}
var id = this.$route.query.id
this.GetEvaluationList(id)
},
methods: {
GetEvaluationList(id) {
var that = this
this.http
.GetEvaluationList({
courseId: id,
userId: this.userInfo ? this.userInfo.centerNo : 0,
})
.then(function (res) {
if (res.status == 1) {
that.list = res.data
}
})
},
onClickLeft() {
history.back()
},
previewImg(i, j) {
var that = this
this.images = []
this.list[i].imgList.forEach(function (z, x) {
that.images.push(z.imgUrl)
})
this.imgIndex = j
this.show = true
},
},
}
</script>
<style lang="stylus" scoped>
.list{
padding 20px
box-sizing border-box
margin-top 50px
li{
margin-bottom 20px
.info{
img {
width 50px
height 50px
border-radius 50px
display inline-block
vertical-align middle
}
div.name{
display inline-block
vertical-align middle
h3{
margin 0
font-size 1.4rem
}
p{
margin 0
color #ccc
font-size 1.2rem
}
}
}
.cont{
margin-top 10px
font-size 1.4rem
}
.imgs{
margin-top 10px
img{
display inline-block
width 60px
height 60px
margin-right 10px
border-radius 5px
}
}
.star{
margin-top 10px
.fl{
font-size 1.2rem
}
}
}
}
</style>