Merge branch 'master' of http://39.106.78.171:3000/13562321995/AnxinCloudDisk

src/app/navigation/navigation.component.html

@@ -31,7 +31,7 @@
             </ul> -->
             <mat-accordion multi="true">
 
-                <mat-expansion-panel expanded>
+                <mat-expansion-panel >
                     <mat-expansion-panel-header>
                        支队级
                     </mat-expansion-panel-header>

src/app/navigation/navigation.component.ts

@@ -60,7 +60,8 @@ export class NavigationComponent implements OnInit {
 
   //系统管理菜单
   systemManagement:any = [
-    { id:"用户管理", name:"用户管理" },
+    { id:"学员管理", name:"学员管理" },
+    { id:"教员管理", name:"教员管理" }
   ]
 
   
@@ -91,7 +92,12 @@ export class NavigationComponent implements OnInit {
   //点击用户管理
   clickUser(item){
     this.selectedDataBank = item.id
-    this.router.navigate([`/home/userManagement`])
+    if(item.name == "学员管理"){
+      this.router.navigate([`/home/userManagement`])
+    }else if(item.name == "教员管理"){
+      this.router.navigate([`/home/teacherManagement`])
+    }
+    
   }
 
   //新增资料库

src/app/ui/enterpriseuser/addenterpriseuser.component.html

@@ -1,43 +1,48 @@
-<h1 mat-dialog-title>创建企业用户</h1>
+<h2 mat-dialog-title>创建用户</h2>
 
 <form (ngSubmit)="onSubmit(form.value)" #form="ngForm" class="example-container">
 
   <div>
     <mat-form-field>
-      <input matInput id="name" name="loginName" pattern="^[a-zA-Z][a-zA-Z0-9_]{4,19}$"
+      <input matInput id="idNumber" name="idNumber"
-      required ngModel placeholder="请输入登录账号">
+      required ngModel placeholder="请输入身份证号" autocomplete="off" pattern="^[1-9]\d{5}(18|19|20|(3\d))\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$">
+      <mat-error>
+        <strong>请输入正确身份证号</strong>
+      </mat-error>
     </mat-form-field>
   </div>
 
   <div>
     <mat-form-field>
-      <input matInput id="tel" name="tel" 
+      <input matInput id="realName" name="realName" 
-      pattern="^(?:\+?86)?1(?:3\d{3}|5[^4\D]\d{2}|8\d{3}|7(?:[0-35-9]\d{2}|4(?:0\d|1[0-2]|9\d))|9[0-35-9]\d{2}|6[2567]\d{2}|4(?:[14]0\d{3}|[68]\d{4}|[579]\d{2}))\d{6}$"
+      maxlength="100"
-      required ngModel placeholder="请输入联系电话">
+      required ngModel placeholder="请输入真实姓名" autocomplete="off">
     </mat-form-field>
   </div>
 
   <div>
     <mat-form-field>
-      <input matInput id="unitname" name="unitname" 
+      <mat-select placeholder="请选择职务" [formControl]="toppings" multiple required>
-      required ngModel placeholder="请输入单位名称">
+        <div style="float: left;">
+          <mat-option *ngFor="let item of detachmentPosts" [value]="item.id">{{item.name}}</mat-option>
+        </div>
+        <div style="float: left;">
+          <mat-option *ngFor="let item of brigadePosts" [value]="item.id">{{item.name}}</mat-option>
+        </div>
+        <div style="float: left;">
+          <mat-option *ngFor="let item of RescueStationPosts" [value]="item.id">{{item.name}}</mat-option>
+        </div>
+      </mat-select>
     </mat-form-field>
   </div>
 
-  <div>
-    <mat-form-field>
-      <input matInput id="creditcode" name="creditcode" 
-      pattern="^[0-9A-HJ-NP-RTUW-Y]{2}\d{6}[0-9A-HJ-NP-RTUW-Y]{10}$"
-      required ngModel placeholder="请输入统一社会信用代码">
-    </mat-form-field>
-  </div>
   
   <div mat-dialog-content *ngIf="errmsg">
     <p style="font-size: 14px; color: red;">{{errmsg}}</p>
   </div>
 
   <div mat-dialog-actions>
-    <button mat-raised-button color="primary" type="submit" [disabled]="!form.form.valid">确定</button>
+    <button mat-raised-button color="primary" type="submit" [disabled]="!form.form.valid || toppings.value == null">确定</button>
     <button mat-raised-button mat-dialog-close>取消</button>
   </div>
 

src/app/ui/enterpriseuser/addenterpriseuser.component.ts

@@ -1,7 +1,7 @@
 import { Component, OnInit, Inject } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import {MatDialogRef} from '@angular/material/dialog';
-
+import {FormControl} from '@angular/forms';
 
 
 @Component({
@@ -11,25 +11,54 @@ import {MatDialogRef} from '@angular/material/dialog';
   })
 export class AddEnterpriserUser {
 
+  toppings = new FormControl();
   constructor(private http: HttpClient,public dialogRef: MatDialogRef<AddEnterpriserUser>) {}
-
   errmsg:any; //捕获错误信息
+  detachmentPosts: any = []//支队职务列表
+  brigadePosts: any = []//大队职务列表
+  RescueStationPosts: any = []//救援站职务列表
+  ngOnInit(): void {
+    this.getAllPosts()
+  }
+
+  //获得所有职务
+  getAllPosts(){
+    this.http.get("/api/Posts").subscribe( (data:any) =>{
+      console.log(123,data)
+      data.forEach(item => {
+        if(item.name.indexOf("支队级") != -1){
+          this.detachmentPosts.push(item)
+        }else if(item.name.indexOf("大队级") != -1){
+          this.brigadePosts.push(item)
+        }else{
+          this.RescueStationPosts.push(item)
+        }
+      });
+    })  
+  }
+
+
   //提交创建表单
   onSubmit (e) {
     let date = new Date()
-    this.http.post('/api/CompanyUsers',{
+    let postsArr = this.toppings.value
-      name:e.loginName,
+    let postsObj = []
-      phone:e.tel,
+    postsArr.forEach((item) => {
-      enabled:true,
+      postsObj.push({id:item, name:""})
-      creationTime:date,
+    })
-      usci:e.creditcode,
+    // console.log(666,postsObj)
-      companyName:e.unitname
+    let body = {
-    }).subscribe(data=>{
+      name : e.idNumber,
-      this.dialogRef.close(data)},
+      realName : e.realName,
-      error=>{this.errmsg=error}
+      roleType : 2,
-    )
+      enabled : true,
-  }
+      creationTime : date,
-
+      posts : postsObj
+    }
+    this.http.post("/api/Users",body).subscribe( data => {
+      this.dialogRef.close(data);
+    })
 
+  }
 
 }

src/app/ui/enterpriseuser/editenterpriseuser.html

@@ -1,39 +1,45 @@
-<h1 mat-dialog-title>编辑企业用户</h1>
+<h2 mat-dialog-title>编辑用户</h2>
 
 <form (ngSubmit)="onSubmit(form.value)" #form="ngForm" class="example-container">
 
   <div>
     <mat-form-field>
-      <input matInput id="name" name="loginName" disabled
+      <input matInput id="idNumber" name="idNumber"
-      required [(ngModel)]="data.name" placeholder="登录账号">
+      required [(ngModel)]="IdNumber" placeholder="请输入身份证号" autocomplete="off" disabled pattern="^[1-9]\d{5}(18|19|20|(3\d))\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$">
     </mat-form-field>
   </div>
 
   <div>
     <mat-form-field>
-      <input matInput id="tel" name="tel" 
+      <input matInput id="realName" name="realName" 
-      pattern="^(?:\+?86)?1(?:3\d{3}|5[^4\D]\d{2}|8\d{3}|7(?:[0-35-9]\d{2}|4(?:0\d|1[0-2]|9\d))|9[0-35-9]\d{2}|6[2567]\d{2}|4(?:[14]0\d{3}|[68]\d{4}|[579]\d{2}))\d{6}$"
+      maxlength="100"
-      required [(ngModel)]="companyPhone" placeholder="联系电话">
+      required [(ngModel)]="realName" placeholder="请输入真实姓名" autocomplete="off">
     </mat-form-field>
   </div>
 
   <div>
     <mat-form-field>
-      <input matInput id="unitname" name="unitname" 
+      <mat-select placeholder="请选择职务" [formControl]="toppings" multiple required>
-      required [(ngModel)]="companyName" placeholder="单位名称">
+        <div style="float: left;">
+          <mat-option *ngFor="let item of detachmentPosts" [value]="item.id">{{item.name}}</mat-option>
+        </div>
+        <div style="float: left;">
+          <mat-option *ngFor="let item of brigadePosts" [value]="item.id">{{item.name}}</mat-option>
+        </div>
+        <div style="float: left;">
+          <mat-option *ngFor="let item of RescueStationPosts" [value]="item.id">{{item.name}}</mat-option>
+        </div>
+      </mat-select>
     </mat-form-field>
   </div>
 
-  <div>
+  
-    <mat-form-field>
+  <div mat-dialog-content *ngIf="errmsg">
-      <input matInput id="creditcode" name="creditcode" 
+    <p style="font-size: 14px; color: red;">{{errmsg}}</p>
-      pattern="^[0-9A-HJ-NP-RTUW-Y]{2}\d{6}[0-9A-HJ-NP-RTUW-Y]{10}$"
-      required [(ngModel)]="companyUsci" placeholder="统一社会信用代码">
-    </mat-form-field>
   </div>
 
   <div mat-dialog-actions>
-    <button mat-raised-button color="primary" type="submit" [disabled]="!form.form.valid">确定</button>
+    <button mat-raised-button color="primary" type="submit" [disabled]="!form.form.valid || toppings.value == null">确定</button>
     <button mat-raised-button mat-dialog-close>取消</button>
   </div>
 

src/app/ui/enterpriseuser/enterpriseuser.component.html

@@ -28,29 +28,32 @@
 
     <ng-container matColumnDef="name">
       <th mat-header-cell *matHeaderCellDef>姓名</th>
-      <td mat-cell *matCellDef="let element">{{element.name}}</td>
+      <td mat-cell *matCellDef="let element">{{element.realName}}</td>
     </ng-container>
 
     <ng-container matColumnDef="identitycard">
       <th mat-header-cell *matHeaderCellDef>身份证号</th>
-      <td mat-cell *matCellDef="let element">{{element.companyName}}</td>
+      <td mat-cell *matCellDef="let element">{{element.name}}</td>
     </ng-container>
 
     <ng-container matColumnDef="post">
       <th mat-header-cell *matHeaderCellDef>职务</th>
-      <td mat-cell *matCellDef="let element">{{element.usci}}</td>
+      <td mat-cell *matCellDef="let element">
+        <span *ngFor="let item of element.posts">
+          {{item.name}}
+        </span>
+      </td>
     </ng-container>
 
     <ng-container matColumnDef="operation">
       <th mat-header-cell *matHeaderCellDef>操作</th>
       <td mat-cell *matCellDef="let element">
-        <button mat-raised-button color="primary" class="maginleft" (click)='see(element)' *ngIf="!element.cancelled">查看学习记录</button>
+        <span class="operationSpan"><mat-icon class="icon">assessment</mat-icon><span class="spanbtn blue">查看学习记录</span></span>
-        <button mat-raised-button color="primary" class="maginleft" (click)='reset(element)' *ngIf="!element.cancelled">重置密码</button>
+        <span class="operationSpan"><mat-icon class="icon">cached</mat-icon><span class="spanbtn blue" (click)="reset(element)">重置密码</span></span>
-        <button mat-raised-button color="primary" class="maginleft" (click)='edit(element)' *ngIf="!element.cancelled">修改</button>
+        <span class="operationSpan"><mat-icon class="icon">edit</mat-icon><span class="spanbtn blue" (click)="edit(element)">修改</span></span>
-        <!-- <button mat-raised-button color="primary" class="maginleft" (click)='enabled(element)' *ngIf="!element.cancelled && !element.enabled">启用</button> -->
+        <span *ngIf="element.enabled" class="operationSpan"><mat-icon class="icon" style="color: rgb(245, 34, 45);">remove_circle</mat-icon><span class="spanbtn blue" (click)="noEnabled(element)">禁用</span></span>
-        <button mat-raised-button color="warn" class="maginleft" (click)='noEnabled(element)' *ngIf="!element.cancelled && element.enabled">禁用</button>
+        <span *ngIf="!element.enabled" class="operationSpan"><mat-icon class="icon" style="color: gray;">remove_circle</mat-icon><span class="spanbtn gray" (click)="enabled(element)">禁用</span></span>
-        <!-- <button mat-raised-button color="warn" class="maginleft" (click)='logoff(element)' *ngIf="!element.cancelled">注销</button> -->
+        <span class="operationSpan"><mat-icon class="icon">delete</mat-icon><span class="spanbtn red" (click)="delete(element)">删除</span></span>
-        <button mat-raised-button color="warn" class="maginleft" (click)='delete(element)' *ngIf="element.cancelled">删除</button>
       </td>
     </ng-container>
 

src/app/ui/enterpriseuser/enterpriseuser.component.scss

@@ -39,4 +39,25 @@ table {
     }
 
   } //queryBox
-}
+}
+
+.operationSpan{
+  margin: 0 5px;
+  .spanbtn:hover{
+    text-decoration: underline;
+    cursor: pointer;
+  }
+  .blue{
+    color:rgb(24, 144, 255) ;
+  }
+  .red{
+    color: rgb(245, 34, 45);
+  }
+  .gray{
+    color: gray;
+  }
+}
+.icon{
+  font-size: 18px;
+  vertical-align: top;
+}

src/app/ui/enterpriseuser/enterpriseuser.component.ts

@@ -6,8 +6,7 @@ import { MatTableDataSource } from '@angular/material/table';
 import { PageEvent } from '@angular/material/paginator';
 import { AddEnterpriserUser } from './addenterpriseuser.component'
 import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar';
-
+import {FormControl} from '@angular/forms';
-
 
 @Component({
   selector: 'app-enterpriseuser',
@@ -50,7 +49,7 @@ export class EnterpriseuserComponent implements OnInit {
       RoleType: '2',
       PageNumber: String(this.pageNumber),
     }
-    this.http.get('/api/CompanyUsers',{params:data}).subscribe((data:any)=>{
+    this.http.get('/api/Users',{params:data}).subscribe((data:any)=>{
       this.length = data.totalCount
       this.pageSize = data.pageSize
       this.dataSource = new MatTableDataSource<any>(data.items)
@@ -74,14 +73,14 @@ export class EnterpriseuserComponent implements OnInit {
   }
 
   //更新当前页数据
-  getAllCompanyUsers () {
+  getAllUsers () {
     let data= {
-      Name: this.userLogin || '',
+      Name: this.identityCard || '',
-      CompanyName: this.userName || '',
+      RealName: this.name || '',
-      USCI: this.creditcode || '',
+      RoleType: '2',
       PageNumber: String(this.pageNumber),
     }
-    this.http.get('/api/CompanyUsers',{params:data}).subscribe((data:any)=>{
+    this.http.get('/api/Users',{params:data}).subscribe((data:any)=>{
       this.length = data.totalCount
       this.pageSize = data.pageSize
       this.dataSource = new MatTableDataSource<any>(data.items)
@@ -90,36 +89,58 @@ export class EnterpriseuserComponent implements OnInit {
 
   //清空搜索
   empty () {
-    this.userLogin = ''
+    this.identityCard = ''
-    this.userName = ''
+    this.name = ''
-    this.creditcode = ''
     this.initData()
   }
   
-  //创建企业用户
+  //创建用户
   open(){
-    let dialogRef = this.dialog.open(AddEnterpriserUser);
+    let dialogRef = this.dialog.open(AddEnterpriserUser, {//调用open方法打开对话框并且携带参数过去
+      width: '250px',
+    });
     dialogRef.afterClosed().subscribe(data=>{
-      if (data) {this.getAllCompanyUsers()}
+      if (data) {
+        const config = new MatSnackBarConfig();
+        config.verticalPosition = 'top';
+        config.duration = 3000
+        this.snackBar.open('创建成功!','确定',config);
+        this.getAllUsers()
+      }
     });
   }
 
   //编辑企业用户
   edit (e) {
-    let dialogRef = this.dialog.open(editenterpriseuser,{data:e});
+    let dialogRef = this.dialog.open(editenterpriseuser,{
+      width: '250px',
+      data:e
+    });
     dialogRef.afterClosed().subscribe(data=>{
-      if (data) {this.getAllCompanyUsers()}
+      if (data) {
+        const config = new MatSnackBarConfig();
+        config.verticalPosition = 'top';
+        config.duration = 3000
+        this.snackBar.open('修改成功!','确定',config);  
+        this.getAllUsers()
+      }
     });
   }
 
   //重置密码
   reset (e) {
-    this.http.put(`/api/CompanyUsers/${e.name}/ResetPassword`,{}).subscribe(data=>{
+    this.http.put(`/api/Users/${e.name}/ResetPassword`,{}).subscribe(
-      const config = new MatSnackBarConfig();
+      data=>{
-      config.verticalPosition = 'top';
+        const config = new MatSnackBarConfig();
-      config.duration = 3000
+        config.verticalPosition = 'top';
-      this.snackBar.open('重置密码成功!','确定',config);
+        config.duration = 3000
-    })
+        this.snackBar.open('重置密码成功!','确定',config);
+      },err=>{
+        const config = new MatSnackBarConfig();
+        config.verticalPosition = 'top';
+        config.duration = 3000
+        this.snackBar.open('重置密码失败!','确定',config);
+      })
   }
 
   //查看企业信息
@@ -134,49 +155,55 @@ export class EnterpriseuserComponent implements OnInit {
 
   //启用
   enabled (e) {
-    this.http.put(`/api/CompanyUsers/${e.name}`,{
+    let date = new Date()
-      name:e.name,
+    let body = {
-      phone:e.phone,
+      name : e.name,
-      enabled:true,
+      realName : e.realName,
-      creationTime:e.creationTime,
+      roleType : e.roleType,
-      usci:e.usci,
+      enabled : true,
-      companyId:e.companyId,
+      creationTime : date,
-      companyName:e.companyName
+      posts : e.posts
-    }).subscribe(data=>{
+    }
-      this.getAllCompanyUsers()
+    this.http.put(`/api/Users/${e.name}`,body).subscribe(data => {
+      const config = new MatSnackBarConfig();
+      config.verticalPosition = 'top';
+      config.duration = 3000;
+      this.snackBar.open('启用成功!','确定',config);
+      this.getAllUsers();
     })
   }
 
   //禁用
   noEnabled (e) {
-    this.http.put(`/api/CompanyUsers/${e.name}`,{
+    let date = new Date()
-      name:e.name,
+    let body = {
-      phone:e.phone,
+      name : e.name,
-      enabled:false,
+      realName : e.realName,
-      creationTime:e.creationTime,
+      roleType : e.roleType,
-      usci:e.usci,
+      enabled : false,
-      companyId:e.companyId,
+      creationTime : date,
-      companyName:e.companyName
+      posts : e.posts
-    }).subscribe(data=>{
+    }
-      this.getAllCompanyUsers()
+    this.http.put(`/api/Users/${e.name}`,body).subscribe(data => {
+      const config = new MatSnackBarConfig();
+      config.verticalPosition = 'top';
+      config.duration = 3000;
+      this.snackBar.open('禁用成功!','确定',config);
+      this.getAllUsers();
     })
   }
 
-  //注销用户
-  logoff (e) {
-    let isTrue = confirm('注销是不可逆操作,您确定要注销吗')
-    if (isTrue) {
-      this.http.delete(`/api/CompanyUsers/${e.name}/Cancel`).subscribe(data=>{
-        this.getAllCompanyUsers() })
-    }
-  }
 
   //删除
   delete (e) {
     let isTrue = confirm('您确定要删除吗')
     if (isTrue) {
-      this.http.delete(`/api/CompanyUsers/${e.name}`).subscribe(data=>{
+      this.http.delete(`/api/Users/${e.name}`).subscribe(data=>{
-        this.getAllCompanyUsers()
+        const config = new MatSnackBarConfig();
+        config.verticalPosition = 'top';
+        config.duration = 3000
+        this.snackBar.open('删除成功!','确定',config);
+        this.getAllUsers()
       })
     }
   }
@@ -195,36 +222,63 @@ export class EnterpriseuserComponent implements OnInit {
 })
 export class editenterpriseuser {
 
-  constructor(public http: HttpClient,public dialog: MatDialog,
+  toppings:any = new FormControl();
-  @Inject(MAT_DIALOG_DATA) public data,public dialogRef: MatDialogRef<any>,) { }
+  constructor(private http: HttpClient,public dialogRef: MatDialogRef<editenterpriseuser>,@Inject(MAT_DIALOG_DATA) public data) {}
-  
+  errmsg:any; //捕获错误信息
-  ngOnInit() {
+  detachmentPosts: any = []//支队职务列表
-    this.companyName = this.data.companyName
+  brigadePosts: any = []//大队职务列表
-    this.companyPhone = this.data.phone
+  RescueStationPosts: any = []//救援站职务列表
-    this.companyUsci = this.data.usci
+
+  IdNumber:any //身份证号
+  realName:any //真实姓名
+  ngOnInit(): void {
+    this.toppings.value = []
+    this.IdNumber = this.data.name
+    this.realName = this.data.realName
+    this.data.posts.forEach((item) => {
+      this.toppings.value.push(item.id)
+    })
+    this.getAllPosts()
+  }
+
+  //获得所有职务
+  getAllPosts(){
+    this.http.get("/api/Posts").subscribe( (data:any) =>{
+      console.log(123,data)
+      data.forEach(item => {
+        if(item.name.indexOf("支队级") != -1){
+          this.detachmentPosts.push(item)
+        }else if(item.name.indexOf("大队级") != -1){
+          this.brigadePosts.push(item)
+        }else{
+          this.RescueStationPosts.push(item)
+        }
+      });
+    })  
   }
 
-  companyName:any; //企业单位名称
-  companyPhone:any; //企业电话
-  companyUsci:any; //企业统一社会信用代码
 
-  //提交表单
+  //提交创建表单
   onSubmit (e) {
-    this.http.put(`/api/CompanyUsers/${this.data.name}`,{
+    let date = new Date()
-      name:this.data.name,
+    let postsArr = this.toppings.value
-      phone:e.tel,
+    let postsObj = []
-      enabled:this.data.enabled,
+    postsArr.forEach((item) => {
-      creationTime:this.data.creationTime,
+      postsObj.push({id:item, name:""})
-      usci:e.creditcode,
+    })
-      companyId:this.data.companyId,
+    let body = {
-      companyName:e.unitname
+      name : this.data.name,
-    }).subscribe(data=>{
+      realName : e.realName,
-      this.dialogRef.close('success')
+      roleType : 2,
+      enabled : this.data.enabled,
+      creationTime : date,
+      posts : postsObj
+    }
+    this.http.put(`/api/Users/${this.data.name}`,body).subscribe(data => {
+      this.dialogRef.close("修改成功");
     })
   }
 
-
-
 }
 
 

src/app/ui/enterpriseuser/seeenterpriseuser.html

@@ -1,29 +0,0 @@
-<span  mat-dialog-title>查看企业用户</span>
-
-<div mat-dialog-content>
-    <mat-list role="list">
-        <mat-list-item role="listitem">登录账号:
-            <span class="maginleft">{{data.name}}</span>
-        </mat-list-item>
-        <mat-list-item role="listitem">单位名称:
-            <span class="maginleft">{{data.companyName}}</span>
-        </mat-list-item>
-        <mat-list-item role="listitem">联系电话:
-            <span class="maginleft">{{data.phone}}</span>
-        </mat-list-item>
-        <mat-list-item role="listitem">统一社会信用代码:  
-            <span class="maginleft">{{data.usci}}</span>
-        </mat-list-item>
-        <mat-list-item role="listitem">创建时间:  
-            <span class="maginleft">{{data.creationTime|date:'yyyy-MM-dd'}}</span>
-        </mat-list-item>
-        <mat-list-item role="listitem">是否禁用:  
-            <span class="maginleft" *ngIf="data.enabled">否</span>
-            <span class="maginleft" *ngIf="!data.enabled">是</span>
-        </mat-list-item>
-    </mat-list>
-</div>
-
-<div mat-dialog-actions>
-    <button mat-raised-button color="primary" mat-dialog-close>关闭</button>
-</div>

src/app/ui/my-paginator.ts

@@ -0,0 +1,27 @@
+import { MatPaginatorIntl } from '@angular/material/paginator';
+const dutchRangeLabel = (page: number, pageSize: number, length: number) => {
+    if (length === 0 || pageSize === 0) { return `0 到 ${length}`; }
+    length = Math.max(length, 0);
+    const startIndex = page * pageSize;
+    const endIndex = startIndex < length ?
+      Math.min(startIndex + pageSize, length) :
+      startIndex + pageSize;
+    return `${startIndex + 1} - ${endIndex} 到 ${length}条`;
+  
+  }
+  
+  export function myPaginator() {
+  
+    const paginatorIntl = new MatPaginatorIntl();
+  
+    paginatorIntl.itemsPerPageLabel = '每页条数:';
+  
+    paginatorIntl.nextPageLabel = '下一页:';
+  
+    paginatorIntl.previousPageLabel = '上一页:';
+  
+    paginatorIntl.getRangeLabel = dutchRangeLabel;
+  
+    return paginatorIntl;
+  
+  }

src/app/ui/teacherManagement/addenterpriseuser.component.html

@@ -0,0 +1,49 @@
+<h2 mat-dialog-title>创建教员</h2>
+
+<form (ngSubmit)="onSubmit(form.value)" #form="ngForm" class="example-container">
+
+  <div>
+    <mat-form-field>
+      <input matInput id="idNumber" name="idNumber"
+      required ngModel placeholder="请输入帐号" autocomplete="off" pattern="^[a-zA-Z][a-zA-Z0-9_]{4,19}$">
+      <mat-error>
+        <strong>帐号格式为字母+数字</strong>
+      </mat-error>
+    </mat-form-field>
+  </div>
+
+  <div>
+    <mat-form-field>
+      <input matInput id="realName" name="realName" 
+      maxlength="100"
+      required ngModel placeholder="请输入真实姓名" autocomplete="off">
+    </mat-form-field>
+  </div>
+
+  <div>
+    <mat-form-field>
+      <mat-select placeholder="请选择职务" [formControl]="toppings" multiple required>
+        <div style="float: left;">
+          <mat-option *ngFor="let item of detachmentPosts" [value]="item.id">{{item.name}}</mat-option>
+        </div>
+        <div style="float: left;">
+          <mat-option *ngFor="let item of brigadePosts" [value]="item.id">{{item.name}}</mat-option>
+        </div>
+        <div style="float: left;">
+          <mat-option *ngFor="let item of RescueStationPosts" [value]="item.id">{{item.name}}</mat-option>
+        </div>
+      </mat-select>
+    </mat-form-field>
+  </div>
+
+  
+  <div mat-dialog-content *ngIf="errmsg">
+    <p style="font-size: 14px; color: red;">{{errmsg}}</p>
+  </div>
+
+  <div mat-dialog-actions>
+    <button mat-raised-button color="primary" type="submit" [disabled]="!form.form.valid || toppings.value == null">确定</button>
+    <button mat-raised-button mat-dialog-close>取消</button>
+  </div>
+
+</form>

src/app/ui/teacherManagement/addenterpriseuser.component.ts

@@ -0,0 +1,62 @@
+import { Component, OnInit, Inject } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+import {MatDialogRef} from '@angular/material/dialog';
+import {FormControl} from '@angular/forms';
+
+
+@Component({
+    selector: 'addenterpriseuser',
+    templateUrl: './addenterpriseuser.component.html',
+    styleUrls: ['./enterpriseuser.component.scss']
+  })
+export class AddTeacher {
+
+  toppings = new FormControl();
+  constructor(private http: HttpClient,public dialogRef: MatDialogRef<AddTeacher>) {}
+  errmsg:any; //捕获错误信息
+  detachmentPosts: any = []//支队职务列表
+  brigadePosts: any = []//大队职务列表
+  RescueStationPosts: any = []//救援站职务列表
+  ngOnInit(): void {
+    this.getAllPosts()
+  }
+
+  //获得所有职务
+  getAllPosts(){
+    this.http.get("/api/Posts").subscribe( (data:any) =>{
+      data.forEach(item => {
+        if(item.name.indexOf("支队级") != -1){
+          this.detachmentPosts.push(item)
+        }else if(item.name.indexOf("大队级") != -1){
+          this.brigadePosts.push(item)
+        }else{
+          this.RescueStationPosts.push(item)
+        }
+      });
+    })  
+  }
+
+
+  //提交创建表单
+  onSubmit (e) {
+    let date = new Date()
+    let postsArr = this.toppings.value
+    let postsObj = []
+    postsArr.forEach((item) => {
+      postsObj.push({id:item, name:""})
+    })
+    let body = {
+      name : e.idNumber,
+      realName : e.realName,
+      roleType : 1,
+      enabled : true,
+      creationTime : date,
+      posts : postsObj
+    }
+    this.http.post("/api/Users",body).subscribe( data => {
+      this.dialogRef.close(data);
+    })
+
+  }
+
+}

src/app/ui/teacherManagement/editenterpriseuser.html

@@ -0,0 +1,46 @@
+<h2 mat-dialog-title>编辑教员</h2>
+
+<form (ngSubmit)="onSubmit(form.value)" #form="ngForm" class="example-container">
+
+  <div>
+    <mat-form-field>
+      <input matInput id="idNumber" name="idNumber"
+      required [(ngModel)]="IdNumber" placeholder="请输入帐号" autocomplete="off" disabled  pattern="^[a-zA-Z][a-zA-Z0-9_]{4,19}$">
+    </mat-form-field>
+  </div>
+
+  <div>
+    <mat-form-field>
+      <input matInput id="realName" name="realName" 
+      maxlength="100"
+      required [(ngModel)]="realName" placeholder="请输入真实姓名" autocomplete="off">
+    </mat-form-field>
+  </div>
+
+  <div>
+    <mat-form-field>
+      <mat-select placeholder="请选择职务" [formControl]="toppings" multiple required>
+        <div style="float: left;">
+          <mat-option *ngFor="let item of detachmentPosts" [value]="item.id">{{item.name}}</mat-option>
+        </div>
+        <div style="float: left;">
+          <mat-option *ngFor="let item of brigadePosts" [value]="item.id">{{item.name}}</mat-option>
+        </div>
+        <div style="float: left;">
+          <mat-option *ngFor="let item of RescueStationPosts" [value]="item.id">{{item.name}}</mat-option>
+        </div>
+      </mat-select>
+    </mat-form-field>
+  </div>
+
+  
+  <div mat-dialog-content *ngIf="errmsg">
+    <p style="font-size: 14px; color: red;">{{errmsg}}</p>
+  </div>
+
+  <div mat-dialog-actions>
+    <button mat-raised-button color="primary" type="submit" [disabled]="!form.form.valid || toppings.value == null">确定</button>
+    <button mat-raised-button mat-dialog-close>取消</button>
+  </div>
+
+</form>

src/app/ui/teacherManagement/enterpriseuser.component.html

@@ -0,0 +1,68 @@
+<div class="header">
+  <form #form="ngForm">
+    <div class="queryBox">
+
+      <div class="queryField"style="margin-right: 90px;">
+        <button type="button"  mat-raised-button color="primary" (click)='open()'>创建教员</button>
+      </div>
+
+      <div class="queryField">
+        <label style="margin-right: 10px;">姓名:</label>
+        <input type="text" [(ngModel)]="name" name="name" autocomplete="off">
+      </div>
+
+      <div class="queryField">
+        <label style="margin-right: 10px;">帐号:</label>
+        <input type="text" [(ngModel)]="identityCard" name="identityCard" autocomplete="off">
+      </div>
+      <div class="btnbox" style="margin-left: 90px;">
+        <button mat-raised-button color="primary" (click)='initData()'>查询</button>
+        <button mat-raised-button style="margin-left: 10px;" type="button" (click)='empty()'>重置</button>
+      </div>
+    </div>
+    
+  </form>
+</div>
+
+<table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
+
+    <ng-container matColumnDef="name">
+      <th mat-header-cell *matHeaderCellDef>姓名</th>
+      <td mat-cell *matCellDef="let element">{{element.realName}}</td>
+    </ng-container>
+
+    <ng-container matColumnDef="identitycard">
+      <th mat-header-cell *matHeaderCellDef>帐号</th>
+      <td mat-cell *matCellDef="let element">{{element.name}}</td>
+    </ng-container>
+
+    <ng-container matColumnDef="post">
+      <th mat-header-cell *matHeaderCellDef>职务</th>
+      <td mat-cell *matCellDef="let element">
+        <span *ngFor="let item of element.posts">
+          {{item.name}}
+        </span>
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="operation">
+      <th mat-header-cell *matHeaderCellDef>操作</th>
+      <td mat-cell *matCellDef="let element">
+        <span class="operationSpan"><mat-icon class="icon">assessment</mat-icon><span class="spanbtn blue">查看学习记录</span></span>
+        <span class="operationSpan"><mat-icon class="icon">cached</mat-icon><span class="spanbtn blue" (click)="reset(element)">重置密码</span></span>
+        <span class="operationSpan"><mat-icon class="icon">edit</mat-icon><span class="spanbtn blue" (click)="edit(element)">修改</span></span>
+        <span *ngIf="element.enabled" class="operationSpan"><mat-icon class="icon" style="color: rgb(245, 34, 45);">remove_circle</mat-icon><span class="spanbtn blue" (click)="noEnabled(element)">禁用</span></span>
+        <span *ngIf="!element.enabled" class="operationSpan"><mat-icon class="icon" style="color: gray;">remove_circle</mat-icon><span class="spanbtn gray" (click)="enabled(element)">禁用</span></span>
+        <span class="operationSpan"><mat-icon class="icon">delete</mat-icon><span class="spanbtn red" (click)="delete(element)">删除</span></span>
+      </td>
+    </ng-container>
+
+    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+    <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
+</table>
+<mat-paginator [length]="length"
+    [pageSize]="pageSize"
+    [pageSizeOptions]="pageSizeOptions"
+    (page)="chagePage($event)">
+</mat-paginator>
+

src/app/ui/teacherManagement/enterpriseuser.component.scss

@@ -0,0 +1,63 @@
+table {
+    width: 100%;
+    text-align: center;
+    .cdk-header-cell {
+      text-align: center;
+    }
+  }
+.maginleft {
+  margin-left: 5px;
+}
+
+
+
+.header {
+  width: 100%;
+  padding: 10px;
+  margin-bottom: 10px;
+  box-sizing: border-box;
+  .queryBox {
+    box-sizing: border-box;
+    padding: 5px 15px;
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    align-items:center;
+    justify-content:center;
+    .queryField {
+      margin: 0 15px;
+      font-size: 14px;
+      input {
+        width: 280px;
+        height: 22px;
+        line-height: 22px;
+        // border-radius: 3px;
+      }
+    }
+    .btnbox{
+      float: right;
+    }
+
+  } //queryBox
+}
+
+.operationSpan{
+  margin: 0 5px;
+  .spanbtn:hover{
+    text-decoration: underline;
+    cursor: pointer;
+  }
+  .blue{
+    color:rgb(24, 144, 255) ;
+  }
+  .red{
+    color: rgb(245, 34, 45);
+  }
+  .gray{
+    color: gray;
+  }
+}
+.icon{
+  font-size: 18px;
+  vertical-align: top;
+}

src/app/ui/teacherManagement/enterpriseuser.component.ts

@@ -0,0 +1,299 @@
+import { Component, OnInit, ViewChild, Inject } from '@angular/core';
+import {HttpClient} from '@angular/common/http'
+import { MatDialogRef, MatDialog, MAT_DIALOG_DATA } from '@angular/material/dialog';
+import { MatPaginator } from '@angular/material/paginator';
+import { MatTableDataSource } from '@angular/material/table';
+import { PageEvent } from '@angular/material/paginator';
+import { AddTeacher } from './addenterpriseuser.component'
+import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar';
+import {FormControl} from '@angular/forms';
+
+@Component({
+  selector: 'app-enterpriseuser',
+  templateUrl: './enterpriseuser.component.html',
+  styleUrls: ['./enterpriseuser.component.scss']
+})
+export class TeacherManagementComponent implements OnInit {
+
+  constructor(public http: HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar) { }
+  
+  ngOnInit() {
+    this.initData()
+  }
+
+  displayedColumns: string[] = ['name', 'identitycard', 'post', 'operation',];
+  dataSource:any;   //所有企业用户
+
+  userLogin:string; //搜索账号
+  userName:string; //搜索名称
+  creditcode:string//统一社会信用代码
+
+  name:any //姓名
+  identityCard:any //身份证
+
+  //分页
+  @ViewChild(MatPaginator, {static: true}) 
+  pageEvent: PageEvent;
+  paginator: MatPaginator;
+  length:any; //共多少条数据
+  pageSize:any; //每页条数
+  pageSizeOptions: number[] = [10] //设置每页条数
+  pageNumber:number = 1; //第几页
+
+  //分页切换
+  chagePage (e) {
+    this.pageNumber = e.pageIndex+1
+    let data= {
+      Name: this.identityCard || '',
+      RealName: this.name || '',
+      RoleType: '1',
+      PageNumber: String(this.pageNumber),
+    }
+    this.http.get('/api/Users',{params:data}).subscribe((data:any)=>{
+      this.length = data.totalCount
+      this.pageSize = data.pageSize
+      this.dataSource = new MatTableDataSource<any>(data.items)
+    })
+  }
+
+  //页面初始化 + 查询 + 重置
+  initData () {
+    let data= {
+      Name: this.identityCard || '',
+      RealName: this.name || '',
+      RoleType: '1',
+    }
+    this.http.get('/api/Users',{params:data}).subscribe((data:any)=>{
+      console.log(666,data)
+      this.length = data.totalCount
+      this.pageSize = data.pageSize
+      this.pageEvent.pageIndex = 0
+      this.dataSource = new MatTableDataSource<any>(data.items)
+    })
+  }
+
+  //更新当前页数据
+  getAllUsers () {
+    let data= {
+      Name: this.identityCard || '',
+      RealName: this.name || '',
+      RoleType: '1',
+      PageNumber: String(this.pageNumber),
+    }
+    this.http.get('/api/Users',{params:data}).subscribe((data:any)=>{
+      this.length = data.totalCount
+      this.pageSize = data.pageSize
+      this.dataSource = new MatTableDataSource<any>(data.items)
+    })
+  }
+
+  //清空搜索
+  empty () {
+    this.identityCard = ''
+    this.name = ''
+    this.initData()
+  }
+  
+  //创建教员
+  open(){
+    let dialogRef = this.dialog.open(AddTeacher, {//调用open方法打开对话框并且携带参数过去
+      width: '250px',
+    });
+    dialogRef.afterClosed().subscribe(data=>{
+      if (data) {
+        const config = new MatSnackBarConfig();
+        config.verticalPosition = 'top';
+        config.duration = 3000
+        this.snackBar.open('创建成功!','确定',config);
+        this.getAllUsers()
+      }
+    });
+  }
+
+  //编辑企业用户
+  edit (e) {
+    let dialogRef = this.dialog.open(editTeacher,{
+      width: '250px',
+      data:e
+    });
+    dialogRef.afterClosed().subscribe(data=>{
+      if (data) {
+        const config = new MatSnackBarConfig();
+        config.verticalPosition = 'top';
+        config.duration = 3000
+        this.snackBar.open('修改成功!','确定',config);  
+        this.getAllUsers()
+      }
+    });
+  }
+
+  //重置密码
+  reset (e) {
+    this.http.put(`/api/Users/${e.name}/ResetPassword`,{}).subscribe(
+      data=>{
+        const config = new MatSnackBarConfig();
+        config.verticalPosition = 'top';
+        config.duration = 3000
+        this.snackBar.open('重置密码成功!','确定',config);
+      },err=>{
+        const config = new MatSnackBarConfig();
+        config.verticalPosition = 'top';
+        config.duration = 3000
+        this.snackBar.open('重置密码失败!','确定',config);
+      })
+  }
+
+  //查看企业信息
+  see (e) {
+    // this.http.get(`/api/CompanyUsers/${e.name}`).subscribe(
+    //   data=> {
+    //     let dialogRef = this.dialog.open(seeTeacher, {data});
+    //     dialogRef.afterClosed().subscribe(); 
+    //   }
+    // )
+  }
+
+  //启用
+  enabled (e) {
+    let date = new Date()
+    let body = {
+      name : e.name,
+      realName : e.realName,
+      roleType : e.roleType,
+      enabled : true,
+      creationTime : date,
+      posts : e.posts
+    }
+    this.http.put(`/api/Users/${e.name}`,body).subscribe(data => {
+      const config = new MatSnackBarConfig();
+      config.verticalPosition = 'top';
+      config.duration = 3000;
+      this.snackBar.open('启用成功!','确定',config);
+      this.getAllUsers();
+    })
+  }
+
+  //禁用
+  noEnabled (e) {
+    let date = new Date()
+    let body = {
+      name : e.name,
+      realName : e.realName,
+      roleType : e.roleType,
+      enabled : false,
+      creationTime : date,
+      posts : e.posts
+    }
+    this.http.put(`/api/Users/${e.name}`,body).subscribe(data => {
+      const config = new MatSnackBarConfig();
+      config.verticalPosition = 'top';
+      config.duration = 3000;
+      this.snackBar.open('禁用成功!','确定',config);
+      this.getAllUsers();
+    })
+  }
+
+
+  //删除
+  delete (e) {
+    let isTrue = confirm('您确定要删除吗')
+    if (isTrue) {
+      this.http.delete(`/api/Users/${e.name}`).subscribe(data=>{
+        const config = new MatSnackBarConfig();
+        config.verticalPosition = 'top';
+        config.duration = 3000
+        this.snackBar.open('删除成功!','确定',config);
+        this.getAllUsers()
+      })
+    }
+  }
+
+
+
+}
+
+
+
+//编辑企业用户
+@Component({
+  selector: 'app-editenterpriseuser',
+  templateUrl: './editenterpriseuser.html',
+  styleUrls: ['./enterpriseuser.component.scss']
+})
+export class editTeacher {
+
+  toppings:any = new FormControl();
+  constructor(private http: HttpClient,public dialogRef: MatDialogRef<editTeacher>,@Inject(MAT_DIALOG_DATA) public data) {}
+  errmsg:any; //捕获错误信息
+  detachmentPosts: any = []//支队职务列表
+  brigadePosts: any = []//大队职务列表
+  RescueStationPosts: any = []//救援站职务列表
+
+  IdNumber:any //身份证号
+  realName:any //真实姓名
+  ngOnInit(): void {
+    this.toppings.value = []
+    this.IdNumber = this.data.name
+    this.realName = this.data.realName
+    this.data.posts.forEach((item) => {
+      this.toppings.value.push(item.id)
+    })
+    this.getAllPosts()
+  }
+
+  //获得所有职务
+  getAllPosts(){
+    this.http.get("/api/Posts").subscribe( (data:any) =>{
+      console.log(123,data)
+      data.forEach(item => {
+        if(item.name.indexOf("支队级") != -1){
+          this.detachmentPosts.push(item)
+        }else if(item.name.indexOf("大队级") != -1){
+          this.brigadePosts.push(item)
+        }else{
+          this.RescueStationPosts.push(item)
+        }
+      });
+    })  
+  }
+
+
+  //提交创建表单
+  onSubmit (e) {
+    let date = new Date()
+    let postsArr = this.toppings.value
+    let postsObj = []
+    postsArr.forEach((item) => {
+      postsObj.push({id:item, name:""})
+    })
+    let body = {
+      name : this.data.name,
+      realName : e.realName,
+      roleType : 2,
+      enabled : this.data.enabled,
+      creationTime : date,
+      posts : postsObj
+    }
+    this.http.put(`/api/Users/${this.data.name}`,body).subscribe(data => {
+      this.dialogRef.close("修改成功");
+    })
+  }
+
+}
+
+
+
+//查看企业用户
+@Component({
+  selector: 'app-seeenterpriseuser',
+  templateUrl: './seeenterpriseuser.html',
+  styleUrls: ['./enterpriseuser.component.scss']
+})
+export class seeTeacher {
+
+  constructor(public http: HttpClient,public dialog: MatDialog,
+  @Inject(MAT_DIALOG_DATA) public data) { }
+  
+  ngOnInit() {}
+
+}

src/app/ui/ui-routing.module.ts

@@ -2,9 +2,11 @@ import { Routes, RouterModule } from '@angular/router';
 import { NgModule } from '@angular/core';
 import { AllFileComponent } from './all-file/all-file.component';
 import { EnterpriseuserComponent } from './enterpriseuser/enterpriseuser.component';
+import { TeacherManagementComponent } from './teacherManagement/enterpriseuser.component';
 const routes: Routes = [
     { path: '', component:AllFileComponent },
-    { path: 'userManagement', component:EnterpriseuserComponent }
+    { path: 'userManagement', component:EnterpriseuserComponent },
+    { path: 'teacherManagement', component:TeacherManagementComponent }
 ];
 
 @NgModule({

src/app/ui/ui.module.ts

@@ -57,9 +57,11 @@ import { IsLoginService } from '../is-login.service';
 import { UploadFilesComponent } from './upload-files/upload-files.component';
 import {AddEnterpriserUser} from './enterpriseuser/addenterpriseuser.component';
 import {EnterpriseuserComponent,editenterpriseuser,seeenterpriseuser} from './enterpriseuser/enterpriseuser.component'
-
+import { myPaginator } from "./my-paginator"
+import { TeacherManagementComponent, editTeacher, seeTeacher } from './teacherManagement/enterpriseuser.component';
+import { AddTeacher } from './teacherManagement/addenterpriseuser.component';
 @NgModule({
-  declarations: [FolderDialog,ViewDetails,PersonaldataComponent, ChangepasswordComponent,SizePipe,NamePipe,NamePipe2,ConfirmpswDirective, AllFileComponent, ChangeuserdataComponent, LoginComponent, UploadFilesComponent,AddEnterpriserUser,EnterpriseuserComponent,editenterpriseuser,seeenterpriseuser],
+  declarations: [FolderDialog,ViewDetails,PersonaldataComponent, ChangepasswordComponent,SizePipe,NamePipe,NamePipe2,ConfirmpswDirective, AllFileComponent, ChangeuserdataComponent, LoginComponent, UploadFilesComponent,AddEnterpriserUser,EnterpriseuserComponent,editenterpriseuser,seeenterpriseuser,TeacherManagementComponent,editTeacher,AddTeacher,seeTeacher],
 
   imports: [
     CommonModule,
@@ -113,7 +115,8 @@ import {EnterpriseuserComponent,editenterpriseuser,seeenterpriseuser} from './en
   ],
   exports: [
     AllFileComponent
-  ]
+  ],
+  providers: [ { provide: MatPaginatorIntl, useValue: myPaginator() } ]
 
 })
 export class UiModule { }

src/styles.scss

@@ -78,5 +78,8 @@ table td.mat-footer-cell:last-of-type{
 }
 .mat-tab-body-content{
 	overflow: hidden!important;
-	// text-align: center;
+}
-}
+.mat-select-panel {
+	  width: 210px;
+	  font-size: 13px!important;
+}