<template>
<div id="feedback-page">
<div class="feedback-container">
<div class="feedback-header-bar">
<img src="@/assets/feedback_bar.png" alt="">
<div class="feedback-backBtn">返回</div>
</div>
<div class="histroy-feedback-content">
<div class="content-header">历史反馈</div>
<div class="feedback-list" v-for="(item, index) in feedlist" :key="index">
<el-container>
<el-aside>
<div><el-avatar size="120" src="https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=275475408,4194259033&fm=26&gp=0.jpg"></el-avatar></div>
</el-aside>
<el-main>
<div class="user-info">
<div class="nickname">{{item.nick_name}}</div>
<div class="label"># {{item.label}}</div>
<div class="feedback-placeholder"></div>
<div class="date">{{item.date}}</div>
</div>
<div class="user-feedback">{{item.feed_content}}</div>
<div class="ceo-reply">
<div class="ceo-title">CEO秘书——大脸猫 回复:</div>
<div class="reply-content">{{item.feedback_content}}</div>
</div>
</el-main>
</el-container>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'App',
data () {
return {
feedlist: [
{
nick_name: '好的',
label: '其他反馈',
date: '2020年12月23日 23: 00: 00',
feed_content: `今年三月，愛丁堡公爵在經過一個月的住院治療後離開了醫院。期間他在倫敦另一家醫院——聖巴塞洛繆醫院接受了心臟病手術。
蘇格蘭第一大臣尼古拉·斯特金表示，她對公爵的去世感到 「悲痛」。菲利普親王和女王有4個孩子，8個孫子和10個曾孫。
他們的第一個兒子威爾士親王查爾斯王子於1948年出生，隨後他的妹妹安妮公主於1950年出生，約克公爵安德魯王子於1960年出生，威塞克斯伯爵愛德華王子於1964年出生。
菲利普親王於1921年6月10日出生在希臘的科孚島。他的父親是希臘和丹麥的安德魯王子，是希臘國王喬治一世的小兒子，而他的母親愛麗絲公主則是路易-蒙巴頓勳爵的女兒，是維多利亞女王的曾孫女。`,
feedback_content: `歇息的飞机上的积分多少积附件的尼古拉·斯特金表示，她對公爵的去世感到 「悲痛」。菲利普親王和女王有4個孩子，8個孫子和10個曾孫。
他們的第一個兒子威爾士親王查爾斯王子於1948年出生，隨後他的妹妹安妮公主於1950年出生，約克公爵安德魯王子於1960年出生，威塞克斯伯爵愛德華王子於1964年出生。
菲利普親王於1921年6月10日出生在希臘的科孚島。他的父親是`
},
{
nick_name: '好的',
label: '其他反馈',
date: '2020年12月23日 23: 00: 00',
feed_content: `今年三月，愛丁堡公爵在經過一個月的住院治療後離開了醫院。期間他在倫敦另一家醫院——聖巴塞洛繆醫院接受了心臟病手術。
蘇格蘭第一大臣尼古拉·斯特金表示，她對公爵的去世感到 「悲痛」。菲利普親王和女王有4個孩子，8個孫子和10個曾孫。
他們的第一個兒子威爾士親王查爾斯王子於1948年出生，隨後他的妹妹安妮公主於1950年出生，約克公爵安德魯王子於1960年出生，威塞克斯伯爵愛德華王子於1964年出生。
菲利普親王於1921年6月10日出生在希臘的科孚島。他的父親是希臘和丹麥的安德魯王子，是希臘國王喬治一世的小兒子，而他的母親愛麗絲公主則是路易-蒙巴頓勳爵的女兒，是維多利亞女王的曾孫女。`,
feedback_content: `歇息的飞机上的积分多少积附件的大臣尼古拉·斯特金表示，她對公爵的去世感到 「悲痛」。菲利`
},
{
nick_name: '好的',
label: '其他反馈',
date: '2020年12月23日 23: 00: 00',
feed_content: `今年三月，愛丁堡公爵在經過一個月的住院治療後離開了醫院。期間他在倫敦另一家醫院——聖巴塞洛繆醫院接受了心臟病手術。
蘇格蘭第一大臣尼古拉·斯特金表示，她對公爵的去世感到 「悲痛」。菲利普親王和女王有4個孩子，8個孫子和10個曾孫。
他們的第一個兒子威爾士親王查爾斯王子於1948年出生，隨後他的妹妹安妮公主於1950年出生，約克公爵安德魯王子於1960年出生，威塞克斯伯爵愛德華王子於1964年出生。
菲利普親王於1921年6月10日出生在希臘的科孚島。他的父親是希臘和丹麥的安德魯王子，是希臘國王喬治一世的小兒子，而他的母親愛麗絲公主則是路易-蒙巴頓勳爵的女兒，是維多利亞女王的曾孫女。`,
feedback_content: `歇息的飞机上的积分多少积附件的大臣尼古拉·斯特金表示，她對公爵的去世感到 「悲痛」。菲利`
},
{
nick_name: '好的',
label: '其他反馈',
date: '2020年12月23日 23: 00: 00',
feed_content: `今年三月，愛丁堡公爵在經過一個月的住院治療後離開了醫院。期間他在倫敦另一家醫院——聖巴塞洛繆醫院接受了心臟病手術。
蘇格蘭第一大臣尼古拉·斯特金表示，她對公爵的去世感到 「悲痛」。菲利普親王和女王有4個孩子，8個孫子和10個曾孫。
他們的第一個兒子威爾士親王查爾斯王子於1948年出生，隨後他的妹妹安妮公主於1950年出生，約克公爵安德魯王子於1960年出生，威塞克斯伯爵愛德華王子於1964年出生。
菲利普親王於1921年6月10日出生在希臘的科孚島。他的父親是希臘和丹麥的安德魯王子，是希臘國王喬治一世的小兒子，而他的母親愛麗絲公主則是路易-蒙巴頓勳爵的女兒，是維多利亞女王的曾孫女。`,
feedback_content: `歇息的飞机上的积分多少积附件的大臣尼古拉·斯特金表示，她對公爵的去世感到 「悲痛」。菲利`
},
{
nick_name: '好的',
label: '其他反馈',
date: '2020年12月23日 23: 00: 00',
feed_content: `今年三月，愛另一家醫院——聖巴塞洛繆醫院接受了心臟病手術。
1950年出生，則是路易-蒙巴頓勳爵的女兒，是維多利亞女王的曾孫女。`,
feedback_content: `歇息的飞机上的积分多少积附件的尼古拉·斯特金表示，她對公爵的去世感到 「悲痛」。菲利普親王和女王有4個孩子，8個孫子和10個曾孫。
他們的第一個兒子威爾士親王查爾斯王子於1948年出生，隨後他的妹妹安妮公主於1950年出生，約克公爵安德魯王子於1960年出生，威塞克斯伯爵愛德華王子於1964年出生。
菲利普親王於1921年6月10日出生在希臘的科孚島。他的父親是`
}
]
}
}
}
</script>
<style>
body {
margin: 0;
}
.feedback-page {
margin: 0;
padding: 0;
width: 100%;
overflow-x: hidden;
}
.feedback-container {
margin: 0;
padding: 0;
width: 100%;
}
.feedback-header-bar {
position: relative;
width: 100%;
}
.feedback-header-bar img {
width: 100%;
}
.feedback-backBtn {
width: 12vw;
height: 7vh;
line-height: 7vh;
background: #FFAA4F;
color: #fff;
text-align: center;
border-radius: 50px;
cursor: pointer;
position: absolute;
top: 3vh;
left: 19vw;
letter-spacing: .5vw;
}
.histroy-feedback-content {
width: 60vw;
margin: 0 auto;
}
.content-header {
height: 14vh;
padding-top: 6vh;
border-bottom: 1px solid #ccc;
box-sizing: border-box;
font-size: 3vh;
color: #385061;
}
.el-aside {
color: #333;
text-align: center;
width: 6vw !important;
padding-top: 3vh;
}
.el-main {
padding: 3vh !important;
padding-left: 0vw !important;
padding-right: 0 !important;
}
.user-info {
display: flex;
}
.feedback-placeholder {
flex: 1;
}
.label {
margin-left: 3vw;
color: #385061;
font-size: 1.2vw;
text-decoration: underline;
}
.nickname {
color: #385061;
font-size: 1.2vw;
}
.date {
font-size: .5vw;
color: #8A8A8A;
}
.user-feedback {
margin-top: 1.3vh;
color: #385061;
font-size: 0.8vw;
}
.ceo-reply {
margin-top: 2.8vh;
color: #04B09E;
}
.reply-content {
margin-top: 1.3vh;
font-size: 0.8vw;
}
.feedback-list {
border-bottom: 1px solid #ccc;
}
.avatar-img {
text-align: left !important;
}
</style>
