@ledvance/ui-biz-bundle 1.1.61 → 1.1.63

package/src/newModules/fixedTime/FixedTimePage.tsx

@@ -1,8 +1,8 @@
-import React, { memo, useCallback } from "react";
+import React, { memo, useCallback, useMemo } from "react";
 import { FlatList, Image, ScrollView, StyleSheet, Text, View } from 'react-native'
 import Page from "@ledvance/base/src/components/Page";
 import { useDeviceInfo, useSystemTimeFormate } from "@ledvance/base/src/models/modules/NativePropsSlice";
-import { useNavigation, useRoute } from '@react-navigation/core'
+import { useNavigation } from '@react-navigation/core'
 import I18n from "@ledvance/base/src/i18n";
 import res from "@ledvance/base/src/res";
 import { ui_biz_routerKey } from "../../navigation/Routers";
@@ -15,6 +15,10 @@ import Card from "@ledvance/base/src/components/Card";
 import { convertMinutesTo12HourFormat, loopText } from "@ledvance/base/src/utils/common";
 import { cloneDeep } from "lodash";
 import dayjs from "dayjs";
+import { ApplyForItem } from "@ledvance/ui-biz-bundle/src/newModules/timeSchedule/Interface";
+import { useParams } from "@ledvance/base/src/hooks/Hooks";
+import Tag from "@ledvance/base/src/components/Tag";
+import InfoText from "@ledvance/base/src/components/InfoText";
 
 const { convertX: cx } = Utils.RatioUtils
 const MAX_NUM = 10
@@ -28,30 +32,37 @@ export interface FixedTimePageParams {
   }
   isPlug?: boolean
   showTags?: boolean
-  applyDps: {
-    label: string
-    value: string
-  }[]
-  isSupportColor: boolean
-  isSupportTemperature: boolean
-  isSupportBrightness: boolean
+  applyForList: ApplyForItem[]
+  isSupportColor?: boolean
+  isSupportTemperature?: boolean
+  isSupportBrightness?: boolean
 }
 
 const FixedTimePage = () => {
   const navigation = useNavigation()
   const devInfo = useDeviceInfo()
-  const params = useRoute().params as FixedTimePageParams
+  const params = useParams<FixedTimePageParams>()
   const is24Hour = useSystemTimeFormate()
   const [fixedTime, setFixedTime] = useFixedTime(params.fixedTimeDpCode, params.isPlug)
   const state = useReactive({
     loading: false,
-    fixedTimeList: cloneDeep(fixedTime)
+    originList: cloneDeep(fixedTime),
+    fixedTimeList: cloneDeep(fixedTime),
+    checkTags: params.applyForList.map(v => ({ ...v, enable: false }))
   })
 
   useUpdateEffect(() => {
-    state.fixedTimeList = cloneDeep(fixedTime)
+    state.originList = cloneDeep(fixedTime)
   }, [fixedTime])
 
+  useUpdateEffect(() => {
+    const isAll = state.checkTags.every(tag => tag.enable) || state.checkTags.every(tag => !tag.enable)
+    const checkedList = state.originList.filter(item => {
+      return isAll || state.checkTags[item.channel || 0]?.enable
+    })
+    state.fixedTimeList = cloneDeep(checkedList)
+  }, [JSON.stringify(state.checkTags), JSON.stringify(state.originList)])
+
   const navigateToEdit = useCallback((mode: 'add' | 'edit', scheduleItem: FixedTimerUiItem) => {
     navigation.navigate(ui_biz_routerKey.ui_biz_fixed_time_edit_new, {
       ...params,
@@ -62,19 +73,43 @@ const FixedTimePage = () => {
   }, [])
 
   const showMaxNumTip = useCallback(() => {
-    return state.fixedTimeList.length >= MAX_NUM
-  }, [state.fixedTimeList.length])
+    return state.originList.length >= MAX_NUM
+  }, [state.originList.length])
 
   const onPost = useCallback(async (mode: 'add' | 'edit' | 'del', fixedTime: FixedTimerUiItem) => {
-    const cloneFixedTimeList = cloneDeep(state.fixedTimeList)
-    const idx = state.fixedTimeList.findIndex(f => f.index === fixedTime.index)
+    console.log(fixedTime, '< --- fixedTimeeeeee')
+    const cloneFixedTimeList = cloneDeep(state.originList)
+    const idx = state.originList.findIndex(f => f.index === fixedTime.index)
+    console.log(idx, '< --- idxxxxx')
     if (mode === 'edit') {
       cloneFixedTimeList.splice(idx, 1, fixedTime)
     }
     if (mode === 'del') cloneFixedTimeList.splice(idx, 1)
-    const newFixedTimeList = mode === 'add' ? [...state.fixedTimeList, fixedTime] : cloneFixedTimeList
-    return setFixedTime(newFixedTimeList)
-  }, [state.fixedTimeList])
+    const newFixedTimeList = mode === 'add' ? [...state.originList, fixedTime] : cloneFixedTimeList
+    const res = await setFixedTime(newFixedTimeList)
+    console.log(res, '< ---== resss')
+    if (res.success) {
+      state.originList = cloneDeep(newFixedTimeList)
+    }
+    return res
+  }, [state.originList])
+
+  const showTags = useMemo(() => (
+    <View style={styles.categoryList}>
+      {state.checkTags.map((tag, idx) => (
+        <Tag
+          key={tag.key}
+          text={tag.key}
+          checked={tag.enable}
+          onCheckedChange={(v) => {
+            state.checkTags[idx].enable = v
+            state.checkTags = cloneDeep(state.checkTags)
+          }}
+          style={{ marginRight: cx(5), marginBottom: cx(5) }}
+        />
+      ))}
+    </View>
+  ), [state.checkTags])
 
   return (
     <Page
@@ -87,71 +122,76 @@ const FixedTimePage = () => {
         navigateToEdit('add', newFixedTime())
       }}
     >
-      {state.fixedTimeList.length > 0 ?
-        <ScrollView nestedScrollEnabled={true}>
-          <Text style={{
-            color: '#000',
-            marginLeft: cx(24),
-          }}>{I18n.getLang('timeschedule_overview_description_text')}</Text>
-          <Spacer height={cx(10)} />
-          {showMaxNumTip() && <View style={{ marginHorizontal: cx(24), flexDirection: 'row' }}>
-            <Image style={{ width: cx(16), height: cx(16), tintColor: '#ff9500' }} source={res.ic_warning_amber} />
-            <Text>{I18n.getLang('fixedtimecycle_warning_max_number_text')}</Text>
-          </View>}
-          <FlatList
-            data={state.fixedTimeList}
-            renderItem={({ item }) => (
-              <FixedTimeCard
-                is24Hour={is24Hour}
-                fixedTime={item}
-                onSwitch={async (v) => {
-                  state.loading = true
-                  await onPost('edit', {
-                    ...item,
-                    enable: v
-                  })
-                  state.loading = false
-                }}
-                onPress={() => {
-                  navigateToEdit('edit', item)
-                }}
-              />
-            )}
-            keyExtractor={(item: any) => `${item?.index}`}
-            ItemSeparatorComponent={() => <Spacer />}
-            ListHeaderComponent={<Spacer height={cx(10)} />}
-            ListFooterComponent={<Spacer />}
-          />
-        </ScrollView> :
-        <View style={{ flex: 1, marginTop: cx(60), alignItems: 'center' }}>
-          <Image
-            style={{ width: cx(225), height: cx(198) }}
-            source={{ uri: res.ldv_timer_empty }}
-            resizeMode="contain" />
-          <View style={{ flexDirection: 'row', alignItems: 'center' }}>
+      <ScrollView nestedScrollEnabled={true}>
+        <Text style={{
+          color: '#000',
+          marginLeft: cx(24),
+          fontSize: cx(12)
+        }}>{I18n.getLang('timeschedule_overview_description_text')}</Text>
+        <Spacer height={cx(10)} />
+        {showMaxNumTip() && <InfoText
+          style={{ marginHorizontal: cx(24), marginBottom: cx(5) }}
+          icon={res.ic_warning_amber}
+          iconStyle={{ width: cx(16), height: cx(16) }}
+          contentColor="#FF9500"
+          text={I18n.getLang('fixedtimecycle_warning_max_number_text')}
+          textStyle={{ fontSize: cx(12) }}
+        />}
+        {params.showTags && !!state.originList.length && showTags}
+        {state.fixedTimeList.length > 0 ? <FlatList
+          data={state.fixedTimeList}
+          renderItem={({ item }) => (
+            <FixedTimeCard
+              is24Hour={is24Hour}
+              fixedTime={item}
+              showTags={params.showTags}
+              tags={params.applyForList}
+              onSwitch={async (v) => {
+                state.loading = true
+                await onPost('edit', {
+                  ...item,
+                  enable: v
+                })
+                state.loading = false
+              }}
+              onPress={() => {
+                navigateToEdit('edit', item)
+              }}
+            />
+          )}
+          keyExtractor={(item: any) => `${item?.index}`}
+          ItemSeparatorComponent={() => <Spacer />}
+          ListHeaderComponent={<Spacer height={cx(10)} />}
+          ListFooterComponent={<Spacer />}
+        /> :
+          <View style={{ flex: 1, marginTop: cx(60), alignItems: 'center', marginHorizontal: cx(24) }}>
             <Image
-              source={{ uri: res.device_panel_schedule_alert }}
-              style={{ width: cx(16), height: cx(16) }}
+              style={{ width: cx(225), height: cx(198) }}
+              source={{ uri: res.ldv_timer_empty }}
+              resizeMode="contain" />
+            <InfoText
+              icon={res.device_panel_schedule_alert}
+              text={I18n.getLang(!state.originList.length ? 'fixedTimeCycle_information_text' : 'fixedTimeCycle_empty_filtering_information_text')}
+              style={{ width: 'auto', alignItems: 'center' }}
+              textStyle={{ color: '#000', fontSize: cx(12), flex: undefined }}
+              iconStyle={{ width: cx(16), height: cx(16), tintColor: '#000' }}
             />
-            <Text style={{ color: '#000', fontSize: cx(12) }}>
-              {I18n.getLang('fixedTimeCycle_information_text')}
-            </Text>
-          </View>
-          <Spacer />
-          <TextButton
-            text={I18n.getLang('fixedTimeCycle_bttn_text')}
-            style={{
-              backgroundColor: '#f60',
-              borderRadius: cx(6),
-              paddingVertical: cx(12),
-              paddingHorizontal: cx(24),
-            }}
-            textStyle={{ color: '#fff' }}
-            onPress={() => {
-              navigateToEdit('add', newFixedTime())
-            }} />
-        </View>
-      }
+            <Spacer />
+            {!state.originList.length && <TextButton
+              text={I18n.getLang('fixedTimeCycle_bttn_text')}
+              style={{
+                backgroundColor: '#f60',
+                borderRadius: cx(6),
+                paddingVertical: cx(12),
+                paddingHorizontal: cx(24),
+              }}
+              textStyle={{ color: '#fff' }}
+              onPress={() => {
+                navigateToEdit('add', newFixedTime())
+              }} />}
+          </View>}
+      </ScrollView>
+
     </Page>
   )
 }
@@ -159,10 +199,12 @@ const FixedTimePage = () => {
 const FixedTimeCard = memo((props: {
   is24Hour: boolean
   fixedTime: FixedTimerUiItem,
+  tags: ApplyForItem[]
+  showTags?: boolean,
   onSwitch: (enable: boolean) => void,
   onPress: () => void
 }) => {
-  const { is24Hour, fixedTime, onSwitch, onPress } = props
+  const { is24Hour, fixedTime, tags, showTags, onSwitch, onPress } = props
   return (
     <Card style={styles.randomTimingCard} onPress={onPress}>
       <Spacer height={cx(16)} />
@@ -178,7 +220,14 @@ const FixedTimeCard = memo((props: {
       <Text style={styles.loopText}>{loopText(fixedTime.weeks)}</Text>
       <Spacer height={cx(5)} />
       <Text style={styles.loopText}>{fixedTime.name}</Text>
-      <Spacer />
+      <Spacer height={cx(showTags ? 5 : 20)} />
+      {showTags && <View style={styles.tagContainer}>
+        <View style={styles.tag}>
+          <Text style={styles.tagTitle}>
+            {tags[fixedTime.channel || 0]?.key}
+          </Text>
+        </View>
+      </View>}
     </Card>
   )
 })
@@ -193,7 +242,7 @@ const newFixedTime = () => {
     endTime: startTime + 60,
     closeTime: 1,
     openTime: 1,
-    channel: 1,
+    channel: 0,
     color: {
       h: 0,
       s: 100,
@@ -226,6 +275,30 @@ const styles = StyleSheet.create({
     fontSize: cx(14),
     fontFamily: 'helvetica_neue_lt_std_roman',
   },
+  categoryList: {
+    display: 'flex',
+    flexDirection: 'row',
+    flexWrap: 'wrap',
+    marginHorizontal: cx(24),
+    alignSelf: 'flex-start'
+  },
+  tagContainer: {
+    flexDirection: 'row',
+    marginBottom: cx(15)
+  },
+  tag: {
+    borderRadius: cx(16),
+    height: cx(16),
+    backgroundColor: '#E6E7E8',
+    marginRight: cx(10),
+    paddingHorizontal: cx(12)
+  },
+  tagTitle: {
+    fontSize: cx(10),
+    textAlign: 'center',
+    fontFamily: 'PingFangSC-Medium',
+    color: '#000'
+  },
 })
 
 export default FixedTimePage

package/src/newModules/randomTime/RandomTimeActions.ts

@@ -7,7 +7,6 @@ import { padStart } from "lodash";
 import { hex2Int, spliceByStep } from "@ledvance/base/src/utils/common";
 import I18n from "@ledvance/base/src/i18n";
 import { parseJSON } from "@tuya/tuya-panel-lamp-sdk/lib/utils";
-import { useUpdateEffect } from "ahooks";
 import { Buffer } from "buffer";
 const { to16 } = Utils
 
@@ -21,6 +20,7 @@ export interface RandomTimerData {
 
 export interface RandomTimer {
   enable: boolean;
+  channel?: number;
   weeks: number[];
   startTime: number;
   endTime: number;
@@ -52,9 +52,9 @@ export interface PlugRandomTimerItem extends PlugRandomTimer {
 }
 
 let randomTimer
-type UseFixedTimeType = (dpKey: string, isPlug?: boolean) => [RandomTimerUiItem[], (randomTimeList: RandomTimerUiItem[], manualEdit?: boolean) => Promise<{ success: boolean }>]
+type UseFixedTimeType = (dpKey: string, isPlug?: boolean, disableFeature?: boolean) => [RandomTimerUiItem[], (randomTimeList: RandomTimerUiItem[], manualEdit?: boolean) => Promise<{ success: boolean }>]
 
-export const useRandomTime: UseFixedTimeType = (dpKey, isPlug) => {
+export const useRandomTime: UseFixedTimeType = (dpKey: string, isPlug?: boolean, disableFeature?: boolean) => {
   const deviceId = useDeviceId()
   const [randomTimeDp, setRandomTimeDp]: [string, (v: string) => Promise<Result<any>>] = useDp(dpKey)
   const [randomTimeUiList, setRandomTimeUiList] = useState<RandomTimerUiItem[]>([])
@@ -69,53 +69,55 @@ export const useRandomTime: UseFixedTimeType = (dpKey, isPlug) => {
 
   // 获取云端数据
   useEffect(() => {
+    // 不获取名称
+    if(disableFeature) {
+      setRandomTimeUiList(formatterFn())
+      return 
+    }
     randomTimer = setTimeout(() => {
-      getFeatureFn()
-    }, 400)
-    return () => clearTimeout(randomTimer)
-  }, [])
+      getFeature(deviceId, isPlug ? plug_randomFeatureId : randomFeatureId).then(res => {
+        if (res?.result) {
+          // 首次进入同步云端数据 （云端无数据）
+          if (!res.data) {
+            const cloudData = formatterFn()
+            setRandomTimeFn(cloudData).then()
+          } else {
+            const featureData = parseJSON(res.data)
+            if (randomTimeList.length) {
+              const uiPlan = randomTimeList?.map((item, idx: number) => {
+                const dp = randomTimeToHex(item, isPlug, true)
+                const random = featureData[idx]
+                const featureItem = random?.v && (isPlug ? parseJSON(random?.v)?.dp : random?.v)?.includes(dp) ? (isPlug ? parseJSON(random) : random) : featureData.find(feature => (isPlug ? parseJSON(feature?.v)?.dp : feature?.v).includes(dp))
+                return {
+                  ...item,
+                  index: idx,
+                  name: featureItem ? featureItem?.n : `${I18n.getLang('randomtimecycle_sockets_headline_text')} ${idx + 1}`
+                }
+              })
+              setRandomTimeUiList(uiPlan)
+            } else {
+              setRandomTimeUiList([])
+            }
+
+          }
+        }
+      })
+    }, 250)
 
-  useUpdateEffect(() =>{
-    randomTimer = setTimeout(() => {
-      getFeatureFn()
-    }, 100)
     return () => clearTimeout(randomTimer)
   }, [randomTimeDp])
 
-  const getFeatureFn = () => {
-    getFeature(deviceId, isPlug ? plug_randomFeatureId : randomFeatureId).then(res => {
-      if (res?.result) {
-        // 首次进入同步云端数据 （云端无数据）
-        if (!res.data) {
-          const cloudData = formatterFn()
-          setRandomTimeFn(cloudData).then()
-        } else {
-          const featureData = parseJSON(res.data)
-          if (randomTimeList.length) {
-            const uiPlan = randomTimeList?.map((item, idx: number) => {
-              const featureItem = featureData.find(feature =>  (isPlug ? parseJSON(feature?.v)?.dp : feature?.v) === randomTimeToHex(item, isPlug))
-              return {
-                ...item,
-                index: idx,
-                name: featureItem ? featureItem?.n : `${I18n.getLang('randomtimecycle_sockets_headline_text')} ${idx + 1}`
-              }
-            })
-            setRandomTimeUiList(uiPlan)
-          } else {
-            setRandomTimeUiList([])
-          }
-  
-        }
+  const setRandomTimeFn = async (randomTimeList: RandomTimerUiItem[]) => {
+    const randomData = randomTimeList.map(item => {
+      const randomHex = randomTimeToHex(item, isPlug)
+      return {
+        n: item?.name || '',
+        v: isPlug ? JSON.stringify({dp: randomHex}) : randomHex
       }
     })
-  }
-
-  const setRandomTimeFn = async (randomTimeList: RandomTimerUiItem[]) => {
-    const randomData = randomTimeList.map(item => ({
-      n: item?.name || '',
-      v: isPlug ? JSON.stringify({dp: randomTimeToHex(item, isPlug)}) : randomTimeToHex(item, isPlug)
-    }))
+    console.log(randomData, '< --- randomData')
     const cloudStatus = await putFeatureFn(deviceId, isPlug ? plug_randomFeatureId : randomFeatureId, JSON.stringify(randomData))
+    console.log(cloudStatus, '< --- cloudStatus')
     if (cloudStatus) {
       const randomTimerData = {
         version: 0,
@@ -157,7 +159,7 @@ const putFeatureFn = async (devId, featureId, data) => {
 }
 
 const randomTimeDp2Obj = (randomDp: string, isPlug?: boolean) => {
-  if (randomDp?.length <= 4) return
+  if (!randomDp || randomDp?.length <= 6) return
   if(isPlug){
     randomDp = Buffer.from(randomDp, 'base64').toString('hex')
   }
@@ -166,7 +168,11 @@ const randomTimeDp2Obj = (randomDp: string, isPlug?: boolean) => {
   const s = isPlug ? 0 : 4
   const n = isPlug ? 12 : 24
   const nodes = spliceByStep(randomDp.slice(s), n).map(plan => {
-    const enable = plan.slice(0, 2) === '01'
+    const powerInfo = padStart(parseInt(`${plan.slice(0, 2)}`, 16).toString(2), 8, '0');
+    const powerBits = powerInfo.split('');
+    const enable = !!Number(powerBits[powerBits.length - 1]);
+    // 通道号
+    const channel = parseInt(powerBits.slice(1, powerBits.length - 1).join(''), 2);
     const weeks = parseInt(plan.slice(2, 4), 16).toString(2).padStart(8, '0')
       .split('')
       .reverse()
@@ -174,7 +180,7 @@ const randomTimeDp2Obj = (randomDp: string, isPlug?: boolean) => {
     const startTime = hex2Int(plan.slice(4, 8))
     const endTime = hex2Int(plan.slice(8, 12))
     const common = {
-      enable, weeks, startTime, endTime
+      enable, channel, weeks, startTime, endTime
     }
     if (isPlug) {
       return common
@@ -210,9 +216,11 @@ const randomTimeObj2Dp = (randomTimerData: RandomTimerData, isPlug?: boolean) =>
 }
 
 
-const randomTimeToHex = (randomTime: RandomTimer, isPlug?: boolean) => {
-  const { weeks, startTime, endTime, enable } = randomTime
-  const enableStr = enable ? '01' : '00'
+const randomTimeToHex = (randomTime: RandomTimer, isPlug?: boolean, isFeatureData?: boolean) => {
+  const { weeks, startTime, endTime, channel, enable } = randomTime
+  const channelStr = padStart((channel ?? 0).toString(2), 7, '0');
+  const powerChannel = parseInt(`${channelStr}${enable ? 1 : 0}`, 2);
+  const powerChannelStr = to16(powerChannel, 2);
   const weeksValue: string = padStart([...weeks].reverse().join(''), 8, '0');
   const weeksStr = to16(parseInt(weeksValue, 2), 2);
   const startTimeStr = to16(startTime, 4);
@@ -227,6 +235,6 @@ const randomTimeToHex = (randomTime: RandomTimer, isPlug?: boolean) => {
     const temperatureStr = to16(temperature);
     colorHex = hueStr + saturationStr + valueStr + brightnessStr + temperatureStr
   }
-  return enableStr + weeksStr + startTimeStr + endTimeStr + colorHex
+  return (isFeatureData ? '' : powerChannelStr) + weeksStr + startTimeStr + endTimeStr + colorHex
 }
 

package/src/newModules/randomTime/RandomTimeDetailPage.tsx

@@ -36,8 +36,6 @@ const RandomTimeDetailPage = () => {
   const state = useReactive({
     loading: false,
     isColorMode: false,
-    selectedSkill: params.applyDps.length === 1 ? params.applyDps : [],
-    skillList: params.applyDps.length === 1 ? [] : params.applyDps,
     randomTime: cloneDeep(params.scheduleItem)
   })
 
@@ -49,20 +47,20 @@ const RandomTimeDetailPage = () => {
     }
   }, [])
 
-  const showClearIcon = useMemo(() => (
-    false
-  ), [state.skillList])
+  const checkItemChanged = useMemo(() =>{
+    return isEqual(state.randomTime, params.scheduleItem)
+  }, [params.scheduleItem, JSON.stringify(state.randomTime)])
 
   const canSubmit = useMemo(() => {
-    return state.randomTime.name?.length > 0 && state.randomTime.name?.length < 33 && !isEqual(params.scheduleItem, state.randomTime)
-  }, [JSON.stringify(state.randomTime)])
+    return state.randomTime.name?.length > 0 && state.randomTime.name?.length < 33 && !checkItemChanged && state.randomTime.channel !== undefined
+  }, [JSON.stringify(state.randomTime), checkItemChanged])
 
   return (
     <Page
       backText={I18n.getLang('randomtimecycle_sockets_headline_text')}
       rightButtonIcon={canSubmit ? res.ic_check : res.ic_uncheck}
       loading={state.loading}
-      showBackDialog={canSubmit}
+      showBackDialog={!checkItemChanged}
       backDialogTitle={I18n.getLang('cancel_dialog_leave_unsaved_titel')}
       backDialogContent={I18n.getLang('cancel_dialog_delete_item_randomtimecycle_description')}
       headlineText={I18n.getLang(params.mode === 'add' ? 'add_fixedtimecycle_headline_text' : 'edit_fixedtimecycle_headline_text')}
@@ -138,25 +136,31 @@ const RandomTimeDetailPage = () => {
         <View style={styles.cardContainer}>
           <Text style={styles.itemTitle}>{I18n.getLang('timeschedule_add_schedule_subheadline_text')}</Text>
           <Spacer height={cx(10)} />
-          <View style={styles.applyContent}>
-            {state.selectedSkill.length === 0 ?
+          <View style={[styles.applyContent, { paddingTop: state.randomTime.channel === undefined ? 0 : cx(10) }]}>
+            {state.randomTime.channel === undefined ?
               <Text>{I18n.getLang('timer_ceiling_fan_selectionfield_no_components_text')}</Text> :
-              state.selectedSkill.map((skill: any) => (
-                <View style={[styles.applyItem, { marginBottom: cx(10), borderRadius: 4 }]} key={skill.label}>
-                  <Text style={{ color: '#000' }}>{skill.label}</Text>
-                  {showClearIcon && <TouchableOpacity
-                    onPress={() => { }}
-                    style={{ paddingHorizontal: cx(5) }}>
-                    <Image style={{ width: cx(16), height: cx(16) }} source={res.ic_arrows_nav_clear} />
-                  </TouchableOpacity>}
-                </View>
-              ))
+              <View style={[styles.applyItem, { marginBottom: cx(10), borderRadius: 4 }]}>
+                <Text style={{ color: '#000', fontSize: cx(12) }}>{params.applyForList[state.randomTime.channel]?.key}</Text>
+                {params.applyForList.length > 1 && <TouchableOpacity
+                  onPress={() => {
+                    state.randomTime.channel = undefined
+                  }}
+                  style={{ paddingHorizontal: cx(5) }}>
+                  <Image style={{ width: cx(16), height: cx(16) }} source={res.ic_arrows_nav_clear} />
+                </TouchableOpacity>}
+              </View>
             }
           </View>
-          {state.skillList.map((item: any) => {
+          {params.applyForList.map((item, index) => {
+            if (state.randomTime.channel === index) return null
             return (
-              <TouchableOpacity style={styles.applyItem} key={item.label} onPress={() => { }}>
-                <Text style={{ color: '#000' }}>{item.label}</Text>
+              <TouchableOpacity
+                style={styles.applyItem}
+                key={item.key}
+                onPress={() => {
+                  state.randomTime.channel = index
+                }}>
+                <Text style={{ color: '#000', fontSize: cx(12) }}>{item.key}</Text>
                 <Image style={{ width: cx(16), height: cx(16) }} source={res.device_panel_timer_add} />
               </TouchableOpacity>
             )
@@ -177,9 +181,9 @@ const RandomTimeDetailPage = () => {
               showSwitch={false}
             />
             <LampAdjustView
-              isSupportColor={params.isSupportColor}
-              isSupportBrightness={params.isSupportBrightness}
-              isSupportTemperature={params.isSupportTemperature}
+              isSupportColor={!!params.isSupportColor}
+              isSupportBrightness={!!params.isSupportBrightness}
+              isSupportTemperature={!!params.isSupportTemperature}
               isColorMode={state.isColorMode}
               reserveSV={true}
               setIsColorMode={(v) => state.isColorMode = v}
@@ -226,11 +230,11 @@ const RandomTimeDetailPage = () => {
               onPress={() => {
                 showDialog({
                   method: 'confirm',
-                  title: I18n.getLang('cancel_dialog_delete_item_fixedtimecycle_titel'),
+                  title: I18n.getLang('cancel_dialog_delete_item_randomtimecycle_titel'),
                   subTitle: I18n.getLang('cancel_dialog_delete_item_fixedtimecycle_description'),
                   onConfirm: async (_, { close }) => {
-                    state.loading = true
                     close()
+                    state.loading = true
                     const res = await params.onPost('del', state.randomTime)
                     state.loading = false
                     if (res.success) {
@@ -319,4 +323,4 @@ const styles = StyleSheet.create({
   }
 })
 
-export default RandomTimeDetailPage
+export default RandomTimeDetailPage