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/components/components.module.ts
+3 -1
View File
@@ -6,7 +6,7 @@ import { ToastModule } from './toast/toast.module'; //消息提示
import { SidebarMenuModule } from './sidebar-menu/sidebar-menu.module';
import { RequestStatusComponent } from './request-status/request-status.component';
import { NgZorroAntdModule, NZ_I18N, zh_CN } from 'ng-zorro-antd';
import { NoValue } from './pipe/no-value.component';
import { registerLocaleData } from '@angular/common';
import zh from '@angular/common/locales/zh';
registerLocaleData(zh);
@@ -21,6 +21,7 @@ registerLocaleData(zh);
],
declarations: [
RequestStatusComponent,
NoValue
],
providers : [ { provide: NZ_I18N, useValue: zh_CN } ],
exports: [
@@ -28,6 +29,7 @@ registerLocaleData(zh);
ToastModule,
SidebarMenuModule,
RequestStatusComponent,
NoValue,
]
})
export class ComponentsModule { }
src/app/components/pipe/no-value.component.ts
+13
View File
@@ -0,0 +1,13 @@
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({name: 'null'})
export class NoValue implements PipeTransform {
transform(value: any, exponent: any): any {
console.log(value)
if(value){
return value
}else{
return '无'
}
}
src/app/pages/main.scss
+8 -6
View File
@@ -8,7 +8,12 @@
.orange{
color: orange;
}
.left{
float: left;
}
.right{
float: right;
}
.system-main-container {
position: relative;
padding: 20px 20px;
@@ -16,13 +21,11 @@
height: 100%;
min-height: 300px;
background-color: #f0f0f0;
overflow-y: scroll;
.system-main-content{
height: 100%;
min-height: 600px;
.search-box{
}
}
.table-box{
}
@@ -39,8 +42,7 @@
.tree-box{
position: relative;
min-width: 300px;
min-height: 600px;
margin-right: 10px;
margin-right: 20px;
float: left;
padding: 20px;
height: 100%;
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();
},
},
};
}
src/app/pages/system-management/personal-settings/color-settings/color-settings.component.html
+2 -2
View File
@@ -5,7 +5,7 @@
<button (click)="resetBgColor(item)" nz-button nzType="default"><i nz-icon type="reload" theme="outline"></i>恢复默认值</button>
</div>
<div class="color-picker-box">
<button (click)='save()' nzTitle="保存设置" nzPlacement="top" nz-tooltip nz-button nzSize="large" nzType="primary"><i class="fa fa-check" aria-hidden="true"></i> 确定</button>
<button (click)='cancel()' nzTitle="取消设置" nzPlacement="top" nz-tooltip nz-button nzSize="large" nzType="default"><i class="fa fa-times" aria-hidden="true"></i> 取消</button>
<button (click)='save()' nzTitle="保存设置" nzPlacement="top" nz-tooltip nz-button nzType="primary"><i class="fa fa-check" aria-hidden="true"></i> 确定</button>
<button (click)='cancel()' nzTitle="取消设置" nzPlacement="top" nz-tooltip nz-button nzType="default"><i class="fa fa-times" aria-hidden="true"></i> 取消</button>
</div>
</div>
src/app/pages/system-management/personal-settings/color-settings/color-settings.component.scss
+2 -5
View File
@@ -17,11 +17,8 @@
}
}
.color-picker-box{
display: inline-block;
position: relative;
top: 40px;
left: 50%;
transform:translate(-50%,0);
margin-top: 40px;
text-align: center;
button:first-child{
margin-right: 20px;
}
src/app/pages/system-management/personal-settings/flight-agency/flight-agency.component.html
+2 -2
View File
@@ -9,7 +9,7 @@
</nz-radio-group>
</div>
<div class="self-row-footer">
<button (click)='save()' nzTitle="保存配置" nzPlacement="top" nz-tooltip nz-button nzSize="large" nzType="primary"><i class="fa fa-check" aria-hidden="true"></i> 确定</button>
<button (click)='cancel()' nzTitle="取消配置" nzPlacement="top" nz-tooltip nz-button nzSize="large" nzType="default"><i class="fa fa-times" aria-hidden="true"></i> 取消</button>
<button (click)='save()' nzTitle="保存配置" nzPlacement="top" nz-tooltip nz-button nzType="primary"><i class="fa fa-check" aria-hidden="true"></i> 确定</button>
<button (click)='cancel()' nzTitle="取消配置" nzPlacement="top" nz-tooltip nz-button nzType="default"><i class="fa fa-times" aria-hidden="true"></i> 取消</button>
</div>
</div>
src/app/pages/system-management/personal-settings/msg-alert-warning/msg-alert-warning.component.html
+2 -2
View File
@@ -28,8 +28,8 @@
</div>
</div>
<div class="self-row-footer">
<button (click)='saveSelf()' nzTitle="保存配置" nzPlacement="top" nz-tooltip nz-button nzSize="large" nzType="primary"><i class="fa fa-check" aria-hidden="true"></i> 确定</button>
<button (click)='cancelSelf()' nzTitle="取消配置" nzPlacement="top" nz-tooltip nz-button nzSize="large" nzType="default"><i class="fa fa-times" aria-hidden="true"></i> 取消</button>
<button (click)='saveSelf()' nzTitle="保存配置" nzPlacement="top" nz-tooltip nz-button nzType="primary"><i class="fa fa-check" aria-hidden="true"></i> 确定</button>
<button (click)='cancelSelf()' nzTitle="取消配置" nzPlacement="top" nz-tooltip nz-button nzType="default"><i class="fa fa-times" aria-hidden="true"></i> 取消</button>
</div>
</div>
</div>
src/app/pages/system-management/personal-settings/personal-settings.component.html
+2 -2
View File
@@ -37,8 +37,8 @@
</div>
</div>
<div class="self-row-footer">
<button (click)='saveSelf()' nzTitle="保存配置" nzPlacement="top" nz-tooltip nz-button nzSize="large" nzType="primary"><i class="fa fa-check" aria-hidden="true"></i> 确定</button>
<button (click)='cancelSelf()' nzTitle="取消配置" nzPlacement="top" nz-tooltip nz-button nzSize="large" nzType="default"><i class="fa fa-times" aria-hidden="true"></i> 取消</button>
<button (click)='saveSelf()' nzTitle="保存配置" nzPlacement="top" nz-tooltip nz-button nzType="primary"><i class="fa fa-check" aria-hidden="true"></i> 确定</button>
<button (click)='cancelSelf()' nzTitle="取消配置" nzPlacement="top" nz-tooltip nz-button nzType="default"><i class="fa fa-times" aria-hidden="true"></i> 取消</button>
</div>
</div>
</nz-tab>
src/app/pages/system-management/user-management/user-management-modify/user-management-modify.component.html
+2 -2
View File
@@ -1,5 +1,5 @@
<div class="system-main-container">
<div class="user-modify-box card">
<div class="user-modify-box card" id="main-container">
<app-request-status *ngIf="modifyType==2" [statusParams]='statusParamsDetail'></app-request-status>
<nz-skeleton [nzActive]="true" [nzParagraph]="{ rows: 16 }" *ngIf='modifyType==2&&statusParamsDetail.status==1'></nz-skeleton>
<form nz-form [formGroup]="validateForm" *ngIf="statusParamsDetail.status==3">
@@ -91,7 +91,7 @@
</nz-form-item>
</form>
<div class="user-footer">
<button (click)='submitForm()' nz-button nzType="primary" class="mr10" [disabled]='!this.validateForm.valid||!this.orgDetail||this.roleList.length<=0||!this.nameOnly'>保存</button>
<button (click)='submitForm()' [nzLoading]="isLoadingSave" nz-button nzType="primary" class="mr10" [disabled]='!this.validateForm.valid||!this.orgDetail||this.roleList.length<=0||!this.nameOnly'>保存</button>
<button (click)='cancel()' nz-button nzType="default">取消</button>
</div>
</div>
src/app/pages/system-management/user-management/user-management-modify/user-management-modify.component.scss
+11 -6
View File
@@ -1,11 +1,10 @@
.user-modify-box{
position: relative;
overflow-y:scroll;
.user-footer{
display: inline-block;
position: absolute;
bottom: 30px;
left: 50%;
transform: translate(-50%,0)
text-align: center;
margin-top: -20px;
}
}
.ztree{
@@ -23,4 +22,10 @@
position: relative;
width: 120px;
height: 40px;
}
}
//火狐浏览器单独设置样式 解决在火狐浏览器下 底部padding-bottom无效问题
@-moz-document url-prefix(){
.user-footer{
padding-bottom: 20px;
}
}
src/app/pages/system-management/user-management/user-management-modify/user-management-modify.component.ts
+9 -1
View File
@@ -3,6 +3,7 @@ import { FormBuilder,FormControl,FormGroup,Validators} from '@angular/forms';
import { HttpClientService } from '../../../../services/http-client.service';
import { Router,ActivatedRoute } from '@angular/router';
import { NzMessageService } from 'ng-zorro-antd';
import { Observable } from 'rxjs';
import 'ztree';
declare var $: any;
@@ -39,6 +40,7 @@ export class UserManagementModifyComponent implements OnInit {
statusParamsDetail:any={ //获取用户详情接口的状态，0请求失败 1请求前 2请求中 3请求成功，有数据 4请求成功，无数据
status:1,
}
isLoadingSave:any=false;
constructor(
private fb: FormBuilder,
private http:HttpClientService,
@@ -48,6 +50,8 @@ export class UserManagementModifyComponent implements OnInit {
) { }
ngOnInit() {
// // 页面监听 动态改变表单高度
// $('#main-container').height('height',(document.documentElement.clientHeight-106+'px'));
this.queryRole();
this.validateForm = this.fb.group({
real_name:[ '', [ Validators.required ] ],
@@ -197,6 +201,7 @@ export class UserManagementModifyComponent implements OnInit {
return false;
}
this.checkNameStatus='validating';
//再次验证用户名唯一性
this.http.get('/sysapi/setting/user/isOnly', { loginName: this.validateForm.value.login_name.trim() }).subscribe((json) => {
if (json.is_success) {
if(json.body){
@@ -215,7 +220,7 @@ export class UserManagementModifyComponent implements OnInit {
})
}
}
//确认提交表单
//确认提交表单 type 1 新增 2修改
submitConfirm(type){
let item=this.validateForm.value;
let params={
@@ -242,8 +247,10 @@ export class UserManagementModifyComponent implements OnInit {
}
})
console.log(params)
this.isLoadingSave=true;
if(type==1){
this.http.post('/sysapi/setting/user/add', params).subscribe((json) => {
this.isLoadingSave=false;
if (json.is_success) {
this.message.success(`新增成功`);
this.router.navigate(['app/system/users'])
@@ -253,6 +260,7 @@ export class UserManagementModifyComponent implements OnInit {
})
}else if(type==2){
this.http.put('/sysapi/setting/user/updateById/'+this.userId, params).subscribe((json) => {
this.isLoadingSave=false;
if (json.is_success) {
this.message.success(`修改成功`);
this.router.navigate(['app/system/users'])
src/app/pages/system-management/user-management/user-management.component.html
+3 -10
View File
@@ -1,15 +1,15 @@
<div class="system-main-container">
<div class="user-manage">
<div class="tree-box">
<div class="tree-box" id="tree-box">
<app-request-status [statusParams]='statusParamsTree'></app-request-status>
<ul [hidden]='statusParamsTree.status!=3' id="treeDemo" class="ztree"></ul>
</div>
<div class="system-main-content card">
<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 nzSpan="6">姓名</nz-form-label>
<nz-form-label class="left">姓名</nz-form-label>
<nz-form-control nzSpan="17">
<input nz-input [(ngModel)]='search.real_name' placeholder="请输入姓名">
</nz-form-control>
@@ -42,9 +42,7 @@
<thead>
<tr>
<th>姓名</th>
<th>性别</th>
<th>用户名</th>
<th>邮箱</th>
<th>电话</th>
<th>操作</th>
</tr>
@@ -52,12 +50,7 @@
<tbody>
<tr *ngFor="let item of dataSet.data">
<td><a (click)='open(item)' href="javascript:;">{{item.real_name}}</a></td>
<td>
<span *ngIf="item.sex=='m'">男</span>
<span *ngIf="item.sex=='f'">女</span>
</td>
<td>{{item.login_name}}</td>
<td>{{item.email}}</td>
<td>{{item.mobile}}</td>
<td>
<i (click)="addModify(2,item)" class="table-operation-btn edit" nz-icon type="edit" theme="outline"></i>
src/app/pages/system-management/user-management/user-management.component.scss
+16 -6
View File
@@ -1,10 +1,20 @@
.user-manage{
.card{
}
}
@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/user-management/user-management.component.ts
+11 -6
View File
@@ -4,13 +4,13 @@ import { Router } from '@angular/router';
import { NzMessageService } from 'ng-zorro-antd';
import 'ztree';
declare var $: any;
declare var $: any;
declare var jQuery: any;
@Component({
selector: 'app-user-management',
templateUrl: './user-management.component.html',
styleUrls: ['./user-management.component.scss','../../main.scss']
styleUrls: ['./user-management.component.scss',]
})
export class UserManagementComponent implements OnInit {
treeSelected:any; //树模型-当前选中项
@@ -43,6 +43,13 @@ export class UserManagementComponent implements OnInit {
) { }
ngOnInit() {
// 页面监听 动态改变表单高度
$('#tree-box').css('height',(document.documentElement.clientHeight-106+'px'));
$('#main-box').css('height',(document.documentElement.clientHeight-106+'px'));
$(window).resize(function(){
$('#tree-box').css('height',(document.documentElement.clientHeight-106+'px'));
$('#main-box').css('height',(document.documentElement.clientHeight-106+'px'));
})
this.initTree();
this.queryTable();
}
@@ -158,16 +165,14 @@ export class UserManagementComponent implements OnInit {
if(json.body.length>0){
this.statusParamsTree.status=3;
let children=[];
for(var i=0;i<json.body.length;i++){
let option=json.body[i];
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,