联调全景展示 省级 详情页

src/api/device-boot/panorama.ts

@@ -49,3 +49,39 @@ export function getGridDiagramMonitor(data: any) {
 export function getHalfReport(data: any) {
     return request({ url: '/device-boot/line/getHalfReport', method: 'post', data })
 }
+// 综合评估概览数据
+export function getAssessOverview(data: any) {
+    return request({ url: '/harmonic-boot/grid/getAssessOverview', method: 'post', data })
+}
+// 稳态电能质量水平评价概览数据
+export function getEvaluationOverview(data: any) {
+    return request({ url: '/harmonic-boot/grid/getEvaluationOverview', method: 'post', data })
+}
+// 综合评估详细数据
+export function getAssessDetail(data: any) {
+    return request({ url: '/harmonic-boot/grid/getAssessDetail', method: 'post', data })
+}
+// 稳态电能质量水平平均值、标准差
+export function getEvaluationData(data: any) {
+    return request({ url: '/harmonic-boot/grid/getEvaluationData', method: 'post', data })
+}
+// 稳态指标超标详情
+export function evaluationDetail(data: any) {
+    return request({ url: '/harmonic-boot/grid/evaluationDetail', method: 'post', data })
+}
+// 各稳态指标的环比
+export function evaluationRatio(data: any) {
+    return request({ url: '/harmonic-boot/grid/evaluationRatio', method: 'post', data })
+}
+// 暂态统计评价
+export function getEventLevelEvaluation(data: any) {
+    return request({ url: '/event-boot/gridDiagram/getEventLevelEvaluation', method: 'post', data })
+}
+// 暂态统计详情
+export function getEventStatisticsList(data: any) {
+    return request({ url: '/event-boot/gridDiagram/getEventStatisticsList', method: 'post', data })
+}
+// 获取监测点暂降事件分析
+export function getEventReason(data: any) {
+    return request({ url: '/event-boot/areaAnalysis/getEventReason', method: 'post', data })
+}

src/views/pqs/qualityInspeection/panorama/components/details/evaluate.vue

@@ -3,29 +3,29 @@
     <el-dialog draggable title="综合评估详情" v-model="dialogVisible" width="1400px">
         <div>
             <vxe-table v-bind="defaultAttribute" ref="vxeRef" height="300px" :data="tableData">
-                <vxe-column field="devName" title="所属区域" />
+                <vxe-column field="deptName" title="所属区域" />
-                <vxe-column field="devName" title="综合评估得分" />
+                <vxe-column field="assessData" title="综合评估得分" :formatter="formatter" />
-                <vxe-column field="devName" title="指标合格率" />
+                <vxe-column field="qualifyData" title="指标合格率" :formatter="formatter" />
                 <vxe-colgroup title="各项指标得分">
                     <vxe-colgroup title="电压偏差">
-                        <vxe-column field="devName" title="评估得分" />
+                        <vxe-column field="vdevAssessData" title="评估得分" :formatter="formatter" />
-                        <vxe-column field="devName" title="指标合格率" />
+                        <vxe-column field="vdevQualifyData" title="指标合格率" :formatter="formatter" />
                     </vxe-colgroup>
-                    <vxe-colgroup title="评率偏差">
+                    <vxe-colgroup title="频率偏差">
-                        <vxe-column field="devName" title="评估得分" />
+                        <vxe-column field="freqAssessData" title="评估得分" :formatter="formatter" />
-                        <vxe-column field="devName" title="指标合格率" />
+                        <vxe-column field="freqQualifyData" title="指标合格率" :formatter="formatter" />
                     </vxe-colgroup>
                     <vxe-colgroup title="谐波含量">
-                        <vxe-column field="devName" title="评估得分" />
+                        <vxe-column field="harmAssessData" title="评估得分" :formatter="formatter" />
-                        <vxe-column field="devName" title="指标合格率" />
+                        <vxe-column field="harmQualifyData" title="指标合格率" :formatter="formatter" />
                     </vxe-colgroup>
                     <vxe-colgroup title="电压闪变">
-                        <vxe-column field="devName" title="评估得分" />
+                        <vxe-column field="flickerAssessData" title="评估得分" :formatter="formatter" />
-                        <vxe-column field="devName" title="指标合格率" />
+                        <vxe-column field="flickerQualifyData" title="指标合格率" :formatter="formatter" />
                     </vxe-colgroup>
                     <vxe-colgroup title="三相不平衡度">
-                        <vxe-column field="devName" title="评估得分" />
+                        <vxe-column field="unbalanceAssessData" title="评估得分" :formatter="formatter" />
-                        <vxe-column field="devName" title="指标合格率" />
+                        <vxe-column field="unbalanceQualifyData" title="指标合格率" :formatter="formatter" />
                     </vxe-colgroup>
                 </vxe-colgroup>
             </vxe-table>
@@ -39,42 +39,63 @@
 import { ref } from 'vue'
 import MyEChart from '@/components/echarts/MyEchart.vue'
 import { defaultAttribute } from '@/components/table/defaultAttribute'
-
+import { getAssessDetail } from '@/api/device-boot/panorama'
 const dialogVisible: any = ref(false)
 
-const tableData: any = ref([
+const tableData: any = ref([])
-    {
-        devName: 123
-    }
-])
 
-const picEChart = ref({
+const picEChart = ref()
-    title: {
-        text: ''
-    },
-    xAxis: {
-        name: '(区域)',
-        data: ['承德', '承德', '承德', '承德', '承德', '承德', '承德']
-    },
-    yAxis: {
-        name: '',
-        min: 0,
-        max: 100
-    },
-    options: {
-        series: [
-            {
-                name: '评估得分',
-                type: 'bar',
-
-                data: [12, 12, 12, 12, 12, 12, 12]
-            }
-        ]
-    }
-})
 const open = async (row: any) => {
+    getAssessDetail(row).then(res => {
+        tableData.value = res.data
+        picEChart.value = {
+            tooltip: {
+                formatter: function (params: any) {
+                    let tips = ''
+
+                    if (params[0].value == 3.14159) {
+                        tips += params[0].name + ':暂无数据<br/>'
+                    } else {
+                        tips += params[0].name + ':' + params[0].value + '%<br/>'
+                    }
+
+                    return tips
+                }
+            },
+            title: {
+                text: ''
+            },
+            xAxis: {
+                name: '(区域)',
+                data: res.data.map((item: any) => item.deptName)
+            },
+            yAxis: {
+                name: '',
+                min: 0,
+                max: 100
+            },
+            options: {
+                series: [
+                    {
+                        name: '评估得分',
+                        type: 'bar',
+
+                        data: res.data.map((item: any) => item.assessData)
+                    }
+                ]
+            }
+        }
+    })
+
     dialogVisible.value = true
 }
+const formatter = (row: any) => {
+    if (row.cellValue == 3.14159) {
+        return '暂无数据'
+    } else {
+        return row.cellValue
+    }
+}
 
 defineExpose({ open })
 </script>

src/views/pqs/qualityInspeection/panorama/components/details/point.vue

@@ -15,8 +15,13 @@
             <el-col :span="12">
                 <div class="title">
                     <span>分布统计</span>
-                    <el-select v-model="time" style="width: 120px; margin-right: 80px" @change="statiStics">
+                    <el-select
-                        <el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id" />
+                        v-model="statisticalType"
+                        :value-key='id'
+                        style="width: 120px; margin-right:  80px"
+                        @change="statiStics"
+                    >
+                        <el-option v-for="item in options" :key="item.id" :label="item.name" :value="item" />
                     </el-select>
                 </div>
                 <div class="pie">
@@ -54,10 +59,12 @@ import { useDictData } from '@/stores/dictData'
 import { getGridDiagramLineTendency, getGridDiagramLineData, getHalfReport } from '@/api/device-boot/panorama'
 const dictData = useDictData()
 const dialogVisible: any = ref(false)
-const time = ref('1')
+
 const Voltage = dictData.getBasicData('Dev_Voltage_Stand')
 const tableData: any = ref([])
 const options = dictData.getBasicData('Statistical_Type', ['Report_Type'])
+const time = ref('1')
+const statisticalType = ref(options[0])
 const loadTypeArr = dictData.getBasicData('Interference_Source')
 
 const rowList: any = ref({})
@@ -132,13 +139,13 @@ const analysis = (e: any) => {
 }
 // 统计
 const statiStics = () => {
-    getGridDiagramLineData(rowList.value).then(res => {
+    getGridDiagramLineData({ ...rowList.value, statisticalType: statisticalType.value }).then(res => {
         picEChart.value = {
             title: {
                 text: ''
             },
             xAxis: {
-                name: '(区域)',
+             
                 data: res.data.map((item: any) => item.orgName)
             },
             yAxis: {

src/views/pqs/qualityInspeection/panorama/components/details/steadyState.vue

@@ -2,43 +2,47 @@
 <template>
     <!-- 终端 -->
     <el-dialog draggable title="稳态电能质量水平评估详情" v-model="dialogVisible" width="1400px">
-        <el-row style="height: 300px" :gutter="20">
+        <el-row style="height: 330px" :gutter="20">
-            <el-col :span="14">
+            <el-col :span="12">
                 <div class="title">
                     <span>稳态电能质量水平评估</span>
                 </div>
-                <vxe-table v-bind="defaultAttribute" size="mini" ref="vxeRef" height="260px" :data="tableData">
+                <div class="boxSteps">
-                    <vxe-column field="devName" width="110px" />
+                    <el-steps>
-
+                        <template v-for="(item, i) in Voltage">
-                    <vxe-colgroup title="500kV">
+                            <el-step
-                        <vxe-column field="devName" title="均值" />
+                                :class="active == i ? 'highlight' : ''"
-                        <vxe-column field="devName" title="标准差" />
+                                :title="item.name"
-                    </vxe-colgroup>
+                                @click="handleClick(i)"
-                    <vxe-colgroup title="220kV">
+                            ></el-step>
-                        <vxe-column field="devName" title="均值" />
+                        </template>
-                        <vxe-column field="devName" title="标准差" />
+                    </el-steps>
-                    </vxe-colgroup>
+                </div>
-                    <vxe-colgroup title="110kV">
+                <div v-for="(item, i) in evaluationData" class="evaluationData">
-                        <vxe-column field="devName" title="均值" />
+                    <el-row style="width: 100%">
-                        <vxe-column field="devName" title="标准差" />
+                        <el-col :span="12" style="display: flex">
-                    </vxe-colgroup>
+                            <img :src="url[i]" />
-                    <vxe-colgroup title="35kV">
+                            <span>{{ item.targetName }}</span>
-                        <vxe-column field="devName" title="均值" />
+                        </el-col>
-                        <vxe-column field="devName" title="标准差" />
+                        <el-col :span="12" style="display: flex">
-                    </vxe-colgroup>
+                            <div style="width: 150px">
-                    <vxe-colgroup title="其他">
+                                均值：
-                        <vxe-column field="devName" title="均值" />
+                                <span style="color: #339966">{{ item.avg == 3.14159 ? '--' : item.avg }}</span>
-                        <vxe-column field="devName" title="标准差" />
+                            </div>
-                    </vxe-colgroup>
+                            <div>
-                </vxe-table>
+                                标准差：
+                                <span style="color: #ff9900">{{ item.avg == 3.14159 ? '--' : item.avg }}</span>
+                            </div>
+                        </el-col>
+                    </el-row>
+                </div>
             </el-col>
-            <el-col :span="10">
+            <el-col :span="12">
                 <div class="title">
                     <span>稳态电能质量水平评估环比变化</span>
                 </div>
                 <div class="pie">
-                    <MyEChart style="height: 260px" :options="trendEChart" />
+                    <div style="height: 260px; width: 100%" ref="chartRef"></div>
-                    <!-- <div style="height: 260px" ref="chartRef" /> -->
                 </div>
             </el-col>
         </el-row>
@@ -47,153 +51,97 @@
                 <span>稳态电能质量水平评估详细列表</span>
             </div>
             <vxe-table v-bind="defaultAttribute" ref="vxeRef" height="300px" :data="tableData">
-                <vxe-column field="devName" title="变电站名称" />
+                <vxe-column field="deptName" title="区域名称" />
-                <vxe-column field="devName" title="超标天数" />
+                <vxe-column field="onlineNum" title="在线监测点数量(个)" />
-                <vxe-column field="devName" title="超标差值" />
+                <vxe-column field="overNum" title="超标监测点数量(个)" />
-                <vxe-column field="devName" title="在线监测点数量(个)" />
+                <vxe-column field="overRatio" title="超标监测点占比(%)" />
-                <vxe-column field="devName" title="超标监测点数量(个)" />
+
-                <vxe-column field="devName" title="超标监测点占比(%)" />
+                <vxe-colgroup :title="item" v-for="(item, i) in title">
+                    <vxe-column title="超标天数">
+                        <template #default="scope">
+                            <span>{{ scope.row.list[i].overDay }}</span>
+                        </template>
+                    </vxe-column>
+                    <vxe-column title="超标监测点数	">
+                        <template #default="scope">
+                            <span>{{ scope.row.list[i].overNum }}</span>
+                        </template>
+                    </vxe-column>
+                </vxe-colgroup>
             </vxe-table>
         </div>
     </el-dialog>
 </template>
 <script setup lang="ts">
-import { ref } from 'vue'
+import { ref, nextTick } from 'vue'
-import MyEChart from '@/components/echarts/MyEchart.vue'
+import echarts from '@/components/echarts/echarts'
-import echarts from '@/components/echarts/echarts.ts'
+import { useDictData } from '@/stores/dictData'
+import { color } from '@/components/echarts/color'
 import { defaultAttribute } from '@/components/table/defaultAttribute'
-
+import { getEvaluationData, evaluationDetail, evaluationRatio } from '@/api/device-boot/panorama'
 const dialogVisible: any = ref(false)
-const chartRef = ref()
+const rowList = ref({})
-const tableData: any = ref([
+const active: any = ref(1)
-    {
+const evaluationData: any = ref([])
-        devName: 123
-    }
-])
 
-const trendEChart = ref({
+const dictData = useDictData()
-    xAxis: {
+const Voltage: any = dictData.getBasicData('Dev_Voltage_Stand').filter(item => {
-        show: false
+    if (item.code == '35kV' || item.code == '500kV' || item.code == '220kV' || item.code == '110kV') {
-    },
+        return item
-    legend: {
-        data: ['1月', '2月', '3月']
-    },
-    yAxis: {
-        show: false
-    },
-
-    options: {
-        dataZoom: null,
-        radar: {
-            center: ['50%', '50%'],
-            radius: '65%',
-            startAngle: 90,
-            splitNumber: 5,
-            splitArea: {
-                areaStyle: {
-                    color: ['#FFFFFF', '#F5F9FF'].reverse()
-                }
-            },
-            axisLabel: {
-                show: false
-            },
-            axisLine: {
-                show: true,
-                lineStyle: {
-                    color: '#D2E4F8'
-                }
-            },
-            splitLine: {
-                show: true,
-                lineStyle: {
-                    color: '#D2E4F8'
-                }
-            },
-            name: {
-                formatter: '{value}',
-                textStyle: {
-                    color: '#656565',
-                    fontSize: 15
-                }
-            },
-            indicator: [
-                {
-                    name: '评率偏差',
-                    max: 100
-                },
-                {
-                    name: '电压偏差',
-                    max: 100
-                },
-                {
-                    name: '闪变',
-                    max: 100
-                },
-                {
-                    name: '电压总谐波畸变率',
-                    max: 100
-                },
-                {
-                    name: '三相电压不平衡度',
-                    max: 100
-                }
-            ]
-        },
-
-        series: [
-            {
-                name: '1月',
-                // type: 'radar',
-                symbol: 'none',
-                symbolSize: 6,
-                areaStyle: {
-                    normal: {
-                        color: '#80B2FF'
-                    }
-                },
-                itemStyle: {
-                    color: '#80B2FF'
-                },
-                lineStyle: {
-                    normal: {
-                        color: '#80B2FF',
-                        width: 2
-                    }
-                },
-                data: [9, 16, 16, 15, 12]
-            }
-        ]
     }
 })
-const echart = () => {
-    let chart = echarts.init(chartRef.value)
-    var dataname = ['评率偏差', '电压偏差', '闪变', '电压总谐波畸变率', '三相电压不平衡度']
-    var datamax = [20, 20, 20, 20, 20, 20]
-    var datavaule = [9, 16, 16, 15, 12, 8]
-    var datavaule1 = [6, 8, 10, 6, 5, 8]
-    var datavaule2 = [19, 19, 19, 19, 19, 19]
 
-    var indicator = []
+const chartRef = ref<HTMLDivElement>()
-    for (var i = 0; i < dataname.length; i++) {
+const url: any = [
+    new URL(`@/assets/img/PLPC.png`, import.meta.url),
+    new URL(`@/assets/img/DYPC.png`, import.meta.url),
+    new URL(`@/assets/img/JBL.png`, import.meta.url),
+    new URL(`@/assets/img/SXDY.png`, import.meta.url),
+    new URL(`@/assets/img/SB.png`, import.meta.url)
+]
+const tableData: any = ref([])
+const title = ['电压偏差', '频率偏差', '电压总谐波畸变率', '闪变', '三相电压不平衡度']
+
+const echart = (row: any) => {
+    let chart = echarts.init(chartRef.value as HTMLDivElement)
+
+    let dataname = ['频率偏差', '电压偏差', '电压总谐波畸变率', '三相电压不平衡度', '闪变']
+    let datamax = [100, 100, 100, 100, 100, 100]
+    let indicator = []
+    for (let i = 0; i < dataname.length; i++) {
         indicator.push({
             name: dataname[i],
             max: datamax[i]
         })
     }
 
-    let option = {
+    let option: any = {
         tooltip: {
-            show: true,
+            trigger: 'item',
-            trigger: 'item'
+            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)',
+            borderWidth: 0
         },
         legend: {
-            data: ['1月', '2月', '3月'],
+            data: row.map((item: any) => item.time),
             type: 'scroll',
             orient: 'vertical',
             icon: 'roundRect',
             right: '20',
-            top: 'center',
+
-            itemGap: 30,
+            itemGap: 10,
             itemWidth: 16,
             itemHeight: 16,
             textStyle: {
@@ -236,77 +184,69 @@ const echart = () => {
             indicator: indicator
         },
 
-        series: [
+        series: []
-            {
-                name: '1月',
-                type: 'radar',
-                symbol: 'none',
-                symbolSize: 6,
-                areaStyle: {
-                    normal: {
-                        color: '#80B2FF'
-                    }
-                },
-                itemStyle: {
-                    color: '#80B2FF'
-                },
-                lineStyle: {
-                    normal: {
-                        color: '#80B2FF',
-                        width: 2
-                    }
-                },
-                data: [datavaule]
-            },
-            {
-                name: '2月',
-                type: 'radar',
-                symbol: 'none',
-                symbolSize: 6,
-                areaStyle: {
-                    normal: {
-                        color: '#80B2FF'
-                    }
-                },
-                itemStyle: {
-                    color: '#80B2FF'
-                },
-                lineStyle: {
-                    normal: {
-                        color: '#80B2FF',
-                        width: 2
-                    }
-                },
-                data: [datavaule1]
-            },
-            {
-                name: '3月',
-                type: 'radar',
-                symbol: 'none',
-                symbolSize: 6,
-                areaStyle: {
-                    normal: {
-                        color: '#80B2FF'
-                    }
-                },
-                itemStyle: {
-                    color: '#80B2FF'
-                },
-                lineStyle: {
-                    normal: {
-                        color: '#80B2FF',
-                        width: 2
-                    }
-                },
-                data: [datavaule2]
-            }
-        ]
     }
+
+    row.forEach((item: any, i: any) => {
+        option.series.push({
+            name: item.time,
+            type: 'radar',
+            symbol: 'none',
+            areaStyle: {
+                normal: {
+                    color: color[i + 1]
+                }
+            },
+            itemStyle: {
+                color: color[i + 1]
+            },
+            data: [item.ratioList]
+        })
+    })
+
+    row.forEach((item: any, i: any) => {
+        option.series.push({
+            name: item.time + 1,
+            type: 'radar',
+            symbol: 'none',
+            areaStyle: {
+                normal: {
+                    color: color[i + 1]
+                }
+            },
+            itemStyle: {
+                color: color[i + 1]
+            },
+            data: [item.ratioList]
+        })
+    })
+
     chart.setOption(option)
 }
-// echart()
+
 const open = async (row: any) => {
+    rowList.value = row
     dialogVisible.value = true
+    // 稳态电能质量水平评估
+    handleClick(0)
+    //环比
+    evaluationRatio(row).then(res => {
+        echart(res.data)
+    })
+    // 稳态电能质量水平评估详细列表
+    evaluationDetail(row).then(res => {
+        tableData.value = res.data
+    })
+}
+// 点击电压等级
+const handleClick = (i: any) => {
+    active.value = i
+    getEvaluationData({
+        ...rowList.value,
+        voltageLevel: Voltage[i].id
+    }).then(res => {
+        evaluationData.value = res.data
+    })
 }
 
 defineExpose({ open })
@@ -328,7 +268,60 @@ defineExpose({ open })
     display: flex;
     justify-content: space-around;
 }
-:deep(.el-table thead) {
+.evaluationData {
-    color: #000;
+    height: 40px;
+    margin: 8px 30px;
+    width: 100%;
+    box-shadow: 1px 1px 1px 1px #e8e3e3;
+    display: flex;
+    font-size: 18px;
+    line-height: 40px;
+    img {
+        height: 30px;
+        width: 30px;
+        margin: 5px 30px;
+    }
+}
+
+.el-steps {
+    margin-top: 5px;
+}
+:deep(.el-step__icon) {
+    border: none;
+    background: #ccc;
+    margin-top: 5px;
+    width: 15px;
+    height: 15px;
+}
+:deep(.el-step__icon-inner) {
+    display: none;
+}
+:deep(.boxSteps) {
+    border-radius: 50px;
+    width: 60%;
+    height: 25px;
+    margin: auto;
+    margin-top: 30px;
+    .el-step__title {
+        line-height: 18px;
+        font-size: 16px;
+        margin-left: -10px;
+        font-weight: 500;
+        color: #000 !important;
+        position: relative;
+        top: -50px;
+    }
+}
+:deep(.highlight) {
+    .el-step__icon {
+        background: var(--el-color-primary);
+    }
+    .el-step__title {
+        font-weight: 700 !important;
+        color: var(--el-color-primary) !important;
+    }
+    // .is-wait {
+    //     color: var(--el-color-primary) !important;
+    // }
 }
 </style>

src/views/pqs/qualityInspeection/panorama/components/details/temporaryState.vue

@@ -18,8 +18,26 @@
             </vxe-table>
         </div>
         <div style="height: 300px; margin-top: 10px; display: flex">
-            <MyEChart style="height: 300px; width: 50%" :options="picEChart" />
+            <!-- 
-            <MyEChart style="height: 300px; width: 50%" :options="picEChart" />
+            -->
+            <div class="statistics-main">
+                <div class="statistics-box">
+                    <MyEChart style="height: 300px" :options="picEChart" />
+
+                    <el-table size="small" height="300px" :data="descentData">
+                        <el-table-column prop="name" label="暂降原因" width="80px" align="center" />
+                        <el-table-column prop="value" label="暂降次数" width="80px" align="center" />
+                    </el-table>
+                </div>
+
+                <div class="statistics-box">
+                    <MyEChart style="height: 300px" :options="picEChart1" />
+                    <el-table size="small" height="300px" :data="resembleData">
+                        <el-table-column prop="name" label="暂降原因" width="80px" align="center" />
+                        <el-table-column prop="value" label="暂降次数" width="80px" align="center" />
+                    </el-table>
+                </div>
+            </div>
         </div>
     </el-dialog>
 </template>
@@ -27,63 +45,105 @@
 import { ref } from 'vue'
 import MyEChart from '@/components/echarts/MyEchart.vue'
 import { defaultAttribute } from '@/components/table/defaultAttribute'
+import { getEventStatisticsList, getEventReason } from '@/api/device-boot/panorama'
 
 const dialogVisible: any = ref(false)
 
-const tableData: any = ref([
+const tableData: any = ref([])
-    {
+const descentData = ref([])
-        devName: 123
+const resembleData = ref([])
-    }
-])
 
-const picEChart = ref({
+const picEChart = ref({})
-    legend: {
+const picEChart1 = ref({})
-        orient: 'vertical'
+const open = async (row: any) => {
-    },
+    getEventStatisticsList(row).then((res: any) => {
-    xAxis: {
+        tableData.value = res.data
-        show: false
+    })
-    },
+    getEventReason(row).then(res => {
-    yAxis: {
+        descentData.value = res.data.reason
-        show: false
+        resembleData.value = res.data.type
-    },
+        picEChart.value = {
-    options: {
+            tooltip: {
-        dataZoom: null,
+                trigger: 'item'
-        series: [
+            },
-            {
+            legend: {
-                type: 'pie',
+                orient: 'vertical'
-
+            },
-                center: ['50%', '50%'],
+            xAxis: {
-                radius: '50%',
+                show: false
-                label: {
+            },
-                    formatter: function (e: any) {
+            yAxis: {
-                        let {
+                show: false
-                            data: { value, name }
+            },
-                        } = e
+            options: {
-                        return `${name}：${value}`
+                dataZoom: null,
-                    }
+                series: [
-                },
-
-                data: [
                     {
-                        name: '其他',
+                        type: 'pie',
-                        value: 53.4,
+                        center: ['40%', '50%'],
-                        itemStyle: {
+                        radius: '50%',
-                            color: '#ff0000'
+                        label: {
-                        }
+                            show: false,
-                    },
+                            position: 'outside',
-                    {
+                            textStyle: {
-                        name: '大型感应电动机启动',
+                                //数值样式
-                        value: 3.4
+                            }
+                        },
+                        data: res.data.reason
                     }
                 ]
             }
-        ]
+        }
-    }
+        picEChart1.value = {
-})
+            tooltip: {
-const open = async (row: any) => {
+                trigger: 'item'
+            },
+            legend: {
+                orient: 'vertical'
+            },
+            xAxis: {
+                show: false
+            },
+            yAxis: {
+                show: false
+            },
+            options: {
+                dataZoom: null,
+                series: [
+                    {
+                        type: 'pie',
+                        center: ['40%', '50%'],
+                        radius: '50%',
+                        label: {
+                            show: false,
+                            position: 'outside',
+                            textStyle: {
+                                //数值样式
+                            }
+                        },
+                        data: res.data.type
+                    }
+                ]
+            }
+        }
+    })
     dialogVisible.value = true
 }
 
 defineExpose({ open })
 </script>
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.statistics-main {
+    height: 300px;
+    display: grid;
+    width: 100%;
+    grid-template-columns: 1fr 1fr;
+
+    .statistics-box {
+        height: 300px;
+        // display: flex;
+        display: grid;
+        grid-template-columns: 2fr 1fr;
+    }
+}
+</style>

src/views/pqs/qualityInspeection/panorama/components/details/terminal.vue

@@ -17,8 +17,8 @@
                     <span>分布统计</span>
                 </div>
                 <div class="pie">
-                    <MyEChart style="height: 260px; width: 50%" :options="picEChart" />
+                    <MyEChart style="height: 260px; width: 60%" :options="picEChart" />
-                    <el-table size="small" height="260px" style="width: 240px" :data="picList">
+                    <el-table size="small" height="260px" style="width: 35%" :data="picList">
                         <el-table-column prop="orgName" width="80px" align="center"></el-table-column>
                         <el-table-column prop="onlineEvaluate" label="终端评价" align="center">
                             <template #default="scope">
@@ -113,7 +113,7 @@ const open = async (row: any) => {
         res.data.forEach((item: any) => {
             picData.push({
                 value: item.devCount,
-                name: `${item.orgName}：${item.devCount}台`,
+                name: `${item.orgName}`,
                 itemStyle: {
                     color: item.onlineEvaluate < 60 ? 'red' : item.onlineEvaluate < 90 ? 'orange' : 'green'
                 }
@@ -136,13 +136,21 @@ const open = async (row: any) => {
                     {
                         type: 'pie',
                         startAngle: 360,
-                        center: ['50%', '50%'],
+                        center: ['50%', '55%'],
-                        radius: ['25%', '35%'],
+                        radius: ['40%', '60%'],
                         endAngle: 0,
-
+                        labelLine: {
+                            length: 8,
+                            length2: 50,
+                            show: true
+                        },
+                        label: {
+                            padding: [0, -50],
+                            formatter: '{b}:{c}台\n\n'
+                        },
                         itemStyle: {
                             borderColor: '#fff',
-                            borderWidth: 5
+                            borderWidth: 1
                         },
 
                         data: picData

src/views/pqs/qualityInspeection/panorama/components/mapL.vue

@@ -1,7 +1,6 @@
 <template>
-    <div>
+    <div :class="show ? 'show' : 'noshow'">
-        <DatePicker ref="datePickerRef" style="display: none" />
+        <div class="boxLeft" :style="height">
-        <div class="boxLeft" :class="show ? 'show' : 'noshow'" :style="height">
             <div v-for="(item, i) in list" :style="boxHeight">
                 <div class="title">
                     <span>{{ item.title }}</span>
@@ -45,8 +44,8 @@
                                     <el-col :span="12">{{ item.titleT[1] }}</el-col>
                                 </el-row>
                                 <el-row :gutter="20" class="mt4">
-                                    <el-col :span="12" style="color: #2dcd28">{{item.list[4].numOne}}</el-col>
+                                    <el-col :span="12" style="color: #2dcd28">{{ item.list[4].numOne }}</el-col>
-                                    <el-col :span="12" style="color: #bd3124">{{item.list[4].numTwo}}</el-col>
+                                    <el-col :span="12" style="color: #bd3124">{{ item.list[4].numTwo }}</el-col>
                                 </el-row>
                             </div>
                         </div>
@@ -56,8 +55,8 @@
                             <img src="@/assets/img/500kv.png" alt="" />
                             <div class="row">
                                 <el-row>
-                                    <el-col :span="12" style="color: #2dcd28">{{item.list[0].numOne}}</el-col>
+                                    <el-col :span="12" style="color: #2dcd28">{{ item.list[0].numOne }}</el-col>
-                                    <el-col :span="12" style="color: #bd3124">{{item.list[0].numTwo}}</el-col>
+                                    <el-col :span="12" style="color: #bd3124">{{ item.list[0].numTwo }}</el-col>
                                 </el-row>
                             </div>
                         </div>
@@ -67,8 +66,8 @@
                             <img src="@/assets/img/220kv.png" />
                             <div class="row">
                                 <el-row>
-                                    <el-col :span="12" style="color: #2dcd28">{{item.list[1].numOne}}</el-col>
+                                    <el-col :span="12" style="color: #2dcd28">{{ item.list[1].numOne }}</el-col>
-                                    <el-col :span="12" style="color: #bd3124">{{item.list[1].numTwo}}</el-col>
+                                    <el-col :span="12" style="color: #bd3124">{{ item.list[1].numTwo }}</el-col>
                                 </el-row>
                             </div>
                         </div>
@@ -78,8 +77,8 @@
                             <img src="@/assets/img/110kv.png" />
                             <div class="row">
                                 <el-row>
-                                    <el-col :span="12" style="color: #2dcd28">{{item.list[2].numOne}}</el-col>
+                                    <el-col :span="12" style="color: #2dcd28">{{ item.list[2].numOne }}</el-col>
-                                    <el-col :span="12" style="color: #bd3124">{{item.list[2].numTwo}}</el-col>
+                                    <el-col :span="12" style="color: #bd3124">{{ item.list[2].numTwo }}</el-col>
                                 </el-row>
                             </div>
                         </div>
@@ -89,8 +88,8 @@
                             <img src="@/assets/img/35kv.png" />
                             <div class="row">
                                 <el-row>
-                                    <el-col :span="12" style="color: #2dcd28">{{item.list[3].numOne}}</el-col>
+                                    <el-col :span="12" style="color: #2dcd28">{{ item.list[3].numOne }}</el-col>
-                                    <el-col :span="12" style="color: #bd3124">{{item.list[3].numTwo}}</el-col>
+                                    <el-col :span="12" style="color: #bd3124">{{ item.list[3].numTwo }}</el-col>
                                 </el-row>
                             </div>
                         </div>
@@ -258,7 +257,6 @@
 
 <script setup lang="ts">
 import { onMounted, reactive, ref, provide } from 'vue'
-import DatePicker from '@/components/form/datePicker/index.vue'
 import { useDictData } from '@/stores/dictData'
 import { mainHeight } from '@/utils/layout'
 import { ArrowRight } from '@element-plus/icons-vue'
@@ -272,12 +270,11 @@ const show = ref(false)
 const standRef = ref()
 const terminalRef = ref()
 const pointRef = ref()
-const datePickerRef = ref()
 const list: any = ref([
     {
         title: '变电站',
         img: new URL(`@/assets/img/BDZ.png`, import.meta.url),
-        titleT:['总数','告警'],
+        titleT: ['总数', '告警'],
         list: [
             {
                 numOne: 1,
@@ -304,7 +301,7 @@ const list: any = ref([
     {
         title: '终端统计',
         img: new URL(`@/assets/img/ZD.png`, import.meta.url),
-        titleT:['终端个数','终端在线率'],
+        titleT: ['终端个数', '终端在线率'],
         list: [
             {
                 numOne: 1,
@@ -331,7 +328,7 @@ const list: any = ref([
     {
         title: '监测点统计',
         img: new URL(`@/assets/img/JCD.png`, import.meta.url),
-        titleT:['总数','在线'],
+        titleT: ['总数', '在线'],
         list: [
             {
                 numOne: 1,
@@ -372,22 +369,14 @@ const open = (e: any) => {
 }
 const info = (row: any) => {
     let form = {
+        ...row,
         id: row.orgNo,
         deptIndex: row.orgNo,
         orgId: row.orgNo,
         ids: [],
         statisticalType: dictData.getBasicData('Statistical_Type', ['Report_Type'])[0],
         isUpToGrid: row.isUpToGrid,
-        monitorFlag: row.isUpToGrid,
+        monitorFlag: row.isUpToGrid
-        // startTime: datePickerRef.value.timeValue[0],
-        // searchBeginTime: datePickerRef.value.timeValue[0],
-        // endTime: datePickerRef.value.timeValue[1],
-        // searchEndTime: datePickerRef.value.timeValue[1],
-        startTime:`2023-07-01`,
-        searchBeginTime: `2023-07-01`,
-        endTime: `2023-07-30`,
-        searchEndTime: `2023-07-30`,
-        type: datePickerRef.value.interval
     }
     formRow.value = form
     getSubLineGiveAnAlarm(form).then()
@@ -401,8 +390,8 @@ defineExpose({ info })
 <style lang="scss" scoped>
 .boxLeft {
     background-color: #fff;
-    width: 400px;
+    width: 100%;
-    padding: 10px;
+    padding: 10px 0px 10px 10px;
     font-size: 13px;
     overflow: hidden;
 }
@@ -431,9 +420,9 @@ defineExpose({ info })
     // height: ;
     display: flex;
     justify-content: space-between;
-    font-weight: 550;
+    font-size: 16px;
     height: 22px;
-    line-height: 22px;
+    line-height: 23px;
     padding-left: 5px;
     width: 100%;
     background-image: linear-gradient(to right, #a4e5da, #fff);
@@ -444,6 +433,7 @@ defineExpose({ info })
         font-size: 12px;
         cursor: pointer;
     }
+    
 }
 .infoTop {
     display: flex;
@@ -481,16 +471,20 @@ defineExpose({ info })
     height: 200px;
     cursor: pointer;
 }
+
 .show {
     width: 0px;
-    padding: 0;
-
     transition: all 0.3s ease;
+    .boxLeft {
+        padding: 0;
+    }
 }
 .noshow {
-    width: 400px;
+    width: 25%;
-    padding: 10px;
     transition: all 0.3s ease;
+    .boxLeft {
+        padding: 10px 0px 10px 10px;
+    }
 }
 :deep(.el-card) {
     --el-card-padding: 10px !important;

src/views/pqs/qualityInspeection/panorama/components/mapR.vue

@@ -1,7 +1,6 @@
 <template>
-    <div>
+    <div :class="show ? 'show' : 'noshow'">
-        <DatePicker ref="datePickerRef" style="display: none" />
+        <div class="boxLeft" :style="height">
-        <div class="boxLeft" :class="show ? 'show' : 'noshow'" :style="height">
             <!-- 综合评估 -->
             <div>
                 <div class="title">
@@ -12,9 +11,29 @@
                     </span>
                 </div>
                 <div class="evaluate">
-                    <div v-for="item in evaluate" style="width: 40px">
+                    <div v-for="item in assessList" style="min-width: 50px">
                         <div>{{ item.name }}</div>
-                        <div style="margin-top: 5px">{{ item.value }}</div>
+                        <div
+                            style="margin-top: 5px"
+                            :style="{
+                                color:
+                                    item.score == 3.14159
+                                        ? ''
+                                        : item.score > 4.5
+                                        ? '#339966'
+                                        : item.score > 4
+                                        ? '#3399ff'
+                                        : item.score > 3
+                                        ? '#ffcc33'
+                                        : item.score > 2
+                                        ? '#ff9900'
+                                        : item.score > 0
+                                        ? '#cc0000'
+                                        : ''
+                            }"
+                        >
+                            {{ item.score == 3.14159 ? '/' : item.score }}
+                        </div>
                     </div>
                 </div>
             </div>
@@ -31,9 +50,11 @@
                     <div class="top">
                         <span>
                             监测点越限占比:
-                            <span class="num">65%</span>
+                            <span class="num">
+                                {{ harmonicLineRatio == 3.14159 ? '暂无数据' : harmonicLineRatio + '%' }}
+                            </span>
                         </span>
-                        <el-select v-model="value" style="width: 120px" size="small">
+                        <el-select v-model="harmonicType" style="width: 120px" @change="harmonicChange" size="small">
                             <el-option
                                 v-for="item in options"
                                 :key="item.value"
@@ -42,7 +63,7 @@
                             />
                         </el-select>
                     </div>
-                    <MyEChart :style="EchHeight" :options="WTCharts" />
+                    <MyEChart :style="EchHeight" :options="harmonicCharts" />
                 </div>
             </div>
             <!-- 暂态电能质量水平评价 -->
@@ -58,15 +79,10 @@
                     <div class="top">
                         <span>
                             暂态事件严重度:
-                            <span class="num">65%</span>
+                            <span class="num">{{ transientNum }}%</span>
                         </span>
-                        <el-select v-model="value" style="width: 120px" size="small">
+                        <el-select v-model="value" style="width: 120px" size="small" @change="transientChange">
-                            <el-option
+                            <el-option v-for="item in options1" :key="item.id" :label="item.name" :value="item.id" />
-                                v-for="item in options1"
-                                :key="item.value"
-                                :label="item.label"
-                                :value="item.value"
-                            />
                         </el-select>
                     </div>
                     <MyEChart :style="EchHeight" :options="WTCharts" />
@@ -148,7 +164,7 @@ import Evaluate from './details/evaluate.vue'
 import steadyState from './details/steadyState.vue'
 import temporaryState from './details/temporaryState.vue'
 import technique from './details/technique.vue'
-import DatePicker from '@/components/form/datePicker/index.vue'
+import { getAssessOverview, getEvaluationOverview, getEventLevelEvaluation } from '@/api/device-boot/panorama'
 const dictData = useDictData()
 const show = ref(false)
 const height = mainHeight(30)
@@ -156,10 +172,14 @@ const boxHeight: any = mainHeight(270, 3)
 const EchHeight: any = mainHeight(370, 3)
 const evaluateRef = ref()
 const steadyStateRef = ref()
-const datePickerRef = ref()
+const formRow: any = ref({})
 const temporaryStateRef = ref()
 const techniqueRef = ref()
 const options = ref([
+    {
+        label: '全指标',
+        value: '0'
+    },
     {
         label: '电压偏差',
         value: '1'
@@ -181,50 +201,14 @@ const options = ref([
         value: '5'
     }
 ])
-const options1 = ref([
+const harmonicType = ref('0')
-    {
+const transientNum = ref(0)
-        label: '暂降',
+const options1: any = dictData.getBasicData('Event_Statis').filter(item => {
-        value: '1'
+    if (item.code == 'Voltage_Dip' || item.code == 'Voltage_Rise' || item.code == 'Short_Interruptions') {
-    },
+        return item
-    {
-        label: '暂升',
-        value: '2'
-    },
-    {
-        label: '中断',
-        value: '3'
     }
-])
+})
-const evaluate = ref([
+const assessList: any = ref([])
-    {
-        name: '承德',
-        value: 5
-    },
-    {
-        name: '廊坊',
-        value: 5
-    },
-    {
-        name: '张家口',
-        value: 5
-    },
-    {
-        name: '秦皇岛',
-        value: 5
-    },
-    {
-        name: '唐山',
-        value: 5
-    },
-    {
-        name: '超高压',
-        value: 5
-    },
-    {
-        name: '风光储',
-        value: 5
-    }
-])
 const JDlist = ref([
     {
         name: '技术监督计划',
@@ -243,72 +227,150 @@ const JDlist = ref([
         value: 5
     }
 ])
-const WTCharts = ref({
+const harmonicCharts = ref()
-    xAxis: {
+const harmonicLineRatio: any = ref(0)
-        name: '%',
+const WTCharts = ref({})
-        type: 'value',
-        max: 100
-    },
-    legend: {
-        show: false
-    },
-    yAxis: {
-        type: 'category',
-        data: ['承德', '廊坊', '唐山', '承德', '廊坊', '唐山']
-    },
-    grid: {
-        top: '10px',
-        left: '30px',
-        right: '30px',
-        bottom: '0px'
-    },
 
-    options: {
+const value = ref(options1[0].id)
-        dataZoom: null,
-        series: [
-            {
-                name: '占比',
-                type: 'bar',
-                data: [3, 4, 5, 3, 4, 5],
-                label: {
-                    show: true,
-                    position: 'right',
-                    fontSize: 12,
-                    formatter: function (params: any) {
-                        return `${params.value}%`
-                    }
-                }
-            }
-        ]
-    }
-})
-
-const value = ref('')
 const open = (e: number) => {
     if (e == 0) {
-        evaluateRef.value.open()
+        evaluateRef.value.open(formRow.value)
     } else if (e == 1) {
-        steadyStateRef.value.open()
+        steadyStateRef.value.open(formRow.value)
     } else if (e == 2) {
-        temporaryStateRef.value.open()
+        temporaryStateRef.value.open(formRow.value)
     } else if (e == 3) {
-        techniqueRef.value.open()
+        techniqueRef.value.open(formRow.value)
     }
 }
 const info = (row: any) => {
     let form = {
+        ...row,
         id: row.orgNo,
         deptIndex: row.orgNo,
         orgId: row.orgNo,
         ids: [],
         statisticalType: dictData.getBasicData('Statistical_Type', ['Report_Type'])[0],
         isUpToGrid: row.isUpToGrid,
-        startTime: datePickerRef.value.timeValue[0],
+        monitorFlag: row.isUpToGrid
-        searchBeginTime: datePickerRef.value.timeValue[0],
-        endTime: datePickerRef.value.timeValue[1],
-        searchEndTime: datePickerRef.value.timeValue[1],
-        type: datePickerRef.value.interval
     }
+    formRow.value = form
+    // 综合评估
+    getAssessOverview(form).then(res => {
+        assessList.value = res.data
+    })
+    // 稳态电能质量水平评价概览数据
+    harmonicChange()
+    // 暂态统计详情
+    transientChange()
+}
+const harmonicChange = () => {
+    getEvaluationOverview({ ...formRow.value, harmonicType: harmonicType.value }).then(res => {
+        harmonicLineRatio.value = res.data.lineRatio
+
+        harmonicCharts.value = {
+            tooltip: {
+                formatter: function (params: any) {
+                    return params[0].name + ':' + (params[0].value == 3.14159 ? '暂无数据' : params[0].value) + '%<br/>'
+                }
+            },
+            xAxis: {
+                name: '%',
+                type: 'value',
+                max: 100
+            },
+            legend: {
+                show: false
+            },
+            yAxis: {
+                type: 'category',
+                data: res.data.childrenList.map((item: any) => item.deptName)
+            },
+            grid: {
+                top: '10px',
+                left: '30px',
+                right: '30px',
+                bottom: '0px'
+            },
+
+            options: {
+                dataZoom: null,
+                series: [
+                    {
+                        name: '占比',
+                        type: 'bar',
+                        data: res.data.childrenList.map((item: any) => item.ratio),
+                        label: {
+                            show: true,
+                            position: 'right',
+                            fontSize: 12,
+                            formatter: function (params: any) {
+                                return `${params.value == 3.14159 ? '' : params.value}`
+                            }
+                        }
+                    }
+                ]
+            }
+        }
+    })
+}
+const transientChange = () => {
+    getEventLevelEvaluation({ ...formRow.value, ids: [value.value] }).then(res => {
+        let data = []
+        transientNum.value = 0
+        if (formRow.value.isUpToGrid == 0) {
+            data = res.data.info
+            transientNum.value = res.data.data
+        } else {
+            transientNum.value = res.data.gwData
+            data = res.data.gwInfo
+        }
+
+        WTCharts.value = {
+            tooltip: {
+                formatter: function (params: any) {
+                    return params[0].name + ':' + (params[0].value == 3.14159 ? '暂无数据' : params[0].value) + '%<br/>'
+                }
+            },
+            xAxis: {
+                name: '%',
+                type: 'value',
+                max: 100
+            },
+            legend: {
+                show: false
+            },
+            yAxis: {
+                type: 'category',
+                data: data.map((item: any) => item.orgName)
+            },
+            grid: {
+                top: '10px',
+                left: '30px',
+                right: '30px',
+                bottom: '0px'
+            },
+
+            options: {
+                dataZoom: null,
+                series: [
+                    {
+                        name: '占比',
+                        type: 'bar',
+                        data: data.map((item: any) => item.count),
+                        label: {
+                            show: true,
+                            position: 'right',
+                            fontSize: 12,
+                            formatter: function (params: any) {
+                                return `${params.value}`
+                            }
+                        }
+                    }
+                ]
+            }
+        }
+    })
 }
 defineExpose({ info })
 </script>
@@ -316,8 +378,8 @@ defineExpose({ info })
 <style lang="scss" scoped>
 .boxLeft {
     background-color: #fff;
-    width: 400px;
+    width: 100%;
-    padding: 10px;
+    padding: 10px 0px 10px 10px;
     font-size: 13px;
     overflow: hidden;
 }
@@ -326,9 +388,9 @@ defineExpose({ info })
     // height: ;
     display: flex;
     justify-content: space-between;
-    font-weight: 550;
+    font-size: 16px;
     height: 22px;
-    line-height: 22px;
+    line-height: 23px;
     padding-left: 5px;
     width: 100%;
     background-image: linear-gradient(to right, #a4e5da, #fff);
@@ -348,6 +410,8 @@ defineExpose({ info })
     display: flex;
     justify-content: space-around;
     text-align: center;
+    overflow-x: auto;
+    overflow-y: hidden;
 }
 .boxR {
     border: 1px solid #ccc;
@@ -384,14 +448,17 @@ defineExpose({ info })
     cursor: pointer;
 }
 .show {
-    transition: all 0.3s ease;
     width: 0px;
-    padding: 0;
+    transition: all 0.3s ease;
-    overflow: hidden;
+    .boxLeft {
+        padding: 0;
+    }
 }
 .noshow {
-    width: 400px;
+    width: 25%;
-    padding: 10px;
     transition: all 0.3s ease;
+    .boxLeft {
+        padding: 10px 0px 10px 10px;
+    }
 }
 </style>

src/views/pqs/qualityInspeection/panorama/index.vue

@@ -1,6 +1,7 @@
 <template>
     <div class="default-main" :style="height">
         <div class="box">
+            <DatePicker ref="datePickerRef" style="display: none" />
             <el-form :inline="true" :model="form" class="demo-form-inline">
                 <el-form-item>
                     <el-input v-model="form.name" placeholder="请输入设备名称" :suffix-icon="Search">
@@ -49,11 +50,12 @@ import { mainHeight } from '@/utils/layout'
 import { Search, Refresh } from '@element-plus/icons-vue'
 import mapL from './components/mapL.vue'
 import mapR from './components/mapR.vue'
+import DatePicker from '@/components/form/datePicker/index.vue'
 const dictData = useDictData()
 defineOptions({
     name: '/panorama'
 })
-
+const datePickerRef = ref()
 const areaRef = ref()
 const mapLRef = ref()
 const mapRRef = ref()
@@ -67,7 +69,7 @@ const options: any = ref([
         id: 1
     }
 ])
-const form = ref({
+const form: any = ref({
     name: '',
     orgNo: dictData.state.area[0].id,
     isUpToGrid: 0
@@ -88,6 +90,16 @@ const reset = () => {
     info()
 }
 const info = () => {
+    // form.value.startTime = datePickerRef.value.timeValue[0]
+    // form.value.searchBeginTime = datePickerRef.value.timeValue[0]
+    // form.value.endTime = datePickerRef.value.timeValue[1]
+    // form.value.searchEndTime = datePickerRef.value.timeValue[1]
+    form.value.startTime = `2023-01-01`
+    form.value.searchBeginTime = `2023-01-01`
+    form.value.endTime = `2024-07-30`
+    form.value.searchEndTime = `2024-07-30`
+    form.value.type = datePickerRef.value.interval
+
     mapLRef.value.info(form.value)
     mapRRef.value.info(form.value)
 }