@ledvance/ui-biz-bundle 1.1.87 → 1.1.89

package/src/modules/history/HistoryPage.tsx

@@ -1,249 +1,259 @@
 import Page from '@ledvance/base/src/components/Page'
-import {useDeviceInfo} from '@ledvance/base/src/models/modules/NativePropsSlice'
-import React, {useCallback, useEffect} from 'react'
-import I18n from '@ledvance/base/src/i18n'
-import {getSwitchHistoryData, SwitchHistoryUIItemData} from './SwitchHistoryPageActions'
+import { useDeviceInfo } from '@ledvance/base/src/models/modules/NativePropsSlice'
+import React, { useCallback, useEffect } from 'react'
+import I18n, { I18nKey } from '@ledvance/base/src/i18n'
+import { getSwitchHistoryData, SwitchHistoryUIItemData } from './SwitchHistoryPageActions'
 import res from '@ledvance/base/src/res'
-import {Utils} from 'tuya-panel-kit'
-import {useReactive} from 'ahooks'
-import {FlatList, Image, StyleSheet, Text, View} from 'react-native'
+import { Utils } from 'tuya-panel-kit'
+import { useReactive } from 'ahooks'
+import { FlatList, Image, StyleSheet, Text, View } from 'react-native'
 import Spacer from '@ledvance/base/src/components/Spacer'
-import {RouteProp, useRoute} from '@react-navigation/core'
 import { isEmpty } from 'lodash'
 import Tag from "@ledvance/base/src/components/Tag"
 import { exportHistoryFile } from '@ledvance/base/src/utils/common'
+import { useParams } from '@ledvance/base/src/hooks/Hooks'
 
 const cx = Utils.RatioUtils.convertX
 
-type SwitchHistoryPageRouteParams = {
-    params: { dpIds: string[], tags?: object, headlineText: string, backText?: string, stringOff?:string, stringOn?: string, showLimit?: boolean, actionKey?:string}
-}
-
-type Props = {
-    route: RouteProp<SwitchHistoryPageRouteParams, 'params'>
+export type SwitchHistoryPageRouteParams = {
+  dpIds: string[],
+  tags?: object,
+  headlineText?: string,
+  backText?: string,
+  showLimit?: boolean,
+  getActionsText: (dpData: any) => I18nKey
 }
 
 const SwitchHistoryPage = () => {
-    const deviceInfo = useDeviceInfo()
-    const { dpIds, tags ,headlineText, backText, stringOff, stringOn, actionKey, showLimit  } = useRoute<Props['route']>().params
+  const deviceInfo = useDeviceInfo()
+  const { dpIds, tags, headlineText, backText, showLimit, getActionsText } = useParams<SwitchHistoryPageRouteParams>()
 
-    const state = useReactive<SwitchHistoryPageState>({
-        refreshing: true,
-        refreshType: 'refresh',
-        onRefresh: Symbol(),
-        data: [],
-        dataOffset: 0,
-        hasNext: true,
-        filterTags: tags ? Object.keys(tags).reduce((pre, cur)=> {
-            pre[cur] = false
-            return pre
-        }, {}) : {}
-    })
+  const state = useReactive<SwitchHistoryPageState>({
+    refreshing: true,
+    refreshType: 'refresh',
+    onRefresh: Symbol(),
+    data: [],
+    dataOffset: 0,
+    hasNext: true,
+    filterTags: tags ? Object.keys(tags).reduce((pre, cur) => {
+      pre[cur] = false
+      return pre
+    }, {}) : {}
+  })
 
-    const loadData: (refreshType: RefreshType) => void = useCallback(async refreshType => {
-        state.refreshType = refreshType
-        if (state.refreshType === 'refresh') {
-            state.dataOffset = 0
-            state.onRefresh = Symbol()
-        } else if (state.hasNext) {
-            state.onRefresh = Symbol()
-        }
-    }, [])
+  const loadData: (refreshType: RefreshType) => void = useCallback(async refreshType => {
+    state.refreshType = refreshType
+    if (state.refreshType === 'refresh') {
+      state.dataOffset = 0
+      state.onRefresh = Symbol()
+    } else if (state.hasNext) {
+      state.onRefresh = Symbol()
+    }
+  }, [])
 
-    const changeFilter = useCallback((v:boolean, tag: string) =>{
-        state.filterTags = {
-            ...state.filterTags,
-            [tag]: v
-        }
-    }, [])
+  const changeFilter = useCallback((v: boolean, tag: string) => {
+    state.filterTags = {
+      ...state.filterTags,
+      [tag]: v
+    }
+  }, [])
 
-    const getRequestIds = useCallback(() =>{
-        const tagValue = Object.values(state.filterTags)
-        const isAllData = tagValue.every(tag => tag) || tagValue.every(tag => !tag)
-        const checkedTags = Object.keys(state.filterTags).reduce((pre:string[], cur) => {
-            if(state.filterTags[cur]) pre.push(cur)
-            return pre
-        }, [])
-        return isAllData ? dpIds : checkedTags
-    }, [state.filterTags])
+  const getRequestIds = useCallback(() => {
+    const tagValue = Object.values(state.filterTags)
+    const isAllData = tagValue.every(tag => tag) || tagValue.every(tag => !tag)
+    const checkedTags = Object.keys(state.filterTags).reduce((pre: string[], cur) => {
+      if (state.filterTags[cur]) pre.push(cur)
+      return pre
+    }, [])
+    return isAllData ? dpIds : checkedTags
+  }, [state.filterTags])
 
 
-    useEffect(() => {
-        getSwitchHistoryData(deviceInfo.devId, getRequestIds(), state.dataOffset,  100, stringOn, stringOff, actionKey, showLimit)
-            .then(res => {
-                state.refreshing = false
-                state.data = res.data
-                state.dataOffset = res.currentOffset
-                state.hasNext = res.hasNext
-            })
-    }, [state.onRefresh, state.filterTags])
+  useEffect(() => {
+    getSwitchHistoryData(deviceInfo.devId, getRequestIds(), state.dataOffset, getActionsText, 100, showLimit)
+      .then(res => {
+        state.refreshing = false
+        state.data = res.data
+        state.dataOffset = res.currentOffset
+        state.hasNext = res.hasNext
+      })
+  }, [state.onRefresh, state.filterTags])
 
-    const downFile = () => {
-      exportHistoryFile(state.data)
-    }
+  const downFile = () => {
+    exportHistoryFile(state.data)
+  }
 
-    return (
-        <Page
-            backText={backText || deviceInfo.name}
-            headlineText={headlineText || I18n.getLang('history_socket_headline_text')}
-            headlineIcon={res.download_icon}
-            onHeadlineIconClick={downFile}
-            >
-            <View style={styles.content}>
-                <Text style={styles.titleText}>{I18n.getLang('history_contact_sensor_description_text')}</Text>
-                <Spacer/>
-                {!isEmpty(state.filterTags) && !!state.data.length &&
-                    <View style={{
-                        display: 'flex',
-                        flexDirection: 'row',
-                        flexWrap: 'wrap',
-                        marginHorizontal: cx(24),
-                        marginBottom: cx(12),
-                        alignSelf: 'flex-start'
-                    }}>
-                        {
-                            Object.keys(state.filterTags)?.map((tag) => {
-                                return <Tag
-                                    key={tag}
-                                    text={tags && tags[tag]}
-                                    checked={state.filterTags[tag]}
-                                    onCheckedChange={(v) => changeFilter(v, tag)}
-                                    style={{ marginTop: cx(5), marginHorizontal: cx(5) }}
-                                />
-                            })
-                        }
-                    </View>
-                }
-                <FlatList
-                    data={state.data}
-                    style={styles.list}
-                    renderItem={({item}) => <SwitchHistoryItem {...{itemData :item, tags}}/>}
-                    keyExtractor={(_, index) => `${index}`}
-                    ListFooterComponent={<Spacer/>}
-                    ListEmptyComponent={(
-                        <View style={styles.listEmptyView}>
-                            <Spacer height={cx(26)}/>
-                            <Image
-                                style={styles.listEmptyImage}
-                                source={{uri: res.ldv_timer_empty}}/>
-                            <Spacer height={cx(14)}/>
-                            <View style={{flexDirection: 'row', alignItems: 'center'}}>
-                                <Image style={styles.listEmptyTextIcon} source={res.ic_info}/>
-                                <Spacer width={cx(4)} height={0}/>
-                                <Text style={styles.listEmptyText}>{I18n.getLang('history_overview_empty_information_text')}</Text>
-                            </View>
-                        </View>
-                    )}
-                    refreshing={state.refreshing}
-                    onEndReachedThreshold={.1}
-                    onRefresh={async () => {
-                        await loadData('refresh')
-                    }}
-                    onEndReached={async () => {
-                        await loadData('loadMore')
-                    }}/>
+  return (
+    <Page
+      backText={backText || deviceInfo.name}
+      headlineText={headlineText || I18n.getLang('history_socket_headline_text')}
+      headlineIcon={res.download_icon}
+      onHeadlineIconClick={downFile}
+    >
+      <View style={styles.content}>
+        <Text style={styles.titleText}>{I18n.getLang('history_contact_sensor_description_text')}</Text>
+        <Spacer />
+        {!isEmpty(state.filterTags) && !!state.data.length &&
+          <View style={{
+            display: 'flex',
+            flexDirection: 'row',
+            flexWrap: 'wrap',
+            marginHorizontal: cx(24),
+            marginBottom: cx(12),
+            alignSelf: 'flex-start'
+          }}>
+            {
+              Object.keys(state.filterTags)?.map((tag) => {
+                return <Tag
+                  key={tag}
+                  text={tags && tags[tag]}
+                  checked={state.filterTags[tag]}
+                  onCheckedChange={(v) => changeFilter(v, tag)}
+                  style={{ marginTop: cx(5), marginHorizontal: cx(5) }}
+                />
+              })
+            }
+          </View>
+        }
+        <FlatList
+          data={state.data}
+          style={styles.list}
+          renderItem={({ item }) => <SwitchHistoryItem {...{ itemData: item, tags }} />}
+          keyExtractor={(_, index) => `${index}`}
+          ListFooterComponent={<Spacer />}
+          ListEmptyComponent={(
+            <View style={styles.listEmptyView}>
+              <Spacer height={cx(26)} />
+              <Image
+                style={styles.listEmptyImage}
+                source={{ uri: res.ldv_timer_empty }} />
+              <Spacer height={cx(14)} />
+              <View style={{ flexDirection: 'row', alignItems: 'center' }}>
+                <Image style={styles.listEmptyTextIcon} source={res.ic_info} />
+                <Spacer width={cx(4)} height={0} />
+                <Text style={styles.listEmptyText}>{I18n.getLang('history_overview_empty_information_text')}</Text>
+              </View>
             </View>
-        </Page>
-    )
+          )}
+          refreshing={state.refreshing}
+          onEndReachedThreshold={.1}
+          onRefresh={async () => {
+            await loadData('refresh')
+          }}
+          onEndReached={async () => {
+            await loadData('loadMore')
+          }} />
+      </View>
+    </Page>
+  )
 }
 
 interface SwitchHistoryItemBean {
-    itemData: SwitchHistoryUIItemData
-    tags?: object
+  itemData: SwitchHistoryUIItemData
+  tags?: object
 }
 
-const SwitchHistoryItem = (props: SwitchHistoryItemBean)  => {
-    const { itemData, tags} = props
-    return (
-        <View style={styles.switchHistoryItem}>
-            <Text style={styles.switchHistoryItemTitle}>{itemData.title}</Text>
-            <Spacer height={cx(10)}/>
-            {itemData.actions.map((actionData, index) => (
-                <View style={styles.switchHistoryItemActionItem} key={`${index}`}>
-                    <View style={styles.switchHistoryItemActionItemLineGroup}>
-                        <View style={styles.switchHistoryItemActionItemLine}/>
-                        <View style={styles.switchHistoryItemActionItemPoint}/>
-                        <View style={styles.switchHistoryItemActionItemLine}/>
-                    </View>
-                    <Spacer width={cx(20)} height={0}/>
-                    <Text style={styles.switchHistoryItemActionItemText}>{`${actionData.time}`}</Text>
-                    <Spacer width={cx(20)} height={0}/>
-                    <Text style={styles.switchHistoryItemActionItemText}>{`${actionData.action}`}</Text>
-                    {!!tags && <View style={styles.switchHistoryItemTag}><Text >{tags[actionData.dpId]}</Text></View>}
-                </View>
-            ))}
-            <Spacer/>
+const SwitchHistoryItem = (props: SwitchHistoryItemBean) => {
+  const { itemData, tags } = props
+  return (
+    <View style={styles.switchHistoryItem}>
+      <Text style={styles.switchHistoryItemTitle}>{itemData.title}</Text>
+      <Spacer height={cx(10)} />
+      {itemData.actions.map((actionData, index) => (
+        <View style={styles.switchHistoryItemActionItem} key={`${index}`}>
+          <View style={styles.switchHistoryItemActionItemLineGroup}>
+            <View style={styles.switchHistoryItemActionItemLine} />
+            <View style={styles.switchHistoryItemActionItemPoint} />
+          </View>
+          <Spacer width={cx(15)} height={0} />
+          <Text style={styles.switchHistoryItemActionItemText}>{`${actionData.time}`}</Text>
+          <Spacer width={cx(10)} height={0} />
+          <View style={{ flex: 1, display: 'flex', flexDirection: 'row', flexWrap: 'wrap',alignItems: 'baseline'
+           }}>
+            <Text style={styles.switchHistoryItemActionItemText}>{`${actionData.action}`}</Text>
+            {!!tags && <View style={styles.switchHistoryItemTag}><Text style={{ fontSize: cx(14), color: '#000' }}>{tags[actionData.dpId]}</Text></View>}
+          </View>
         </View>
-    )
+      ))}
+      <Spacer />
+    </View>
+  )
 }
 
 const styles = StyleSheet.create({
-    content: {
-        flex: 1,
-    },
-    list: {
-        flex: 1,
-    },
-    listEmptyView: {
-        alignItems: 'center',
-    },
-    listEmptyImage: {
-        width: cx(200),
-        height: cx(200),
-    },
-    listEmptyTextIcon: {
-        width: cx(16),
-        height: cx(16),
-        tintColor: '#000',
-    },
-    listEmptyText: {
-        color: '#000',
-        fontSize: cx(12),
-        fontFamily: 'helvetica_neue_lt_std_roman',
-    },
-    titleText: {
-        marginHorizontal: cx(24),
-        color: '#000',
-        fontSize: cx(16),
-        fontFamily: 'helvetica_neue_lt_std_roman',
-    },
-    switchHistoryItem: {
-        marginHorizontal: cx(24),
-    },
-    switchHistoryItemTitle: {
-        color: '#000',
-        fontSize: cx(18),
-        fontFamily: 'helvetica_neue_lt_std_bd',
-    },
-    switchHistoryItemActionItem: {
-        flexDirection: 'row',
-        alignItems: 'center',
-    },
-    switchHistoryItemActionItemLineGroup: {
-        alignItems: 'center',
-    },
-    switchHistoryItemActionItemLine: {
-        width: cx(1),
-        height: cx(11.5),
-        backgroundColor: '#E6E7E8',
-    },
-    switchHistoryItemActionItemPoint: {
-        width: cx(7),
-        height: cx(7),
-        backgroundColor: '#f60',
-        borderRadius: cx(4),
-    },
-    switchHistoryItemActionItemText: {
-        color: '#000',
-        fontSize: cx(16),
-        fontFamily: 'helvetica_neue_lt_std_roman',
-    },
-    switchHistoryItemTag:{
-        paddingHorizontal: cx(10),
-        borderRadius: cx(10),
-        backgroundColor: '#cbcbcb',
-        marginLeft: cx(5)
-    }
+  content: {
+    flex: 1,
+  },
+  list: {
+    flex: 1,
+  },
+  listEmptyView: {
+    alignItems: 'center',
+  },
+  listEmptyImage: {
+    width: cx(200),
+    height: cx(200),
+  },
+  listEmptyTextIcon: {
+    width: cx(16),
+    height: cx(16),
+    tintColor: '#000',
+  },
+  listEmptyText: {
+    color: '#000',
+    fontSize: cx(12),
+    fontFamily: 'helvetica_neue_lt_std_roman',
+  },
+  titleText: {
+    marginHorizontal: cx(24),
+    color: '#000',
+    fontSize: cx(16),
+    fontFamily: 'helvetica_neue_lt_std_roman',
+  },
+  switchHistoryItem: {
+    marginHorizontal: cx(24),
+  },
+  switchHistoryItemTitle: {
+    color: '#000',
+    fontSize: cx(18),
+    fontFamily: 'helvetica_neue_lt_std_bd',
+  },
+  switchHistoryItemActionItem: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    flex: 1
+  },
+  switchHistoryItemActionItemLineGroup: {
+    width: cx(7),
+    minHeight: cx(30),
+    height: '100%',
+    alignItems: 'center',
+  },
+  switchHistoryItemActionItemLine: {
+    width: cx(1),
+    flex: 1,
+    backgroundColor: '#E6E7E8',
+  },
+  switchHistoryItemActionItemPoint: {
+    width: cx(7),
+    height: cx(7),
+    backgroundColor: '#f60',
+    borderRadius: cx(4),
+    position: 'absolute',
+    top: '50%',
+    transform: [{ translateY: cx(-3) }]
+  },
+  switchHistoryItemActionItemText: {
+    color: '#000',
+    fontSize: cx(16),
+    fontFamily: 'helvetica_neue_lt_std_roman',
+  },
+  switchHistoryItemTag: {
+    paddingHorizontal: cx(10),
+    borderRadius: cx(10),
+    backgroundColor: '#cbcbcb',
+    marginLeft: cx(5),
+  }
 })
 
 export default SwitchHistoryPage
@@ -252,11 +262,11 @@ type RefreshType = 'refresh' | 'loadMore'
 
 
 interface SwitchHistoryPageState {
-    refreshing: boolean
-    refreshType: RefreshType
-    onRefresh: symbol
-    data: SwitchHistoryUIItemData[]
-    hasNext: boolean
-    dataOffset: number
-    filterTags: object
+  refreshing: boolean
+  refreshType: RefreshType
+  onRefresh: symbol
+  data: SwitchHistoryUIItemData[]
+  hasNext: boolean
+  dataOffset: number
+  filterTags: object
 }

package/src/modules/history/SwitchHistoryPageActions.ts

@@ -1,7 +1,7 @@
 import { getDpReportSataData, PagingResult } from '@ledvance/base/src/models/TuyaApi'
 import { cloneDeep, groupBy, isEqual, uniqWith } from 'lodash'
 import dayjs from 'dayjs'
-import I18n from '@ledvance/base/src/i18n'
+import I18n, { I18nKey } from '@ledvance/base/src/i18n'
 import duration from 'dayjs/plugin/duration'
 dayjs.extend(duration)
 export interface SwitchHistoryUIItemData {
@@ -39,9 +39,9 @@ const formateLimitTime = (time: number) =>{
     // return ` ${hours > 0 ? hours + 'h' : ''} ${(minutes > 0 || hours > 0) ? minutes + 'min' : ''} ${seconds}sec`
 }
 
-type getSwitchHistoryDataFunType = (deviceId: string, dpIds: string[], offset: number, limit?: number, stringOn?:string, stringOff?:string, actionKey?:string, showLimit?:boolean) => Promise<PagingResult<SwitchHistoryUIItemData[]>>
+type getSwitchHistoryDataFunType = (deviceId: string, dpIds: string[], offset: number, getActionsText: (dpData: any) => I18nKey, limit?: number, showLimit?:boolean) => Promise<PagingResult<SwitchHistoryUIItemData[]>>
 
-export const getSwitchHistoryData: getSwitchHistoryDataFunType = async (deviceId: string, dpIds: string[], offset: number, limit: number = 100, stringOn, stringOff, actionKey, showLimit) => {
+export const getSwitchHistoryData: getSwitchHistoryDataFunType = async (deviceId: string, dpIds: string[], offset: number, getActionsText, limit: number = 100, showLimit) => {
     const res = await getDpReportSataData(deviceId, dpIds, 0, offset + limit)
     const uniqData = uniqWith(res.dps, isEqual)
     const reverseData = cloneDeep(uniqData).reverse()
@@ -51,13 +51,13 @@ export const getSwitchHistoryData: getSwitchHistoryDataFunType = async (deviceId
             limitTime: reverseData[idx + 1] ? formateLimitTime(reverseData[idx + 1].timeStamp - item.timeStamp) : ''
         }
     })
-    const key = actionKey || 'true'
     const dateActionsMap = groupBy(limitTimeData.reverse().map(dpData => {
+        const key = getActionsText(dpData)
         const dayjsDate = dayjs(dpData.timeStr)
         return {
             date: `${dayjsDate.format('DD/MM/YYYY')} (${weekList[dayjsDate.format('ddd')]})`,
             time: dayjsDate.format('HH:mm:ss'),
-            action: I18n.formatValue(dpData.value === key ? (stringOn || 'history_powerstrip_field1_text') : (stringOff || 'history_powerstrip_field1_text2'), '', showLimit ? dpData.limitTime : ''),
+            action: I18n.formatValue(key, '', showLimit ? dpData.limitTime : ''),
             dpId: dpData.dpId,
         }
     }), 'date')

package/src/modules/timer/TimerPage.tsx

@@ -229,7 +229,7 @@ const TimerPage = (props: {theme?: any}) => {
                   <Text style={styles.itemTitle}>{I18n.getLang('timeschedule_add_schedule_subheadline_text')}</Text>
                   <View
                       style={{
-                        backgroundColor: props.theme.card.board,
+                        backgroundColor: props.theme.card.border,
                         borderRadius: 4,
                         minHeight: cx(50),
                         flex: 1,
@@ -267,7 +267,7 @@ const TimerPage = (props: {theme?: any}) => {
                   text={I18n.getLang('timer_sockets_button_text')}
                   onPress={onStartPress}
                   textStyle={{ fontSize: cx(14) }}
-                  style={{ backgroundColor: !state.selectedSkill.length ? props.theme.button.disabled : props.theme.button.active }}
+                  style={{ backgroundColor: !state.selectedSkill.length ? props.theme.button.disabled : props.theme.button.primary }}
               />
               <Spacer />
           </>}

package/src/modules/timer/TimerPageAction.ts

@@ -137,7 +137,7 @@ export function timeFormatToRealTime(mCountdown: number) {
   return `${after.getHours()}:${after.getMinutes().toString().padStart(2, '0')}`
 }
 
-export function timeFormat(time: number): string {
+export function timeFormat(time: number, hideUnit?: boolean): string {
   let hour = Math.trunc(time / 3600)
   const beforeMin = (time % 3600) / 60
   let min = Math.ceil(beforeMin)
@@ -145,5 +145,5 @@ export function timeFormat(time: number): string {
     hour += 1
     min = 0
   }
-  return `${hour > 0 ? `${hour} h ` : ''}${min > 0 ? `${min}` : ''}`
+  return `${hour > 0 ? `${hour} h ` : ''}${min > 0 ? `${min} ${hideUnit ? '' : 'min'}` : ''}`
 }

package/src/newModules/biorhythm/BiorhythmEditPage.tsx

@@ -96,7 +96,7 @@ const BiorhythmEditPage = () => {
 
   const canSaveMoodData = useMemo(() =>{
     return state.planData.name.length > 0 && state.planData.name.length < 33 && !nameRepeatFlag && !checkBiorhythmDataChanged && !minimumTipEnable()
-  }, [nameRepeatFlag, state.planData.name, checkBiorhythmDataChanged])
+  }, [nameRepeatFlag, state.planData.name, checkBiorhythmDataChanged, minimumTipEnable()])
 
   return (
     <Page

package/src/newModules/biorhythm/BiorhythmPage.tsx

@@ -262,7 +262,7 @@ const BiorhythmPage = () => {
         backText={deviceInfo.name}
         onBackClick={navigation.goBack}
         headlineText={I18n.getLang('add_new_trigger_time_system_back_text')}
-        headlineContent={<Switch
+        headlineIconContent={<Switch
           value={state.enable}
           thumbColor={'#f60'}
           trackColor={{ false: '#00000026', true: '#ff660036' }}