报告加载增加loading和空判断

src/views/approve_manage/approveDetail.vue

@@ -7,20 +7,28 @@
                 <span>研报分类:中文研报/日度点评/知白守黑日评</span>
                 <span style="min-width: 100px;">发起人:789</span>
             </div>
-            <div class="approve-content">
+            <div class="approve-content" 
+                v-loading="isLoading"
+                element-loading-text="研报加载中...">
                 <!-- <ReportDetail 
+                    v-if="!isError"
                     :reportId="107"
                     :isPreview="true"
-                /> -->
-                <!-- <Reportdtl 
-                    :reportId="3517"
-                    :isEn="false"
+                    @reportStartLoading="isLoading=true"
+                    @reportEndLoading="isLoading=false"
+                    @reportError="isError=true"
                 /> -->
                 <Reportdtl 
-                    :reportId="3749"
-                    :isEn="true"
+                    :reportId="3528"
+                    :isEn="false"
+                    @reportError="isError=true"
                 />
-                
+                <!-- <Reportdtl 
+                    :reportId="3750"
+                    :isEn="true"
+                    @reportError="isError=true"
+                /> -->
+                <tableNoData v-if="isError" text="无法获取到报告内容,该报告可能已被删除!"></tableNoData>
             </div>
         </div>
         <div class="approve-tool">
@@ -50,8 +58,16 @@ import TimeLine from './components/timeLine.vue';
 
 export default {
     data() {
-        return {};
+        return {
+            isError:false,
+            isLoading:false,
+        };
     },
+    /* watch:{
+        isLoading(val){
+
+        },
+    }, */
     methods: {},
     components: { TimeLine, ReportDetail ,Reportdtl }
 };
@@ -82,12 +98,10 @@ export default {
 <style scoped lang="scss">
 .approve-detail-wrap{
     height: calc(100vh - 120px);
-    /* overflow-y: hidden; */
     display: flex;
     .approve-detail,.approve-tool{
         height: 100%;
         box-sizing: border-box;
-        /* padding:30px; */
     }
     .approve-tool{
         width:400px;
@@ -116,6 +130,7 @@ export default {
                 right:0;
                 bottom:0;
                 overflow: hidden;
+                pointer-events: none;
                 img{
                     width:100%;
                     height:100%;
@@ -137,15 +152,10 @@ export default {
         }
         .approve-content{
             flex: 1;
-            min-width: 800px;
+            min-width: 840px;
             padding:20px;
             overflow-y: auto;
             position:relative;
-            .smart-report-detail{
-                .main-box{
-                    width: auto;
-                }
-            }
         }
     }
 }

src/views/report_manage/reportdtl.vue

@@ -147,6 +147,7 @@
 			async getreportdetail(){
 				let res
 				let reportId = this.id||this.reportId
+				this.$emit("reportStartLoading")
 				if((this.$route.query.fromPage == 'en'||this.isEn)){
 					res=await reportEnInterface.reportDetail({ReportId:parseInt(reportId)})
 				}else if(this.$route.query.fromPage == 'strategyReport'){
@@ -154,8 +155,11 @@
 				}else{
 					res=await reportdetail({ReportId:parseInt(reportId)})
 				}
-
-				if( res.Ret!==200 )return
+				this.$emit("reportEndLoading")
+				if( res.Ret!==200 ){
+					this.$emit("reportError")
+					return 
+				}
 
 				this.reportInfo=res.Data;
 				this.isshow=true;

src/views/smartReport/reportDetail.vue

@@ -95,9 +95,11 @@ export default {
         getReportDetail(){
             const id=this.$route.query.id||this.reportId||0
             if(!id) return
+            this.$emit("reportStartLoading")
             apiSmartReport.reportDetail({
                 SmartReportId:Number(id)
             }).then(res=>{
+                this.$emit("reportEndLoading")
                 if(res.Ret===200){
                     this.reportInfo=res.Data
                     if(this.$route.query.type==='preview'){
@@ -105,6 +107,8 @@ export default {
                     }else{
                         this.content=res.Data.Content
                     }
+                }else{
+                    this.$emit("reportError")
                 }
             })
         },