@ledvance/ui-biz-bundle 1.1.69 → 1.1.71

package/src/newModules/energyConsumption/component/Overview.tsx

@@ -1,118 +1,118 @@
-import React from "react";
-import { View, Text, StyleProp, ViewStyle, TouchableOpacity, Image, FlatList, StyleSheet } from "react-native";
-import { Utils } from "tuya-panel-kit";
-import res from "@ledvance/base/src/res";
-import Spacer from "@ledvance/base/src/components/Spacer";
-import I18n from "@ledvance/base/src/i18n";
-import { isEmpty } from "lodash";
-import { OverviewItem } from "../EnergyConsumptionPage";
-import { EnergyConsumptionChartProps } from "../EnergyConsumptionChart";
-import { useRoute } from '@react-navigation/core'
-
-const { convertX: cx } = Utils.RatioUtils
-const { withTheme } = Utils.ThemeUtils
-
-interface OverViewProps {
-  theme?: any
-  style?: StyleProp<ViewStyle>
-  headlineText?: string
-  headlineClick?: () => void
-  overviewItemClick?: (item: OverviewItem) => void
-  overViewList: OverviewItem[]
-}
-const OverView = (props: OverViewProps) => {
-  const { over365Days} = useRoute().params as EnergyConsumptionChartProps
-
-  const styles = StyleSheet.create({
-    listEmptyContainer: {
-      alignItems: 'center'
-    },
-    listEmptyImage: {
-      width: cx(200),
-      height: cx(200),
-    },
-    listEmptyTextIcon: {
-      width: cx(16),
-      height: cx(16),
-      tintColor: props.theme.global.fontColor,
-    },
-    listEmptyText: {
-      color: props.theme.global.fontColor,
-      fontSize: cx(12),
-      fontFamily: 'helvetica_neue_lt_std_roman',
-    },
-    overviewItemText: {
-      color: props.theme.global.fontColor,
-      fontSize: cx(14)
-    },
-  })
-  return (
-    <View style={[props.style]}>
-      <View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
-        <Text style={{ color: props.theme.global.fontColor, fontWeight: 'bold' }}>{props.headlineText}</Text>
-        {!isEmpty(props.overViewList) && <TouchableOpacity
-            onPress={() => {
-              props.headlineClick && props.headlineClick()
-            }}
-        >
-            <Image
-                source={res.energy_consumption_chart}
-                style={{ width: cx(16), height: cx(16), marginLeft: cx(8) }}
-            />
-        </TouchableOpacity>}
-      </View>
-      <Spacer />
-      <FlatList
-        data={props.overViewList}
-        renderItem={({ item }) => (
-          <View>
-            <TouchableOpacity
-              onPress={() => {
-                props.overviewItemClick && props.overviewItemClick(item)
-              }}
-            >
-              <View style={{ backgroundColor: props.theme.card.background, alignItems: 'center', justifyContent: 'space-between', flexDirection: 'row', }}>
-                <Text style={styles.overviewItemText}>{item.key}</Text>
-                <View style={{ flexDirection: 'row', justifyContent: 'center', alignItems: 'center' }}>
-                  <View style={{ flexDirection: 'row' }}>
-                    <Text style={[styles.overviewItemText, { color: props.theme.global.secondFontColor }]}>{item.value}</Text>
-                    <Text style={[styles.overviewItemText, { color: props.theme.global.secondFontColor }]}> kWh</Text>
-                  </View>
-                  <Image
-                    source={res.energy_consumption_right}
-                    style={{ width: cx(16), height: cx(16), marginLeft: cx(8) }}
-                  />
-                </View>
-              </View>
-            </TouchableOpacity>
-          </View>
-        )}
-        keyExtractor={(item) => item.key}
-        ItemSeparatorComponent={() => <Spacer height={cx(10)} />}
-        ListFooterComponent={() => <Spacer height={cx(30)} />}
-        ListEmptyComponent={() => (
-          <View style={styles.listEmptyContainer}>
-            <Image
-              style={styles.listEmptyImage}
-              source={res.energy_consumption_empty} />
-            <Spacer height={cx(10)} />
-            <View style={{ flexDirection: 'row', alignItems: 'center', marginBottom: cx(25) }}>
-              <Image style={styles.listEmptyTextIcon} source={res.co2Icon} />
-              <Spacer width={cx(4)} height={0} />
-              <Text style={styles.listEmptyText}>
-                {
-                  over365Days ?
-                    I18n.getLang('energyconsumption_Daylimit')
-                    :
-                    I18n.getLang('history_overview_empty_information_text')
-                }
-              </Text>
-            </View>
-          </View>
-        )}
-      />
-    </View>
-  )
-}
-
-export default withTheme(OverView)
+import React from "react";
+import { View, Text, StyleProp, ViewStyle, TouchableOpacity, Image, FlatList, StyleSheet } from "react-native";
+import { Utils } from "tuya-panel-kit";
+import res from "@ledvance/base/src/res";
+import Spacer from "@ledvance/base/src/components/Spacer";
+import I18n from "@ledvance/base/src/i18n";
+import { isEmpty } from "lodash";
+import { OverviewItem } from "../EnergyConsumptionPage";
+import { EnergyConsumptionChartProps } from "../EnergyConsumptionChart";
+import { useRoute } from '@react-navigation/core'
+
+const { convertX: cx } = Utils.RatioUtils
+const { withTheme } = Utils.ThemeUtils
+
+interface OverViewProps {
+  theme?: any
+  style?: StyleProp<ViewStyle>
+  headlineText?: string
+  headlineClick?: () => void
+  overviewItemClick?: (item: OverviewItem) => void
+  overViewList: OverviewItem[]
+}
+const OverView = (props: OverViewProps) => {
+  const { over365Days} = useRoute().params as EnergyConsumptionChartProps
+
+  const styles = StyleSheet.create({
+    listEmptyContainer: {
+      alignItems: 'center'
+    },
+    listEmptyImage: {
+      width: cx(200),
+      height: cx(200),
+    },
+    listEmptyTextIcon: {
+      width: cx(16),
+      height: cx(16),
+      tintColor: props.theme.global.fontColor,
+    },
+    listEmptyText: {
+      color: props.theme.global.fontColor,
+      fontSize: cx(12),
+      fontFamily: 'helvetica_neue_lt_std_roman',
+    },
+    overviewItemText: {
+      color: props.theme.global.fontColor,
+      fontSize: cx(14)
+    },
+  })
+  return (
+    <View style={[props.style]}>
+      <View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
+        <Text style={{ color: props.theme.global.fontColor, fontWeight: 'bold' }}>{props.headlineText}</Text>
+        {!isEmpty(props.overViewList) && <TouchableOpacity
+            onPress={() => {
+              props.headlineClick && props.headlineClick()
+            }}
+        >
+            <Image
+                source={res.energy_consumption_chart}
+                style={{ width: cx(16), height: cx(16), marginLeft: cx(8) }}
+            />
+        </TouchableOpacity>}
+      </View>
+      <Spacer />
+      <FlatList
+        data={props.overViewList}
+        renderItem={({ item }) => (
+          <View>
+            <TouchableOpacity
+              onPress={() => {
+                props.overviewItemClick && props.overviewItemClick(item)
+              }}
+            >
+              <View style={{ backgroundColor: props.theme.card.background, alignItems: 'center', justifyContent: 'space-between', flexDirection: 'row', }}>
+                <Text style={styles.overviewItemText}>{item.key}</Text>
+                <View style={{ flexDirection: 'row', justifyContent: 'center', alignItems: 'center' }}>
+                  <View style={{ flexDirection: 'row' }}>
+                    <Text style={[styles.overviewItemText, { color: props.theme.global.secondFontColor }]}>{item.value}</Text>
+                    <Text style={[styles.overviewItemText, { color: props.theme.global.secondFontColor }]}> kWh</Text>
+                  </View>
+                  <Image
+                    source={res.energy_consumption_right}
+                    style={{ width: cx(16), height: cx(16), marginLeft: cx(8) }}
+                  />
+                </View>
+              </View>
+            </TouchableOpacity>
+          </View>
+        )}
+        keyExtractor={(item) => item.key}
+        ItemSeparatorComponent={() => <Spacer height={cx(10)} />}
+        ListFooterComponent={() => <Spacer height={cx(30)} />}
+        ListEmptyComponent={() => (
+          <View style={styles.listEmptyContainer}>
+            <Image
+              style={styles.listEmptyImage}
+              source={res.energy_consumption_empty} />
+            <Spacer height={cx(10)} />
+            <View style={{ flexDirection: 'row', alignItems: 'center', marginBottom: cx(25) }}>
+              <Image style={styles.listEmptyTextIcon} source={res.co2Icon} />
+              <Spacer width={cx(4)} height={0} />
+              <Text style={styles.listEmptyText}>
+                {
+                  over365Days ?
+                    I18n.getLang('energyconsumption_Daylimit')
+                    :
+                    I18n.getLang('history_overview_empty_information_text')
+                }
+              </Text>
+            </View>
+          </View>
+        )}
+      />
+    </View>
+  )
+}
+
+export default withTheme(OverView)