add Overlay: 禁用页面鼠标
This commit is contained in:
		@@ -39,8 +39,8 @@
 | 
			
		||||
    <script>
 | 
			
		||||
    // window.SITE_CONFIG['apiURL'] = 'http://192.168.1.103:8080/pms-am';
 | 
			
		||||
    // window.SITE_CONFIG['apiURL'] = 'http://192.168.1.49:8080/pms-am'; // tengyun
 | 
			
		||||
    // window.SITE_CONFIG['apiURL'] = 'http://192.168.1.62:8080/pms-am'; // tao
 | 
			
		||||
    window.SITE_CONFIG['apiURL'] = 'http://192.168.1.21:8080/pms-am'; // xv
 | 
			
		||||
    window.SITE_CONFIG['apiURL'] = 'http://192.168.1.62:8080/pms-am'; // tao
 | 
			
		||||
    // window.SITE_CONFIG['apiURL'] = 'http://192.168.1.21:8080/pms-am'; // xv
 | 
			
		||||
    // window.SITE_CONFIG['apiURL'] = 'http://localhost:3000/pms-am'; // xv
 | 
			
		||||
    </script>
 | 
			
		||||
  <% } %>
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										45
									
								
								src/components/Overlay.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										45
									
								
								src/components/Overlay.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,45 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <div class="overlay-view">
 | 
			
		||||
    <h1>请稍后......</h1>
 | 
			
		||||
  </div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
export default {
 | 
			
		||||
  name: "OverlayView",
 | 
			
		||||
  props: {},
 | 
			
		||||
  data() {
 | 
			
		||||
    return {};
 | 
			
		||||
  },
 | 
			
		||||
  mounted() {
 | 
			
		||||
    // 禁止页面滚动
 | 
			
		||||
    document.body.style.overflow = 'hidden'
 | 
			
		||||
  },
 | 
			
		||||
  beforeDestroy() {
 | 
			
		||||
    document.body.style.overflow = 'unset'
 | 
			
		||||
  }
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style scoped>
 | 
			
		||||
.overlay-view {
 | 
			
		||||
  width: 100vw;
 | 
			
		||||
  height: 100vh;
 | 
			
		||||
  cursor: wait;
 | 
			
		||||
  position: fixed;
 | 
			
		||||
  top: 0;
 | 
			
		||||
  left: 0;
 | 
			
		||||
  z-index: 1000000;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.overlay-view h1 {
 | 
			
		||||
  position: absolute;
 | 
			
		||||
  top: 50%;
 | 
			
		||||
  left: 50%;
 | 
			
		||||
  font-size: 36px;
 | 
			
		||||
  font-weight: bold;
 | 
			
		||||
  letter-spacing: 10px;
 | 
			
		||||
  color: #cccc;
 | 
			
		||||
  user-select: none;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
@@ -14,6 +14,9 @@
 | 
			
		||||
    <DialogJustForm ref="edit-dialog" v-if="!!dialogConfigs" :dialog-visible.sync="dialogVisible" :configs="dialogConfigs"
 | 
			
		||||
      @refreshDataList="getList" />
 | 
			
		||||
    <!-- :bom-code="dialogBomCode" -->
 | 
			
		||||
 | 
			
		||||
    <Overlay v-if="overlayVisible" />
 | 
			
		||||
 | 
			
		||||
  </div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
@@ -21,11 +24,13 @@
 | 
			
		||||
import BaseListTable from "@/components/BaseListTable.vue";
 | 
			
		||||
import BaseSearchForm from "@/components/BaseSearchForm.vue";
 | 
			
		||||
import DialogJustForm from "./edit-dialog.vue";
 | 
			
		||||
import Overlay from '@/components/Overlay.vue';
 | 
			
		||||
 | 
			
		||||
import moment from "moment";
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
  name: "ListViewWithHead",
 | 
			
		||||
  components: { BaseSearchForm, BaseListTable, DialogJustForm },
 | 
			
		||||
  components: { BaseSearchForm, BaseListTable, DialogJustForm, Overlay },
 | 
			
		||||
  props: {
 | 
			
		||||
    tableConfig: {
 | 
			
		||||
      type: Object,
 | 
			
		||||
@@ -64,6 +69,7 @@ export default {
 | 
			
		||||
      tableLoading: false,
 | 
			
		||||
      refreshLayoutKey: null,
 | 
			
		||||
      dialogBomCode: "",
 | 
			
		||||
      overlayVisible: false
 | 
			
		||||
    };
 | 
			
		||||
  },
 | 
			
		||||
  inject: ["urls"],
 | 
			
		||||
@@ -211,6 +217,7 @@ export default {
 | 
			
		||||
            type: "warning",
 | 
			
		||||
          })
 | 
			
		||||
            .then(() => {
 | 
			
		||||
              this.overlayVisible = true;
 | 
			
		||||
              const realUrl = type === 'detach' ? this.urls.detach : type === 'pause-blender' ? this.urls.pauseBlender : this.urls.startBlender
 | 
			
		||||
              return this.$http
 | 
			
		||||
                .post(realUrl, data /* { id: data } */, { headers: { "Content-Type": "application/json" } })
 | 
			
		||||
@@ -231,6 +238,7 @@ export default {
 | 
			
		||||
                      duration: 1500,
 | 
			
		||||
                    });
 | 
			
		||||
                  }
 | 
			
		||||
                  this.overlayVisible = false;
 | 
			
		||||
                });
 | 
			
		||||
            });
 | 
			
		||||
        }
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user