上次提交遗漏内容

Author: weihomechen

.angular-cli.json

@@ -26,7 +26,10 @@
             "./assets/global/plugins/sweet-alert/sweetalert.min.js",
             "./assets/global/scripts/sweetalert.js",
             "../node_modules/echarts/dist/echarts.min.js",
-            "..node_modules/fullcalendar/dist/fullcalendar.js"
+            "../node_modules/moment/min/moment.min.js",
+            "../node_modules/fullcalendar/dist/fullcalendar.min.js",
+            "../node_modules/ztree/js/jquery.ztree.all.min.js",
+            "../node_modules/jsplumb/dist/js/jsplumb.min.js"
         ],
         "environmentSource": "environments/environment.ts",
         "environments": {

package.json

@@ -22,22 +22,24 @@
     "@angular/platform-browser": "^4.0.0",
     "@angular/platform-browser-dynamic": "^4.0.0",
     "@angular/router": "^4.0.0",
-    "@ng-bootstrap/ng-bootstrap": "^1.0.0-alpha.26",
     "@types/hammerjs": "^2.0.34",
     "@types/jquery": "^2.0.45",
     "core-js": "^2.4.1",
     "echarts": "^3.6.1",
     "fullcalendar": "^3.4.0",
     "hammerjs": "^2.0.8",
     "jquery": "^3.2.1",
+    "jsplumb": "^2.4.2",
     "material-design-icons": "^3.0.1",
     "material-design-lite": "^1.3.0",
+    "moment": "^2.18.1",
     "ng2-ckeditor": "^1.1.7",
     "ng2-toastr": "^4.0.1",
     "ng2-translate": "^5.0.0",
     "ngx-echarts": "^1.2.0",
     "rxjs": "^5.1.0",
-    "zone.js": "^0.8.4"
+    "zone.js": "^0.8.4",
+    "ztree": "^3.5.24"
   },
   "devDependencies": {
     "@angular/cli": "1.0.3",

src/app/app.component.ts

@@ -2,6 +2,8 @@ import { Component, OnInit } from '@angular/core';
 
 import { TranslateService } from 'ng2-translate';
 
+declare var Common;
+
 declare var $: any;
 @Component({
     selector: 'app-root',
@@ -10,19 +12,21 @@ declare var $: any;
 })
 export class AppComponent implements OnInit {
 
-    constructor(private translate: TranslateService) { }
+    constructor(private translate: TranslateService) { 
+        Common.startLoading();
+    }
     ngOnInit() {
+        // 简陋的根据屏幕大小定右边内容容器的宽高
         const windowWidth = window.innerWidth,
             windowHeight = window.innerHeight;
         $('.app-body, .body-footer').css('width', windowWidth - 246 + 'px');
         $('.app-body').css('height', windowHeight - 111 + 'px');
 
-
+        // 国际化处理，现在只做中英文的
         this.translate.addLangs(["zh", "en"]);
         this.translate.setDefaultLang('zh');
-
         const browserLang = this.translate.getBrowserLang();
-        console.log("检测到的浏览器语言>" + browserLang);
+        // console.log("检测到的浏览器语言>" + browserLang);
         this.translate.use(browserLang.match(/zh|en/) ? browserLang : 'zh');
     }
 }

src/app/app.routing.ts

@@ -17,7 +17,9 @@ import { AppCkeditorComponent } from './share/app-ckeditor/app-ckeditor.componen
 import { AppChartsComponent } from './share/app-charts/app-charts.component';
 import { AmapDemoComponent } from './share/app-amap/amap-demo.component';
 import { CalendarDemoComponent } from './share/app-calendar/calendar-demo.component';
-
+import { AppAlertComponent } from './share/app-alert/app-alert.component';
+import { AppTreeComponent } from './share/app-tree/app-tree.component';
+import { AppJsplumbComponent } from './share/app-jsplumb/app-jsplumb.component';
 
 const appRoutes: Routes = [
     {
@@ -76,6 +78,18 @@ const appRoutes: Routes = [
         path: 'calendar',
         component: CalendarDemoComponent
     },
+    {
+        path: 'alert',
+        component: AppAlertComponent
+    },
+    {
+        path: 'tree',
+        component: AppTreeComponent
+    },
+    {
+        path: 'jsplumb',
+        component: AppJsplumbComponent
+    },
     {
         path: '',
         redirectTo: '/home',

src/app/base-data/base-data.module.ts

@@ -1,4 +1,5 @@
 import { NgModule } from '@angular/core';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { CommonModule } from '@angular/common';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { RouterModule } from '@angular/router';
@@ -13,6 +14,7 @@ import { PersonManageService } from './person-manage.service';
 
 @NgModule({
     imports: [
+        BrowserAnimationsModule,
         CommonModule,
         FormsModule,
         MaterialModule,

src/app/base-data/person-add/person-add.component.ts

@@ -6,6 +6,7 @@ import { TabControlService } from '../../layout/header/tab/tabControl.service';
 
 declare var $: any;
 declare var SweetAlert: any;
+declare var Common;
 
 @Component({
     selector: 'app-person-add',
@@ -83,6 +84,7 @@ export class PersonAddComponent implements OnInit {
             .map(position => this.filterPositions(position));
     }
     ngOnInit() {
+        Common.stopLoading();
     }
 
     filterStates(val: string) {

src/app/base-data/person-list/person-list.component.html

@@ -1,4 +1,4 @@
-<div class="portlet display-list-container">
+<div class="portlet display-list-container" [@fadeIn]="'active'">
     <div class="portlet-header display-list-header">
         <div class="table-toolbar">
             <div class="toolbar-btns">
@@ -9,12 +9,9 @@
             </div>
 
             <div class="toolbar-search">
-                    <mdl-textfield type="text" label="姓名" [(ngModel)]="searchObj.name" autocomplete="name" (blur)="onInputBlur($event)" (focus)="onInputFocus($event)"
-                        (keyup)="onInputKeyup($event)" floating-label></mdl-textfield>
-                    <mdl-textfield type="text" label="队伍" [(ngModel)]="searchObj.team" autocomplete="name" (blur)="onInputBlur($event)" (focus)="onInputFocus($event)"
-                        (keyup)="onInputKeyup($event)" floating-label></mdl-textfield>
-                    <mdl-textfield type="text" label="账号" [(ngModel)]="searchObj.account" autocomplete="name" (blur)="onInputBlur($event)" (focus)="onInputFocus($event)"
-                        (keyup)="onInputKeyup($event)" floating-label></mdl-textfield>
+                <mdl-textfield type="text" label="姓名" [(ngModel)]="searchObj.name" autocomplete="name" (blur)="onInputBlur($event)" (focus)="onInputFocus($event)" (keyup)="onInputKeyup($event)" floating-label></mdl-textfield>
+                <mdl-textfield type="text" label="队伍" [(ngModel)]="searchObj.team" autocomplete="name" (blur)="onInputBlur($event)" (focus)="onInputFocus($event)" (keyup)="onInputKeyup($event)" floating-label></mdl-textfield>
+                <mdl-textfield type="text" label="账号" [(ngModel)]="searchObj.account" autocomplete="name" (blur)="onInputBlur($event)" (focus)="onInputFocus($event)" (keyup)="onInputKeyup($event)" floating-label></mdl-textfield>
                 <button mdl-button mdl-button-type="fab" (click)="search()" class="btn-search">
                     <i class="fa fa-search"></i>
                 </button>
@@ -26,15 +23,14 @@
     </div>
     <div class="portlet-body display-list-body">
         <div class="table-container">
-            <mdl-table-selectable mdl-shadow="2" id='person_manage_table' [table-model]="tableModel" [table-model-selected]="selected"
-                (table-model-selectionChanged)="selectionChanged($event)">
+            <mdl-table-selectable mdl-shadow="2" id='person_manage_table' [table-model]="tableModel" [table-model-selected]="selected" (table-model-selectionChanged)="selectionChanged($event)">
             </mdl-table-selectable>
             <div class="table-footer">
                 <span>共</span><span class="total-size">8</span><span>条</span>
                 <span class="now-page">1</span>/<span class="total-page">1</span>页
                 <span>第</span>
                 <button mdl-button mdl-button-type="raised" mdl-ripple class="btn-prev"><i class="fa fa-chevron-left"></i></button>
-                <input class="table-target-page">
+                <input class="form-control table-target-page" value="1">
                 <button mdl-button mdl-button-type="raised" mdl-ripple class="btn-next"><i class="fa fa-chevron-right"></i></button>
                 <span>页</span>
             </div>

src/app/base-data/person-list/person-list.component.ts

@@ -7,14 +7,16 @@ import { IPersonItem } from '../model/table-person-item';
 import { TabControlService } from '../../layout/header/tab/tabControl.service';
 import { PersonManageService } from '../person-manage.service';
 import 'rxjs/add/operator/toPromise';
+import { fadeIn } from '../../animations/fade-in';
 
 declare var SweetAlert: any;
 declare var Common: any;
 
 @Component({
     selector: 'app-person-list',
     templateUrl: './person-list.component.html',
-    styleUrls: ['./person-list.component.css']
+    styleUrls: ['./person-list.component.css'],
+    animations: [fadeIn]
 })
 export class PersonListComponent implements OnInit {
 

src/app/home/home/home.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core';
-
+declare var Common;
 @Component({
   selector: 'app-home',
   templateUrl: './home.component.html',
@@ -10,6 +10,7 @@ export class HomeComponent implements OnInit {
   constructor() { }
 
   ngOnInit() {
+      Common.stopLoading();
   }
 
 }

src/app/layout/header/tab/tab.component.css

@@ -34,7 +34,7 @@ md2-tabs {
     position: absolute;
     top: 0;
     height: 100%;
-    width: 32px;
+    width: 30px;
     padding: 10px 0;
     z-index: 2;
     cursor: pointer;
@@ -57,15 +57,14 @@ md2-tabs {
 .md2-prev-button .prev-icon,
 .md2-next-button .next-icon {
     display: block;
-    width: 10px;
-    height: 10px;
+    width: 12px;
+    height: 12px;
     font-size: 0;
-    border-width: 0 0 2px 2px;
+    border-width: 0 0 4px 4px;
     border-style: solid;
-    border-color: #757575;
     border-radius: 1px;
     transform: rotate(45deg);
-    margin: 8px;
+    margin: 6px;
 }
 
 .md2-next-button .next-icon {
@@ -75,7 +74,7 @@ md2-tabs {
 .md2-tabs-canvas {
     position: relative;
     height: 100%;
-    /*overflow: hidden;*/
+    overflow: hidden;
     display: block;
     outline: none;
 }