|
@@ -0,0 +1,173 @@
|
|
|
+.spinnclass {
|
|
|
+ // height: calc(100% - 245px);
|
|
|
+}
|
|
|
+
|
|
|
+:global {
|
|
|
+ .ant-spin-container {
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.mapwrap {
|
|
|
+ position: relative;
|
|
|
+ // height: calc(100% - 285px);
|
|
|
+ height: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ .mapControl {
|
|
|
+ position: absolute;
|
|
|
+ right: 20px;
|
|
|
+ bottom: 20px;
|
|
|
+ z-index: 1;
|
|
|
+
|
|
|
+ .zoom {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ width: 40px;
|
|
|
+ height: 40px;
|
|
|
+ margin-bottom: 7px;
|
|
|
+ font-size: 25px;
|
|
|
+ background: #fff;
|
|
|
+ border-radius: 4px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ .zoom:hover {
|
|
|
+ box-shadow: 0 0 2px rgba(0, 0, 0, 0.05), 0 4px 15px rgba(0, 0, 0, 0.05);
|
|
|
+ }
|
|
|
+ .zoom.disable {
|
|
|
+ opacity: 0.4;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.map {
|
|
|
+ position: relative;
|
|
|
+ width: 3000px;
|
|
|
+ height: 1200px;
|
|
|
+ transform-origin: 0% 0%;
|
|
|
+ cursor: pointer;
|
|
|
+ .houseWrap {
|
|
|
+ position: absolute;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 3px;
|
|
|
+ }
|
|
|
+ .house {
|
|
|
+ position: relative;
|
|
|
+ box-sizing: border-box;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ border: 2px solid #fff;
|
|
|
+ border-radius: 6px;
|
|
|
+ // .noDevice {
|
|
|
+ // position: absolute;
|
|
|
+ // top: 0;
|
|
|
+ // left: 0;
|
|
|
+ // box-sizing: border-box;
|
|
|
+ // width: 100%;
|
|
|
+ // height: 100%;
|
|
|
+ // padding: 4px;
|
|
|
+ // white-space: nowrap;
|
|
|
+ // // background: rgba(255, 255, 255, 0.8);
|
|
|
+ // .noText {
|
|
|
+ // padding: 4px 6px;
|
|
|
+ // background-color: #ccc;
|
|
|
+ // border-radius: 5px;
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ .allDevice {
|
|
|
+ position: absolute;
|
|
|
+ top: 6px;
|
|
|
+ left: 6px;
|
|
|
+ z-index: 1;
|
|
|
+ display: flex;
|
|
|
+ width: 100%;
|
|
|
+ .icon {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ width: 22px;
|
|
|
+ height: 22px;
|
|
|
+ margin-right: 3px;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 11px;
|
|
|
+ background: transparent;
|
|
|
+ border-radius: 22px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .allTime {
|
|
|
+ position: absolute;
|
|
|
+ top: 4px;
|
|
|
+ left: 4px;
|
|
|
+ z-index: 1;
|
|
|
+ display: flex;
|
|
|
+ width: 100%;
|
|
|
+ color: #4d5262;
|
|
|
+ font-size: 10px;
|
|
|
+ text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white;
|
|
|
+ .overworkTime {
|
|
|
+ color: #5e8bcf;
|
|
|
+ }
|
|
|
+ .meetTime {
|
|
|
+ color: #00dc23;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .content {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ height: 100%;
|
|
|
+ .name {
|
|
|
+ box-sizing: border-box;
|
|
|
+ width: 100%;
|
|
|
+ padding: 0 3px;
|
|
|
+ color: #000;
|
|
|
+ font-size: 13px;
|
|
|
+ text-align: center;
|
|
|
+ //text-shadow: 1px 1px 1px #fff;
|
|
|
+ text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .contentDiv {
|
|
|
+ display: inline-block;
|
|
|
+ // padding: 6px;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .notclick {
|
|
|
+ background: url(~@/assets/images/page-equipment/bg_disable.png) repeat;
|
|
|
+ border-color: #dfe3ed;
|
|
|
+ cursor: default;
|
|
|
+ .contentDiv {
|
|
|
+ background-color: #eceff4;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .searchSel {
|
|
|
+ border-color: rgba(77, 148, 255, 0.8);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.equipmentMap {
|
|
|
+ .house {
|
|
|
+ cursor: pointer;
|
|
|
+ .showModal {
|
|
|
+ position: absolute;
|
|
|
+ right: 6px;
|
|
|
+ bottom: 7px;
|
|
|
+ z-index: 2;
|
|
|
+ display: flex;
|
|
|
+ display: none;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ width: 22px;
|
|
|
+ height: 22px;
|
|
|
+ font-size: 12px;
|
|
|
+ background: #fff;
|
|
|
+ border-radius: 22px;
|
|
|
+ }
|
|
|
+ &:hover .showModal {
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|