fix: 数据展示调整

pdaaphm-ui/src/assets/styles/sidebar.scss

@@ -100,7 +100,7 @@
 
       &:hover {
         // background-color: rgba(114, 113, 113, 0.1) !important;
-        color: #080808 !important;
+        color: #fff !important;
       }
     }
 

pdaaphm-ui/src/views/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="home">
+  <div class="home" v-loading="loading" >
     <div class="second">
       <div class="topPanel">
         <!-- 原始数据 -->
@@ -8,8 +8,7 @@
             <el-table-column prop="dataName" label="数据" align="center">
               <template slot-scope="scope">
                 <el-tooltip class="item" effect="dark" :content="scope.row.dataName" placement="top">
-                  <span class="file" @click="handleOriginalFile(scope.row.id, scope.row.dataPath)">{{
-            scope.row.dataName }}</span>
+                  <span class="file" @click="handleFile(scope.row.id, null)">{{ scope.row.dataName }}</span>
                 </el-tooltip>
               </template>
             </el-table-column>
@@ -206,7 +205,8 @@
         <el-button type="primary" @click="submitHandle()">确 定</el-button>
       </span>
     </el-dialog>
-    <el-dialog title="数据展示" :visible.sync="fileShowVisible" width="80%" :close-on-click-modal="false">
+    <el-dialog v-loading="loading" title="数据展示" :visible.sync="fileShowVisible" width="80%"
+      :close-on-click-modal="false">
       <el-button v-if="fileType !== '4' && fileType !== '5'" style="margin-left:50px;" type="text"
         @click="changeShow">{{
             isTableShow ?
@@ -245,7 +245,7 @@ export default {
   },
   data() {
     return {
-      loading: true,
+      loading: false,
       rules: {},
       title: '选择数据',
       baseUrl: process.env.VUE_APP_BASE_API,
@@ -373,59 +373,50 @@ export default {
       this.resultFileId = resultDataId
       this.fileType = processType
       getData(resultDataId).then(res => {
-        const url = `${process.env.VUE_APP_BASE_API}${res.data.dataPath}`;
+        const url = process.env.VUE_APP_BASE_API + res.data.dataPath;
         this.fetchLogFile(url)
           .then((text) => {
             if (this.chart != null && this.chart != "" && this.chart != undefined) {
               this.chart.dispose();
               this.chart = null
             }
+            let data, content, head
+            if (res.data.dataType !== '5' && res.data.dataType !== '6') {
+              data = this.handleFileData(text)
+              content = data.contentData
+              head = data.headData
+            }
             switch (res.data.dataType) {
-              // case '0':
-              //   const originalData = this.handleFileData(text)
-              //   const originalContent = originalData.contentData
-              //   const originalHead = originalData.headData
-              //   this.fileShowVisible = true
-              //   this.loading = false
-              //   this.$nextTick(() => {
-              //     this.handleChartOption(originalContent, originalHead, true)
-              //   })
-              //   break;
+              case '0':
+                this.fileShowVisible = true
+                this.$nextTick(() => {
+                  this.handleChartOption(content, head, true)
+                  this.loading = false
+                })
+                break;
               case '1':
-                const returnData = this.handleFileData(text)
-                const contentData = returnData.contentData
-                const headData = returnData.headData
                 this.fileShowVisible = true
-                this.loading = false
                 this.$nextTick(() => {
-                  this.handleChartOption(contentData, headData, false)
+                  this.handleChartOption(content, head, false)
+                  this.loading = false
                 })
                 break;
               case '2':
-                const completionData = this.handleFileData(text)
-                const completionContent = completionData.contentData
-                const completionlHead = completionData.headData
                 this.fileShowVisible = true
                 this.$nextTick(() => {
-                  this.handleChartOption(completionContent, completionlHead, false)
+                  this.handleChartOption(content, head, false)
                 })
                 break;
               case '3':
-                const ExtractionData = this.handleFileData(text)
-                const ExtractionContent = ExtractionData.contentData
-                const ExtractionHead = ExtractionData.headData
                 this.fileShowVisible = true
                 this.$nextTick(() => {
-                  this.handleChartOption(ExtractionContent, ExtractionHead, false)
+                  this.handleChartOption(content, head, false)
                 })
                 break;
               case '4':
-                const assessmentData = this.handleFileData(text)
-                const assessmentcontent = assessmentData.contentData
-                const assessmenthead = assessmentData.headData
                 this.fileShowVisible = true
                 this.$nextTick(() => {
-                  this.handleChartOption(assessmentcontent, assessmenthead, false)
+                  this.handleChartOption(content, head, false)
                 })
                 break;
               case '5':
@@ -439,31 +430,10 @@ export default {
           .catch((error) => {
             console.error("Failed to fetch the log file:", error);
             this.$modal.msgSuccess("文件读取错误");
+            this.loading=false
           });
       });
     },
-    handleOriginalFile(id, url) {
-      const newUrl = `${process.env.VUE_APP_BASE_API}${url}`;
-      this.fetchLogFile(newUrl)
-        .then((text) => {
-          if (this.chart != null && this.chart != "" && this.chart != undefined) {
-            this.chart.dispose();
-            this.chart = null
-          }
-          const originalData = this.handleFileData(text)
-          const originalContent = originalData.contentData
-          const originalHead = originalData.headData
-          this.fileShowVisible = true
-          this.loading = false
-          this.$nextTick(() => {
-            this.handleChartOption(originalContent, originalHead, true)
-          })
-        })
-        .catch((error) => {
-          console.error("Failed to fetch the log file:", error);
-          this.$modal.msgSuccess("文件读取错误");
-        });
-    },
     // 读取文件内容
     async fetchLogFile(url) {
       try {
@@ -511,6 +481,7 @@ export default {
     handleChartOption(content, head, ismarkPoint) {
       const color = ['#5470c6', '#91cc75', '#fac858', '#ee6666', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
       this.chart = echarts.init(this.$refs.completionChartRef);
+      this.chart.showLoading();
       // series数据
       let series
       if (ismarkPoint) {
@@ -575,12 +546,13 @@ export default {
         series: series
       };
       this.chart.setOption(option);
+      this.chart.hideLoading();
     },
     // 切换表格/曲线展示
     changeShow() {
       this.isTableShow = !this.isTableShow
       if (!this.isTableShow) {
-        this.handleFile(this.resultFileId)
+        this.handleFile(this.resultFileId, this.fileType)
       } else {
         this.tableShow(this.resultFileId)
       }