运维公司

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

-<p>
-  opr-company works!
-</p>
+<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>
+<div nz-row [nzGutter]="4" class="search-form">
+  <div nz-col nzSpan="14">
+    类型:
+    <nz-radio-group [(ngModel)]="obj.status">
+      <label *ngFor="let item of companyType" (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.keyword" 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-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>{{data.principal}}</td>
+    <td>
+      <span *ngIf="data.type == 0">中心驻场</span>
+      <span *ngIf="data.type == 1">中心运维</span>
+      <span *ngIf="data.type == 2">外单位驻场</span>
+      <span *ngIf="data.type == 3">外单位运维</span>
+    </td>
+    <td>{{data.projectNum}}</td>
+    <td>{{data.totalAmount}}</td>
+    <td>{{data.companyName}}</td>
+    <td class="handle text-center main-color">
+      <span>编辑</span>
+      <span>查看</span>
+    </td>
+  </tr>
+  </tbody>
+</nz-table>

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

-import { Component, OnInit } from '@angular/core';
+import {Component, OnInit} from '@angular/core';
+import {opr_company_type, project_status} from '../project.constants';
+import {pageSize} from '../../app.constants';
+import {WorkService} from '../../work/work.service';
+import {NzMessageService} from 'ng-zorro-antd';
+import {ProjectService} from '../project.service';
+import {Router} from '@angular/router';
+import {CommonService} from '../../shared/common/common.service';
+import {DatePipe} from '@angular/common';
 
 @Component({
     selector: 'app-opr-company',
@@ -7,9 +15,60 @@ import { Component, OnInit } from '@angular/core';
 })
 export class OprCompanyComponent implements OnInit {
 
-  constructor() { }
+    timeFormat = 'yyyy';
+
+    companyType = opr_company_type;
+
+    page = {
+        list: [],
+        isLoading: false,
+        pageCount: pageSize,
+        pageNum: 1,
+        totalNum: null
+    };
+
+    obj = {
+        name: '',
+        type: null
+    };
+
+    constructor(private workSer: WorkService, private message: NzMessageService, private projectSer: ProjectService,
+                private router: Router, private commonSer: CommonService, private datePipe: DatePipe) {
+    }
 
     ngOnInit() {
+        this.getList();
+    }
+
+    //获取列表
+    getList() {
+        this.page.isLoading = true;
+        const obj = {
+            obj: this.obj,
+            pageNum: this.page.pageNum,
+            pageCount: this.page.pageCount
+        };
+        this.projectSer.selectMaintainCompany(obj).subscribe(
+            (res) => {
+                if (res.errCode == 10000) {
+                    this.page.list = res.data.data;
+                    this.page.totalNum = res.data.totalNum;
+                    this.page.isLoading = false;
+                }
+            }
+        );
+    }
+
+    //翻页
+    change(e) {
+        this.page.pageNum = e;
+        this.getList();
+    }
+
+    //搜索
+    search() {
+        this.page.pageNum = 1;
+        this.getList();
     }
 
 }

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

@@ -18,9 +18,13 @@
     </div>
 </div>
 <div nz-row [nzGutter]="4" class="search-form">
-    <div nz-col nzSpan="3">
+    <div nz-col nzSpan="8">
+        <nz-date-picker
+                [nzFormat]="timeFormat"
+                [(ngModel)]="obj.yearly"
+                nzPlaceHolder="项目年度"></nz-date-picker>
     </div>
-    <div nz-col nzSpan="5">
+    <div nz-col nzSpan="6">
         <nz-select nzAllowClear style="width: 100%;" [(ngModel)]="obj.companyName" nzPlaceHolder="项目单位">
             <ng-container *ngFor="let item of statusList">
                 <nz-option [nzLabel]="item.key" [nzValue]="item.value"></nz-option>
@@ -28,13 +32,7 @@
         </nz-select>
     </div>
     <div nz-col nzSpan="8">
-        <nz-date-picker
-                [nzFormat]="timeFormat"
-                [(ngModel)]="obj.yearly"
-                nzPlaceHolder="项目年度"></nz-date-picker>
-    </div>
-    <div nz-col nzSpan="4">
-        <input type="text" nz-input [(ngModel)]="obj.keyword" placeholder="项目名称、甲方名称、乙方名称、甲方负责人">
+        <input type="text" (keyup.enter)="search()" nz-input [(ngModel)]="obj.keyword" placeholder="项目名称、甲方名称、乙方名称、甲方负责人">
     </div>
     <div nz-col nzSpan="2">
         <button (click)="search()"
@@ -42,15 +40,22 @@
         </button>
     </div>
 </div>
-<div nz-row [nzGutter]="4" class="search-form">
-    <div nz-col nzSpan="5">
+<div nz-row [nzGutter]="4" class="padding-15-0">
+    <div nz-col nzSpan="18">
         项目状态:
+        <nz-radio-group [(ngModel)]="obj.status">
+            <label *ngFor="let item of statusList" (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="2">
+    <div nz-col nzSpan="3">
         <button (click)="search()"
-                nz-button nzType="default"><i class="anticon anticon-search" style="color: #6097b7"></i>导出
+                nz-button nzType="default"><i class="anticon anticon-folder"></i>导出
         </button>
     </div>
 </div>

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

@@ -20,7 +20,7 @@ export class OprProjectComponent implements OnInit {
 
     timeFormat = 'yyyy';
 
-    statusList = [{key: '全部', value: null}, project_status];
+    statusList = [{key: '全部', value: null}, ...project_status];
 
     page = {
         list: [],
@@ -33,7 +33,7 @@ export class OprProjectComponent implements OnInit {
     obj = {
         yearly: null,
         officeName: null,
-        status: '',
+        status: null,
         companyName: null,
         keyword: ''
     };
@@ -71,44 +71,6 @@ export class OprProjectComponent implements OnInit {
         this.getList();
     }
 
-    //查看详情
-    lookEvent(item) {
-        this.router.navigate(['app/main/handleDetail'], {
-            queryParams: {
-                eventId: item.id
-            }
-        });
-    }
-
-    //处理事件
-    goToHandle(item) {
-        this.router.navigate(['app/main/handleEvent'], {
-            queryParams: {
-                eventId: item.id
-            }
-        });
-    }
-
-    //删除事件
-    deleteHandle(data) {
-        const arr = {
-            ids: []
-        };
-        arr.ids.push(data.id);
-        this.commonSer.confirmThing('删除', '确定删除该事件', () => {
-            this.workSer.deleteEvent(arr).subscribe(
-                (res) => {
-                    if (res.errCode == 10000) {
-                        this.message.success('删除成功');
-                        this.getList();
-                    } else {
-                        this.message.error(res.errMsg);
-                    }
-                }
-            );
-        });
-    }
-
     //搜索
     search() {
         this.page.pageNum = 1;

src/main/webapp/app/project-manager/project.constants.ts

 //项目状态
 export const project_status = [
-    {key: '待启动', value: 2},
-    {key: '执行中', value: 0},
-    {key: '已完成', value: 1},
+    {key: null, value: '全部'},
+    {key: '2', value: '待启动'},
+    {key: '0', value: '执行中'},
+    {key: '1', value: '已完成'},
 ];
 
 //运维公司类型
 export const opr_company_type = [
+    {key: null, value: '全部'},
     {key: '0', value: '中心驻场'},
     {key: '1', value: '中心运维'},
     {key: '2', value: '外单位驻场'},
@@ -15,12 +17,14 @@ export const opr_company_type = [
 
 //运维团队
 export const opr_team_type = [
+    {key: null, value: '全部'},
     {key: '0', value: '驻场团队'},
     {key: '1', value: '非驻场团队'},
 ];
 
 //费用类型
 export const opr_cost_type = [
+    {key: null, value: '全部'},
     {key: '0', value: '备件采购'},
     {key: '1', value: '委外费用'},
     {key: '2', value: '其他类型'},

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

@@ -24,13 +24,13 @@ $fontColor: #b2d4f9;
   input[type="text"], input[type="password"], .input[type="number"], textarea, .ant-select {
     color: $fontColor;
   }
+
   .ant-table-placeholder {
     background: #2966a5;
     border-bottom: 1px solid $fontColor;
     color: $fontColor;
   }
 
-
   .gray-font-color {
     color: $fontColor;
   }
@@ -66,11 +66,15 @@ $fontColor: #b2d4f9;
   }
 
   input[type="text"], input[type="password"], input[type="number"], textarea,
-  .ant-select {
+  .ant-select{
     background-color: #243f5b;
     border: 1px solid #6c8cad;
   }
 
+  .ant-calendar, .ant-calendar-input,.ant-select-selection__clear {
+    background: #cccccc;
+  }
+
   .ant-radio-button-wrapper {
     background: none;
     color: $fontColor;
@@ -86,7 +90,11 @@ $fontColor: #b2d4f9;
     background-color: #215a87;
   }
 
-  .ant-select-selection {
+  .ant-select-arrow,.ant-calendar-picker-icon:after,.ant-select-selection__clear{
+    color: #cccccc;
+  }
+
+  .ant-select-selection,.ant-input  {
     background-color: #215a87;
     color: $fontColor;
   }