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-11-29 18:08:54 +08:00
parent a1ffdb02c8
commit d5c42bebba
17 changed files with 306 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/pages/system-management/department-management/department-management.component.html
+77 -3
View File
@@ -1,3 +1,77 @@
<p>
department-management works!
</p>
<div class="system-main-container">
<div class="org-manage">
<div class="tree-box">
<app-request-status [statusParams]='statusParamsTree'></app-request-status>
<ul [hidden]='statusParamsTree.status!=3' id="treeDemo" class="ztree"></ul>
</div>
<div class="main-content card">
<div class="operation-box">
<button (click)="addModify(1)" nz-button nzType="primary"><i nz-icon type="plus" theme="outline"></i>新增</button>
<button *ngIf="canEdit" (click)="addModify(2)" nz-button nzType="default"><i nz-icon type="edit" theme="outline"></i>修改</button>
<button *ngIf="canDel" (click)="delete" nz-button nzType="danger"><i nz-icon type="delete" theme="outline"></i>删除</button>
</div>
<nz-skeleton [nzActive]="true" [nzParagraph]="{ rows: 16 }" *ngIf='modifyType==3&&!orgDetail'></nz-skeleton>
<form class="org-detail" *ngIf="modifyType==3&&orgDetail" nz-form [nzLayout]="'inline'">
<div nz-row nzGutter="24">
<div nz-col nzSpan="24">
<nz-form-item>
<nz-form-label>机构名称</nz-form-label>
<span class="detail-item-text">{{orgDetail.name|null}}</span>
</nz-form-item>
</div>
<div nz-col nzSpan="24">
<nz-form-item>
<nz-form-label>机构简称</nz-form-label>
<span class="detail-item-text">{{orgDetail.shortName|null}}</span>
</nz-form-item>
</div>
<div nz-col nzSpan="24">
<nz-form-item>
<nz-form-label>机构编码</nz-form-label>
<span class="detail-item-text">{{orgDetail.code|null}}</span>
</nz-form-item>
</div>
<div nz-col nzSpan="24">
<nz-form-item>
<nz-form-label>联系人</nz-form-label>
<span class="detail-item-text">{{orgDetail.contact_person|null}}</span>
</nz-form-item>
</div>
<div nz-col nzSpan="24">
<nz-form-item>
<nz-form-label>联系方式</nz-form-label>
<span class="detail-item-text">{{orgDetail.contact_method|null}}</span>
</nz-form-item>
</div>
<div nz-col nzSpan="24">
<nz-form-item>
<nz-form-label>机构地址</nz-form-label>
<span class="detail-item-text">{{orgDetail.address|null}}</span>
</nz-form-item>
</div>
<div nz-col nzSpan="24">
<nz-form-item>
<nz-form-label>机构类型</nz-form-label>
<span *ngIf='organization_type==1' class="detail-item-text">机构</span>
<span *ngIf='organization_type==2' class="detail-item-text">部门</span>
<span *ngIf='!organization_type' class="detail-item-text">无</span>
</nz-form-item>
</div>
<div nz-col nzSpan="24">
<nz-form-item>
<nz-form-label>上级机构</nz-form-label>
<span class="detail-item-text">{{parentName|null}}</span>
</nz-form-item>
</div>
<div nz-col nzSpan="24">
<nz-form-item>
<nz-form-label>LOGO</nz-form-label>
<span *ngIf='!orgDetail.logo'>无</span>
<img *ngIf='orgDetail.logo' class="org-detail-logo" [src]="orgDetail.logo" alt="">
</nz-form-item>
</div>
</div>
</form>
</div>
</div>
</div>
src/app/pages/system-management/department-management/department-management.component.scss
+21
View File
@@ -0,0 +1,21 @@
@import "../../main.scss";
.system-main-container{
.org-manage{
.main-content{
overflow-y:scroll;
.operation-box{
border-bottom: 1px solid #e8e8e8;
padding-bottom: 20px;
button{
margin-right: 10px;
}
}
.org-detail-logo{
width: 40px;
}
}
.tree-box{
overflow-y:scroll;
}
}
}
src/app/pages/system-management/department-management/department-management.component.ts
+122 -3
View File
@@ -1,4 +1,11 @@
import { Component, OnInit } from '@angular/core';
import { HttpClientService } from '../../../services/http-client.service';
import { Router } from '@angular/router';
import { NzMessageService } from 'ng-zorro-antd';
import 'ztree';
declare var $: any;
declare var jQuery: any
@Component({
selector: 'app-department-management',
@@ -6,10 +13,122 @@ import { Component, OnInit } from '@angular/core';
styleUrls: ['./department-management.component.scss']
})
export class DepartmentManagementComponent implements OnInit {
treeSelected:any; //树模型-当前选中项
statusParamsTree:any={ //获取机构接口的状态，0请求失败 1请求前 2请求中 3请求成功，有数据 4请求成功，无数据
status:1,
}
public canDel:any=false;
public canEdit:any=false;
public search:any={
orgId:'',
}
public orgDetail:any='';
public modifyType:any='3'; //操作状态 1新增 2修改 3详情
constructor() { }
constructor(
private http:HttpClientService,
private router:Router,
private message: NzMessageService,
) { }
ngOnInit() {
}
ngOnInit() {
$('.tree-box').css('height',(document.documentElement.clientHeight-106+'px'));
$('.main-content').css('height',(document.documentElement.clientHeight-106+'px'));
$(window).resize(function(){
$('.tree-box').css('height',(document.documentElement.clientHeight-106+'px'));
$('.main-content').css('height',(document.documentElement.clientHeight-106+'px'));
})
this.initTree();
}
//新增、修改
addModify(type){
this.modifyType=type;
}
//获取机构详情
queryDetail(){
}
//获取机构列表，树模型数据处理
initTree(){
//获取目录列表
this.statusParamsTree.status=1;
this.http.get("/sysapi/setting/organization/list",).subscribe(json=>{
if(json.is_success){
if(json.body.length>0){
this.statusParamsTree.status=3;
let children=[];
json.body.forEach(option=>{
option.name=option.organization;
if(option.pid){
option.pId=option.pid;
}else{
option.pId='hsfuhiw34239j89sauf98992h3indshv98h392hf9mplsd032fs2a2313fc';
}
});
json.body.push({
name:"全部机构",
isParent:true,
open:true,
id:'hsfuhiw34239j89sauf98992h3indshv98h392hf9mplsd032fs2a2313fc',
})
}else{
//数据为空
this.statusParamsTree.status=4;
}
}else{
//请求失败
this.statusParamsTree.status=0;
}
this.zNodes=json.body;
$.fn.zTree.init($("#treeDemo"), this.setting, this.zNodes);
var zTree = $.fn.zTree.getZTreeObj("treeDemo");
let node = zTree.getNodes();
if(json.body.length>0){
zTree.selectNode(node[0].children[0])
zTree.setting.callback.onClick(null,zTree.setting.treeId,node[0].children[0])
}
})
}
//树模型参数设置
public zNodes: any[];
setting = {
data: {
simpleData: {
enable: true
}
},
view: {
showLine: true,
dblClickExpand: false,
showIcon:true
},
callback: {
//节点点击事件
onClick: (event, treeId, treeNode, clickFlag) => {
this.modifyType=3;
var zTree = $.fn.zTree.getZTreeObj("treeDemo");
this.treeSelected=treeNode;
let isTopNode=this.treeSelected.getParentNode(); //是否为顶级节点 true不是顶级节点 false 为顶级节点
console.log(isTopNode)
if(isTopNode){ //子节点
this.orgDetail=treeNode;
this.canDel=true;
this.canEdit=true;
if(isTopNode.pId=='hsfuhiw34239j89sauf98992h3indshv98h392hf9mplsd032fs2a2313fc'){
//除去全部机构这层的第一层 也就是实际意义的顶层
}else{
}
}else{ //顶级节点
this.orgDetail='';
this.canDel=false;
this.canEdit=false;
}
this.queryDetail();
},
},
};
}