<template>
|
<div class="custom-scroll">
|
<div class="nav">
|
<span>提交详情</span>
|
<el-button type="primary" size="small" @click="banck">返 回</el-button>
|
</div>
|
|
<div class="user-msg">
|
<p class="title">用户信息</p>
|
<p>
|
<span class="text-lie">
|
<span class="t-color">用户昵称：</span>{{list.nickName}}
|
</span>
|
<span class="text-lie">
|
<span class="t-color">身份：</span>{{list.identity}}
|
</span>
|
<span class="text-lie">
|
<span class="t-color">登记时间：</span>{{list.createAt}}
|
</span>
|
<span class="text-lie">
|
<span class="t-color">登记流水：</span>{{list.id}}
|
</span>
|
</p>
|
</div>
|
|
<div class="user-msg">
|
<p class="title">答题详情</p>
|
<div class="answer" v-for="(text,index) in list.answerList" :key="index">
|
<div class="answer-list">
|
<p class="title-describe">{{index+1}},{{text.reserveSubContent}}</p>
|
<p class="content">
|
<span v-if="text.type == 11" class="img-cover">
|
<img :src="text.answerContent" @click="onScaleImage(text.answerContent)">
|
</span>
|
<span v-if="text.type == 12" class="img-cover">
|
<img :src="text.answerContent" @click="onScaleImage(text.answerContent)">
|
</span>
|
<span v-else>{{text.answerContent}}</span>
|
</p>
|
</div>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
export default {
|
data() {
|
return{
|
list:[],
|
|
}
|
},
|
mounted() {
|
this.init()
|
|
},
|
|
methods:{
|
onScaleImage(i) {
|
this.$store.dispatch("setImage", {
|
time: Date.now(),
|
title: "[大图]",
|
foot: 1,
|
tool: 1,
|
pic: i,
|
});
|
},
|
|
init() {
|
var url = `reserve/register/detailed/detail?reserveRecordId=${this.$route.params.id}`
|
this.$api.post(url, {}, (e) => {
|
this.list = e;
|
});
|
},
|
|
banck() {
|
this.$router.back();
|
}
|
|
}
|
|
}
|
</script>
|
|
<style lang="less" scoped>
|
.custom-scroll {
|
overflow: scroll;
|
}
|
.nav {
|
padding-top: 15px;
|
border-bottom: 1px #eaeaeb solid;
|
padding-bottom: 20px;
|
span {
|
margin-right: 15px;
|
}
|
}
|
.user-msg {
|
padding-top: 25px;
|
.title {
|
font-size: 18px;
|
font-weight: bold;
|
color: #333;
|
padding-bottom: 20px;
|
}
|
.text-lie {
|
margin-right: 25px;
|
color:#888 ;
|
font-size: 14px;
|
.t-color {
|
color: #606266;
|
}
|
}
|
}
|
.answer {
|
font-size: 14px;
|
.answer-list {
|
padding-bottom: 15px;
|
}
|
.title-describe {
|
color: #606266;
|
font-size: 16px;
|
padding-bottom: 8px;
|
}
|
.content {
|
color:#888 ;
|
}
|
}
|
.img-cover {
|
width: 150px;
|
height: 89px;
|
display: inline-block;
|
overflow: hidden;
|
img {
|
width: 100%;
|
height: 100%;
|
object-fit: cover;
|
max-height: none !important;
|
}
|
}
|
</style>
|
