vite-uni-dev-tool 1.0.0 → 1.1.0

package/dist/v3/{SettingList → DevTool/components/SettingList}/modules/SettingDevTool.vue

@@ -1,208 +1,212 @@
-<template>
-  <view class="setting-item">
-    <DevToolTitle>{{ t('setting.devTool.title') }}</DevToolTitle>
-    <view class="setting-item-content">
-      <view class="setting-row">
-        <view>
-          {{ t('setting.devTool.currentVersion') }}：{{
-            buildInfo?.devToolVersion
-          }}
-        </view>
-        <view>
-          {{ t('setting.devTool.buildTime') }}：{{
-            buildInfo?.devToolBuildTime
-          }}
-        </view>
-      </view>
-      <view class="setting-row">
-        {{ t('setting.devTool.feedbackUrl') }}：
-        <text class="setting-link" @click="onOpenLink">
-          {{ buildInfo?.devToolGit }}
-        </text>
-      </view>
-      <view class="setting-tips">
-        {{ t('setting.devTool.slogan') }}
-      </view>
-      <view class="setting-row">
-        <view>{{ t('setting.devTool.tabsConfig') }}：</view>
-      </view>
-      <view class="setting-tips">
-        {{ t('setting.devTool.tabsConfigTip') }}
-      </view>
-      <checkbox-group class="setting-checkbox-group" @change="onCheckboxChange">
-        <label
-          v-for="item in allTabs"
-          :key="item.key"
-          class="setting-checkbox-item">
-          <checkbox
-            :value="item.key"
-            :checked="!hiddenTabs.includes(item.key)"
-            :color="themeColor"
-            style="transform: scale(0.8)" />
-          <text>{{ item.label }}</text>
-        </label>
-      </checkbox-group>
-      <SettingButton @click="onSaveAndRestart">
-        {{ t('setting.devTool.saveAndRestart') }}
-      </SettingButton>
-
-      <view class="setting-row">
-        <view>{{ t('setting.devTool.showHideButton') }}：</view>
-      </view>
-      <view class="setting-tips">
-        {{ t('setting.devTool.hideButtonTip') }}
-      </view>
-      <SettingButton @click="onToggleDevButton">
-        {{
-          devToolVisible
-            ? t('setting.devTool.hideButton')
-            : t('setting.devTool.showButton')
-        }}
-      </SettingButton>
-      <view class="setting-row">
-        <view>{{ t('setting.devTool.restartDevTool') }}：</view>
-      </view>
-
-      <view class="setting-tips">
-        {{ t('setting.devTool.restartDevToolTip') }}
-      </view>
-      <SettingButton @click="onRestartDevTool">
-        {{ t('setting.devTool.restartDevToolButton') }}
-      </SettingButton>
-
-      <view class="setting-row">
-        <view>{{ t('setting.devTool.destroyDevTool') }}：</view>
-      </view>
-
-      <view class="setting-tips">
-        {{ t('setting.devTool.destroyDevToolTip') }}
-      </view>
-      <SettingButton @click="onDestroyDevTool">
-        {{ t('setting.devTool.destroyDevToolButton') }}
-      </SettingButton>
-
-      <view class="setting-row">
-        <view>{{ t('setting.devTool.restartApp') }}：</view>
-      </view>
-      <view class="setting-tips">{{ t('setting.devTool.restartAppTip') }}</view>
-      <SettingButton @click="onRestartApp">
-        {{ t('setting.devTool.restartAppButton') }}
-      </SettingButton>
-
-      <view class="setting-row">
-        <view>{{ t('setting.devTool.storageUsage') }}：{{ sizeFormat }}</view>
-      </view>
-      <view class="setting-tips">
-        {{ t('setting.devTool.storageUsageTip') }}
-      </view>
-      <SettingButton @click="onClearCache">
-        {{ t('setting.devTool.clearCache') }}
-      </SettingButton>
-    </view>
-  </view>
-</template>
-
-<script setup lang="ts">
-import { onMounted, ref, computed } from 'vue';
-import DevToolTitle from '../../DevToolTitle/index.vue';
-import SettingButton from '../../SettingButton/index.vue';
-import { openOutLink } from '../../../utils';
-import { useI18n } from '../../../i18n';
-import { getTabItems } from '../../DevToolWindow/const';
-import { getDevToolInfo, setDevToolInfo } from '../../../modules/devToolInfo';
-import { getThemeMainColor } from '../../styles/theme';
-
-const { t } = useI18n();
-
-const props = defineProps<{
-  theme?: string;
-  devToolVisible?: boolean;
-  sizeFormat?: string;
-  buildInfo?: {
-    devToolVersion?: string;
-    devToolBuildTime?: string;
-    devToolGit?: string;
-  };
-}>();
-
-const themeColor = computed(() => getThemeMainColor(props.theme));
-
-const emit = defineEmits<{
-  (e: 'showDevButton', show: boolean): void;
-  (e: 'restartDevTool'): void;
-  (e: 'restartApp'): void;
-  (e: 'clearCache'): void;
-  (e: 'destroyDevTool'): void;
-}>();
-
-function onOpenLink() {
-  openOutLink(props.buildInfo?.devToolGit);
-}
-
-function onToggleDevButton() {
-  emit('showDevButton', !props.devToolVisible);
-}
-
-function onRestartDevTool() {
-  emit('restartDevTool');
-}
-
-function onDestroyDevTool() {
-  emit('destroyDevTool');
-}
-
-function onRestartApp() {
-  emit('restartApp');
-}
-
-function onClearCache() {
-  emit('clearCache');
-}
-
-const allTabs = getTabItems(t).filter((item) => item.key !== 'Setting');
-const hiddenTabs = ref<string[]>([]);
-
-onMounted(() => {
-  const info = getDevToolInfo();
-  hiddenTabs.value = info.hiddenTabs || [
-    'Performance',
-    'CaptureScreen',
-    'ScanCode',
-    'NFC',
-    'ElEvent',
-    'UniEvent',
-  ];
-});
-
-function onCheckboxChange(e: any) {
-  const checkedKeys = e.detail.value;
-  hiddenTabs.value = allTabs
-    .map((item) => item.key)
-    .filter((key) => !checkedKeys.includes(key));
-}
-
-function onSaveAndRestart() {
-  setDevToolInfo({
-    hiddenTabs: hiddenTabs.value,
-  });
-  // 重启应用使配置生效
-  emit('restartApp');
-}
-</script>
-
-<style scoped>
-@import '../index.css';
-
-.setting-checkbox-group {
-  display: flex;
-  flex-wrap: wrap;
-  margin-bottom: 10px;
-}
-
-.setting-checkbox-item {
-  display: flex;
-  align-items: center;
-  margin-bottom: 5px;
-  min-width: 33.33%;
-}
-</style>
+<template>
+  <view class="setting-item">
+    <DevToolTitle>{{ t('setting.devTool.title') }}</DevToolTitle>
+    <view class="setting-item-content">
+      <view class="setting-row">
+        <view>
+          {{ t('setting.devTool.currentVersion') }}：{{
+            buildInfo?.devToolVersion
+          }}
+        </view>
+        <view>
+          {{ t('setting.devTool.buildTime') }}：{{
+            buildInfo?.devToolBuildTime
+          }}
+        </view>
+      </view>
+      <view class="setting-row">
+        {{ t('setting.devTool.feedbackUrl') }}：
+        <text class="setting-link" @click="onOpenLink">
+          {{ buildInfo?.devToolGit }}
+        </text>
+      </view>
+      <view class="setting-tips">
+        {{ t('setting.devTool.slogan') }}
+      </view>
+      <view class="setting-row">
+        <view>{{ t('setting.devTool.tabsConfig') }}：</view>
+      </view>
+      <view class="setting-tips">
+        {{ t('setting.devTool.tabsConfigTip') }}
+      </view>
+      <checkbox-group class="setting-checkbox-group" @change="onCheckboxChange">
+        <label
+          v-for="item in allTabs"
+          :key="item.key"
+          class="setting-checkbox-item">
+          <checkbox
+            :value="item.key"
+            :checked="!hiddenTabs.includes(item.key)"
+            :color="themeColor"
+            style="transform: scale(0.8)" />
+          <text>{{ item.label }}</text>
+        </label>
+      </checkbox-group>
+      <SettingButton @click="onSaveAndRestart">
+        {{ t('setting.devTool.saveAndRestart') }}
+      </SettingButton>
+
+      <view class="setting-row">
+        <view>{{ t('setting.devTool.showHideButton') }}：</view>
+      </view>
+      <view class="setting-tips">
+        {{ t('setting.devTool.hideButtonTip') }}
+      </view>
+      <SettingButton @click="onToggleDevButton">
+        {{
+          devToolVisible
+            ? t('setting.devTool.hideButton')
+            : t('setting.devTool.showButton')
+        }}
+      </SettingButton>
+      <view class="setting-row">
+        <view>{{ t('setting.devTool.restartDevTool') }}：</view>
+      </view>
+
+      <view class="setting-tips">
+        {{ t('setting.devTool.restartDevToolTip') }}
+      </view>
+      <SettingButton @click="onRestartDevTool">
+        {{ t('setting.devTool.restartDevToolButton') }}
+      </SettingButton>
+
+      <view class="setting-row">
+        <view>{{ t('setting.devTool.destroyDevTool') }}：</view>
+      </view>
+
+      <view class="setting-tips">
+        {{ t('setting.devTool.destroyDevToolTip') }}
+      </view>
+      <SettingButton @click="onDestroyDevTool">
+        {{ t('setting.devTool.destroyDevToolButton') }}
+      </SettingButton>
+
+      <view class="setting-row">
+        <view>{{ t('setting.devTool.restartApp') }}：</view>
+      </view>
+      <view class="setting-tips">{{ t('setting.devTool.restartAppTip') }}</view>
+      <SettingButton @click="onRestartApp">
+        {{ t('setting.devTool.restartAppButton') }}
+      </SettingButton>
+
+      <view class="setting-row">
+        <view>{{ t('setting.devTool.storageUsage') }}：{{ sizeFormat }}</view>
+      </view>
+      <view class="setting-tips">
+        {{ t('setting.devTool.storageUsageTip') }}
+      </view>
+      <SettingButton @click="onClearCache">
+        {{ t('setting.devTool.clearCache') }}
+      </SettingButton>
+    </view>
+  </view>
+</template>
+
+<script setup lang="ts">
+import { onMounted, ref, computed } from 'vue';
+import DevToolTitle from '../../DevToolTitle/index.vue';
+import SettingButton from '../../SettingButton/index.vue';
+import { openOutLink } from '../../../../../utils';
+import { useI18n } from '../../../../../i18n';
+import { getTabItems } from '../../DevToolWindow/const';
+import {
+  getDevToolInfo,
+  setDevToolInfo,
+} from '../../../../../modules/devToolInfo';
+import { getThemeMainColor } from '../../../../styles/theme';
+
+const { t } = useI18n();
+
+const props = defineProps<{
+  theme?: string;
+  devToolVisible?: boolean;
+  sizeFormat?: string;
+  buildInfo?: {
+    devToolVersion?: string;
+    devToolBuildTime?: string;
+    devToolGit?: string;
+  };
+}>();
+
+const themeColor = computed(() => getThemeMainColor(props.theme));
+
+const emit = defineEmits<{
+  (e: 'showDevButton', show: boolean): void;
+  (e: 'restartDevTool'): void;
+  (e: 'restartApp'): void;
+  (e: 'clearCache'): void;
+  (e: 'destroyDevTool'): void;
+}>();
+
+function onOpenLink() {
+  openOutLink(props.buildInfo?.devToolGit);
+}
+
+function onToggleDevButton() {
+  emit('showDevButton', !props.devToolVisible);
+}
+
+function onRestartDevTool() {
+  emit('restartDevTool');
+}
+
+function onDestroyDevTool() {
+  emit('destroyDevTool');
+}
+
+function onRestartApp() {
+  emit('restartApp');
+}
+
+function onClearCache() {
+  emit('clearCache');
+}
+
+const allTabs = getTabItems(t).filter((item) => item.key !== 'Setting');
+const hiddenTabs = ref<string[]>([]);
+
+onMounted(() => {
+  const info = getDevToolInfo();
+  hiddenTabs.value = info.hiddenTabs || [
+    'Performance',
+    'CaptureScreen',
+    'ScanCode',
+    'NFC',
+    'Bluetooth',
+    'ElEvent',
+    'UniEvent',
+  ];
+});
+
+function onCheckboxChange(e: any) {
+  const checkedKeys = e.detail.value;
+  hiddenTabs.value = allTabs
+    .map((item) => item.key)
+    .filter((key) => !checkedKeys.includes(key));
+}
+
+function onSaveAndRestart() {
+  setDevToolInfo({
+    hiddenTabs: hiddenTabs.value,
+  });
+  // 重启应用使配置生效
+  emit('restartApp');
+}
+</script>
+
+<style scoped>
+@import '../index.css';
+
+.setting-checkbox-group {
+  display: flex;
+  flex-wrap: wrap;
+  margin-bottom: 10px;
+}
+
+.setting-checkbox-item {
+  display: flex;
+  align-items: center;
+  margin-bottom: 5px;
+  min-width: 33.33%;
+}
+</style>