@ledvance/ui-biz-bundle 1.1.89 → 1.1.91

package/src/newModules/swithInching/SwithInching.tsx

@@ -4,7 +4,7 @@ import Page from "@ledvance/base/src/components/Page";
 import { useDeviceInfo } from "@ledvance/base/src/models/modules/NativePropsSlice";
 import { useNavigation } from '@react-navigation/native'
 import { SwitchButton, Utils, Dialog } from "tuya-panel-kit";
-import LdvPickerView from "./pickerView";
+import LdvPickerView from "@ledvance/base/src/components/ldvPickerView";
 import I18n from '@ledvance/base/src/i18n'
 import { useReactive, useUpdateEffect } from "ahooks";
 import {SwitchInchingPageParams, useCountdown1, useSwitchInching} from "./SwithInchingAction";
@@ -13,123 +13,175 @@ import {useFixedTime} from "../fixedTime/FixedTimeActions";
 import {useParams} from "@ledvance/base/src/hooks/Hooks";
 
 const { convertX: cx } = Utils.RatioUtils
+const { withTheme } = Utils.ThemeUtils
 
 interface SwitchInchingState {
-    enable: boolean,
-    minute: string,
-    second: string,
-    flag: Symbol | number
+  enable: boolean,
+  minute: string,
+  second: string,
+  flag: Symbol | number
 }
 
-const SwitchInching = () => {
-    const params = useParams<SwitchInchingPageParams>()
-    const deviceInfo = useDeviceInfo()
-    const navigation = useNavigation()
-    const [switchInching, setSwitchInching] = useSwitchInching(params.switchInchingCode)
-    const [randomTimePlan, setRandomTimePlan] = useRandomTime(params.randomTimeCode, true)
-    const [fixedTimePlan, setFixedTimePlan] = useFixedTime(params.cycleTimeCode, true)
-    const [countdown1, setCountDown1] = useCountdown1(params.countdownCode)
-    const randomEnable = randomTimePlan.some(item => item.enable)
-    const fixedEnable = fixedTimePlan.some(item => item.enable)
-    const timerEnable = !!countdown1
-    const state = useReactive<SwitchInchingState>({
-        enable: false,
-        minute: '00',
-        second: '00',
-        flag: 1
-    })
+const SwitchInching = (props: { theme?: any }) => {
+  const params = useParams<SwitchInchingPageParams>()
+  const deviceInfo = useDeviceInfo()
+  const navigation = useNavigation()
+  const [switchInching, setSwitchInching] = useSwitchInching(params.switchInchingCode)
+  const [randomTimePlan, setRandomTimePlan] = useRandomTime(params.randomTimeCode, true)
+  const [fixedTimePlan, setFixedTimePlan] = useFixedTime(params.cycleTimeCode, true)
+  const [countdown1, setCountDown1] = useCountdown1(params.countdownCode)
+  const randomEnable = randomTimePlan.some(item => item.enable)
+  const fixedEnable = fixedTimePlan.some(item => item.enable)
+  const timerEnable = !!countdown1
+  const state = useReactive<SwitchInchingState>({
+    enable: false,
+    minute: '00',
+    second: '00',
+    flag: 1
+  })
 
-    useEffect(() => {
-        state.enable = switchInching.enable
-        state.minute = formateValue('minute')
-        state.second = formateValue('second')
-    }, [JSON.stringify(switchInching)])
+  useEffect(() => {
+    state.enable = switchInching.enable
+    state.minute = formateValue('minute')
+    state.second = formateValue('second')
+  }, [JSON.stringify(switchInching)])
 
-    const showDialog = (run: () => void) => {
-        Dialog.confirm({
-            title: I18n.getLang('conflict_dialog_save_item_inching_titel'),
-            subTitle: I18n.getLang('conflict_dialog_save_item_inching_description'),
-            cancelText: I18n.getLang('conflict_dialog_save_item_inching_answer_no_text'),
-            confirmText: I18n.getLang('conflict_dialog_save_item_inching_answer_yes_text'),
-            onConfirm: (_, { close }) => {
-                close();
-                setSwitchInching({ ...switchInching, enable: false })
-                TurnOffFn()
-                run()
-            },
-        })
-    }
+  const showDialog = (run: () => void) => {
+    Dialog.confirm({
+      title: I18n.getLang('conflict_dialog_save_item_inching_titel'),
+      subTitle: I18n.getLang('conflict_dialog_save_item_inching_description'),
+      cancelText: I18n.getLang('conflict_dialog_save_item_inching_answer_no_text'),
+      confirmText: I18n.getLang('conflict_dialog_save_item_inching_answer_yes_text'),
+      onConfirm: (_, { close }) => {
+        close();
+        setSwitchInching({ ...switchInching, enable: false })
+        TurnOffFn()
+        run()
+      },
+    })
+  }
 
-    const TurnOffFn = () => {
-        if (randomEnable) {
-            const randomTimeList = randomTimePlan.map(item => {
-                if (item.enable) {
-                    return {
-                        ...item,
-                        enable: false
-                    }
-                } else {
-                    return item
-                }
-            })
-            setRandomTimePlan(randomTimeList)
-        }
-        if (fixedEnable) {
-            const fixedTimeList = fixedTimePlan.map(item => {
-                if (item.enable) {
-                    return {
-                        ...item,
-                        enable: false
-                    }
-                } else {
-                    return item
-                }
-            })
-            setFixedTimePlan(fixedTimeList)
+  const TurnOffFn = () => {
+    if (randomEnable) {
+      const randomTimeList = randomTimePlan.map(item => {
+        if (item.enable) {
+          return {
+            ...item,
+            enable: false
+          }
+        } else {
+          return item
         }
-        if (timerEnable) {
-            setCountDown1(0)
+      })
+      setRandomTimePlan(randomTimeList)
+    }
+    if (fixedEnable) {
+      const fixedTimeList = fixedTimePlan.map(item => {
+        if (item.enable) {
+          return {
+            ...item,
+            enable: false
+          }
+        } else {
+          return item
         }
+      })
+      setFixedTimePlan(fixedTimeList)
+    }
+    if (timerEnable) {
+      setCountDown1(0)
     }
+  }
 
 
-    const requestSwitchInching = () => {
-        const run = () => {
-            const enable = state.enable
-            const time = Number(state.minute) * 60 + Number(state.second)
-            setSwitchInching({ enable, time })
-        }
-        if (state.enable && (randomEnable || fixedEnable || timerEnable)) {
-            return showDialog(run)
-        }
-        run()
+  const requestSwitchInching = () => {
+    const run = () => {
+      const enable = state.enable
+      const time = Number(state.minute) * 60 + Number(state.second)
+      setSwitchInching({ enable, time })
+    }
+    if (state.enable && (randomEnable || fixedEnable || timerEnable)) {
+      return showDialog(run)
     }
+    run()
+  }
 
-    useEffect(() => {
-        if (state.flag !== 1) {
-            requestSwitchInching()
-        }
-    }, [state.flag])
+  useEffect(() => {
+    if (state.flag !== 1) {
+      requestSwitchInching()
+    }
+  }, [state.flag])
 
-    useUpdateEffect(() => {
-        if (!!!Number(state.minute) && Number(state.second) < 2) {
-            state.second = '02'
-        }
-        if (Number(state.minute) === 60) {
-            state.second = '00'
-        }
-    }, [state.minute, state.second])
+  useUpdateEffect(() => {
+    if (!!!Number(state.minute) && Number(state.second) < 2) {
+      state.second = '02'
+    }
+    if (Number(state.minute) === 60) {
+      state.second = '00'
+    }
+  }, [state.minute, state.second])
 
-    const formateValue = (type: string) => {
-        const m = parseInt(String((switchInching?.time || 0) / 60))
-        if (type === 'minute') {
-            return m.toString().padStart(2, '0')
-        } else {
-            const s = switchInching.time - 60 * m
-            const v: string = s === 0 ? '00' : s < 10 ? '0' + s : String(s)
-            return v
-        }
+  const formateValue = (type: string) => {
+    const m = parseInt(String((switchInching?.time || 0) / 60))
+    if (type === 'minute') {
+      return m.toString().padStart(2, '0')
+    } else {
+      const s = switchInching.time - 60 * m
+      const v: string = s === 0 ? '00' : s < 10 ? '0' + s : String(s)
+      return v
     }
+  }
+
+  const styles = StyleSheet.create({
+    switchContainer: {
+      backgroundColor: props.theme.container.background,
+      marginHorizontal: cx(24),
+      padding: cx(10),
+      borderRadius: cx(6),
+      flexDirection: 'column',
+    },
+    switchCardContainer: {
+      paddingVertical: cx(4),
+      paddingHorizontal: cx(10),
+      backgroundColor: props.theme.global.background,
+      flexDirection: 'row',
+      justifyContent: 'center',
+      alignItems: 'center',
+      borderRadius: cx(6),
+    },
+    switchCardTitle: {
+      color: props.theme.global.fontColor,
+      fontSize: cx(14),
+      flex: 1,
+      fontWeight: '400',
+    },
+    switchDescription: {
+      color: props.theme.global.fontColor,
+      flexWrap: 'wrap',
+      fontSize: cx(12),
+      marginTop: cx(4),
+    },
+    secondTopic: {
+      color: props.theme.global.fontColor,
+      flexWrap: 'wrap',
+      fontSize: cx(14),
+      marginTop: cx(30),
+      marginHorizontal: cx(24),
+    },
+    pickContainer: {
+      position: 'relative',
+      marginVertical: cx(24),
+      marginHorizontal: cx(24),
+    },
+    disabledCover: {
+      position: 'absolute',
+      width: '100%',
+      height: '100%',
+      left: 0,
+      top: 0,
+      zIndex: 999,
+    },
+  })
 
   return (
     <Page
@@ -178,54 +230,4 @@ const SwitchInching = () => {
   );
 };
 
-const styles = StyleSheet.create({
-  switchContainer: {
-    backgroundColor: '#F6F6F6',
-    marginHorizontal: cx(24),
-    padding: cx(10),
-    borderRadius: cx(6),
-    flexDirection: 'column',
-  },
-  switchCardContainer: {
-    paddingVertical: cx(4),
-    paddingHorizontal: cx(10),
-    backgroundColor: '#FFFFFF',
-    flexDirection: 'row',
-    justifyContent: 'center',
-    alignItems: 'center',
-    borderRadius: cx(6),
-  },
-  switchCardTitle: {
-    color: '#000',
-    fontSize: cx(14),
-    flex: 1,
-    fontWeight: '400',
-  },
-  switchDescription: {
-    color: '#000',
-    flexWrap: 'wrap',
-    fontSize: cx(12),
-    marginTop: cx(4),
-  },
-  secondTopic: {
-    color: '#000',
-    flexWrap: 'wrap',
-    fontSize: cx(14),
-    marginTop: cx(30),
-    marginHorizontal: cx(24),
-  },
-  pickContainer: {
-    position: 'relative',
-    marginVertical: cx(24),
-    marginHorizontal: cx(24),
-  },
-  disabledCover: {
-    position: 'absolute',
-    width: '100%',
-    height: '100%',
-    left: 0,
-    top: 0,
-    zIndex: 999,
-  },
-});
-export default SwitchInching;
+export default withTheme(SwitchInching)

package/src/newModules/timeSchedule/TimeScheduleDetailPage.tsx

@@ -221,7 +221,7 @@ const TimeScheduleDetailPage = (props: { theme?: any }) => {
       fontFamily: 'helvetica_neue_lt_std_bd',
     },
     applyContent: {
-      backgroundColor: props.theme.card.border,
+      backgroundColor: props.theme.container.background,
       borderRadius: 4,
       minHeight: cx(55),
       flex: 1,
@@ -263,7 +263,7 @@ const TimeScheduleDetailPage = (props: { theme?: any }) => {
     },
     summaryRight: {
       flexDirection: 'column',
-      backgroundColor: props.theme.card.background,
+      backgroundColor: props.theme.tag.background,
       borderRadius: cx(16),
       alignItems: 'center'
     },
@@ -371,7 +371,7 @@ const TimeScheduleDetailPage = (props: { theme?: any }) => {
           <Spacer height={cx(10)} />
           <View style={[styles.applyContent, { paddingTop: state.selectedSkill.length ? cx(10) : 0 }]}>
             {state.selectedSkill.length === 0 ? (
-              <Text>{I18n.getLang('timer_ceiling_fan_selectionfield_no_components_text')}</Text>
+              <Text style={{color: props.theme.global.fontColor}}>{I18n.getLang('timer_ceiling_fan_selectionfield_no_components_text')}</Text>
             ) : (
               state.selectedSkill.map(skill => (
                 <View
@@ -388,7 +388,7 @@ const TimeScheduleDetailPage = (props: { theme?: any }) => {
                       style={{ paddingHorizontal: cx(5) }}
                     >
                       <Image
-                        style={{ width: cx(16), height: cx(16) }}
+                        style={{ width: cx(16), height: cx(16), tintColor: props.theme.global.fontColor }}
                         source={res.ic_arrows_nav_clear}
                       />
                     </TouchableOpacity>
@@ -409,7 +409,7 @@ const TimeScheduleDetailPage = (props: { theme?: any }) => {
               >
                 <Text style={{ color: props.theme.global.fontColor, fontSize: cx(12) }}>{item.key}</Text>
                 <Image
-                  style={{ width: cx(16), height: cx(16) }}
+                  style={{ width: cx(16), height: cx(16), tintColor: props.theme.global.fontColor }}
                   source={res.device_panel_timer_add}
                 />
               </TouchableOpacity>
@@ -436,18 +436,18 @@ const TimeScheduleDetailPage = (props: { theme?: any }) => {
         )}
         <Spacer height={cx(10)} />
         {(!state.selectedSkill.length && !showMoodFanSelectText) && <InfoText
-          style={{ marginHorizontal: cx(24) }}
-          icon={res.ic_warning_amber}
-          contentColor="#FF9500"
-          text={I18n.getLang('timeschedule_add_schedule_no_device_warning_text')}
-          textStyle={{fontSize: cx(12)}}
+            style={{ marginHorizontal: cx(24) }}
+            icon={res.ic_warning_amber}
+            contentColor="#FF9500"
+            text={I18n.getLang('timeschedule_add_schedule_no_device_warning_text')}
+            textStyle={{fontSize: cx(12)}}
         />}
         {showMoodFanSelectText && <InfoText
-          style={{ marginHorizontal: cx(24) }}
-          icon={res.ic_warning_amber}
-          contentColor="#FF9500"
-          text={I18n.getLang('timeschedule_add_schedule_devicestate_sec_warning_text')}
-          textStyle={{fontSize: cx(12)}}
+            style={{ marginHorizontal: cx(24) }}
+            icon={res.ic_warning_amber}
+            contentColor="#FF9500"
+            text={I18n.getLang('timeschedule_add_schedule_devicestate_sec_warning_text')}
+            textStyle={{fontSize: cx(12)}}
         />}
         {state.isManual ? (
           <ManualSettings
@@ -463,7 +463,7 @@ const TimeScheduleDetailPage = (props: { theme?: any }) => {
             onManualChange={manual => {
               state.manualData = {
                 ...state.manualData,
-              // @ts-ignore
+                // @ts-ignore
                 deviceData: cloneDeep(manual),
               };
             }}
@@ -518,61 +518,61 @@ const TimeScheduleDetailPage = (props: { theme?: any }) => {
           actions={<View style={{ flex: 1 }}>
             {state.isManual
               ? !!state.selectedSkill.length && (
-                <>
-                  {!!state.selectedSkill.filter(skill => skill.enable).length && (
-                    <>
-                      <Text style={{ fontSize: cx(14), color: '#000' }}>
-                        {I18n.getLang('feature_summary_action_txt_1')}
-                      </Text>
-                      <View style={{ flexDirection: 'row', flexWrap: 'wrap' }}>
-                        {state.selectedSkill
-                          .filter(skill => skill.enable)
-                          .map(item => (
-                            <View
-                              style={[
-                                styles.summaryRight,
-                                { marginRight: cx(5), marginBottom: cx(5) },
-                              ]}
-                              key={item.dp}
-                            >
-                              <Text style={[styles.rightItem]}>{item.key}</Text>
-                            </View>
-                          ))}
-                      </View>
-                    </>
-                  )}
+              <>
+                {!!state.selectedSkill.filter(skill => skill.enable).length && (
+                  <>
+                    <Text style={{ fontSize: cx(14), color: props.theme.global.fontColor }}>
+                      {I18n.getLang('feature_summary_action_txt_1')}
+                    </Text>
+                    <View style={{ flexDirection: 'row', flexWrap: 'wrap' }}>
+                      {state.selectedSkill
+                        .filter(skill => skill.enable)
+                        .map(item => (
+                          <View
+                            style={[
+                              styles.summaryRight,
+                              { marginRight: cx(5), marginBottom: cx(5) },
+                            ]}
+                            key={item.dp}
+                          >
+                            <Text style={[styles.rightItem]}>{item.key}</Text>
+                          </View>
+                        ))}
+                    </View>
+                  </>
+                )}
 
-                  {!!state.selectedSkill.filter(skill => !skill.enable).length && (
-                    <>
-                      <Text style={{ fontSize: cx(14) }}>
-                        {I18n.getLang('feature_summary_action_txt_2')}
-                      </Text>
-                      <View style={{ flexDirection: 'row', flexWrap: 'wrap' }}>
-                        {state.selectedSkill
-                          .filter(skill => !skill.enable)
-                          .map((item) => (
-                            <View
-                              style={[
-                                styles.summaryRight,
-                                { marginRight: cx(5), marginBottom: cx(5) },
-                              ]}
-                              key={item.dp}
-                            >
-                              <Text style={[styles.rightItem]}>{item.key}</Text>
-                            </View>
-                          ))}
-                      </View>
-                    </>
-                  )}
-                </>
-              )
+                {!!state.selectedSkill.filter(skill => !skill.enable).length && (
+                  <>
+                    <Text style={{ fontSize: cx(14), color: props.theme.global.fontColor }}>
+                      {I18n.getLang('feature_summary_action_txt_2')}
+                    </Text>
+                    <View style={{ flexDirection: 'row', flexWrap: 'wrap' }}>
+                      {state.selectedSkill
+                        .filter(skill => !skill.enable)
+                        .map((item) => (
+                          <View
+                            style={[
+                              styles.summaryRight,
+                              { marginRight: cx(5), marginBottom: cx(5) },
+                            ]}
+                            key={item.dp}
+                          >
+                            <Text style={[styles.rightItem]}>{item.key}</Text>
+                          </View>
+                        ))}
+                    </View>
+                  </>
+                )}
+              </>
+            )
               : !!state.moodName && (
-                <View style={{ flexDirection: 'row', flexWrap: 'wrap' }}>
-                  <View style={[styles.summaryRight, { marginLeft: cx(5) }]}>
-                    <Text style={styles.rightItem}>{state.moodName}</Text>
-                  </View>
+              <View style={{ flexDirection: 'row', flexWrap: 'wrap' }}>
+                <View style={[styles.summaryRight, { marginLeft: cx(5) }]}>
+                  <Text style={styles.rightItem}>{state.moodName}</Text>
                 </View>
-              )}
+              </View>
+            )}
           </View>}
         />
         <Spacer height={cx(30)} />
@@ -626,23 +626,23 @@ const getDefaultManual = (props: TimeScheduleDetailPageParams): ComponentConfig
       : props.isMixLight
         ? DeviceType.MixLight
         : props.isPowerStrip
-        ? DeviceType.PowerStrip
-        : props.isFanLight 
-        ? DeviceType.FanLight
-        : props.isCeilingLight 
-        ? DeviceType.CeilingLight
-         : DeviceType.LightSource
-         const deviceData =
-         (deviceType === DeviceType.StripLight || deviceType === DeviceType.CeilingLight)
-           ? defStripDeviceData
-           : deviceType === DeviceType.MixLight
-             ? defMixDeviceData
-             : deviceType === DeviceType.FanLight
-             ? defFanLightDeviceData
-             : defDeviceData;
+          ? DeviceType.PowerStrip
+          : props.isFanLight
+            ? DeviceType.FanLight
+            : props.isCeilingLight
+              ? DeviceType.CeilingLight
+              : DeviceType.LightSource
+  const deviceData =
+    (deviceType === DeviceType.StripLight || deviceType === DeviceType.CeilingLight)
+      ? defStripDeviceData
+      : deviceType === DeviceType.MixLight
+        ? defMixDeviceData
+        : deviceType === DeviceType.FanLight
+          ? defFanLightDeviceData
+          : defDeviceData;
 
   return {
-    type: deviceType as any, 
+    type: deviceType as any,
     deviceData: {
       ...deviceData,
       isColorMode: props.isSupportColor,

package/src/newModules/timeSchedule/components/ManuaSettings.tsx

@@ -136,6 +136,7 @@ function ManualSettings(props: ManualSettingProps) {
 
               {item.enable && item.type === 'fan' && (
                 <FanAdjustViewContent
+                  theme={props.theme}
                   hideEnable={true}
                   fanEnable={item.enable}
                   maxFanSpeed={props.isUVCFan ? 20 : 3}
@@ -324,7 +325,7 @@ function ManualSettings(props: ManualSettingProps) {
             <Card style={{ marginHorizontal: cx(24) }}>
               <LdvSwitch
                 title={item.key}
-                color={'#fff'}
+                color={props.theme.card.background}
                 colorAlpha={1}
                 enable={item.enable}
                 setEnable={(enable: boolean) => {
@@ -404,7 +405,7 @@ function ManualSettings(props: ManualSettingProps) {
         ))}
       </View>
     )
-  }, [state.deviceData, state.applyForList])
+  }, [state.deviceData, state.applyForList, props.theme.type])
 
   const powerStripCard = useMemo(() => {
     return (