vite-uni-dev-tool 1.0.0 → 1.2.0

package/dist/v3/DevTool/components/BluetoothList/index.vue

@@ -0,0 +1,167 @@
+<template>
+  <view class="bluetooth-content">
+    <view class="bluetooth-control">
+      <DevToolTitle>{{ t('bluetooth.title') }}</DevToolTitle>
+
+      <view class="control-btns">
+        <Tag v-if="!isSearching" mode="clear" @click="startSearch">
+          {{ t('bluetooth.startSearch') }}
+        </Tag>
+        <Tag v-else mode="clear" @click="stopSearch">
+          {{ t('bluetooth.stopSearch') }}
+        </Tag>
+        <Tag mode="clear" @click="clear">{{ t('common.clear') }}</Tag>
+      </view>
+    </view>
+
+    <VirtualList
+      v-if="devices && devices.length > 0"
+      class="bluetooth-list"
+      :pageSize="20"
+      :height="contentHeight - 32 - 32"
+      :data="devices">
+      <template #default="{ list, start, itemsHeight, onSizeChange }">
+        <AutoSize
+          v-for="(item, index) in list"
+          :key="start + index"
+          :index="start + index"
+          :id="`dev-bluetooth-${start + index}`"
+          :itemsHeight="itemsHeight"
+          :onSizeChange="onSizeChange">
+          <BluetoothItem
+            :bluetoothItem="item"
+            @pair="handlePair"
+            @connect="handleConnect"
+            @disconnect="handleDisconnect"
+            @tool="handleTool" />
+        </AutoSize>
+      </template>
+    </VirtualList>
+
+    <Empty v-else />
+  </view>
+</template>
+
+<script lang="ts" setup>
+import type { DevTool } from '../../../../type';
+import DevToolTitle from '../DevToolTitle/index.vue';
+import BluetoothItem from './BluetoothItem.vue';
+import Tag from '../../../components/Tag/index.vue';
+import Empty from '../../../components/Empty/index.vue';
+import VirtualList from '../../../components/VirtualList/index.vue';
+import AutoSize from '../../../components/VirtualList/AutoSize.vue';
+import useBluetooth from '../../../hooks/useBluetooth';
+import { useI18n } from '../../../../i18n';
+
+const { t } = useI18n();
+
+const emits = defineEmits<{
+  (e: 'openTool', device: DevTool.BluetoothItem): void;
+}>();
+
+defineProps<{
+  contentHeight: number;
+}>();
+
+const {
+  devices,
+  isSearching,
+  startBluetoothDevicesDiscovery,
+  stopBluetoothDevicesDiscovery,
+  connectDevice,
+  disconnectDevice,
+  pairDevice,
+} = useBluetooth();
+
+const startSearch = () => {
+  startBluetoothDevicesDiscovery();
+};
+
+const stopSearch = () => {
+  stopBluetoothDevicesDiscovery();
+};
+
+const clear = () => {
+  devices.value = [];
+};
+
+const handlePair = async (deviceId: string) => {
+  try {
+    uni.showLoading({ title: t('bluetooth.requestPairing') });
+    await pairDevice(deviceId);
+    uni.showToast({ title: t('bluetooth.pairRequestSent'), icon: 'success' });
+  } catch (error: unknown) {
+    const err = error as { message?: string };
+    uni.showToast({
+      title: err.message || t('bluetooth.pairRequestFail'),
+      icon: 'none',
+    });
+  } finally {
+    uni.hideLoading();
+  }
+};
+
+const handleConnect = async (deviceId: string) => {
+  try {
+    uni.showLoading({ title: t('bluetooth.connecting') });
+    await connectDevice(deviceId);
+    uni.showToast({ title: t('bluetooth.connectSuccess'), icon: 'success' });
+  } catch (error: unknown) {
+    const err = error as { message?: string };
+    uni.showToast({
+      title: err.message || t('bluetooth.connectFail'),
+      icon: 'none',
+    });
+  } finally {
+    uni.hideLoading();
+  }
+};
+
+const handleDisconnect = async (deviceId: string) => {
+  try {
+    uni.showLoading({ title: t('bluetooth.disconnecting') });
+    await disconnectDevice(deviceId);
+    uni.showToast({ title: t('bluetooth.disconnectSuccess'), icon: 'success' });
+  } catch (error: unknown) {
+    const err = error as { message?: string };
+    uni.showToast({
+      title: err.message || t('bluetooth.disconnectFail'),
+      icon: 'none',
+    });
+  } finally {
+    uni.hideLoading();
+  }
+};
+
+const handleTool = (device: DevTool.BluetoothItem) => {
+  emits('openTool', device);
+};
+</script>
+
+<style scoped>
+.bluetooth-content {
+  height: 100%;
+  overflow: auto;
+  font-size: var(--dev-tool-base-font-size);
+}
+
+.bluetooth-control {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 16px;
+  height: 32px;
+  border-bottom: 1px solid var(--dev-tool-border-color);
+  box-sizing: border-box;
+}
+
+.control-btns {
+  display: flex;
+  gap: 8px;
+}
+
+.bluetooth-list {
+  height: calc(100% - 32px);
+  overflow: auto;
+}
+</style>

package/dist/v3/{CaptureScreen → DevTool/components/CaptureScreen}/index.vue

@@ -50,10 +50,10 @@
 </template>
 <script lang="ts" setup>
 import DevToolTitle from '../DevToolTitle/index.vue';
-import type { DevTool } from '../../type';
-import Empty from '../Empty/index.vue';
-import Tag from '../Tag/index.vue';
-import { useI18n } from '../../i18n';
+import type { DevTool } from '../../../../type';
+import Empty from '../../../components/Empty/index.vue';
+import Tag from '../../../components/Tag/index.vue';
+import { useI18n } from '../../../../i18n';
 
 const { t } = useI18n();
 

package/dist/v3/{ConsoleList → DevTool/components/ConsoleList}/ConsoleItem.vue

@@ -6,19 +6,20 @@
         v-for="(item, index) in consoleItem.args"
         :key="index"
         :class="`console-arg console-arg-${item.type}`"
-        @click="onClickArg(item)"
-      >
+        @click="onClickArg(item)">
         <template v-if="item.type === 'image'">
           <image
             :src="item.value"
             :title="item.value"
             mode="aspectFit"
-            class="console-arg-image"
-          />
-          <view v-html="item.shortValue || item.value"></view>
+            class="console-arg-image" />
+          <view
+            v-html="item._valueHtml || item.shortValue || item.value"></view>
         </template>
 
-        <view v-else v-html="item.shortValue || item.value"></view>
+        <view
+          v-else
+          v-html="item._valueHtml || item.shortValue || item.value"></view>
       </view>
     </view>
     <view class="console-position">
@@ -26,8 +27,7 @@
         <Tag
           v-if="consoleItem.mode"
           mode="log"
-          style="margin-right: 6px; justify-content: center"
-        >
+          style="margin-right: 6px; justify-content: center">
           {{ consoleItem.mode }}
         </Tag>
         <!-- <Tag :mode="consoleItem.type">
@@ -41,14 +41,15 @@
           {{ t('common.executionTime') }}: {{ consoleItem?.executionTime }}ms
         </view>
         <!-- eslint-disable-next-line vue/no-v-text-v-html-on-component -->
-        <view class="console-other" v-html="consoleItem.position"></view>
+        <view
+          class="console-other"
+          v-html="consoleItem._positionHtml || consoleItem.position"></view>
         <!-- eslint-disable-next-line vue/no-v-text-v-html-on-component -->
         <view
           v-if="consoleItem.stack"
-          v-html="consoleItem.stack"
+          v-html="consoleItem._stackHtml || consoleItem.stack"
           :class="`console-other ${isUseDevSource ? 'console-stack' : ''}`"
-          @click="emit('openCode', consoleItem.stack)"
-        ></view>
+          @click="emit('openCode', consoleItem.stack)"></view>
       </view>
     </view>
   </view>
@@ -56,10 +57,11 @@
 
 <script setup lang="ts">
 import { computed } from 'vue';
-import Tag from '../Tag/index.vue';
-import type { DevTool } from '../../type';
-import { isMockWX, openOutLink } from '../../utils';
-import { useI18n } from '../../i18n';
+import Tag from '../../../components/Tag/index.vue';
+import type { DevTool } from '../../../../type';
+
+import { useI18n } from '../../../../i18n';
+import { isMockWX, openOutLink } from '../../../../utils';
 
 const { t } = useI18n();
 const props = defineProps<{
@@ -164,6 +166,10 @@ function onClickArg(item: DevTool.Arg) {
   color: var(--dev-tool-info-color);
 }
 
+.console-item-debug {
+  color: var(--dev-tool-info-color);
+}
+
 .console-item-log {
   color: var(--dev-tool-info-color);
 }

package/dist/v3/{ConsoleList → DevTool/components/ConsoleList}/RunJSInput.vue

@@ -6,15 +6,13 @@
       class="run-js-input"
       :placeholder="t('common.runPlaceholder')"
       @confirm="debounceConfirm"
-      @input="onChange"
-    />
+      @input="onChange" />
     <view class="run-js-tips">
       <view
         class="run-js-tips-item"
         v-for="(item, index) in tips"
         :key="index"
-        @click="onChoose(item.name)"
-      >
+        @click="onChoose(item.name)">
         {{ item.name }}{{ item.description ? ': ' : ' ' }}{{ item.description }}
       </view>
     </view>
@@ -29,8 +27,8 @@ import {
   baseSymbols,
   type Tip,
 } from './staticTips';
-import { debounce } from '../../utils';
-import { useI18n } from '../../i18n';
+import { debounce } from '../../../../utils';
+import { useI18n } from '../../../../i18n';
 
 const { t } = useI18n();
 

package/dist/v3/{ConsoleList → DevTool/components/ConsoleList}/index.vue

@@ -48,22 +48,29 @@
 </template>
 <script setup lang="ts">
 import ConsoleItem from './ConsoleItem.vue';
-import Tag from '../Tag/index.vue';
-import Empty from '../Empty/index.vue';
-import FilterInput from '../FilterInput/index.vue';
-import Pick from '../Pick/index.vue';
+import Tag from '../../../components/Tag/index.vue';
+import Empty from '../../../components/Empty/index.vue';
+import FilterInput from '../../../components/FilterInput/index.vue';
+import Pick from '../../../components/Pick/index.vue';
 import RunJSInput from './RunJSInput.vue';
-import type { DevTool } from '../../type';
+import type { DevTool } from '../../../../type';
 import { nextTick, onMounted, ref, computed } from 'vue';
-import { debounce } from '../../utils';
-import VirtualList from '../VirtualList/index.vue';
-import AutoSize from '../VirtualList/AutoSize.vue';
+import { debounce } from '../../../../utils';
+import VirtualList from '../../../components/VirtualList/index.vue';
+import AutoSize from '../../../components/VirtualList/AutoSize.vue';
 import DevToolTitle from '../DevToolTitle/index.vue';
-import { useI18n } from '../../i18n';
+import { useI18n } from '../../../../i18n';
 
 const { t } = useI18n();
 
-type ConsoleType = 'all' | 'log' | 'info' | 'warn' | 'error' | 'clear';
+type ConsoleType =
+  | 'all'
+  | 'log'
+  | 'info'
+  | 'debug'
+  | 'warn'
+  | 'error'
+  | 'clear';
 const props = defineProps<{
   consoleList: DevTool.ConsoleItem[];
   sourceFileServers?: string[];
@@ -99,6 +106,10 @@ const consoleFilterItems = computed<
     label: 'info',
     value: 'info',
   },
+  {
+    label: 'debug',
+    value: 'debug',
+  },
   {
     label: 'log',
     value: 'log',

package/dist/v3/{DevToolButton → DevTool/components/DevToolButton}/index.vue

@@ -17,8 +17,11 @@
 <script lang="ts" setup>
 import { onShow } from '@dcloudio/uni-app';
 import { ref } from 'vue';
-import { getDevToolInfo, setDevToolInfo } from '../../modules/devToolInfo';
-import MovableContainer from '../MovableContainer/index.vue';
+import {
+  getDevToolInfo,
+  setDevToolInfo,
+} from '../../../../modules/devToolInfo';
+import MovableContainer from '../../../components/MovableContainer/index.vue';
 
 const x = ref(300);
 const y = ref(500);
@@ -49,8 +52,8 @@ const onClick = () => {
 
 onShow(() => {
   const { left = 300, top = 500 } = getDevToolInfo();
-  x.value = left;
-  y.value = top;
+  x.value = Number(left) || 300;
+  y.value = Number(top) || 500;
 });
 </script>
 <style scoped>

package/dist/v3/{DevToolWindow → DevTool/components/DevToolWindow}/DevToolOverlay.vue

@@ -144,6 +144,20 @@
       :customStyle="customStyle"
       @close="overlayHandlers.onCloseNfcTool" />
   </AppTransition>
+
+  <!-- Bluetooth 工具 -->
+  <AppTransition
+    :show="overlayState?.showBluetoothTool"
+    name="slide-left"
+    :zIndex="zIndex"
+    :animated="useTransition">
+    <BluetoothTool
+      v-if="overlayState?.showBluetoothTool"
+      :device="overlayState?.bluetoothDevice"
+      :contentHeight="contentHeight"
+      :customStyle="customStyle"
+      @back="overlayHandlers.onCloseBluetoothTool" />
+  </AppTransition>
 </template>
 
 <script setup lang="ts">
@@ -156,8 +170,9 @@ import TransferDetail from '../TransferList/TransferDetail.vue';
 import WebSocketDetail from '../WebSocket/WebSocketDetail.vue';
 import JsonDetail from '../JsonDetail/index.vue';
 import NFCTool from '../NFCList/NFCTool.vue';
-import AppTransition from '../AppTransition/index.vue';
-import type { DevTool } from '../../type';
+import BluetoothTool from '../BluetoothList/BluetoothTool.vue';
+import AppTransition from '../../../components/AppTransition/index.vue';
+import type { DevTool } from '../../../../type';
 
 defineProps<{
   overlayState: any;

package/dist/v3/{DevToolWindow → DevTool/components/DevToolWindow}/const.ts

@@ -12,10 +12,11 @@ export const tabIndex = {
   CaptureScreen: 9,
   ScanCode: 10,
   NFC: 11,
-  Storage: 12,
-  Vuex: 13,
-  Pinia: 14,
-  Setting: 15,
+  Bluetooth: 12,
+  Storage: 13,
+  Vuex: 14,
+  Pinia: 15,
+  Setting: 16,
 };
 
 /**
@@ -26,97 +27,119 @@ export const getTabItems = (t: (key: string) => string) => [
   {
     key: 'Console',
     label: t('tabs.console'),
+    icon: '💻',
     value: 'Console',
     index: tabIndex.Console,
   },
   {
     key: 'Network',
     label: t('tabs.network'),
+    icon: '🌐',
     value: 'NetWork',
     index: tabIndex.Network,
   },
   {
     key: 'Transfer',
     label: t('tabs.transfer'),
+    icon: '📤',
     value: 'Transfer',
     index: tabIndex.Transfer,
   },
   {
     key: 'WebSocket',
     label: t('tabs.websocket'),
+    icon: '🔌',
     value: 'WebSocket',
     index: tabIndex.WebSocket,
   },
   {
     key: 'Route',
     label: t('tabs.route'),
+    icon: '🧭',
     value: 'Route',
     index: tabIndex.Route,
   },
   {
     key: 'Instance',
     label: t('tabs.instance'),
+    icon: '🌳',
     value: 'Instance',
     index: tabIndex.Instance,
   },
   {
     key: 'ElEvent',
     label: t('tabs.elEvent'),
+    icon: '👆',
     value: 'ElEvent',
     index: tabIndex.ElEvent,
   },
   {
     key: 'UniEvent',
     label: t('tabs.uniEvent'),
+    icon: '📻',
     value: 'UniEvent',
     index: tabIndex.UniEvent,
   },
   {
     key: 'Performance',
     label: t('tabs.performance'),
+    icon: '🚀',
     value: 'Performance',
     index: tabIndex.Performance,
   },
   {
     key: 'CaptureScreen',
     label: t('tabs.captureScreen'),
+    icon: '📸',
     value: 'CaptureScreen',
     index: tabIndex.CaptureScreen,
   },
   {
     key: 'ScanCode',
     label: t('tabs.scanCode'),
+    icon: '🔍',
     value: 'ScanCode',
     index: tabIndex.ScanCode,
   },
   {
     key: 'NFC',
     label: t('tabs.nfc'),
+    icon: '📳',
     value: 'NFC',
     index: tabIndex.NFC,
   },
+  {
+    key: 'Bluetooth',
+    label: t('tabs.bluetooth'),
+    icon: '🔹',
+    value: 'Bluetooth',
+    index: tabIndex.Bluetooth,
+  },
   {
     key: 'Storage',
     label: t('tabs.storage'),
+    icon: '📦',
     value: 'Storage',
     index: tabIndex.Storage,
   },
   {
     key: 'Vuex',
     label: t('tabs.vuex'),
+    icon: '💚',
     value: 'Vuex',
     index: tabIndex.Vuex,
   },
   {
     key: 'Pinia',
     label: t('tabs.pinia'),
+    icon: '🍍',
     value: 'Pinia',
     index: tabIndex.Pinia,
   },
-
   {
     key: 'Setting',
     label: t('tabs.setting'),
+    icon: '⚙️',
     value: 'Setting',
     index: tabIndex.Setting,
   },

package/dist/v3/{DevToolWindow → DevTool/components/DevToolWindow}/hooks/dataUtils.ts

@@ -1,4 +1,4 @@
-import type { DevTool } from '../../../type';
+import type { DevTool } from '../../../../../type';
 
 export const calcLineStartAndEnd = (
   list: DevTool.NetworkItem[],

package/dist/v3/{DevToolWindow → DevTool/components/DevToolWindow}/hooks/useDevToolData.ts

@@ -1,7 +1,7 @@
 import { shallowRef, reactive, ref } from 'vue';
-import type { DevTool } from '../../../type';
+import type { DevTool } from '../../../../../type';
 
-import { hightLight } from '../../../utils/index';
+import { hightLight } from '../../../../../utils/index';
 import { calcLineStartAndEnd, calcNetworkTimeline } from './dataUtils';
 
 export function useDevToolData(props: any) {
@@ -39,6 +39,22 @@ export function useDevToolData(props: any) {
   const performanceVisible = shallowRef(false);
   const performanceShowFps = shallowRef(true);
   const performanceShowCpu = shallowRef(true);
+  const barrageVisible = shallowRef(true);
+  const barrageShowWhenOpen = shallowRef(false);
+  const barrageMaxTracks = shallowRef(10);
+  const barrageTrackHeight = shallowRef(36);
+  const barrageStartTop = shallowRef(40);
+  const barrageDuration = shallowRef(6);
+  const barrageMaxLength = shallowRef(100);
+  const barrageTypes = shallowRef([
+    'log',
+    'info',
+    'warn',
+    'error',
+    'network',
+    'transfer',
+    'websocket',
+  ]);
 
   // 窗口管理状态
   const isFullScreen = ref(true);
@@ -111,6 +127,31 @@ export function useDevToolData(props: any) {
       performanceShowFps.value = data.performanceShowFps;
     if (data.performanceShowCpu !== undefined)
       performanceShowCpu.value = data.performanceShowCpu;
+    if (data.barrageVisible !== undefined)
+      barrageVisible.value = data.barrageVisible;
+    if (data.barrageShowWhenOpen !== undefined)
+      barrageShowWhenOpen.value = data.barrageShowWhenOpen;
+    if (data.barrageMaxTracks !== undefined)
+      barrageMaxTracks.value = data.barrageMaxTracks;
+    if (data.barrageTrackHeight !== undefined)
+      barrageTrackHeight.value = data.barrageTrackHeight;
+    if (data.barrageStartTop !== undefined)
+      barrageStartTop.value = data.barrageStartTop;
+    if (data.barrageDuration !== undefined)
+      barrageDuration.value = data.barrageDuration;
+    if (data.barrageMaxLength !== undefined)
+      barrageMaxLength.value = data.barrageMaxLength;
+    if (data.barrageTypes !== undefined) {
+      if (Array.isArray(data.barrageTypes)) {
+        barrageTypes.value = data.barrageTypes;
+      } else {
+        // 如果收到了非数组（如诡异的循环引用字符串），打印个警告并忽略
+        console.warn(
+          '[DevTool] Received invalid barrageTypes:',
+          data.barrageTypes,
+        );
+      }
+    }
 
     if (data.consoleList) {
       consoleList.value = [...(data.consoleList ?? [])]
@@ -135,13 +176,13 @@ export function useDevToolData(props: any) {
         ?.map((item) => {
           return {
             ...item,
-            position: hightLight(item.position, searchConsole.value),
-            stack: hightLight(item.stack, searchConsole.value),
+            _positionHtml: hightLight(item.position, searchConsole.value),
+            _stackHtml: hightLight(item.stack, searchConsole.value),
             args: item.args.map((arg) => {
               if (arg.type === 'string') {
                 return {
-                  type: 'string',
-                  value: hightLight(arg.value, searchConsole.value),
+                  ...arg,
+                  _valueHtml: hightLight(arg.value, searchConsole.value),
                 };
               }
               return arg;
@@ -310,6 +351,14 @@ export function useDevToolData(props: any) {
     performanceVisible,
     performanceShowFps,
     performanceShowCpu,
+    barrageVisible,
+    barrageShowWhenOpen,
+    barrageMaxTracks,
+    barrageTrackHeight,
+    barrageStartTop,
+    barrageDuration,
+    barrageMaxLength,
+    barrageTypes,
     backup,
     buildInfo,
     currentConsoleType,