feat: 全局支持corpCode参数传递

从URL获取corpCode并在全局共享，菜单导航及所有API请求均自动拼接该参数，同时修复能耗统计接口数据解析逻辑并调整菜单激活样式。

feat: 全局支持corpCode参数传递
从URL获取corpCode并在全局共享，菜单导航及所有API请求均自动拼接该参数，同时修复能耗统计接口数据解析逻辑并调整菜单激活样式。
杨鸣坤
1 parent ea214724
Showing 7 changed files with 108 additions and 29 deletions
src/App.vue
src/components/EnergyReportDialog.vue
src/components/OeeDialog.vue
src/components/SafetyDialog.vue
src/components/UtilizationDialog.vue
src/views/Energy.vue
src/views/SmartLight.vue
--- a/src/App.vue
View file @a4ea86e
+++ b/src/App.vue
View file @a4ea86e
@@ -11,13 +11,12 @@
           background-color="#304156"
           text-color="#bfcbd9"
           active-text-color="#409eff"
-          :router="true"
         >
-          <el-menu-item index="/smart-light">
+          <el-menu-item index="/smart-light" @click="navigateTo('/smart-light')">
             <el-icon><Monitor /></el-icon>
             <span>智能灯</span>
           </el-menu-item>
-          <el-menu-item index="/energy">
+          <el-menu-item index="/energy" @click="navigateTo('/energy')">
             <el-icon><Lightning /></el-icon>
             <span>能耗</span>
           </el-menu-item>
@@ -31,11 +30,31 @@
 </template>
 <script setup>
-import { computed } from 'vue'
-import { useRoute } from 'vue-router'
+import { computed, ref, provide } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
 const route = useRoute()
+const router = useRouter()
 const currentRoute = computed(() => route.path)
+
+// 从URL获取corpCode，全局共享
+function getCorpCode() {
+  return new URLSearchParams(window.location.search).get('corpCode') || ''
+}
+const corpCode = ref(getCorpCode())
+provide('corpCode', corpCode)
+
+// 给URL拼接corpCode
+function withCorpCode(path) {
+  if (!corpCode.value) return path
+  const sep = path.includes('?') ? '&' : '?'
+  return `${path}${sep}corpCode=${encodeURIComponent(corpCode.value)}`
+}
+
+// 菜单导航：保留corpCode参数
+function navigateTo(path) {
+  router.push(withCorpCode(path))
+}
 </script>
 <style scoped>
@@ -60,6 +79,13 @@ const currentRoute = computed(() => route.path)
   border-right: none !important;
   padding-top: 8px;
 }
+.sidebar-menu :deep(.el-menu-item) {
+  transition: background-color 0.2s;
+}
+.sidebar-menu :deep(.el-menu-item.is-active) {
+  background-color: #263445 !important;
+  color: #fff !important;
+}
 .main-content {
   background-color: #f0f2f5;
   padding: 0;
--- a/src/components/EnergyReportDialog.vue
View file @a4ea86e
+++ b/src/components/EnergyReportDialog.vue
View file @a4ea86e
@@ -97,7 +97,7 @@
 </template>
 <script setup>
-import { ref, reactive, computed, watch, nextTick, onBeforeUnmount } from 'vue'
+import { ref, reactive, computed, watch, nextTick, onBeforeUnmount, inject } from 'vue'
 const props = defineProps({ visible: Boolean, device: Object })
 const emit = defineEmits(['update:visible'])
@@ -108,6 +108,14 @@ const selectedDate = ref(new Date().toISOString().slice(0, 10))
 const unitSelect = ref('single')
 const dtuSn = computed(() => props.device?._raw?.dtuSn || props.device?.name || '')
+// 从全局获取corpCode
+const corpCode = inject('corpCode')
+function withCorpCode(url) {
+  if (!corpCode.value) return url
+  const sep = url.includes('?') ? '&' : '?'
+  return `${url}${sep}corpCode=${encodeURIComponent(corpCode.value)}`
+}
+
 // API 数据
 const apiData = reactive({
   oeeData: { list: [], statusStats: [], totalDurationSeconds: 0, totalDurationFormatted: '' },
@@ -417,7 +425,7 @@ async function fetchData() {
   if (!dtuSn.value || !selectedDate.value) return
   loading.value = true
   try {
-    const res = await fetch(`/api/energy/detail?dtuSn=${dtuSn.value}&date=${selectedDate.value}`)
+    const res = await fetch(withCorpCode(`/api/energy/detail?dtuSn=${dtuSn.value}&date=${selectedDate.value}`))
     const data = await res.json()
     if (data.code === 200) {
       Object.assign(apiData.oeeData, data.oeeData || { list: [], statusStats: [], totalDurationSeconds: 0, totalDurationFormatted: '' })
--- a/src/components/OeeDialog.vue
View file @a4ea86e
+++ b/src/components/OeeDialog.vue
View file @a4ea86e
@@ -110,7 +110,7 @@
 </template>
 <script setup>
-import { ref, reactive, computed, watch, onMounted, nextTick } from 'vue'
+import { ref, reactive, computed, watch, onMounted, nextTick, inject } from 'vue'
 const props = defineProps({
   visible: Boolean,
@@ -122,6 +122,14 @@ const queryType = ref('day')
 const queryDate = ref(new Date())
 const durationFilter = ref(null)
+// 从全局获取corpCode
+const corpCode = inject('corpCode')
+function withCorpCode(url) {
+  if (!corpCode.value) return url
+  const sep = url.includes('?') ? '&' : '?'
+  return `${url}${sep}corpCode=${encodeURIComponent(corpCode.value)}`
+}
+
 // 状态映射
 const stateColorMap = { 0: '#909399', 1: '#c0392b', 2: '#e67e22', 3: '#67c23a', 4: '#2463aa' }
 const stateNameMap = { '0': '灭灯', '1': '红灯', '2': '黄灯', '3': '绿灯', '4': '蓝灯' }
@@ -666,7 +674,7 @@ async function fetchLampData() {
   const date = formatDate(queryDate.value)
   if (!dtuSn) return
   try {
-    const res = await fetch(`/api/device/lampData?dtuSn=${dtuSn}&date=${date}`)
+    const res = await fetch(withCorpCode(`/api/device/lampData?dtuSn=${dtuSn}&date=${date}`))
     const data = await res.json()
     // list 中只有一个元素，取其 lampData
     const entry = (data.list && data.list[0]) || {}
--- a/src/components/SafetyDialog.vue
View file @a4ea86e
+++ b/src/components/SafetyDialog.vue
View file @a4ea86e
@@ -78,7 +78,7 @@
 </template>
 <script setup>
-import { ref, reactive, computed, watch, nextTick, onBeforeUnmount } from 'vue'
+import { ref, reactive, computed, watch, nextTick, onBeforeUnmount, inject } from 'vue'
 import { Download, Close } from '@element-plus/icons-vue'
 const props = defineProps({ visible: Boolean, device: Object })
@@ -93,6 +93,14 @@ const selectedDate = ref(today)
 const dayRange = ref([weekAgo, today])
 const dateRange = ref(null)
+// 从全局获取corpCode
+const corpCode = inject('corpCode')
+function withCorpCode(url) {
+  if (!corpCode.value) return url
+  const sep = url.includes('?') ? '&' : '?'
+  return `${url}${sep}corpCode=${encodeURIComponent(corpCode.value)}`
+}
+
 // 禁用未来日期
 function disabledDateFuture(time) {
   return time.getTime() > Date.now()
@@ -349,7 +357,7 @@ async function fetchData() {
     let url = `/api/energy/runtimeDetail?dtuSn=${dtuSn.value}&startDate=${sd}&type=${type}`
     if (ed) url += '&endDate=' + ed
-    const res = await fetch(url)
+    const res = await fetch(withCorpCode(url))
     const data = await res.json()
     if (data.code === 200) {
       Object.assign(apiData.summary, data.summary || {})
--- a/src/components/UtilizationDialog.vue
View file @a4ea86e
+++ b/src/components/UtilizationDialog.vue
View file @a4ea86e
@@ -126,7 +126,7 @@
 </template>
 <script setup>
-import { ref, reactive, computed, watch, onMounted, nextTick, getCurrentInstance } from 'vue'
+import { ref, reactive, computed, watch, onMounted, nextTick, getCurrentInstance, inject } from 'vue'
 const props = defineProps({
   visible: Boolean,
@@ -141,6 +141,14 @@ weekAgo.setDate(weekAgo.getDate() - 6)
 const queryDateRange = ref([formatDate(weekAgo), formatDate(now)])
 const oeeData = ref(null)
+// 从全局获取corpCode
+const corpCode = inject('corpCode')
+function withCorpCode(url) {
+  if (!corpCode.value) return url
+  const sep = url.includes('?') ? '&' : '?'
+  return `${url}${sep}corpCode=${encodeURIComponent(corpCode.value)}`
+}
+
 // 布局常量
 const padL = 50
 const padB = 24
@@ -602,7 +610,7 @@ async function fetchOeeData() {
     params += `&startDate=${start}&endDate=${end}`
   }
   try {
-    const res = await fetch(`/api/device/oeeStats?${params}`)
+    const res = await fetch(withCorpCode(`/api/device/oeeStats?${params}`))
     oeeData.value = await res.json()
   } catch (err) {
     console.error('获取稼动率数据失败:', err)
--- a/src/views/Energy.vue
View file @a4ea86e
+++ b/src/views/Energy.vue
View file @a4ea86e
@@ -305,7 +305,7 @@
 </template>
 <script setup>
-import { ref, reactive, computed, onMounted, watch, nextTick, onBeforeUnmount } from 'vue'
+import { ref, reactive, computed, onMounted, watch, nextTick, onBeforeUnmount, inject } from 'vue'
 import { Search, Menu, Document, Lock, Setting, Warning, Histogram } from '@element-plus/icons-vue'
 import EnergyReportDialog from '../components/EnergyReportDialog.vue'
 import SafetyDialog from '../components/SafetyDialog.vue'
@@ -316,6 +316,15 @@ const searchKeyword = ref('')
 const currentStatus = ref('realtime')
 const runStatusFilter = ref('') // runStatus 筛选: ''=全部, '0'=离线, '1'=停机, '2'=待机, '3'=运行
+// 从全局获取corpCode（由App.vue提供）
+const corpCode = inject('corpCode')
+
+// 给URL拼接corpCode
+function withCorpCode(url) {
+  const sep = url.includes('?') ? '&' : '?'
+  return `${url}${sep}corpCode=${encodeURIComponent(corpCode.value)}`
+}
+
 // 各状态数量（接口返回后更新）
 const totalCounts = reactive({ all: 0, stop: 0, standby: 0, run: 0, offline: 0 })
@@ -374,7 +383,7 @@ async function fetchDeviceList() {
     if (searchKeyword.value) params.append('deviceName', searchKeyword.value)
     if (runStatusFilter.value !== '') params.append('runStatus', runStatusFilter.value)
-    const res = await fetch(`/api/energy/list?${params}`)
+    const res = await fetch(withCorpCode(`/api/energy/list?${params}`))
     const data = await res.json()
     deviceList.value = (data.list || []).map(item => ({
       id: item.id,
@@ -396,7 +405,7 @@ async function fetchDeviceList() {
 // 获取运行状态统计
 async function fetchStats() {
   try {
-    const res = await fetch('/api/energy/stats')
+    const res = await fetch(withCorpCode('/api/energy/stats'))
     const data = await res.json()
     totalCounts.all = data.total || 0
     totalCounts.offline = parseInt(data['0']) || 0  // runStatus=0 离线
@@ -486,7 +495,7 @@ async function fetchTimelineData() {
   tsZoomLevel.value = 1
   tsViewCenterMs.value = 0
   try {
-    const url = `/api/energy/timelineStatus?date=${tsSelectedDate.value}&pageSize=${tsPageSize.value}&pageNo=${tsPageNo.value}`
+    const url = withCorpCode(`/api/energy/timelineStatus?date=${tsSelectedDate.value}&pageSize=${tsPageSize.value}&pageNo=${tsPageNo.value}`)
     const res = await fetch(url)
     const data = await res.json()
     if (data.code === 200) {
@@ -791,14 +800,18 @@ async function fetchUtilData() {
     endDate = utilMonthDate.value + '-' + String(lastDay).padStart(2, '0')
   }
   try {
-    const res = await fetch(`/api/energy/eqKwhStatistics?startDate=${startDate}&endDate=${endDate}`)
+    const res = await fetch(withCorpCode(`/api/energy/eqKwhStatistics?startDate=${startDate}&endDate=${endDate}`))
     const result = await res.json()
     if (result.code === 200) {
       const data = result.data || {}
-      Object.assign(utilData.currentStatus, data.currentStatus || {})
-      utilData.deviceList = data.deviceList || []
-      Object.assign(utilData.summary, data.summary || {})
-      utilData.abnormalRanking = data.abnormalRanking || []
+      const summary = data.summary || {}
+      Object.assign(utilData.currentStatus, summary.currentStatus || {})
+      utilData.deviceList = (summary.deviceList || []).map(d => ({
+        ...d,
+        availabilityRateValue: parseFloat(d.availabilityRate) || 0
+      }))
+      Object.assign(utilData.summary, summary)
+      utilData.abnormalRanking = summary.abnormalRanking || []
       await nextTick()
       drawUtilAll()
     }
@@ -1369,7 +1382,7 @@ async function fetchEffData() {
   }
   try {
-    const res = await fetch(`/api/energy/eqKwhByType?startDate=${startDate}&endDate=${endDate}&type=${type}`)
+    const res = await fetch(withCorpCode(`/api/energy/eqKwhByType?startDate=${startDate}&endDate=${endDate}&type=${type}`))
     const data = await res.json()
     if (data.code === 200) {
       effDataList.value = data.list || []
--- a/src/views/SmartLight.vue
View file @a4ea86e
+++ b/src/views/SmartLight.vue
View file @a4ea86e
@@ -373,7 +373,7 @@
 </template>
 <script setup>
-import { ref, reactive, computed, onMounted, watch, nextTick } from 'vue'
+import { ref, reactive, computed, onMounted, watch, nextTick, inject } from 'vue'
 import { Search, Menu, DataLine, Setting, Document, Warning } from '@element-plus/icons-vue'
 import { ElMessage } from 'element-plus'
 import OeeDialog from '../components/OeeDialog.vue'
@@ -386,6 +386,14 @@ const searchKeyword = ref('')
 const currentStatus = ref('realtime')
 const lampStateFilter = ref('') // 灯状态筛选: ''=全部, '1'=绿, '2'=红, '3'=黄, '0'=灭灯
+// 从全局获取corpCode
+const corpCode = inject('corpCode')
+function withCorpCode(url) {
+  if (!corpCode.value) return url
+  const sep = url.includes('?') ? '&' : '?'
+  return `${url}${sep}corpCode=${encodeURIComponent(corpCode.value)}`
+}
+
 // 各颜色数量（接口返回后更新，初始默认值）
 const totalCounts = reactive({ all: 0, red: 0, yellow: 0, green: 0, blue: 0, gray: 0 })
@@ -459,7 +467,7 @@ async function fetchDeviceList() {
     if (searchKeyword.value) params.append('deviceName', searchKeyword.value)
     if (lampStateFilter.value) params.append('lampState', lampStateFilter.value)
-    const res = await fetch(`/api/device/list?${params}`)
+    const res = await fetch(withCorpCode(`/api/device/list?${params}`))
     const data = await res.json()
     deviceList.value = (data.list || []).map(item => ({
       id: item.id,
@@ -482,7 +490,7 @@ async function fetchDeviceList() {
 // 获取灯状态统计
 async function fetchStats() {
   try {
-    const res = await fetch('/api/device/stats')
+    const res = await fetch(withCorpCode('/api/device/stats'))
     const data = await res.json()
     totalCounts.all = data.all || 0
     totalCounts.red = data.red || 0
@@ -942,7 +950,7 @@ async function fetchTimeSeriesData() {
       pageNo: tsPageNo.value,
       pageSize: tsPageSize,
     })
-    const res = await fetch(`/api/device/oeeTimeline?${params}`)
+    const res = await fetch(withCorpCode(`/api/device/oeeTimeline?${params}`))
     const data = await res.json()
     if (data.data && data.data.records) {
@@ -1639,7 +1647,7 @@ async function fetchUtilData() {
   utilLoading.value = true
   try {
-    const res = await fetch(`/api/device/lampStatistics?startDate=${startDate}&endDate=${endDate}`)
+    const res = await fetch(withCorpCode(`/api/device/lampStatistics?startDate=${startDate}&endDate=${endDate}`))
     const data = await res.json()
     if (data.totalDuration) Object.assign(utilData.totalDuration, data.totalDuration)
@@ -1750,7 +1758,7 @@ async function fetchStartupData() {
   startupLoading.value = true
   try {
-    const res = await fetch(`/api/device/bootRate?startDate=${startDate}&endDate=${endDate}`)
+    const res = await fetch(withCorpCode(`/api/device/bootRate?startDate=${startDate}&endDate=${endDate}`))
     const data = await res.json()
     startupList.value = data.list || []