个人设置，操作日志

src/app/pages/system-management/operation-logs/operation-logs.component.html

@@ -1,3 +1,60 @@
-<p>
-  operation-logs works!
-</p>
+<div class="system-main-container"> 
+	<div class="user-manage">
+		<div class="system-main-content card" id="main-box">
+			<div class="search-box">
+				<div nz-row>
+					<div nz-col nzSpan="8"> 
+						<nz-form-item >
+							<nz-form-label class="left">关键词</nz-form-label>
+							<nz-form-control nzSpan="17">
+							  <input nz-input [(ngModel)]='search.keyword'  placeholder="请输入角色名称">
+							</nz-form-control>
+						</nz-form-item>
+					</div>
+					<div nz-col nzSpan="8">
+						<nz-form-item >
+							<nz-form-control nzSpan="24">
+								<button class="mr10" nz-button nzType="primary"  (click)="queryTable()"><i nz-icon type="search"></i>查询</button>
+								<button (click)="reset()" nz-button nzType="primary"><i nz-icon type="sync" theme="outline"></i>重置</button>
+							</nz-form-control>
+						</nz-form-item>
+					</div>
+				</div>
+				<div class="table-operation-box">
+					<button (click)="addModify(1)" nz-button nzType="primary"><i nz-icon type="plus" theme="outline"></i>新增</button>
+				</div>
+			</div>
+			<app-request-status *ngIf='statusParamsTable.status!=4' [statusParams]='statusParamsTable'></app-request-status>
+			<div class="table-box" *ngIf='statusParamsTable.status==3||statusParamsTable.status==4||statusParamsTable.status==0'>
+				<nz-table [nzShowPagination]='false'  #dataSet [nzData]="tableData">
+					<thead>
+						<tr>
+					       <th>时间</th>
+					       <th>姓名</th>
+					       <th>账号</th>
+						   <th>日志类别</th>
+						   <th>操作类别</th>
+						   <th>描述</th>
+						   <th>登录ip</th>
+						</tr>
+					</thead>
+					<tbody>
+						<tr *ngFor="let item of dataSet.data">
+							<td>{{item.log_datetime| date:'yyyy-MM-dd HH:mm:ss'}}</td>
+							<td>{{item.real_name}}</td>
+							<td>{{item.user_name}}</td>
+							<td>{{logType[item.log_type]}}</td>
+							<td>{{item.opt_type}}</td>
+							<td>{{item.summary}}</td>
+							<td>{{item.login_ip}}</td>
+						</tr>
+					</tbody>
+				</nz-table>
+				<div class="page-box" *ngIf="statusParamsTable.status==3">
+					<nz-pagination [nzPageIndex]="search.page_index" (nzPageIndexChange)='pageChange($event)' [nzPageSize]='search.page_size' [nzTotal]="collectionSize"></nz-pagination>
+				</div>
+			</div>	
+			
+		</div>
+	</div>
+</div>

src/app/pages/system-management/operation-logs/operation-logs.component.scss

@@ -0,0 +1,20 @@
+@import "../../main.scss";
+.system-main-container{
+	.user-manage{ 
+		.system-main-content{
+			overflow-y:scroll;
+		}
+		.card{
+			
+		}
+		.tree-box{
+			overflow-y:scroll; 
+		}
+	} 
+} 
+ 
+.user-detail{
+	.detail-item-text{
+		color: #1890ff;
+	}
+}

src/app/pages/system-management/operation-logs/operation-logs.component.ts

@@ -1,4 +1,8 @@
 import { Component, OnInit } from '@angular/core';
+import { HttpClientService } from '../../../services/http-client.service';
+import { Router } from '@angular/router';
+import { NzMessageService } from 'ng-zorro-antd';
+
 
 @Component({
   selector: 'app-operation-logs',
@@ -6,10 +10,72 @@ import { Component, OnInit } from '@angular/core';
   styleUrls: ['./operation-logs.component.scss']
 })
 export class OperationLogsComponent implements OnInit {
+	collectionSize:any ; 
+	public tableData:any=[];
+	statusParamsTable:any={	//获取用户列表接口的状态，0请求失败 1请求前 2请求中 3请求成功，有数据  4请求成功，无数据 
+		status:1,
+	}
+	public search:any={
+		page_index:'1',
+		page_size:'10',
+		date_start:'',
+		date_end:'',
+		keyword:'',
+		orgId:'',
+	}
+	logType:any={
+		'LOGIN':'登录',
+		'LOGOUT':'退出',
+		'USER_UI_SET':'修改用户设置',
+		'USER_INFO_OPT':'增删改用户信息',
+	};
+	optType:any={
+		'ADD':'新增',
+		'UPDATE':'修改',
+		'DELETE':'删除',
+	};
+	constructor(
+		private http:HttpClientService,
+		private router:Router,
+		private message: NzMessageService,
+	) { }
 
-  constructor() { }
-
-  ngOnInit() {
-  }
+	ngOnInit() {
+		// 页面监听 动态改变表单高度
+		$('#main-box').css('height',(document.documentElement.clientHeight-106+'px'));
+		$(window).resize(function(){
+			$('#main-box').css('height',(document.documentElement.clientHeight-106+'px'));
+		})
+		this.queryTable();
+	}
+	//重置，重置搜索条件
+	reset(){
+		this.search.page_index=1;
+		this.search.page_size=10;
+		this.search.keyword='';
+		this.queryTable();
+	}
+	//获取列表
+	queryTable():void{
+		this.statusParamsTable.status=1;
+		this.http.get('/sysapi/oplog/list',this.search).subscribe((json)=>{
+			if(json.is_success){
+				this.tableData=json.body.recordList;
+				this.collectionSize=json.body.recordCount;
+				if(json.body.recordList&&json.body.recordList.length>0){
+					this.statusParamsTable.status=3;
+				}else{
+					this.statusParamsTable.status=4;
+				}
+			}else{
+				this.statusParamsTable.status=0;
+			}
+		})
+	}
+	//翻页
+	pageChange(event){
+		this.search.page_index=event;
+		this.queryTable();
+	}
 
 }