diff --git a/src/app/babylon/view/facility-window/facility-window.ts b/src/app/babylon/view/facility-window/facility-window.ts
index 6ebe296..4d64d30 100644
--- a/src/app/babylon/view/facility-window/facility-window.ts
+++ b/src/app/babylon/view/facility-window/facility-window.ts
@@ -11,6 +11,7 @@ import {
Image,
Rectangle,
} from '@babylonjs/gui';
+import { PlanComponent } from 'src/app/pages/plan/plan.component';
import { ConfigManager } from '../../controller/config-manager';
import { DataManager, ModelChangeType } from '../../controller/data-manager';
import { Event_ChangeFacility } from '../../controller/event-manager/events/event-change-facility';
@@ -29,7 +30,6 @@ import { ModelInfo_facility } from '../../model/info/model/model-info-facility';
import { BabylonTool } from '../../tool/babylon-tool';
import { BabylonUIStyleTool } from '../../tool/babylon-ui-style-tool';
import { GizmoTool } from '../../tool/gizmo-tool';
-
import { CopyFacilityInfo, FacilityInfoInSceneWindow } from '../facilityinfoinscene-window/facilityinfoinscene-window';
import { ToolbarWindow } from '../toolbar-window/toobar-window';
import { UIBase } from '../window-base/ui-base';
@@ -39,7 +39,7 @@ import { FacilityUIItem } from './facility-ui-item';
export class FacilityWindow extends UIBase {
- // three: ThreeDimensionalHomeComponent;//前端组件
+ three: PlanComponent;//前端组件
allFacilityUIItemes: FacilityUIItem[] = [];
@@ -172,10 +172,10 @@ export class FacilityWindow extends UIBase {
console.log("所有可用的设备", instance.allFacilityUIItemes);
- // ThreeDimensionalHomeComponent.instance.getAllIcons(instance)
+ PlanComponent.instance.getAllIcons(instance)
})
- // instance.three = ThreeDimensionalHomeComponent.instance
+ instance.three = PlanComponent.instance
}
@@ -245,7 +245,7 @@ export class FacilityWindow extends UIBase {
}
}
else { //右键取消
- // instance.three.unSelectBottomIcon();
+ instance.three.unSelectBottomIcon();
}
break;
diff --git a/src/app/pages/plan/plan.component.html b/src/app/pages/plan/plan.component.html
index 39368d4..2293c8a 100644
--- a/src/app/pages/plan/plan.component.html
+++ b/src/app/pages/plan/plan.component.html
@@ -1,7 +1,7 @@
-
+
+
+
+
+
+
+
+
![]()
+
{{item.getIconName()}}
+
+
+
+
diff --git a/src/app/pages/plan/plan.component.scss b/src/app/pages/plan/plan.component.scss
index 10b263a..746bd9a 100644
--- a/src/app/pages/plan/plan.component.scss
+++ b/src/app/pages/plan/plan.component.scss
@@ -5,7 +5,7 @@
position: relative;
canvas{ width: 100%; height: 100%; border: none; outline: none; }
}
-.anticon { font-size: 16px; cursor: pointer; } //字体图标
+.anticon{ font-size: 16px; cursor: pointer; } //字体图标
//文本溢出
.overflowText{
overflow: hidden;
@@ -75,6 +75,40 @@
transition: margin-left 0.5s;
}
+//底部图标栏
+.bottomIcons{
+ width: 80%;
+ height: 60px;
+ line-height: 60px;
+ position: absolute;
+ left: 0;
+ right: 0;
+ bottom: 1px;
+ margin: auto;/*这行代码是关键*/
+ color: #fff;
+ background: rgba(0,17,33,0.7);
+ border-radius: 10px 10px 0px 0px;
+ display: flex;
+ box-sizing: border-box;
+ padding: 1px;
+ .autoScroll{ width: 30px; text-align: center; }
+ .bottomCenter{
+ flex: 1;
+ overflow: hidden;
+ .everyIcon {
+ width: 100px;
+ height: 58px;
+ line-height: normal;
+ text-align: center;
+ display: inline-block;
+ overflow: hidden;
+ img { width: 40px; height: 40px; margin-top: 3px; cursor: pointer; }
+ p { height: 18px; line-height: 18px; margin-top: -5px; font-size: 12px; }
+ }
+ }
+ .selectLeftIcon { background: rgb(0,128,255,0.5); } //选中样式
+}
+
//右上角快捷栏
.rightTopFast{
width: 60px;
diff --git a/src/app/pages/plan/plan.component.ts b/src/app/pages/plan/plan.component.ts
index 5fabf25..2ebc800 100644
--- a/src/app/pages/plan/plan.component.ts
+++ b/src/app/pages/plan/plan.component.ts
@@ -12,6 +12,8 @@ import { BuildingStatus } from 'src/app/babylon/controller/status/building-statu
import { BuildingUIItem } from 'src/app/babylon/view/building-window/building-ui-item';
import { BuildingType } from 'src/app/babylon/model/data/institution/building/building-data';
import { BuildingWindow } from 'src/app/babylon/view/building-window/building-window';
+import { FacilityUIItem } from 'src/app/babylon/view/facility-window/facility-ui-item';
+import { FacilityWindow } from 'src/app/babylon/view/facility-window/facility-window';
@@ -136,6 +138,41 @@ export class PlanComponent implements OnInit {
}
}
+ allFacilityUIItemes: FacilityUIItem[] = []; //底部所有 图标
+ beforeOneIcon: string = null; //当前选择 图标
+
+ // 获取 底部图标栏list
+ getAllIcons(e: FacilityWindow) {
+ this.allFacilityUIItemes = e.allFacilityUIItemes
+ this.beforeOneIcon = null
+ }
+
+ //选择底部图标
+ selectBottomIcon(e: FacilityUIItem) {
+ if (this.beforeOneIcon != e.getIconID()) {
+ this.beforeOneIcon = e.getIconID()
+ e.select()
+ } else {
+ this.beforeOneIcon = null
+ e.unSelect()
+ }
+ }
+
+ //取消选择 底部图标
+ unSelectBottomIcon() {
+ if (this.beforeOneIcon) {
+ let e: FacilityUIItem = this.allFacilityUIItemes.find(item => { return item.getIconID() === this.beforeOneIcon })
+ e ? e.unSelect() : null
+ this.beforeOneIcon = null
+ }
+ }
+
+ //底部图标栏 滚动条
+ bottomScroll(e) {
+ let bootomDiv = this.element.nativeElement.querySelector('#bottomCenter')
+ e == 0 ? bootomDiv.scrollLeft = bootomDiv.scrollLeft + 50 : bootomDiv.scrollLeft = bootomDiv.scrollLeft - 50
+ }
+
//保存
preserve() {
ToolbarWindow.instance.onBtnSave();