提交

src/components/echarts/MyEchartMap.vue

@@ -29,9 +29,8 @@ const GetEchar = async (name: string) => {
     let chartDom = document.getElementById('chartMap')
     myCharts.value?.dispose()
     myCharts.value = echarts.init(chartDom)
-    if (name != '中国') {
+    name == '中国' ? (showCircle.value = false) : (showCircle.value = true)
-        showCircle.value = true
+
-    }
     echarts.registerMap(name, await fetchConfig(name)) //注册可用的地图
     let option = {
         title: {
@@ -127,7 +126,7 @@ const GetEchar = async (name: string) => {
                     shadowOffsetY: 0,
                     borderWidth: 0
                 }
-            },
+            }
             // regions: [
             //     {
             //         name: '南海诸岛',
@@ -161,11 +160,9 @@ const GetEchar = async (name: string) => {
 }
 
 const MapReturn = (name: string) => {
-    let area = dictData.state.area[0].children
+    let area = dictData.state.area?.[0]?.children ?? []
     let list = {}
-
     let flag = true
-
     for (let i = 0; i < area.length; i++) {
         if (area[i].name == name) {
             console.log(11111)

src/views/Event-boot/Region/distribution.vue

@@ -33,27 +33,29 @@
                 </el-col>
                 <el-col :span="12">
                     <my-echart class="tall" :options="echartList" />
-                    <el-table class="tall" stripe :data="distributionData" border>
+                    <div class="tall">
-                        <el-table-column
+                        <vxe-table height="auto" auto-resize :data="distributionData" v-bind="defaultAttribute">
-                            prop="qy"
+                            >
-                            :label="
+                            <vxe-column
-                                titleA == '电压等级'
+                                field="qy"
-                                    ? '电压等级'
+                                :title="
-                                    : titleA == '终端厂家'
+                                    titleA == '电压等级'
-                                    ? '终端厂家'
+                                        ? '电压等级'
-                                    : titleA == '干扰源类型'
+                                        : titleA == '终端厂家'
-                                    ? '干扰源类型'
+                                        ? '终端厂家'
-                                    : titleA == '电网拓扑'
+                                        : titleA == '干扰源类型'
-                                    ? '区域'
+                                        ? '干扰源类型'
-                                    : ''
+                                        : titleA == '电网拓扑'
-                            "
+                                        ? '区域'
-                            align="center"
+                                        : ''
-                            show-overflow-tooltip
+                                "
-                        ></el-table-column>
+                                show-overflow-tooltip
-                        <el-table-column prop="jcd" label="监测点数(个数)" align="center"></el-table-column>
+                            ></vxe-column>
-                        <el-table-column prop="zc" label="通讯正常(个数)" sortable align="center"></el-table-column>
+                            <vxe-column field="jcd" title="监测点数(个数)"></vxe-column>
-                        <el-table-column prop="zd" label="通讯中断(个数)" sortable align="center"></el-table-column>
+                            <vxe-column field="zc" title="通讯正常(个数)" sortable></vxe-column>
-                    </el-table>
+                            <vxe-column field="zd" title="通讯中断(个数)" sortable></vxe-column>
+                        </vxe-table>
+                    </div>
                 </el-col>
             </el-row>
         </div>
@@ -63,6 +65,7 @@
 import Area from '@/components/form/area/index.vue'
 import { getAreaLineDetail } from '@/api/Region'
 import { useDictData } from '@/stores/dictData'
+import { defaultAttribute } from '@/components/table/defaultAttribute'
 import MyEchartMap from '@/components/echarts/MyEchartMap.vue'
 import MyEchart from '@/components/echarts/MyEchart.vue'
 import { ref, reactive, onMounted, provide } from 'vue'
@@ -247,7 +250,7 @@ const histogram = (res: any) => {
                     : '' // 给X轴加单位
         },
         tooltip: {
-            formatter: function (params) {
+            formatter: function (params: any) {
                 // console.log(params);
                 var tips = ''
                 for (var i = 0; i < params.length; i++) {
@@ -269,7 +272,7 @@ const histogram = (res: any) => {
                     : titleA.value == '电网拓扑'
                     ? '(区域)'
                     : '', // 给X轴加单位
-            data: distributionData.value.map(item => item.qy)
+            data: distributionData.value.map((item: any) => item.qy)
         },
         yAxis: {
             name: '监测点数（个）' // 给X轴加单位
@@ -279,7 +282,7 @@ const histogram = (res: any) => {
                 {
                     //   name: '暂降次数',
                     type: 'bar',
-                    data: distributionData.value.map(item => item.jcd),
+                    data: distributionData.value.map((item: any) => item.jcd),
                     barMaxWidth: 30,
                     itemStyle: {
                         normal: {

src/views/dashboard/components/Tableabove.vue

@@ -5,59 +5,51 @@
         </span>
         <el-tabs tab-position="left" class="demo-tabs" style="margin-top: 10px">
             <el-tab-pane label="区域">
-                <el-table :data="areaData" border height="calc(100vh - 220px)" stripe style="width: 100%">
+                <div class="default-main">
-                    <template v-for="item in tableHeaderAera">
+                    <vxe-table :data="areaData" v-bind="defaultAttribute" height="auto" auto-resize>
-                        <el-table-column
+                        <vxe-column
-                            align="center"
+                            v-for="item in tableHeaderAera"
-                            :prop="item.prop"
+                            :field="item.prop"
-                            :label="item.label"
+                            :title="item.label"
                             :min-width="item.width"
                             :sortable="item.sortable"
-                        ></el-table-column>
+                            :formatter="formatter"
-                    </template>
+                        ></vxe-column>
-                </el-table>
+                    </vxe-table>
+                </div>
             </el-tab-pane>
             <el-tab-pane label="电压等级">
-                <el-table :data="levelData" border height="calc(100vh - 220px)" stripe style="width: 100%">
+                <div class="default-main">
-                    <template v-for="item in tableHeaderLevel">
+                    <vxe-table :data="levelData" v-bind="defaultAttribute" height="auto" auto-resize>
-                        <el-table-column
+                        <vxe-column
-                            align="center"
+                            v-for="item in tableHeaderLevel"
-                            :prop="item.prop"
+                            :field="item.prop"
-                            :label="item.label"
+                            :title="item.label"
                             :min-width="item.width"
                             :sortable="item.sortable"
-                        ></el-table-column>
+                        ></vxe-column>
-                    </template>
+                    </vxe-table>
-                </el-table>
+                </div>
             </el-tab-pane>
             <el-tab-pane label="月份">
-                <el-table :data="shareData" border height="calc(100vh - 220px)" stripe style="width: 100%">
+                <div class="default-main">
-                    <el-table-column
+                    <vxe-table :data="shareData" v-bind="defaultAttribute" height="auto" auto-resize>
-                        prop="month"
+                        <vxe-column field="month" title="月份" min-width="120px" sortable></vxe-column>
-                        label="月份"
+                        <vxe-column field="notAssociated" title="电压暂降次数" sortable></vxe-column>
-                        align="center"
+                    </vxe-table>
-                        min-width="120px"
+                </div>
-                        sortable
-                    ></el-table-column>
-                    <el-table-column prop="notAssociated" align="center" label="电压暂降次数" sortable>
-                        <!-- <template slot-scope="scope">
-                            <span v-if="scope.row.month != '总计'">
-                                {{ scope.row.linked + scope.row.notAssociated }}
-                            </span>
-                            <span v-else>{{ scope.row.notAssociated }}</span>
-                        </template> -->
-                    </el-table-column>
-                </el-table>
             </el-tab-pane>
         </el-tabs>
     </div>
 </template>
 <script setup lang="ts">
-import { ref, reactive, defineExpose } from 'vue'
+import { ref, reactive, defineExpose, computed } from 'vue'
-const tableData = ref<any[]>([])
+import { defaultAttribute } from '@/components/table/defaultAttribute'
+
 const areaData = ref<any[]>([])
 const levelData = ref<any[]>([])
 const shareData = ref<any[]>([])
+
 const tableHeaderAera = ref<any[]>([
     { prop: 'areaName', label: '区域名称', width: '120px' },
     { prop: 'monitoringPoints', label: '监测点数', sortable: true },
@@ -104,10 +96,20 @@ const info = (list: any) => {
         ...list.monthlyStatistics.monthCalculation
     ]
 }
+const formatter = (row: any) => {
+    if (row.column.field == 'areaName') {
+        return (row.cellValue = row.cellValue.replace('\n', ''))
+    } else {
+        return row.cellValue
+    }
+}
 defineExpose({ info })
 </script>
 <style lang="scss" scoped>
 ::v-deep(.el-tabs--left) {
     height: calc(100vh - 220px);
 }
+.default-main {
+    height: calc(100vh - 220px);
+}
 </style>

src/views/voltage/sags/operationsManagement/statistics.vue

@@ -120,48 +120,32 @@ const tableStore = new TableStore({
                 text: '区域'
             },
             xAxis: {
-                type: 'category',
                 data: tableStore.table.data.area.areaInfo.map(
                     (item: any) => item.areaName + `(${item.numberOfTerminals})`
                 )
             },
-            yAxis: {
+            tooltip: {
-                type: 'value'
+                formatter: function (params) {
-            },
+                    var tips = ''
-            options: {
+                    tips += params[0].name + '</br/>'
-                tooltip: {
+                    for (var i = 0; i < params.length; i++) {
-                    trigger: 'axis',
+                        if (params[i].value == 3.14159) {
-                    axisPointer: {
+                            tips += params[i].seriesName + ':暂无数据<br/>'
-                        type: 'shadow',
+                        } else {
-                        label: {
+                            tips += params[i].seriesName + ':' + params[i].value + '%<br/>'
-                            color: '#fff',
-                            fontSize: 16
                         }
-                    },
-                    textStyle: {
-                        color: '#fff',
-                        fontStyle: 'normal',
-                        opacity: 0.35,
-                        fontSize: 14
-                    },
-                    backgroundColor: 'rgba(0,0,0,0.35)',
-                    formatter: function (params) {
-                        var tips = ''
-                        tips += params[0].name + '</br/>'
-                        for (var i = 0; i < params.length; i++) {
-                            if (params[i].value == 3.14159) {
-                                tips += params[i].seriesName + ':暂无数据<br/>'
-                            } else {
-                                tips += params[i].seriesName + ':' + params[i].value + '%<br/>'
-                            }
-                        }
-                        return tips
                     }
-                },
+                    return tips
+                }
+            },
+            yAxis: { name: '%' },
+            options: {
                 series: [
                     {
                         stack: 'one',
                         name: '投运',
+                        barMaxWidth: 30,
+                        barMinHeight: 5,
                         data: tableStore.table.data.area.areaInfo.map((item: any) => item.normalRate),
                         itemStyle: {
                             normal: {
@@ -189,6 +173,8 @@ const tableStore = new TableStore({
                     {
                         name: '热备用',
                         stack: 'one',
+                        barMaxWidth: 30,
+                        barMinHeight: 5,
                         data: tableStore.table.data.area.areaInfo.map((item: any) => item.shutdownRate),
                         type: 'bar',
                         itemStyle: {
@@ -216,6 +202,8 @@ const tableStore = new TableStore({
                     {
                         name: '在线率',
                         stack: 'two',
+                        barMaxWidth: 30,
+                        barMinHeight: 5,
                         data: tableStore.table.data.area.areaInfo.map((item: any) => item.onlineRate),
                         itemStyle: {
                             normal: {
@@ -265,47 +253,33 @@ const tableStore = new TableStore({
                 text: '终端厂家'
             },
             xAxis: {
-                type: 'category',
                 data: tableStore.table.data.factory.areaInfo.map(
                     (item: any) => item.areaName + `(${item.numberOfTerminals})`
                 )
             },
             yAxis: {
-                type: 'value'
+                name: '%'
+            },
+            tooltip: {
+                formatter: function (params: any) {
+                    var tips = ''
+                    tips += params[0].name + '</br/>'
+                    for (var i = 0; i < params.length; i++) {
+                        if (params[i].value == 3.14159) {
+                            tips += params[i].seriesName + ':暂无数据<br/>'
+                        } else {
+                            tips += params[i].seriesName + ':' + params[i].value + '%<br/>'
+                        }
+                    }
+                    return tips
+                }
             },
             options: {
-                tooltip: {
-                    trigger: 'axis',
-                    axisPointer: {
-                        type: 'shadow',
-                        label: {
-                            color: '#fff',
-                            fontSize: 16
-                        }
-                    },
-                    textStyle: {
-                        color: '#fff',
-                        fontStyle: 'normal',
-                        opacity: 0.35,
-                        fontSize: 14
-                    },
-                    backgroundColor: 'rgba(0,0,0,0.35)',
-                    formatter: function (params: any) {
-                        var tips = ''
-                        tips += params[0].name + '</br/>'
-                        for (var i = 0; i < params.length; i++) {
-                            if (params[i].value == 3.14159) {
-                                tips += params[i].seriesName + ':暂无数据<br/>'
-                            } else {
-                                tips += params[i].seriesName + ':' + params[i].value + '%<br/>'
-                            }
-                        }
-                        return tips
-                    }
-                },
                 series: [
                     {
                         stack: 'one',
+                        barMaxWidth: 30,
+                        barMinHeight: 5,
                         name: '投运',
                         data: tableStore.table.data.factory.areaInfo.map((item: any) => item.normalRate),
                         itemStyle: {
@@ -334,6 +308,8 @@ const tableStore = new TableStore({
                     {
                         name: '热备用',
                         stack: 'one',
+                        barMaxWidth: 30,
+                        barMinHeight: 5,
                         data: tableStore.table.data.factory.areaInfo.map((item: any) => item.shutdownRate),
                         type: 'bar',
                         itemStyle: {
@@ -361,6 +337,8 @@ const tableStore = new TableStore({
                     {
                         name: '在线率',
                         stack: 'two',
+                        barMaxWidth: 30,
+                        barMinHeight: 5,
                         data: tableStore.table.data.factory.areaInfo.map((item: any) => item.onlineRate),
                         itemStyle: {
                             normal: {