[完善]页面跳转

src/app/pages/gis-home/card-list/card-list.component.html

@@ -0,0 +1,15 @@
+<div class="box" cdkDrag>
+    <div class="title" cdkDragHandle>
+        <span>
+            {{title}}
+        </span>
+        <span class="close" (click)="close()">
+            <i nz-icon nzType="close" nzTheme="outline"></i>
+        </span>
+    </div>
+    <div class="content">
+        <ul>
+            <li *ngFor="let item of data">{{item}}</li>
+        </ul>
+    </div>
+</div>

src/app/pages/gis-home/card-list/card-list.component.scss

@@ -0,0 +1,54 @@
+.box {
+  width: 280px;
+  font-size: 16px;
+  border: 1px solid #558DB1;
+}
+.title {
+  height: 32px;
+  line-height: 32px;
+  background-image: url(../../../../assets/gismap/listtitle.png);
+  background-size: 100% 100%;
+  background-repeat: no-repeat;
+  color: #fff;
+  box-sizing: border-box;
+  padding-left: 16px;
+  padding-right: 10px;
+  display: flex;
+  justify-content: space-between;
+  cursor: default;
+  .close{
+    cursor: pointer;
+  }
+}
+.content {
+  max-height: 250px;
+  overflow-y: auto;
+  ul{
+    margin-bottom: 0;
+  }
+  li {
+    height: 38px;
+    line-height: 38px;
+    padding-left: 16px;
+    padding-right: 10px;
+    color: #f7faff;
+    font-size: 15px;
+    cursor: pointer;
+  } 
+  li:nth-child(odd) {
+    background: linear-gradient(
+      90deg,
+      RGBA(17, 50, 83, 1),
+      RGBA(17, 50, 83, 0.8)
+    );
+  }
+  li:nth-child(even) {
+    background: linear-gradient(
+      90deg,
+      RGBA(38, 56, 73, 1),
+      RGBA(38, 56, 73, 0.8)
+    );
+    border-top: 1px solid #3e4f60;
+    border-bottom: 1px solid #3e4f60;
+  }
+}

src/app/pages/gis-home/card-list/card-list.component.ts

@@ -0,0 +1,20 @@
+import { Component, EventEmitter, Input, OnInit, Output } from "@angular/core";
+
+@Component({
+  selector: "app-card-list",
+  templateUrl: "./card-list.component.html",
+  styleUrls: ["./card-list.component.scss"],
+})
+export class CardListComponent implements OnInit {
+  @Input() title;
+  @Input() data;
+
+  @Output() childEvent = new EventEmitter<any>();
+  constructor() {}
+
+  ngOnInit(): void {}
+
+  close() {
+    this.childEvent.emit("closeCardList");
+  }
+}

src/app/pages/gis-home/gis-home.component.html

@@ -2,9 +2,10 @@
     <div id="mapDiv"></div>
     <div class="mask" style="pointer-events: none;"></div>
     <div class="leftBox">
-        <div class="left1 cardItem">
+        <div class="left1 cardItem"
+            (click)="urlTo('http://localhost:51423/planManagement/entryPlan?singleSignOn=true')">
             <app-card-title [title]="'预案统计'" [subtitle]="'Plan statistics'"></app-card-title>
-            <app-unit-title [num]="33"></app-unit-title>
+            <app-unit-title [num]="33" (childEvent)="handleChildData($event)"></app-unit-title>
             <div class="content">
                 <div id="echartleft1"></div>
             </div>
@@ -25,7 +26,8 @@
         </div>
     </div>
     <div class="rightBox">
-        <div class="right1 cardItem">
+
+        <div class="right1 cardItem" (click)="urlTo('/homepage')">
             <app-card-title [title]="'接入类型'" [subtitle]="'Intervention type'"></app-card-title>
             <div class="content">
                 <div class="accessList">
@@ -41,13 +43,13 @@
                 </div>
             </div>
         </div>
-        <div class="right2 cardItem">
+        <div class="right2 cardItem" (click)="urlTo('/todaywarning')">
             <app-card-title [title]="'预警统计'" [subtitle]="'Warning statistics'"></app-card-title>
             <div class="content">
                 <div id="echartright1"></div>
             </div>
         </div>
-        <div class="right3 cardItem">
+        <div class="right3 cardItem" (click)="urlTo('/records_nav/oliunloadinglist')">
             <app-card-title [title]="'卸油事件'" [subtitle]="'Oil unloading event'"></app-card-title>
             <div class="content">
                 <div id="echartright2"></div>
@@ -56,30 +58,7 @@
         </div>
     </div>
 
-    <!-- <div class="markerInfoWin">
-        <div class="icon icon1">
-            <img src="../../../assets/gismap/gis/1.png" alt="">
-        </div>
-        <div class="num">
-            36
-        </div>
-        <div class="icon icon2">
-            <img src="../../../assets/gismap/gis/2.png" alt="">
-        </div>
-        <div class="num">
-            36
-        </div>
-        <div class="icon icon3">
-            <img src="../../../assets/gismap/gis/3.png" alt="">
-        </div>
-        <div class="num">
-            36
-        </div>
-        <div class="icon icon4">
-            <img src="../../../assets/gismap/gis/4.png" alt="">
-        </div>
-        <div class="num">
-            36
-        </div>
-    </div> -->
+    <div class="unitList" [hidden]="!isConnectedUnit">
+        <app-card-list [title]="'已接入单位'" [data]="unitList1" (childEvent)="handleChildData($event)"></app-card-list>
+    </div>
 </div>

src/app/pages/gis-home/gis-home.component.scss

@@ -138,4 +138,9 @@
   bottom: 0;
 }
 
-
+.unitList {
+  position: absolute;
+  left: 24%;
+  top: 2%;
+  z-index: 500;
+}

src/app/pages/gis-home/gis-home.component.ts

@@ -1172,4 +1172,28 @@ export class GisHomeComponent implements OnInit {
   MapClick(e) {
     console.log("点击坐标:", e.lnglat.getLng() + "," + e.lnglat.getLat());
   }
+
+  urlTo(url) {
+    window.open(url);
+  }
+
+  unitList1 = ["广西有限公司", "重庆有限公司", "柳州有限公司"];
+  unitList2 = [
+    "芯恩集成电路有限公司",
+    "盛宏建材科技有限公司",
+    "高凯斯电子有限公司",
+    "君晟有限公司",
+    "昀朗建筑工程有限公司",
+    "必康有限公司",
+  ];
+  isConnectedUnit = false;
+  handleChildData(e) {
+    console.log(e);
+    if (e === "openCardList") {
+      this.isConnectedUnit = true;
+    }
+    if (e === "closeCardList") {
+      this.isConnectedUnit = false;
+    }
+  }
 }

src/app/pages/gis-home/unit-title/unit-title.component.html

@@ -2,5 +2,5 @@
     <div class="numbox">
         截至{{time}} , 已接入单位数 : <div class="num" *ngFor="let item of numArr">{{item}}</div> 家
     </div>
-    <button class="btn">选择</button>
-</div> 
+    <button class="btn" (click)="select($event)">选择</button>
+</div>

src/app/pages/gis-home/unit-title/unit-title.component.ts

@@ -1,4 +1,4 @@
-import { Component, Input, OnInit } from "@angular/core";
+import { Component, EventEmitter, Input, OnInit, Output } from "@angular/core";
 
 @Component({
   selector: "app-unit-title",
@@ -7,6 +7,8 @@ import { Component, Input, OnInit } from "@angular/core";
 })
 export class UnitTitleComponent implements OnInit {
   @Input() num: number;
+
+  @Output() childEvent = new EventEmitter<any>();
   constructor() {}
 
   time: string;
@@ -38,4 +40,9 @@ export class UnitTitleComponent implements OnInit {
         this.numArr = str.split("");
     }
   }
+
+  select(event) {
+    event.stopPropagation();
+    this.childEvent.emit("openCardList");
+  }
 }

src/app/pages/home/home.component.html

@@ -1,8 +1,8 @@
 <div class="box">
   <div class="menu">
-    <div class="boxleft">
+    <!-- <div class="boxleft">
       <img *ngIf="isProd" src="../../../assets/images/logo2.png" alt="">
-    </div>
+    </div> -->
     <!-- <div class="libox" *ngIf="!isGasStationNav">
       <li *ngFor="let item of menuList1" (click)="routerChange(item)"
         [ngClass]="{'router-link-active': item.name == selectedItem}">

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

@@ -41,16 +41,13 @@ export class HomeComponent implements OnInit {
     private listRefreshService: listRefreshService,
     private http: HttpClient,
     private router: Router,
-    private navChangeService: NavChangeService,
     public token: CacheTokenService,
     private message: NzMessageService,
     private notificationService: NzNotificationService,
     private modal: NzModalService,
     private viewContainerRef: ViewContainerRef,
     private fb: FormBuilder,
-    private selectedMenu: SelectedMenu,
-    private location: Location,
-    private patternService: PatternService
+    private location: Location
   ) {
     const { password } = MyValidators;
 
@@ -95,7 +92,7 @@ export class HomeComponent implements OnInit {
   ];
 
   menubeijing = [
-    // { name: "首页", url: "/homepage" },
+    { name: "首页", url: "/homepage" },
     // { name: "数字油站", url: "/plan" },
     { name: "今日预警", url: "/todaywarning" },
     { name: "预警记录", url: "/records_nav" },
@@ -108,13 +105,13 @@ export class HomeComponent implements OnInit {
   menuList2 = [];
   selectedItem;
   routerChange(item) {
-    if (JSON.parse(sessionStorage.getItem("isGasStation"))) {
-      let a = JSON.parse(sessionStorage.getItem("3dSceneData"));
-      if (!a.hasBuildingInfo && item.url == "/plan/petrolStation") {
-        this.message.info("当前油站未开通!");
-        return;
-      }
-    }
+    // if (JSON.parse(sessionStorage.getItem("isGasStation"))) {
+    //   let a = JSON.parse(sessionStorage.getItem("3dSceneData"));
+    //   if (!a.hasBuildingInfo && item.url == "/plan/petrolStation") {
+    //     this.message.info("当前油站未开通!");
+    //     return;
+    //   }
+    // }
 
     if (item.name == this.selectedItem) {
       return;
@@ -123,41 +120,9 @@ export class HomeComponent implements OnInit {
     this.selectedItem = item.name;
     this.router.navigate([item.url]);
   }
-  isProd: boolean;
-  ngOnInit(): void {
-    this.isProd = this.patternService.isProd;
-    this.location.subscribe((event) => {
-      console.log("走这里了吗？？？？？？？？？？？？？？？？？？？？？？？");
-
-      if (event.url == "/homepage") {
-        sessionStorage.setItem("selectedMenu", "首页");
-        this.selectedItem = "首页";
-      } else if (event.url == "/plan" || event.url == "/plan/petrolStation") {
-        sessionStorage.setItem("selectedMenu", "数字油站");
-        this.selectedItem = "数字油站";
-      } else if (
-        event.url == "/todaywarning" ||
-        event.url == "/todaywarning/petrolStation"
-      ) {
-        sessionStorage.setItem("selectedMenu", "今日预警");
-        this.selectedItem = "今日预警";
-      } else if (event.url.indexOf("/records_nav") != -1) {
-        if (event.url == "/records_nav") {
-          this.router.navigate(["/records_nav/all"]);
-        } else if (event.url == "/records_nav/petrolStation") {
-          this.router.navigate(["/records_nav/petrolStation/all"]);
-        }
-        sessionStorage.setItem("selectedMenu", "预警记录");
-        this.selectedItem = "预警记录";
-      } else if (
-        event.url == "/license" ||
-        event.url == "/license/petrolStation"
-      ) {
-        sessionStorage.setItem("selectedMenu", "证照管理");
-        this.selectedItem = "证照管理";
-      }
-    });
 
+  ngOnInit(): void {
+    this.initSelectedItem(this.router);
     let a = sessionStorage.getItem("userdata");
     this.userMenu = JSON.parse(a).menus;
     for (let index = 0; index < this.userMenu.length; index++) {
@@ -169,33 +134,6 @@ export class HomeComponent implements OnInit {
     }
 
     this.isGasStation = JSON.parse(sessionStorage.getItem("isGasStation"));
-    //初始化登陆 如果是油站用户
-    if (this.isGasStation) {
-      this.isGasStationNav = true;
-      for (let index = 0; index < this.menu2.length; index++) {
-        for (let k = 0; k < this.tap.length; k++) {
-          if (this.tap[k] == this.menu2[index].name) {
-            this.menuList1.push(this.menu2[index]);
-          }
-        }
-      }
-    } else {
-      //初始化登陆 如果是管理者用户
-      this.isGasStationNav = false;
-      this.isGasStationBack = false;
-      for (let index = 0; index < this.menu1.length; index++) {
-        for (let k = 0; k < this.tap.length; k++) {
-          if (this.tap[k] == this.menu1[index].name) {
-            this.menuList1.push(this.menu1[index]);
-          }
-        }
-      }
-      for (let index = 0; index < this.tap.length; index++) {
-        if (this.tap[index] == "系统管理") {
-          this.xitongguanli = true;
-        }
-      }
-    }
 
     this.router.events
       .pipe(filter((event) => event instanceof NavigationEnd))
@@ -253,6 +191,36 @@ export class HomeComponent implements OnInit {
     this.getWarningSwitch();
   }
 
+  initSelectedItem(event) {
+    if (event.url == "/homepage") {
+      sessionStorage.setItem("selectedMenu", "首页");
+      this.selectedItem = "首页";
+    } else if (event.url == "/plan" || event.url == "/plan/petrolStation") {
+      sessionStorage.setItem("selectedMenu", "数字油站");
+      this.selectedItem = "数字油站";
+    } else if (
+      event.url == "/todaywarning" ||
+      event.url == "/todaywarning/petrolStation"
+    ) {
+      sessionStorage.setItem("selectedMenu", "今日预警");
+      this.selectedItem = "今日预警";
+    } else if (event.url.indexOf("/records_nav") != -1) {
+      if (event.url == "/records_nav") {
+        this.router.navigate(["/records_nav/all"]);
+      } else if (event.url == "/records_nav/petrolStation") {
+        this.router.navigate(["/records_nav/petrolStation/all"]);
+      }
+      sessionStorage.setItem("selectedMenu", "预警记录");
+      this.selectedItem = "预警记录";
+    } else if (
+      event.url == "/license" ||
+      event.url == "/license/petrolStation"
+    ) {
+      sessionStorage.setItem("selectedMenu", "证照管理");
+      this.selectedItem = "证照管理";
+    }
+  }
+
   isWarningVoice = true; //预警声音
   isWarningWindow = true; //预警弹窗
   /**

src/app/pages/login/login.component.ts

@@ -253,7 +253,7 @@ export class LoginComponent implements OnInit {
                 //   //
 
                 // }
-                this.router.navigate(["/todaywarning"]);
+                this.router.navigate(["/gishome"]);
                 this.message.create("success", `登录成功`);
               },
               (err) => {

src/app/pages/pages.module.ts

@@ -97,10 +97,11 @@ import { AnxinImgLookComponent } from './oil-unloading-process/anxin-img-look/an
 import { GisHomeComponent } from './gis-home/gis-home.component';
 import { CardTitleComponent } from './gis-home/card-title/card-title.component';
 import { UnitTitleComponent } from './gis-home/unit-title/unit-title.component';
+import { CardListComponent } from './gis-home/card-list/card-list.component';
 @NgModule({
   declarations: [LoginComponent, RegisterComponent, HomeComponent, PlanComponent, TodayWarningComponent, CriminalRecordsComponent,
     TodayWarningAdminComponent, CriminalRecordsAdminComponent, LeftDomainComponent, EquipmentInfoComponent, OilStationInfoComponent,
-    AddequipmentComponent, EditequipmentComponent, PlanAdminComponent, GetOutOfLineDetailsComponent, DispositionComponent, OilUnloadingProcessComponent, HomePageComponent, OilUnloadingProcessListComponent, ChangePasswordComponent, FacilitySortPipe, WarningStatisticsListComponent, DisposeequipmentComponent, NavBarComponent, InformComponent, UpdateCategoryComponent, FileCategoryComponent, HistoriesComponent, EditUpdateCategoryComponent, DetailsUpdateCategoryComponent, EditFileCategoryComponent, DetailsFileCategoryComponent, PdfWordLookComponent, OilStationListComponent, UpdateLicenseListComponent, FileLicenseListComponent, AuditNavComponent, AuditIngComponent, AuditRecordComponent, AuditInformTimeComponent, AuditDisposeComponent, EditInformTimeComponent, AuditDetailsInformTimeComponent, auditStatusPipe, GasBaseInfoComponent, notificationContent, licenseViolationType, handleState, AnnualInspectionComponent, EditAnnualInspectionComponent, RecordsNavComponent, UserDetailsComponent, AppealDetailsComponent, fileName, SystemModelComponent, ForgetComponent, HomePageNologinComponent, DownImageComponent, ImgLookComponent, AnxinImgLookComponent, GisHomeComponent, CardTitleComponent, UnitTitleComponent],
+    AddequipmentComponent, EditequipmentComponent, PlanAdminComponent, GetOutOfLineDetailsComponent, DispositionComponent, OilUnloadingProcessComponent, HomePageComponent, OilUnloadingProcessListComponent, ChangePasswordComponent, FacilitySortPipe, WarningStatisticsListComponent, DisposeequipmentComponent, NavBarComponent, InformComponent, UpdateCategoryComponent, FileCategoryComponent, HistoriesComponent, EditUpdateCategoryComponent, DetailsUpdateCategoryComponent, EditFileCategoryComponent, DetailsFileCategoryComponent, PdfWordLookComponent, OilStationListComponent, UpdateLicenseListComponent, FileLicenseListComponent, AuditNavComponent, AuditIngComponent, AuditRecordComponent, AuditInformTimeComponent, AuditDisposeComponent, EditInformTimeComponent, AuditDetailsInformTimeComponent, auditStatusPipe, GasBaseInfoComponent, notificationContent, licenseViolationType, handleState, AnnualInspectionComponent, EditAnnualInspectionComponent, RecordsNavComponent, UserDetailsComponent, AppealDetailsComponent, fileName, SystemModelComponent, ForgetComponent, HomePageNologinComponent, DownImageComponent, ImgLookComponent, AnxinImgLookComponent, GisHomeComponent, CardTitleComponent, UnitTitleComponent, CardListComponent],
 
 
   imports: [

src/app/pages/records/records-nav/records-nav.component.ts

@@ -18,35 +18,16 @@ export class RecordsNavComponent implements OnInit {
   menuList = ["预警类型统计", "卸油统计", "证照预警统计"];
   tap = [];
   userMenu = [];
-  menu = ["预警类型统计"];
-  selectedMenu = "预警类型统计";
+  menu = ["预警类型统计", "卸油统计"];
+  selectedMenu;
   ngOnInit(): void {
-    // let a= sessionStorage.getItem('userdata')
-    // this.userMenu=JSON.parse(a).menus
-    // console.log('this.userMenu',this.userMenu);
-    // for (let index = 0; index < this.userMenu.length; index++) {
-    //   let a=this.userMenu[index].name
-    //   this.tap.push(a)
-
-    // }
-    // console.log(this.tap);
-
-    // if (this.userMenu.length==0) {
-    //   this.menu=this.menuList
-    // }else{
-    //   for (let index = 0; index < this.menuList.length; index++) {
-
-    //     for (let k = 0; k < this.tap.length; k++) {
-    //       if (this.tap[k]==this.menuList[index]) {
-    //         this.menu.push(this.tap[k])
-    //         console.log( this.menu);
-    //       }
-
-    //     }
-
-    //   }
-    // }
-    // this.selectedMenu = this.menu[0]
+    console.log(this.router);
+    if (this.router.url.indexOf("oliunloadinglist") !== -1) {
+      this.selectedMenu = "卸油统计";
+    }
+    if (this.router.url === "/records_nav") {
+      this.selectedMenu = this.menu[0];
+    }
     this.routerChange();
   }
 
@@ -60,6 +41,15 @@ export class RecordsNavComponent implements OnInit {
   }
 
   routerChange() {
+    console.log("this.selectedMenu", this.selectedMenu);
+    if (this.selectedMenu == "预警类型统计") {
+      this.router.navigate(["/records_nav/all"]);
+    } else if (this.selectedMenu == "卸油统计") {
+      this.router.navigate(["/records_nav/oliunloadinglist"]);
+    } else if (this.selectedMenu == "证照预警统计") {
+      this.router.navigate(["/records_nav/warningstatisticslist"]);
+    }
+    return;
     if (sessionStorage.getItem("isGasStation") == "false") {
       if (this.selectedMenu == "预警类型统计") {
         this.router.navigate(["/records_nav/all"]);