@ledvance/group-ui-biz-bundle 1.0.96 → 1.0.97

package/package.json

@@ -4,7 +4,7 @@
   "name": "@ledvance/group-ui-biz-bundle",
   "pid": [],
   "uiid": "",
-  "version": "1.0.96",
+  "version": "1.0.97",
   "scripts": {},
   "dependencies": {
     "@ledvance/base": "^1.x",

package/src/modules/biorhythm/BiorhythmDetailPage.tsx

@@ -157,6 +157,7 @@ const BiorhythmEditPage = (props: { theme?: ThemeType }) => {
 
           <Spacer />
           <TimerPicker
+            key={props.theme?.type}
             itemTextColor='#aeadb5'
             style={{ paddingVertical: cx(0), marginVertical: cx(0), backgroundColor: props.theme?.global.background }}
             pickerFontColor={props.theme?.global.fontColor}

package/src/modules/biorhythm/BiorhythmPage.tsx

@@ -10,7 +10,7 @@ import {
   getDefBiorhythmUIState,
   Plan,
 } from './BiorhythmBean'
-import { Modal, Utils } from 'tuya-panel-kit'
+import { Dialog, Modal, Utils } from 'tuya-panel-kit'
 import { sortBy, cloneDeep } from 'lodash'
 import iconList from './iconListData'
 import pIdList from './pIdList'
@@ -264,6 +264,9 @@ const BiorhythmPage = (props: { theme?: ThemeType }) => {
               state.loading = true
               state.enable = enable
               state.flag = Symbol()
+            },
+            onCancel: () => {
+              Dialog.close()
             }
           })
           state.loading = true
@@ -598,13 +601,16 @@ const BiorhythmPage = (props: { theme?: ThemeType }) => {
                             state.planList = defBiorhythmUIState.planList
                             state.flag = Symbol()
                             close()
+                          },
+                          onCancel: () => {
+
                           }
                         })
                       }}
                     />
                     <Spacer />
                   </View>
-                ) || <></>
+                )
               }}
             />
             {!state.enable && (

package/src/modules/energyConsumption/EnergyConsumptionActions.ts

@@ -1,173 +1,180 @@
-import {useGroupEzvizConfig} from "@ledvance/base/src/models/modules/NativePropsSlice";
+import { useGroupEzvizConfig } from "@ledvance/base/src/models/modules/NativePropsSlice";
 import {
-    DpResultByMonthResData,
-    getDataWithSpecified,
-    getDpResultByHour,
-    getDpResultByMonth
+  DpResultByMonthResData,
+  getDataWithSpecified,
+  getDpResultByHour,
+  getDpResultByMonth
 } from "@ledvance/base/src/models/TuyaApi";
-import {overDays} from "@ledvance/base/src/utils";
-import {loopsText, monthFormat, monthFormatShort} from "@ledvance/base/src/utils/common";
-import {DateType} from "@ledvance/group-ui-biz-bundle/src/modules/energyConsumption/co2Data";
-import {OverviewItem} from "@ledvance/group-ui-biz-bundle/src/modules/energyConsumption/EnergyConsumptionPage";
+import { overDays } from "@ledvance/base/src/utils";
+import { exportCsvFile, loopsText, monthFormat, monthFormatShort } from "@ledvance/base/src/utils/common";
+import { DateType } from "@ledvance/group-ui-biz-bundle/src/modules/energyConsumption/co2Data";
+import { OverviewItem } from "@ledvance/group-ui-biz-bundle/src/modules/energyConsumption/EnergyConsumptionPage";
 import dayjs from "dayjs";
-import {isNumber} from "lodash";
-import {EnergyData, UnitList} from "./component/EnergyModal";
+import { isNumber } from "lodash";
+import { EnergyData, UnitList } from "./component/EnergyModal";
+import I18n from "@ledvance/base/src/i18n";
 
 interface LightConfig {
-    energyConsumption?: EnergyData
+  energyConsumption?: EnergyData
 }
 
 export const useEnergyConsumption = () => {
-    return useGroupEzvizConfig<LightConfig, EnergyData>('energyConsumption', {unit: UnitList[0], price: ''})
+  return useGroupEzvizConfig<LightConfig, EnergyData>('energyConsumption', { unit: UnitList[0], price: '' })
 }
 
 export const unitDivision = (str: string) => {
-    if (!str) {
-        return ['', '']
-    }
-    const strIndex = str.indexOf('(' || '（')
-    const unit = str.substring(strIndex)
-    const name = str.split(unit)[0]
-    return [name, unit]
+  if (!str) {
+    return ['', '']
+  }
+  const strIndex = str.indexOf('(' || '（')
+  const unit = str.substring(strIndex)
+  const name = str.split(unit)[0]
+  return [name, unit]
 }
 
 
 export async function getElectricity(devIdGroup: string[], addEleDpCode: string, date: string, dateType: DateType): Promise<OverviewItem[]> {
-    let res: OverviewItem[] = []
-    switch (dateType) {
-        case DateType.Year:
-            res = await getDpResultByYear(devIdGroup, addEleDpCode, date)
-            break
-        case DateType.Month:
-            res = await getDpResultByYearMonth(devIdGroup, addEleDpCode, date)
-            break
-        case DateType.Day:
-            res = await getDpResultByDate(devIdGroup, addEleDpCode, date);
-            break
-    }
-    return res
+  let res: OverviewItem[] = []
+  switch (dateType) {
+    case DateType.Year:
+      res = await getDpResultByYear(devIdGroup, addEleDpCode, date)
+      break
+    case DateType.Month:
+      res = await getDpResultByYearMonth(devIdGroup, addEleDpCode, date)
+      break
+    case DateType.Day:
+      res = await getDpResultByDate(devIdGroup, addEleDpCode, date);
+      break
+  }
+  return res
 }
 
 let dpResultByMonthCache: DpResultByMonthResData[] | undefined
 const getDpResultByYear = async (devIdGroup: string[], addEleDpCode: string, dateStr: string): Promise<OverviewItem[]> => {
-    const year = dateStr;
-    let successGroup = dpResultByMonthCache;
-    if (!successGroup) {
-        const promiseGroup = devIdGroup.map(devId =>
-            getDpResultByMonth(devId, addEleDpCode, 'sum').catch(error => ({error}))
-        );
-        // @ts-ignore
-        dpResultByMonthCache = (await Promise.all(promiseGroup)).filter(v => !v.error);
-        successGroup = dpResultByMonthCache
-    }
-    if (!successGroup) {
-        return []
-    }
+  const year = dateStr;
+  let successGroup = dpResultByMonthCache;
+  if (!successGroup) {
+    const promiseGroup = devIdGroup.map(devId =>
+      getDpResultByMonth(devId, addEleDpCode, 'sum').catch(error => ({ error }))
+    );
     // @ts-ignore
-    const mergedData = {}
-    successGroup.forEach(item => {
-        const monthData = item.years[year];
-        if (monthData) {
-            Object.keys(monthData).forEach(month => {
-                if (mergedData[month] === undefined) {
-                    mergedData[month] = 0
-                }
-                const monthNum = Number(monthData[month])
-                mergedData[month] += Number(isNumber(monthNum) ? monthNum : 0)
-            })
-        }
-    })
-    const curMonthList = Object.keys(mergedData).sort((a, b) => parseInt(b) - parseInt(a));
-    return curMonthList.map(month => {
-        return {
-            key: `${monthFormat(month)} ${year}`,
-            value: (Number(mergedData[month]) || 0).toFixed(2),
-            headlineText: `${year}${month}`,
-            chartTitle: `${monthFormatShort(month)}\n${year}`
+    dpResultByMonthCache = (await Promise.all(promiseGroup)).filter(v => !v.error);
+    successGroup = dpResultByMonthCache
+  }
+  if (!successGroup) {
+    return []
+  }
+  // @ts-ignore
+  const mergedData = {}
+  successGroup.forEach(item => {
+    const monthData = item.years[year];
+    if (monthData) {
+      Object.keys(monthData).forEach(month => {
+        if (mergedData[month] === undefined) {
+          mergedData[month] = 0
         }
-    })
+        const monthNum = Number(monthData[month])
+        mergedData[month] += Number(isNumber(monthNum) ? monthNum : 0)
+      })
+    }
+  })
+  const curMonthList = Object.keys(mergedData).sort((a, b) => parseInt(b) - parseInt(a));
+  return curMonthList.map(month => {
+    return {
+      key: `${monthFormat(month)} ${year}`,
+      value: (Number(mergedData[month]) || 0).toFixed(2),
+      headlineText: `${year}${month}`,
+      chartTitle: `${monthFormatShort(month)}\n${year}`
+    }
+  })
 }
 
 
 const getDpResultByYearMonth = async (deviceIdGroup: string[], addEleDpCode: string, dateStr: string): Promise<OverviewItem[]> => {
-    const date = dayjs(dateStr)
-    const startDay = date.startOf('month').format('YYYYMMDD')
-    const endDay = date.endOf('month').format('YYYYMMDD')
-    const promiseGroup = deviceIdGroup.map(devId => getDataWithSpecified(devId, addEleDpCode, startDay, endDay, 'sum').catch(error => ({error})))
-    const res = await Promise.all(promiseGroup);
-    // @ts-ignore
-    const successGroup: DpResultByDataWithSpecifiedResData[] = res.filter(v => !v.error);
-    const mergedData = {}
-    successGroup.forEach(item => {
-        if (item.result) {
-            Object.keys(item.result).forEach(day => {
-                if (mergedData[day] === undefined) {
-                    mergedData[day] = 0
-                }
-                const dayNum = Number(item.result[day])
-                mergedData[day] += Number(isNumber(dayNum) ? dayNum : 0)
-            })
+  const date = dayjs(dateStr)
+  const startDay = date.startOf('month').format('YYYYMMDD')
+  const endDay = date.endOf('month').format('YYYYMMDD')
+  const promiseGroup = deviceIdGroup.map(devId => getDataWithSpecified(devId, addEleDpCode, startDay, endDay, 'sum').catch(error => ({ error })))
+  const res = await Promise.all(promiseGroup);
+  // @ts-ignore
+  const successGroup: DpResultByDataWithSpecifiedResData[] = res.filter(v => !v.error);
+  const mergedData = {}
+  successGroup.forEach(item => {
+    if (item.result) {
+      Object.keys(item.result).forEach(day => {
+        if (mergedData[day] === undefined) {
+          mergedData[day] = 0
         }
-    })
-    return Object.keys(mergedData).filter(v => Number(mergedData[v]) > 0).map(time => {
-        // 提取年、月和日
-        const year = time.slice(0, 4);
-        const month = time.slice(4, 6);
-        const day = time.slice(6, 8);
+        const dayNum = Number(item.result[day])
+        mergedData[day] += Number(isNumber(dayNum) ? dayNum : 0)
+      })
+    }
+  })
+  return Object.keys(mergedData).filter(v => Number(mergedData[v]) > 0).map(time => {
+    // 提取年、月和日
+    const year = time.slice(0, 4);
+    const month = time.slice(4, 6);
+    const day = time.slice(6, 8);
 
-        // 格式化为 'YYYY/MM/DD' 格式
-        const formattedDate = `${year}/${month}/${day}`
-        const dateStr = `${day}/${month}/${year}`
-        const dateObj = dayjs(formattedDate, "YYYY/MM/DD");
-        const dayOfWeek = dateObj.day() % 7;
-        const key = `${dateStr} (${loopsText[dayOfWeek]})`
-        return {
-            key,
-            value: Number(mergedData[time] || 0).toFixed(2),
-            headlineText: formattedDate,
-            chartTitle: `${Number(key?.split('/')[0])}\n${loopsText[dayOfWeek]}`
-        }
-    })
+    // 格式化为 'YYYY/MM/DD' 格式
+    const formattedDate = `${year}/${month}/${day}`
+    const dateStr = `${day}/${month}/${year}`
+    const dateObj = dayjs(formattedDate, "YYYY/MM/DD");
+    const dayOfWeek = dateObj.day() % 7;
+    const key = `${dateStr} (${loopsText[dayOfWeek]})`
+    return {
+      key,
+      value: Number(mergedData[time] || 0).toFixed(2),
+      headlineText: formattedDate,
+      chartTitle: `${Number(key?.split('/')[0])}\n${loopsText[dayOfWeek]}`
+    }
+  })
 }
 
 
 const getDpResultByDate = async (deviceIdGroup: string[], addEleDpCode: string, date: string): Promise<OverviewItem[]> => {
-    if (overDays(date, 7)) {
-        console.log("getDpResultByDate overDays true")
-        return []
-    }
-    const promiseGroup = deviceIdGroup.map(devId => getDpResultByHour(devId, addEleDpCode, date, 'sum').catch(error => ({error})))
-    const res = await Promise.all(promiseGroup);
-    // @ts-ignore
-    const successGroup: DpResultByDataWithSpecifiedResData[] = res.filter(v => !v.error);
-    const mergedData = {}
-    successGroup.forEach(item => {
-        if (item) {
-            Object.keys(item).forEach(day => {
-                if (mergedData[day] === undefined) {
-                    mergedData[day] = 0
-                }
-                const dayNum = Number(item[day])
-                mergedData[day] += Number(isNumber(dayNum) ? dayNum : 0)
-            })
+  if (overDays(date, 7)) {
+    console.log("getDpResultByDate overDays true")
+    return []
+  }
+  const promiseGroup = deviceIdGroup.map(devId => getDpResultByHour(devId, addEleDpCode, date, 'sum').catch(error => ({ error })))
+  const res = await Promise.all(promiseGroup);
+  // @ts-ignore
+  const successGroup: DpResultByDataWithSpecifiedResData[] = res.filter(v => !v.error);
+  const mergedData = {}
+  successGroup.forEach(item => {
+    if (item) {
+      Object.keys(item).forEach(day => {
+        if (mergedData[day] === undefined) {
+          mergedData[day] = 0
         }
-    });
+        const dayNum = Number(item[day])
+        mergedData[day] += Number(isNumber(dayNum) ? dayNum : 0)
+      })
+    }
+  });
 
 
-    const list: Array<OverviewItem> = []
-    const resData = Object.keys(mergedData)?.map(val => {
-        return {key: Number(val?.slice(8, 10)), value: Number(mergedData[val])}
+  const list: Array<OverviewItem> = []
+  const resData = Object.keys(mergedData)?.map(val => {
+    return { key: Number(val?.slice(8, 10)), value: Number(mergedData[val]) }
+  })
+  for (let i = 0; i <= 23; i++) {
+    const hourData = resData?.find(val => val?.key === i)
+    const hourKey = hourData?.key || i
+    const hourValue = Number(hourData?.value) || 0
+    list.push({
+      key: `${hourKey.toString().padStart(2, '0')}:00`,
+      value: hourValue,
+      chartTitle: `${hourKey}:00`,
+      headlineText: `${hourKey}:00`
     })
-    for (let i = 0; i <= 23; i++) {
-        const hourData = resData?.find(val => val?.key === i)
-        const hourKey = hourData?.key || i
-        const hourValue = Number(hourData?.value) || 0
-        list.push({
-            key: `${hourKey.toString().padStart(2, '0')}:00`,
-            value: hourValue,
-            chartTitle: `${hourKey}:00`,
-            headlineText: `${hourKey}:00`
-        })
-    }
-    return list
+  }
+  return list
+}
+
+export const exportEnergyCsv = (values: any[][], unit: string) => {
+  const headers = [I18n.getLang('date'), `${I18n.getLang('consumption_data_annual_bar_chart_system_back_text')} (kWh)`, `Price(${unit})`]
+  const functionName = `${I18n.getLang('consumption_data_annual_bar_chart_system_back_text')}`
+  exportCsvFile(headers, values, functionName)
 }

package/src/modules/energyConsumption/EnergyConsumptionChart.tsx

@@ -1,26 +1,26 @@
 import React, { useCallback } from "react";
-import { Platform, View, StyleSheet, Image, Text, TouchableOpacity} from "react-native";
+import { View, StyleSheet, Image, TouchableOpacity } from "react-native";
 import { useRoute } from '@react-navigation/core'
 import Page from "@ledvance/base/src/components/Page";
 import res from "@ledvance/base/src/res";
 import I18n from "@ledvance/base/src/i18n";
 import { Utils } from "tuya-panel-kit";
-import { exportFile, loopsText, monthFormat } from "@ledvance/base/src/utils/common";
+import { loopsText, monthFormat } from "@ledvance/base/src/utils/common";
 import { OverviewItem } from "./EnergyConsumptionPage";
 import Spacer from "@ledvance/base/src/components/Spacer";
 import InfoText from "@ledvance/base/src/components/InfoText";
 import ThemeType from '@ledvance/base/src/config/themeType'
-import {overDays} from "@ledvance/base/src/utils/index";
+import { overDays } from "@ledvance/base/src/utils/index";
 import dayjs from "dayjs";
 import { DateType } from "@ledvance/group-ui-biz-bundle/src/modules/energyConsumption/co2Data";
 import { useReactive, useUpdateEffect } from "ahooks";
 import DateTypeItem from "@ledvance/group-ui-biz-bundle/src/modules/energyConsumption/component/DateTypeItem";
 import DateSelectedItem from "@ledvance/group-ui-biz-bundle/src/modules/energyConsumption/component/DateSelectedItem";
 import NewBarChart from "@ledvance/group-ui-biz-bundle/src/modules/energyConsumption/component/NewBarChart";
-import { getElectricity } from "@ledvance/group-ui-biz-bundle/src/modules/energyConsumption/EnergyConsumptionActions";
+import { exportEnergyCsv, getElectricity } from "@ledvance/group-ui-biz-bundle/src/modules/energyConsumption/EnergyConsumptionActions";
 import DateSwitch from "./component/DateSwitch";
 
-const { convertX: cx, height, width } = Utils.RatioUtils
+const { convertX: cx } = Utils.RatioUtils
 const { withTheme } = Utils.ThemeUtils
 
 export interface EnergyConsumptionChartProps {
@@ -37,7 +37,7 @@ export interface EnergyConsumptionChartProps {
 
 const EnergyConsumptionChart = (props: { theme?: ThemeType }) => {
   const params = useRoute().params as EnergyConsumptionChartProps
-  const {price, unit, date, addEleDpCode,deviceIdGroup,over365Days, over7Days} = params;
+  const { price, unit, date, addEleDpCode, deviceIdGroup, over365Days, over7Days } = params;
 
   const styles = StyleSheet.create({
     listEmptyView: {
@@ -96,7 +96,7 @@ const EnergyConsumptionChart = (props: { theme?: ThemeType }) => {
     getElectricity(deviceIdGroup, addEleDpCode, state.date, state.dateType).then((res) => {
       state.chartData = res;
       state.loading = false;
-    }).catch(()=>{
+    }).catch(() => {
       state.loading = false;
     });
   }, [state.date]);
@@ -148,72 +148,75 @@ const EnergyConsumptionChart = (props: { theme?: ThemeType }) => {
   }, [state.dateType, state.over365Days, state.over7Days]);
 
   return (
-      <Page
-          backText={I18n.getLang('consumption_data_annual_bar_chart_system_back_text')}
-          showGreenery={false}
-          greeneryIcon={res.energy_consumption_greenery}
-          loading={state.loading}
-          headlineContent={
-            <View style={{width: '100%',flexDirection:'row'}}>
-              <DateSwitch
-                  style={{flex: 1}}
-                  date={state.date}
-                  dateType={state.dateType}
-                  headlineText={state.headlineText}
-                  onDateChange={(date) => {
-                    state.date = date;
-                  }}/>
-              <TouchableOpacity onPress={() => {
-                exportFile(state.chartData, params.price, params.unit)
-              }}>
-                <Image
-                    style={styles.downloadIcon}
-                    source={state.chartData?.length ? res.download_icon : undefined}/>
-              </TouchableOpacity>
-            </View>
-          }
-      >
-        <View style={{ marginHorizontal: cx(24) }}>
-          <View style={{flexDirection: 'row'}}>
-            <DateTypeItem
-                style={{flex: 1}}
-                dateType={state.dateType}
-                onDateTypeChange={(dateType) => {
-                  state.dateType = dateType;
-                }}/>
-            <DateSelectedItem
-                style={{flex: 1, marginStart: cx(10),marginBottom:cx(15)}}
-                dateType={state.dateType}
-                date={state.date}
-                onDateChange={date => {
-                  state.date = date;
-                }}
-            />
+    <Page
+      backText={I18n.getLang('consumption_data_annual_bar_chart_system_back_text')}
+      showGreenery={false}
+      greeneryIcon={res.energy_consumption_greenery}
+      loading={state.loading}
+      headlineContent={
+        <View style={{ width: '100%', flexDirection: 'row' }}>
+          <DateSwitch
+            style={{ flex: 1 }}
+            date={state.date}
+            dateType={state.dateType}
+            headlineText={state.headlineText}
+            onDateChange={(date) => {
+              state.date = date;
+            }} />
+          <TouchableOpacity
+            style={{ width: cx(30) }}
+            onPress={() => {
+              const values = state.chartData.map(item => [item.key, item.value, (Number(params.price) * Number(item.value)).toFixed(2)])
+              exportEnergyCsv(values, params.unit)
+            }}>
+            <Image
+              style={styles.downloadIcon}
+              source={state.chartData?.length ? res.download_icon : undefined} />
+          </TouchableOpacity>
+        </View>
+      }
+    >
+      <View style={{ marginHorizontal: cx(24) }}>
+        <View style={{ flexDirection: 'row' }}>
+          <DateTypeItem
+            style={{ flex: 1 }}
+            dateType={state.dateType}
+            onDateTypeChange={(dateType) => {
+              state.dateType = dateType;
+            }} />
+          <DateSelectedItem
+            style={{ flex: 1, marginStart: cx(10), marginBottom: cx(15) }}
+            dateType={state.dateType}
+            date={state.date}
+            onDateChange={date => {
+              state.date = date;
+            }}
+          />
 
-          </View>
-          {
-            (state.chartData.length <= 0) ? (
-                <View style={styles.listEmptyView}>
-                  <Spacer height={cx(26)} />
-                  <Image
-                      style={styles.listEmptyImage}
-                      source={{ uri: res.ldv_timer_empty }} />
-                  <Spacer height={cx(14)} />
-                  <InfoText
-                      text={getEmptyDataTip()}
-                      icon={res.ic_info}
-                      textStyle={styles.listEmptyText}
-                      contentColor={props.theme?.global.fontColor}
-                  />
-                </View>
-            ) : (
-                state.chartData.length > 0 && !state.loading &&
-                <NewBarChart height={cx(400)} data={state.chartData} price={state.price}
-                             unit={unit}/>
-            )
-          }
         </View>
-      </Page>
+        {
+          (state.chartData.length <= 0) ? (
+            <View style={styles.listEmptyView}>
+              <Spacer height={cx(26)} />
+              <Image
+                style={styles.listEmptyImage}
+                source={{ uri: res.ldv_timer_empty }} />
+              <Spacer height={cx(14)} />
+              <InfoText
+                text={getEmptyDataTip()}
+                icon={res.ic_info}
+                textStyle={styles.listEmptyText}
+                contentColor={props.theme?.global.fontColor}
+              />
+            </View>
+          ) : (
+            state.chartData.length > 0 && !state.loading &&
+            <NewBarChart height={cx(400)} data={state.chartData} price={state.price}
+              unit={unit} />
+          )
+        }
+      </View>
+    </Page>
   )
 }
 

package/src/modules/energyConsumption/EnergyConsumptionDetail.tsx

@@ -13,7 +13,7 @@ import { DpResultByDataWithSpecifiedResData, getDataWithSpecified, getDpResultBy
 import { useTimeZoneCity } from "@ledvance/base/src/models/modules/NativePropsSlice";
 import { cloneDeep, isNumber } from "lodash";
 import { OverviewItem, PopupType } from "./EnergyConsumptionPage";
-import { exchangeNumber, exportFile, localeNumber, loopsText } from '@ledvance/base/src/utils/common'
+import { exchangeNumber, localeNumber, loopsText } from '@ledvance/base/src/utils/common'
 import dayjs from "dayjs";
 import { ui_biz_routerKey } from '../../navigation/Routers'
 import { EnergyConsumptionChartProps } from "./EnergyConsumptionChart";
@@ -21,6 +21,7 @@ import { overDays } from "@ledvance/base/src/utils";
 import EnergyPopup, { EnergyData } from "./component/EnergyModal";
 import { carbonDioxideEmission, countryAndRegion } from "./co2Data";
 import ThemeType from '@ledvance/base/src/config/themeType'
+import { exportEnergyCsv } from "./EnergyConsumptionActions";
 
 const { convertX: cx } = Utils.RatioUtils
 const { withTheme } = Utils.ThemeUtils
@@ -216,7 +217,8 @@ const EnergyConsumptionDetail = (props: { theme?: ThemeType }) => {
       headlineText={params.curMonth.key}
       headlineIcon={state.overviewList.length ? res.download_icon : undefined}
       onHeadlineIconClick={() => {
-        exportFile(state.overviewList, params.price, params.unit);
+        const values = state.overviewList.map(item => [item.key, item.value, (Number(params.price) * Number(item.value)).toFixed(2)])
+        exportEnergyCsv(values, params.unit)
       }}
       showGreenery={false}
       greeneryIcon={res.energy_consumption_greenery}
@@ -302,10 +304,10 @@ const EnergyConsumptionDetail = (props: { theme?: ThemeType }) => {
                 headlineText: params.curMonth.key,
                 chartData: state.overviewList,
                 over365Days: state.over365Days,
-                price:state.price,
-                unit:state.unit,
-                addEleDpCode:params.addEleDpCode,
-                date:params.curMonth.headlineText,
+                price: state.price,
+                unit: state.unit,
+                addEleDpCode: params.addEleDpCode,
+                date: params.curMonth.headlineText,
                 deviceIdGroup: params.deviceIdGroup,
               } as EnergyConsumptionChartProps)
             }}
@@ -318,9 +320,9 @@ const EnergyConsumptionDetail = (props: { theme?: ThemeType }) => {
                 chartData: res,
                 over7Days: state.over7Days,
                 addEleDpCode: params.addEleDpCode,
-                price:state.price,
-                unit:state.unit,
-                date:item.headlineText,
+                price: state.price,
+                unit: state.unit,
+                date: item.headlineText,
                 deviceIdGroup: params.deviceIdGroup,
               } as EnergyConsumptionChartProps)
             }}

package/src/modules/energyConsumption/EnergyConsumptionPage.tsx

@@ -16,7 +16,6 @@ import { useTimeZoneCity } from '@ledvance/base/src/models/modules/NativePropsSl
 import { flattenDeep, isNumber, sumBy } from 'lodash';
 import {
   exchangeNumber,
-  exportFile,
   localeNumber,
   monthFormat,
   monthFormatShort,
@@ -28,6 +27,7 @@ import { EnergyConsumptionDetailProps } from './EnergyConsumptionDetail';
 import { EnergyConsumptionChartProps } from './EnergyConsumptionChart';
 import SegmentControl from '@ledvance/base/src/components/segmentControl';
 import ThemeType from '@ledvance/base/src/config/themeType'
+import { exportEnergyCsv } from "./EnergyConsumptionActions";
 
 const { convertX: cx } = Utils.RatioUtils;
 const { withTheme } = Utils.ThemeUtils;
@@ -285,7 +285,8 @@ const EnergyConsumptionPage = (props: { theme?: ThemeType }) => {
       )}
       headlineIcon={(state.isSolarMode ? state.solarOverviewList : state.wifiOverviewList).length ? res.download_icon : undefined}
       onHeadlineIconClick={() => {
-        exportFile(state.isSolarMode ? state.solarOverviewList : state.wifiOverviewList, state.price, state.unit);
+        const values = (state.isSolarMode ? state.solarOverviewList : state.wifiOverviewList).map(item => [item.key, item.value, (Number(state.price) * Number(item.value)).toFixed(2)])
+        exportEnergyCsv(values, state.unit)
       }}
       showGreenery={state.isSolarMode}
       greeneryIcon={res.energy_consumption_greenery}
@@ -309,7 +310,7 @@ const EnergyConsumptionPage = (props: { theme?: ThemeType }) => {
           {/* tip */}
           <Spacer height={cx(15)} />
           <View style={styles.showTip}>
-            <Text style={{ fontSize: cx(14) }}>
+            <Text style={{ fontSize: cx(14), color: props.theme?.global.fontColor, }}>
               {I18n.getLang(
                 state.isSolarMode
                   ? 'generation_data_description_text'