284 lines
10 KiB
TypeScript
284 lines
10 KiB
TypeScript
import { Component, OnInit } from '@angular/core';
|
|
import { HttpClientService } from '../../../services/http-client.service';
|
|
import { NzMessageService } from 'ng-zorro-antd';
|
|
|
|
declare var $: any;
|
|
declare var jQuery: any;
|
|
|
|
@Component({
|
|
selector: 'app-personal-settings',
|
|
templateUrl: './personal-settings.component.html',
|
|
styleUrls: ['./personal-settings.component.scss'],
|
|
providers:[HttpClientService]
|
|
})
|
|
export class PersonalSettingsComponent implements OnInit {
|
|
public list: any[] = []; //原始数据项
|
|
public sourceList: any[] = []; //临时数据项-可选项
|
|
public targetList:any=[]; //临时数据项-已选项
|
|
public disableRight:any=true; //单个右移控制按钮可选状态 true 禁止选择 false可选择
|
|
public disabledLeft:any=true; //单个左移控制按钮可选状态 true 禁止选择 false可选择
|
|
public disableUp:any=true; //上移控制按钮可选状态 true 禁止选择 false可选择
|
|
public disableDown:any=true; //下移控制按钮可选状态 true 禁止选择 false可选择
|
|
public disabledUpTop:any=true; //置顶控制按钮可选状态 true 禁止选择 false可选择
|
|
public disabledDownBtm:any=true; //最低控制按钮可选状态 true 禁止选择 false可选择
|
|
public selectedType:any=''; //当前选中项所在项目 1在可选项 2在已选项框
|
|
public moveIndex:any='false';
|
|
public search:any={
|
|
page_index:'1',
|
|
page_size:'10',
|
|
role_name:'',
|
|
}
|
|
public defaultCols:any=[]; //默认的全部列
|
|
public colsData:any='';
|
|
isLoadingSave:any=false;
|
|
statusParamsData:any={ //获取接口的状态，0请求失败 1请求前 2请求中 3请求成功，有数据 4请求成功，无数据
|
|
status:1,
|
|
}
|
|
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.defaultCols=[
|
|
{"COL_CODE":"ACFT", "COL_CN":"机型", "COL_ORDER":"1"},
|
|
{"COL_CODE":"GCTM", "COL_CN":"登机结束", "COL_ORDER":"2"},
|
|
{"COL_CODE":"BOTM", "COL_CN":"登机开始", "COL_ORDER":"3"},
|
|
{"COL_CODE":"ABDG", "COL_CN":"登机桥", "COL_ORDER":"4"},
|
|
{"COL_CODE":"AOTM_D", "COL_CN":"撤桥时间", "COL_ORDER":"5"},
|
|
{"COL_CODE":"AOTM_A", "COL_CN":"靠桥时间", "COL_ORDER":"6"},
|
|
{"COL_CODE":"BELT", "COL_CN":"转盘号", "COL_ORDER":"7"},
|
|
{"COL_CODE":"CHKC", "COL_CN":"值机柜台", "COL_ORDER":"8"},
|
|
{"COL_CODE":"CCTM", "COL_CN":"值机结束", "COL_ORDER":"9"},
|
|
{"COL_CODE":"COTM", "COL_CN":"值机开始", "COL_ORDER":"10"},
|
|
{"COL_CODE":"CHTM_OFF", "COL_CN":"下轮挡", "COL_ORDER":"11"},
|
|
{"COL_CODE":"CHTM_ON", "COL_CN":"上轮挡", "COL_ORDER":"12"},
|
|
{"COL_CODE":"LACL", "COL_CN":"最后通知时间", "COL_ORDER":"13"},
|
|
{"COL_CODE":"CHUT", "COL_CN":"行李传送带", "COL_ORDER":"14"},
|
|
{"COL_CODE":"RENO", "COL_CN":"飞机号", "COL_ORDER":"15"},
|
|
{"COL_CODE":"ALCD", "COL_CN":"航空公司", "COL_ORDER":"16"},
|
|
{"COL_CODE":"ACTT", "COL_CN":"实际到达／出发", "COL_ORDER":"17"},
|
|
{"COL_CODE":"PSST", "COL_CN":"计划机位", "COL_ORDER":"18"},
|
|
{"COL_CODE":"ESTT", "COL_CN":"预计到达／出发 ", "COL_ORDER":"19"},
|
|
{"COL_CODE":"MVIN", "COL_CN":"到达/出发", "COL_ORDER":"20"},
|
|
{"COL_CODE":"ERUT", "COL_CN":"航线", "COL_ORDER":"21"},
|
|
{"COL_CODE":"FLNO", "COL_CN":"航班号", "COL_ORDER":"22"},
|
|
{"COL_CODE":"FTSS", "COL_CN":"运营状态", "COL_ORDER":"23"},
|
|
{"COL_CODE":"FLIN", "COL_CN":"航线类别", "COL_ORDER":"24"},
|
|
{"COL_CODE":"IMPA", "COL_CN":"重要提示", "COL_ORDER":"25"},
|
|
{"COL_CODE":"SODT", "COL_CN":"计划到达／出发", "COL_ORDER":"26"},
|
|
{"COL_CODE":"TRML", "COL_CN":"航站楼", "COL_ORDER":"27"},
|
|
{"COL_CODE":"FLTY", "COL_CN":"航班类别", "COL_ORDER":"28"},
|
|
{"COL_CODE":"GTDT", "COL_CN":"登机门号 ", "COL_ORDER":"29"},
|
|
{"COL_CODE":"PADT", "COL_CN":"前站起飞时间", "COL_ORDER":"30"},
|
|
{"COL_CODE":"CSFT", "COL_CN":"共享航班号", "COL_ORDER":"31"},
|
|
{"COL_CODE":"STND", "COL_CN":"当前机位", "COL_ORDER":"32"},
|
|
]
|
|
/*
|
|
备注：实际数据中，把原始数据录入到临时变量中，方便取消按钮，重置数据
|
|
这里数组复制不能用浅复制sourceList=list;而是要用深度复制，this.sourceList=[...this.list]
|
|
*/
|
|
|
|
this.queryTable();
|
|
}
|
|
//对象数组深度复制
|
|
deepCopy(data){
|
|
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);
|
|
})
|
|
}
|
|
//上下调整项目顺序 type 1上移 2下移 3置顶 4置底 要做头尾判断
|
|
moveUpDown(type){
|
|
let index=this.moveIndex;
|
|
if(type==1){
|
|
this.targetList[index] = this.targetList.splice(index-1, 1, this.targetList[index])[0];
|
|
this.moveIndex--;
|
|
}else if(type==2){
|
|
this.targetList[index] = this.targetList.splice(index+1, 1, this.targetList[index])[0];
|
|
this.moveIndex++;
|
|
}else if(type==3){
|
|
let item=this.targetList[index];
|
|
this.targetList.splice(index,1)
|
|
this.targetList.unshift(item);
|
|
this.moveIndex=0;
|
|
}else if(type==4){
|
|
this.targetList.push(this.targetList[index]);
|
|
this.targetList.splice(index,1);
|
|
this.moveIndex=this.targetList.length-1;
|
|
}
|
|
this.btnStatusContrl();
|
|
|
|
}
|
|
//左右选择项目 type 1右移 2左移 3全部右移 4全部左移
|
|
moveCross(type){
|
|
let index=this.moveIndex;
|
|
if(type==1){
|
|
let item=this.sourceList[index];
|
|
this.sourceList.splice(index,1)
|
|
this.targetList.push(item);
|
|
if(this.sourceList.length==0){
|
|
this.disableRight=true;
|
|
}
|
|
}else if(type==2){
|
|
let item=this.targetList[index];
|
|
this.targetList.splice(index,1)
|
|
this.sourceList.push(item);
|
|
if(this.targetList.length==0){
|
|
this.disabledLeft=true;
|
|
}
|
|
}else if(type==3){
|
|
this.sourceList.forEach(item=>{
|
|
this.targetList.push(item)
|
|
})
|
|
this.sourceList=[];
|
|
}else if(type==4){
|
|
this.targetList.forEach(item=>{
|
|
this.sourceList.push(item)
|
|
})
|
|
this.targetList=[];
|
|
}
|
|
this.moveIndex='false';
|
|
this.selectedType='';
|
|
this.disabledLeft=true;
|
|
this.disableRight=true;
|
|
this.sortBtnDisabled();
|
|
}
|
|
//选中选框中的项 type 1可选框的项 2已选框的项
|
|
selectNode(item,index,type){
|
|
this.selectedType=type;
|
|
this.moveIndex=index;
|
|
if(type==1){
|
|
this.disabledLeft=true;
|
|
this.disableRight=false;
|
|
this.sortBtnDisabled();
|
|
}else if(type==2){
|
|
this.disableRight=true;
|
|
this.disabledLeft=false;
|
|
this.btnStatusContrl();
|
|
}
|
|
|
|
}
|
|
//右侧上下移懂按钮禁用状态控制
|
|
btnStatusContrl(){
|
|
let len=this.targetList.length;
|
|
if(len<2){
|
|
this.disabledUpTop=true;
|
|
this.disableDown=true;
|
|
}
|
|
if(this.moveIndex==0){
|
|
this.disabledUpTop=true;
|
|
this.disableUp=true;
|
|
}else{
|
|
this.disabledUpTop=false
|
|
this.disableUp=false;
|
|
}
|
|
if(this.moveIndex==len-1){
|
|
this.disabledDownBtm=true;
|
|
this.disableDown=true;
|
|
}else{
|
|
this.disabledDownBtm=false;
|
|
this.disableDown=false;
|
|
}
|
|
}
|
|
//排序按钮状态统一控制
|
|
sortBtnDisabled(){
|
|
this.disableDown=true;
|
|
this.disableUp=true;
|
|
this.disabledDownBtm=true;
|
|
this.disabledUpTop=true;
|
|
|
|
}
|
|
//保存-自定义列显示保存
|
|
/*
|
|
各模块groupCode命名定义
|
|
groupCode:'userSettingColor',
|
|
groupCode:'userSettingCol',
|
|
groupCode:'userSettingMsgAlert',
|
|
groupCode:'userSettingMsgVoice',
|
|
groupCode:'userSettingFlyAgency',
|
|
*/
|
|
saveSelf(){
|
|
console.log(this.targetList);
|
|
console.log(this.sourceList);
|
|
this.sourceList.forEach((item,index)=>{
|
|
item.COL_ORDER=index+1
|
|
})
|
|
this.targetList.forEach((item,index)=>{
|
|
item.COL_ORDER=index+1
|
|
})
|
|
let content={
|
|
allCols:this.defaultCols,
|
|
sourceList:this.sourceList,
|
|
targetList:this.targetList,
|
|
}
|
|
let settingContent=JSON.stringify(content);
|
|
let params:any={
|
|
envCode:'web',
|
|
groupCode:'userSettingCol',
|
|
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(`保存失败!`);
|
|
}
|
|
})
|
|
}
|
|
//重置数据
|
|
cancelSelf(){
|
|
this.queryTable();
|
|
}
|
|
//获取列表
|
|
queryTable():void{
|
|
this.statusParamsData.status=1;
|
|
this.list=[];
|
|
this.sourceList=[];
|
|
this.targetList=[];
|
|
this.colsData='';
|
|
this.http.get('/adminapi/settings/uisettings',{groupCode:'userSettingCol'}).subscribe((json)=>{
|
|
if(json.is_success){
|
|
this.statusParamsData.status=3;
|
|
let data=json.body;
|
|
this.colsData=json.body;
|
|
//当data为空是，初始化
|
|
this.listsCope(this.defaultCols,this.list);
|
|
//判断data是否为空，空的时候则为最初的初始化；如果不为空，则有设置过个人设置的某个模块
|
|
if(data&&data.length>0){
|
|
data.forEach(item=>{
|
|
if(item.settingContent){
|
|
console.log(222)
|
|
let content=JSON.parse(item.settingContent);
|
|
this.listsCope(content.sourceList,this.sourceList);
|
|
this.listsCope(content.targetList,this.targetList);
|
|
}else{
|
|
console.log(3333)
|
|
this.listsCope(this.list,this.sourceList);
|
|
}
|
|
})
|
|
}else{
|
|
console.log(5555)
|
|
//接口数据为空，说明各个模块设置都为未初始化,可选项则为默认全部列
|
|
this.listsCope(this.list,this.sourceList);
|
|
}
|
|
}else{
|
|
this.statusParamsData.status=0;
|
|
}
|
|
})
|
|
}
|
|
}
|
|
|