cdia/airport-chengdu-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

个人设置，操作日志

Browse Source
This commit is contained in:
liweijin
2018-12-13 17:56:42 +08:00
parent 145050f406
commit a485b0a09c
9 changed files with 260 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/pages/system-management/personal-settings/color-settings/color-settings.component.html
+6 -5
View File
@@ -1,11 +1,12 @@
<div class="color-settings-container">
<div class="data-list-box" *ngFor='let item of DataList'>
<div class="text-box" [ngStyle]="{'background-color':item.bgColor}">航班时间</div>
<button [colorPicker]="color" (colorPickerChange)="colorPicker($event,item)" class="setting-bg-color" nz-button nzType="default"><i nz-icon type="setting" theme="outline"></i>设置背景</button>
<button (click)="resetBgColor(item)" nz-button nzType="default"><i nz-icon type="reload" theme="outline"></i>恢复默认值</button>
<div class="data-list-box" *ngFor='let item of DataList;let i=index'>
<div class="text-box" [ngStyle]="{'background-color':item.COL_BG_COLOR,'color':item.COL_COLOR}">{{item.COL_CN}}</div>
<button [colorPicker]="color" [cpOutputFormat]="'rgba'" (colorPickerChange)="colorPicker($event,item,1)" class="setting-bg-color" nz-button nzType="default">设置背景</button>
<button [colorPicker]="color" [cpOutputFormat]="'rgba'" (colorPickerChange)="colorPicker($event,item,2)" class="setting-bg-color" nz-button nzType="default">设置字体</button>
<button (click)="resetBgColor(item,i)" nz-button nzType="default">恢复默认值</button>
</div>
<div class="color-picker-box">
<button (click)='save()' nzPlacement="top" nz-tooltip nz-button nzType="primary">保存</button>
<button (click)='save()' nzPlacement="top" nz-tooltip nz-button [nzLoading]="isLoadingSave" nzType="primary">保存</button>
<button (click)='cancel()' nzPlacement="top" nz-tooltip nz-button nzType="default">取消</button>
</div>
</div>
src/app/pages/system-management/personal-settings/color-settings/color-settings.component.scss
+2 -1
View File
@@ -6,11 +6,12 @@
display: inline-block;
margin-right: 10px;
margin-bottom: 10px;
width: 444px;
width: 290px;
height: 32px;
line-height: 32px;
text-align: center;
border-radius: 2px;
border: 1px solid rgba(242,242,242,1);
}
.setting-bg-color{
margin-right: 10px;
src/app/pages/system-management/personal-settings/color-settings/color-settings.component.ts
+87 -23
View File
@@ -1,56 +1,120 @@
import { Component, OnInit } from '@angular/core';
import { HttpClientService } from '../../../../services/http-client.service';
import { NzMessageService } from 'ng-zorro-antd';
@Component({
selector: 'app-color-settings',
templateUrl: './color-settings.component.html',
styleUrls: ['./color-settings.component.scss']
styleUrls: ['./color-settings.component.scss'],
providers:[HttpClientService]
})
export class ColorSettingsComponent implements OnInit {
cmykColor:any;
color:any;
list:any=[]; //源数据
DataList:any=[]; //临时项目列表，如果保存就传改变量，如果取消，则重置为list的源数据
constructor() { }
defaultList:any=[]; //默认的原颜色设置
statusParamsData:any={ //获取接口的状态，0请求失败 1请求前 2请求中 3请求成功，有数据 4请求成功，无数据
status:1,
}
tableData:any=''; //颜色查询接口数据
isLoadingSave:any=false;
constructor(
private http:HttpClientService,
private message: NzMessageService,
) { }
ngOnInit() {
this.list=[{"COL_CODE":"FLNO", "COL_CN":"航班号", "COL_ORDER":"10"}, {"COL_CODE":"ALCD", "COL_CN":"航空公司", "COL_ORDER":"8"}, {"COL_CODE":"FLIN", "COL_CN":"航线类别", "COL_ORDER":"4"}, {"COL_CODE":"FLTY", "COL_CN":"航班类别", "COL_ORDER":"5"}, {"COL_CODE":"MVIN", "COL_CN":"航向指示", "COL_ORDER":"9"}, {"COL_CODE":"TRML", "COL_CN":"候机楼", "COL_ORDER":"7"}, {"COL_CODE":"RENO", "COL_CN":"飞机号", "COL_ORDER":"3"}, {"COL_CODE":"SODT", "COL_CN":"计划到达/出发", "COL_ORDER":"13"}, {"COL_CODE":"ESTT", "COL_CN":"预计到达/出发", "COL_ORDER":"14"}, {"COL_CODE":"ACTT", "COL_CN":"实际到达/出发", "COL_ORDER":"15"}, {"COL_CODE":"STND", "COL_CN":"停机位", "COL_ORDER":"16"}, {"COL_CODE":"ORDER", "COL_CN":"排序", "COL_ORDER":"17"} ] ;
//深度复制
this.list.forEach(item=>{
let option=this.deepCopy(item);
this.DataList.push(option);
})
this.queryTable();
this.defaultList=[
{"COL_CODE":"RENO", "COL_CN":"飞机号", "COL_BG_COLOR":"rgb(46,255,135,1)","COL_COLOR":"rgb(0,70,255,1)"},
{"COL_CODE":"ACTT", "COL_CN":"实际到达／出发", "COL_BG_COLOR":"rgb(149,207,255,1)","COL_COLOR":"rgb(0,70,255,1)"},
{"COL_CODE":"ESTT", "COL_CN":"预计到达／出发", "COL_BG_COLOR":"rgb(255,207,157,1)","COL_COLOR":"rgb(0,70,255,1)"},
{"COL_CODE":"PADT", "COL_CN":"前站起飞时间", "COL_BG_COLOR":"rgb(114,181,255,1)","COL_COLOR":"rgb(0,70,255,1)"},
{"COL_CODE":"PSST", "COL_CN":"计划机位", "COL_BG_COLOR":"rgb(173,255,46,1)","COL_COLOR":"rgb(0,70,255,1)"},
]
}
//设置颜色 1设置字体颜色 2设置背景颜色 3重置字体颜色
colorPicker(event,item){
item.bgColor=event;
//设置颜色 1设置背景颜色 2设置字体颜色
colorPicker(event,item,type){
if(type==1){
item.COL_BG_COLOR=event;
}else if(type==2){
item.COL_COLOR=event;
}
}
//背景色恢复默认值
resetBgColor(item){
item.bgColor='#fafafa';
resetBgColor(item,index){
item.COL_BG_COLOR=this.defaultList[index].COL_BG_COLOR;
item.COL_COLOR=this.defaultList[index].COL_COLOR;
}
//对象数组深度复制
deepCopy(data){
let itemObj={
bgColor:'#fafafa',
};
let itemObj={};
for(let key in data){
itemObj[key]=data[key];
}
return itemObj;
}
//数组深度复制构造
listsCope(sourceList,targetList){
sourceList.forEach(item=>{
let option=this.deepCopy(item);
targetList.push(option);
})
}
//保存
save(){
console.log(this.list)
console.log(this.DataList)
let settingContent=JSON.stringify(this.DataList);
let params:any={
envCode:'web',
groupCode:'userSettingColor',
settingContent:settingContent,
}
this.isLoadingSave=true;
console.log(params);
this.http.post('/adminapi/settings/uisettings',params).subscribe((json)=>{
this.isLoadingSave=false;
if(json.is_success){
this.message.success(`保存成功!`);
this.queryTable();
}else{
this.message.error(`保存失败!`);
}
})
}
//取消
cancel(){
this.DataList=[];
//深度复制
this.list.forEach(item=>{
let option=this.deepCopy(item);
this.DataList.push(option);
this.queryTable();
}
//获取列表
queryTable():void{
this.statusParamsData.status=1;
this.http.get('/adminapi/settings/uisettings',{groupCode:'userSettingColor'}).subscribe((json)=>{
if(json.is_success){
this.statusParamsData.status=3;
let data=json.body;
this.tableData=json.body;
this.DataList=[];
//当data为空是，初始化
//判断data是否为空，空的时候则为最初的初始化；如果不为空，则有设置过个人设置的某个模块
if(data&&data.length>0){
data.forEach(item=>{
if(item.settingContent){
console.log(222)
let content=JSON.parse(item.settingContent);
this.listsCope(content,this.DataList);
}else{
console.log(3333)
this.listsCope(this.defaultList,this.DataList);
}
})
}else{
this.listsCope(this.defaultList,this.DataList);
}
}else{
this.statusParamsData.status=0;
}
})
}
src/app/pages/system-management/personal-settings/personal-settings.component.html
+2 -2
View File
@@ -39,8 +39,8 @@
</div>
</div>
<div class="self-row-footer">
<button (click)='saveSelf()' nzTitle="保存配置" [nzLoading]="isLoadingSave" nzPlacement="top" nz-tooltip nz-button nzType="primary">保存</button>
<button (click)='cancelSelf()' nzTitle="取消配置" nzPlacement="top" nz-tooltip nz-button nzType="default">取消</button>
<button (click)='saveSelf()' [nzLoading]="isLoadingSave" nzPlacement="top" nz-tooltip nz-button nzType="primary">保存</button>
<button (click)='cancelSelf()' nzPlacement="top" nz-tooltip nz-button nzType="default">取消</button>
</div>
</div>
</nz-tab>
src/app/pages/system-management/personal-settings/personal-settings.component.scss
+1
View File
@@ -1,6 +1,7 @@
.system-main-container{
.self-main-content{
overflow-y: auto;
height: 100%;
}
.ant-tabs{
.self-row-box{
src/app/pages/system-management/personal-settings/personal-settings.component.ts
+12 -24
View File
@@ -204,6 +204,14 @@ export class PersonalSettingsComponent implements OnInit {
}
//保存-自定义列显示保存
/*
各模块groupCode命名定义
groupCode:'userSettingColor',
groupCode:'userSettingCol',
groupCode:'userSettingMsgAlert',
groupCode:'userSettingMsgVoice',
groupCode:'userSettingFlyAgency',
*/
saveSelf(){
console.log(this.targetList);
console.log(this.sourceList);
@@ -219,46 +227,26 @@ export class PersonalSettingsComponent implements OnInit {
targetList:this.targetList,
}
let settingContent=JSON.stringify(content);
let colsParams:any={
let params:any={
envCode:'web',
groupCode:'userSettingCol',
id:'',
settingContent:settingContent,
userid:''
}
console.log(colsParams)
let params:any='';
//判断settingContent是否有列设置项，如果没有则push进去，如果有，则替换原来的settingContent
if(this.colsData&&this.colsData.length>0){
this.colsData.forEach(item=>{
item.userid='';
item.settingContent=settingContent;
})
params=this.colsData[0];
console.log(8888)
}else{
console.log(99999)
params=colsParams;
}
this.isLoadingSave=true;
console.log(params);
this.http.post('/adminapi/settings/uisettings',params).subscribe((json)=>{
this.isLoadingSave=false;
if(json.is_success){
this.message.success(`保存成功!`);
this.queryTable();
}else{
this.message.error(`保存成功!`);
this.queryTable();
this.message.error(`保存失败!`);
}
})
}
//重置数据
cancelSelf(){
this.sourceList=[];
//等后台接口出来后，重置this.sourceList this.targetList
//深度复制
this.listsCope(this.list,this.sourceList);
this.targetList=[];
this.queryTable();
}
//获取列表
queryTable():void{