case网络检查

src/views/portal/case/Detail.vue

@@ -43,12 +43,19 @@
                     <interactBar  :data="caseDetail" :type="3" :comments="false" :shares="true" :unicom="true"></interactBar>
                   </div>
                 </el-card>
-                <el-card :body-style="{ padding: '0px' }" class="jianjie" id="pdfPreview">
+                <el-card v-if="Internet == 1" :body-style="{ padding: '0px' }" class="jianjie" id="pdfPreview">
                   <!-- <div class="content">
                     {{ caseDetail.content }}
                   </div> -->
                   <pdfPreview v-if="pdfPath" :filePath="pdfPath"></pdfPreview>
                 </el-card>
+                <el-card v-if="Internet == 2" style="background-color:#eee" class="jianjie pdftext" id="pdfPreview">
+                    <span>案例内容只能在内网环境下查看</span>
+                </el-card>
+                <el-card v-else-if="Internet == 3" style="background-color:#eee" class="jianjie pdftext" id="pdfPreview">
+                  <span>网络安全检测中</span>
+                </el-card>
+
                 <div class="postfixt-bot">
                   <div class="postfixt-bot-box" id="pdfTopBox">
                     <div style="display: flex;justify-content: space-between;">
@@ -187,6 +194,7 @@ export default {
   },
   data() {
     return {
+      Internet:3,//1是成功 2是是失败 3是检测中
       noData:true,
       zoomShow:true,
       isTopBoxShow:true,
@@ -209,7 +217,36 @@ export default {
     };
   },
   mounted() {
-    //this.pdfPath=this.basePath+'/case/demo1.pdf';
+   let $this = this;
+   this.Intsucc();
+   let xmlhttp=this.getXmlHttpRequest();
+   let timedOut = false;
+   let timer = setTimeout(function(){
+            timedOut = true;
+            xmlhttp.abort();
+        }, 5000);
+  //  xmlhttp.open("HEAD", "http://10.251.132.75/web",true);
+   xmlhttp.open("HEAD", "https://u-pre.boe.com/web",true);
+    xmlhttp.send();
+    xmlhttp.onreadystatechange=function() {
+      // console.log(xmlhttp.readyState,"xmlhttp.readyState");
+      if (xmlhttp.readyState==4) {
+        console.log(xmlhttp.status,"xmlhttp.status");
+        if (xmlhttp.status==200){
+          clearTimeout(timer);
+          $this.Internet = 1;
+        }else{
+          clearTimeout(timer);
+          $this.Internet = 2;
+         
+        }
+      }else{
+        if(imedOut) return;//忽略中止请求
+        clearTimeout(timer);//取消等待的超时
+      }
+    }
+
+
     this.resolveId = this.$route.query.id;
     this.$watermark.set(this.userInfo.name+this.userInfo.loginName);
     if (this.resolveId) {
@@ -226,6 +263,27 @@ export default {
     );
   },
   methods: {
+    getXmlHttpRequest() {
+      if (window.XMLHttpRequest) {
+        return new XMLHttpRequest();
+      }
+      else if (window.ActiveXObject) {
+        return new ActiveXObject("Microsoft.XMLHTTP");
+      }
+    },
+    Intsucc(){
+      const loading = this.$loading({
+          lock: true,
+          text: '正在进行安全检测',
+          spinner: 'el-icon-loading',
+          background: 'rgba(0, 0, 0, 0.7)'
+        });
+        setTimeout(() => {
+          loading.close();
+        }, 2000);
+       
+    },
+
      getdomain() {
       let key = "org_domain";
       apiDict.items(key).then(res => {
@@ -406,6 +464,15 @@ export default {
 </script>
 
 <style scoped lang="scss">
+.pdftext{
+  span{
+  font-size: 25px;
+  color: #ccc;
+  font-weight: bold;
+  line-height: 200px;
+  }
+  text-align: center;
+}
 .fixd-box-show{
   display: none;
 }