panqihua
/
pocketcommunityweb
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

更新论坛管理模块布局

Browse Source
change
panqihua 5 years ago
parent 5c1f8073bd
commit 2c3366feb0
4 changed files with 136 additions and 48 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 96
      src/app/forum/forum.component.html
  2. 46
      src/app/forum/forum.component.scss
  3. 7
      src/assets/i18n/en-US.json
  4. 5
      src/assets/i18n/zh-CN.json

96
src/app/forum/forum.component.html
Unescape View File

@ -23,8 +23,11 @@
<h1 class="text-info col-12 text-center">{{ 'forum.check' | translate }}</h1> <h1 class="text-info col-12 text-center">{{ 'forum.check' | translate }}</h1>
<div class="col-3">
<!--帖子列表--> <!--帖子列表-->
<ul class="list-group col-3"> <ul class="list-group">
<!-- 帖子列表-->
<li class="list-group-item active">Cras justo odio</li> <li class="list-group-item active">Cras justo odio</li>
<li class="list-group-item">Dapibus ac facilisis in</li> <li class="list-group-item">Dapibus ac facilisis in</li>
<li class="list-group-item">Morbi leo risus</li> <li class="list-group-item">Morbi leo risus</li>
@ -37,46 +40,101 @@
<li class="list-group-item">Vestibulum at eros</li> <li class="list-group-item">Vestibulum at eros</li>
</ul> </ul>
<!-- 分页按钮-->
<ul class="pagination ml-5 mt-3">
<li class="page-item"><a class="page-link" href="#">Previous</a></li>
<li class="page-item active"><a class="page-link" href="#">1</a></li>
<li class="page-item"><a class="page-link" href="#">2</a></li>
<li class="page-item"><a class="page-link" href="#">3</a></li>
<li class="page-item"><a class="page-link" href="#">Next</a></li>
</ul>
</div>
<!-- 帖子内容--> <!-- 帖子内容-->
<div class="col-6 post border-secondary p-3 position-relative"> <div class="col-9 post border-secondary p-3 position-relative">
<div class="position-absolute">
<!-- 活动帖子-->
<ng-container *ngIf="true;else elseBlock">
<!-- 发件人信息-->
<div class="position-absolute sender">
<!-- 发帖人头像--> <!-- 发帖人头像-->
<img src="/fff" class="headimg mb-3"/> <img src="/" class="headimg mb-3"/>
<!-- 发帖人--> <!-- 发帖人-->
<div class="forum-label border-info mb-3 text-center"> <div class="forum-label border-info mb-3 text-center">
发帖人 发帖人
</div> </div>
<!--信用分--> <!--信用分-->
<div class="forum-label border-info mb-3 text-center"> <div class="forum-label border-info mb-3 text-center">
信用分 信用分
</div> </div>
</div> </div>
<!-- 标题-->
<!-- 帖子框架-->
<div>
<!-- 标题-->
<h1 class="text-info col-12 text-center mb-3 forum-title">活动名</h1> <h1 class="text-info col-12 text-center mb-3 forum-title">活动名</h1>
<!-- 帖子正文--> <!-- 帖子正文-->
<div class="forum-content border-info overflow-auto col-9 offset-2 mb-3"> <div class="forum-content border-info overflow-auto col-9 offset-2 mb-3">
帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文 帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文帖子正文
</div> </div>
<!-- 帖子底部--> <!-- 帖子底部-->
<div class="forum-footer border-info p-3 mb-3"> <div class="forum-footer border-info p-3 mb-3">
<h3 class="text-center">{{ 'forum.active_date' | translate:{startDate:'2020-01-01',endDate:'2020-02-01'} }}</h3> <h3 class="text-center">{{ 'forum.active_date' | translate:{startDate:'2020-01-01',endDate:'2020-02-01'} }}</h3>
<h3 class="text-center">{{ 'forum.active_score' | translate:{score:10} }}</h3> <h3 class="text-center">{{ 'forum.active_score' | translate:{score:10} }}</h3>
</div> </div>
<!--帖子审核按钮--> </div>
</ng-container>
<!-- 投诉帖子-->
<ng-template #elseBlock>
<div class="complaint row p-3">
<div class="col-5 border-info l-label h-100 d-flex justify-content-around">
<!-- 投诉人信息-->
<div class="col-6 border-info l-label">
<!-- 头像-->
<div class="d-flex justify-content-center mb-3 m-headimg">
<img src="/" class="headimg">
</div>
<div class="text-center border-info mb-3 l-label">投诉人</div>
<div class="text-center border-info l-label">信用分</div>
</div>
<!-- 被投诉人信息-->
<div class="col-6 border-info l-label">
<div class="d-flex justify-content-center mb-3 m-headimg">
<!-- 头像-->
<img src="/" class="headimg">
</div>
<div class="text-center border-info mb-3 l-label">投诉人</div>
<div class="text-center border-info l-label">信用分</div>
</div>
</div>
<!-- 投诉内容-->
<div class="col-7 border-success l-label h-100">
<!-- 投诉项-->
<h1 class="text-center">投诉项</h1>
<!-- 投诉内容-->
<div class="forum-content border-info overflow-auto mb-3">
投诉内容投诉内容投诉内容投诉内容投诉内容投诉内容投诉内容投诉内容投诉内容投诉内容投诉内容投诉内容投诉内容投诉内容投诉内容投诉内容投诉内容
</div>
<!-- 投诉时间-->
<h1 class="text-center">{{ 'forum.complaint_time' | translate:{time:'2020-01-01'} }}</h1>
</div>
</div>
</ng-template>
<!--帖子审核按钮-->
<div class="col-12 text-center"> <div class="col-12 text-center">
<button class="btn btn-info col-2 mr-3">{{ 'forum.approve' | translate }}</button> <button class="btn btn-info col-2 mr-3">{{ 'forum.approve' | translate }}</button>
<button class="btn btn-danger col-2">{{ 'forum.reject' | translate }}</button> <button class="btn btn-danger col-2">{{ 'forum.reject' | translate }}</button>
</div> </div>
</div> </div>
<!-- 帖子列表分页-->
<nav class="col-4 ml-5">
<ul class="pagination">
<li class="page-item"><a class="page-link" href="#">Previous</a></li>
<li class="page-item active"><a class="page-link" href="#">1</a></li>
<li class="page-item"><a class="page-link" href="#">2</a></li>
<li class="page-item"><a class="page-link" href="#">3</a></li>
<li class="page-item"><a class="page-link" href="#">Next</a></li>
</ul>
</nav>
</div> </div>

46
src/app/forum/forum.component.scss
Unescape View File

@ -33,11 +33,28 @@
border-width: 3px; border-width: 3px;
} }
//帖子内容
.forum-content{
border-style: solid;
border-width: 3px;
height: 300px;
max-height: 300px;
}
//活动贴start
// 帖子标题 // 帖子标题
.forum-title{ .forum-title{
z-index: 0; z-index: 0;
} }
//发帖人信息
.sender{
margin-top: 65px;
margin-left: 45px;
}
//头像 //头像
.headimg{ .headimg{
height: 100px; height: 100px;
@ -45,14 +62,6 @@
z-index: 1; z-index: 1;
} }
//帖子内容
.forum-content{
border-style: solid;
border-width: 3px;
height: 300px;
max-height: 300px;
}
//发帖人信息 //发帖人信息
.forum-label{ .forum-label{
border-style: solid; border-style: solid;
@ -60,10 +69,29 @@
width: 100px; width: 100px;
height: 30px; height: 30px;
} }
//帖子底部
.forum-footer{ .forum-footer{
border-style: solid; border-style: solid;
border-width: 3px; border-width: 3px;
height: 100px; height: 100px;
} }
//活动贴end
//投诉帖start
.complaint{
height: 460px;
}
//名称边框
.l-label{
border-style: solid;
border-width: 3px;
}
//头像顶部距离
.m-headimg{
margin-top: 50px;
}
//投诉帖end

7
src/assets/i18n/en-US.json
Unescape View File

@ -21,10 +21,11 @@
"check": "check", "check": "check",
"sender": "sender", "sender": "sender",
"time": "time", "time": "time",
"active_date": "Active Date：From:{startDate} To {endDate}", "active_date": "Active Date：From {{startDate}} To {{endDate}}",
"active_score": "Active Score：{score}", "active_score": "Active Score：{{score}}",
"approve": "approve", "approve": "approve",
"reject": "reject" "reject": "reject",
"complaint": "time：{{time}}"
}, },
"tip":{ "tip":{
"input": "please input ", "input": "please input ",

5
src/assets/i18n/zh-CN.json
Unescape View File

@ -23,8 +23,9 @@
"time": "公告时间", "time": "公告时间",
"active_date": "活动起止时间：{{startDate}}到{{endDate}}", "active_date": "活动起止时间：{{startDate}}到{{endDate}}",
"active_score": "参与活动奖励信用分：{{score}}", "active_score": "参与活动奖励信用分：{{score}}",
"approve": "通过", "approve": "审核通过",
"reject": "拒绝" "reject": "审核不通过",
"complaint_time": "投诉时间：{{time}}"
}, },
"tip":{ "tip":{
"input": "请输入", "input": "请输入",

Write Preview
Loading…
Cancel
Save