@ledvance/ui-biz-bundle 1.1.55 → 1.1.57

package/src/newModules/mood/StaticMoodEditorPage.tsx

@@ -0,0 +1,343 @@
+import React, { useCallback, useEffect, useMemo } from 'react';
+import { ScrollView, StyleSheet, View } from 'react-native';
+import { cloneDeep, find, isEqual } from 'lodash';
+import { useReactive } from 'ahooks';
+import Page from '@ledvance/base/src/components/Page';
+import I18n from '@ledvance/base/src/i18n';
+import { useNavigation } from '@react-navigation/native';
+import TextField from '@ledvance/base/src/components/TextField';
+import { Utils } from 'tuya-panel-kit';
+import Card from '@ledvance/base/src/components/Card';
+import Spacer from '@ledvance/base/src/components/Spacer';
+import res from '@ledvance/base/src/res';
+import TextButton from '@ledvance/base/src/components/TextButton';
+import { useFanMaxSpeed } from '@ledvance/base/src/models/modules/NativePropsSlice';
+import LampAdjustView from '@ledvance/base/src/components/LampAdjustView';
+import FanAdjustView from '@ledvance/base/src/components/FanAdjustView';
+import { showDeleteMoodDialog } from './tools';
+import { MoodNodeInfo, MoodPageParams, MoodUIInfo } from './Interface';
+import { Result } from '@ledvance/base/src/models/modules/Result';
+import { hsv2Hex, mapFloatToRange } from '@ledvance/base/src/utils';
+import { cctToColor } from '@ledvance/base/src/utils/cctUtils';
+import { useParams } from '@ledvance/base/src/hooks/Hooks';
+import ColorAdjustView from '@ledvance/base/src/components/ColorAdjustView';
+import { RouterKey } from 'navigation/Router';
+import LdvSwitch from '@ledvance/base/src/components/ldvSwitch';
+
+const cx = Utils.RatioUtils.convertX;
+
+export interface StaticMoodEditorPageParams {
+  mode: 'add' | 'edit';
+  moods: MoodUIInfo[];
+  currentMood: MoodUIInfo;
+  onSave: () => void;
+  moduleParams: MoodPageParams;
+  modDeleteMood: (mode: 'add' | 'edit' | 'del', currentMood: MoodUIInfo) => Promise<Result<any>>;
+}
+
+export interface StaticMoodEditorPageState {
+  headline: string;
+  mood: MoodUIInfo;
+  mainNode: MoodNodeInfo;
+  secondaryNode: MoodNodeInfo;
+  loading: boolean;
+}
+
+const StaticMoodEditorPage = () => {
+  const navigation = useNavigation();
+  const routeParams = useParams<StaticMoodEditorPageParams>();
+  const params = cloneDeep(routeParams);
+  const moduleParams = params.moduleParams;
+  const isMix = !!(moduleParams.isCeilingLight || moduleParams.isMixLight);
+  const state = useReactive<StaticMoodEditorPageState>({
+    headline: '',
+    mood: params.currentMood,
+    mainNode: params.currentMood.mainLamp.nodes[0],
+    secondaryNode: params.currentMood?.secondaryLamp?.nodes[0],
+    loading: false,
+  });
+  
+  useEffect(() => {
+    state.headline = I18n.getLang(
+      params.mode === 'add' ? 'add_new_static_mood_headline_text' : 'edit_static_mood_headline_text'
+    );
+  }, [params.mode]);
+
+  const getColorBlockColor = useCallback((node: MoodNodeInfo) => {
+    const s = Math.round(mapFloatToRange(node.s / 100, 30, 100));
+    if (node.isColorNode) {
+      return hsv2Hex(node.h, s, 100);
+    } else {
+      return cctToColor(node.colorTemp.toFixed());
+    }
+  }, []);
+
+  const onRightClick = async () => {
+    if (state.loading) return;
+    state.loading = true;
+    const newMood: MoodUIInfo = {
+      ...state.mood,
+      mainLamp: {
+        ...state.mood.mainLamp,
+        nodes: [cloneDeep(state.mainNode)],
+      },
+    };
+    if (isMix) {
+      newMood.secondaryLamp = {
+        ...newMood.secondaryLamp,
+        nodes: [cloneDeep(state.secondaryNode)],
+      };
+      newMood.mainLamp.type = 2
+      if(moduleParams.isSupportBrightness && !moduleParams.isSupportTemperature){
+        newMood.mainLamp.type = 1
+      }
+      if(moduleParams.isSupportColor){
+        newMood.secondaryLamp.type = 3
+      }
+    }
+    const res = await params.modDeleteMood(params.mode, newMood);
+    state.loading = false;
+    if (res.success) {
+      navigation.navigate(RouterKey.ui_biz_mood);
+    }
+  };
+
+  const getButtonStatus = () => {
+    return (
+      (params.mode === 'edit' && isEqual(state.mood, params.currentMood)) ||
+      !state.mood.name ||
+      nameRepeat ||
+      state.mood.name.length > 32
+    );
+  };
+
+  const nameRepeat = useMemo(() => {
+    return !!find(params.moods, m => m.id !== state.mood.id && m.name === state.mood.name);
+  }, [state.mood.name]);
+
+  useEffect(() =>{
+    console.log(state.mood, '< --- state mood --- >')
+    console.log(params.currentMood, '< --- currentMood --- >')
+  }, [JSON.stringify(state.mood)])
+
+  return (
+    <Page
+      backText={I18n.getLang('mesh_device_detail_mode')}
+      showBackDialog={true}
+      backDialogTitle={I18n.getLang(
+        params.mode === 'add'
+          ? 'string_light_pp_dialog_sm_add_headline_c'
+          : 'manage_user_unsaved_changes_dialog_headline'
+      )}
+      backDialogContent={I18n.getLang(
+        params.mode === 'add'
+          ? 'strip_light_static_mood_add_step_2_dialog_text'
+          : 'strip_light_static_mood_editor_step_2_dialog_text'
+      )}
+      headlineText={state.headline}
+      rightButtonIcon={getButtonStatus() ? res.ic_uncheck : res.ic_check}
+      rightButtonDisabled={getButtonStatus()}
+      rightButtonIconClick={onRightClick}
+      loading={state.loading}
+    >
+      <ScrollView style={{ flex: 1 }} nestedScrollEnabled={true}>
+        <View style={styles.root}>
+          <TextField
+            style={styles.name}
+            value={state.mood.name}
+            placeholder={I18n.getLang('edit_static_mood_inputfield_topic_text')}
+            onChangeText={text => {
+              state.mood.name = text;
+            }}
+            maxLength={33}
+            showError={state.mood.name.length > 32 || nameRepeat}
+            tipColor={nameRepeat ? '#f00' : undefined}
+            tipIcon={nameRepeat ? res.ic_text_field_input_error : undefined}
+            errorText={I18n.getLang(
+              nameRepeat ? 'string_light_pp_field_sm_add_error1' : 'add_new_dynamic_mood_alert_text'
+            )}
+          />
+          <Card style={styles.adjustCard}>
+            <LdvSwitch
+              title={I18n.getLang(
+                isMix
+                  ? 'light_sources_tile_main_lighting_headline'
+                  : 'light_sources_tile_tw_lighting_headline'
+              )}
+              color={getColorBlockColor(state.mainNode)}
+              colorAlpha={1}
+              enable={!!state.mood.mainLamp.enable}
+              setEnable={v => {
+                state.mood.mainLamp.enable = v;
+              }}
+              showSwitch={!!moduleParams.isMixLight}
+            />
+            {(!moduleParams.isMixLight || state.mood.mainLamp.enable) && (
+              <LampAdjustView
+                isSupportColor={isMix ? false : moduleParams.isSupportColor}
+                isSupportBrightness={moduleParams.isSupportBrightness}
+                isSupportTemperature={moduleParams.isSupportTemperature}
+                isColorMode={state.mainNode.isColorNode}
+                reserveSV={true}
+                setIsColorMode={isColorMode => {
+                  state.mainNode.isColorNode = isColorMode;
+                }}
+                h={state.mainNode.h}
+                s={state.mainNode.s}
+                v={state.mainNode.v}
+                onHSVChange={(h, s, v) => {
+                  state.mainNode.h = h 
+                  state.mainNode.s = s 
+                  state.mainNode.v = v
+                }}
+                onHSVChangeComplete={(h, s, v) => {
+                  state.mainNode.h = h 
+                  state.mainNode.s = s 
+                  state.mainNode.v = v
+                }}
+                colorTemp={state.mainNode.colorTemp}
+                brightness={state.mainNode.brightness}
+                onCCTChange={() => {}}
+                onCCTChangeComplete={cct => {
+                  state.mainNode.colorTemp = cct;
+                }}
+                onBrightnessChange={() => {}}
+                onBrightnessChangeComplete={brightness => {
+                  state.mainNode.brightness = brightness;
+                }}
+              />
+            )}
+          </Card>
+          <Spacer />
+          {isMix && (
+            <Card style={styles.fanAdjustCard}>
+              <LdvSwitch
+                title={I18n.getLang('light_sources_tile_sec_lighting_headline')}
+                color={'#fff'}
+                colorAlpha={1}
+                enable={!!state.mood.secondaryLamp.enable}
+                setEnable={v => {
+                  if(v && !state.mood.secondaryLamp.nodes.length){
+                    state.mood.secondaryLamp.nodes.push(
+                      {
+                        h: 0,
+                        s: 100,
+                        v: 100,
+                        brightness: 0,
+                        colorTemp: 0,
+                        isColorNode: true,
+                      },
+                    )
+                    state.secondaryNode = state.mood.secondaryLamp.nodes[0]
+                  }
+                  state.mood.secondaryLamp.enable = v;
+                }}
+                showSwitch={!!moduleParams.isMixLight}
+              />
+              {(!moduleParams.isMixLight || state.mood.secondaryLamp.enable) && (
+                <>
+                  <ColorAdjustView
+                  h={state.secondaryNode.h}
+                  s={state.secondaryNode.s}
+                  v={state.secondaryNode.v}
+                  reserveSV={true}
+                  onHSVChange={() => {}}
+                  onHSVChangeComplete={(h, s, v) => {
+                    state.secondaryNode.h = h 
+                    state.secondaryNode.s = s 
+                    state.secondaryNode.v = v
+                  }}
+                />
+                <Spacer height={cx(16)}/>
+                </>
+              )}
+            </Card>
+          )}
+          {!!(moduleParams.isFanLight || moduleParams.isUVCFan) && (
+            <FanAdjustView
+              fanEnable={!!state.mood.mainLamp.fanEnable}
+              fanSpeed={state.mood.mainLamp.fanSpeed || 1}
+              maxFanSpeed={useFanMaxSpeed()}
+              onFanSwitch={fanEnable => {
+                state.mood.mainLamp.fanEnable = fanEnable;
+              }}
+              onFanSpeedChange={fanSpeed => {
+                state.mood.mainLamp.fanSpeed = fanSpeed;
+              }}
+              onFanSpeedChangeComplete={fanSpeed => {
+                state.mood.mainLamp.fanSpeed = fanSpeed;
+              }}
+              style={styles.fanAdjustCard}
+            />
+          )}
+          {params.mode === 'edit' && (
+            <View style={{ marginTop: cx(20), marginHorizontal: cx(24) }}>
+              <TextButton
+                style={styles.deleteBtn}
+                textStyle={styles.deleteBtnText}
+                text={I18n.getLang('edit_static_mood_button_delete_text')}
+                onPress={() => {
+                  showDeleteMoodDialog(async (_, { close }) => {
+                    state.loading = true;
+                    close();
+                    const res = await params.modDeleteMood('del', state.mood);
+                    if (res.success) {
+                      navigation.navigate(RouterKey.ui_biz_mood);
+                    }
+                    state.loading = false;
+                  });
+                }}
+              />
+            </View>
+          )}
+          <Spacer />
+        </View>
+      </ScrollView>
+    </Page>
+  );
+};
+
+const styles = StyleSheet.create({
+  root: {
+    flex: 1,
+    flexDirection: 'column',
+  },
+  name: {
+    marginHorizontal: cx(24),
+  },
+  adjustCard: {
+    marginTop: cx(12),
+    marginHorizontal: cx(24),
+  },
+  fanAdjustCard: {
+    marginHorizontal: cx(24),
+  },
+  lightLine: {
+    flexDirection: 'row',
+    marginHorizontal: cx(16),
+  },
+  light: {
+    color: '#000',
+    fontSize: cx(18),
+    fontFamily: 'helvetica_neue_lt_std_bd',
+  },
+  preview: {
+    width: cx(20),
+    height: cx(20),
+    marginStart: cx(12),
+    borderRadius: cx(4),
+  },
+  deleteBtn: {
+    width: '100%',
+    height: cx(50),
+    backgroundColor: '#666',
+    borderRadius: cx(8),
+  },
+  deleteBtnText: {
+    color: '#fff',
+    fontSize: cx(16),
+    fontFamily: 'helvetica_neue_lt_std_bd',
+  },
+});
+
+export default StaticMoodEditorPage;

package/src/newModules/mood/tools.ts

@@ -0,0 +1,12 @@
+import { Dialog } from 'tuya-panel-kit'
+import Strings from '@ledvance/base/src/i18n'
+
+export const showDeleteMoodDialog = (onConfirm: (data: any, args: { close: () => void }) => void) => {
+    Dialog.confirm({
+        title: Strings.getLang('string_light_pp_dialog_sm_ed_headline_d'),
+        subTitle: Strings.getLang(`strip_light_static_mood_edit_dialog_text`),
+        cancelText: Strings.getLang('cancel_dialog_delete_item_sleepschedule_answer_no_text'),
+        confirmText: Strings.getLang('cancel_dialog_delete_item_sleepschedule_answer_yes_text'),
+        onConfirm: onConfirm,
+    })
+}

package/src/newModules/overchargeSwitch/OverchargeSwitchPage.tsx

@@ -0,0 +1,96 @@
+import React from 'react'
+import {SwitchButton, Utils} from "tuya-panel-kit";
+import Page from "@ledvance/base/src/components/Page";
+import I18n from "@ledvance/base/src/i18n/index";
+import {useDeviceInfo, useDp} from "@ledvance/base/src/models/modules/NativePropsSlice";
+import {useReactive} from "ahooks";
+import Spacer from "@ledvance/base/src/components/Spacer";
+import {StyleSheet, Text, View} from "react-native";
+import {Result} from "@ledvance/base/src/models/modules/Result";
+import {useParams} from "@ledvance/base/src/hooks/Hooks";
+
+const { convertX: cx } = Utils.RatioUtils
+
+export interface OverchargeSwitchPageParams {
+  overchargeSwitchCode: string
+}
+
+export function useOverchargeSwitch(overchargeSwitchCode: string): [boolean, (v: boolean) => Promise<Result<any>>] {
+  return useDp(overchargeSwitchCode)
+}
+
+const OverchargeSwitchPage = () => {
+  const params = useParams<OverchargeSwitchPageParams>()
+  const devInfo = useDeviceInfo()
+  const [overchargeSwitch, setOverchargeSwitch] = useOverchargeSwitch(params.overchargeSwitchCode)
+  const state = useReactive({
+    loading: false
+  })
+  return (<Page
+    backText={devInfo.name}
+    loading={state.loading}>
+    <View style={[styles.titleBGView, styles.shadow]}>
+      <View style={{ flex: 7 }}>
+        <View>
+          <Text style={styles.title}>{I18n.getLang('switch_overcharge_headline_text')}</Text>
+        </View>
+        <View style={{ paddingBottom: cx(16) }}>
+          <Text>{I18n.getLang('switch_overcharge_headline_description')}</Text>
+        </View>
+      </View>
+      <Spacer style={{ flex: 1 }} height={0} width={0} />
+      <SwitchButton value={overchargeSwitch} onValueChange={async v => {
+        state.loading = true
+        await setOverchargeSwitch(v)
+        state.loading = false
+      } } />
+    </View>
+  </Page>)
+}
+
+const styles = StyleSheet.create({
+  tipInfoContainer: {
+    flexDirection: 'row',
+    marginHorizontal: cx(24),
+    marginVertical: cx(10)
+  },
+  image: {
+    width: cx(16),
+    height: cx(16),
+    marginRight: cx(5),
+    tintColor: '#000'
+  },
+  titleBGView: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    paddingHorizontal: cx(16),
+    marginHorizontal: cx(24),
+    marginTop: cx(30)
+  },
+  colorBlock: {
+    width: cx(20),
+    height: cx(20),
+    marginStart: cx(12),
+    borderRadius: cx(4),
+  },
+  title: {
+    color: '#000',
+    fontSize: cx(14),
+    fontFamily: 'helvetica_neue_lt_std_bd',
+    paddingVertical: cx(16),
+  },
+  shadow: {
+    shadowColor: '#000000',
+    shadowOpacity: 0.2,
+    shadowRadius: 8,
+    elevation:8,
+    shadowOffset: {
+      width: 0,
+      height: 4,
+    },
+    backgroundColor: '#fff',
+    borderRadius: 8,
+  },
+})
+
+export default OverchargeSwitchPage

package/src/newModules/overchargeSwitch/Router.ts

@@ -0,0 +1,16 @@
+import {NavigationRoute} from "tuya-panel-kit";
+import OverchargeSwitchPage from "./OverchargeSwitchPage";
+import {ui_biz_routerKey} from "../../navigation/Routers";
+
+const OverchargeSwitchPageRouters: NavigationRoute[] = [
+  {
+    name: ui_biz_routerKey.ui_biz_overcharge_switch,
+    component: OverchargeSwitchPage,
+    options:{
+      hideTopbar: true,
+      showOfflineView: false,
+    }
+  }
+]
+
+export default OverchargeSwitchPageRouters