vite-uni-dev-tool 1.0.0 → 1.1.0

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.
Files changed (168) hide show
  1. package/README.md +46 -0
  2. package/dist/const.cjs +1 -1
  3. package/dist/const.d.ts +12 -0
  4. package/dist/const.d.ts.map +1 -1
  5. package/dist/const.js +1 -1
  6. package/dist/core-shared.d.ts +1 -1
  7. package/dist/core-shared.d.ts.map +1 -1
  8. package/dist/core-shared.js +1 -1
  9. package/dist/core.d.ts +10 -3
  10. package/dist/core.d.ts.map +1 -1
  11. package/dist/core.js +2 -2
  12. package/dist/i18n/locales/en.cjs +1 -1
  13. package/dist/i18n/locales/en.d.ts +81 -0
  14. package/dist/i18n/locales/en.d.ts.map +1 -1
  15. package/dist/i18n/locales/en.js +1 -1
  16. package/dist/i18n/locales/zh-Hans.cjs +1 -1
  17. package/dist/i18n/locales/zh-Hans.d.ts +82 -1
  18. package/dist/i18n/locales/zh-Hans.d.ts.map +1 -1
  19. package/dist/i18n/locales/zh-Hans.js +1 -1
  20. package/dist/modules/devConsole/index.cjs +1 -1
  21. package/dist/modules/devConsole/index.js +3 -3
  22. package/dist/modules/devEvent/index.cjs +3 -3
  23. package/dist/modules/devEvent/index.d.ts +1 -0
  24. package/dist/modules/devEvent/index.d.ts.map +1 -1
  25. package/dist/modules/devEvent/index.js +3 -3
  26. package/dist/modules/devIntercept/index.cjs +14 -13
  27. package/dist/modules/devIntercept/index.d.ts +19 -0
  28. package/dist/modules/devIntercept/index.d.ts.map +1 -1
  29. package/dist/modules/devIntercept/index.js +14 -13
  30. package/dist/modules/devStore/index.cjs +1 -1
  31. package/dist/modules/devStore/index.d.ts +21 -0
  32. package/dist/modules/devStore/index.d.ts.map +1 -1
  33. package/dist/modules/devStore/index.js +1 -1
  34. package/dist/plugins/uniDevTool/transform/transformMain.cjs +1 -1
  35. package/dist/plugins/uniDevTool/transform/transformMain.js +1 -1
  36. package/dist/type.d.ts +47 -2
  37. package/dist/type.d.ts.map +1 -1
  38. package/dist/utils/language.cjs +1 -1
  39. package/dist/utils/language.d.ts.map +1 -1
  40. package/dist/utils/language.js +1 -1
  41. package/dist/utils/object.cjs +1 -1
  42. package/dist/utils/object.d.ts.map +1 -1
  43. package/dist/utils/object.js +1 -1
  44. package/dist/v3/DevTool/components/BluetoothList/BluetoothItem.vue +199 -0
  45. package/dist/v3/DevTool/components/BluetoothList/BluetoothTool.vue +730 -0
  46. package/dist/v3/DevTool/components/BluetoothList/index.vue +167 -0
  47. package/dist/v3/{CaptureScreen → DevTool/components/CaptureScreen}/index.vue +109 -109
  48. package/dist/v3/{ConsoleList → DevTool/components/ConsoleList}/ConsoleItem.vue +225 -224
  49. package/dist/v3/{ConsoleList → DevTool/components/ConsoleList}/RunJSInput.vue +247 -249
  50. package/dist/v3/{ConsoleList → DevTool/components/ConsoleList}/index.vue +171 -160
  51. package/dist/v3/{ConsoleList → DevTool/components/ConsoleList}/staticTips.ts +1145 -1145
  52. package/dist/v3/{DevToolButton → DevTool/components/DevToolButton}/index.vue +7 -4
  53. package/dist/v3/{DevToolTitle → DevTool/components/DevToolTitle}/index.vue +24 -24
  54. package/dist/v3/{DevToolWindow → DevTool/components/DevToolWindow}/DevToolOverlay.vue +197 -182
  55. package/dist/v3/{DevToolWindow → DevTool/components/DevToolWindow}/const.ts +28 -5
  56. package/dist/v3/{DevToolWindow → DevTool/components/DevToolWindow}/hooks/dataUtils.ts +48 -48
  57. package/dist/v3/{DevToolWindow → DevTool/components/DevToolWindow}/hooks/useDevToolData.ts +387 -338
  58. package/dist/v3/{DevToolWindow → DevTool/components/DevToolWindow}/hooks/useDevToolHandlers.ts +629 -549
  59. package/dist/v3/{DevToolWindow → DevTool/components/DevToolWindow}/hooks/useDevToolOverlay.ts +197 -184
  60. package/dist/v3/{DevToolWindow → DevTool/components/DevToolWindow}/index.vue +67 -16
  61. package/dist/v3/{ElEvent → DevTool/components/ElEvent}/ElEventItem.vue +105 -105
  62. package/dist/v3/{ElEvent → DevTool/components/ElEvent}/index.vue +106 -109
  63. package/dist/v3/{Instance → DevTool/components/Instance}/components/InstanceTreeNode.vue +265 -265
  64. package/dist/v3/{Instance → DevTool/components/Instance}/flatten.ts +226 -226
  65. package/dist/v3/{Instance → DevTool/components/Instance}/index.vue +94 -94
  66. package/dist/v3/{Instance → DevTool/components/Instance}/registry.ts +49 -49
  67. package/dist/v3/{Instance → DevTool/components/Instance}/transformTree.ts +375 -375
  68. package/dist/v3/{Instance → DevTool/components/Instance}/transformTreeCtx.ts +268 -268
  69. package/dist/v3/{Instance → DevTool/components/Instance}/typing.d.ts +43 -43
  70. package/dist/v3/{InstanceDetail → DevTool/components/InstanceDetail}/index.vue +485 -485
  71. package/dist/v3/{JsonDetail → DevTool/components/JsonDetail}/index.vue +70 -70
  72. package/dist/v3/{NFCList → DevTool/components/NFCList}/NFCItem.vue +112 -113
  73. package/dist/v3/{NFCList → DevTool/components/NFCList}/NFCTool.vue +454 -478
  74. package/dist/v3/{NFCList → DevTool/components/NFCList}/const.ts +56 -56
  75. package/dist/v3/{NFCList → DevTool/components/NFCList}/index.vue +94 -98
  76. package/dist/v3/{NetworkList → DevTool/components/NetworkList}/InterceptConfig.vue +624 -608
  77. package/dist/v3/{NetworkList → DevTool/components/NetworkList}/InterceptItem.vue +140 -140
  78. package/dist/v3/{NetworkList → DevTool/components/NetworkList}/NetworkDetail.vue +287 -296
  79. package/dist/v3/{NetworkList → DevTool/components/NetworkList}/NetworkIntercept.vue +88 -93
  80. package/dist/v3/{NetworkList → DevTool/components/NetworkList}/NetworkItem.vue +163 -167
  81. package/dist/v3/{NetworkList → DevTool/components/NetworkList}/NetworkSend.vue +589 -556
  82. package/dist/v3/{NetworkList → DevTool/components/NetworkList}/const.ts +4 -4
  83. package/dist/v3/{NetworkList → DevTool/components/NetworkList}/hooks/useNetworkForm.ts +86 -86
  84. package/dist/v3/{NetworkList → DevTool/components/NetworkList}/index.vue +160 -160
  85. package/dist/v3/{NetworkList → DevTool/components/NetworkList}/utils.ts +101 -101
  86. package/dist/v3/{Performance → DevTool/components/Performance}/index.vue +498 -495
  87. package/dist/v3/{Performance → DevTool/components/Performance}/modules/PerformanceMetrics.vue +153 -153
  88. package/dist/v3/{Performance → DevTool/components/Performance}/modules/PerformanceWidget.vue +12 -9
  89. package/dist/v3/{Performance → DevTool/components/Performance}/modules/usePerformanceChart.ts +460 -460
  90. package/dist/v3/{Performance → DevTool/components/Performance}/modules/usePerformanceData.ts +258 -258
  91. package/dist/v3/{PiniaList → DevTool/components/PiniaList}/index.vue +93 -94
  92. package/dist/v3/{RouteList → DevTool/components/RouteList}/index.vue +21 -24
  93. package/dist/v3/{RunJS → DevTool/components/RunJS}/index.vue +148 -148
  94. package/dist/v3/{ScanCodeList → DevTool/components/ScanCodeList}/ScanCodeItem.vue +97 -98
  95. package/dist/v3/{ScanCodeList → DevTool/components/ScanCodeList}/index.vue +100 -104
  96. package/dist/v3/{SettingButton → DevTool/components/SettingButton}/index.vue +45 -45
  97. package/dist/v3/{SettingList → DevTool/components/SettingList}/index.vue +218 -150
  98. package/dist/v3/DevTool/components/SettingList/modules/SettingBarrage.vue +304 -0
  99. package/dist/v3/{SettingList → DevTool/components/SettingList}/modules/SettingDevTool.vue +212 -208
  100. package/dist/v3/{SettingList → DevTool/components/SettingList}/modules/SettingInfo.vue +157 -119
  101. package/dist/v3/{SettingList → DevTool/components/SettingList}/modules/SettingLanguage.vue +74 -74
  102. package/dist/v3/{SettingList → DevTool/components/SettingList}/modules/SettingLog.vue +230 -230
  103. package/dist/v3/{SettingList → DevTool/components/SettingList}/modules/SettingNetwork.vue +3 -3
  104. package/dist/v3/{SettingList → DevTool/components/SettingList}/modules/SettingTheme.vue +37 -7
  105. package/dist/v3/{SettingList → DevTool/components/SettingList}/typing.d.ts +2 -2
  106. package/dist/v3/{SourceCode → DevTool/components/SourceCode}/Line.vue +127 -116
  107. package/dist/v3/{SourceCode → DevTool/components/SourceCode}/index.vue +8 -8
  108. package/dist/v3/{SourceCode → DevTool/components/SourceCode}/parseCode.ts +609 -701
  109. package/dist/v3/{StorageList → DevTool/components/StorageList}/index.vue +174 -174
  110. package/dist/v3/{TransferList → DevTool/components/TransferList}/TransferDetail.vue +268 -268
  111. package/dist/v3/{TransferList → DevTool/components/TransferList}/TransferItem.vue +4 -4
  112. package/dist/v3/{TransferList → DevTool/components/TransferList}/index.vue +8 -8
  113. package/dist/v3/{UniEvent → DevTool/components/UniEvent}/UniEventItem.vue +6 -7
  114. package/dist/v3/{UniEvent → DevTool/components/UniEvent}/index.vue +6 -6
  115. package/dist/v3/{VuexList → DevTool/components/VuexList}/index.vue +84 -84
  116. package/dist/v3/{WebSocket → DevTool/components/WebSocket}/WebSocketDetail.vue +8 -8
  117. package/dist/v3/{WebSocket → DevTool/components/WebSocket}/WebSocketItem.vue +4 -4
  118. package/dist/v3/{WebSocket → DevTool/components/WebSocket}/index.vue +8 -8
  119. package/dist/v3/DevTool/index.vue +179 -5
  120. package/dist/v3/{AppTransition → components/AppTransition}/index.vue +176 -170
  121. package/dist/v3/{AutoSizer → components/AutoSizer}/index.vue +192 -192
  122. package/dist/v3/{AutoSizer → components/AutoSizer}/index1.vue +184 -184
  123. package/dist/v3/{AutoSizer → components/AutoSizer}/utils.ts +49 -49
  124. package/dist/v3/components/Barrage/BarrageItem.vue +137 -0
  125. package/dist/v3/components/Barrage/index.vue +202 -0
  126. package/dist/v3/{CircularButton → components/CircularButton}/index.vue +84 -84
  127. package/dist/v3/{CustomSwiper → components/CustomSwiper}/CustomSwiperItem.vue +49 -49
  128. package/dist/v3/{CustomSwiper → components/CustomSwiper}/index.vue +104 -104
  129. package/dist/v3/{DraggableContainer → components/DraggableContainer}/index.vue +1 -1
  130. package/dist/v3/{Empty → components/Empty}/index.vue +29 -29
  131. package/dist/v3/{FilterInput → components/FilterInput}/index.vue +1 -1
  132. package/dist/v3/{FilterSelect → components/FilterSelect}/index.vue +179 -179
  133. package/dist/v3/{JsonPretty → components/JsonPretty}/components/Brackets/index.vue +27 -27
  134. package/dist/v3/{JsonPretty → components/JsonPretty}/components/Carets/index.vue +59 -59
  135. package/dist/v3/{JsonPretty → components/JsonPretty}/components/CheckController/index.vue +136 -136
  136. package/dist/v3/{JsonPretty → components/JsonPretty}/components/TreeNode/index.vue +387 -381
  137. package/dist/v3/{JsonPretty → components/JsonPretty}/hooks/useClipboard.ts +21 -21
  138. package/dist/v3/{JsonPretty → components/JsonPretty}/hooks/useError.ts +21 -21
  139. package/dist/v3/{JsonPretty → components/JsonPretty}/index.vue +16 -13
  140. package/dist/v3/{JsonPretty → components/JsonPretty}/type.ts +127 -126
  141. package/dist/v3/{JsonPretty → components/JsonPretty}/utils/index.ts +169 -169
  142. package/dist/v3/{MovableContainer → components/MovableContainer}/index.vue +1 -1
  143. package/dist/v3/{Pick → components/Pick}/index.vue +322 -322
  144. package/dist/v3/{Tabs → components/Tabs}/index.vue +30 -4
  145. package/dist/v3/{Tag → components/Tag}/index.vue +113 -113
  146. package/dist/v3/{VirtualList → components/VirtualList}/AutoSize.vue +40 -40
  147. package/dist/v3/{VirtualList → components/VirtualList}/index.vue +416 -412
  148. package/dist/v3/hooks/useBluetooth/index.ts +561 -0
  149. package/dist/v3/hooks/useContainerStyle.ts +153 -153
  150. package/dist/v3/hooks/useNFC/index.ts +107 -107
  151. package/dist/v3/hooks/useNFC/typing.d.ts +396 -396
  152. package/dist/v3/hooks/useNFC/useNFCAndroid.ts +966 -966
  153. package/dist/v3/hooks/useNFC/useNFCMpWeiXin.ts +812 -812
  154. package/dist/v3/hooks/useNFC/utils.ts +754 -754
  155. package/dist/v3/hooks/useRequest/index.ts +586 -573
  156. package/dist/v3/hooks/useRequest/utils.ts +267 -267
  157. package/dist/v3/hooks/useScanCode/index.ts +206 -206
  158. package/dist/v3/hooks/useWebsocket/README.md +79 -0
  159. package/dist/v3/hooks/useWebsocket/index.ts +253 -0
  160. package/dist/v3/styles/theme.css +17 -10
  161. package/dist/v3/styles/theme.ts +12 -12
  162. package/package.json +59 -64
  163. package/dist/plugins/uniParseStock/index.d.ts +0 -10
  164. package/dist/plugins/uniParseStock/index.d.ts.map +0 -1
  165. /package/dist/v3/{DevToolWindow → DevTool/components/DevToolWindow}/index.css +0 -0
  166. /package/dist/v3/{SettingList → DevTool/components/SettingList}/index.css +0 -0
  167. /package/dist/v3/{Empty → components/Empty}/empty.png +0 -0
  168. /package/dist/v3/{VirtualList → components/VirtualList}/readme.md +0 -0
@@ -1,338 +1,387 @@
1
- import { shallowRef, reactive, ref } from 'vue';
2
- import type { DevTool } from '../../../type';
3
-
4
- import { hightLight } from '../../../utils/index';
5
- import { calcLineStartAndEnd, calcNetworkTimeline } from './dataUtils';
6
-
7
- export function useDevToolData(props: any) {
8
- const consoleList = shallowRef<DevTool.ConsoleItem[]>([]);
9
- const networkList = shallowRef<DevTool.NetworkItem[]>([]);
10
- const transferList = shallowRef<DevTool.TransferItem[]>([]);
11
- const storageList = shallowRef<DevTool.StorageItem[]>([]);
12
- const routeList = shallowRef<DevTool.Page[]>([]);
13
- const wsList = shallowRef<DevTool.WS[]>([]);
14
- const vuexList = shallowRef<Record<string, any>>({});
15
- const piniaList = shallowRef<Record<string, any>>({});
16
-
17
- const elEventList = shallowRef<DevTool.ElEventItem[]>([]);
18
- const uniEventList = shallowRef<DevTool.UniEventItem[]>([]);
19
- const eventCount = shallowRef<DevTool.EventCount>();
20
- const screenList = shallowRef<DevTool.ScreenItem[]>([]);
21
- const interceptNetworkList = shallowRef<DevTool.NetworkItem[]>([]);
22
- const scanCodeList = shallowRef<DevTool.ScanCodeItem[]>([]);
23
- const nfcList = shallowRef<DevTool.NFCItem[]>([]);
24
-
25
- const netWorkStatus = ref<{ isConnected?: boolean; networkType?: string }>(
26
- {},
27
- );
28
- const sizeFormat = shallowRef('');
29
- const devToolVisible = shallowRef(true);
30
- const cacheInterceptConfig = shallowRef(true);
31
- const cacheNetworkLog = shallowRef(false);
32
- const cacheConsoleLog = shallowRef(false);
33
- const useTransition = shallowRef(true);
34
- const baseFontSize = shallowRef(12);
35
- const tagFontSize = shallowRef(10);
36
- const tipsFontSize = shallowRef(10);
37
- const fontFamily = shallowRef('');
38
- const fontWeight = shallowRef('normal');
39
- const performanceVisible = shallowRef(false);
40
- const performanceShowFps = shallowRef(true);
41
- const performanceShowCpu = shallowRef(true);
42
-
43
- // 窗口管理状态
44
- const isFullScreen = ref(true);
45
- const windowX = ref(10);
46
- const windowY = ref(100);
47
- const windowWidth = ref(375);
48
- const windowHeight = ref(450);
49
-
50
- const backup = {
51
- consoleList: [] as DevTool.ConsoleItem[],
52
- networkList: [] as DevTool.NetworkItem[],
53
- storageList: [] as DevTool.StorageItem[],
54
- wsList: [] as DevTool.WS[],
55
- transferList: [] as DevTool.TransferItem[],
56
- routeList: [] as DevTool.Page[],
57
- uniEventList: [] as DevTool.UniEventItem[],
58
- };
59
-
60
- const buildInfo = reactive({
61
- devToolVersion: '0.0.0',
62
- devToolBuildTime: '',
63
- devToolGit: '',
64
- });
65
-
66
- // 搜索和过滤相关的状态(部分可能需要放在这里以便在 listenPostMessage 中使用)
67
- const currentConsoleType = shallowRef('all');
68
- const currentNetworkType = shallowRef('all');
69
- const currentNetworkSort = shallowRef<1 | -1>(1);
70
- const currentTransferCategory = shallowRef('all');
71
- const currentTransferType = shallowRef('all');
72
- const currentWebSocketType = shallowRef('all');
73
- const searchConsole = shallowRef('');
74
- const searchNetwork = shallowRef('');
75
- const searchTransfer = shallowRef('');
76
- const searchWs = shallowRef('');
77
- const searchRoute = shallowRef('');
78
- const searchStorage = shallowRef('');
79
-
80
- const activeTab = shallowRef(1);
81
- const tabScrollLeft = shallowRef(0);
82
- const theme = shallowRef('light');
83
- let isActive = false;
84
-
85
- const setIsActive = (value: boolean) => {
86
- isActive = value;
87
- };
88
-
89
- const listenPostMessage = (data: DevTool.WindowData) => {
90
- if (!props.open) return;
91
- if (!isActive) return;
92
-
93
- if (data.devToolVisible !== undefined)
94
- devToolVisible.value = data.devToolVisible;
95
- if (data.cacheInterceptConfig !== undefined)
96
- cacheInterceptConfig.value = data.cacheInterceptConfig;
97
- if (data.cacheNetworkLog !== undefined)
98
- cacheNetworkLog.value = data.cacheNetworkLog;
99
- if (data.cacheConsoleLog !== undefined)
100
- cacheConsoleLog.value = data.cacheConsoleLog;
101
- if (data.useTransition !== undefined)
102
- useTransition.value = data.useTransition;
103
- if (data.baseFontSize !== undefined) baseFontSize.value = data.baseFontSize;
104
- if (data.tagFontSize !== undefined) tagFontSize.value = data.tagFontSize;
105
- if (data.tipsFontSize !== undefined) tipsFontSize.value = data.tipsFontSize;
106
- if (data.fontFamily !== undefined) fontFamily.value = data.fontFamily;
107
- if (data.fontWeight !== undefined) fontWeight.value = data.fontWeight;
108
- if (data.performanceVisible !== undefined)
109
- performanceVisible.value = data.performanceVisible;
110
- if (data.performanceShowFps !== undefined)
111
- performanceShowFps.value = data.performanceShowFps;
112
- if (data.performanceShowCpu !== undefined)
113
- performanceShowCpu.value = data.performanceShowCpu;
114
-
115
- if (data.consoleList) {
116
- consoleList.value = [...(data.consoleList ?? [])]
117
- .filter((item) => {
118
- if (currentConsoleType.value === 'all') return item;
119
- if (currentConsoleType.value !== 'clear') {
120
- return item.type === currentConsoleType.value;
121
- }
122
- return item;
123
- })
124
- .filter((item) => {
125
- return (
126
- item.args?.some(
127
- (arg) =>
128
- arg.type === 'string' &&
129
- arg.value?.includes?.(searchConsole.value),
130
- ) ||
131
- item.position.includes(searchConsole.value) ||
132
- item?.stack?.includes(searchConsole.value)
133
- );
134
- })
135
- ?.map((item) => {
136
- return {
137
- ...item,
138
- position: hightLight(item.position, searchConsole.value),
139
- stack: hightLight(item.stack, searchConsole.value),
140
- args: item.args.map((arg) => {
141
- if (arg.type === 'string') {
142
- return {
143
- type: 'string',
144
- value: hightLight(arg.value, searchConsole.value),
145
- };
146
- }
147
- return arg;
148
- }),
149
- };
150
- });
151
-
152
- backup.consoleList = [...data.consoleList];
153
- }
154
-
155
- if (data.networkList) {
156
- const { startTime, endTime } = calcLineStartAndEnd(data.networkList);
157
- const list = calcNetworkTimeline(data.networkList, startTime, endTime);
158
-
159
- networkList.value = list
160
- .filter((item) => {
161
- if (currentNetworkType.value === 'all') return item;
162
- if (currentNetworkType.value !== 'clear') {
163
- return item.method === currentNetworkType.value;
164
- }
165
- return item;
166
- })
167
- ?.filter((item) => item?.url?.includes(searchNetwork.value))
168
- ?.map((item) => {
169
- return {
170
- ...item,
171
- url: hightLight(item.url, searchNetwork.value),
172
- };
173
- })
174
- ?.sort((a, b) => {
175
- if (currentNetworkSort.value === 1) {
176
- return b.startTime - a.startTime;
177
- } else {
178
- return a.startTime - b.startTime;
179
- }
180
- });
181
-
182
- backup.networkList = [...data.networkList];
183
- }
184
-
185
- if (data.transferList) {
186
- transferList.value = [...(data.transferList ?? [])]
187
- .filter((item) => {
188
- const typeMatch =
189
- currentTransferCategory.value === 'all' ||
190
- item.type === currentTransferCategory.value;
191
- const statusMatch =
192
- currentTransferType.value === 'all' ||
193
- item.status === currentTransferType.value;
194
-
195
- if (currentTransferType.value === 'clear') return true;
196
-
197
- return typeMatch && statusMatch;
198
- })
199
- .filter((item) => {
200
- return item.url?.includes(searchTransfer.value);
201
- })
202
- ?.map((item) => {
203
- return {
204
- ...item,
205
- url: hightLight(item.url, searchTransfer.value),
206
- };
207
- }) as any;
208
- backup.transferList = [...data.transferList];
209
- }
210
-
211
- if (data.storageList) {
212
- storageList.value = [...(data.storageList ?? [])]
213
- ?.filter((item) => item._oldKey.includes(searchStorage.value))
214
- ?.map((item) => {
215
- return {
216
- ...item,
217
- _oldKey: hightLight(item._oldKey, searchStorage.value),
218
- };
219
- });
220
- backup.storageList = [...data.storageList];
221
- }
222
-
223
- if (data.wsList) {
224
- wsList.value = [...(data.wsList ?? [])]
225
- .filter((item) => {
226
- if (currentWebSocketType.value === 'all') return item;
227
- return item.readyState === currentWebSocketType.value;
228
- })
229
- .filter((item) => item.url.includes(searchWs.value))
230
- ?.map((item) => {
231
- return {
232
- ...item,
233
- _highlightUrl: hightLight(item.url, searchWs.value),
234
- };
235
- });
236
- backup.wsList = [...data.wsList];
237
- }
238
-
239
- if (data.routeList) {
240
- routeList.value = [...(data.routeList ?? [])]
241
- ?.filter(
242
- (item) =>
243
- item.path.includes(searchRoute.value) ||
244
- item.name?.includes(searchRoute.value),
245
- )
246
- ?.map((item) => {
247
- return {
248
- ...item,
249
- name: hightLight(item.name, searchRoute.value),
250
- path: hightLight(item.path, searchRoute.value),
251
- };
252
- });
253
- backup.routeList = [...data.routeList];
254
- }
255
-
256
- if (data.elEventList) elEventList.value = [...data.elEventList];
257
- if (data.uniEventList) uniEventList.value = [...data.uniEventList];
258
- if (data.eventCount) eventCount.value = { ...data.eventCount };
259
- if (data.vuexList) vuexList.value = data.vuexList;
260
- if (data.piniaList) piniaList.value = data.piniaList;
261
- if (data.netWorkStatus) netWorkStatus.value = data.netWorkStatus;
262
- if (data.sizeFormat) sizeFormat.value = data.sizeFormat;
263
- if (data.screenList) screenList.value = [...data.screenList];
264
- if (data.interceptNetworkMap) {
265
- interceptNetworkList.value = Array.from(
266
- data.interceptNetworkMap.values(),
267
- );
268
- }
269
-
270
- if (data.devToolVersion || data.devToolBuildTime || data.devToolGit) {
271
- Object.assign(buildInfo, {
272
- devToolVersion: data.devToolVersion,
273
- devToolBuildTime: data.devToolBuildTime,
274
- devToolGit: data.devToolGit,
275
- });
276
- }
277
-
278
- if (data.scanCodeList) scanCodeList.value = [...data.scanCodeList];
279
- if (data.nfcList) nfcList.value = [...data.nfcList];
280
- };
281
-
282
- return {
283
- consoleList,
284
- networkList,
285
- transferList,
286
- storageList,
287
- routeList,
288
- wsList,
289
- vuexList,
290
- piniaList,
291
- elEventList,
292
- uniEventList,
293
- eventCount,
294
- screenList,
295
- interceptNetworkList,
296
- scanCodeList,
297
- nfcList,
298
- netWorkStatus,
299
- sizeFormat,
300
- devToolVisible,
301
- cacheInterceptConfig,
302
- cacheNetworkLog,
303
- cacheConsoleLog,
304
- useTransition,
305
- baseFontSize,
306
- tagFontSize,
307
- tipsFontSize,
308
- fontFamily,
309
- fontWeight,
310
- performanceVisible,
311
- performanceShowFps,
312
- performanceShowCpu,
313
- backup,
314
- buildInfo,
315
- currentConsoleType,
316
- currentNetworkType,
317
- currentNetworkSort,
318
- currentTransferType,
319
- currentTransferCategory,
320
- currentWebSocketType,
321
- searchConsole,
322
- searchNetwork,
323
- searchTransfer,
324
- searchWs,
325
- searchRoute,
326
- searchStorage,
327
- activeTab,
328
- tabScrollLeft,
329
- theme,
330
- isFullScreen,
331
- windowX,
332
- windowY,
333
- windowWidth,
334
- windowHeight,
335
- setIsActive,
336
- listenPostMessage,
337
- };
338
- }
1
+ import { shallowRef, reactive, ref } from 'vue';
2
+ import type { DevTool } from '../../../../../type';
3
+
4
+ import { hightLight } from '../../../../../utils/index';
5
+ import { calcLineStartAndEnd, calcNetworkTimeline } from './dataUtils';
6
+
7
+ export function useDevToolData(props: any) {
8
+ const consoleList = shallowRef<DevTool.ConsoleItem[]>([]);
9
+ const networkList = shallowRef<DevTool.NetworkItem[]>([]);
10
+ const transferList = shallowRef<DevTool.TransferItem[]>([]);
11
+ const storageList = shallowRef<DevTool.StorageItem[]>([]);
12
+ const routeList = shallowRef<DevTool.Page[]>([]);
13
+ const wsList = shallowRef<DevTool.WS[]>([]);
14
+ const vuexList = shallowRef<Record<string, any>>({});
15
+ const piniaList = shallowRef<Record<string, any>>({});
16
+
17
+ const elEventList = shallowRef<DevTool.ElEventItem[]>([]);
18
+ const uniEventList = shallowRef<DevTool.UniEventItem[]>([]);
19
+ const eventCount = shallowRef<DevTool.EventCount>();
20
+ const screenList = shallowRef<DevTool.ScreenItem[]>([]);
21
+ const interceptNetworkList = shallowRef<DevTool.NetworkItem[]>([]);
22
+ const scanCodeList = shallowRef<DevTool.ScanCodeItem[]>([]);
23
+ const nfcList = shallowRef<DevTool.NFCItem[]>([]);
24
+
25
+ const netWorkStatus = ref<{ isConnected?: boolean; networkType?: string }>(
26
+ {},
27
+ );
28
+ const sizeFormat = shallowRef('');
29
+ const devToolVisible = shallowRef(true);
30
+ const cacheInterceptConfig = shallowRef(true);
31
+ const cacheNetworkLog = shallowRef(false);
32
+ const cacheConsoleLog = shallowRef(false);
33
+ const useTransition = shallowRef(true);
34
+ const baseFontSize = shallowRef(12);
35
+ const tagFontSize = shallowRef(10);
36
+ const tipsFontSize = shallowRef(10);
37
+ const fontFamily = shallowRef('');
38
+ const fontWeight = shallowRef('normal');
39
+ const performanceVisible = shallowRef(false);
40
+ const performanceShowFps = shallowRef(true);
41
+ const performanceShowCpu = shallowRef(true);
42
+ const barrageVisible = shallowRef(true);
43
+ const barrageShowWhenOpen = shallowRef(false);
44
+ const barrageMaxTracks = shallowRef(10);
45
+ const barrageTrackHeight = shallowRef(36);
46
+ const barrageStartTop = shallowRef(40);
47
+ const barrageDuration = shallowRef(6);
48
+ const barrageMaxLength = shallowRef(100);
49
+ const barrageTypes = shallowRef([
50
+ 'log',
51
+ 'info',
52
+ 'warn',
53
+ 'error',
54
+ 'network',
55
+ 'transfer',
56
+ 'websocket',
57
+ ]);
58
+
59
+ // 窗口管理状态
60
+ const isFullScreen = ref(true);
61
+ const windowX = ref(10);
62
+ const windowY = ref(100);
63
+ const windowWidth = ref(375);
64
+ const windowHeight = ref(450);
65
+
66
+ const backup = {
67
+ consoleList: [] as DevTool.ConsoleItem[],
68
+ networkList: [] as DevTool.NetworkItem[],
69
+ storageList: [] as DevTool.StorageItem[],
70
+ wsList: [] as DevTool.WS[],
71
+ transferList: [] as DevTool.TransferItem[],
72
+ routeList: [] as DevTool.Page[],
73
+ uniEventList: [] as DevTool.UniEventItem[],
74
+ };
75
+
76
+ const buildInfo = reactive({
77
+ devToolVersion: '0.0.0',
78
+ devToolBuildTime: '',
79
+ devToolGit: '',
80
+ });
81
+
82
+ // 搜索和过滤相关的状态(部分可能需要放在这里以便在 listenPostMessage 中使用)
83
+ const currentConsoleType = shallowRef('all');
84
+ const currentNetworkType = shallowRef('all');
85
+ const currentNetworkSort = shallowRef<1 | -1>(1);
86
+ const currentTransferCategory = shallowRef('all');
87
+ const currentTransferType = shallowRef('all');
88
+ const currentWebSocketType = shallowRef('all');
89
+ const searchConsole = shallowRef('');
90
+ const searchNetwork = shallowRef('');
91
+ const searchTransfer = shallowRef('');
92
+ const searchWs = shallowRef('');
93
+ const searchRoute = shallowRef('');
94
+ const searchStorage = shallowRef('');
95
+
96
+ const activeTab = shallowRef(1);
97
+ const tabScrollLeft = shallowRef(0);
98
+ const theme = shallowRef('light');
99
+ let isActive = false;
100
+
101
+ const setIsActive = (value: boolean) => {
102
+ isActive = value;
103
+ };
104
+
105
+ const listenPostMessage = (data: DevTool.WindowData) => {
106
+ if (!props.open) return;
107
+ if (!isActive) return;
108
+
109
+ if (data.devToolVisible !== undefined)
110
+ devToolVisible.value = data.devToolVisible;
111
+ if (data.cacheInterceptConfig !== undefined)
112
+ cacheInterceptConfig.value = data.cacheInterceptConfig;
113
+ if (data.cacheNetworkLog !== undefined)
114
+ cacheNetworkLog.value = data.cacheNetworkLog;
115
+ if (data.cacheConsoleLog !== undefined)
116
+ cacheConsoleLog.value = data.cacheConsoleLog;
117
+ if (data.useTransition !== undefined)
118
+ useTransition.value = data.useTransition;
119
+ if (data.baseFontSize !== undefined) baseFontSize.value = data.baseFontSize;
120
+ if (data.tagFontSize !== undefined) tagFontSize.value = data.tagFontSize;
121
+ if (data.tipsFontSize !== undefined) tipsFontSize.value = data.tipsFontSize;
122
+ if (data.fontFamily !== undefined) fontFamily.value = data.fontFamily;
123
+ if (data.fontWeight !== undefined) fontWeight.value = data.fontWeight;
124
+ if (data.performanceVisible !== undefined)
125
+ performanceVisible.value = data.performanceVisible;
126
+ if (data.performanceShowFps !== undefined)
127
+ performanceShowFps.value = data.performanceShowFps;
128
+ if (data.performanceShowCpu !== undefined)
129
+ performanceShowCpu.value = data.performanceShowCpu;
130
+ if (data.barrageVisible !== undefined)
131
+ barrageVisible.value = data.barrageVisible;
132
+ if (data.barrageShowWhenOpen !== undefined)
133
+ barrageShowWhenOpen.value = data.barrageShowWhenOpen;
134
+ if (data.barrageMaxTracks !== undefined)
135
+ barrageMaxTracks.value = data.barrageMaxTracks;
136
+ if (data.barrageTrackHeight !== undefined)
137
+ barrageTrackHeight.value = data.barrageTrackHeight;
138
+ if (data.barrageStartTop !== undefined)
139
+ barrageStartTop.value = data.barrageStartTop;
140
+ if (data.barrageDuration !== undefined)
141
+ barrageDuration.value = data.barrageDuration;
142
+ if (data.barrageMaxLength !== undefined)
143
+ barrageMaxLength.value = data.barrageMaxLength;
144
+ if (data.barrageTypes !== undefined) {
145
+ if (Array.isArray(data.barrageTypes)) {
146
+ barrageTypes.value = data.barrageTypes;
147
+ } else {
148
+ // 如果收到了非数组(如诡异的循环引用字符串),打印个警告并忽略
149
+ console.warn(
150
+ '[DevTool] Received invalid barrageTypes:',
151
+ data.barrageTypes,
152
+ );
153
+ }
154
+ }
155
+
156
+ if (data.consoleList) {
157
+ consoleList.value = [...(data.consoleList ?? [])]
158
+ .filter((item) => {
159
+ if (currentConsoleType.value === 'all') return item;
160
+ if (currentConsoleType.value !== 'clear') {
161
+ return item.type === currentConsoleType.value;
162
+ }
163
+ return item;
164
+ })
165
+ .filter((item) => {
166
+ return (
167
+ item.args?.some(
168
+ (arg) =>
169
+ arg.type === 'string' &&
170
+ arg.value?.includes?.(searchConsole.value),
171
+ ) ||
172
+ item.position.includes(searchConsole.value) ||
173
+ item?.stack?.includes(searchConsole.value)
174
+ );
175
+ })
176
+ ?.map((item) => {
177
+ return {
178
+ ...item,
179
+ position: hightLight(item.position, searchConsole.value),
180
+ stack: hightLight(item.stack, searchConsole.value),
181
+ args: item.args.map((arg) => {
182
+ if (arg.type === 'string') {
183
+ return {
184
+ type: 'string',
185
+ value: hightLight(arg.value, searchConsole.value),
186
+ };
187
+ }
188
+ return arg;
189
+ }),
190
+ };
191
+ });
192
+
193
+ backup.consoleList = [...data.consoleList];
194
+ }
195
+
196
+ if (data.networkList) {
197
+ const { startTime, endTime } = calcLineStartAndEnd(data.networkList);
198
+ const list = calcNetworkTimeline(data.networkList, startTime, endTime);
199
+
200
+ networkList.value = list
201
+ .filter((item) => {
202
+ if (currentNetworkType.value === 'all') return item;
203
+ if (currentNetworkType.value !== 'clear') {
204
+ return item.method === currentNetworkType.value;
205
+ }
206
+ return item;
207
+ })
208
+ ?.filter((item) => item?.url?.includes(searchNetwork.value))
209
+ ?.map((item) => {
210
+ return {
211
+ ...item,
212
+ url: hightLight(item.url, searchNetwork.value),
213
+ };
214
+ })
215
+ ?.sort((a, b) => {
216
+ if (currentNetworkSort.value === 1) {
217
+ return b.startTime - a.startTime;
218
+ } else {
219
+ return a.startTime - b.startTime;
220
+ }
221
+ });
222
+
223
+ backup.networkList = [...data.networkList];
224
+ }
225
+
226
+ if (data.transferList) {
227
+ transferList.value = [...(data.transferList ?? [])]
228
+ .filter((item) => {
229
+ const typeMatch =
230
+ currentTransferCategory.value === 'all' ||
231
+ item.type === currentTransferCategory.value;
232
+ const statusMatch =
233
+ currentTransferType.value === 'all' ||
234
+ item.status === currentTransferType.value;
235
+
236
+ if (currentTransferType.value === 'clear') return true;
237
+
238
+ return typeMatch && statusMatch;
239
+ })
240
+ .filter((item) => {
241
+ return item.url?.includes(searchTransfer.value);
242
+ })
243
+ ?.map((item) => {
244
+ return {
245
+ ...item,
246
+ url: hightLight(item.url, searchTransfer.value),
247
+ };
248
+ }) as any;
249
+ backup.transferList = [...data.transferList];
250
+ }
251
+
252
+ if (data.storageList) {
253
+ storageList.value = [...(data.storageList ?? [])]
254
+ ?.filter((item) => item._oldKey.includes(searchStorage.value))
255
+ ?.map((item) => {
256
+ return {
257
+ ...item,
258
+ _oldKey: hightLight(item._oldKey, searchStorage.value),
259
+ };
260
+ });
261
+ backup.storageList = [...data.storageList];
262
+ }
263
+
264
+ if (data.wsList) {
265
+ wsList.value = [...(data.wsList ?? [])]
266
+ .filter((item) => {
267
+ if (currentWebSocketType.value === 'all') return item;
268
+ return item.readyState === currentWebSocketType.value;
269
+ })
270
+ .filter((item) => item.url.includes(searchWs.value))
271
+ ?.map((item) => {
272
+ return {
273
+ ...item,
274
+ _highlightUrl: hightLight(item.url, searchWs.value),
275
+ };
276
+ });
277
+ backup.wsList = [...data.wsList];
278
+ }
279
+
280
+ if (data.routeList) {
281
+ routeList.value = [...(data.routeList ?? [])]
282
+ ?.filter(
283
+ (item) =>
284
+ item.path.includes(searchRoute.value) ||
285
+ item.name?.includes(searchRoute.value),
286
+ )
287
+ ?.map((item) => {
288
+ return {
289
+ ...item,
290
+ name: hightLight(item.name, searchRoute.value),
291
+ path: hightLight(item.path, searchRoute.value),
292
+ };
293
+ });
294
+ backup.routeList = [...data.routeList];
295
+ }
296
+
297
+ if (data.elEventList) elEventList.value = [...data.elEventList];
298
+ if (data.uniEventList) uniEventList.value = [...data.uniEventList];
299
+ if (data.eventCount) eventCount.value = { ...data.eventCount };
300
+ if (data.vuexList) vuexList.value = data.vuexList;
301
+ if (data.piniaList) piniaList.value = data.piniaList;
302
+ if (data.netWorkStatus) netWorkStatus.value = data.netWorkStatus;
303
+ if (data.sizeFormat) sizeFormat.value = data.sizeFormat;
304
+ if (data.screenList) screenList.value = [...data.screenList];
305
+ if (data.interceptNetworkMap) {
306
+ interceptNetworkList.value = Array.from(
307
+ data.interceptNetworkMap.values(),
308
+ );
309
+ }
310
+
311
+ if (data.devToolVersion || data.devToolBuildTime || data.devToolGit) {
312
+ Object.assign(buildInfo, {
313
+ devToolVersion: data.devToolVersion,
314
+ devToolBuildTime: data.devToolBuildTime,
315
+ devToolGit: data.devToolGit,
316
+ });
317
+ }
318
+
319
+ if (data.scanCodeList) scanCodeList.value = [...data.scanCodeList];
320
+ if (data.nfcList) nfcList.value = [...data.nfcList];
321
+ };
322
+
323
+ return {
324
+ consoleList,
325
+ networkList,
326
+ transferList,
327
+ storageList,
328
+ routeList,
329
+ wsList,
330
+ vuexList,
331
+ piniaList,
332
+ elEventList,
333
+ uniEventList,
334
+ eventCount,
335
+ screenList,
336
+ interceptNetworkList,
337
+ scanCodeList,
338
+ nfcList,
339
+ netWorkStatus,
340
+ sizeFormat,
341
+ devToolVisible,
342
+ cacheInterceptConfig,
343
+ cacheNetworkLog,
344
+ cacheConsoleLog,
345
+ useTransition,
346
+ baseFontSize,
347
+ tagFontSize,
348
+ tipsFontSize,
349
+ fontFamily,
350
+ fontWeight,
351
+ performanceVisible,
352
+ performanceShowFps,
353
+ performanceShowCpu,
354
+ barrageVisible,
355
+ barrageShowWhenOpen,
356
+ barrageMaxTracks,
357
+ barrageTrackHeight,
358
+ barrageStartTop,
359
+ barrageDuration,
360
+ barrageMaxLength,
361
+ barrageTypes,
362
+ backup,
363
+ buildInfo,
364
+ currentConsoleType,
365
+ currentNetworkType,
366
+ currentNetworkSort,
367
+ currentTransferType,
368
+ currentTransferCategory,
369
+ currentWebSocketType,
370
+ searchConsole,
371
+ searchNetwork,
372
+ searchTransfer,
373
+ searchWs,
374
+ searchRoute,
375
+ searchStorage,
376
+ activeTab,
377
+ tabScrollLeft,
378
+ theme,
379
+ isFullScreen,
380
+ windowX,
381
+ windowY,
382
+ windowWidth,
383
+ windowHeight,
384
+ setIsActive,
385
+ listenPostMessage,
386
+ };
387
+ }