UI improvement

zhyale · zhyale · commit 37e3fdaa1efe · 2020-04-05T21:29:49.000+08:00
diff --git a/src/app/applications/applications.component.html b/src/app/applications/applications.component.html
@@ -1,3 +1,4 @@
+<div class="container">
 <div>    
     <mat-card>
       <h2 i18n="@@app_mgmt">Application Management</h2>
@@ -21,3 +22,4 @@ <h3 matLine> {{application.name}}  </h3>
     </ng-template>   
   </mat-list-item>
 </mat-list>
+</div>
diff --git a/src/app/cclog-detail/cclog-detail.component.css b/src/app/cclog-detail/cclog-detail.component.css
@@ -0,0 +1,3 @@
+.container {
+    font-family: 'Courier New', Courier, monospace;
+}
diff --git a/src/app/cclog-detail/cclog-detail.component.html b/src/app/cclog-detail/cclog-detail.component.html
@@ -1,7 +1,7 @@
 <div *ngIf="log">
   <h2>
-            <mat-icon>details</mat-icon>
-            CC Log Details
+      <mat-icon>details</mat-icon>
+      <span i18n="@@cc_log_details">CC Log Details</span>
   </h2>  
   
   <div class="container">
@@ -42,5 +42,5 @@ <h2>
      <section></section>
     <div>
   </div> 
-  <button mat-raised-button (click)="goBack()" color="primary">Go Back</button>
+  <button mat-raised-button i18n="@@go_back" (click)="goBack()" color="primary">Go Back</button>
   </div>
diff --git a/src/app/cclogs/cclogs.component.html b/src/app/cclogs/cclogs.component.html
@@ -1,4 +1,6 @@
-<div>
+<div class="container">
+
+  <div>
   <mat-form-field>
    <mat-select i18n-placeholder="@@application" [(ngModel)]="app_id" placeholder="Application">
    <mat-option *ngFor="let application of applicationService.applications;" [value]="application.id">
@@ -18,6 +20,7 @@
  </mat-form-field>
  <button mat-raised-button i18n="@@query_cc_logs" (click)="queryCCLogs()" color="primary">Query CC Logs</button>
 </div>
+
 <div class="mat-elevation-z8">
  <mat-table #table [dataSource]="ccLogDataSource"> 
    <ng-container matColumnDef="id">
@@ -72,4 +75,5 @@
           [showFirstLastButtons]="true" 
           (page)="pageChanged()">
  </mat-paginator>
+</div>
 </div>
diff --git a/src/app/certificates/certificates.component.html b/src/app/certificates/certificates.component.html
@@ -1,3 +1,4 @@
+<div class="container">
 <div>
   <mat-card>
       <h2 i18n="@@cert_mgmt">Certificate Management</h2>      
@@ -20,3 +21,4 @@ <h3 matLine> {{certificate.common_name}} ({{certificate.description}}) </h3>
     </p>    
 </mat-list-item>
 </mat-list>
+</div>
diff --git a/src/app/dashboard/dashboard.component.html b/src/app/dashboard/dashboard.component.html
@@ -1,3 +1,4 @@
+<div class="container">
 <div *ngIf="applicationService.auth_user.logged">
 <div>
     <mat-form-field>
@@ -28,4 +29,5 @@
   <div class="myChart">
       <canvas id="week_canvas">{{ weekCountChart }}</canvas>
     </div>
+</div>
 </div>
diff --git a/src/app/frontpage/frontpage.component.css b/src/app/frontpage/frontpage.component.css
@@ -1,12 +1,11 @@
 mat-card {
-    margin-top: 5px;
-    background-color: rgb(246, 246, 246);    
+    margin-bottom: 7px;
     border-radius: 0;
     font-family: Helvetica, Arial, "PingFang SC", "Source Han Serif SC", "Microsoft YaHei";
 }
 
 .card-content {
-    padding: 10px 10px;
+    padding-top: 1px 1px;
 }
 
 .card-image {
diff --git a/src/app/frontpage/frontpage.component.html b/src/app/frontpage/frontpage.component.html
@@ -1,9 +1,9 @@
-<div>    
+<div class="container">
+
     <mat-card>
       <h2 i18n="@@product_name">Janusec Application Gateway 0.9.7</h2>
     </mat-card>    
-  </div>
-  <div class="inner-container">
+
     <mat-card>
       <mat-card-content class="card-content">
           <img mat-card-image src="/janusec-admin/assets/images/gateway.png" class="card-image">
@@ -56,7 +56,6 @@ <h2 i18n="@@product_name">Janusec Application Gateway 0.9.7</h2>
               </mat-nav-list>               
             </mat-card-content>
       </mat-card>
-  
-  </div>
 
+</div>
     
diff --git a/src/app/log-detail/log-detail.component.html b/src/app/log-detail/log-detail.component.html
@@ -1,7 +1,7 @@
 <div *ngIf="log">
   <h2>
-            <mat-icon>details</mat-icon>
-            Log Details
+        <mat-icon>details</mat-icon>
+        <span i18n="@@log_details">Log Details</span>
   </h2>  
   
   <div class="container">
@@ -45,5 +45,5 @@ <h2>
      <section></section>
     <div>
   </div> 
-  <button mat-raised-button (click)="goBack()" color="primary">Go Back</button>
+  <button mat-raised-button i18n="@@go_back" (click)="goBack()" color="primary">Go Back</button>
   </div>
diff --git a/src/app/logs/logs.component.html b/src/app/logs/logs.component.html
@@ -1,3 +1,4 @@
+<div class="container">
 <div>
    <mat-form-field>
     <mat-select i18n-placeholder="@@application" [(ngModel)]="app_id" placeholder="Application">
@@ -75,4 +76,5 @@
            [showFirstLastButtons]="true" 
            (page)="pageChanged()">
   </mat-paginator>
+</div>
 </div>
diff --git a/src/app/models.ts b/src/app/models.ts
@@ -115,10 +115,10 @@ export enum ChkPoint {
 }
 
 export enum PolicyAction {
-    Block   = 100,
-    BypassAndLog  = 200,
-    Captcha = 300,
-    OK_Pass    = 400
+    BLOCK   = 100,
+    BYPASS_AND_LOG  = 200,
+    CAPTCHA = 300,
+    OK_PASS    = 400
 }
 
 export class VulnType {
diff --git a/src/app/nodes/nodes.component.html b/src/app/nodes/nodes.component.html
@@ -1,3 +1,4 @@
+<div class="container">
 <div>    
     <mat-card>
         <h2 i18n="@@node_mgmt">Node Management</h2>
@@ -19,3 +20,4 @@ <h3 matLine> {{node.last_ip}}  &nbsp;&nbsp;&nbsp;&nbsp;( version: {{ node.versio
     
   </mat-list-item>
 </mat-list>
+</div>
diff --git a/src/app/policy/policy.component.ts b/src/app/policy/policy.component.ts
@@ -33,7 +33,7 @@ export class PolicyComponent implements OnInit {
       this.group_policy.id=0;
       if(app_id!=null) this.group_policy.app_id=app_id;
       else this.group_policy.app_id=0;
-      this.group_policy.action=PolicyAction.Block;
+      this.group_policy.action=PolicyAction.BLOCK;
       this.group_policy.description="Custom";
       this.group_policy.check_items=[];
       this.addCheckItem();
diff --git a/src/app/usermgmt/usermgmt.component.html b/src/app/usermgmt/usermgmt.component.html
@@ -1,3 +1,4 @@
+<div class="container">
 <div>
   <mat-card>
     <h2 i18n="@@user_mgmt">Users Management</h2>
@@ -16,3 +17,4 @@ <h3 matLine> {{admin.username}} </h3>
     
 </mat-list-item>
 </mat-list>
+</div>
diff --git a/src/app/webssh/webssh.component.html b/src/app/webssh/webssh.component.html
@@ -1,3 +1,4 @@
+<div class="container">
 <h2>
     <mat-icon>computer</mat-icon>
     <span i18n="@@web_ssh_term">Web SSH Term</span>
@@ -17,4 +18,5 @@ <h2>
     </mat-form-field> 
     <button mat-raised-button (click)="SSHConnect()" color="primary">SSH</button>
 </div>
-<div #terminalDiv></div>
+<div #terminalDiv></div>
+</div>
diff --git a/src/polyfills.ts b/src/polyfills.ts
@@ -68,7 +68,7 @@ let zhTranslations = {
     'dashboard': '仪表盘',
     'waf_mgmt': 'WAF管理',
     'waf_logs': 'WAF日志',
-    'cc_logs': 'CC攻击日志',    
+    'cc_logs': 'CC日志',    
     // frontpage
     'product_name': 'JANUSEC应用网关V0.9.7',
     'product_desc': 'JANUSEC应用网关，提供WAF、CC攻击防御、OAuth2身份认证、统一Web化管理入口、证书私钥保护、Web SSH安全运维，Web路由以及可扩展的负载均衡等功能。',
@@ -163,6 +163,10 @@ let zhTranslations = {
     'end_time': '结束时间(23:59:59)',
     'query_waf_logs': '查询WAF日志',
     'query_cc_logs': '查询CC日志',
+    'log_details': 'WAF日志详情',
+    // CC Log
+    'cc_log_details': 'CC日志详情',
+    'go_back': '后退',
     // Web SSH
     'web_ssh_term': '在线SSH运维终端',
     'ip_address': '目标主机IP地址',

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+.container {`
	`2`	`+ font-family: 'Courier New', Courier, monospace;`
	`3`	`+}`
Original file line number	Diff line number	Diff line change
`@@ -1,12 +1,11 @@`
`1`	`1`	`mat-card {`
`2`		`- margin-top: 5px;`
`3`		`- background-color: rgb(246, 246, 246);`
	`2`	`+ margin-bottom: 7px;`
`4`	`3`	`border-radius: 0;`
`5`	`4`	`font-family: Helvetica, Arial, "PingFang SC", "Source Han Serif SC", "Microsoft YaHei";`
`6`	`5`	`}`
`7`	`6`
`8`	`7`	`.card-content {`
`9`		`- padding: 10px 10px;`
	`8`	`+ padding-top: 1px 1px;`
`10`	`9`	`}`
`11`	`10`
`12`	`11`	`.card-image {`