66 */
77import { t } from "@app/locale"
88import { ElOption , ElSelect , ElTimePicker } from "element-plus"
9- import { computed , defineComponent , toRef , watch , type PropType } from "vue"
9+ import { computed , defineComponent } from "vue"
1010
1111const ALL_MODES : timer . option . DarkMode [ ] = [ "default" , "on" , "off" , "timed" ]
1212
@@ -29,65 +29,45 @@ function computeDateToSecond(date: Date) {
2929 return hour * 3600 + minute * 60 + second
3030}
3131
32- const _default = defineComponent ( {
33- props : {
34- modelValue : {
35- type : String as PropType < timer . option . DarkMode > ,
36- required : true ,
37- } ,
38- startSecond : Number ,
39- endSecond : Number
40- } ,
41- emits : {
42- change : ( _darkMode : timer . option . DarkMode , [ _startSecond , _endSecond ] : [ number ?, number ?] ) => true
43- } ,
44- setup ( props , ctx ) {
45- const darkMode = toRef ( props , 'modelValue' )
46- const startSecond = toRef ( props , 'startSecond' )
47- const endSecond = toRef ( props , 'endSecond' )
48- const start = computed ( {
49- get : ( ) => startSecond . value && computeSecondToDate ( startSecond . value ) ,
50- set : val => startSecond . value = val && computeDateToSecond ( val ) ,
51- } )
52- const end = computed ( {
53- get : ( ) => endSecond . value && computeSecondToDate ( endSecond . value ) ,
54- set : val => endSecond . value = val && computeDateToSecond ( val ) ,
55- } )
32+ type Props = {
33+ modelValue : timer . option . DarkMode
34+ startSecond ?: number
35+ endSecond ?: number
36+ onChange ?: ( darkMode : timer . option . DarkMode , [ startSecond , endSecond ] : [ number ?, number ?] ) => void
37+ }
5638
57- watch (
58- [ startSecond , endSecond , darkMode ] ,
59- ( ) => ctx . emit ( "change" , darkMode . value , [ startSecond . value , endSecond . value ] )
60- )
39+ const _default = defineComponent < Props > ( props => {
40+ const start = computed ( ( ) => props . startSecond && computeSecondToDate ( props . startSecond ) )
41+ const end = computed ( ( ) => props . endSecond && computeSecondToDate ( props . endSecond ) )
6142
62- return ( ) => < >
63- < ElSelect
64- modelValue = { darkMode . value }
43+ return ( ) => < >
44+ < ElSelect
45+ modelValue = { props . modelValue }
46+ size = "small"
47+ style = { { width : "120px" } }
48+ onChange = { val => props . onChange ?.( val as timer . option . DarkMode , [ props . startSecond , props . endSecond ] ) }
49+ >
50+ {
51+ ALL_MODES . map ( value => < ElOption value = { value } label = { t ( msg => msg . option . appearance . darkMode . options [ value ] ) } /> )
52+ }
53+ </ ElSelect >
54+ { props . modelValue === "timed" && < >
55+ < ElTimePicker
56+ modelValue = { start . value }
57+ size = "small"
58+ style = { { marginLeft : "10px" } }
59+ onUpdate :modelValue = { val => props . onChange ?.( props . modelValue , [ computeDateToSecond ( val ) , props . endSecond ] ) }
60+ clearable = { false }
61+ />
62+ < a > -</ a >
63+ < ElTimePicker
64+ modelValue = { end . value }
6565 size = "small"
66- style = { { width : "120px" } }
67- onChange = { val => darkMode . value = val as timer . option . DarkMode }
68- >
69- {
70- ALL_MODES . map ( value => < ElOption value = { value } label = { t ( msg => msg . option . appearance . darkMode . options [ value ] ) } /> )
71- }
72- </ ElSelect >
73- { darkMode . value === "timed" && < >
74- < ElTimePicker
75- modelValue = { start . value }
76- size = "small"
77- style = { { marginLeft : "10px" } }
78- onUpdate :modelValue = { val => start . value = val }
79- clearable = { false }
80- />
81- < a > -</ a >
82- < ElTimePicker
83- modelValue = { end . value }
84- size = "small"
85- onUpdate :modelValue = { val => end . value = val }
86- clearable = { false }
87- />
88- </ > }
89- </ >
90- }
91- } )
66+ onUpdate :modelValue = { val => props . onChange ?.( props . modelValue , [ props . startSecond , computeDateToSecond ( val ) ] ) }
67+ clearable = { false }
68+ />
69+ </ > }
70+ </ >
71+ } , { props : [ 'modelValue' , 'startSecond' , 'endSecond' , 'onChange' ] } )
9272
9373export default _default
0 commit comments