perf: ♻️ Script and directory structure optimization

.github/ISSUE_TEMPLATE/bug_report.md

@@ -0,0 +1,11 @@
+---
+
+name: 🐞 Bug report
+about: Create a report to help us improve
+title: "[Bug] the title of bug report"
+labels: bug
+assignees: ''
+
+---
+
+#### Describe the bug

.github/ISSUE_TEMPLATE/help_wanted.md

@@ -0,0 +1,10 @@
+---
+name: 🥺 Help wanted
+about: Confuse about the use of electron-vue-vite
+title: "[Help] the title of help wanted report"
+labels: help wanted
+assignees: ''
+
+---
+
+#### Describe the problem you confuse

.vscode/settings.json

@@ -45,7 +45,9 @@
     "pair ${this.formData.host}:${this.formData.port} ${this.formData.pair}",
     "${item.decoder} & ${item.encoder}",
     " & ",
-    "${key}=${value}"
+    "${key}=${value}",
+    "npm install",
+    "npm run build"
   ],
   "cSpell.words": [
     "bhsn"

electron/main.js

@@ -14,7 +14,7 @@ import appStore from './helpers/store.js'
 
 import { getLogoPath } from './configs/index.js'
 
-import events from './events/index.js'
+import ipc from './ipc/index.js'
 
 import control from '$control/electron/main.js'
 
@@ -87,7 +87,7 @@ function createWindow() {
 
   loadPage(mainWindow)
 
-  events(mainWindow)
+  ipc(mainWindow)
 
   control(mainWindow)
 }

package.json

@@ -16,7 +16,6 @@
     "build:win": "vite build && electron-builder --win",
     "build:mac": "vite build && electron-builder --mac",
     "build:linux": "vite build && electron-builder --linux",
-    "preview": "vite preview",
     "svgo": "svgo --folder=src/icons/svgo --output=src/icons/svg --config=src/icons/svgo.config.js",
     "postinstall": "electron-builder install-app-deps",
     "prepare": "husky install"
@@ -57,6 +56,8 @@
     "postcss": "8.4.38",
     "postcss-nested": "6.0.1",
     "postcss-scss": "4.0.9",
+    "rimraf": "^6.0.1",
+    "simple-git": "^3.27.0",
     "unocss": "0.62.3",
     "unplugin-auto-import": "0.18.2",
     "unplugin-vue-components": "0.27.4",

scripts/helpers/index.js

@@ -0,0 +1,97 @@
+import simpleGit from 'simple-git'
+import fs from 'node:fs/promises'
+import path from 'node:path'
+import os from 'node:os'
+import { exec } from 'node:child_process'
+import { promisify } from 'node:util'
+import { fileURLToPath } from 'node:url'
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url))
+
+const execPromise = promisify(exec)
+
+/**
+ * 在临时目录中克隆GitHub仓库,安装依赖,构建项目,并将构建输出复制到指定目录。
+ *
+ * @param {Object} options - 函数的配置选项。
+ * @param {string} options.repoUrl - 要克隆的GitHub仓库URL。
+ * @param {string} options.buildOutputDir - 构建输出所在的目录(相对于项目根目录)。
+ * @param {string} options.destinationDir - 构建输出应该被复制到的目录。
+ * @param {string} [options.branch] - 要克隆的分支(默认为'main')。
+ * @param {string} [options.installCommand] - 安装依赖的命令。
+ * @param {string} [options.buildCommand] - 构建项目的命令。
+ * @returns {Promise<void>}
+ *
+ * @example
+ * gitResolve({
+ *   repoUrl: 'https://github.com/user/project.git',
+ *   buildOutputDir: 'dist',
+ *   destinationDir: './public',
+ *   branch: 'main',
+ *   installCommand: 'npm install',
+ *   buildCommand: 'npm run build'
+ * });
+ */
+export async function gitResolve(options) {
+  const {
+    repoUrl,
+    buildOutputDir,
+    destinationDir,
+    branch = 'main',
+    installCommand = 'npm install',
+    buildCommand = 'npm run build',
+  } = options
+
+  const repoName = path.basename(repoUrl, path.extname(repoUrl))
+
+  let tempDir
+
+  try {
+    // 创建临时目录
+    tempDir = await fs.mkdtemp(path.join(os.tmpdir(), `${repoName}-`))
+    console.log(`创建临时目录: ${tempDir}`)
+
+    // 克隆仓库
+    console.log(`正在克隆仓库: ${repoUrl}`)
+    const git = simpleGit()
+    await git.clone(repoUrl, tempDir, ['--depth', '1', '--branch', branch])
+
+    // 切换到临时目录
+    process.chdir(tempDir)
+
+    // 安装依赖
+    console.log('正在安装依赖...')
+    await execPromise(installCommand)
+
+    // 构建项目
+    console.log('正在构建项目...')
+    await execPromise(buildCommand)
+
+    // 复制构建输出到目标目录
+    const sourcePath = path.join(tempDir, buildOutputDir)
+    const finallyDestinationDir = path.join(destinationDir, repoName)
+
+    console.log(
+      `正在将构建输出从 ${sourcePath} 复制到 ${finallyDestinationDir}`,
+    )
+    await fs.cp(sourcePath, finallyDestinationDir, { recursive: true })
+
+    console.log('流程成功完成。')
+  }
+  catch (error) {
+    console.error('发生错误:', error)
+    throw error
+  }
+  finally {
+    if (tempDir) {
+      if (['win32'].includes(process.platform)) {
+        console.log(
+          `注意，在 Windows 中由于文件锁的原因 你需要手动清除缓存目录:\npnpm cleanup ${tempDir}`,
+        )
+      }
+      else {
+        fs.rm(tempDir).catch(e => console.log(e.message))
+      }
+    }
+  }
+}

src/components/Device/components/BatchActions/index.vue

@@ -1,40 +1,42 @@
 <template>
-  <div class="flex items-center space-x-2">
+  <Scrollable>
-    <component
+    <div class="flex items-center space-x-2">
-      :is="item.component || 'div'"
+      <component
-      v-for="(item, index) in actionModel"
+        :is="item.component || 'div'"
-      :key="index"
+        v-for="(item, index) in actionModel"
-      class="flex-none"
+        :key="index"
-      v-bind="{
+        class="flex-none"
-        devices,
+        v-bind="{
-        ...(item.command
+          devices,
-          ? {
+          ...(item.command
-            onClick: () => handleShell(item),
+            ? {
-          }
+              onClick: () => handleShell(item),
-          : {}),
+            }
-      }"
+            : {}),
-    >
+        }"
-      <template #default="{ loading = false } = {}">
+      >
-        <el-button
+        <template #default="{ loading = false } = {}">
-          plain
+          <el-button
-          :title="$t(item.tips || item.label)"
+            plain
-          :loading="loading"
+            :title="$t(item.tips || item.label)"
-        >
+            :loading="loading"
-          <template #icon>
+          >
-            <svg-icon
+            <template #icon>
-              v-if="item.svgIcon"
+              <svg-icon
-              :name="item.svgIcon"
+                v-if="item.svgIcon"
-              :class="item.iconClass"
+                :name="item.svgIcon"
-            ></svg-icon>
+                :class="item.iconClass"
-            <el-icon v-else-if="item.elIcon" :class="item.iconClass">
+              ></svg-icon>
-              <component :is="item.elIcon" />
+              <el-icon v-else-if="item.elIcon" :class="item.iconClass">
-            </el-icon>
+                <component :is="item.elIcon" />
-          </template>
+              </el-icon>
-          {{ $t('common.batch') }}-{{ $t(item.label) }}
+            </template>
-        </el-button>
+            {{ $t('common.batch') }}-{{ $t(item.label) }}
-      </template>
+          </el-button>
-    </component>
+        </template>
-  </div>
+      </component>
+    </div>
+  </Scrollable>
 </template>
 
 <script setup>

src/components/Device/index.vue

@@ -86,7 +86,7 @@
         <el-table-column
           v-slot="{ row, $index }"
           :label="$t('device.control.name')"
-          min-width="250"
+          min-width="300"
           align="left"
         >
           <MirrorAction