...

src/components/DataModal/common/DeviceAnalysis.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="device-analysis">
     <div style="height: 55px;display: flex;flex-direction: column;justify-content: flex-end;padding: 0 16px;">
-      <el-select size="mini" v-model="collectEntityId" placeholder="请选择">
+      <el-select size="mini" v-model="collectEntityId" :disabled="!selectOptions || selectOptions.length <= 0" placeholder="请选择">
         <el-option
           v-for="item in selectOptions"
           :key="item.value"
@@ -11,7 +11,7 @@
       </el-select>
     </div>
 
-    <div class="charts-outer">
+    <div v-if="selectOptions && selectOptions.length > 0" class="charts-outer">
       <div class="charts-inner">
         <jg-chart :_height="chartHeight" :option="optionToday"/>
         <div class="chart-right-text">
@@ -85,13 +85,15 @@
         </div>
       </div>
     </div>
+    <div v-else style="flex: 1" v-loading="true" element-loading-background="inherit"/>
   </div>
 </template>
 
 <script>
-import { currentCollectEntity } from '@/api/CollectEntity'
-import JgChart from '@/components/JgChart/index'
+import { findEntityByAcqId } from '@/api/CollectEntity'
+import JgChart from '@/components/JgChart'
 import { findDuration } from '@/api/DeviceRunRecord'
+import { mapState } from 'vuex'
 
 export default {
   name: 'DeviceAnalysis',
@@ -353,6 +355,11 @@ export default {
       },
     }
   },
+  computed: {
+    ...mapState({
+      acquisitionStationId: state => state.company.acquisitionStationId,
+    }),
+  },
   watch: {
     collectEntityId: {
       handler() {
@@ -362,7 +369,10 @@ export default {
   },
   methods: {
     getCollectEntity() {
-      currentCollectEntity().then(res => {
+      const params = {
+        acquisitionStationId: this.acquisitionStationId
+      }
+      findEntityByAcqId(params).then(res => {
         if (res && res.code === '200') {
           const selectOptions = []
           for (const item of res.data) {
@@ -429,6 +439,8 @@ export default {
   .device-analysis {
     width: 100%;
     height: 100%;
+    display: flex;
+    flex-direction: column;
 
     .charts-outer {
       flex: 1;

src/components/DataModal/common/RealtimeLine.vue

@@ -49,6 +49,7 @@ export default {
     ...mapState({
       realtimeDataMap: (state, getter) => state.queue.realtimeDataMap,
       lastTime: (state, getter) => state.queue.lastTime,
+      acquisitionStationId: state => state.company.acquisitionStationId,
     }),
     chartBoxStyle() {
       const baseX = this.x === 1 ? 99 : 90
@@ -232,7 +233,7 @@ export default {
           this.yMaxMap = yMaxMap
         }
       })
-      await findAll().then(res => {
+      await findAll({ acquisitionStationId: this.acquisitionStationId }).then(res => {
         if (res && res.code === '200') {
           const obj = {}
           res.data.forEach((val, index) => {
@@ -247,7 +248,8 @@ export default {
       const params = {
         start: moment().subtract(5, 'minutes').valueOf(),
         end: moment().valueOf(),
-        step: 2
+        step: 2,
+        acquisitionStationId: this.acquisitionStationId
       }
       await historyChartAllData(params).then(res => {
         if (res && res.code === '200') {