优化

YLShipBuildLandMap.Entity/BackBdBuildingXyAxis.cs

@@ -0,0 +1,15 @@
+using System;
+using System.Collections.Generic;
+
+#nullable disable
+
+namespace YLShipBuildLandMap.Entity
+{
+    public partial class BackBdBuildingXyAxis
+    {
+        public Guid XyaxisId { get; set; }
+        public Guid? BuildingId { get; set; }
+        public decimal? Xaxis { get; set; }
+        public decimal? Yaxis { get; set; }
+    }
+}

YLShipBuildLandMap.Entity/BdBuildingXyAxis.cs

@@ -9,8 +9,8 @@ namespace YLShipBuildLandMap.Entity
     {
         public Guid XyaxisId { get; set; }
         public Guid? BuildingId { get; set; }
-        public int? Xaxis { get; set; }
-        public int? Yaxis { get; set; }
+        public decimal? Xaxis { get; set; }
+        public decimal? Yaxis { get; set; }
 
         public virtual BdBuilding Building { get; set; }
     }

YLShipBuildLandMap.Entity/ViewModel/Build/BuildingView.cs

@@ -20,11 +20,11 @@ namespace YLShipBuildLandMap.Entity.ViewModel.Build
     {
         public Guid? BuildingId { get; set; }
         public string BuildingName { get; set; }
-        public int? MinXAxis { get; set; }
-        public int? MaxXAxis { get; set; }
-        public int? MinYAxis { get; set; }
-        public int? MaxYAxis { get; set; }
-        public int? XCenter 
+        public decimal? MinXAxis { get; set; }
+        public decimal? MaxXAxis { get; set; }
+        public decimal? MinYAxis { get; set; }
+        public decimal? MaxYAxis { get; set; }
+        public decimal? XCenter 
         {
             get
             {
@@ -38,7 +38,7 @@ namespace YLShipBuildLandMap.Entity.ViewModel.Build
                 }
             }
         }
-        public int? YCenter
+        public decimal? YCenter
         {
             get
             {

YLShipBuildLandMap.Entity/YLShipBuildLandMapContext.cs

@@ -17,6 +17,7 @@ namespace YLShipBuildLandMap.Entity
         {
         }
 
+        public virtual DbSet<BackBdBuildingXyAxis> BackBdBuildingXyAxis { get; set; }
         public virtual DbSet<BdBuilding> BdBuilding { get; set; }
         public virtual DbSet<BdBuildingFloor> BdBuildingFloor { get; set; }
         public virtual DbSet<BdBuildingFloorRoom> BdBuildingFloorRoom { get; set; }
@@ -57,6 +58,25 @@ namespace YLShipBuildLandMap.Entity
         {
             modelBuilder.HasAnnotation("Relational:Collation", "Chinese_PRC_CI_AS");
 
+            modelBuilder.Entity<BackBdBuildingXyAxis>(entity =>
+            {
+                entity.HasNoKey();
+
+                entity.ToTable("back_BD_Building_XY_Axis");
+
+                entity.Property(e => e.BuildingId).HasColumnName("BuildingID");
+
+                entity.Property(e => e.Xaxis)
+                    .HasColumnType("decimal(18, 8)")
+                    .HasColumnName("XAxis");
+
+                entity.Property(e => e.XyaxisId).HasColumnName("XYAxisID");
+
+                entity.Property(e => e.Yaxis)
+                    .HasColumnType("decimal(18, 8)")
+                    .HasColumnName("YAxis");
+            });
+
             modelBuilder.Entity<BdBuilding>(entity =>
             {
                 entity.HasKey(e => e.BuildingId)
@@ -150,9 +170,13 @@ namespace YLShipBuildLandMap.Entity
 
                 entity.Property(e => e.BuildingId).HasColumnName("BuildingID");
 
-                entity.Property(e => e.Xaxis).HasColumnName("XAxis");
+                entity.Property(e => e.Xaxis)
+                    .HasColumnType("decimal(18, 8)")
+                    .HasColumnName("XAxis");
 
-                entity.Property(e => e.Yaxis).HasColumnName("YAxis");
+                entity.Property(e => e.Yaxis)
+                    .HasColumnType("decimal(18, 8)")
+                    .HasColumnName("YAxis");
 
                 entity.HasOne(d => d.Building)
                     .WithMany(p => p.BdBuildingXyAxis)

YLShipBuildLandMap.Web/wwwroot/app/main/map-index.html

@@ -4,7 +4,7 @@
     </div>
     <div class="search_panel">
         <div class="search_label">
-            <input type="text" style="" ng-model="searchInput" />
+            <input type="text" style="" ng-model="searchInput" id="searchInput"/>
             <img src="images/search3.png" ng-click="searchBuilding()" />
         </div>
     </div>
@@ -30,9 +30,13 @@
                 </p>
             </div>
             <div class="right_content">
-                <p ng-repeat="it in roomList" ng-click="showRoom(it)" style="height:30px;font-size:14px;cursor:pointer;" ng-style="{'padding-bottom':$index==(roomList.length-1)?(floorList.length*80+'px'):''}">
-                    {{it.RoomName}}&nbsp;&nbsp;{{it.DepartmentOrServiceName}}
-                </p>
+                <div ng-repeat="floor in floorList" ng-style="{'padding-bottom':$last?(floorList.length*80+'px'):''}">
+                    <p ng-repeat="it in roomList | filter:{BuildingFloorId:floor.BuildingFloorId}" ng-click="showRoom(it)" style="height:40px;font-size:14px;cursor:pointer;margin:0px;display:flex;align-items:center;" ng-class="isHightlight(it)?'hightlight':''">
+                        {{it.RoomName}}&nbsp;&nbsp;{{it.DepartmentOrServiceName}}
+                    </p>
+                    <hr ng-if="!$last" style="margin:10px 0px;"/>
+                </div>
+                
             </div>
         </div>
     </div>
@@ -311,4 +315,8 @@
         box-shadow: 0 0 18px #1692f6;
         border-radius: 10px;
     }
+
+    .hightlight {
+        color: #1692f6;
+    }
 </style>

YLShipBuildLandMap.Web/wwwroot/app/main/map-index.js

@@ -17,11 +17,19 @@
 
         $("#mapimg").css("height", $(window).height());
 
+        $("#searchInput").focus(function () {
+           
+        });
+
+   
         $scope.mapImgClick = function (e) {
+            console.log(e.offsetX, e.offsetY);
             $scope.isShowMark = false;
             $scope.isShowNowModal = false;
 
-            var buildingList = $scope.buildingXYAxisList.filter(x => e.offsetX >= x.MinXAxis && e.offsetX <= x.MaxXAxis && e.offsetY >= x.MinYAxis && e.offsetY <= x.MaxYAxis);
+            var img = $("#mapimg")[0];
+
+            var buildingList = $scope.buildingXYAxisList.filter(x => e.offsetX >= x.MinXAxis * img.width && e.offsetX <= x.MaxXAxis * img.width && e.offsetY >= x.MinYAxis * img.height && e.offsetY <= x.MaxYAxis * img.height);
             if (buildingList.length > 0) {
                 $scope.goBuilding(buildingList[0]);
             }
@@ -47,10 +55,10 @@
                         $scope.goBuilding(buildingList[0]);
 
                         var searchFloor = $scope.floorList.filter(x => x.BuildingFloorId == searchRoom.BuildingFloorId);
-                        
+
                         $timeout(function () {
                             $scope.floorClick(searchFloor[0]);
-                        }, 100);
+                        }, 500);
                     }
                 }
             }
@@ -63,22 +71,22 @@
 
             var img = $("#mapimg")[0];
 
-            $scope.nowPositionStyle.left = (img.offsetLeft + building.MinXAxis) + "px";
-            $scope.nowPositionStyle.top = (img.offsetTop + building.MinYAxis) + "px";
-            $scope.nowPositionStyle.width = (building.MaxXAxis - building.MinXAxis) + "px";
-            $scope.nowPositionStyle.height = (building.MaxYAxis - building.MinYAxis) + "px";
+            $scope.nowPositionStyle.left = (img.offsetLeft + building.MinXAxis * img.width) + "px";
+            $scope.nowPositionStyle.top = (img.offsetTop + building.MinYAxis * img.height) + "px";
+            $scope.nowPositionStyle.width = (building.MaxXAxis * img.width - building.MinXAxis * img.width) + "px";
+            $scope.nowPositionStyle.height = (building.MaxYAxis * img.height - building.MinYAxis * img.height) + "px";
 
-            $scope.coordinateStyle.left = (img.offsetLeft + building.XCenter - 22) + "px";
-            $scope.coordinateStyle.top = (img.offsetTop + building.YCenter - 73) + "px";
+            $scope.coordinateStyle.left = (img.offsetLeft + building.XCenter * img.width - 22) + "px";
+            $scope.coordinateStyle.top = (img.offsetTop + building.YCenter * img.height - 73) + "px";
             $scope.isShowMark = true;
-           
+
             $scope.showModalType = 1;
 
             $timeout(function () {
-                $scope.modalStyle.left = (img.offsetLeft + building.MaxXAxis) + "px";
-                $scope.modalStyle.top = (img.offsetTop + building.MinYAxis) > 400 ? (img.offsetTop + building.MinYAxis - 420) : 20 + "px";
+                $scope.modalStyle.left = (img.offsetLeft + building.MaxXAxis * img.width) + "px";
+                $scope.modalStyle.top = (img.offsetTop + building.MinYAxis * img.height) > 400 ? (img.offsetTop + building.MinYAxis * img.height - 420) : 20 + "px";
                 $scope.isShowNowModal = true;
-               
+
             }, 300);
 
             $timeout(function () {
@@ -87,6 +95,7 @@
         }
 
         $scope.floorClick = function (clickData) {
+            var top = 10;
             var totalRoom = 0;
             var index = $.map($filter('filter')($scope.floorList, {}), function (x) { return x.BuildingFloorId; }).indexOf(clickData.BuildingFloorId);
 
@@ -98,24 +107,29 @@
 
             });
 
-            $("#card-content").scrollTop(index == 0 ? 0 : totalRoom * 40);
+            $("#card-content").scrollTop(index == 0 ? 0 : (top + index * 20 + totalRoom * 40));
         };
 
         // 定义滚动事件的处理函数
         var scrollHandler = function () {
             var scrollTop = $("#card-content").scrollTop();
 
-            var nowIndex = parseInt(scrollTop / 40);
+            var top = 10;
+            var totalRoom = 0;
+            $scope.floorList.forEach((f, i) => {
+                $scope.roomList.filter(e => e.BuildingFloorId == f.BuildingFloorId).forEach((r, k) => {
+                    r.scrollTop = (i == 0 && k == 0) ? top : (top + i * 20 + totalRoom * 40);
+                    totalRoom += 1;
+                });
+            });
 
-            if (nowIndex < $scope.roomList.length) {
-                var room = $scope.roomList[nowIndex];
+            var scrollRoom = $scope.roomList.filter(e => e.scrollTop >= scrollTop);
 
-                if (room) {
-                    $scope.floorList.forEach((f, i) => {
-                        f.checked = room.FloorName == f.Name;
+            if (scrollRoom.length > 0) {
+                $scope.floorList.forEach((f, i) => {
+                    f.checked = scrollRoom[0].BuildingFloorId == f.BuildingFloorId;
 
-                    });
-                }
+                });
             }
 
             $scope.$apply();
@@ -136,7 +150,11 @@
         $scope.coloseRoom = function () {
             $scope.showModalType = 1;
         };
-        
+
+        $scope.isHightlight = function (room) {
+            return $scope.searchInput != '' && ((room.RoomName != null && room.RoomName != '' && room.RoomName.indexOf($scope.searchInput) >= 0) || (room.DepartmentOrServiceName != null && room.DepartmentOrServiceName != '' && room.DepartmentOrServiceName.indexOf($scope.searchInput) >= 0));
+        };
+
         //加载列表数据
         $scope.getBuildingXYAxisList = function () {
             $http