Compare commits

..

No commits in common. 'master' and 'change' have entirely different histories.

  1. 29
      README.md
  2. 46
      src/app/account/login/login.component.html
  3. 16
      src/app/account/login/login.component.scss
  4. 51
      src/app/account/register/register.component.html
  5. 9
      src/app/account/register/register.component.scss
  6. 44
      src/app/account/resetpwd/resetpwd.component.html
  7. 9
      src/app/account/resetpwd/resetpwd.component.scss
  8. 4
      src/app/app.component.html
  9. 44
      src/app/app.component.scss
  10. 67
      src/app/forum/forum/forum.component.html
  11. 3
      src/app/forum/forum/forum.component.scss
  12. 2
      src/app/forum/notice/notice.component.html
  13. BIN
      src/assets/image/bg.png
  14. BIN
      src/assets/image/head.png
  15. BIN
      src/assets/image/user.png
  16. BIN
      src/assets/image/回复.png
  17. BIN
      src/assets/image/回复的帖子.png
  18. BIN
      src/assets/image/奖牌排名.png
  19. 24
      src/styles.scss

@ -1,2 +1,27 @@
# 口袋社区web后台 # PocketCommunityWeb
## Angular
This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.0.1.
## Development server
Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
## Code scaffolding
Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
## Build
Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build.
## Running unit tests
Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
## Running end-to-end tests
Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
## Further help
To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).

@ -1,18 +1,13 @@
<!--设置高度,添加bootstrap样式类d-flex align-items-center 使表单垂直居中,justify-content-center水平居中--> <!--设置高度,添加bootstrap样式类d-flex align-items-center 使表单垂直居中,justify-content-center水平居中-->
<div [style]="height" id="login" class="d-flex align-items-center justify-content-center"> <div [style]="height" class="d-flex align-items-center justify-content-center">
<div class="text-primary"> <form [formGroup]="loginForm" class="col-6">
<div style="font-size: 40px;font-weight: 700;">Pocket community</div>
<div style="font-size: 30px;font-weight: 400;">Redefining your community life</div>
</div>
<form [formGroup]="loginForm" class="col-4" style="padding: 70px 40px;background: #fff;margin-left: 20px;margin-top: 280px;border-radius: 5px;">
<!-- 管理员名--> <!-- 管理员名-->
<div style="margin: 20px 0!important;" class="input-group mb-3 mx-auto col-12"> <div class="input-group mb-3 mx-auto col-7">
<!-- <div class="input-group-prepend"> <div class="input-group-prepend">
<span class="input-group-text">{{ 'login.manager_name' | translate }}</span> <span class="input-group-text">{{ 'login.manager_name' | translate }}</span>
</div> --> </div>
<span style="margin-right: 5px;margin-top: 3px;"><img src="../../../assets/image/head.png" style="height: 30px;width: 30px;" /></span> <input autocomplete="managerName" type="text" class="rect-radius form-control text-center"
<input autocomplete="managerName" type="text" class="form-control text-center"
[class.is-invalid]="getValue('managerName').invalid" [class.is-invalid]="getValue('managerName').invalid"
[placeholder]="'tip.input' | translate:{value:'login.manager_name'|translate}" [placeholder]="'tip.input' | translate:{value:'login.manager_name'|translate}"
formControlName="managerName"> formControlName="managerName">
@ -23,36 +18,33 @@
</div> </div>
<!-- 管理员密码--> <!-- 管理员密码-->
<div style="margin: 20px 0!important;" class="input-group mb-3 mx-auto col-12"> <div class="input-group mb-3 mx-auto col-7">
<!-- <div class="input-group-prepend"> <div class="input-group-prepend">
<span class="input-group-text">{{ 'login.password' | translate }}</span> <span class="input-group-text">{{ 'login.password' | translate }}</span>
</div> --> </div>
<span style="margin-right: 5px;margin-top: 3px;"><img src="../../../assets/image/head.png" style="height: 30px;width: 30px;" /></span>
<input autocomplete="new-password" type="password" class="form-control text-center" <input autocomplete="new-password" type="password" class="form-control text-center"
[class.is-invalid]="getValue('password').invalid" [class.is-invalid]="getValue('password').invalid"
[placeholder]="'tip.input' | translate:{value:'login.manager_name'|translate}" formControlName="password"> [placeholder]="'tip.input' | translate:{value:'login.manager_name'|translate}" formControlName="password">
<div class="input-group-append">
<button class="btn btn-outline-secondary" type="button"
[routerLink]="['/reset_pwd']">{{ 'button.forget_pwd' | translate }}</button>
</div>
<div class="invalid-feedback font-weight-bold text-center"> <div class="invalid-feedback font-weight-bold text-center">
{{'tip.notnull' | translate:{value: 'login.password'|translate} }} {{'tip.notnull' | translate:{value: 'login.password'|translate} }}
</div> </div>
</div> </div>
<div style="text-align: right;">
<a style="color: black;font-size: 12px;" type="button" [routerLink]="['/reset_pwd']">{{ 'button.forget_pwd' | translate }}</a>
</div>
<div style="margin: 10px 0!important;" class="col-12 mx-auto text-right mb-3">
<div class="row flex-nowrap"> <div class="col-5 mx-auto text-center mb-3">
<div class="col-6">
<!-- 登陆按钮--> <!-- 登陆按钮-->
<button style="background: rgb(45, 135, 210);border: rgb(45, 135, 210);padding: 4px 40px;float: left;margin-left: 20px;opacity: 1; word-wrap: none;" type="button" (click)="login()" class="btn btn-info btn-lg" <button type="button" (click)="login()" class="btn btn-primary btn-lg"
[disabled]="form().invalid">{{ 'button.login' | translate }}</button> [disabled]="form().invalid">{{ 'button.login' | translate }}</button>
</div>
<div class="col-6">
<!-- 注册按钮 --> <!-- 注册按钮 -->
<button style="background: rgb(45, 135, 210);border: rgb(45, 135, 210);padding: 4px 40px;margin-right: 20px; word-wrap: none;" type="button" class="btn btn-info btn-lg ml-3" <button type="button" class="btn btn-info btn-lg ml-3"
[routerLink]="['/register']">{{ 'button.register' | translate }}</button> [routerLink]="['/register']">{{ 'button.register' | translate }}</button>
</div> </div>
</div>
</div>
<app-message></app-message> <app-message></app-message>

@ -1,19 +1,3 @@
#login{
// color: rgb(80, 138, 202);
.mx-auto{
margin: 10px 0;
}
.form-control{
// color: #fff;
background: rgb(242, 242, 242);
border-radius: 19px!important;
border: none;
outline: none;
}
}
//圆角边框 //圆角边框
.rect-radius { .rect-radius {
border: 1px solid; border: 1px solid;

@ -1,15 +1,12 @@
<!--设置高度,添加bootstrap样式类d-flex align-items-center 使表单垂直居中,justify-content-center水平居中--> <!--设置高度,添加bootstrap样式类d-flex align-items-center 使表单垂直居中,justify-content-center水平居中-->
<div id="register" [style]="height" class="align-items-center justify-content-center"> <div [style]="height" class="d-flex align-items-center justify-content-center">
<div style="color: #fff;" class="col-12"> <form [formGroup]="registerForm" class="col-6">
<div style="font-size: 40px;font-weight: 700;text-align: center;margin: 10px 0 30px;">Pocket community</div>
</div>
<form [formGroup]="registerForm" class="col-5" style="margin: 0 auto;padding: 50px 40px;background: #fff;border-radius: 5px;">
<!-- 管理员名--> <!-- 管理员名-->
<div style="margin: 20px 0!important;" class="input-group mb-3 mx-auto col-12"> <div class="input-group mb-3 mx-auto col-7">
<!-- <div class="input-group-prepend"> <div class="input-group-prepend">
<span class="input-group-text">{{ 'login.manager_name' | translate }}</span> <span class="input-group-text">{{ 'login.manager_name' | translate }}</span>
</div> --> </div>
<span style="margin-right: 5px;margin-top: 3px;"><img src="../../../assets/image/head.png" style="height: 30px;width: 30px;" /></span>
<input type="text" class="form-control text-center" [class.is-invalid]="getValue('managerName').invalid" <input type="text" class="form-control text-center" [class.is-invalid]="getValue('managerName').invalid"
[placeholder]="'tip.input' | translate:{value:'login.manager_name'|translate}" [placeholder]="'tip.input' | translate:{value:'login.manager_name'|translate}"
formControlName="managerName"/> formControlName="managerName"/>
@ -19,11 +16,10 @@
</div> </div>
<!-- 管理员密码--> <!-- 管理员密码-->
<div style="margin: 20px 0!important;" class="input-group mb-3 mx-auto col-12"> <div class="input-group mb-3 mx-auto col-7">
<!-- <div class="input-group-prepend"> <div class="input-group-prepend">
<span class="input-group-text">{{ 'login.password' | translate }}</span> <span class="input-group-text">{{ 'login.password' | translate }}</span>
</div> --> </div>
<span style="margin-right: 5px;margin-top: 3px;"><img src="../../../assets/image/head.png" style="height: 30px;width: 30px;" /></span>
<input autocomplete="password" type="password" class="form-control text-center" <input autocomplete="password" type="password" class="form-control text-center"
[class.is-invalid]="getValue('password').invalid" [class.is-invalid]="getValue('password').invalid"
[placeholder]="'tip.input' | translate:{value:'login.password'|translate}" formControlName="password"/> [placeholder]="'tip.input' | translate:{value:'login.password'|translate}" formControlName="password"/>
@ -35,11 +31,10 @@
<!-- 管理员确认密码--> <!-- 管理员确认密码-->
<div style="margin: 20px 0!important;" class="input-group mb-3 mx-auto col-12"> <div class="input-group mb-3 mx-auto col-7">
<!-- <div class="input-group-prepend"> <div class="input-group-prepend">
<span class="input-group-text">{{ 'register.confirm_pwd' | translate }}</span> <span class="input-group-text">{{ 'register.confirm_pwd' | translate }}</span>
</div> --> </div>
<span style="margin-right: 5px;margin-top: 3px;"><img src="../../../assets/image/head.png" style="height: 30px;width: 30px;" /></span>
<input autocomplete="confirmPassword" type="password" class="form-control text-center" <input autocomplete="confirmPassword" type="password" class="form-control text-center"
[class.is-invalid]="getValue('confirmPassword').invalid" [class.is-invalid]="getValue('confirmPassword').invalid"
[placeholder]="'tip.input' | translate:{value:'register.confirm_pwd'|translate}" [placeholder]="'tip.input' | translate:{value:'register.confirm_pwd'|translate}"
@ -56,11 +51,10 @@
</div> </div>
<!-- 手机号--> <!-- 手机号-->
<div style="margin: 20px 0!important;" class="input-group mb-3 mx-auto col-12"> <div class="input-group mb-3 mx-auto col-7">
<!-- <div class="input-group-prepend"> <div class="input-group-prepend">
<span class="input-group-text">{{ 'register.mobile' | translate }}</span> <span class="input-group-text">{{ 'register.mobile' | translate }}</span>
</div> --> </div>
<span style="margin-right: 5px;margin-top: 3px;"><img src="../../../assets/image/head.png" style="height: 30px;width: 30px;" /></span>
<input type="number" class="form-control text-center" [class.is-invalid]="getValue('mobile').invalid" <input type="number" class="form-control text-center" [class.is-invalid]="getValue('mobile').invalid"
[placeholder]="'tip.input' | translate:{value:'register.mobile'|translate}" formControlName="mobile"/> [placeholder]="'tip.input' | translate:{value:'register.mobile'|translate}" formControlName="mobile"/>
@ -75,15 +69,14 @@
</div> </div>
<!-- 邮箱--> <!-- 邮箱-->
<div style="margin: 20px 0!important;" class="input-group mb-3 mx-auto col-12"> <div class="input-group mb-3 mx-auto col-8">
<!-- <div class="input-group-prepend"> <div class="input-group-prepend">
<span class="input-group-text">{{ 'register.email' | translate }}</span> <span class="input-group-text">{{ 'register.email' | translate }}</span>
</div> --> </div>
<span style="margin-right: 5px;margin-top: 3px;"><img src="../../../assets/image/head.png" style="height: 30px;width: 30px;" /></span>
<input type="text" class="form-control text-center" <input type="text" class="form-control text-center"
[placeholder]="'tip.input' | translate:{value:'register.email'|translate}" formControlName="email" [placeholder]="'tip.input' | translate:{value:'register.email'|translate}" formControlName="email"
[class.is-invalid]="getValue('email').invalid"/> [class.is-invalid]="getValue('email').invalid"/>
<select class="custom-select form-control" style="margin-left: 10px;" formControlName="emailType"> <select class="custom-select" formControlName="emailType">
<option value="">{{'tip.select'|translate:{value: 'register.email_type'|translate} }}</option> <option value="">{{'tip.select'|translate:{value: 'register.email_type'|translate} }}</option>
<option *ngFor="let item of (emailType$|async)?.emailTypeList" [value]="item.suffix">{{item.name}}</option> <option *ngFor="let item of (emailType$|async)?.emailTypeList" [value]="item.suffix">{{item.name}}</option>
@ -94,12 +87,12 @@
</div> </div>
</div> </div>
<div class="col-12 mx-auto text-right mb-3" style="margin: 10px 0!important;"> <div class="col-7 mx-auto text-center mb-3">
<!-- 注册按钮--> <!-- 注册按钮-->
<button style="background: rgb(45, 135, 210);border: rgb(45, 135, 210);padding: 4px 40px;float: left;margin-left: 20px;opacity: 1;" type="button" (click)="register()" [disabled]="form().invalid" <button type="button" (click)="register()" [disabled]="form().invalid"
class="btn btn-primary btn-lg">{{ 'button.register' | translate }}</button> class="btn btn-primary btn-lg">{{ 'button.register' | translate }}</button>
<!-- 返回登陆按钮--> <!-- 返回登陆按钮-->
<button style="background: rgb(45, 135, 210);border: rgb(45, 135, 210);padding: 4px 40px;margin-right: 20px;" type="button" [routerLink]="['/login']" <button type="button" [routerLink]="['/login']"
class="btn btn-info btn-lg ml-3">{{ 'button.backLogin' | translate }}</button> class="btn btn-info btn-lg ml-3">{{ 'button.backLogin' | translate }}</button>
</div> </div>

@ -1,9 +0,0 @@
#register{
.form-control{
// color: #fff;
background: rgb(242, 242, 242);
border-radius: 19px!important;
border: none;
outline: none;
}
}

@ -1,15 +1,11 @@
<!--设置高度,添加bootstrap样式类d-flex align-items-center 使表单垂直居中,justify-content-center水平居中--> <!--设置高度,添加bootstrap样式类d-flex align-items-center 使表单垂直居中,justify-content-center水平居中-->
<div id="resetpwd" [style]="height" class="align-items-center justify-content-center"> <div [style]="height" class="d-flex align-items-center justify-content-center">
<div style="color: #fff;" class="col-12"> <form [formGroup]="resetForm" class="col-6">
<div style="font-size: 40px;font-weight: 700;text-align: center;margin: 10px 0 30px;">Pocket community</div>
</div>
<form [formGroup]="resetForm" class="col-5" style="margin: 0 auto;padding: 50px 40px;background: #fff;border-radius: 5px;">
<!-- 管理员名--> <!-- 管理员名-->
<div style="margin: 20px 0!important;" class="input-group mb-3 mx-auto col-12" [class.d-none]="step===3"> <div class="input-group mb-3 mx-auto col-7" [class.d-none]="step===3">
<!-- <div class="input-group-prepend"> <div class="input-group-prepend">
<span class="input-group-text">{{ 'login.manager_name' | translate }}</span> <span class="input-group-text">{{ 'login.manager_name' | translate }}</span>
</div> --> </div>
<span style="margin-right: 5px;margin-top: 3px;"><img src="../../../assets/image/head.png" style="height: 30px;width: 30px;" /></span>
<input type="text" class="form-control text-center disabled" [class.is-invalid]="getValue('managerName').invalid" <input type="text" class="form-control text-center disabled" [class.is-invalid]="getValue('managerName').invalid"
[placeholder]="'tip.input' | translate:{value:'login.manager_name'|translate}" [placeholder]="'tip.input' | translate:{value:'login.manager_name'|translate}"
formControlName="managerName"/> formControlName="managerName"/>
@ -19,15 +15,14 @@
</div> </div>
<!-- 邮箱 --> <!-- 邮箱 -->
<div style="margin: 20px 0!important;" class="input-group mb-3 mx-auto col-12" [class.col-8]="step===1" [class.col-9]="step===2" *ngIf="step!==3"> <div class="input-group mb-3 mx-auto col-8" [class.col-8]="step===1" [class.col-9]="step===2" *ngIf="step!==3">
<!-- <div class="input-group-prepend"> <div class="input-group-prepend">
<span class="input-group-text">{{ 'register.email' | translate }}</span> <span class="input-group-text">{{ 'register.email' | translate }}</span>
</div> --> </div>
<span style="margin-right: 5px;margin-top: 3px;"><img src="../../../assets/image/head.png" style="height: 30px;width: 30px;" /></span>
<input type="text" class="form-control text-center" <input type="text" class="form-control text-center"
[placeholder]="'tip.input' | translate:{value:'register.email'|translate}" formControlName="email" [placeholder]="'tip.input' | translate:{value:'register.email'|translate}" formControlName="email"
[class.is-invalid]="getValue('email').invalid"/> [class.is-invalid]="getValue('email').invalid"/>
<select style="margin-left: 10px;" class="custom-select form-control" formControlName="emailType"> <select class="custom-select" formControlName="emailType">
<option value="">{{'tip.select'|translate:{value: 'register.email_type'|translate} }}</option> <option value="">{{'tip.select'|translate:{value: 'register.email_type'|translate} }}</option>
<option *ngFor="let item of (emailType$|async)?.emailTypeList" [value]="item.suffix">{{item.name}}</option> <option *ngFor="let item of (emailType$|async)?.emailTypeList" [value]="item.suffix">{{item.name}}</option>
@ -46,11 +41,10 @@
</div> </div>
<!-- 新密码--> <!-- 新密码-->
<div style="margin: 20px 0!important;" class="input-group mb-3 mx-auto col-12" *ngIf="step===3"> <div class="input-group mb-3 mx-auto col-7" *ngIf="step===3">
<!-- <div class="input-group-prepend"> <div class="input-group-prepend">
<span class="input-group-text">{{ 'reset_pwd.new_pwd' | translate }}</span> <span class="input-group-text">{{ 'reset_pwd.new_pwd' | translate }}</span>
</div> --> </div>
<span style="margin-right: 5px;margin-top: 3px;"><img src="../../../assets/image/head.png" style="height: 30px;width: 30px;" /></span>
<input type="password" class="form-control text-center disabled" [class.is-invalid]="getValue('password').invalid" <input type="password" class="form-control text-center disabled" [class.is-invalid]="getValue('password').invalid"
[placeholder]="'tip.input' | translate:{value:'reset_pwd.new_pwd'|translate}" [placeholder]="'tip.input' | translate:{value:'reset_pwd.new_pwd'|translate}"
formControlName="password"/> formControlName="password"/>
@ -60,11 +54,10 @@
</div> </div>
<!-- 确认新密码--> <!-- 确认新密码-->
<div style="margin: 20px 0!important;" class="input-group mb-3 mx-auto col-12" *ngIf="step===3"> <div class="input-group mb-3 mx-auto col-7" *ngIf="step===3">
<!-- <div class="input-group-prepend"> <div class="input-group-prepend">
<span class="input-group-text">{{ 'reset_pwd.confirm_pwd' | translate }}</span> <span class="input-group-text">{{ 'reset_pwd.confirm_pwd' | translate }}</span>
</div> --> </div>
<span style="margin-right: 5px;margin-top: 3px;"><img src="../../../assets/image/head.png" style="height: 30px;width: 30px;" /></span>
<input type="password" class="form-control text-center disabled" <input type="password" class="form-control text-center disabled"
[class.is-invalid]="getValue('confirmPassword').invalid" [class.is-invalid]="getValue('confirmPassword').invalid"
[placeholder]="'tip.input' | translate:{value:'reset_pwd.confirm_pwd'|translate}" [placeholder]="'tip.input' | translate:{value:'reset_pwd.confirm_pwd'|translate}"
@ -81,11 +74,10 @@
</div> </div>
<!-- 验证码--> <!-- 验证码-->
<div style="margin: 20px 0!important;" class="input-group mb-3 mx-auto col-12" *ngIf="step===2"> <div class="input-group mb-3 mx-auto col-7" *ngIf="step===2">
<!-- <div class="input-group-prepend"> <div class="input-group-prepend">
<span class="input-group-text">{{ 'reset_pwd.code' | translate }}</span> <span class="input-group-text">{{ 'reset_pwd.code' | translate }}</span>
</div> --> </div>
<span style="margin-right: 5px;margin-top: 3px;"><img src="../../../assets/image/head.png" style="height: 30px;width: 30px;" /></span>
<input type="text" class="form-control text-center" <input type="text" class="form-control text-center"
[placeholder]="'tip.input' | translate:{value:'reset_pwd.code'|translate}" [placeholder]="'tip.input' | translate:{value:'reset_pwd.code'|translate}"
[class.is-invalid]="getValue('verificationCode').invalid" [class.is-invalid]="getValue('verificationCode').invalid"

@ -1,9 +0,0 @@
#resetpwd{
.form-control{
// color: #fff;
background: rgb(242, 242, 242);
border-radius: 19px!important;
border: none;
outline: none;
}
}

@ -1,4 +1,4 @@
<nav class="navbar navbar-light bg-light-self"> <nav class="navbar navbar-light bg-light">
<span class="navbar-text nav-text-lg"> <span class="navbar-text nav-text-lg">
{{ 'APP_TITLE' | translate }} {{ 'APP_TITLE' | translate }}
</span> </span>
@ -19,7 +19,7 @@
</span> </span>
</nav> </nav>
<nav class="navbar navbar-expand-lg bg-white justify-content-center pb-0"> <nav class="navbar navbar-expand-lg navbar-light bg-light justify-content-center pb-0">
<ng-container *ngIf="isLogin"> <ng-container *ngIf="isLogin">
<ul class="navbar-nav"> <ul class="navbar-nav">
<li class="nav-item mr-2" routerLinkActive="active"> <li class="nav-item mr-2" routerLinkActive="active">

@ -1,47 +1,3 @@
.manager { .manager {
color: red; color: red;
} }
.navbar{
padding: 0;
}
.switch{
position: absolute;
right: 20px;
top: 20px;
padding: 0px 20px;
background-color: #ffffff;
border-radius: 5px;
.btn-secondary{
background: none;
border: none;
color: rgb(80, 138, 202);
}
.btn-secondary:focus, .btn-secondary.focus{
box-shadow: none;
}
.dropdown-toggle::after{
border: none;
margin: 0;
content: none;
}
.dropdown-menu{
padding: 10px 40px;
right: 0;
left: -50px!important;
a{
line-height: 30px;
cursor: pointer;
&:hover{
background: none;
}
}
}
}
.navbar-light span {
color: #ffffff!important;
font-size: 22px!important;
font-family: 'Times new roman'!important;
}
.navbar-light a{
cursor: pointer;
}

@ -3,7 +3,7 @@
<h1 *ngIf="notices.length==0;else notice_temp" <h1 *ngIf="notices.length==0;else notice_temp"
class="text-center col-12 m-3">{{prefix('notice.zero')|translate}}</h1> class="text-center col-12 m-3">{{prefix('notice.zero')|translate}}</h1>
<ng-template #notice_temp> <ng-template #notice_temp>
<div id="carouselExampleControls" class="carousel slide bg-info m-3 bg-white" data-ride="carousel"> <div id="carouselExampleControls" class="carousel slide bg-info m-3" data-ride="carousel">
<div class="carousel-inner"> <div class="carousel-inner">
<ng-container *ngFor="let notice of notices;first as isFirst"> <ng-container *ngFor="let notice of notices;first as isFirst">
<div class="carousel-item" [class.active]="isFirst"> <div class="carousel-item" [class.active]="isFirst">
@ -15,7 +15,7 @@
<button [title]="this.prefix('delete')|translate" (click)="deleteNotice(notice.id)" <button [title]="this.prefix('delete')|translate" (click)="deleteNotice(notice.id)"
class="position-absolute delete_notice btn btn-outline-danger"> class="position-absolute delete_notice btn btn-outline-danger">
<svg class="icon" viewBox="0 0 1024 1024" <svg class="icon" viewBox="0 0 1024 1024"
xmlns="http://www.w3.org/2000/svg" width="20" height="20"> xmlns="http://www.w3.org/2000/svg" width="50" height="50">
<path <path
d="M810.666667 273.493333L750.506667 213.333333 512 451.84 273.493333 213.333333 213.333333 273.493333 451.84 512 213.333333 750.506667 273.493333 810.666667 512 572.16 750.506667 810.666667 810.666667 750.506667 572.16 512z" d="M810.666667 273.493333L750.506667 213.333333 512 451.84 273.493333 213.333333 213.333333 273.493333 451.84 512 213.333333 750.506667 273.493333 810.666667 512 572.16 750.506667 810.666667 810.666667 750.506667 572.16 512z"
> >
@ -66,7 +66,7 @@
<!--审核贴--> <!--审核贴-->
<div class="row border-warning check m-3 border-circle bg-white"> <div class="row border-warning check m-3">
<!-- 审核帖标识--> <!-- 审核帖标识-->
<h1 class="text-info col-12 text-center">{{ 'forum.check' | translate }}</h1> <h1 class="text-info col-12 text-center">{{ 'forum.check' | translate }}</h1>
@ -75,17 +75,17 @@
class="text-center col-12 m-3">{{prefix('posts.zero')|translate}}</h1> class="text-center col-12 m-3">{{prefix('posts.zero')|translate}}</h1>
<ng-template #post_temp> <ng-template #post_temp>
<div class="col-3 d-flex flex-column justify-content-between align-content-center"> <div class="col-3">
<!--帖子列表--> <!--帖子列表-->
<ul class="list-group flex-grow-1" style="background: #eee;"> <ul class="list-group">
<!-- 帖子列表--> <!-- 帖子列表-->
<li class="list-group-item mb-2" (click)="currentIndex=i" [class.active]="currentIndex===i" <li class="list-group-item" (click)="currentIndex=i" [class.active]="currentIndex===i"
*ngFor="let post of posts.forumList.list;index as i">{{post.title}}</li> *ngFor="let post of posts.forumList.list;index as i">{{post.title}}</li>
</ul> </ul>
<!-- 分页按钮--> <!-- 分页按钮-->
<ul class="pagination m-auto pb-4"> <ul class="pagination ml-5 mt-3">
<li class="page-item" [class.disabled]="posts.forumList.currentPage-1===0"><a class="page-link btn" <li class="page-item" [class.disabled]="posts.forumList.currentPage-1===0"><a class="page-link btn"
(click)="getAllPosts(posts.forumList.currentPage-1)">{{'button.prev_page'|translate}}</a> (click)="getAllPosts(posts.forumList.currentPage-1)">{{'button.prev_page'|translate}}</a>
</li> </li>
@ -116,43 +116,38 @@
<!-- 活动贴--> <!-- 活动贴-->
<ng-container *ngSwitchCase="activeType"> <ng-container *ngSwitchCase="activeType">
<div class="row">
<!-- 标题-->
<h1 class="text-info col-12 text-center forum-title">{{getForum().title}}</h1>
</div>
<div class="row justify-content-around flex-nowrap mb-3">
<div class="col-3">
<!-- 发件人信息--> <!-- 发件人信息-->
<div class="card"> <div class="position-absolute sender">
<!-- 发帖人头像--> <!-- 发帖人头像-->
<img [src]="getHeadImg(getForum().info.headImg)" class="img-responsive card-img-top" alt="headimg"> <img [src]="getHeadImg(getForum().info.headImg)" alt="headimg" class="headimg mb-3"/>
<ul class="list-group list-group-flush">
<!-- 发帖人--> <!-- 发帖人-->
<li class="list-group-item">昵称:{{getForum().username}}</li> <div class="forum-label border-info mb-3 text-center">
{{getForum().username}}
</div>
<!--信用分--> <!--信用分-->
<li class="list-group-item">信用分:{{getForum().info.creditScore}}</li> <div class="forum-label border-info mb-3 text-center">
</ul> {{getForum().info.creditScore}}
</div> </div>
</div> </div>
<!-- 帖子框架-->
<div class="col-9 flex-column justify-content-between">
<!-- 帖子框架-->
<div>
<!-- 标题-->
<h1 class="text-info col-12 text-center mb-3 forum-title">{{getForum().title}}</h1>
<!-- 帖子正文--> <!-- 帖子正文-->
<div class="forum-content border-info overflow-auto d-flxe flex-column justify-content-between"> <div class="forum-content border-info overflow-auto col-9 offset-2 mb-3">
<div class="flex-grow-1">
{{getContent().content}} {{getContent().content}}
</div> </div>
<!-- 帖子底部--> <!-- 帖子底部-->
<div class="forum-footer border-info text-right p-3 mb-3"> <div class="forum-footer border-info p-3 mb-3">
<div> <h3
{{'forum.deadline'|translate:{endDate: (getActive().registrationDeadline|date:dateFormat)} }}</div> class="text-center">{{'forum.deadline'|translate:{endDate: (getActive().registrationDeadline|date:dateFormat)} }}</h3>
<div>{{ 'forum.active_date' | translate:{ <h3 class="text-center">{{ 'forum.active_date' | translate:{
startDate: getActive().activeStartTime|date:dateFormat, startDate: getActive().activeStartTime|date:dateFormat,
endDate: getActive().activeEndTime|date:dateFormat endDate: getActive().activeEndTime|date:dateFormat
} }}</div> } }}</h3>
<div>{{ 'forum.active_score' | translate:{score: getActive().activeScore} }}</div> <h3
</div> class="text-center">{{ 'forum.active_score' | translate:{score: getActive().activeScore} }}</h3>
</div>
</div> </div>
</div> </div>
</ng-container> </ng-container>
@ -253,23 +248,21 @@
<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">
{{getContent().content}} {{getContent().content}}
</div> </div>
</div>
<!-- 帖子底部--> <!-- 帖子底部-->
<div class="forum-footer border-info p-3 mb-3"> <div class="forum-footer border-info p-3 mb-3">
<h3 <h3
class="text-center">{{ 'forum.active_score' | translate:{score: getScore().activeScore} }}</h3> class="text-center">{{ 'forum.active_score' | translate:{score: getScore().activeScore} }}</h3>
</div> </div>
</div>
</ng-container> </ng-container>
</ng-container> </ng-container>
<!--帖子审核按钮--> <!--帖子审核按钮-->
<div class="row">
<div class="col-12 text-center"> <div class="col-12 text-center">
<button class="btn btn-info col-2 mr-3 btn-border" (click)="checkPost(okType)">{{ 'forum.approve' | translate }}</button> <button class="btn btn-info col-2 mr-3" (click)="checkPost(okType)">{{ 'forum.approve' | translate }}</button>
<button class="btn btn-danger col-2 btn-border" (click)="checkPost(failType)">{{ 'forum.reject' | translate }}</button> <button class="btn btn-danger col-2" (click)="checkPost(failType)">{{ 'forum.reject' | translate }}</button>
</div>
</div> </div>
</div> </div>

@ -42,8 +42,7 @@
//帖子内容 //帖子内容
.forum-content { .forum-content {
display: flex; border-style: solid;
border-style: none;
border-width: 3px; border-width: 3px;
height: 300px; height: 300px;
max-height: 300px; max-height: 300px;

@ -1,6 +1,6 @@
<!--设置高度,添加bootstrap样式类d-flex align-items-center 使表单垂直居中,justify-content-center水平居中--> <!--设置高度,添加bootstrap样式类d-flex align-items-center 使表单垂直居中,justify-content-center水平居中-->
<div [style]="height" class="d-flex align-items-center justify-content-center"> <div [style]="height" class="d-flex align-items-center justify-content-center">
<form [formGroup]="noticeForm" class="col-10"> <form [formGroup]="noticeForm" class="col-6">
<!-- 公告标题--> <!-- 公告标题-->
<div class="input-group mb-3 mx-auto col-7"> <div class="input-group mb-3 mx-auto col-7">
<div class="input-group-prepend"> <div class="input-group-prepend">

Binary file not shown.

Before

Width:  |  Height:  |  Size: 224 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 6.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.7 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.9 KiB

@ -1,18 +1,11 @@
/* You can add global styles to this file, and also import other style files */ /* You can add global styles to this file, and also import other style files */
@import '../node_modules/bootstrap/scss/bootstrap'; @import '../node_modules/bootstrap/scss/bootstrap';
body{
background: #eee;
}
// 自定义 navBar 背景色 // 自定义 navBar 背景色
.bg-light-self { .bg-light {
background-color: rgb(141, 198, 248) !important; background-color: rgb(141, 198, 248) !important;
} }
.bg-white {
background-color: #fff!important;
}
// navBar 第一栏字体放大 // navBar 第一栏字体放大
.nav-text-lg { .nav-text-lg {
font-size: 1.5rem; font-size: 1.5rem;
@ -22,18 +15,3 @@ body{
.btn-border { .btn-border {
border-radius: 1rem; border-radius: 1rem;
} }
.border-circle,
.border-circle * {
border-radius: 0.5rem;
}
.border-circle {
// background-color: #eee;
}
.border-circle * {
border-radius: 0.5rem;
// border-style:none !important;
// background-color: #fff;
}
Loading…
Cancel
Save