月报首页：交互优化

src/views/monthlyReport/index.vue

@@ -19,7 +19,7 @@
       </template>
     </headerCom>
     <!--  content  -->
-    <div class="content-wrapper">
+    <div v-loading="contentLoading" class="content-wrapper">
       <div class="content-reportName">
         {{ reportName }}
         <el-button v-if="reportStatus.status === 20" type="text" @click="jump('report_home_Publication', '/monthlyReport/edit', { pageType: 'readAll', reportId: reportStatus.id })"> 月报发布</el-button>
@@ -32,8 +32,8 @@
       <div v-show="reportStatus.status === 10" class="report-bottom">
         <span v-if="tagData.confirmeList || tagData.toBeConfirmList "><i class="el-icon-warning report-icon-warning" /> 已确认业务线<b>{{ tagData.confirmeList || '无' }}</b> ，未确认业务线<b>{{ tagData.toBeConfirmList || '无' }}</b>。 </span>
       </div>
-      <el-row :gutter="12">
-        <el-col v-for="(i, k) in tagData.subReportList" :key="k" :span="innerWidth">
+      <el-row v-if="tagData && tagData.subReportList" :gutter="12">
+        <el-col v-for="(i, k) in tagData.subReportList" :key="k + 'yh'" :span="innerWidth">
           <monthlyEards :datas="i" />
         </el-col>
       </el-row>
@@ -117,6 +117,7 @@ export default {
       },
       reportValue: '', // select value
       reportName: '', // select reportName
+      contentLoading: true,
       rules: {
         reportSettingIds: [{ type: 'array', required: true, message: '请至少选择一个业务线', trigger: 'change' }],
         reportName: [{ required: true, message: '请选择名称', trigger: 'change' }],
@@ -135,16 +136,29 @@ export default {
       const res = await getAvaliableInfo()
       if (res.code === 200) {
         this.reportData = res.data
-        this.reportValue = res.data.reportList[0].id
-        this.reportName = res.data.reportList[0].reportName
-        this.reportStatus = res.data.reportList[0]
+        let index = 0
+        if (this.$route.query.reportId) {
+          res.data.reportList.forEach((elm, elmIndex) => {
+            if (`${elm.id}` === `${this.$route.query.reportId}`) {
+              index = elmIndex
+            }
+          })
+        }
+        console.log(this.$route.query.reportId, index, 146)
+        this.reportValue = res.data.reportList[index].id
+        this.reportName = res.data.reportList[index].reportName
+        this.reportStatus = res.data.reportList[index]
         this.monthlyReportIndex(this.reportValue)
       }
     },
     async monthlyReportIndex(id) {
+      // console.log(id)
       const res = await monthlyReportIndex(id)
       if (res.code === 200) {
         this.tagData = res.data
+        setTimeout(() => {
+          this.contentLoading = false
+        }, 200)
       }
     },
     async createReport() {
@@ -181,6 +195,7 @@ export default {
       this.$router.push({ path: '/monthlyReport/edit', query: { pageType: 'editAll', reportId: this.reportStatus.id }})
     },
     getReportStatus(e) {
+      this.contentLoading = true
       this.monthlyReportIndex(e.id)
       this.reportName = e.reportName
       this.reportValue = e.id