@ledvance/group-ui-biz-bundle 1.0.150 → 1.0.151

package/package.json

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

package/src/modules/biorhythm/BiorhythmActions.ts

@@ -1,3 +1,6 @@
+import { xLog } from '@ledvance/base/src/utils'
+import { cloneDeep } from 'lodash'
+import { AsyncStorage } from 'react-native'
 import {
   BiorhythmBean,
   BiorhythmGradientType,
@@ -11,8 +14,9 @@ import {hex2Int, spliceByStep} from '@ledvance/base/src/utils/common'
 import I18n from '@ledvance/base/src/i18n'
 import res from '@ledvance/base/src/res'
 import { to16 } from '@tuya/tuya-panel-lamp-sdk/lib/utils'
-import { useCallback } from 'react'
+import { useCallback, useEffect, useState } from 'react'
 import { Result } from '@ledvance/base/src/models/modules/Result'
+import iconList from './iconListData'
 
 interface BiorhythmConfig {
   rhythm_mode: BiorhythmBean
@@ -179,6 +183,7 @@ function getRepeatPeriodTitleByIndex(index: number): string {
   let title = ''
   switch (index) {
     case 0:
+    case 7:
       title = I18n.getLang('bio_ryhthm_default_weekday7_text')
       break
     case 1:
@@ -231,3 +236,104 @@ function obj2Dp(obj: BiorhythmBean): string {
     .join('')
   return versionHex + enableHex + gradientHex + repeatPeriodHex + planCountHex + planListHex
 }
+
+export const replaceImg = (img) => {
+  const item = iconList?.find(val => val.id === Number(img))
+  switch (img) {
+    case 'rhythm_icon1':
+    case '31':
+      return { icon: res.biorhythom_icon1, iconId: 1 }
+    case 'rhythm_icon2':
+    case '33':
+      return { icon: res.biorhythom_icon5, iconId: 5 }
+    case 'rhythm_icon3':
+    case '35':
+      return { icon: res.biorhythom_icon2, iconId: 2 }
+    case 'rhythm_icon4':
+    case '32':
+      return { icon: res.biorhythom_icon9, iconId: 9 }
+    case 'rhythm_icon12':
+    case '39':
+      return { icon: res.biorhythom_icon3, iconId: 3 }
+    default:
+      return { icon: item?.icon, iconId: item?.id }
+  }
+}
+
+export function useStorageBiorhythm(): [[], (key, enable: boolean, gradient: BiorhythmGradientType, repeatPeriod: Period[], planList: Plan[]) => void, (key) => void, (key) => {
+  repeatPeriod: Period[];
+  planList: Plan[];
+  enable: boolean;
+  gradient: BiorhythmGradientType
+}] {
+  const [storageBiorhythms, setStorageBiorhythms] = useState([])
+  useEffect(() => {
+    AsyncStorage.getItem('BIORHYTHM_STORAGE').then(res => {
+      if (res) {
+        const storageBiorhythms = JSON.parse(res)
+        setStorageBiorhythms(storageBiorhythms)
+        xLog('AsyncStorage getBiorhythm', storageBiorhythms)
+      }
+    })
+  }, [])
+
+  const saveBiorhythm = useCallback((key, enable: boolean, gradient: BiorhythmGradientType, repeatPeriod: Period[], planList: Plan[]) => {
+    const newPlanList = planList?.map(item => {
+      return { ...item, icon: `${item.icon}` }
+    }).sort((a, b) => a.time - b.time)
+    const weeks = repeatPeriod.map(item => item.enabled ? 1 : 0)
+    const sun = weeks.splice(6, 1)[0]
+    weeks.unshift(sun)
+    weeks.push(0)
+    const biorhythm = cloneDeep({
+      key: key,
+      enable: enable,
+      weeks: weeks,
+      gradient: gradient,
+      planList: newPlanList,
+    })
+    const newStorageBiorhythms = storageBiorhythms.filter(item => item.key !== key)
+    newStorageBiorhythms.unshift(biorhythm)
+    setStorageBiorhythms(newStorageBiorhythms)
+    xLog('AsyncStorage saveBiorhythm', newStorageBiorhythms)
+    AsyncStorage.setItem('BIORHYTHM_STORAGE', JSON.stringify(newStorageBiorhythms), (error) => {
+      xLog('AsyncStorage saveBiorhythm error', error)
+    }).then()
+  }, [storageBiorhythms])
+
+  const removeBiorhythm = useCallback((key) => {
+    const newStorageBiorhythms = storageBiorhythms.filter(item => item.key !== key)
+    setStorageBiorhythms(newStorageBiorhythms)
+    AsyncStorage.setItem('BIORHYTHM_STORAGE', JSON.stringify(newStorageBiorhythms)).then(res => {
+      xLog('AsyncStorage removeBiorhythm res', res)
+    })
+  }, [storageBiorhythms])
+
+  const applyBiorhythm = useCallback((key) => {
+    const newBiorhythm = storageBiorhythms.find(item => item.key === key)
+    const planList = newBiorhythm.planList?.map((it, index) => {
+      return {
+        ...it,
+        id: it.id ?? index,
+        icon: replaceImg(it?.iconId || it?.icon)?.icon,
+        iconId: replaceImg(it?.iconId || it?.icon)?.iconId,
+      }
+    })
+    const repeatPeriod = newBiorhythm.weeks.slice(0, 7).map((it, index) => {
+      const idx = index === 0 ? 7 : index
+      return {
+        index: idx,
+        title: getRepeatPeriodTitleByIndex(idx),
+        enabled: it,
+      }
+    })
+    repeatPeriod.sort((a, b) => a.index - b.index)
+    return {
+      repeatPeriod: repeatPeriod,
+      planList: planList,
+      enable: newBiorhythm.enable,
+      gradient: newBiorhythm.gradient,
+    }
+  }, [storageBiorhythms])
+  return [storageBiorhythms, saveBiorhythm, removeBiorhythm, applyBiorhythm]
+}

package/src/modules/biorhythm/BiorhythmPage.tsx

@@ -1,4 +1,5 @@
-import React, { useCallback, useEffect, useMemo } from 'react'
+import { xLog } from '@ledvance/base/src/utils'
+import React, { useCallback, useEffect, useMemo, useState } from 'react'
 import { FlatList, Image, Linking, ScrollView, Switch, Text, TouchableOpacity, View } from 'react-native'
 import { useNavigation } from '@react-navigation/native'
 import { useDebounceFn, useReactive, useUpdateEffect } from 'ahooks'
@@ -23,8 +24,11 @@ import res from '@ledvance/base/src/res'
 import { ui_biz_routerKey } from '../../navigation/Routers'
 import { cctToColor } from '@ledvance/base/src/utils/cctUtils'
 import { BiorhythmEditPageParams } from './BiorhythmDetailPage'
-import { useBiorhythm } from './BiorhythmActions'
-import { convertMinutesTo12HourFormat, showDialog as showCommonDialog, showDialog } from '@ledvance/base/src/utils/common'
+import { replaceImg, useBiorhythm, useStorageBiorhythm } from './BiorhythmActions'
+import {
+  convertMinutesTo12HourFormat,
+  showDialog
+} from '@ledvance/base/src/utils/common'
 import { useParams } from '@ledvance/base/src/hooks/Hooks'
 import Page from '@ledvance/base/src/components/Page'
 import Spacer from '@ledvance/base/src/components/Spacer'
@@ -63,6 +67,8 @@ const BiorhythmPage = (props: { theme?: ThemeType }) => {
   const is24Hour = useSystemTimeFormate()
   const { productId } = deviceInfo
   const devicesJudge = pIdList.some(val => val === productId)
+  const [storageBiorhythms, saveStorageBiorhythms, removeStorageBiorhythm, applyStorageBiorhythm] = useStorageBiorhythm()
+  const [biorhythmListVisible, setBiorhythmListVisible] = useState(false)
 
   const state = useReactive<UIState>({
     ...cloneDeep(biorhythm),
@@ -144,29 +150,6 @@ const BiorhythmPage = (props: { theme?: ThemeType }) => {
     run()
   }, [state.flag])
 
-  const replaceImg = (img) => {
-    const item = iconList?.find(val => val.id === Number(img))
-    switch (img) {
-      case 'rhythm_icon1':
-      case '31':
-        return { icon: res.biorhythom_icon1, iconId: 1 }
-      case 'rhythm_icon2':
-      case '33':
-        return { icon: res.biorhythom_icon5, iconId: 5 }
-      case 'rhythm_icon3':
-      case '35':
-        return { icon: res.biorhythom_icon2, iconId: 2 }
-      case 'rhythm_icon4':
-      case '32':
-        return { icon: res.biorhythom_icon9, iconId: 9 }
-      case 'rhythm_icon12':
-      case '39':
-        return { icon: res.biorhythom_icon3, iconId: 3 }
-      default:
-        return { icon: item?.icon, iconId: item?.id }
-    }
-  }
-
   useUpdateEffect(() => {
     console.log('Redux 生物节律数据更新', biorhythm)
     const cloneBiorhym = cloneDeep(biorhythm)
@@ -262,6 +245,26 @@ const BiorhythmPage = (props: { theme?: ThemeType }) => {
     <Page
       backText={uaGroupInfo.name}
       onBackClick={navigation.goBack}
+      headlineTopContent={<View style={{ flexDirection: 'row', width: '100%', justifyContent: 'space-between' }}>
+        <DeleteButton style={{flex: 1}} text={I18n.getLang('biorhythm_save_as')} onPress={() => {
+          Dialog.prompt({
+            title: I18n.getLang('biorhythm_save_title'),
+            placeholder: I18n.getLang('biorhythm_save_placeholder'),
+            defaultValue: `${uaGroupInfo.name}`,
+            cancelText: I18n.getLang('auto_scan_system_cancel'),
+            confirmText: I18n.getLang('auto_scan_system_wifi_confirm'),
+            inputWrapperStyle: {backgroundColor: props.theme?.textInput.background, borderRadius: cx(10)},
+            autoFocus: true,
+            onConfirm: (data, { close }) => {
+              saveStorageBiorhythms(data, state.enable, state.gradient, state.repeatPeriod, state.planList)
+              close()
+            }
+          })
+        }} />
+        <DeleteButton style={{flex: 1}} text={I18n.getLang('biorhythm_load')} onPress={() => {
+          setBiorhythmListVisible(true)
+        }} />
+      </View>}
       headlineText={I18n.getLang('add_new_trigger_time_system_back_text')}
       headlineIconContent={<Switch
         value={state.enable}
@@ -626,7 +629,7 @@ const BiorhythmPage = (props: { theme?: ThemeType }) => {
                     <DeleteButton
                       text={I18n.getLang('bio_ryhthm_default_button_reset_text')}
                       onPress={() => {
-                        showCommonDialog({
+                        showDialog({
                           method: 'confirm',
                           title: I18n.getLang('bio_ryhthm_reset_description_text'),
                           onConfirm: (_, { close }) => {
@@ -691,6 +694,54 @@ const BiorhythmPage = (props: { theme?: ThemeType }) => {
             state.flag = Symbol()
           }}
         />
+        <Modal visible={biorhythmListVisible} onMaskPress={() => {setBiorhythmListVisible(false)}}>
+          <View style={{ height: cx(300), padding: cx(16), backgroundColor: props.theme?.card.background }}>
+            {
+              storageBiorhythms.length === 0 ? (
+                <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
+                  <InfoText
+                    textStyle={{ flex: undefined }}
+                    icon={res.ic_info}
+                    text={I18n.getLang('energyconsumption_emptydata')}
+                  />
+                </View>
+              ) : (
+                <FlatList
+                  data={storageBiorhythms}
+                  renderItem={({ item }) => {
+                    return <View style={{ padding: cx(5), flexDirection: 'row' }}>
+                      <Text style={{ flex: 1, color: props.theme?.global.fontColor }}>{item.key}</Text>
+                      <TouchableOpacity style={{width: cx(24), height: cx(24), marginRight: cx(20)}} onPress={() => {
+                        showDialog({
+                          method: 'confirm',
+                          title: I18n.getLang('biorhythm_delete_tips'),
+                          onConfirm: (_, { close }) => {
+                            removeStorageBiorhythm(item.key)
+                            close()
+                          }
+                        })
+                      }}>
+                        <Image source={{ uri: res.delete}} style={{width: cx(24), height: cx(24), tintColor: props.theme?.global.warning}} />
+                      </TouchableOpacity>
+                      <TouchableOpacity style={{width: cx(24), height: cx(24), marginRight: cx(10)}} onPress={() => {
+                        const newBiorhythm = applyStorageBiorhythm(item.key)
+                        state.enable = newBiorhythm.enable
+                        state.gradient = newBiorhythm.gradient
+                        state.repeatPeriod = newBiorhythm.repeatPeriod
+                        state.planList = newBiorhythm.planList
+                        run()
+                        setBiorhythmListVisible(false)
+                      }}>
+                        <Image source={{ uri:res.ic_checked}} style={{width: cx(24), height: cx(24), tintColor: props.theme?.icon.normal}} />
+                      </TouchableOpacity>
+                    </View>
+                  }}
+                  keyExtractor={(item) => `${item.key}`}
+                />
+              )
+            }
+          </View>
+        </Modal>
       </>
     </Page>
   )