feat: 添加演示模块并优化日期选择器组件

refactor: 重构文件导入组件为通用组件

fix: 修复导出文件名统一问题

docs: 更新README添加二次开发教程

style: 统一系统管理页面的日期选择器实现

chore: 更新数据库迁移脚本和初始化数据

perf: 优化前端页面日期范围选择交互

test: 添加演示模块相关测试文件

build: 更新依赖项配置

ci: 调整CI/CD脚本配置

frontend/src/components/DatePicker/index.vue

@@ -0,0 +1,83 @@
+<!-- 日期选择器 -->
+<template>
+  <div class="custom-date-picker">
+    <el-date-picker
+      :model-value="modelValue"
+      type="daterange"
+      range-separator="至"
+      start-placeholder="开始日期"
+      end-placeholder="结束日期"
+      :shortcuts="shortcuts"
+      @update:model-value="(val) => emit('update:model-value', val)"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { defineProps, defineEmits } from 'vue'
+
+// 定义组件属性
+defineProps({
+  modelValue: {
+    type: Array as unknown as () => [Date, Date] | [],
+    default: () => []
+  }
+})
+
+// 定义事件
+const emit = defineEmits(['update:model-value'])
+
+// 快捷选项配置
+const shortcuts = [
+  {
+    text: '近一天',
+    value: () => {
+      const end = new Date()
+      const start = new Date()
+      return [start, end]
+    }
+  },
+  {
+    text: '近三天',
+    value: () => {
+      const end = new Date()
+      const start = new Date()
+      start.setTime(start.getTime() - 3600 * 1000 * 24 * 3)
+      return [start, end]
+    }
+  },
+  {
+    text: '近一周',
+    value: () => {
+      const end = new Date()
+      const start = new Date()
+      start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
+      return [start, end]
+    }
+  },
+  {
+    text: '近一个月',
+    value: () => {
+      const end = new Date()
+      const start = new Date()
+      start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
+      return [start, end]
+    }
+  },
+  {
+    text: '近三个月',
+    value: () => {
+      const end = new Date()
+      const start = new Date()
+      start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
+      return [start, end]
+    }
+  }
+]
+</script>
+
+<style lang="scss" scoped>
+.custom-date-picker {
+  width: 100%;
+}
+</style>