封装iframe组件
This commit is contained in:
		
							parent
							
								
									090ad5323a
								
							
						
					
					
						commit
						3f05ed6ffa
					
				| 
						 | 
					@ -0,0 +1,36 @@
 | 
				
			||||||
 | 
					<template>
 | 
				
			||||||
 | 
					  <div v-loading="loading" :style="'height:' + height">
 | 
				
			||||||
 | 
					    <iframe
 | 
				
			||||||
 | 
					      :src="src"
 | 
				
			||||||
 | 
					      frameborder="no"
 | 
				
			||||||
 | 
					      style="width: 100%; height: 100%"
 | 
				
			||||||
 | 
					      scrolling="auto"
 | 
				
			||||||
 | 
					    />
 | 
				
			||||||
 | 
					  </div>
 | 
				
			||||||
 | 
					</template>
 | 
				
			||||||
 | 
					<script>
 | 
				
			||||||
 | 
					export default {
 | 
				
			||||||
 | 
					  props: {
 | 
				
			||||||
 | 
					    src: {
 | 
				
			||||||
 | 
					      type: String,
 | 
				
			||||||
 | 
					      required: true
 | 
				
			||||||
 | 
					    },
 | 
				
			||||||
 | 
					  },
 | 
				
			||||||
 | 
					  data() {
 | 
				
			||||||
 | 
					    return {
 | 
				
			||||||
 | 
					      height: document.documentElement.clientHeight - 94.5 + "px;",
 | 
				
			||||||
 | 
					      loading: true,
 | 
				
			||||||
 | 
					      url: this.src
 | 
				
			||||||
 | 
					    };
 | 
				
			||||||
 | 
					  },
 | 
				
			||||||
 | 
					  mounted: function () {
 | 
				
			||||||
 | 
					    setTimeout(() => {
 | 
				
			||||||
 | 
					      this.loading = false;
 | 
				
			||||||
 | 
					    }, 300);
 | 
				
			||||||
 | 
					    const that = this;
 | 
				
			||||||
 | 
					    window.onresize = function temp() {
 | 
				
			||||||
 | 
					      that.height = document.documentElement.clientHeight - 94.5 + "px;";
 | 
				
			||||||
 | 
					    };
 | 
				
			||||||
 | 
					  }
 | 
				
			||||||
 | 
					};
 | 
				
			||||||
 | 
					</script>
 | 
				
			||||||
| 
						 | 
					@ -1,26 +1,15 @@
 | 
				
			||||||
<template>
 | 
					<template>
 | 
				
			||||||
  <div v-loading="loading" :style="'height:'+ height">
 | 
					  <i-frame :src="url" />
 | 
				
			||||||
    <iframe :src="src" frameborder="no" style="width: 100%;height: 100%" scrolling="auto" />
 | 
					 | 
				
			||||||
  </div>
 | 
					 | 
				
			||||||
</template>
 | 
					</template>
 | 
				
			||||||
<script>
 | 
					<script>
 | 
				
			||||||
 | 
					import iFrame from "@/components/iFrame/index";
 | 
				
			||||||
export default {
 | 
					export default {
 | 
				
			||||||
  name: "Druid",
 | 
					  name: "Druid",
 | 
				
			||||||
 | 
					  components: { iFrame },
 | 
				
			||||||
  data() {
 | 
					  data() {
 | 
				
			||||||
    return {
 | 
					    return {
 | 
				
			||||||
      src: process.env.VUE_APP_BASE_API + "/druid/login.html",
 | 
					      url: process.env.VUE_APP_BASE_API + "/druid/login.html"
 | 
				
			||||||
      height: document.documentElement.clientHeight - 94.5 + "px;",
 | 
					 | 
				
			||||||
      loading: true
 | 
					 | 
				
			||||||
    };
 | 
					    };
 | 
				
			||||||
  },
 | 
					  },
 | 
				
			||||||
  mounted: function() {
 | 
					 | 
				
			||||||
    setTimeout(() => {
 | 
					 | 
				
			||||||
      this.loading = false;
 | 
					 | 
				
			||||||
    }, 230);
 | 
					 | 
				
			||||||
    const that = this;
 | 
					 | 
				
			||||||
    window.onresize = function temp() {
 | 
					 | 
				
			||||||
      that.height = document.documentElement.clientHeight - 94.5 + "px;";
 | 
					 | 
				
			||||||
    };
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
};
 | 
					};
 | 
				
			||||||
</script>
 | 
					</script>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -1,26 +1,15 @@
 | 
				
			||||||
<template>
 | 
					<template>
 | 
				
			||||||
  <div v-loading="loading" :style="'height:'+ height">
 | 
					  <i-frame :src="url" />
 | 
				
			||||||
    <iframe :src="src" frameborder="no" style="width: 100%;height: 100%" scrolling="auto" />
 | 
					 | 
				
			||||||
  </div>
 | 
					 | 
				
			||||||
</template>
 | 
					</template>
 | 
				
			||||||
<script>
 | 
					<script>
 | 
				
			||||||
 | 
					import iFrame from "@/components/iFrame/index";
 | 
				
			||||||
export default {
 | 
					export default {
 | 
				
			||||||
  name: "Swagger",
 | 
					  name: "Swagger",
 | 
				
			||||||
 | 
					  components: { iFrame },
 | 
				
			||||||
  data() {
 | 
					  data() {
 | 
				
			||||||
    return {
 | 
					    return {
 | 
				
			||||||
      src: process.env.VUE_APP_BASE_API + "/swagger-ui/index.html",
 | 
					      url: process.env.VUE_APP_BASE_API + "/swagger-ui/index.html"
 | 
				
			||||||
      height: document.documentElement.clientHeight - 94.5 + "px;",
 | 
					 | 
				
			||||||
      loading: true
 | 
					 | 
				
			||||||
    };
 | 
					    };
 | 
				
			||||||
  },
 | 
					  },
 | 
				
			||||||
  mounted: function() {
 | 
					 | 
				
			||||||
    setTimeout(() => {
 | 
					 | 
				
			||||||
      this.loading = false;
 | 
					 | 
				
			||||||
    }, 230);
 | 
					 | 
				
			||||||
    const that = this;
 | 
					 | 
				
			||||||
    window.onresize = function temp() {
 | 
					 | 
				
			||||||
      that.height = document.documentElement.clientHeight - 94.5 + "px;";
 | 
					 | 
				
			||||||
    };
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
};
 | 
					};
 | 
				
			||||||
</script>
 | 
					</script>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
		Reference in New Issue