---初始化后台管理web页面项目

src/components/TimePicker/index.ts

@@ -0,0 +1,4 @@
+import { withInstall } from '/@/utils/index';
+import timepicker from './src/TimePicker.vue';
+
+export const TimePicker = withInstall(timepicker);

src/components/TimePicker/src/TimePicker.vue

@@ -0,0 +1,44 @@
+<template>
+  <a-time-picker
+    :size="size"
+    v-model:value="modelValue"
+    :placeholder="placeholder"
+    :format="format"
+    :valueFormat="format"
+    :allowClear="allowClear"
+    :disabled="disabled"
+    @change="handleChange"
+  />
+</template>
+<script lang="ts" setup>
+  import dayjs from 'dayjs';
+  import { ref, watch } from 'vue';
+
+  const props = defineProps({
+    value: [dayjs, String, Object],
+    size: String,
+    placeholder: String,
+    format: String,
+    allowClear: Boolean,
+    disabled: Boolean,
+  });
+  const modelValue = ref<string>();
+  const emit = defineEmits(['update:value', 'change']);
+  watch(
+    () => props.value,
+    (val) => {
+      if (val && typeof val !== 'string') {
+        modelValue.value = val?.format(props.format);
+      } else {
+        modelValue.value = val || '';
+      }
+    },
+    {
+      immediate: true,
+    },
+  );
+  const handleChange = (time) => {
+    emit('update:value', time);
+    emit('change');
+  };
+</script>