kubbo/dvcp_v2_wechat_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

丰都

Browse Source
This commit is contained in:
yanran200730
2023-03-17 09:35:55 +08:00
parent 393358c432
commit cb8c39f89e
3 changed files with 270 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

146
src/project/fengdu/AppCircle/Detail.vue
View File

@@ -35,18 +35,24 @@
</div>
<div class="comment">
<h2>评论</h2>
<div class="comment-item" v-for="(item, index) in 10" :key="index">
<image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-fangwuchuzu.png" />
<div class="right">
<h3>清风</h3>
<p>联系方式呢</p>
<div class="bottom">
<span>2020-12-11 10:10</span>
<div>回复</div>
<div class="comment-wrapper">
<div class="comment-item" v-for="(item, index) in 10" :key="index">
<image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-fangwuchuzu.png" />
<div class="right">
<h3>清风</h3>
<p>联系方式呢</p>
<div class="bottom">
<span>2020-12-11 10:10</span>
<div>回复</div>
</div>
</div>
</div>
</div>
</div>
<div class="footer">
<input placeholder="请输入">
<div>发送</div>
</div>
<AiLogin ref="login"/>
</div>
</template>
@@ -71,63 +77,109 @@
<style scoped lang="scss">
.Detail {
padding-top: 24px;
padding-bottom: 100px;
div {
box-sizing: border-box;
}
.footer {
display: flex;
align-items: center;
position: fixed;
left: 0;
bottom: 0;
z-index: 111;
width: 100%;
padding: 14px 32px;
background: #fff;
input {
flex: 1;
height: 60px;
margin-right: 16px;
padding: 0 24px;
border-radius: 30px;
font-size: 26px;
color: #333;
box-sizing: border-box;
background: #eeeeeeff;
}
div {
width: 100px;
height: 60px;
line-height: 60px;
text-align: center;
font-size: 26px;
color: #fff;
border-radius: 30px;
background: #2d7dffff;
}
}
.comment {
margin-top: 24px;
padding: 32px 32px 0;
background: #fff;
.comment-item {
display: flex;
padding: 26px 0;
.comment-wrapper {
.comment-item {
display: flex;
padding: 26px 0;
&:first-child {
padding-top: 0;
}
& > image {
width: 72px;
height: 72px;
margin-right: 16px;
border-radius: 50%;
}
.right {
flex: 1;
padding-bottom: 32px;
border-bottom: 1px solid #EEEEEE;
h3 {
line-height: 40px;
margin-bottom: 8px;
color: #666666;
font-size: 28px;
&:first-child {
padding-top: 0;
}
p {
line-height: 42px;
margin-bottom: 24px;
color: #333;
font-size: 28px;
& > image {
width: 72px;
height: 72px;
margin-right: 16px;
border-radius: 50%;
}
.bottom {
display: flex;
align-items: center;
justify-content: space-between;
.right {
flex: 1;
padding-bottom: 32px;
border-bottom: 1px solid #EEEEEE;
span {
color: #999999;
font-size: 24px;
h3 {
line-height: 40px;
margin-bottom: 8px;
color: #666666;
font-size: 28px;
}
div {
color: #687DA6;
font-size: 24px;
p {
line-height: 42px;
margin-bottom: 24px;
color: #333;
font-size: 28px;
}
.bottom {
display: flex;
align-items: center;
justify-content: space-between;
span {
color: #999999;
font-size: 24px;
}
div {
color: #687DA6;
font-size: 24px;
}
}
}
&:last-child {
padding-bottom: 0;
.right {
border-bottom: none;
}
}
}