bugxiufu

pages/device/APF/comp/xieBo.vue

@@ -1,9 +1,10 @@
 <template>
     <view>
         <uni-data-checkbox v-model="parity" :localdata="parityOption" @change="initEcharts"></uni-data-checkbox>
-        <uni-data-checkbox v-model="dataRadio" :localdata="dataOptions" @change="initEcharts"></uni-data-checkbox>
+        <!-- <uni-data-checkbox v-model="dataRadio" :localdata="dataOptions" @change="initEcharts"></uni-data-checkbox> -->
+        <uni-data-select v-model="dataRadio" :localdata="dataOptions" @change="initEcharts"></uni-data-select>
         <view class="charts-box">
-            <qiun-data-charts type="column" :ontouch='true' :opts="opts" :chartData="chartData"/>
+            <qiun-data-charts type="bar" :ontouch="true" :opts="opts" :chartData="chartData" />
         </view>
     </view>
 </template>
@@ -26,7 +27,7 @@ export default {
                 {
                     text: '偶次',
                     value: 1,
-                }
+                },
             ],
             parity: 2,
             dataOptions: [],
@@ -44,7 +45,8 @@ export default {
             chartData: {},
             //您可以通过修改 config-ucharts.js 文件中下标为 ['column'] 的节点来配置全局默认参数，如都是默认参数，此处可以不传 opts 。实际应用过程中 opts 只需传入与全局默认参数中不一致的【某一个属性】即可实现同类型的图表显示不同的样式，达到页面简洁的需求。
             opts: {
-                enableScroll: true,
+                // enableScroll: true,
+                dataLabel:false,
                 color: [
                     '#1890FF',
                     '#91CB74',
@@ -68,18 +70,17 @@ export default {
                         },
                     ],
                 },
-                yAxis: {
-                    data: [
-                        {
-                            min: 0,
-                            tofix: 4,
-                        },
-                    ],
-                },
+                yAxis: {},
                 extra: {
-                    column: {
-                        width: 10,
-                        categoryGap: 1,
+                    bar: {
+                        type: 'group',
+                        width: 30,
+                        meterBorde: 1,
+                        meterFillColor: '#FFFFFF',
+                        activeBgColor: '#000000',
+                        activeBgOpacity: 0.08,
+                        seriesGap: 2,
+                        categoryGap: 6,
                     },
                 },
             },
@@ -127,8 +128,7 @@ export default {
                     let name1 = have['name']
                     let name2 = have.key.split('_')[0] + '_' + have.key.split('_')[1]
                     if (this.renderData[name1][name2][item.phase]) {
-                        this.renderData[name1][name2][item.phase][item.statisticalName] =
-                            item.statisticalData || 0
+                        this.renderData[name1][name2][item.phase][item.statisticalName] = item.statisticalData || 0
                     } else {
                         this.renderData[name1][name2][item.phase] = {
                             [item.statisticalName]: item.statisticalData || 0,
@@ -145,10 +145,10 @@ export default {
                     {
                         name: '负载谐波电压含有率序列',
                         key: 'Apf_HarmUR',
-                    }
+                    },
                 ]
                 Object.keys(this.renderData['电网侧']['Apf_HarmI']).forEach((item, index) => {
-                    type.forEach(item2 => {
+                    type.forEach((item2) => {
                         dataOptions.push({
                             text: item + '相' + item2.name,
                             pointer: item2.key + '_' + item,
@@ -159,7 +159,6 @@ export default {
                 this.dataOptions = dataOptions
                 console.log(dataOptions)
                 this.initEcharts()
-
             },
             deep: true,
             immediate: true,
@@ -168,19 +167,23 @@ export default {
     methods: {
         initEcharts() {
             let obj = JSON.parse(
-                JSON.stringify(this.renderData['电网侧']['Apf_HarmI'][Object.keys(this.renderData['电网侧']['Apf_HarmI'])[0]]),
+                JSON.stringify(
+                    this.renderData['电网侧']['Apf_HarmI'][Object.keys(this.renderData['电网侧']['Apf_HarmI'])[0]],
+                ),
             )
             let key = this.dataOptions[this.dataRadio].pointer.split('_')
             console.log(key)
             let name1 = key[0] + '_' + key[1]
             let name2 = key[2]
             this.chartData = {
-                categories: Object.keys(obj).map((item) => {
-                    // Apf_HarmI_Sys_36(A) 匹配36
-                    return Number(item.match(/\d+/)[0])
-                }).filter((item) => {
-                    return item % 2 === this.parity - 1
-                }),
+                categories: Object.keys(obj)
+                    .map((item) => {
+                        // Apf_HarmI_Sys_36(A) 匹配36
+                        return Number(item.match(/\d+/)[0])
+                    })
+                    .filter((item) => {
+                        return item % 2 === this.parity - 1
+                    }),
                 series: [
                     {
                         name: '电网侧',
@@ -196,14 +199,14 @@ export default {
                     },
                 ],
             }
-        }
-    }
+        },
+    },
 }
 </script>
 
 <style lang="scss">
 .charts-box {
     margin-top: 20rpx;
-    height: 800rpx;
+    height: 100vh;
 }
 </style>