shaojiahao
/
Sinopec-Anxin
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

[优化]用户管理页面优化

beijing
邵佳豪 2 years ago
parent
0e279ac44e
commit
93fe6df68f
4 changed files with 153 additions and 97 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 1
      src/app/pages/home/home.component.ts
  2. 162
      src/app/system-management/system-management.module.ts
  3. 44
      src/app/system-management/user/user.component.html
  4. 43
      src/app/system-management/user/user.component.scss

1
src/app/pages/home/home.component.ts
Unescape View File

@ -507,7 +507,6 @@ export class HomeComponent implements OnInit {
}
navChange2() {
for (let index = 0; index < this.menu3.length; index++) {
let url = ""
for (let k = 0; k < this.tap.length; k++) {
if (this.tap[k] == this.menu3[index].name) {
this.menuList2.push(this.menu3[index])

162
src/app/system-management/system-management.module.ts
Unescape View File

@ -1,56 +1,86 @@
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { SystemRoutingModule } from './system-management-routing.module';
import { OrganizationComponent } from './organization/organization.component';
import { UserComponent } from './user/user.component';
import { RoleComponent } from './role/role.component';
import { NavigationComponent } from './navigation/navigation.component';
import { NzLayoutModule } from 'ng-zorro-antd/layout';
import { NzIconModule } from 'ng-zorro-antd/icon';
import { NzTableModule } from 'ng-zorro-antd/table';
import { NzDropDownModule } from 'ng-zorro-antd/dropdown';
import { NzPaginationModule } from 'ng-zorro-antd/pagination';
import { NzInputModule } from 'ng-zorro-antd/input';
import { NzButtonModule } from 'ng-zorro-antd/button';
import { NzFormModule } from 'ng-zorro-antd/form';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { NzModalModule } from 'ng-zorro-antd/modal';
import { AdduserComponent } from './user/adduser/adduser.component';
import { EdituserComponent } from './user/edituser/edituser.component';
import { NzSelectModule } from 'ng-zorro-antd/select';
import { NzMessageModule } from 'ng-zorro-antd/message';
import { NzTreeModule } from 'ng-zorro-antd/tree';
import { AddroleComponent } from './role/addrole/addrole.component';
import { EditroleComponent } from './role/editrole/editrole.component';
import { NzSpinModule } from 'ng-zorro-antd/spin';
import { NzTreeSelectModule } from 'ng-zorro-antd/tree-select';
import { AddorComponent } from './organization/addor/addor.component';
import { EditorComponent } from './organization/editor/editor.component';
import { NzCheckboxModule } from 'ng-zorro-antd/checkbox';
import { AnalysisOfTheHostComponent } from './analysis-of-the-host/analysis-of-the-host.component';
import { AddhostComponent } from './analysis-of-the-host/addhost/addhost.component';
import { EdithostComponent } from './analysis-of-the-host/edithost/edithost.component';
import { AddcameraComponent } from './analysis-of-the-host/addcamera/addcamera.component';
import { EditcameraComponent } from './analysis-of-the-host/editcamera/editcamera.component';
import { PushComponent } from './push/push.component';
import { EditPushItemComponent } from './push/edit-push-item/edit-push-item.component';
import { FileOfLicenseComponent } from './file-of-license/file-of-license.component';
import { UpdateOfLicenseComponent } from './update-of-license/update-of-license.component';
import { AddFileOfLicenseComponent } from './file-of-license/add-file-of-license/add-file-of-license.component';
import { EditFileOfLicenseComponent } from './file-of-license/edit-file-of-license/edit-file-of-license.component';
import { AddUpdateOfLicenseComponent } from './update-of-license/add-update-of-license/add-update-of-license.component';
import { EditUpdateOfLicenseComponent } from './update-of-license/edit-update-of-license/edit-update-of-license.component';
import { MenuComponent } from './menu/menu.component';
import { AddmenuComponent } from './menu/addmenu/addmenu.component';
import { EditmenuComponent } from './menu/editmenu/editmenu.component';
import { MenusComponent } from './role/menus/menus.component';
import { PagesModule } from '../pages/pages.module';
import { WarningEventsComponent } from './organization/warning-events/warning-events.component';
import { NzSwitchModule } from 'ng-zorro-antd/switch';
import { NzNotificationModule } from 'ng-zorro-antd/notification';
import { DragDropModule } from '@angular/cdk/drag-drop';
import { NgModule } from "@angular/core";
import { CommonModule } from "@angular/common";
import { SystemRoutingModule } from "./system-management-routing.module";
import { OrganizationComponent } from "./organization/organization.component";
import { UserComponent } from "./user/user.component";
import { RoleComponent } from "./role/role.component";
import { NavigationComponent } from "./navigation/navigation.component";
import { NzLayoutModule } from "ng-zorro-antd/layout";
import { NzIconModule } from "ng-zorro-antd/icon";
import { NzTableModule } from "ng-zorro-antd/table";
import { NzDropDownModule } from "ng-zorro-antd/dropdown";
import { NzPaginationModule } from "ng-zorro-antd/pagination";
import { NzInputModule } from "ng-zorro-antd/input";
import { NzButtonModule } from "ng-zorro-antd/button";
import { NzFormModule } from "ng-zorro-antd/form";
import { FormsModule, ReactiveFormsModule } from "@angular/forms";
import { NzModalModule } from "ng-zorro-antd/modal";
import { AdduserComponent } from "./user/adduser/adduser.component";
import { EdituserComponent } from "./user/edituser/edituser.component";
import { NzSelectModule } from "ng-zorro-antd/select";
import { NzMessageModule } from "ng-zorro-antd/message";
import { NzTreeModule } from "ng-zorro-antd/tree";
import { AddroleComponent } from "./role/addrole/addrole.component";
import { EditroleComponent } from "./role/editrole/editrole.component";
import { NzSpinModule } from "ng-zorro-antd/spin";
import { NzTreeSelectModule } from "ng-zorro-antd/tree-select";
import { AddorComponent } from "./organization/addor/addor.component";
import { EditorComponent } from "./organization/editor/editor.component";
import { NzCheckboxModule } from "ng-zorro-antd/checkbox";
import { AnalysisOfTheHostComponent } from "./analysis-of-the-host/analysis-of-the-host.component";
import { AddhostComponent } from "./analysis-of-the-host/addhost/addhost.component";
import { EdithostComponent } from "./analysis-of-the-host/edithost/edithost.component";
import { AddcameraComponent } from "./analysis-of-the-host/addcamera/addcamera.component";
import { EditcameraComponent } from "./analysis-of-the-host/editcamera/editcamera.component";
import { PushComponent } from "./push/push.component";
import { EditPushItemComponent } from "./push/edit-push-item/edit-push-item.component";
import { FileOfLicenseComponent } from "./file-of-license/file-of-license.component";
import { UpdateOfLicenseComponent } from "./update-of-license/update-of-license.component";
import { AddFileOfLicenseComponent } from "./file-of-license/add-file-of-license/add-file-of-license.component";
import { EditFileOfLicenseComponent } from "./file-of-license/edit-file-of-license/edit-file-of-license.component";
import { AddUpdateOfLicenseComponent } from "./update-of-license/add-update-of-license/add-update-of-license.component";
import { EditUpdateOfLicenseComponent } from "./update-of-license/edit-update-of-license/edit-update-of-license.component";
import { MenuComponent } from "./menu/menu.component";
import { AddmenuComponent } from "./menu/addmenu/addmenu.component";
import { EditmenuComponent } from "./menu/editmenu/editmenu.component";
import { MenusComponent } from "./role/menus/menus.component";
import { PagesModule } from "../pages/pages.module";
import { WarningEventsComponent } from "./organization/warning-events/warning-events.component";
import { NzSwitchModule } from "ng-zorro-antd/switch";
import { NzNotificationModule } from "ng-zorro-antd/notification";
import { DragDropModule } from "@angular/cdk/drag-drop";
import { NzToolTipModule } from "ng-zorro-antd/tooltip";
@NgModule({
declarations: [OrganizationComponent, UserComponent, RoleComponent, NavigationComponent, AdduserComponent, EdituserComponent, AddroleComponent, EditroleComponent, AddorComponent, EditorComponent, AnalysisOfTheHostComponent, AddhostComponent, EdithostComponent, AddcameraComponent, EditcameraComponent, PushComponent, EditPushItemComponent, FileOfLicenseComponent, UpdateOfLicenseComponent, AddFileOfLicenseComponent, EditFileOfLicenseComponent, AddUpdateOfLicenseComponent, EditUpdateOfLicenseComponent, MenuComponent, AddmenuComponent, EditmenuComponent, MenusComponent, WarningEventsComponent],
declarations: [
OrganizationComponent,
UserComponent,
RoleComponent,
NavigationComponent,
AdduserComponent,
EdituserComponent,
AddroleComponent,
EditroleComponent,
AddorComponent,
EditorComponent,
AnalysisOfTheHostComponent,
AddhostComponent,
EdithostComponent,
AddcameraComponent,
EditcameraComponent,
PushComponent,
EditPushItemComponent,
FileOfLicenseComponent,
UpdateOfLicenseComponent,
AddFileOfLicenseComponent,
EditFileOfLicenseComponent,
AddUpdateOfLicenseComponent,
EditUpdateOfLicenseComponent,
MenuComponent,
AddmenuComponent,
EditmenuComponent,
MenusComponent,
WarningEventsComponent,
],
imports: [
CommonModule,
SystemRoutingModule,
@ -74,9 +104,29 @@ import { DragDropModule } from '@angular/cdk/drag-drop';
PagesModule,
NzSwitchModule,
NzNotificationModule,
DragDropModule
DragDropModule,
NzToolTipModule
],
entryComponents: [
AdduserComponent,
EdituserComponent,
AddroleComponent,
EditroleComponent,
AddorComponent,
EditorComponent,
AddhostComponent,
EdithostComponent,
AddcameraComponent,
EditcameraComponent,
EditPushItemComponent,
AddFileOfLicenseComponent,
EditFileOfLicenseComponent,
AddUpdateOfLicenseComponent,
EditUpdateOfLicenseComponent,
AddmenuComponent,
EditmenuComponent,
MenusComponent,
WarningEventsComponent,
],
entryComponents: [AdduserComponent, EdituserComponent, AddroleComponent, EditroleComponent, AddorComponent, EditorComponent, AddhostComponent, EdithostComponent, AddcameraComponent, EditcameraComponent, EditPushItemComponent, AddFileOfLicenseComponent, EditFileOfLicenseComponent, AddUpdateOfLicenseComponent, EditUpdateOfLicenseComponent, AddmenuComponent, EditmenuComponent, MenusComponent, WarningEventsComponent]
})
export class SystemManagementModule { }
export class SystemManagementModule {}

44
src/app/system-management/user/user.component.html
Unescape View File

@ -2,8 +2,7 @@
<div class="resetPasswordContent" *ngIf="isShowNewPassword" cdkDrag>
<div class="titlebox">
<i nz-icon class="move" cdkDragHandle>
<svg t="1676340756365" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
p-id="2843" width="18" height="18">
<svg class="icon" width="18" height="18">
<path
d="M501.0944 1021.824c6.9376 2.8928 14.8224 2.8928 21.8112 0 3.4304-1.4336 6.528-3.4816 9.1136-6.0672 0.0256 0 0.0768-0.0256 0.0768-0.0256l158.9248-158.9248c11.1104-11.1104 11.1104-29.1328 0-40.2176-11.0848-11.0848-29.0816-11.0848-40.1664 0.0256l-110.4384 110.4128 0.0256-335.36c0-15.6928-12.7232-28.416-28.416-28.416s-28.416 12.6976-28.416 28.3904l0 335.3856-110.4128-110.4128c-11.1104-11.0848-29.1072-11.0848-40.1408 0-11.1104 11.1104-11.136 29.1072-0.0512 40.192l158.9504 158.9248c0.8192 0.8192 1.8944 1.1776 2.816 1.8688C496.7168 1019.1872 498.688 1020.8256 501.0944 1021.824z"
fill="#272636" p-id="2844"></path>
@ -30,20 +29,18 @@
<div class="orbox">
<div class="topbox2">
<div class="lefttop">
<span>组织机构</span>
组织机构
</div>
<div class="righttop">
<nz-input-group nzPrefixIcon="search">
<input type="text" nz-input placeholder="请输入机构名称" [(ngModel)]="searchValue" />
</nz-input-group>
</div>
</div>
<div class="treeTitle">
组织机构
<div><label nz-checkbox [(ngModel)]="IsContainsChildren" (ngModelChange)="getAllOrganization()">是否包含子节点</label>
</div>
<span>组织机构</span>
<label nz-checkbox [(ngModel)]="IsContainsChildren" (ngModelChange)="getAllOrganization()">包含子节点</label>
</div>
<div class="treebox">
<nz-tree [nzSearchValue]="searchValue" #nzTreeComponent [nzData]="nodes" [nzExpandedKeys]="defaultExpandedKeys"
@ -96,11 +93,11 @@
<th></th>
<th>账号</th>
<th>姓名</th>
<th [width]="'30%'">角色/预警接收级别</th>
<th>所属机构</th>
<th *ngIf="level == 2">审核状态</th>
<th>用户状态</th>
<th [width]="'25%'">操作</th>
<th>角色/预警接收级别</th>
<th [width]="'13%'">所属机构</th>
<th [width]="'10%'" *ngIf="level == 2">审核状态</th>
<th [width]="'8%'">用户状态</th>
<th [width]="'10%'">操作</th>
</tr>
</thead>
<tbody>
@ -126,11 +123,24 @@
</ng-template>
</td>
<td class="operation">
<a (click)="editUser(data)">编辑</a>
<a (click)="resetPassword(data)">重置密码</a>
<a *ngIf="!data.isActive" class="greenColor2" (click)="cancel(data,true)">启用</a>
<a *ngIf="data.isActive" class="redColor" (click)="cancel(data,false)">停用</a>
<a class="redColor" (click)="delete(data)">注销</a>
<i class="blueColor" nz-icon nzType="form" nzTheme="outline" (click)="editUser(data)" nz-tooltip
nzTooltipTitle="编辑"></i>
<i nz-icon nz-tooltip nzTooltipTitle="重置密码" (click)="resetPassword(data)">
<svg width="14" height="14">
<path
d="M766.598 75.624c-112.55-65.312-250.07-87.553-385.693-51.212C110.437 96.883-50.07 374.89 22.4 645.357c72.472 270.468 350.479 430.975 620.946 358.504 270.467-72.472 430.975-350.479 358.503-620.946-0.211-0.789-0.424-1.577-0.639-2.363h-62.505a454.786 454.786 0 0 1 5.189 17.892c63.895 238.46-77.618 483.566-316.077 547.461-238.46 63.895-483.566-77.617-547.461-316.077-63.895-238.46 77.617-483.566 316.077-547.46 119.62-32.053 240.912-12.416 340.164 45.217l-42.383 73.409 217.66-6.997L809.104 2l-42.507 73.624z"
fill="#36A2FF" p-id="2327"></path>
<path
d="M442 447h140v-70c0-38.66-31.34-70-70-70s-70 31.34-70 70v70z m44 186.012V716h52v-82.988c25.786-10.321 44-35.54 44-65.012 0-38.66-31.34-70-70-70s-70 31.34-70 70c0 29.472 18.214 54.69 44 65.012zM390 447v-70c0-67.379 54.621-122 122-122 67.379 0 122 54.621 122 122v70h37c18.778 0 34 15.222 34 34v252c0 18.778-15.222 34-34 34H353c-18.778 0-34-15.222-34-34V481c0-18.778 15.222-34 34-34h37z"
fill="#36A2FF" p-id="2328"></path>
</svg>
</i>
<i *ngIf="!data.isActive" class="greenColor2" nz-icon nzType="stop" nzTheme="outline" nz-tooltip
nzTooltipTitle="启用" (click)="cancel(data,true)"></i>
<i *ngIf="data.isActive" class="redColor" nz-icon nzType="stop" nzTheme="outline" nz-tooltip
nzTooltipTitle="停用" (click)="cancel(data,false)"></i>
<i class="redColor" nz-icon nzType="poweroff" nzTheme="outline" nz-tooltip nzTooltipTitle="注销"
(click)="delete(data)"></i>
</td>
</tr>
</tbody>

43
src/app/system-management/user/user.component.scss
Unescape View File

@ -13,6 +13,8 @@
flex: 1;
overflow: auto;
flex-direction: column;
box-sizing: border-box;
padding: 10px 0;
}
.check {
@ -25,39 +27,30 @@
height: 36px;
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 20px;
.lefttop {
span {
color: #000D21;
margin-right: 16px;
}
.yellowspan {
color: rgb(240, 176, 37);
}
height: 36px;
line-height: 36px;
color: #000;
margin-right: 10px;
font-size: 15px;
}
.righttop {
flex: 1;
height: 36px;
display: flex;
margin-right: 10px;
width: 200px;
button {
margin-left: 16px;
}
nz-input-group {
height: 32px;
height: 36px;
}
}
}
.orbox {
width: 300px;
// height: 100%;
width: 260px;
min-width: 250px;
overflow-y: auto;
margin-right: 10px;
display: flex;
@ -70,14 +63,17 @@
line-height: 55px;
margin-top: 12px;
display: flex;
// justify-content: space-between;
justify-content: space-between;
color: #000D21;
box-sizing: border-box;
padding-left: 30px;
// padding-right: 180px;
padding: 0 10px;
background: rgba(145, 204, 255, 0.2);
border: 1px solid rgba(145, 204, 255, 0.2);
span {
font-size: 14px;
}
div {
flex: 1;
width: 100px;
@ -98,8 +94,9 @@
}
.operation {
a {
margin-right: 12px;
i {
cursor: pointer;
margin-right: 8px;
}
}
}

Write Preview
Loading…
Cancel
Save