风机列表：添加已锁定状态

设备清单：修改设备时禁止修改物模型
单风机：重构图表初始化，添加风频图、添加趋势图、添加已锁定状态与解锁按钮

ui/dasadmin/src/views/backend/WindBlower/index.vue

@@ -102,13 +102,15 @@
                     <div class="matrix panelBg">
                         <div class="Fan-control">
                             <div class="control-type">
+                                <el-tag v-if="realTimeData.locked === 1" class="control-tag control-tag-left" type="primary">已锁定</el-tag>
                                 <el-tag class="control-tag" type="primary">{{ realTimeDataState }}</el-tag>
                             </div>
                             <div class="btnLeft">
-                                <el-button class="control-btn" type="primary">启动</el-button>
+                                <el-button v-if="realTimeData.iturbineoperationmode !== 16" class="control-btn" type="primary">启动</el-button>
-                                <el-button class="control-btn" type="primary">停机</el-button>
+                                <el-button v-else class="control-btn" type="primary">停机</el-button>
                                 <el-button class="control-btn" type="primary">复位</el-button>
-                                <el-button class="control-btn" type="primary">锁定</el-button>
+                                <el-button v-if="realTimeData.locked !== 1" class="control-btn" type="primary">锁定</el-button>
+                                <el-button v-else class="control-btn" type="primary">解锁</el-button>
                             </div>
                             <el-tooltip content="变桨/轮毂系统">
                                 <div @click="openSubSystem(1)" class="dot index-1"></div>
@@ -204,7 +206,7 @@
                                     </div>
                                     <div class="summarize-panel-base">
                                         <div>
-                                            <span class="content-number">{{ realTimeDataForSingle?.monthGeneration ?? '-' }}</span>
+                                            <span class="content-number">{{ realTimeDataForSingle.windfarmmonthprodenergy }}</span>
                                         </div>
                                         <div><span>万kWh</span></div>
                                         <div><span>月发电量</span></div>
@@ -218,7 +220,7 @@
                                     </div>
                                     <div class="summarize-panel-base">
                                         <div>
-                                            <span class="content-number">{{ realTimeDataForSingle?.yearGeneration ?? '-' }}</span>
+                                            <span class="content-number">{{ realTimeDataForSingle.windfarmyearprodenergy }}</span>
                                         </div>
                                         <div><span>万kWh</span></div>
                                         <div><span>年发电量</span></div>
@@ -314,6 +316,7 @@ import Overview from './overview.vue'
 import { TableInstance } from 'element-plus'
 import { dayjs } from 'element-plus'
 import { getRealTimeState, getCutDecimalsValue } from '/@/views/backend/equipment/airBlower/utils'
+import { get } from 'sortablejs'
 const route = useRoute()
 
 const d = new Date()
@@ -323,17 +326,17 @@ let myTable = ref<TableInstance>()
 const radioactiveName = ref('1')
 
 const overviewData = reactive({
-    iul1_690v: '',
+    iul1_690v: '-',
-    iul2_690v: '',
+    iul2_690v: '-',
-    iul3_690v: '',
+    iul3_690v: '-',
-    igenpower: '',
+    igenpower: '-',
-    ireactivepower: '',
+    ireactivepower: '-',
-    icosphi: '',
+    icosphi: '-',
-    itemprotorbeara_1sec: '',
+    itemprotorbeara_1sec: '-',
-    itemprotorbearb_1sec: '',
+    itemprotorbearb_1sec: '-',
-    icabletwisttotal: '',
+    icabletwisttotal: '-',
-    itempgenbearde_1sec: '',
+    itempgenbearde_1sec: '-',
-    itempgenbearnde_1sec: '',
+    itempgenbearnde_1sec: '-',
 })
 const handleClick = () => {
     // debugger
@@ -341,13 +344,15 @@ const handleClick = () => {
 }
 
 const realTimeDataForSingle = ref<any>({
-    ikwhthisday: '',
+    ikwhthisday: '-',
-    ikwhoverall: '',
+    ikwhoverall: '-',
-    igenpower: '',
+    igenpower: '-',
-    igenspeed: '',
+    igenspeed: '-',
     ipitchangle: '',
-    iwindspeed: '',
+    iwindspeed: '-',
-    iwinddirection: '',
+    iwinddirection: '-',
+    windfarmmonthprodenergy: '-',
+    windfarmyearprodenergy: '-',
 })
 
 const state: {
@@ -531,23 +536,26 @@ const initpowerChart = () => {
     state.charts.powerChart = powerChart
 }
 
-const TrendDataForDay = [
+const TrendDataForDay: {
-    {
+    currentPeriod: {
-        currentPeriod: 86.3,
+        time: string[]
-        samePeriod: 63.5,
+        value: number[]
-        generationTime: '2024-10-01',
+    }
+    samePeriod: {
+        time: string[]
+        value: number[]
+    }
+} = {
+    currentPeriod: {
+        time: [],
+        value: [],
     },
-    {
+    samePeriod: {
-        currentPeriod: 86.3,
+        time: [],
-        samePeriod: 53.5,
+        value: [],
-        generationTime: '2024-10-02',
     },
-    {
+}
-        currentPeriod: 86.3,
+
-        samePeriod: 43.5,
-        generationTime: '2024-10-03',
-    },
-]
 const TrendDataForMonth = [
     {
         currentPeriod: 26.3,
@@ -567,11 +575,18 @@ const TrendDataForMonth = [
 ]
 const trendChartRef = ref<VNodeRef>()
 
-const inittrendChart = (type: 'day' | 'month') => {
+const trendChartType = ref<'day' | 'month'>('day')
-    const currentPeriod: any =
+const tabhandleClick = () => {
-        type === 'day' ? TrendDataForDay.map((item) => item.currentPeriod) : TrendDataForMonth.map((item) => item.currentPeriod)
+    state.charts.trendChart.clear()
-    const samePeriod: any = type === 'day' ? TrendDataForDay.map((item) => item.samePeriod) : TrendDataForMonth.map((item) => item.samePeriod)
+    nextTick(() => {
-    const xAxisdata: any = type === 'day' ? TrendDataForDay.map((item) => item.generationTime) : TrendDataForMonth.map((item) => item.generationTime)
+        initTrendChart(trendChartType.value)
+    })
+}
+
+const initTrendChart = (type: 'day' | 'month') => {
+    const currentPeriod: number[] = type === 'day' ? TrendDataForDay.currentPeriod.value : TrendDataForMonth.map((item) => item.currentPeriod)
+    const samePeriod: number[] = type === 'day' ? TrendDataForDay.samePeriod.value : TrendDataForMonth.map((item) => item.samePeriod)
+    const xAxisdata: string[] = type === 'day' ? TrendDataForDay.currentPeriod.time : TrendDataForMonth.map((item) => item.generationTime)
     const trendChart = state.charts?.trendChart ?? echarts.init(trendChartRef.value as unknown as HTMLElement)
 
     const option = {
@@ -783,62 +798,35 @@ const initTemperatureChart = () => {
     state.charts.temperatureChart3 = temperatureChart3
 }
 
-var frequencydata = [
+var frequencyData: {
-    {
+    name: string[]
-        name: '1',
+    value: number[]
-        value: 10,
+} = {
-    },
+    name: [
-    {
+        '0~22.5',
-        name: '2',
+        '22.5~45',
-        value: 2,
+        '45~67.5',
-    },
+        '67.5~90',
-    {
+        '90~112.5',
-        name: '3',
+        '112.5~135',
-        value: 33,
+        '135~157.5',
-    },
+        '157.5~180',
-    {
+        '180~202.5',
-        name: '4',
+        '202.5~225',
-        value: 41,
+        '225~247.5',
-    },
+        '247.5~270',
-    {
+        '270~292.5',
-        name: '5',
+        '292.5~315',
-        value: 50,
+        '315~337.5',
-    },
+        '337.5~360',
-    {
+    ],
-        name: '6',
+    value: [],
-        value: 16,
+}
-    },
-    {
-        name: '7',
-        value: 27,
-    },
-    {
-        name: '8',
-        value: 18,
-    },
-    {
-        name: '9',
-        value: 39,
-    },
-    {
-        name: '10',
-        value: 10,
-    },
-    {
-        name: '11',
-        value: 15,
-    },
-    {
-        name: '12',
-        value: 12,
-    },
-]
 
 const frequencyChartRef = ref()
 const initFrequencyChart = () => {
     const frequencyChart = state.charts.frequencyChart ?? echarts.init(frequencyChartRef.value as unknown as HTMLElement)
-    const yAxisdata: any = frequencydata.map((item) => item.name)
+    // const seriesdata: any = frequencyData.map((item) => item.value)
-    const seriesdata: any = frequencydata.map((item) => item.value)
 
     const option = {
         title: [
@@ -873,9 +861,12 @@ const initFrequencyChart = () => {
                     color: '#dadada',
                 },
             },
-            //max: 4
+            max: 100,
         },
         angleAxis: {
+            min: 0,
+            interval: 22.5,
+            startAngle: 90,
             type: 'category',
             axisLine: {
                 show: true,
@@ -887,6 +878,11 @@ const initFrequencyChart = () => {
                 show: true,
                 color: 'rgba(0,0,0,0.45)',
                 fontSize: 10,
+                boundaryGap: false,
+                formatter: function (value: string) {
+                    const reg = /.*(?=\~)/
+                    return value.match(reg)![0]
+                },
             },
             axisTick: {
                 show: false,
@@ -894,22 +890,22 @@ const initFrequencyChart = () => {
                     color: '#dadada',
                 },
             },
-            data: yAxisdata,
+            data: frequencyData.name,
             //startAngle: 75
         },
         tooltip: {},
         series: {
             type: 'bar',
-            data: seriesdata,
+            data: frequencyData.value,
             coordinateSystem: 'polar',
             itemStyle: {
                 color: '#0277B3',
             },
-            /*label: {
+            // label: {
-                    show: true,
+            //     show: true,
-                    position: 'middle',
+            //     position: 'middle',
-                    formatter: '{b}: {c}'
+            //     formatter: '{b}: {c}',
-                }*/
+            // },
         },
         animation: false,
     }
@@ -991,6 +987,7 @@ const createScroll = () => {
 
 const realTimeData = ref<any>({
     iturbineoperationmode: 1111,
+    locked: 0,
 })
 
 const realTimeDataState = computed(() => {
@@ -1139,7 +1136,6 @@ const createRealTimeData = async () => {
         console.log(err)
     }
 }
-createRealTimeData()
 
 const subSystemName = ref('')
 
@@ -1193,16 +1189,6 @@ const openSubSystem = (type: number) => {
     visible.value = true
 }
 
-const trendChartType = ref<'day' | 'month'>('day')
-const tabhandleClick = () => {
-    state.charts.trendChart.clear()
-    nextTick(() => {
-        console.log(trendChartType.value)
-
-        inittrendChart(trendChartType.value)
-    })
-}
-
 const overviewSlotData = reactive<{ visible: boolean; type: '138' | '140'; type138: any[]; type140: any[] }>({
     visible: false,
     type: '138',
@@ -1210,31 +1196,49 @@ const overviewSlotData = reactive<{ visible: boolean; type: '138' | '140'; type1
     type140: [],
 })
 
-let autoUpdateTimer: any = null
+let autoUpdateForSecondTimer: any = null
+let autoUpdateTimerForMinuteTimer: any = null
+let autoUpdateTimerForHourTimer: any = null
 const autoUpdate = () => {
-    if (!autoUpdateTimer) {
+    createRealTimeData()
-        autoUpdateTimer = setInterval(() => {
+    initTemperatureChart()
+    if (!autoUpdateForSecondTimer) {
+        autoUpdateForSecondTimer = setInterval(() => {
             createRealTimeData()
             initTemperatureChart()
         }, 2000)
     }
+    if (!autoUpdateTimerForMinuteTimer) {
+        autoUpdateTimerForMinuteTimer = setInterval(() => {
+            getAllChartData(['power', 'frequency'])
+        }, 60000)
+    }
+    if (!autoUpdateTimerForHourTimer) {
+        autoUpdateTimerForHourTimer = setInterval(() => {
+            getAllChartData(['trend'])
+        }, 60000 * 30)
+    }
 }
 
-const getChartData = () => {
+const getChartData = <T extends string = any>(params: {
+    startTime: number
+    endTime: number
+    attr: T[]
+    interval: string
+}): Promise<{ times: { [K in T]: string[] }; val: { [K in T]: number[] } }> => {
     return new Promise((resolve) => {
         const data = {
-            startTime: new Date(new Date().toLocaleDateString()).getTime(),
+            startTime: params.startTime,
-            endTime: Date.now(),
+            endTime: params.endTime,
             devices: [
                 {
                     deviceId: route.query.irn as string,
-                    attributes: ['iGenPower', 'iTheoreticalPower', 'iWindSpeed'],
+                    attributes: params.attr,
                 },
             ],
-            interval: '5m',
+            interval: params.interval,
         }
         getRealValueRangeReq(data).then((res) => {
-            console.log(res)
             if (res.success) {
                 const data = res.data[route.query.irn as string]
                 const rangeKeys = Object.keys(data)
@@ -1243,44 +1247,132 @@ const getChartData = () => {
                 rangeKeys.forEach((key) => {
                     times[key] = []
                     val[key] = []
-                    data[key].times.forEach((item: number, index: number) => {
+                    data[key].times.forEach((item: number) => {
                         times[key].push(dayjs(item).format('HH:mm'))
                     })
                     data[key].values.forEach((item: number) => {
                         val[key].push(item)
                     })
                 })
-                powerChartData.time = times
+                resolve({ times, val })
-                powerChartData.values = val
-                resolve(true)
             }
         })
     })
 }
 
-onMounted(() => {
+const getThisDayChartData = () => {
-    inittrendChart(trendChartType.value)
+    return new Promise((resolve) => {
-    getChartData().then(() => {
+        getChartData<'iGenPower' | 'iTheoreticalPower' | 'iWindSpeed'>({
-        initpowerChart()
+            startTime: new Date(new Date().toLocaleDateString()).getTime(),
-        initTemperatureChart()
+            endTime: Date.now(),
+            attr: ['iGenPower', 'iTheoreticalPower', 'iWindSpeed'],
+            interval: '5m',
+        }).then(({ times, val }) => {
+            powerChartData.time = { iGenPower: times.iGenPower, iTheoreticalPower: times.iTheoreticalPower, iWindSpeed: times.iWindSpeed }
+            powerChartData.values = { iGenPower: val.iGenPower, iTheoreticalPower: val.iTheoreticalPower, iWindSpeed: val.iWindSpeed }
+            resolve(true)
+        })
     })
+}
+
+const getLastYearTodayTimestamp = () => {
+    const now = new Date()
+    const lastYear = now.getFullYear() - 1
+    const lastYearToday = new Date(lastYear, now.getMonth(), now.getDate())
+    return lastYearToday.getTime()
+}
+
+const getLastYearChartData = () => {
+    return new Promise((resolve) => {
+        const start = getLastYearTodayTimestamp()
+        const end = new Date()
+        end.setFullYear(end.getFullYear() - 1)
+
+        getChartData<'iKWhThisDay'>({
+            startTime: start,
+            endTime: end.getTime(),
+            attr: ['iKWhThisDay'],
+            interval: '1h',
+        }).then(({ times, val }) => {
+            TrendDataForDay.samePeriod.time = times.iKWhThisDay
+            TrendDataForDay.samePeriod.value = val.iKWhThisDay
+            resolve(true)
+        })
+    })
+}
+
+const getThisDayChartForHourData = () => {
+    return new Promise((resolve) => {
+        getChartData<'iKWhThisDay'>({
+            startTime: new Date(new Date().toLocaleDateString()).getTime(),
+            endTime: Date.now(),
+            attr: ['iKWhThisDay'],
+            interval: '1h',
+        }).then(({ times, val }) => {
+            TrendDataForDay.currentPeriod.time = times.iKWhThisDay
+            TrendDataForDay.currentPeriod.value = val.iKWhThisDay
+            resolve(true)
+        })
+    })
+}
+
+const getThisDayChartDataForMinute = () => {
+    return new Promise((resolve) => {
+        getChartData<'iWindDirection'>({
+            startTime: new Date(new Date().toLocaleDateString()).getTime(),
+            endTime: Date.now(),
+            attr: ['iWindDirection'],
+            interval: '1m',
+        }).then(({ val }) => {
+            const len = val.iWindDirection.length
+            const result: number[] = new Array(16).fill(0)
+            val.iWindDirection.forEach((item: number) => {
+                item = item < 0 ? 360 + item : item > 360 ? 360 : item
+                const divisor = Math.ceil(item / 22.5) - 1
+                result[divisor] += 1
+            })
+            const percent = result.map((item) => Math.floor((item / len) * 100000) / 1000)
+            frequencyData.value = percent
+            resolve(true)
+        })
+    })
+}
+
+const getAllChartData = (type: ('power' | 'trend' | 'frequency')[] = ['power', 'trend', 'frequency']) => {
+    if (type.includes('power')) {
+        getThisDayChartData().then(() => {
+            initpowerChart()
+            initTemperatureChart()
+        })
+    }
+    if (type.includes('trend')) {
+        const trendDataForLastYear = getLastYearChartData()
+        const trendDataForThisDay = getThisDayChartForHourData()
+        Promise.all([trendDataForLastYear, trendDataForThisDay]).then(() => {
+            initTrendChart(trendChartType.value)
+        })
+    }
+    if (type.includes('frequency')) {
+        getThisDayChartDataForMinute().then((res) => {
+            initFrequencyChart()
+        })
+    }
+}
+
+onMounted(() => {
+    getAllChartData()
     createScroll()
-    initFrequencyChart()
     useEventListener(window, 'resize', echartsResize)
     autoUpdate()
 })
-// onBeforeMount(() => {
-//     const chartKeys = Object.keys(state.charts) as Array<keyof typeof state.charts>
-//     chartKeys.forEach((key) => {
-//         state.charts[key].dispose()
-//     })
-// })
 
 onUnmounted(() => {
-    autoUpdateTimer && clearInterval(autoUpdateTimer)
+    autoUpdateForSecondTimer && clearInterval(autoUpdateForSecondTimer)
+    autoUpdateTimerForHourTimer && clearInterval(autoUpdateTimerForHourTimer)
+    autoUpdateTimerForMinuteTimer && clearInterval(autoUpdateTimerForMinuteTimer)
     const chartKeys = Object.keys(state.charts) as Array<keyof typeof state.charts>
     chartKeys.forEach((key) => {
-        state.charts[key].dispose()
+        state.charts[key] && state.charts[key].dispose()
     })
 })
 </script>
@@ -1399,7 +1491,6 @@ onUnmounted(() => {
                 .control-type {
                     width: 100%;
                     display: flex;
-                    justify-content: right;
                     .control-tag {
                         background: #0064aa;
                         border-radius: 0 8px 0 0;
@@ -1408,6 +1499,11 @@ onUnmounted(() => {
                         color: #ffffff;
                         font-size: 20px;
                         border: none;
+                        margin-left: auto;
+                    }
+                    .control-tag-left {
+                        margin-left: 0;
+                        border-radius: 8px 0 0 0;
                     }
                 }
                 .btnLeft {

ui/dasadmin/src/views/backend/equipment/airBlower/index.vue

@@ -68,6 +68,9 @@
                         <el-table-column v-else :label="item.label" :align="item.align" :width="item.width">
                             <template v-if="item.custom === 'default'" #default="scope">
                                 <div v-if="item.prop === 'iturbineoperationmode'">
+                                    <el-tag v-if="scope.row.locked === 1" color="rgba(254,55,49,0.20)" style="color: #fe3731"
+                                        >已锁定</el-tag
+                                    >
                                     <el-tag v-if="scope.row.iturbineoperationmode === 20" color="rgba(0,100,170,0.20)" style="color: #0064aa"
                                         >并网</el-tag
                                     >

ui/dasadmin/src/views/backend/equipment/equipmentManagement/index.vue

@@ -92,7 +92,7 @@
                         </el-col>
                         <el-col :span="12">
                             <el-form-item label="物模型:">
-                                <el-select v-model="editDeviceData.iotModelId" placeholder="请选择物模型" style="width: 200px">
+                                <el-select :disabled="editDeviceData.iotModelId" v-model="editDeviceData.iotModelId" placeholder="请选择物模型" style="width: 200px">
                                     <el-option v-for="item in equipModeData" :key="item.id" :label="item.iotModelName" :value="item.id" />
                                 </el-select>
                             </el-form-item>