econtrol-tools-calendar 1.0.1 → 1.0.2

package/README.md

@@ -28,9 +28,11 @@ yarn add econtrol-tools-calendar
 
 ### 基本使用
 
+如果已经通过 `app.use(SCalendar)` 全局注册了组件，可以直接使用：
+
 ```vue
 <template>
-  <FullCalendarDemo
+  <SCalendar
     :events="events"
     :userid="currentUserId"
     :device-id="deviceId"
@@ -45,7 +47,6 @@ yarn add econtrol-tools-calendar
 <script setup lang="ts">
 import { ref } from "vue";
 import { ElMessage } from "element-plus";
-import { FullCalendarDemo } from "econtrol-tools-calendar";
 import type { EventInput } from "@fullcalendar/core";
 import "econtrol-tools-calendar/style.css";
 // 注意：还需要导入 Element Plus 的样式
@@ -100,22 +101,48 @@ function handleEventsChange(newEvents: EventInput[]) {
 </script>
 ```
 
-### 全局注册
+**注意**：如果没有全局注册组件，需要导入组件：
+
+```vue
+<script setup lang="ts">
+import { SCalendarComponent } from "econtrol-tools-calendar";
+// ... 其他代码
+</script>
+
+<template>
+  <SCalendarComponent
+    :events="events"
+    :userid="currentUserId"
+    :device-id="deviceId"
+    :holidays="holidays"
+    @event-added="handleEventAdded"
+    @event-updated="handleEventUpdated"
+    @event-deleted="handleEventDeleted"
+    @events-change="handleEventsChange"
+  />
+</template>
+```
+
+### 全局注册组件（推荐）
+
+使用插件方式全局注册组件：
 
 ```typescript
 import { createApp } from "vue";
 import App from "./App.vue";
 import ElementPlus from "element-plus";
 import "element-plus/dist/index.css";
-import { install } from "econtrol-tools-calendar";
+import SCalendar from "econtrol-tools-calendar";
 import "econtrol-tools-calendar/style.css";
 
 const app = createApp(App);
 app.use(ElementPlus); // 需要先注册 Element Plus
-app.use(install);
+app.use(SCalendar); // 全局注册 SCalendar 组件
 app.mount("#app");
 ```
 
+注册后，可以在任何组件中直接使用 `<SCalendar />`，无需再次导入。
+
 ## 📖 API 文档
 
 ### Props
@@ -196,7 +223,7 @@ interface EventInput {
 ```vue
 <template>
   <div>
-    <FullCalendarDemo
+    <SCalendar
       :is-occupied="isOccupied"
       :allow-overlap="allowOverlap"
       :userid="currentUserId"
@@ -219,7 +246,7 @@ interface EventInput {
 <script setup lang="ts">
 import { ref } from "vue";
 import { ElMessage } from "element-plus";
-import { FullCalendarDemo, getHolidays } from "econtrol-tools-calendar";
+import { SCalendarComponent, getHolidays } from "econtrol-tools-calendar";
 import type { EventInput } from "@fullcalendar/core";
 import "econtrol-tools-calendar/style.css";
 import "element-plus/dist/index.css";
@@ -312,7 +339,7 @@ function handleQuickAddSaved(event: EventInput) {
 ```vue
 <template>
   <div class="devices-container">
-    <FullCalendarDemo
+    <SCalendar
       v-for="device in devices"
       :key="device.id"
       :device-id="device.id"
@@ -329,7 +356,7 @@ function handleQuickAddSaved(event: EventInput) {
 
 <script setup lang="ts">
 import { ref } from "vue";
-import { FullCalendarDemo } from "econtrol-tools-calendar";
+import { SCalendarComponent } from "econtrol-tools-calendar";
 import type { EventInput } from "@fullcalendar/core";
 
 const devices = ref([

package/dist/calendar.js

@@ -83,7 +83,7 @@ const _hoisted_30 = {
   class: "device-detail-loading"
 };
 const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "FullCalendarDemo",
+  __name: "S-Calendar",
   props: {
     isOccupied: { type: Boolean, default: false },
     allowOverlap: { type: Boolean, default: true },
@@ -1534,7 +1534,7 @@ const _export_sfc = (sfc, props) => {
   }
   return target;
 };
-const FullCalendarDemo = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-7684c35e"]]);
+const SCalendarComponent = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9e494e20"]]);
 function getHolidays(year) {
   const holidays = {};
   if (year === 2026) {
@@ -1585,15 +1585,16 @@ function formatDate(date) {
   const day = String(date.getDate()).padStart(2, "0");
   return `${year}-${month}-${day}`;
 }
-function install(app) {
-  app.component("FullCalendarDemo", FullCalendarDemo);
-}
+const SCalendar = {
+  install(app) {
+    app.component("SCalendar", SCalendarComponent);
+  }
+};
 export {
-  FullCalendarDemo,
-  FullCalendarDemo as default,
+  SCalendarComponent,
+  SCalendar as default,
   formatDate,
   getHolidays,
-  install,
   isHoliday
 };
 //# sourceMappingURL=calendar.js.map