创建运维项目

src/main/webapp/app/app.main.module.ts

@@ -128,6 +128,7 @@ import {ProjectService} from './project-manager/project.service';
 import {CreateCompanyComponent} from './project-manager/modal/create-company/create-company.component';
 import {TrackInfoComponent} from './project-manager/modal/track-info/track-info.component';
 import {CreateProjectComponent} from './project-manager/modal/create-project/create-project.component';
+import {CreateTeamComponent} from './project-manager/modal/create-team/create-team.component';
 
 @NgModule({
     imports: [
@@ -257,6 +258,7 @@ import {CreateProjectComponent} from './project-manager/modal/create-project/cre
         CreateCompanyComponent,
         TrackInfoComponent,
         CreateProjectComponent,
+        CreateTeamComponent,
     ],
     providers: [
         OverAllService,

src/main/webapp/app/app.service.ts

@@ -7,7 +7,15 @@ export class AppService {
     private themeSource:BehaviorSubject<string> = new BehaviorSubject('dark');
     public theme = this.themeSource.asObservable();
 
+    private contentHeightSource:BehaviorSubject<string> = new BehaviorSubject('');
+    public contentHeight = this.contentHeightSource.asObservable();
+
     public setTheme(value: string){
         this.themeSource.next(value);
     }
+
+    public setContentHeight(value: string){
+        console.log(`appser:${value}`);
+        this.contentHeightSource.next(value);
+    }
 }

src/main/webapp/app/layouts/main/main.component.html

@@ -5,7 +5,7 @@
         </nz-sider>
         <nz-layout class="layout-content">
             <jhi-navbar></jhi-navbar>
-            <nz-content>
+            <nz-content #nzContent>
                 <div class="container" #container>
                     <router-outlet></router-outlet>
                 </div>

src/main/webapp/app/layouts/main/main.component.ts

@@ -27,6 +27,7 @@ import {Subscription} from 'rxjs';
 })
 export class JhiMainComponent implements OnInit {
     @ViewChild('container') container:ElementRef;
+    @ViewChild('nzContent') nzContent:ElementRef;
 
     token: boolean;
     theme;
@@ -74,6 +75,11 @@ export class JhiMainComponent implements OnInit {
             this.theme = value;
             console.log(this.theme);
         })
+
+        const contentHeight = this.appSer.contentHeight.subscribe(value => {
+            this.nzContent.nativeElement.style.minHeight = `${value}px`;
+            console.log(`main:${value}`);
+        })
     }
 
     fullScreen(){

src/main/webapp/app/layouts/sidebar/sidebar.component.html

@@ -3,10 +3,10 @@
     </div>
     {{systemName}}
 </div>
-<ul nz-menu [nzMode]="'inline'">
+<ul #slideUL nz-menu [nzMode]="'inline'">
     <ng-container *ngFor="let item of menuList">
         <li nz-submenu (nzOpenChange)="openHandler(item)" [(nzOpen)]="item.checked">
-            <span title><i class="icon iconfont icon-{{item.imageUrl}}"></i>{{item.name}}</span>
+            <span (click)="toggle()" title><i class="icon iconfont icon-{{item.imageUrl}}"></i>{{item.name}}</span>
             <ul>
                 <ng-container *ngFor="let child of item.children" >
                     <li nz-menu-item (click)="goToRoute(child)"><span class="margin-right-10">·</span>{{child.name}}</li>

src/main/webapp/app/layouts/sidebar/sidebar.component.ts

-import {Component, OnInit} from '@angular/core';
+import {Component, ElementRef, OnInit, ViewChild} from '@angular/core';
 import {Router} from '@angular/router';
 import {Http} from '@angular/http';
 import {LayoutService} from '../layout.service';
 import {LocalStorageService, SessionStorageService} from 'ngx-webstorage';
 import {CommonService} from '../../shared/common/common.service';
 import {OverAllService} from '../../overAll/overAll.service';
+import {timer} from 'rxjs/observable/timer';
+import {AppService} from '../../app.service';
 
 @Component({
     selector: 'jhi-sidebar',
@@ -17,6 +19,7 @@ import {OverAllService} from '../../overAll/overAll.service';
     ]
 })
 export class SidebarComponent implements OnInit {
+    @ViewChild('slideUL') slideUL: ElementRef;
     token: boolean;
     menuList = [];
     systemName;
@@ -24,18 +27,18 @@ export class SidebarComponent implements OnInit {
     constructor(public router: Router, private http: Http,
                 public layoutSer: LayoutService,
                 public commonSer: CommonService,
-                private overAll:OverAllService,
+                private overAll: OverAllService,
                 private $localStorage: LocalStorageService,
-                private $sessionStorage: SessionStorageService) {
+                private appSer: AppService) {
     }
 
     ngOnInit() {
         this.getMenu();
         this.overAll.getSystem().subscribe(
-            (res)=>{
+            (res) => {
                 this.systemName = res.main.name;
             }
-        )
+        );
         // this.menuList = this.commonSer.listToTree('id', 'parentId', this.menuList);
     }
 
@@ -50,7 +53,6 @@ export class SidebarComponent implements OnInit {
     }
 
     //简单使用
-
     openHandler(value: string): void {
         for (let key in this.menuList) {
             if (key !== value) {
@@ -59,12 +61,19 @@ export class SidebarComponent implements OnInit {
         }
     }
 
+    toggle() {
+        timer(100).subscribe(e => {
+            console.log(this.slideUL.nativeElement.clientHeight);
+            this.appSer.setContentHeight(this.slideUL.nativeElement.clientHeight);
+        });
+    }
+
     goTo(route) {
         this.router.navigate([route]);
     }
 
-    goToRoute(node){
-        this.$localStorage.store("moduleId",node.id);
-        this.router.navigate(["app/main/"+ node.url]);
+    goToRoute(node) {
+        this.$localStorage.store('moduleId', node.id);
+        this.router.navigate(['app/main/' + node.url]);
     }
 }

src/main/webapp/app/project-manager/modal/create-project/create-project.component.html

@@ -23,9 +23,9 @@
           </nz-form-control>
         </nz-form-item>
         <nz-form-item>
-          <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="principal">甲方名称</nz-form-label>
+          <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="officeName">甲方名称</nz-form-label>
           <nz-form-control [nzSm]="14" [nzXs]="24">
-            <input nz-input formControlName="principal" id="principal">
+            <input nz-input formControlName="officeName" id="officeName">
           </nz-form-control>
         </nz-form-item>
 <!--        <nz-form-item>-->

src/main/webapp/app/project-manager/modal/create-team/create-team.component.html

+<nz-modal [nzWidth]="780" [(nzVisible)]="isVisible" [nzTitle]="title" (nzOnCancel)="handleCancel()"
+          (nzOnOk)="handleOk()" [nzOkLoading]="isOkLoading">
+  <nz-tabset [(nzSelectedIndex)]="tabNum" [nzType]="'card'" (nzSelectedIndexChange)="tabsChange($event)" style="padding-bottom: 25px;min-height: 500px">
+    <nz-tab nzTitle="项目内容">
+      <form [formGroup]="validateForm" nz-form>
+        <nz-form-item>
+          <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="name">团队名称</nz-form-label>
+          <nz-form-control [nzSm]="14" [nzXs]="24">
+            <input nz-input formControlName="name" id="name">
+          </nz-form-control>
+        </nz-form-item>
+        <nz-form-item>
+          <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="companyId">所在公司</nz-form-label>
+          <nz-form-control [nzSm]="14" [nzXs]="24">
+            <input nz-input id="companyId">
+          </nz-form-control>
+        </nz-form-item>
+        <nz-form-item>
+          <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="type">团队类型</nz-form-label>
+          <nz-form-control [nzSm]="14" [nzXs]="24">
+            <nz-select name="type" formControlName="type" id="type" nzPlaceHolder="选择团队类型">
+              <ng-container *ngFor="let item of opr_team_type">
+                <nz-option [nzLabel]="item.value" [nzValue]="item.key"></nz-option>
+              </ng-container>
+            </nz-select>
+          </nz-form-control>
+        </nz-form-item>
+        <nz-form-item>
+          <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="projectId">关联项目</nz-form-label>
+          <nz-form-control [nzSm]="14" [nzXs]="24">
+            <input nz-input id="projectId">
+          </nz-form-control>
+        </nz-form-item>
+        <nz-form-item>
+          <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="principal">团队负责人</nz-form-label>
+          <nz-form-control [nzSm]="14" [nzXs]="24">
+            <input nz-input id="principal">
+          </nz-form-control>
+        </nz-form-item>
+<!--        <nz-form-item>-->
+<!--          <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="principal">团队人数</nz-form-label>-->
+<!--          <nz-form-control [nzSm]="14" [nzXs]="24">-->
+<!--            <input nz-input formControlName="principal" id="principal">-->
+<!--          </nz-form-control>-->
+<!--        </nz-form-item>-->
+        <nz-form-item>
+          <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="description">职责描述</nz-form-label>
+          <nz-form-control [nzSm]="14" [nzXs]="24">
+            <textarea formControlName="description" nz-input rows="2" placeholder="职责描述"></textarea>
+          </nz-form-control>
+        </nz-form-item>
+        <nz-form-item>
+          <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="group">相关附件</nz-form-label>
+          <nz-form-control [nzSm]="14" [nzXs]="24">
+            <nz-upload
+                    [nzBeforeUpload]="beforeUpload"
+                    [(nzFileList)]="fileList">
+              <button nz-button>
+                <i class="anticon anticon-upload"></i><span>上传</span>
+              </button>
+            </nz-upload>
+          </nz-form-control>
+        </nz-form-item>
+      </form>
+    </nz-tab>
+    <nz-tab nzTitle="跟踪信息">
+      <smart-track-info [maintainType]="2"></smart-track-info>
+    </nz-tab>
+  </nz-tabset>
+</nz-modal>

src/main/webapp/app/project-manager/modal/create-team/create-team.component.ts

+import {Component, EventEmitter, OnInit, Output} from '@angular/core';
+import {FormBuilder, FormControl, FormGroup, Validators} from '@angular/forms';
+import {NzMessageService, UploadFile} from 'ng-zorro-antd';
+import {opr_company_type, opr_team_type} from '../../project.constants';
+import {SystemService} from '../../../system/system.service';
+import {ProjectService} from '../../project.service';
+
+@Component({
+    selector: 'smart-create-team',
+    templateUrl: './create-team.component.html',
+    styles: []
+})
+export class CreateTeamComponent implements OnInit {
+    @Output() done = new EventEmitter<any>();
+    tabNum = 0;    //tabs面板的序列号
+
+    title;
+    isVisible = false;
+    isOkLoading = false;
+    validateForm: FormGroup;
+    fileList: UploadFile[] = [];
+    opr_team_type = opr_team_type;
+
+    cID;
+
+    constructor(private fb: FormBuilder, private systemSer: SystemService,
+                private message: NzMessageService, private projectSer: ProjectService) {
+    }
+
+    ngOnInit(): void {
+        this.initForm();
+    }
+
+    initForm() {
+        this.validateForm = this.fb.group({
+            name: [null, [Validators.required, Validators.minLength(2), Validators.maxLength(50)]],
+            type: [1, [Validators.required]],
+            phone: [null],
+            projectId: [null],
+            companyId: [null],
+            description: [null],
+            principal: [null],
+            principalId: [null],
+        });
+    }
+
+    showAddModal(title) {
+        this.isVisible = true;
+        this.title = title;
+    }
+
+    showEditModal(data, title) {
+        this.isVisible = true;
+        this.title = title;
+        this.cID = data.id;
+        console.log(data);
+        this.validateForm.patchValue(data);
+    }
+
+    handleCancel() {
+        this.isVisible = false;
+        this.initForm();
+    }
+
+    beforeUpload = (file: UploadFile): boolean => {
+        const isExcel = file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' || 'application/octet-stream';
+        if (!isExcel) {
+            this.message.error('请上传正确的文件!');
+        } else {
+            this.fileList[0] = file;
+        }
+        return false;
+    };
+
+    handleOk() {
+        for (let i in this.validateForm.controls) {
+            this.validateForm.controls[i].markAsDirty();
+            this.validateForm.controls[i].updateValueAndValidity();
+        }
+        if (this.validateForm.invalid) {
+            return false;
+        }
+        this.isOkLoading = true;
+        if (this.title == '新增运维公司') {
+            this.create();
+        }
+        if (this.title == '编辑运维公司') {
+            this.update();
+        }
+    }
+
+    create() {
+        this.projectSer.addMaintainTeam(this.validateForm.value).subscribe(
+            (res) => {
+                if (res.errCode == 10000) {
+                    this.isVisible = false;
+                    this.initForm();
+                    this.done.emit();
+                    this.message.success('新增运维公司成功');
+                } else {
+                    this.message.error(res.errMsg);
+                }
+                this.isOkLoading = false;
+            }
+        );
+    }
+
+    update() {
+        this.validateForm.addControl('id', new FormControl(this.cID));
+        this.projectSer.updateMaintainTeam(this.validateForm.value).subscribe(
+            (res) => {
+                if (res.errCode == 10000) {
+                    this.isVisible = false;
+                    this.initForm();
+                    this.done.emit();
+                    this.message.success('更新信息成功');
+                } else {
+                    this.message.error(res.errMsg);
+                }
+                this.isOkLoading = false;
+            }
+        );
+    }
+
+    //tabs切换
+    tabsChange(num) {
+        this.tabNum = num;
+    }
+}

src/main/webapp/app/project-manager/opr-company/opr-company.component.html

@@ -35,7 +35,7 @@
   </div>
   <div nz-col nzSpan="2">
     <button (click)="search()"
-            nz-button nzType="default"><i class="anticon anticon-search" style="color: #6097b7"></i>搜索
+            nz-button nzType="default"><i class="anticon anticon-plus-circle-o"></i>搜索
     </button>
   </div>
 </div>

src/main/webapp/app/project-manager/opr-cost/opr-cost.component.html

@@ -30,7 +30,7 @@
   </div>
   <div nz-col nzSpan="2">
     <button (click)="search()"
-            nz-button nzType="default"><i class="anticon anticon-search" style="color: #6097b7"></i>搜索
+            nz-button nzType="default"><i class="anticon anticon-plus-circle-o"></i>搜索
     </button>
   </div>
 </div>

src/main/webapp/app/project-manager/opr-project/opr-project.component.html

@@ -36,7 +36,7 @@
     </div>
     <div nz-col nzSpan="2">
         <button (click)="search()"
-                nz-button nzType="default"><i class="anticon anticon-search" style="color: #6097b7"></i>搜索
+                nz-button nzType="default"><i class="anticon anticon-plus-circle-o"></i>搜索
         </button>
     </div>
 </div>

src/main/webapp/app/project-manager/opr-team/opr-team.component.html

 <div nz-row class="breadcrumbs">
-  <div nz-col nzSpan="16">
-    <nz-breadcrumb class="padding-8-0">
-      <nz-breadcrumb-item>
-        首页
-      </nz-breadcrumb-item>
-      <nz-breadcrumb-item>
-        <a>项目管理</a>
-      </nz-breadcrumb-item>
-      <nz-breadcrumb-item>
-        运维团队
-      </nz-breadcrumb-item>
-    </nz-breadcrumb>
-  </div>
-  <div nz-col nzSpan="8" class="text-right">
-    <button (click)="ngOnInit()" nz-button nzType="primary"><i class="anticon anticon-sync"></i></button>
-    <smart-full-screen></smart-full-screen>
-  </div>
+    <div nz-col nzSpan="16">
+        <nz-breadcrumb class="padding-8-0">
+            <nz-breadcrumb-item>
+                首页
+            </nz-breadcrumb-item>
+            <nz-breadcrumb-item>
+                <a>项目管理</a>
+            </nz-breadcrumb-item>
+            <nz-breadcrumb-item>
+                运维团队
+            </nz-breadcrumb-item>
+        </nz-breadcrumb>
+    </div>
+    <div nz-col nzSpan="8" class="text-right">
+        <button (click)="ngOnInit()" nz-button nzType="primary"><i class="anticon anticon-sync"></i></button>
+        <smart-full-screen></smart-full-screen>
+    </div>
 </div>
 <div nz-row [nzGutter]="4" class="search-form">
-  <div nz-col nzSpan="14">
-    类型:
-    <nz-radio-group [(ngModel)]="obj.type">
-      <label *ngFor="let item of teamType" (click)="search()" nz-radio-button
-             [nzValue]="item.key">{{item.value}}</label>
-    </nz-radio-group>
-  </div>
-  <div nz-col nzSpan="3">
-    <button (click)="search()"
-            nz-button nzType="default"><i class="anticon anticon-search" style="color: #6097b7"></i>新增运维团队
-    </button>
-  </div>
-  <div nz-col nzSpan="5">
-    <input type="text" (keyup.enter)="search()" nz-input [(ngModel)]="obj.name" placeholder="团队名称">
-  </div>
-  <div nz-col nzSpan="2">
-    <button (click)="search()"
-            nz-button nzType="default"><i class="anticon anticon-search" style="color: #6097b7"></i>搜索
-    </button>
-  </div>
+    <div nz-col nzSpan="14">
+        类型:
+        <nz-radio-group [(ngModel)]="obj.type">
+            <label *ngFor="let item of teamType" (click)="search()" nz-radio-button
+                   [nzValue]="item.key">{{item.value}}</label>
+        </nz-radio-group>
+    </div>
+    <div nz-col nzSpan="3">
+        <button (click)="search()"
+                nz-button nzType="default"><i class="anticon anticon-search" style="color: #6097b7"></i>新增运维团队
+        </button>
+    </div>
+    <div nz-col nzSpan="5">
+        <input type="text" (keyup.enter)="search()" nz-input [(ngModel)]="obj.name" placeholder="团队名称">
+    </div>
+    <div nz-col nzSpan="2">
+        <button (click)="search()"
+                nz-button nzType="default"><i class="anticon anticon-plus-circle-o"></i>搜索
+        </button>
+    </div>
 </div>
 <nz-table #nzTable [nzData]="page.list" [nzLoading]="page.isLoading" [nzFrontPagination]="false"
           [nzTotal]="page.totalNum"
           [nzPageIndex]="page.pageNum" [nzPageSize]="page.pageCount" (nzPageIndexChange)="change($event)">
-  <thead>
-  <tr>
-    <th>团队名称</th>
-    <th>团队类型</th>
-    <th>所在公司</th>
-    <th>关联项目</th>
-    <th>团队负责人</th>
-    <th>操作</th>
-  </tr>
-  </thead>
-  <tbody>
-  <tr *ngFor="let data of nzTable.data">
-    <td>{{data.name}}</td>
-    <td>
-      <span *ngIf="data.type == 0">驻场团队</span>
-      <span *ngIf="data.type == 1">非驻场团队</span>
-    </td>
-    <td>{{data.companyName}}</td>
-    <td>{{data.projectName}}</td>
-    <td>{{data.principal}}</td>
-    <td class="handle text-center main-color">
-      <span>编辑</span>
-    </td>
-  </tr>
-  </tbody>
+    <thead>
+    <tr>
+        <th>团队名称</th>
+        <th>团队类型</th>
+        <th>所在公司</th>
+        <th>关联项目</th>
+        <th>团队负责人</th>
+        <th>操作</th>
+    </tr>
+    </thead>
+    <tbody>
+    <tr *ngFor="let data of nzTable.data">
+        <td>{{data.name}}</td>
+        <td>
+            <span *ngIf="data.type == 0">驻场团队</span>
+            <span *ngIf="data.type == 1">非驻场团队</span>
+        </td>
+        <td>{{data.companyName}}</td>
+        <td>{{data.projectName}}</td>
+        <td>{{data.principal}}</td>
+        <td class="handle text-center main-color">
+            <span>编辑</span>
+        </td>
+    </tr>
+    </tbody>
 </nz-table>

src/main/webapp/content/css/documentation.css

@@ -3,7 +3,7 @@
  */
 
 .layout {
-    height: 100%;
+    height: calc(100% + 20px);
 }
 
 .layout .ant-menu-inline, .ant-menu-vertical, .ant-menu-vertical-left {

src/main/webapp/content/scss/darkBlue.scss

@@ -44,7 +44,7 @@ $fontColor: #b2d4f9;
   }
 
   .container {
-    height: 100%;
+    height: calc(100% + 50px);
     padding: 0 16px;
     background-image: url("../../content/images/dark-bg-img.png");
     background-size: cover;