ui: fix pick time with change event (#501)

packages/ui-default/components/autocomplete/DomainSelectAutoComplete.tsx

@@ -6,12 +6,12 @@ import AutoComplete from '.';
 import DomainSelectAutoCompleteFC from './components/DomainSelectAutoComplete';
 
 const Component = React.forwardRef((props: { value: string, multi: boolean, onChange: (v: string) => void }, ref) => {
-  const [value, setValue] = React.useState(props.value);
+  const [value, setValue] = React.useState(props.value ?? '');
   return (
     <DomainSelectAutoCompleteFC
       ref={ref as any}
       height="34px"
-      selectedKeys={value.split(',').map((i) => i.trim())}
+      selectedKeys={value.split(',').map((i) => i.trim()).filter((i) => i)}
       onChange={(v) => {
         setValue(v);
         props.onChange(v);

packages/ui-default/components/autocomplete/ProblemSelectAutoComplete.tsx

@@ -6,7 +6,7 @@ import AutoComplete from '.';
 import ProblemSelectAutoCompleteFC from './components/ProblemSelectAutoComplete';
 
 const Component = React.forwardRef<any, any>((props, ref) => {
-  const [value, setValue] = React.useState(props.value);
+  const [value, setValue] = React.useState(props.value ?? '');
   return (
     <ProblemSelectAutoCompleteFC
       ref={ref as any}

packages/ui-default/components/autocomplete/UserSelectAutoComplete.tsx

@@ -6,7 +6,7 @@ import AutoComplete, { AutoCompleteOptions } from '.';
 import UserSelectAutoCompleteFC from './components/UserSelectAutoComplete';
 
 const Component = React.forwardRef<any, any>((props, ref) => {
-  const [value, setValue] = React.useState(props.value);
+  const [value, setValue] = React.useState(props.value ?? '');
   return (
     <UserSelectAutoCompleteFC
       ref={ref as any}

packages/ui-default/components/datepicker/datepicker.page.tsx

@@ -11,13 +11,15 @@ const datepickerPage = new AutoloadPage('datepickerPage', async () => {
     flatpickr(this, { allowInput: true });
   });
   $('[data-pick-time]').each(function () {
-    if (!$(this).data('pickatime')) {
+    const $this = $(this);
+    if (!$this.data('pickatime')) {
       // eslint-disable-next-line no-new
       new Picker(this, 'pickatime', TimePicker, {
         format: 'H:i',
         editable: true,
         interval: 15,
         clear: false,
+        onSet() { $this.trigger('change'); },
       });
     }
   });