@ledvance/group-ui-biz-bundle 1.0.118 → 1.0.119

package/package.json

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

package/src/modules/timeSchedule/Interface.ts

@@ -90,7 +90,7 @@ export interface ManualSettingProps extends judgmentSupport {
   applyForList: ApplyForItem[];
   dps: Record<string, any>;
   manualData: ComponentConfig;
-  onManualChange?: (manualData: DeviceData | MixLightData | StripLightData) => void
+  onManualChange?: (manualData: DeviceData | MixLightData | StripLightData | ShutterData) => void
   onApplyChange?: (applyForList: ApplyForItem[]) => void
 }
 
@@ -101,6 +101,7 @@ export enum DeviceType {
   CeilingLight = 'ceilingLight',
   FanLight = 'fanLight',
   MoodStrip = 'moodStrip',
+  Shutter = 'shutter',
 }
 // export type DeviceType = 'LightSource' | 'CeilingLight' | 'StringLight' | 'StripLight' | 'MixLight';
 
@@ -139,6 +140,10 @@ export interface MoodStripData extends DeviceData {
   adjustType: AdjustType
 }
 
+export interface ShutterData extends DeviceData {
+  percentControl: number
+}
+
 export type ComponentConfig =
   | { type: DeviceType.LightSource; deviceData: DeviceData }
   | { type: DeviceType.MixLight; deviceData: MixLightData }
@@ -146,7 +151,7 @@ export type ComponentConfig =
   | { type: DeviceType.CeilingLight; deviceData: CeilingLightData }
   | { type: DeviceType.FanLight; deviceData: FanLightData }
   | { type: DeviceType.MoodStrip; deviceData: MoodStripData}
-
+  | { type: DeviceType.Shutter; deviceData: ShutterData}
 export interface TimeScheduleDetailState {
   timeSchedule: Timer;
   dps: Record<string, any>;

package/src/modules/timeSchedule/TimeScheduleActions.ts

@@ -45,6 +45,10 @@ export const defMoodStripDeviceData = {
   adjustType: AdjustType.COLOUR
 }
 
+export const defShutterDeviceData = {
+  percentControl: 100
+};
+
 export const addTimeSchedule = async (props: IAddSingleTime) => {
   try {
     const res = await commonApi.timerApi.addSingleTimer({

package/src/modules/timeSchedule/TimeScheduleDetailPage.tsx

@@ -37,11 +37,11 @@ import DeleteButton from '@ledvance/base/src/components/DeleteButton';
 import SegmentControl from '@ledvance/base/src/components/segmentControl';
 import { useParams } from '@ledvance/base/src/hooks/Hooks';
 import ManualSettings from './components/ManuaSettings';
-import { defDeviceData, defMixDeviceData, defStripDeviceData, defFanLightDeviceData, defMoodStripDeviceData } from './TimeScheduleActions';
+import { defDeviceData, defMixDeviceData, defStripDeviceData, defFanLightDeviceData, defMoodStripDeviceData, defShutterDeviceData } from './TimeScheduleActions';
 import MoodItem from '../mood_new/MoodItem';
 import Summary from './components/Summary'
 import { getRemoteMoodList } from '../mood_new/MoodActions'
-import {MoodInfo, MoodUIInfo } from '../mood_new/Interface';
+import { MoodInfo, MoodUIInfo } from '../mood_new/Interface';
 import InfoText from '@ledvance/base/src/components/InfoText';
 import ThemeType from '@ledvance/base/src/config/themeType'
 import Tag from '@ledvance/base/src/components/Tag';
@@ -222,7 +222,7 @@ const TimeScheduleDetailPage = (props: { theme?: ThemeType }) => {
     return isEqual(before, now);
   }, [JSON.stringify(state.timeSchedule), JSON.stringify(state.initSelectedSkill), JSON.stringify(state.selectedSkill), state.manualData, state.isManual, state.mood]);
 
-  const showMoodFanSelectText = useMemo(() =>{
+  const showMoodFanSelectText = useMemo(() => {
     return (params.isUVCFan || params.isFanLight) && !state.isManual && state.selectedSkill.length < 2
   }, [params.isUVCFan, params.isFanLight, state.selectedSkill.length, state.isManual])
 
@@ -240,10 +240,35 @@ const TimeScheduleDetailPage = (props: { theme?: ThemeType }) => {
     return params.applyForList.length !== 1 && !params.applyForDisabled;
   }, [params.applyForList.length, params.applyForDisabled]);
 
-  const getMoodItemEnable = useCallback((item: MoodUIInfo ) =>{
+  const getMoodItemEnable = useCallback((item: MoodUIInfo) => {
     return params.isCeilingLight ? ((item.mainLamp.id === (state.mood as MoodInfo)?.mainLamp?.id) && (item.secondaryLamp.id === (state.mood as MoodInfo)?.secondaryLamp?.id)) : item.id === state.mood?.id
   }, [state.mood, params.isCeilingLight])
 
+  const renderSkillGroup = (skills: ApplyForItem[], i18nString: string) => {
+    if (!skills.length) return null;
+
+    return (
+      <>
+        <Text style={{ fontSize: cx(14), color: props.theme?.global.fontColor }}>
+          {i18nString}
+        </Text>
+        <View style={{ flexDirection: 'row', flexWrap: 'wrap' }}>
+          {skills.map(item => (
+            <View
+              style={[
+                styles.summaryRight,
+                { marginRight: cx(5), marginBottom: cx(5) },
+              ]}
+              key={item.dp}
+            >
+              <Text style={styles.rightItem}>{item.key}</Text>
+            </View>
+          ))}
+        </View>
+      </>
+    );
+  };
+
   const styles = StyleSheet.create({
     cardContainer: {
       marginHorizontal: cx(24),
@@ -387,9 +412,9 @@ const TimeScheduleDetailPage = (props: { theme?: ThemeType }) => {
             {I18n.getLang('timeschedule_add_schedule_subheadline_text')}
           </Text>
           <Spacer height={cx(10)} />
-          <View style={[styles.applyContent, {paddingTop: state.selectedSkill.length ? cx(10) : 0}]}>
+          <View style={[styles.applyContent, { paddingTop: state.selectedSkill.length ? cx(10) : 0 }]}>
             {state.selectedSkill.length === 0 ? (
-              <Text style={{color: props.theme?.global.fontColor}}>
+              <Text style={{ color: props.theme?.global.fontColor }}>
                 {I18n.getLang('timer_ceiling_fan_selectionfield_no_components_text')}
               </Text>
             ) : (
@@ -409,7 +434,7 @@ const TimeScheduleDetailPage = (props: { theme?: ThemeType }) => {
                     >
                       <Image
                         style={{ width: cx(16), height: cx(16), tintColor: props.theme?.global.fontColor }}
-                        source={{ uri: res.ic_arrows_nav_clear}}
+                        source={{ uri: res.ic_arrows_nav_clear }}
                       />
                     </TouchableOpacity>
                   )}
@@ -430,7 +455,7 @@ const TimeScheduleDetailPage = (props: { theme?: ThemeType }) => {
                 <Text style={{ color: props.theme?.global.fontColor }}>{item.key}</Text>
                 <Image
                   style={{ width: cx(16), height: cx(16), tintColor: props.theme?.global.fontColor }}
-                  source={{ uri: res.device_panel_timer_add}}
+                  source={{ uri: res.device_panel_timer_add }}
                 />
               </TouchableOpacity>
             );
@@ -456,16 +481,16 @@ const TimeScheduleDetailPage = (props: { theme?: ThemeType }) => {
         )}
         <Spacer height={cx(10)} />
         {(!state.selectedSkill.length && !showMoodFanSelectText) && <InfoText
-            style={{marginHorizontal: cx(24)}}
-            icon={res.ic_warning_amber}
-            contentColor={props.theme?.global.warning}
-            text={I18n.getLang('timeschedule_add_schedule_no_device_warning_text')}
+          style={{ marginHorizontal: cx(24) }}
+          icon={res.ic_warning_amber}
+          contentColor={props.theme?.global.warning}
+          text={I18n.getLang('timeschedule_add_schedule_no_device_warning_text')}
         />}
         {showMoodFanSelectText && <InfoText
-            style={{marginHorizontal: cx(24)}}
-            icon={res.ic_warning_amber}
-            contentColor={props.theme?.global.warning}
-            text={I18n.getLang('timeschedule_add_schedule_devicestate_sec_warning_text')}
+          style={{ marginHorizontal: cx(24) }}
+          icon={res.ic_warning_amber}
+          contentColor={props.theme?.global.warning}
+          text={I18n.getLang('timeschedule_add_schedule_devicestate_sec_warning_text')}
         />}
         {state.isManual ? (
           <ManualSettings
@@ -492,52 +517,52 @@ const TimeScheduleDetailPage = (props: { theme?: ThemeType }) => {
           !showMoodFanSelectText ? (
             <View>
               {!(params.isStringLight || params.isStripLight) && <View style={styles.tagLine}>
-                  <Tag
-                      checked={state.staticTagChecked}
-                      text={I18n.getLang('mood_overview_filter_name_text1')}
-                      onCheckedChange={checked => {
-                        state.staticTagChecked = checked;
-                      }}
-                  />
-                  <Spacer width={cx(8)} height={0} />
-                  <Tag
-                      checked={state.dynamicTagChecked}
-                      text={I18n.getLang('mood_overview_filter_name_text2')}
-                      onCheckedChange={checked => {
-                        state.dynamicTagChecked = checked;
-                      }}
-                  />
+                <Tag
+                  checked={state.staticTagChecked}
+                  text={I18n.getLang('mood_overview_filter_name_text1')}
+                  onCheckedChange={checked => {
+                    state.staticTagChecked = checked;
+                  }}
+                />
+                <Spacer width={cx(8)} height={0} />
+                <Tag
+                  checked={state.dynamicTagChecked}
+                  text={I18n.getLang('mood_overview_filter_name_text2')}
+                  onCheckedChange={checked => {
+                    state.dynamicTagChecked = checked;
+                  }}
+                />
                 {
                   params.isMoodStrip && <>
-                        <Spacer width={cx(8)} height={0}/>
-                        <Tag
-                            checked={state.diyTagChecked}
-                            text={I18n.getLang('mood_overview_field_chip_diy')}
-                            onCheckedChange={checked => {
-                              state.diyTagChecked = checked;
-                            }}
-                        />
-                    </>
+                    <Spacer width={cx(8)} height={0} />
+                    <Tag
+                      checked={state.diyTagChecked}
+                      text={I18n.getLang('mood_overview_field_chip_diy')}
+                      onCheckedChange={checked => {
+                        state.diyTagChecked = checked;
+                      }}
+                    />
+                  </>
                 }
               </View>}
               {params.isMoodStrip ? <FlatList
-                  data={state.filterMoods as DiySceneInfo[]}
-                  renderItem={({item}) => {
-                    return (
-                      <DiySceneItem
-                        enable={item.id === state.mood?.id}
-                        scene={item}
-                        onSwitch={_ => {
-                          state.mood = cloneDeep(item);
-                        }}
-                      />
-                    );
-                  }}
-                  ListHeaderComponent={() => <Spacer height={cx(10)}/>}
-                  ItemSeparatorComponent={() => <Spacer/>}
-                  ListFooterComponent={() => <Spacer/>}
-                  keyExtractor={item => `${item.name}`}
-                /> :
+                data={state.filterMoods as DiySceneInfo[]}
+                renderItem={({ item }) => {
+                  return (
+                    <DiySceneItem
+                      enable={item.id === state.mood?.id}
+                      scene={item}
+                      onSwitch={_ => {
+                        state.mood = cloneDeep(item);
+                      }}
+                    />
+                  );
+                }}
+                ListHeaderComponent={() => <Spacer height={cx(10)} />}
+                ItemSeparatorComponent={() => <Spacer />}
+                ListFooterComponent={() => <Spacer />}
+                keyExtractor={item => `${item.name}`}
+              /> :
                 <FlatList
                   data={state.filterMoods as MoodUIInfo[]}
                   renderItem={({ item }) => {
@@ -586,62 +611,20 @@ const TimeScheduleDetailPage = (props: { theme?: ThemeType }) => {
             : convertTo12HourFormat(state.timeSchedule.time)}
           actions={<View style={{ flex: 1 }}>
             {state.isManual
-              ? !!state.selectedSkill.length && (
-              <>
-                {!!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), 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.selectedSkill.length ? (
+                <>
+                  {renderSkillGroup(state.selectedSkill.filter(skill => skill.enable), I18n.getLang(params.isShutter ? 'curtain_summary_action_txt_1' : 'feature_summary_action_txt_1'))}
+                  {renderSkillGroup(state.selectedSkill.filter(skill => !skill.enable), I18n.getLang(params.isShutter ? 'curtain_summary_action_txt_2' : 'feature_summary_action_txt_2'))}
+                </>
+              ) : null
+              )
               : !!state.moodName && (
-              <View style={{ flexDirection: 'row', flexWrap: 'wrap' }}>
-                <View style={[styles.summaryRight, { marginLeft: cx(5) }]}>
-                  <Text style={styles.rightItem}>{state.moodName}</Text>
+                <View style={{ flexDirection: 'row', flexWrap: 'wrap' }}>
+                  <View style={[styles.summaryRight, { marginLeft: cx(5) }]}>
+                    <Text style={styles.rightItem}>{state.moodName}</Text>
+                  </View>
                 </View>
-              </View>
-            )}
+              )}
           </View>}
         />
         <Spacer height={cx(30)} />
@@ -659,7 +642,7 @@ const TimeScheduleDetailPage = (props: { theme?: ThemeType }) => {
                   onConfirm: async (_, { close }) => {
                     state.loading = true;
                     close();
-                    const res = await params.modDeleteTimeSchedule('del', {...state.timeSchedule, status: 2}, state.timeSchedule.id.toString());
+                    const res = await params.modDeleteTimeSchedule('del', { ...state.timeSchedule, status: 2 }, state.timeSchedule.id.toString());
                     state.loading = false;
                     if (res.success) {
                       params.refreshFn()
@@ -690,38 +673,37 @@ const newTimeSchedule = () => {
 };
 
 const getDefaultManual = (props: TimeScheduleDetailPageParams): ComponentConfig => {
-  const deviceType =
-    props.isStripLight
-      ? DeviceType.StripLight
-      : props.isMixLight
-        ? DeviceType.MixLight
-        : props.isCeilingLight
-          ? DeviceType.CeilingLight
-          : props.isFanLight ?
-            DeviceType.FanLight
-            : props.isCeilingLight
-              ? DeviceType.CeilingLight
-              : props.isMoodStrip
-                ? DeviceType.MoodStrip
-                : DeviceType.LightSource
-  const deviceData =
-    (deviceType === DeviceType.StripLight || deviceType === DeviceType.CeilingLight)
-      ? defStripDeviceData
-      : deviceType === DeviceType.MixLight
-        ? defMixDeviceData
-        : deviceType === DeviceType.FanLight
-          ? defFanLightDeviceData
-          : deviceType === DeviceType.MoodStrip
-            ? defMoodStripDeviceData
-            : defDeviceData;
+  const deviceTypeMap: Record<string, DeviceType> = {
+    isStripLight: DeviceType.StripLight,
+    isMixLight: DeviceType.MixLight,
+    isFanLight: DeviceType.FanLight,
+    isCeilingLight: DeviceType.CeilingLight,
+    isMoodStrip: DeviceType.MoodStrip,
+    isShutter: DeviceType.Shutter
+  };
+
+  const deviceType = Object.entries(deviceTypeMap)
+    .find(([key]) => props[key as keyof TimeScheduleDetailPageParams])
+    ?.[1] || DeviceType.LightSource;
+
+  const deviceDataMap: Record<DeviceType, any> = {
+    [DeviceType.StripLight]: defStripDeviceData,
+    [DeviceType.CeilingLight]: defStripDeviceData,
+    [DeviceType.MixLight]: defMixDeviceData,
+    [DeviceType.FanLight]: defFanLightDeviceData,
+    [DeviceType.MoodStrip]: defMoodStripDeviceData,
+    [DeviceType.Shutter]: defShutterDeviceData,
+    [DeviceType.LightSource]: defDeviceData,
+  };
+
   // @ts-ignore
   return {
     type: deviceType,
     deviceData: {
-      ...deviceData,
-      isColorMode: props.isSupportColor ? true : false,
+      ...deviceDataMap[deviceType],
+      isColorMode: props.isSupportColor,
     },
   };
 };
 
-export default withTheme(TimeScheduleDetailPage)
+export default withTheme(TimeScheduleDetailPage) as React.ComponentType<TimeScheduleDetailPageParams>

package/src/modules/timeSchedule/TimeSchedulePage.tsx

@@ -36,6 +36,7 @@ export interface TimeSchedulePageParams {
   isFanLight?: boolean
   isUVCFan?: boolean;
   isMoodStrip?: boolean
+  isShutter?: boolean
   applyForList: ApplyForItem[];
   applyForDisabled?: boolean; // 是否可以选择apply for
   manualDataDp2Obj: (dps: Record<string, any>) => DeviceStateType;
@@ -233,4 +234,4 @@ const TimeSchedulePage = (props: { theme?: ThemeType }) => {
   );
 };
 
-export default withTheme(TimeSchedulePage)
+export default withTheme(TimeSchedulePage) as React.ComponentType<TimeSchedulePageParams>

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

@@ -7,6 +7,7 @@ import {
   StripLightData,
   directOptions,
   modeOptions,
+  ShutterData,
 } from '../Interface';
 import { View } from 'react-native';
 import Card from '@ledvance/base/src/components/Card';
@@ -26,6 +27,7 @@ import { FanAdjustViewContent } from '@ledvance/base/src/components/FanAdjustVie
 import { cctToColor } from '@ledvance/base/src/utils/cctUtils';
 import {hsv2Hex, mapFloatToRange } from '@ledvance/base/src/utils';
 import { AdjustType, ApplyForItem } from '@ledvance/base/src/utils/interface';
+import LdvSlider from '@ledvance/base/src/components/ldvSlider';
 const { convertX: cx } = Utils.RatioUtils;
 const { withTheme } = Utils.ThemeUtils
 
@@ -476,6 +478,31 @@ function ManualSettings(props: ManualSettingProps) {
     )
   }, [state.deviceData, state.applyForList, props.theme?.card.background])
 
+  const shutterCard = useMemo(() => {
+    return (
+      <Card style={{ marginHorizontal: cx(24) }}>
+        <Spacer height={cx(16)} />
+        <LdvSlider
+          title={'Curtain'}
+          value={(state.deviceData as ShutterData).percentControl}
+          min={0}
+          max={100}
+          onSlidingComplete={async (value) => {
+            (state.deviceData as ShutterData).percentControl = value
+            state.applyForList = state.applyForList.map((apply) => {
+              return {
+                ...apply,
+                enable: value > 0
+              }
+            })
+            state.applyFlag = Symbol()
+          }}
+        />
+        <Spacer />
+      </Card>
+    )
+  }, [state.deviceData, state.applyForList, props.theme?.type])
+
   const componentRender = useMemo(() => {
     const component =
       props.manualData.type === DeviceType.MixLight
@@ -484,6 +511,8 @@ function ManualSettings(props: ManualSettingProps) {
           ? stripLightCard
           : props.manualData.type === DeviceType.CeilingLight
             ? ceilingLightCard
+            : props.manualData.type === DeviceType.Shutter
+                ? shutterCard
             : lightSourceCard;
     return component;
   }, [props.manualData.type, state.applyForList, state.deviceData, props.theme?.card.background]);
@@ -492,4 +521,4 @@ function ManualSettings(props: ManualSettingProps) {
   return <View>{componentRender}</View>;
 }
 
-export default memo(withTheme(ManualSettings))
+export default memo(withTheme(ManualSettings)) as React.ComponentType<ManualSettingProps>