|
@@ -8,10 +8,12 @@
|
|
|
:havItem="havItem"
|
|
|
:contextMenuItem="contextMenuItem"
|
|
|
></planTooltip>
|
|
|
+ <!-- 加载中 -->
|
|
|
+ <div v-loading="planLoading" class="plan-loading" element-loading-text="平面图加载中"></div>
|
|
|
<canvas style="border: none; outline: medium" id="persagy_plan" :width="canvasWidth" :height="canvasHeight" tabindex="0"></canvas>
|
|
|
</div>
|
|
|
</template>
|
|
|
-<script>
|
|
|
+<script defer>
|
|
|
import { SFloorParser, getJsonz } from "@persagy-web/big";
|
|
|
import { SImageItem, SImageShowType } from "@persagy-web/graph";
|
|
|
import { SPlanView, SPlanParser, SPlanScene, SPlanDecorator, SPlanEquipment, SPlanZone } from "@/lib";
|
|
@@ -50,6 +52,7 @@ export default {
|
|
|
},
|
|
|
changeScaleByClick: false, //区分滚轮,点击 事件改变的缩放比例
|
|
|
initScale: 1,
|
|
|
+ planLoading: true, //平面图顶部loading提示
|
|
|
};
|
|
|
},
|
|
|
computed: {
|
|
@@ -100,6 +103,11 @@ export default {
|
|
|
this.autoSave = setInterval(() => {
|
|
|
this.autoSavePlan();
|
|
|
}, 120000);
|
|
|
+ // 页面销毁前,清除定时器
|
|
|
+ this.$once("hook:beforeDestroy", () => {
|
|
|
+ clearInterval(this.autoSave);
|
|
|
+ });
|
|
|
+
|
|
|
},
|
|
|
methods: {
|
|
|
...mapMutations([
|
|
@@ -220,8 +228,6 @@ export default {
|
|
|
|
|
|
// 设置初始化缩放比例
|
|
|
this.initScale = this.view.scale;
|
|
|
- // this.view.maxScale = this.initScale * 10;
|
|
|
- // this.view.minScale = this.initScale / 10;
|
|
|
bus.$emit("initScale", this.view.scale);
|
|
|
},
|
|
|
|
|
@@ -613,9 +619,9 @@ export default {
|
|
|
if (this.view?.scene) this.view.fitSceneToView();
|
|
|
// 设置初始化缩放比例
|
|
|
this.initScale = this.view.scale;
|
|
|
- // this.view.maxScale = this.initScale * 10;
|
|
|
- // this.view.minScale = this.initScale / 10;
|
|
|
bus.$emit("initScale", this.view.scale);
|
|
|
+ // 关闭顶部的loading提示
|
|
|
+ this.planLoading = false
|
|
|
},
|
|
|
// 生成快照并保存草稿
|
|
|
savePlanDraft() {
|
|
@@ -788,5 +794,36 @@ export default {
|
|
|
left: 0;
|
|
|
top: 0;
|
|
|
}
|
|
|
+ .plan-loading {
|
|
|
+ position: absolute !important;
|
|
|
+ top: 10px;
|
|
|
+ left: 50%;
|
|
|
+ width: 200px;
|
|
|
+ height: 50px;
|
|
|
+ z-index: 9;
|
|
|
+ transform: translateX(-50%);
|
|
|
+ /deep/ .el-loading-mask {
|
|
|
+ border-radius: 3px;
|
|
|
+ background-color: #edf2fc;
|
|
|
+ .el-loading-spinner {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ margin-top: 0 !important;
|
|
|
+ transform: translateY(-50%) !important;
|
|
|
+ svg {
|
|
|
+ width: 20px;
|
|
|
+ height: 20px;
|
|
|
+ margin-right: 10px;
|
|
|
+ circle {
|
|
|
+ stroke: #909399;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-loading-text {
|
|
|
+ color: #909399;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|