@composy/log-viewer-vue 0.0.1 → 0.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +57 -0
- package/README.md +39 -25
- package/dist/index.css +379 -2
- package/dist/index.js +45 -34
- package/dist/index.js.map +1 -1
- package/dist/index.min.css +1 -3
- package/dist/index.min.js +195 -1
- package/dist/index.min.js.map +1 -0
- package/es/.dts-output-manifest.json +1 -0
- package/es/.dts.tsbuildinfo +1 -0
- package/es/components/LogViewer.js +1 -1
- package/es/components/LogViewer.js.map +1 -1
- package/es/components/LogViewer.vue_vue_type_script_setup_true_lang.js +16 -15
- package/es/components/LogViewer.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/es/composables/useLogViewer.d.ts +3 -1
- package/es/composables/useLogViewer.d.ts.map +1 -1
- package/es/composables/useLogViewer.js +17 -7
- package/es/composables/useLogViewer.js.map +1 -1
- package/es/index.d.ts +0 -1
- package/es/index.js +2 -2
- package/es/index.js.map +1 -1
- package/es/plugin.d.ts +0 -1
- package/es/plugin.js +1 -1
- package/es/plugin.js.map +1 -1
- package/es/style/css.js +1 -1
- package/es/style/index.css +380 -0
- package/es/style/index.js +1 -1
- package/esm/components/LogViewer.js +17 -0
- package/esm/components/LogViewer.js.map +1 -0
- package/esm/components/LogViewer.vue_vue_type_script_setup_true_lang.js +110 -0
- package/esm/components/LogViewer.vue_vue_type_script_setup_true_lang.js.map +1 -0
- package/esm/composables/useLogViewer.d.ts +119 -0
- package/esm/composables/useLogViewer.d.ts.map +1 -0
- package/esm/composables/useLogViewer.js +123 -0
- package/esm/composables/useLogViewer.js.map +1 -0
- package/esm/index.d.ts.map +1 -0
- package/esm/index.js +19 -0
- package/esm/index.js.map +1 -0
- package/esm/plugin.d.ts.map +1 -0
- package/esm/plugin.js +18 -0
- package/esm/plugin.js.map +1 -0
- package/esm/style/css.js +1 -0
- package/esm/style/index.js +1 -0
- package/esm/style/index.less +434 -0
- package/lib/components/LogViewer.cjs +1 -1
- package/lib/components/LogViewer.cjs.map +1 -1
- package/lib/components/LogViewer.vue_vue_type_script_setup_true_lang.cjs +22 -21
- package/lib/components/LogViewer.vue_vue_type_script_setup_true_lang.cjs.map +1 -1
- package/lib/composables/useLogViewer.cjs +23 -13
- package/lib/composables/useLogViewer.cjs.map +1 -1
- package/lib/composables/{useLogViewer.d.ts → useLogViewer.d.cts} +3 -1
- package/lib/composables/useLogViewer.d.cts.map +1 -0
- package/lib/index.cjs +1 -1
- package/lib/index.cjs.map +1 -1
- package/lib/index.d.cts +14 -0
- package/lib/index.d.cts.map +1 -0
- package/lib/plugin.cjs +1 -1
- package/lib/plugin.cjs.map +1 -1
- package/lib/plugin.d.cts +7 -0
- package/lib/plugin.d.cts.map +1 -0
- package/lib/style/index.css +380 -2
- package/package.json +24 -16
- package/es/style/index.less +0 -1
- /package/{lib → esm}/index.d.ts +0 -0
- /package/{lib → esm}/plugin.d.ts +0 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LogViewer.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../src/components/LogViewer.vue","../../src/components/LogViewer.vue"],"sourcesContent":["<!--\r\n @file 日志查看器组件\r\n @description LDesign 日志查看器组件,支持日志过滤、差异对比、异常标记等功能\r\n-->\r\n<script setup lang=\"ts\">\r\nimport { onMounted, onUnmounted, ref, watch } from 'vue-demi'\r\nimport {\r\n createLogViewer,\r\n type LogViewerConfig,\r\n type LogEntry,\r\n type FilterConfig,\r\n type ThemeMode,\r\n type LogViewer as LogViewerInstance,\r\n} from '@composy/log-viewer-core'\r\n\r\nconst props = withDefaults(\r\n defineProps<{\r\n data?: LogEntry[]\r\n filter?: FilterConfig\r\n theme?: ThemeMode\r\n pageSize?: number\r\n showFilter?: boolean\r\n showDiff?: boolean\r\n showAnomalyBadge?: boolean\r\n }>(),\r\n {\r\n data: () => [],\r\n theme: 'light',\r\n pageSize: 20,\r\n showFilter: true,\r\n showDiff: true,\r\n showAnomalyBadge: true,\r\n }\r\n)\r\n\r\nconst emit = defineEmits<{\r\n entryClick: [entry: LogEntry]\r\n entryExpand: [entry: LogEntry]\r\n entryCollapse: [entry: LogEntry]\r\n filterChange: [filter: FilterConfig]\r\n themeChange: [theme: ThemeMode]\r\n pageChange: [page: number]\r\n}>()\r\n\r\nconst containerRef = ref<HTMLElement | null>(null)\r\nlet instance: LogViewerInstance | null = null\r\n\r\nonMounted(() => {\r\n if (!containerRef.value) return\r\n\r\n instance = createLogViewer({\r\n container: containerRef.value,\r\n data: props.data,\r\n filter: props.filter,\r\n theme: props.theme,\r\n pageSize: props.pageSize,\r\n showFilter: props.showFilter,\r\n showDiff: props.showDiff,\r\n showAnomalyBadge: props.showAnomalyBadge,\r\n })\r\n\r\n instance.on('entry:click', (entry: LogEntry) => emit('entryClick', entry))\r\n instance.on('entry:expand', (entry: LogEntry) => emit('entryExpand', entry))\r\n instance.on('entry:collapse', (entry: LogEntry) =>\r\n emit('entryCollapse', entry)\r\n )\r\n instance.on('filter:change', (filter: FilterConfig) =>\r\n emit('filterChange', filter)\r\n )\r\n instance.on('theme:change', (theme: ThemeMode) => emit('themeChange', theme))\r\n instance.on('page:change', (page: number) => emit('pageChange', page))\r\n})\r\n\r\nwatch(\r\n () => props.data,\r\n newData => {\r\n instance?.setData(newData)\r\n },\r\n { deep: true }\r\n)\r\n\r\nwatch(\r\n () => props.filter,\r\n newFilter => {\r\n instance?.setFilter(newFilter || {})\r\n },\r\n { deep: true }\r\n)\r\n\r\nwatch(\r\n () => props.theme,\r\n newTheme => {\r\n instance?.setTheme(newTheme)\r\n }\r\n)\r\n\r\nonUnmounted(() => {\r\n instance?.destroy()\r\n instance = null\r\n})\r\n\r\ndefineExpose({\r\n getInstance: () => instance,\r\n})\r\n</script>\r\n\r\n<template>\r\n <div ref=\"containerRef\" class=\"lv-vue-root\"></div>\r\n</template>\r\n","<!--\r\n @file 日志查看器组件\r\n @description LDesign 日志查看器组件,支持日志过滤、差异对比、异常标记等功能\r\n-->\r\n<script setup lang=\"ts\">\r\nimport { onMounted, onUnmounted, ref, watch } from 'vue-demi'\r\nimport {\r\n createLogViewer,\r\n type LogViewerConfig,\r\n type LogEntry,\r\n type FilterConfig,\r\n type ThemeMode,\r\n type LogViewer as LogViewerInstance,\r\n} from '@composy/log-viewer-core'\r\n\r\nconst props = withDefaults(\r\n defineProps<{\r\n data?: LogEntry[]\r\n filter?: FilterConfig\r\n theme?: ThemeMode\r\n pageSize?: number\r\n showFilter?: boolean\r\n showDiff?: boolean\r\n showAnomalyBadge?: boolean\r\n }>(),\r\n {\r\n data: () => [],\r\n theme: 'light',\r\n pageSize: 20,\r\n showFilter: true,\r\n showDiff: true,\r\n showAnomalyBadge: true,\r\n }\r\n)\r\n\r\nconst emit = defineEmits<{\r\n entryClick: [entry: LogEntry]\r\n entryExpand: [entry: LogEntry]\r\n entryCollapse: [entry: LogEntry]\r\n filterChange: [filter: FilterConfig]\r\n themeChange: [theme: ThemeMode]\r\n pageChange: [page: number]\r\n}>()\r\n\r\nconst containerRef = ref<HTMLElement | null>(null)\r\nlet instance: LogViewerInstance | null = null\r\n\r\nonMounted(() => {\r\n if (!containerRef.value) return\r\n\r\n instance = createLogViewer({\r\n container: containerRef.value,\r\n data: props.data,\r\n filter: props.filter,\r\n theme: props.theme,\r\n pageSize: props.pageSize,\r\n showFilter: props.showFilter,\r\n showDiff: props.showDiff,\r\n showAnomalyBadge: props.showAnomalyBadge,\r\n })\r\n\r\n instance.on('entry:click', (entry: LogEntry) => emit('entryClick', entry))\r\n instance.on('entry:expand', (entry: LogEntry) => emit('entryExpand', entry))\r\n instance.on('entry:collapse', (entry: LogEntry) =>\r\n emit('entryCollapse', entry)\r\n )\r\n instance.on('filter:change', (filter: FilterConfig) =>\r\n emit('filterChange', filter)\r\n )\r\n instance.on('theme:change', (theme: ThemeMode) => emit('themeChange', theme))\r\n instance.on('page:change', (page: number) => emit('pageChange', page))\r\n})\r\n\r\nwatch(\r\n () => props.data,\r\n newData => {\r\n instance?.setData(newData)\r\n },\r\n { deep: true }\r\n)\r\n\r\nwatch(\r\n () => props.filter,\r\n newFilter => {\r\n instance?.setFilter(newFilter || {})\r\n },\r\n { deep: true }\r\n)\r\n\r\nwatch(\r\n () => props.theme,\r\n newTheme => {\r\n instance?.setTheme(newTheme)\r\n }\r\n)\r\n\r\nonUnmounted(() => {\r\n instance?.destroy()\r\n instance = null\r\n})\r\n\r\ndefineExpose({\r\n getInstance: () => instance,\r\n})\r\n</script>\r\n\r\n<template>\r\n <div ref=\"containerRef\" class=\"lv-vue-root\"></div>\r\n</template>\r\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAeA,MAAM,QAAQ;EAoBd,MAAM,OAAO;EASb,MAAM,eAAe,IAAwB,IAAI;EACjD,IAAI,WAAqC;EAEzC,gBAAgB;GACd,IAAI,CAAC,aAAa,OAAO;GAEzB,WAAW,gBAAgB;IACzB,WAAW,aAAa;IACxB,MAAM,MAAM;IACZ,QAAQ,MAAM;IACd,OAAO,MAAM;IACb,UAAU,MAAM;IAChB,YAAY,MAAM;IAClB,UAAU,MAAM;IAChB,kBAAkB,MAAM;GAC1B,CAAC;GAED,SAAS,GAAG,gBAAgB,UAAoB,KAAK,cAAc,KAAK,CAAC;GACzE,SAAS,GAAG,iBAAiB,UAAoB,KAAK,eAAe,KAAK,CAAC;GAC3E,SAAS,GAAG,mBAAmB,UAC7B,KAAK,iBAAiB,KAAK,CAC7B;GACA,SAAS,GAAG,kBAAkB,WAC5B,KAAK,gBAAgB,MAAM,CAC7B;GACA,SAAS,GAAG,iBAAiB,UAAqB,KAAK,eAAe,KAAK,CAAC;GAC5E,SAAS,GAAG,gBAAgB,SAAiB,KAAK,cAAc,IAAI,CAAC;EACvE,CAAC;EAED,YACQ,MAAM,OACZ,YAAW;GACT,UAAU,QAAQ,OAAO;EAC3B,GACA,EAAE,MAAM,KAAK,CACf;EAEA,YACQ,MAAM,SACZ,cAAa;GACX,UAAU,UAAU,aAAa,CAAC,CAAC;EACrC,GACA,EAAE,MAAM,KAAK,CACf;EAEA,YACQ,MAAM,QACZ,aAAY;GACV,UAAU,SAAS,QAAQ;EAC7B,CACF;EAEA,kBAAkB;GAChB,UAAU,QAAQ;GAClB,WAAW;EACb,CAAC;EAED,SAAa,EACX,mBAAmB,SACrB,CAAC;;uBCIC,mBAAkD,OAAA;aAAzC;IAAJ,KAAI;IAAe,OAAM"}
|
|
@@ -0,0 +1,119 @@
|
|
|
1
|
+
import { type LogViewer, type LogViewerConfig, type LogEntry, type FilterConfig, type ThemeMode, type PaginationConfig } from '@composy/log-viewer-core';
|
|
2
|
+
/**
|
|
3
|
+
* useLogViewer - use Log Viewer function
|
|
4
|
+
* @returns 返回值说明
|
|
5
|
+
*/
|
|
6
|
+
export declare function useLogViewer(): {
|
|
7
|
+
instance: import("vue").Ref<{
|
|
8
|
+
getData: () => LogEntry[];
|
|
9
|
+
setData: (entries: LogEntry[]) => void;
|
|
10
|
+
appendData: (entries: LogEntry[]) => void;
|
|
11
|
+
getFilter: () => FilterConfig;
|
|
12
|
+
setFilter: (filter: FilterConfig) => void;
|
|
13
|
+
resetFilter: () => void;
|
|
14
|
+
getTheme: () => ThemeMode;
|
|
15
|
+
setTheme: (theme: ThemeMode) => void;
|
|
16
|
+
expandEntry: (id: string) => void;
|
|
17
|
+
collapseEntry: (id: string) => void;
|
|
18
|
+
collapseAll: () => void;
|
|
19
|
+
goToPage: (page: number) => void;
|
|
20
|
+
getPagination: () => PaginationConfig;
|
|
21
|
+
on: (event: string, callback: (...args: unknown[]) => void) => () => void;
|
|
22
|
+
refresh: () => void;
|
|
23
|
+
loadData: () => Promise<void>;
|
|
24
|
+
destroy: () => void;
|
|
25
|
+
}, LogViewer | {
|
|
26
|
+
getData: () => LogEntry[];
|
|
27
|
+
setData: (entries: LogEntry[]) => void;
|
|
28
|
+
appendData: (entries: LogEntry[]) => void;
|
|
29
|
+
getFilter: () => FilterConfig;
|
|
30
|
+
setFilter: (filter: FilterConfig) => void;
|
|
31
|
+
resetFilter: () => void;
|
|
32
|
+
getTheme: () => ThemeMode;
|
|
33
|
+
setTheme: (theme: ThemeMode) => void;
|
|
34
|
+
expandEntry: (id: string) => void;
|
|
35
|
+
collapseEntry: (id: string) => void;
|
|
36
|
+
collapseAll: () => void;
|
|
37
|
+
goToPage: (page: number) => void;
|
|
38
|
+
getPagination: () => PaginationConfig;
|
|
39
|
+
on: (event: string, callback: (...args: unknown[]) => void) => () => void;
|
|
40
|
+
refresh: () => void;
|
|
41
|
+
loadData: () => Promise<void>;
|
|
42
|
+
destroy: () => void;
|
|
43
|
+
}>;
|
|
44
|
+
data: import("vue").Ref<{
|
|
45
|
+
id: string;
|
|
46
|
+
timestamp: string | number | Date;
|
|
47
|
+
user: string;
|
|
48
|
+
userId?: string;
|
|
49
|
+
action: import("@composy/log-viewer-core").ActionType;
|
|
50
|
+
module: string;
|
|
51
|
+
detail?: string;
|
|
52
|
+
ip?: string;
|
|
53
|
+
changes?: {
|
|
54
|
+
field: string;
|
|
55
|
+
label?: string;
|
|
56
|
+
oldValue: unknown;
|
|
57
|
+
newValue: unknown;
|
|
58
|
+
}[];
|
|
59
|
+
metadata?: Record<string, unknown>;
|
|
60
|
+
anomaly?: import("@composy/log-viewer-core").AnomalyType;
|
|
61
|
+
}[], LogEntry[] | {
|
|
62
|
+
id: string;
|
|
63
|
+
timestamp: string | number | Date;
|
|
64
|
+
user: string;
|
|
65
|
+
userId?: string;
|
|
66
|
+
action: import("@composy/log-viewer-core").ActionType;
|
|
67
|
+
module: string;
|
|
68
|
+
detail?: string;
|
|
69
|
+
ip?: string;
|
|
70
|
+
changes?: {
|
|
71
|
+
field: string;
|
|
72
|
+
label?: string;
|
|
73
|
+
oldValue: unknown;
|
|
74
|
+
newValue: unknown;
|
|
75
|
+
}[];
|
|
76
|
+
metadata?: Record<string, unknown>;
|
|
77
|
+
anomaly?: import("@composy/log-viewer-core").AnomalyType;
|
|
78
|
+
}[]>;
|
|
79
|
+
filter: import("vue").Ref<{
|
|
80
|
+
user?: string;
|
|
81
|
+
action?: import("@composy/log-viewer-core").ActionType | import("@composy/log-viewer-core").ActionType[];
|
|
82
|
+
module?: string;
|
|
83
|
+
ip?: string;
|
|
84
|
+
timeRange?: [Date | string | number, Date | string | number];
|
|
85
|
+
keyword?: string;
|
|
86
|
+
}, FilterConfig | {
|
|
87
|
+
user?: string;
|
|
88
|
+
action?: import("@composy/log-viewer-core").ActionType | import("@composy/log-viewer-core").ActionType[];
|
|
89
|
+
module?: string;
|
|
90
|
+
ip?: string;
|
|
91
|
+
timeRange?: [Date | string | number, Date | string | number];
|
|
92
|
+
keyword?: string;
|
|
93
|
+
}>;
|
|
94
|
+
theme: import("vue").Ref<ThemeMode, ThemeMode>;
|
|
95
|
+
pagination: import("vue").Ref<{
|
|
96
|
+
page: number;
|
|
97
|
+
pageSize: number;
|
|
98
|
+
total?: number;
|
|
99
|
+
}, PaginationConfig | {
|
|
100
|
+
page: number;
|
|
101
|
+
pageSize: number;
|
|
102
|
+
total?: number;
|
|
103
|
+
}>;
|
|
104
|
+
create: (container: HTMLElement | string, config?: Partial<LogViewerConfig>) => void;
|
|
105
|
+
setData: (entries: LogEntry[]) => void;
|
|
106
|
+
appendData: (entries: LogEntry[]) => void;
|
|
107
|
+
setFilter: (f: FilterConfig) => void;
|
|
108
|
+
resetFilter: () => void;
|
|
109
|
+
setTheme: (t: ThemeMode) => void;
|
|
110
|
+
expandEntry: (id: string) => void;
|
|
111
|
+
collapseEntry: (id: string) => void;
|
|
112
|
+
collapseAll: () => void;
|
|
113
|
+
goToPage: (page: number) => void;
|
|
114
|
+
refresh: () => void;
|
|
115
|
+
loadData: () => Promise<void>;
|
|
116
|
+
destroy: () => void;
|
|
117
|
+
on: (event: string, callback: (...args: unknown[]) => void) => () => void;
|
|
118
|
+
};
|
|
119
|
+
//# sourceMappingURL=useLogViewer.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useLogViewer.d.ts","sourceRoot":"","sources":["../../src/composables/useLogViewer.ts"],"names":[],"mappings":"AAIA,OAAO,EAEL,KAAK,SAAS,EACd,KAAK,eAAe,EACpB,KAAK,QAAQ,EACb,KAAK,YAAY,EACjB,KAAK,SAAS,EACd,KAAK,gBAAgB,EACtB,MAAM,0BAA0B,CAAA;AAEjC;;;GAGG;AACH,wBAAgB,YAAY;;;;;;;;;;;;;;;uCA+BP,GAAG;;;;;;;;;;;;;;;;;;uCAAH,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBAvBT,WAAW,GAAG,MAAM,WACtB,OAAO,CAAC,eAAe,CAAC;uBAiCT,QAAQ,EAAE;0BAKP,QAAQ,EAAE;mBAKjB,YAAY;;kBAUb,SAAS;sBAKL,MAAM;wBAIJ,MAAM;;qBAQT,MAAM;;;;gBAyBrB,MAAM,YACH,CAAC,GAAG,IAAI,EAAE,OAAO,EAAE,KAAK,IAAI,KACrC,MAAM,IAAI;EA6Bd"}
|
|
@@ -0,0 +1,123 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* ***********************************
|
|
3
|
+
* @composy/log-viewer-vue v0.0.1 *
|
|
4
|
+
* Built with rollup *
|
|
5
|
+
* Build time: 2024-10-12 17:44:31 *
|
|
6
|
+
* Build mode: production *
|
|
7
|
+
* Minified: No *
|
|
8
|
+
* ***********************************
|
|
9
|
+
*/
|
|
10
|
+
import { onUnmounted, ref } from "vue-demi";
|
|
11
|
+
import { createLogViewer } from "@composy/log-viewer-core";
|
|
12
|
+
//#region src/composables/useLogViewer.ts
|
|
13
|
+
function useLogViewer() {
|
|
14
|
+
const instance = ref(null);
|
|
15
|
+
const data = ref([]);
|
|
16
|
+
const filter = ref({});
|
|
17
|
+
const theme = ref("light");
|
|
18
|
+
const pagination = ref({
|
|
19
|
+
page: 1,
|
|
20
|
+
pageSize: 20
|
|
21
|
+
});
|
|
22
|
+
function create(container, config) {
|
|
23
|
+
if (instance.value) instance.value.destroy();
|
|
24
|
+
instance.value = createLogViewer({
|
|
25
|
+
...config,
|
|
26
|
+
container
|
|
27
|
+
});
|
|
28
|
+
instance.value.on("data:change", (entries) => {
|
|
29
|
+
data.value = entries;
|
|
30
|
+
});
|
|
31
|
+
instance.value.on("filter:change", (f) => {
|
|
32
|
+
filter.value = f;
|
|
33
|
+
});
|
|
34
|
+
instance.value.on("theme:change", (t) => {
|
|
35
|
+
theme.value = t;
|
|
36
|
+
});
|
|
37
|
+
instance.value.on("page:change", () => {
|
|
38
|
+
if (instance.value) pagination.value = instance.value.getPagination();
|
|
39
|
+
});
|
|
40
|
+
data.value = instance.value.getData();
|
|
41
|
+
filter.value = instance.value.getFilter();
|
|
42
|
+
theme.value = instance.value.getTheme();
|
|
43
|
+
pagination.value = instance.value.getPagination();
|
|
44
|
+
}
|
|
45
|
+
function setData(entries) {
|
|
46
|
+
instance.value?.setData(entries);
|
|
47
|
+
data.value = entries;
|
|
48
|
+
}
|
|
49
|
+
function appendData(entries) {
|
|
50
|
+
instance.value?.appendData(entries);
|
|
51
|
+
data.value = instance.value?.getData() || [];
|
|
52
|
+
}
|
|
53
|
+
function setFilter(f) {
|
|
54
|
+
instance.value?.setFilter(f);
|
|
55
|
+
filter.value = f;
|
|
56
|
+
}
|
|
57
|
+
function resetFilter() {
|
|
58
|
+
instance.value?.resetFilter();
|
|
59
|
+
filter.value = {};
|
|
60
|
+
}
|
|
61
|
+
function setTheme(t) {
|
|
62
|
+
instance.value?.setTheme(t);
|
|
63
|
+
theme.value = t;
|
|
64
|
+
}
|
|
65
|
+
function expandEntry(id) {
|
|
66
|
+
instance.value?.expandEntry(id);
|
|
67
|
+
}
|
|
68
|
+
function collapseEntry(id) {
|
|
69
|
+
instance.value?.collapseEntry(id);
|
|
70
|
+
}
|
|
71
|
+
function collapseAll() {
|
|
72
|
+
instance.value?.collapseAll();
|
|
73
|
+
}
|
|
74
|
+
function goToPage(page) {
|
|
75
|
+
instance.value?.goToPage(page);
|
|
76
|
+
}
|
|
77
|
+
function refresh() {
|
|
78
|
+
instance.value?.refresh();
|
|
79
|
+
}
|
|
80
|
+
async function loadData() {
|
|
81
|
+
const loader = instance.value?.loadData;
|
|
82
|
+
if (loader) await loader.call(instance.value);
|
|
83
|
+
if (instance.value) {
|
|
84
|
+
data.value = instance.value.getData();
|
|
85
|
+
pagination.value = instance.value.getPagination();
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
function destroy() {
|
|
89
|
+
instance.value?.destroy();
|
|
90
|
+
instance.value = null;
|
|
91
|
+
}
|
|
92
|
+
function on(event, callback) {
|
|
93
|
+
return instance.value?.on(event, callback) || (() => {});
|
|
94
|
+
}
|
|
95
|
+
onUnmounted(() => {
|
|
96
|
+
destroy();
|
|
97
|
+
});
|
|
98
|
+
return {
|
|
99
|
+
instance,
|
|
100
|
+
data,
|
|
101
|
+
filter,
|
|
102
|
+
theme,
|
|
103
|
+
pagination,
|
|
104
|
+
create,
|
|
105
|
+
setData,
|
|
106
|
+
appendData,
|
|
107
|
+
setFilter,
|
|
108
|
+
resetFilter,
|
|
109
|
+
setTheme,
|
|
110
|
+
expandEntry,
|
|
111
|
+
collapseEntry,
|
|
112
|
+
collapseAll,
|
|
113
|
+
goToPage,
|
|
114
|
+
refresh,
|
|
115
|
+
loadData,
|
|
116
|
+
destroy,
|
|
117
|
+
on
|
|
118
|
+
};
|
|
119
|
+
}
|
|
120
|
+
//#endregion
|
|
121
|
+
export { useLogViewer };
|
|
122
|
+
/*! End of @composy/log-viewer-vue | Powered by @composy/builder */
|
|
123
|
+
//# sourceMappingURL=useLogViewer.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useLogViewer.js","names":[],"sources":["../../src/composables/useLogViewer.ts"],"sourcesContent":["/**\r\n * useLogViewer - Vue 3 组合式 API\r\n */\r\nimport { onUnmounted, ref } from 'vue-demi'\r\nimport {\r\n createLogViewer,\r\n type LogViewer,\r\n type LogViewerConfig,\r\n type LogEntry,\r\n type FilterConfig,\r\n type ThemeMode,\r\n type PaginationConfig,\r\n} from '@composy/log-viewer-core'\r\n\r\n/**\r\n * useLogViewer - use Log Viewer function\r\n * @returns 返回值说明\r\n */\r\nexport function useLogViewer() {\r\n const instance = ref<LogViewer | null>(null)\r\n const data = ref<LogEntry[]>([])\r\n const filter = ref<FilterConfig>({})\r\n const theme = ref<ThemeMode>('light')\r\n const pagination = ref<PaginationConfig>({ page: 1, pageSize: 20 })\r\n\r\n function create(\r\n container: HTMLElement | string,\r\n config?: Partial<LogViewerConfig>\r\n ) {\r\n if (instance.value) {\r\n instance.value.destroy()\r\n }\r\n\r\n instance.value = createLogViewer({\r\n ...config,\r\n container,\r\n })\r\n\r\n // Sync refs\r\n instance.value.on('data:change', (entries: LogEntry[]) => {\r\n data.value = entries\r\n })\r\n instance.value.on('filter:change', (f: FilterConfig) => {\r\n filter.value = f\r\n })\r\n instance.value.on('theme:change', (t: ThemeMode) => {\r\n theme.value = t\r\n })\r\n instance.value.on('page:change', () => {\r\n if (instance.value) {\r\n pagination.value = instance.value.getPagination()\r\n }\r\n })\r\n\r\n data.value = instance.value.getData()\r\n filter.value = instance.value.getFilter()\r\n theme.value = instance.value.getTheme()\r\n pagination.value = instance.value.getPagination()\r\n }\r\n\r\n function setData(entries: LogEntry[]) {\r\n instance.value?.setData(entries)\r\n data.value = entries\r\n }\r\n\r\n function appendData(entries: LogEntry[]) {\r\n instance.value?.appendData(entries)\r\n data.value = instance.value?.getData() || []\r\n }\r\n\r\n function setFilter(f: FilterConfig) {\r\n instance.value?.setFilter(f)\r\n filter.value = f\r\n }\r\n\r\n function resetFilter() {\r\n instance.value?.resetFilter()\r\n filter.value = {}\r\n }\r\n\r\n function setTheme(t: ThemeMode) {\r\n instance.value?.setTheme(t)\r\n theme.value = t\r\n }\r\n\r\n function expandEntry(id: string) {\r\n instance.value?.expandEntry(id)\r\n }\r\n\r\n function collapseEntry(id: string) {\r\n instance.value?.collapseEntry(id)\r\n }\r\n\r\n function collapseAll() {\r\n instance.value?.collapseAll()\r\n }\r\n\r\n function goToPage(page: number) {\r\n instance.value?.goToPage(page)\r\n }\r\n\r\n function refresh() {\r\n instance.value?.refresh()\r\n }\r\n\r\n async function loadData() {\r\n const loader = (\r\n instance.value as unknown as { loadData?: () => Promise<void> }\r\n )?.loadData\r\n if (loader) await loader.call(instance.value)\r\n if (instance.value) {\r\n data.value = instance.value.getData()\r\n pagination.value = instance.value.getPagination()\r\n }\r\n }\r\n\r\n function destroy() {\r\n instance.value?.destroy()\r\n instance.value = null\r\n }\r\n\r\n function on(\r\n event: string,\r\n callback: (...args: unknown[]) => void\r\n ): () => void {\r\n return instance.value?.on(event, callback) || (() => {})\r\n }\r\n\r\n onUnmounted(() => {\r\n destroy()\r\n })\r\n\r\n return {\r\n instance,\r\n data,\r\n filter,\r\n theme,\r\n pagination,\r\n create,\r\n setData,\r\n appendData,\r\n setFilter,\r\n resetFilter,\r\n setTheme,\r\n expandEntry,\r\n collapseEntry,\r\n collapseAll,\r\n goToPage,\r\n refresh,\r\n loadData,\r\n destroy,\r\n on,\r\n }\r\n}\r\n"],"mappings":";;;;;;;;;;;;AAkBO,SAAS,eAAe;CAC7B,MAAM,WAAW,IAAsB,IAAI;CAC3C,MAAM,OAAO,IAAgB,CAAC,CAAC;CAC/B,MAAM,SAAS,IAAkB,CAAC,CAAC;CACnC,MAAM,QAAQ,IAAe,OAAO;CACpC,MAAM,aAAa,IAAsB;EAAE,MAAM;EAAG,UAAU;CAAG,CAAC;CAElE,SAAS,OACP,WACA,QACA;EACA,IAAI,SAAS,OACX,SAAS,MAAM,QAAQ;EAGzB,SAAS,QAAQ,gBAAgB;GAC/B,GAAG;GACH;EACF,CAAC;EAGD,SAAS,MAAM,GAAG,gBAAgB,YAAwB;GACxD,KAAK,QAAQ;EACf,CAAC;EACD,SAAS,MAAM,GAAG,kBAAkB,MAAoB;GACtD,OAAO,QAAQ;EACjB,CAAC;EACD,SAAS,MAAM,GAAG,iBAAiB,MAAiB;GAClD,MAAM,QAAQ;EAChB,CAAC;EACD,SAAS,MAAM,GAAG,qBAAqB;GACrC,IAAI,SAAS,OACX,WAAW,QAAQ,SAAS,MAAM,cAAc;EAEpD,CAAC;EAED,KAAK,QAAQ,SAAS,MAAM,QAAQ;EACpC,OAAO,QAAQ,SAAS,MAAM,UAAU;EACxC,MAAM,QAAQ,SAAS,MAAM,SAAS;EACtC,WAAW,QAAQ,SAAS,MAAM,cAAc;CAClD;CAEA,SAAS,QAAQ,SAAqB;EACpC,SAAS,OAAO,QAAQ,OAAO;EAC/B,KAAK,QAAQ;CACf;CAEA,SAAS,WAAW,SAAqB;EACvC,SAAS,OAAO,WAAW,OAAO;EAClC,KAAK,QAAQ,SAAS,OAAO,QAAQ,KAAK,CAAC;CAC7C;CAEA,SAAS,UAAU,GAAiB;EAClC,SAAS,OAAO,UAAU,CAAC;EAC3B,OAAO,QAAQ;CACjB;CAEA,SAAS,cAAc;EACrB,SAAS,OAAO,YAAY;EAC5B,OAAO,QAAQ,CAAC;CAClB;CAEA,SAAS,SAAS,GAAc;EAC9B,SAAS,OAAO,SAAS,CAAC;EAC1B,MAAM,QAAQ;CAChB;CAEA,SAAS,YAAY,IAAY;EAC/B,SAAS,OAAO,YAAY,EAAE;CAChC;CAEA,SAAS,cAAc,IAAY;EACjC,SAAS,OAAO,cAAc,EAAE;CAClC;CAEA,SAAS,cAAc;EACrB,SAAS,OAAO,YAAY;CAC9B;CAEA,SAAS,SAAS,MAAc;EAC9B,SAAS,OAAO,SAAS,IAAI;CAC/B;CAEA,SAAS,UAAU;EACjB,SAAS,OAAO,QAAQ;CAC1B;CAEA,eAAe,WAAW;EACxB,MAAM,SACJ,SAAS,OACR;EACH,IAAI,QAAQ,MAAM,OAAO,KAAK,SAAS,KAAK;EAC5C,IAAI,SAAS,OAAO;GAClB,KAAK,QAAQ,SAAS,MAAM,QAAQ;GACpC,WAAW,QAAQ,SAAS,MAAM,cAAc;EAClD;CACF;CAEA,SAAS,UAAU;EACjB,SAAS,OAAO,QAAQ;EACxB,SAAS,QAAQ;CACnB;CAEA,SAAS,GACP,OACA,UACY;EACZ,OAAO,SAAS,OAAO,GAAG,OAAO,QAAQ,YAAY,CAAC;CACxD;CAEA,kBAAkB;EAChB,QAAQ;CACV,CAAC;CAED,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;AACF"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,eAAO,MAAM,OAAO,UAAU,CAAA;AAG9B,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,4BAA4B,CAAA;AAGjE,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAA;AAGzD,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAG1C,YAAY,EACV,UAAU,EACV,SAAS,EACT,WAAW,EACX,SAAS,EACT,QAAQ,EACR,YAAY,EACZ,gBAAgB,EAChB,eAAe,EACf,iBAAiB,EACjB,eAAe,GAChB,MAAM,0BAA0B,CAAA;AAEjC,OAAO,EACL,eAAe,EACf,aAAa,EACb,aAAa,EACb,UAAU,EACV,kBAAkB,GACnB,MAAM,0BAA0B,CAAA"}
|
package/esm/index.js
ADDED
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* ***********************************
|
|
3
|
+
* @composy/log-viewer-vue v0.0.1 *
|
|
4
|
+
* Built with rollup *
|
|
5
|
+
* Build time: 2024-10-12 17:44:31 *
|
|
6
|
+
* Build mode: production *
|
|
7
|
+
* Minified: No *
|
|
8
|
+
* ***********************************
|
|
9
|
+
*/
|
|
10
|
+
import LogViewer_default from "./components/LogViewer.js";
|
|
11
|
+
import { useLogViewer } from "./composables/useLogViewer.js";
|
|
12
|
+
import { LogViewerPlugin } from "./plugin.js";
|
|
13
|
+
import { ACTION_COLORS, ACTION_LABELS, createLogViewer, formatDate, formatRelativeTime } from "@composy/log-viewer-core";
|
|
14
|
+
//#region src/index.ts
|
|
15
|
+
const VERSION = "0.1.0";
|
|
16
|
+
//#endregion
|
|
17
|
+
export { ACTION_COLORS, ACTION_LABELS, LogViewer_default as LogViewer, LogViewerPlugin, VERSION, createLogViewer, formatDate, formatRelativeTime, useLogViewer };
|
|
18
|
+
/*! End of @composy/log-viewer-vue | Powered by @composy/builder */
|
|
19
|
+
//# sourceMappingURL=index.js.map
|
package/esm/index.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../src/index.ts"],"sourcesContent":["/**\r\n * @composy/log-viewer-vue\r\n *\r\n * 审计日志查看器 — Vue 3 适配层\r\n * 提供 LogViewer 组件、useLogViewer 组合式函数和 Vue 插件\r\n *\r\n * @packageDocumentation\r\n */\r\n\r\nexport const VERSION = '0.1.0'\r\n\r\n// 组件\r\nexport { default as LogViewer } from './components/LogViewer.vue'\r\n\r\n// 组合式 API\r\nexport { useLogViewer } from './composables/useLogViewer'\r\n\r\n// 插件\r\nexport { LogViewerPlugin } from './plugin'\r\n\r\n// 重新导出核心类型\r\nexport type {\r\n ActionType,\r\n ThemeMode,\r\n AnomalyType,\r\n DiffEntry,\r\n LogEntry,\r\n FilterConfig,\r\n PaginationConfig,\r\n LogViewerConfig,\r\n LogViewerInstance,\r\n LogViewerEvents,\r\n} from '@composy/log-viewer-core'\r\n\r\nexport {\r\n createLogViewer,\r\n ACTION_LABELS,\r\n ACTION_COLORS,\r\n formatDate,\r\n formatRelativeTime,\r\n} from '@composy/log-viewer-core'\r\n"],"mappings":";;;;;;;;;;;;;;AASO,MAAM,UAAU"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"plugin.d.ts","sourceRoot":"","sources":["../src/plugin.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAG9B,eAAO,MAAM,eAAe;iBACb,GAAG;CAGjB,CAAA"}
|
package/esm/plugin.js
ADDED
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* ***********************************
|
|
3
|
+
* @composy/log-viewer-vue v0.0.1 *
|
|
4
|
+
* Built with rollup *
|
|
5
|
+
* Build time: 2024-10-12 17:44:31 *
|
|
6
|
+
* Build mode: production *
|
|
7
|
+
* Minified: No *
|
|
8
|
+
* ***********************************
|
|
9
|
+
*/
|
|
10
|
+
import LogViewer_default from "./components/LogViewer.js";
|
|
11
|
+
//#region src/plugin.ts
|
|
12
|
+
const LogViewerPlugin = { install(app) {
|
|
13
|
+
app.component("LogViewer", LogViewer_default);
|
|
14
|
+
} };
|
|
15
|
+
//#endregion
|
|
16
|
+
export { LogViewerPlugin };
|
|
17
|
+
/*! End of @composy/log-viewer-vue | Powered by @composy/builder */
|
|
18
|
+
//# sourceMappingURL=plugin.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"plugin.js","names":[],"sources":["../src/plugin.ts"],"sourcesContent":["/**\r\n * Vue 插件 - 全局注册 LogViewer 组件\r\n */\r\nimport type { App } from 'vue'\r\nimport LogViewer from './components/LogViewer.vue'\r\n\r\nexport const LogViewerPlugin = {\r\n install(app: App) {\r\n app.component('LogViewer', LogViewer)\r\n },\r\n}\r\n"],"mappings":";;;;;;;;;;;AAMO,MAAM,kBAAkB,EAC7B,QAAQ,KAAU;CAChB,IAAI,UAAU,aAAa,iBAAS;AACtC,EACF"}
|
package/esm/style/css.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import './index.less';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import './index.less';
|