初始化

2025-07-01 21:36:08 +08:00
commit 5f904364bf
51 changed files with 18760 additions and 0 deletions
--- a/.env.development
+++ b/.env.development
@@ -0,0 +1,5 @@
+# .env.development
+
+VUE_APP_API_URL="123123123"
+
+# VUE_APP_FEATURE_FLAG=true
--- a/.env.production
+++ b/.env.production
@@ -0,0 +1,5 @@
+# .env.production
+
+VUE_APP_API_URL="434534534"
+
+# VUE_APP_FEATURE_FLAG=true
--- a/.gitignore
+++ b/.gitignore
@@ -0,0 +1,23 @@
+.DS_Store
+node_modules
+/dist
+
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
--- a/README.md
+++ b/README.md
@@ -0,0 +1,19 @@
+# tk-page
+
+## Project setup
+```
+npm install
+```
+
+### Compiles and hot-reloads for development
+```
+npm run serve
+```
+
+### Compiles and minifies for production
+```
+npm run build
+```
+
+### Customize configuration
+See [Configuration Reference](https://cli.vuejs.org/config/).
--- a/babel.config.js
+++ b/babel.config.js
@@ -0,0 +1,5 @@
+module.exports = {
+  presets: [
+    '@vue/cli-plugin-babel/preset'
+  ]
+}
--- a/jsconfig.json
+++ b/jsconfig.json
@@ -0,0 +1,19 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "esnext",
+    "baseUrl": "./",
+    "moduleResolution": "node",
+    "paths": {
+      "@/*": [
+        "src/*"
+      ]
+    },
+    "lib": [
+      "esnext",
+      "dom",
+      "dom.iterable",
+      "scripthost"
+    ]
+  }
+}
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -0,0 +1,46 @@
+{
+  "name": "tk-page",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "serve": "vue-cli-service serve",
+    "build": "vue-cli-service build"
+  },
+  "dependencies": {
+    "@ffmpeg/core": "^0.12.10",
+    "@ffmpeg/util": "^0.12.2",
+    "@vueuse/core": "^13.1.0",
+    "axios": "^1.8.4",
+    "core-js": "^3.8.3",
+    "echarts": "^5.6.0",
+    "element-plus": "^2.9.7",
+    "ffmpeg-wasm": "^1.0.1",
+    "h264-converter": "^0.1.4",
+    "lodash": "^4.17.21",
+    "msgpack-lite": "^0.1.26",
+    "pinia": "^3.0.1",
+    "qwebchannel": "^6.2.0",
+    "socket.io-client": "^4.8.1",
+    "vue": "^3.2.13",
+    "vue-router": "^4.0.3",
+    "vuex": "^4.0.0"
+  },
+  "devDependencies": {
+    "@vue/cli-plugin-babel": "~5.0.0",
+    "@vue/cli-plugin-router": "~5.0.0",
+    "@vue/cli-plugin-vuex": "~5.0.0",
+    "@vue/cli-service": "~5.0.0",
+    "less": "^4.2.2",
+    "less-loader": "^12.2.0",
+    "postcss-preset-env": "^10.1.5",
+    "postcss-px-to-viewport": "^1.1.1",
+    "postcss-px-viewport": "^0.0.4",
+    "postcss-viewport-units": "^0.1.6"
+  },
+  "browserslist": [
+    "> 1%",
+    "last 2 versions",
+    "not dead",
+    "not ie 11"
+  ]
+}
--- a/postcss.config.js
+++ b/postcss.config.js
@@ -0,0 +1,13 @@
+// module.exports = {
+//     plugins: {
+//         'postcss-px-to-viewport': {
+//             viewportWidth: 1600, // 视窗的宽度，对应设计稿宽度
+//             viewportHeight: 900, // 视窗的高度，对应设计稿高度
+//             unitPrecision: 3, // 指定 px 转换为视窗单位值的小数位数
+//             viewportUnit: 'vw', // 指定需要转换成的视窗单位，vw 或者 vh
+//             selectorBlackList: ['.ignore', '.hairlines'], // 指定不需要转换的类
+//             minPixelValue: 1, // 小于或等于 1 px 不转换为视窗单位
+//             mediaQuery: false // 允许在媒体查询中转换 px
+//         }
+//     }
+// };
--- a/public/favicon.ico
+++ b/public/favicon.ico
--- a/public/index.html
+++ b/public/index.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
+  <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+  <title>
+    <%= webpackConfig.name %>
+  </title>
+  <!-- <script src="qrc:///qtwebchannel/qwebchannel.js"></script> -->
+</head>
+
+<body>
+  <noscript>
+    <strong>We're sorry but <%= webpackConfig.name %> doesn't work properly without JavaScript enabled. Please enable it
+        to continue.</strong>
+  </noscript>
+  <div id="app"></div>
+  <!-- built files will be auto injected -->
+</body>
+<style>
+  body {
+    margin: 0;
+    padding: 0;
+    /* width: 1600px;
+    height: 900px; */
+  }
+</style>
+
+</html>
--- a/src/App.vue
+++ b/src/App.vue
@@ -0,0 +1,71 @@
+<template>
+  <div>
+    <router-view v-if="isRouterAlive" />
+  </div>
+</template>
+ 
+<script>
+export default {
+  name: 'App',
+  provide() {
+    return { 
+      reload: this.reload
+    }
+  },
+  data() {
+    return {
+      isRouterAlive: true
+    }
+  },
+  methods: {
+    reload() {
+      // 先将组件隐藏
+      this.isRouterAlive = false
+      
+      // 使用nextTick确保DOM更新后再重新显示组件
+      this.$nextTick(() => {
+        this.isRouterAlive = true
+      })
+    }
+  }
+}
+
+const debounce = (fn, delay) => {
+  let timer
+  return (...args) => {
+    if (timer) {
+      clearTimeout(timer)
+    }
+    timer = setTimeout(() => {
+      fn(...args)
+    }, delay)
+  }
+}
+
+const _ResizeObserver = window.ResizeObserver
+window.ResizeObserver = class ResizeObserver extends _ResizeObserver {
+  constructor(callback) {
+    callback = debounce(callback, 200)
+    super(callback)
+  }
+}
+</script>
+
+<style>
+/* App.vue */
+.layout {
+  display: grid;
+  grid-template-rows: auto 1fr;
+  height: 100vh;
+}
+/* #vite-error-overlay { display: none !important; } 隐藏vite错误提示 */
+.control-area { 
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  touch-action: none;
+  /* 禁用默认滚动 */
+}
+</style>
--- a/src/api/account.js
+++ b/src/api/account.js
@@ -0,0 +1,47 @@
+import { getAxios, postAxios, downFile } from '@/utils/axios.js'
+
+export function apiGetCart() {
+    return getAxios({ url: '/cgi-bin/cart/latest' })
+}
+export function login(data) {
+    return postAxios({ url: 'api/account/login', data })
+}
+export function cheekalive(data) {
+    return postAxios({ url: 'api/account/cheekalive', data })
+}
+export function tkhostdata(data) {
+    return postAxios({ url: 'api/tkinfo/tkhostdata', data })
+}
+export function dicts(data) {
+    return postAxios({ url: 'api/param/dicts', data })
+}
+export function tkhostdetail(data) {
+    return postAxios({ url: 'api/tkinfo/tkhostdetail', data })
+}
+//导出表格
+export function exporthosts(data) {
+    return postAxios({ url: 'api/export/hostsinfo', data })
+}
+export function downList(url, data) {
+    return downFile(url, data)
+}
+//查询tk账号查询次数
+export function tkaccountuseinfo(data) {
+    return postAxios({ url: 'api/tkinfo/tkaccountuseinfo', data })
+}
+//查询员工
+export function getStaffList(data) {
+    return postAxios({ url: 'api/account/list', data })
+}
+//分配主播
+export function managerhosts(data) {
+    return postAxios({ url: 'api/account/managerhosts', data })
+}
+//编辑主播
+export function upholdinfo(data) {
+    return postAxios({ url: 'api/tkinfo/upholdinfo', data })
+}
+//获取
+export function getCountryinfo(data) {
+    return postAxios({ url: 'api/tkinfo/countryinfo', data })
+}
--- a/src/api/adb.js
+++ b/src/api/adb.js
@@ -0,0 +1,7 @@
+import { getAxios, postAxios, downFile } from '@/utils/axios.js'
+export function getPhoneSize() {
+    return getAxios({ url: '/api/router/scrcpy/size' })
+}
+export function touchclick(data) {
+    return getAxios({ url: `/api/router/scrcpy/click?x=${data.x}&y=${data.y}&type=${data.type}`, })
+}
--- a/src/api/chat.js
+++ b/src/api/chat.js
@@ -0,0 +1,7 @@
+import { getAxios, postAxios } from '@/utils/axios.js'
+
+
+export function chat(data) {
+    return postAxios({ url: '/chat', data })
+}
+
--- a/src/assets/Back.png
+++ b/src/assets/Back.png
--- a/src/assets/Home.png
+++ b/src/assets/Home.png
--- a/src/assets/Overview.png
+++ b/src/assets/Overview.png
--- a/src/assets/filter.png
+++ b/src/assets/filter.png
--- a/src/assets/list.png
+++ b/src/assets/list.png
--- a/src/assets/listAction.png
+++ b/src/assets/listAction.png
--- a/src/assets/logo.png
+++ b/src/assets/logo.png
--- a/src/assets/logo1.png
+++ b/src/assets/logo1.png
--- a/src/assets/logoBg.png
+++ b/src/assets/logoBg.png
--- a/src/assets/logoBg1.png
+++ b/src/assets/logoBg1.png
--- a/src/assets/logotext.png
+++ b/src/assets/logotext.png
--- a/src/assets/logotext1.png
+++ b/src/assets/logotext1.png
--- a/src/assets/logotext12.png
+++ b/src/assets/logotext12.png
--- a/src/assets/navAction.png
+++ b/src/assets/navAction.png
--- a/src/assets/open.png
+++ b/src/assets/open.png
--- a/src/assets/password.png
+++ b/src/assets/password.png
--- a/src/assets/username.png
+++ b/src/assets/username.png
--- a/src/assets/work.png
+++ b/src/assets/work.png
--- a/src/assets/workAction.png
+++ b/src/assets/workAction.png
--- a/src/assets/worklogo.png
+++ b/src/assets/worklogo.png
--- a/src/components/ChatDialog.vue
+++ b/src/components/ChatDialog.vue
@@ -0,0 +1,100 @@
+<template>
+    <div v-if="visible" class="dialog-overlay" @click.self="close">
+        <div class="dialog-content">
+            <h3 class="text-lg font-bold mb-4">最近一条的消息翻译</h3>
+            <div class="chat-box">
+                <div class="left-message">
+                    <div class="bubble left">{{ leftMsg }}</div>
+                </div>
+                <div class="right-message">
+                    <div class="bubble right">{{ rightMsg }}</div>
+                </div>
+            </div>
+            <!-- <button class="close-btn" @click="close">关闭</button> -->
+        </div>
+    </div>
+</template>
+
+<script setup>
+import { defineProps, defineEmits } from 'vue'
+
+const props = defineProps({
+    leftMsg: String,
+    rightMsg: String,
+    visible: Boolean
+})
+
+// const emit = defineEmits(['close'])
+
+// const close = () => emit('close')
+</script>
+
+<style scoped>
+.dialog-overlay {
+    /* position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0; */
+    /* background: rgba(0, 0, 0, 0.5); */
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.dialog-content {
+    background: rgb(246, 246, 246);
+    padding: 0px 20px 20px 20px;
+    border-radius: 12px;
+    width: 300px;
+}
+
+.chat-box {
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+}
+
+.left-message {
+    align-self: flex-start;
+}
+
+.right-message {
+    align-self: flex-end;
+    text-align: right;
+}
+
+.bubble {
+    padding: 10px 14px;
+    border-radius: 18px;
+    max-width: 70%;
+
+    display: inline-block;
+    /* 👈 使气泡宽度自适应内容 */
+    padding: 10px 14px;
+    border-radius: 18px;
+    max-width: 70%;
+    word-break: break-word;
+    /* 防止英文单词太长撑爆 */
+}
+
+.bubble.left {
+    background-color: #ffffff;
+}
+
+.bubble.right {
+    background-color: rgb(0, 169, 214);
+    color: white;
+
+}
+
+.close-btn {
+    margin-top: 20px;
+    padding: 8px 12px;
+    background-color: #409EFF;
+    color: white;
+    border: none;
+    border-radius: 6px;
+    cursor: pointer;
+}
+</style>
--- a/src/components/MultiLineInputDialog.vue.vue
+++ b/src/components/MultiLineInputDialog.vue.vue
@@ -0,0 +1,107 @@
+<template>
+    <el-dialog draggable :title="title" v-model="visibleLocal" width="600px" @close="handleCancel">
+        <el-input type="textarea" v-model="rawText" :rows="10" :placeholder="placeholder" clearable></el-input>
+        <template #footer>
+            <el-button @click="handleCancel">取消</el-button>
+            <el-button type="primary" @click="handleConfirm">确定</el-button>
+        </template>
+    </el-dialog>
+</template>
+
+<script setup>
+import { ref, computed, watch } from 'vue';
+
+// 定义接收的 props
+const props = defineProps({
+    /** 对话框可见性，外部通过 v-model:visible 绑定 */
+    visible: {
+        type: Boolean,
+        required: true,
+    },
+    /** 对话框标题 */
+    title: {
+        type: String,
+        default: '',
+    },
+    /** 文本框初始内容，可选 */
+    initialText: {
+        type: String,
+        default: '',
+    },
+    /** 文本框行数 */
+    type: {
+        type: Number,
+        default: 10,
+    },
+    /** index */
+    index: {
+        type: Number,
+        default: 999,
+    },
+    /** 文本框占位符 */
+    placeholder: {
+        type: String,
+        default: '每行一条，支持粘贴多行后自动拆分',
+    },
+    /** 是否去重，默认 true */
+    dedupe: {
+        type: Boolean,
+        default: true,
+    },
+});
+
+// 定义 emits
+const emit = defineEmits(['update:visible', 'confirm', 'cancel']);
+
+// 本地 rawText，用于绑定 textarea
+const rawText = ref(props.initialText);
+
+// 当 props.initialText 变化时，更新 rawText
+watch(
+    () => props.initialText,
+    (newVal) => {
+        rawText.value = newVal;
+    }
+);
+
+// 计算属性，用于 v-model:visible 绑定 el-dialog
+const visibleLocal = computed({
+    get() {
+        return props.visible;
+    },
+    set(val) {
+        emit('update:visible', val);
+    },
+});
+
+/** 解析 rawText 为数组：按行拆分，trim，去空，去重（如 dedupe=true） */
+function parseLines() {
+    const lines = rawText.value
+        .split(/\r?\n/)
+        .map((line) => line.trim())
+        .filter((line) => line.length > 0);
+    if (props.dedupe) {
+        return Array.from(new Set(lines));
+    }
+    return lines;
+}
+
+/** 点击确定按钮 */
+function handleConfirm() {
+    const items = parseLines();
+    emit('confirm', items, props.title, props.index);
+    // 关闭对话框
+    emit('update:visible', false);
+    rawText.value = '';
+}
+
+/** 点击取消或对话框关闭 */
+function handleCancel() {
+    emit('update:visible', false);
+    emit('cancel');
+}
+</script>
+
+<style scoped>
+/* 可根据项目风格调整 */
+</style>
--- a/src/main.js
+++ b/src/main.js
@@ -0,0 +1,24 @@
+import { createApp } from 'vue'
+import App from './App.vue'
+import router from './router'
+import store from './store'
+import { createPinia } from 'pinia';
+import ElementPlus from 'element-plus'
+import 'element-plus/dist/index.css'
+import { Buffer } from 'buffer';
+
+
+// createApp(App).use(store).use(router).mount('#app')
+
+
+const app = createApp(App);
+app.use(ElementPlus)      // 注册 ElementPlus
+app.use(createPinia()); // 注册 Pinia
+app.use(store); // 注册 store
+app.use(router);
+app.config.globalProperties.Buffer = Buffer; // 注册 Buffer
+
+window.addEventListener('unhandledrejection', event => event.preventDefault());
+window.addEventListener('error', event => event.preventDefault()); // 阻止错误和未处overlay理的 Promise 拒绝事件冒泡到 window 对象
+app.mount('#app');
+
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -0,0 +1,24 @@
+import { createRouter, createWebHashHistory, createWebHistory } from 'vue-router'
+import HomeView from '../views/HomeView.vue'
+
+const routes = [
+  {
+    path: '/',
+    name: 'home',
+    component: HomeView
+
+  },
+
+
+  {
+    path: '/Video',
+    name: 'Video',
+    component: () => import(/* webpackChunkName: "about" */ '@/views/VideoStream.vue')
+  }
+]
+const router = createRouter({
+  history: createWebHistory(),
+  routes
+})
+
+export default router
--- a/src/services/websocket.js
+++ b/src/services/websocket.js
@@ -0,0 +1,54 @@
+// src/services/websocket.js
+let ws = null;
+let reconnectTimer = null;
+
+export const connectWebSocket = (port = 8000) => {
+    // 关闭已有连接
+    if (ws) ws.close();
+
+    // 创建新连接
+    ws = new WebSocket(`ws://localhost:${port}`);
+
+    // 连接事件处理
+    ws.onopen = () => {
+        console.log('WS connected');
+        clearInterval(reconnectTimer);
+
+    };
+
+    ws.onerror = (error) => {
+        console.error('WS error:', error);
+        handleReconnect();
+    };
+
+    ws.onclose = (event) => {
+        console.log('WS closed:', event.reason);
+        handleReconnect();
+    };
+
+    ws.onmessage = (event) => {
+        console.log(12312312, event.data)
+        if (event.data instanceof Blob) {
+            // createImageBitmap(event.data).then(img => {
+            //     ctx.drawImage(img, 0, 0);
+            // });
+        }
+    };
+
+    return ws;
+};
+
+// 自动重连机制
+const handleReconnect = () => {
+    clearInterval(reconnectTimer);
+    // reconnectTimer = setInterval(() => {
+    //     connectWebSocket(8000);
+    // }, 3000);
+};
+
+// 发送控制指令
+export const sendControl = (data) => {
+    if (ws?.readyState === WebSocket.OPEN) {
+        ws.send(JSON.stringify(data));
+    }
+};
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -0,0 +1,14 @@
+import { createStore } from 'vuex'
+
+export default createStore({
+  state: {
+  },
+  getters: {
+  },
+  mutations: {
+  },
+  actions: {
+  },
+  modules: {
+  }
+})
--- a/src/stores/notice.js
+++ b/src/stores/notice.js
@@ -0,0 +1,12 @@
+import { defineStore } from 'pinia';
+
+export const noticeStore = defineStore('noticeNum', {
+	state: () => {
+		return { data: { num: 0 } };
+	},
+	actions: {
+		increment() {
+			this.data.num++;
+		},
+	},
+});
--- a/src/utils/axios.js
+++ b/src/utils/axios.js
@@ -0,0 +1,172 @@
+/**
+ * axios请求封装
+ * https://rudon.blog.csdn.net/
+ */
+import axios from 'axios'
+import { getToken, getUser } from '@/utils/storage'
+import { useRouter } from 'vue-router';
+import { ElMessage } from 'element-plus';
+
+const router = useRouter();
+// axios.defaults.withCredentials = true;
+// 请求地址前缀
+let baseURL = ''
+if (process.env.NODE_ENV === 'development') {
+    // 生产环境
+    // baseURL = "http://120.26.251.180:8085/"
+    baseURL = "http://120.26.251.180:15330"
+} else {
+    // 开发环境
+    baseURL = "http://120.26.251.180:8085/"
+}
+
+// 请求拦截器
+axios.interceptors.request.use((config) => {
+    // if (getToken()) {
+    //     config.headers['token'] = getToken();
+    // }
+
+    // 请求超时时间 - 毫秒
+    config.timeout = 60000
+    config.baseURL = baseURL
+    // 自定义Content-type
+    config.headers['Content-type'] = 'application/json'
+    return config;
+}, (error) => {
+    return Promise.reject(error)
+})
+
+// 响应拦截器
+axios.interceptors.response.use((response) => {
+    return response
+}, (error) => {
+    // 可添加请求失败后的处理逻辑
+    return Promise.reject(error)
+})
+
+
+
+// axios的get请求
+export function getAxios({ url, params }) {
+    // 使用axios发送GET请求
+    return new Promise((resolve, reject) => {
+        axios.get(url, {
+            params
+            // 请求成功，将返回的数据传递给resolve函数
+        }).then(res => {
+            resolve(res.data)
+            // 请求失败，将错误信息传递给reject函数
+        }).catch(err => {
+            console.log(err)
+            reject(err)
+        })
+    })
+}
+
+// axios的post请求
+export function postAxios({ url, data }) {
+    // if (url != 'api/account/login') {
+
+    //     throttledCheekalive();
+
+    // }
+
+
+    return new Promise((resolve, reject) => {
+        axios.post(
+            url,
+            data,
+            {
+                headers: {
+                    'Content-Type': 'application/x-www-form-urlencoded'
+                }
+            }
+        ).then(res => {
+            resolve(res.data)
+        }).catch(err => {
+            if (err.message == "Network Error") {
+                // alert("网络错误，请检查网络连接")
+                // ElMessage.error('网络连接错误');
+                reject('网络连接错误')
+
+            } else {
+                ElMessage.error(err.message);
+                reject(err.message)
+
+            }
+            // console.log(err)
+            // reject(err)
+        })
+    })
+}
+export const downFile = async (urlstr, data) => {
+
+    // 发送请求，获取文件流
+    const response = await axios.post(urlstr, data, { responseType: 'blob' });
+
+    // 获取文件名（如果后端设置了 Content-Disposition）
+    const contentDisposition = response.headers['content-disposition'];
+    let fileName = 'default-file-name'; // 默认文件名
+    console.log(contentDisposition)
+    console.log(response)
+    if (contentDisposition) {
+        // 从响应头中提取文件名
+        const fileNameMatch = contentDisposition.match(/filename="(.+)"/);
+        if (fileNameMatch && fileNameMatch.length > 1) {
+            fileName = fileNameMatch[1];
+        }
+    }
+
+    // 创建一个临时的下载链接
+    const blob = new Blob([response.data], { type: response.headers['content-type'] });
+    const url = window.URL.createObjectURL(blob);
+    const a = document.createElement('a');
+    a.href = url;
+    a.download = fileName; // 设置下载的文件名
+    a.click();
+
+    // 释放 URL 对象
+    window.URL.revokeObjectURL(url);
+
+
+}
+//请求前验证
+function cheekalive() {
+    axios.post('api/account/cheekalive', {
+        userId: getUser().userId,
+        currcode: getToken(),
+    },
+        {
+            headers: {
+                'Content-Type': 'application/x-www-form-urlencoded'
+            }
+        }
+    ).then(res => {
+        console.log(res.data)
+        if (res.data) {
+
+        } else {
+            alert("账号在其他地方登录！")
+            window.location.href = '/';
+        }
+
+
+    })
+}
+//节流函数
+function throttle(func, limit) {
+    let inThrottle;
+    return function () {
+        const args = arguments;
+        const context = this;
+        if (!inThrottle) {
+            func.apply(context, args);
+            inThrottle = true;
+            setTimeout(() => inThrottle = false, limit);
+        }
+    }
+}
+
+const throttledCheekalive = throttle(cheekalive, 5000);
+
+export default axios
--- a/src/utils/bufferUtils.js
+++ b/src/utils/bufferUtils.js
@@ -0,0 +1,262 @@
+import { Buffer } from 'buffer';  // 如果在浏览器环境需要引入buffer包
+
+// PAYLOAD_LENGTHs 统一定义，实际根据你的需求调整
+export const PAYLOAD_LENGTHs = 13;
+export const MAX_PRESSURE_VALUE = 100; // 假设最大压力值
+export const PAYLOAD_LENGTH = 33; // 根据实际计算确定
+// 按钮消息对象转 buffer   返回-主页-视图  和  键盘按键的事件 转 buffer
+export function toBufferBtn(message) {
+    const buffer = new Uint8Array(PAYLOAD_LENGTHs + 1);
+    let offset = 0;
+
+    // 写入类型 (1 字节)
+    buffer[offset++] = message.type;
+
+    // 写入动作 (1 字节)
+    buffer[offset++] = message.action;
+
+    // 写入键码 (4 字节大端序)
+    const keycodeBytes = new DataView(new ArrayBuffer(4));
+    keycodeBytes.setUint32(0, message.keycode, false);
+    buffer.set(new Uint8Array(keycodeBytes.buffer), offset);
+    offset += 4;
+
+    // 写入重复次数 (4 字节大端序)
+    const repeatBytes = new DataView(new ArrayBuffer(4));
+    repeatBytes.setUint32(0, message.repeat, false);
+    buffer.set(new Uint8Array(repeatBytes.buffer), offset);
+    offset += 4;
+
+    // 写入修饰键状态 (4 字节大端序)
+    const metaStateBytes = new DataView(new ArrayBuffer(4));
+    metaStateBytes.setUint32(0, message.metaState, false);
+    buffer.set(new Uint8Array(metaStateBytes.buffer), offset);
+
+    return buffer;
+}
+
+//字符串转buffer
+export function stringToUtf8ByteArray(text) {
+    return new TextEncoder().encode(text)
+}
+
+
+
+//发送获取手机粘贴板内容的buffer
+export function getClipboard() {
+    // 1. 定义消息类型常量（根据实际项目值设置）
+    const TYPE_SET_CLIPBOARD = 8 // 假设控制消息类型值为 1
+
+    // 2. 创建消息对象
+    const event = {
+        buffer: null,
+        action: TYPE_SET_CLIPBOARD
+    }
+
+    // 4. 计算缓冲区大小并分配空间
+    // 结构：1字节类型 + 1字节粘贴标志 + 4字节文本长度 + N字节文本内容
+    const buffer = Buffer.alloc(1)
+
+    // 5. 写入缓冲区数据
+    let offset = 0
+
+    // 写入消息类型（1字节）
+    offset = buffer.writeUInt8(event.action, offset)
+
+    // 6. 将缓冲区挂载到消息对象
+    event.buffer = buffer
+
+    return buffer
+}
+
+
+//用于发送文字到手机上，把文字砖换成scrcpy接收的buffer格式
+export function setClipboard(text, paste = true) {
+    // 1. 定义消息类型常量（根据实际项目值设置）
+    const TYPE_SET_CLIPBOARD = 9 // 假设控制消息类型值为 1
+
+    // 2. 创建消息对象
+    const event = {
+        buffer: null,
+        action: TYPE_SET_CLIPBOARD
+    }
+
+    // 3. 处理文本内容
+    let textBytes = null
+    let textLength = 0
+    if (text) {
+        textBytes = stringToUtf8ByteArray(text)
+        textLength = textBytes.length
+    }
+
+    // 4. 计算缓冲区大小并分配空间
+    // 结构：1字节类型 + 1字节粘贴标志 + 4字节文本长度 + N字节文本内容
+    const buffer = Buffer.alloc(1 + 1 + 4 + textLength)
+
+    // 5. 写入缓冲区数据
+    let offset = 0
+
+    // 写入消息类型（1字节）
+    offset = buffer.writeUInt8(event.action, offset)
+
+    // 写入粘贴标志（1字节：1=true，0=false）
+    offset = buffer.writeUInt8(paste ? 1 : 0, offset)
+
+    // 写入文本长度（4字节，大端序）
+    offset = buffer.writeUInt32BE(textLength, offset)
+
+    // 写入文本内容（如果有）
+    if (textBytes) {
+        textBytes.forEach((byte, index) => {
+            buffer.writeUInt8(byte, offset + index)
+        })
+        offset += textBytes.length
+    }
+
+    // 6. 将缓冲区挂载到消息对象
+    event.buffer = buffer
+
+    return buffer
+}
+
+
+//buffer 转中文
+export function bufferToString(buffer) {
+    // 创建解码器（默认 UTF-8）
+    const decoder = new TextDecoder('utf-8');
+    // 直接解码 ArrayBuffer 或 Uint8Array
+    return decoder.decode(buffer);
+}
+
+
+//传入两个二进制数组，判断buffer是否包含指定标识头
+export function startsWithHeader(header, longArray) {
+    // 边界检查：如果任一参数不是 Uint8Array 则抛出错误
+    if (!(header instanceof Uint8Array) || !(longArray instanceof Uint8Array)) {
+        throw new TypeError('参数必须是 Uint8Array 类型');
+    }
+
+    // 快速失败：如果标识比长数组还长，直接返回 false
+    if (header.length > longArray.length) {
+        return false;
+    }
+
+    // 逐个字节比对
+    for (let i = 0; i < header.length; i++) {
+        if (header[i] !== longArray[i]) {
+            return false;
+        }
+    }
+
+    return true;
+}
+
+
+//长数组 减去 短数组  返回新数组   验证buffer是否包含指定标识头
+export function trimLongArray(arr1, arr2) {
+    // 1. 确定长短数组
+    const [longArray, shortArray] =
+        arr1.length > arr2.length ? [arr1, arr2] : [arr2, arr1];
+
+    // 2. 创建新的 ArrayBuffer（长度 = 长数组长度 - 短数组长度）
+    const resultBuffer = new ArrayBuffer(longArray.length - shortArray.length);
+
+    // 3. 将长数组后半部分拷贝到新缓冲区
+    const resultView = new Uint8Array(resultBuffer);
+    const startIndex = shortArray.length;
+    resultView.set(longArray.subarray(startIndex));
+
+    // 4. 去除前5个元素
+    const trimmedResultView = resultView.slice(5);
+    return trimmedResultView;
+}
+
+
+//base64转ArrayBuffer的方法
+export function base64ToBinary(base64String) {
+    // 以 Base64 字符串创建一个 binary string
+    const binaryString = window.atob(base64String);
+    // 将 binary string 转换为字节数组
+    const bytes = new Uint8Array(binaryString.length);
+    for (let i = 0; i < binaryString.length; i++) {
+        bytes[i] = binaryString.charCodeAt(i);
+    }
+    return bytes.buffer; // 返回 ArrayBuffer
+}
+
+
+
+
+//鼠标抬起按下 移动的事件处理  对象转buffer
+export const toBuffer = (message) => {
+    const buffer = new Uint8Array(PAYLOAD_LENGTH + 1);
+    let offset = 0;
+
+    // 写入类型 (1 字节)
+    buffer[offset++] = message.type;
+
+    // 写入动作 (1 字节)
+    buffer[offset++] = message.action;
+
+    // 模拟 Java 的 long 类型 (8 字节)
+    // 这里简化为写入 0 和 pointerId (共 8字节)
+    const zeroLong = new Uint8Array(4).fill(0); // 前 4字节填 0
+    buffer.set(zeroLong, offset);
+    offset += 4;
+    const pointerIdBytes = new DataView(new ArrayBuffer(4));
+    pointerIdBytes.setUint32(0, message.pointerId, false); // 大端序
+    buffer.set(new Uint8Array(pointerIdBytes.buffer), offset);
+    offset += 4;
+
+    // 写入坐标 (各 4字节)
+    const xBytes = new DataView(new ArrayBuffer(4));
+    xBytes.setUint32(0, message.position.point.x, false);
+    buffer.set(new Uint8Array(xBytes.buffer), offset);
+    offset += 4;
+
+    const yBytes = new DataView(new ArrayBuffer(4));
+    yBytes.setUint32(0, message.position.point.y, false);
+    buffer.set(new Uint8Array(yBytes.buffer), offset);
+    offset += 4;
+
+    // 屏幕尺寸 (各 2字节)
+    const widthBytes = new DataView(new ArrayBuffer(2));
+    widthBytes.setUint16(0, message.position.screenSize.width, false);
+    buffer.set(new Uint8Array(widthBytes.buffer), offset);
+    offset += 2;
+
+    const heightBytes = new DataView(new ArrayBuffer(2));
+    heightBytes.setUint16(0, message.position.screenSize.height, false);
+    buffer.set(new Uint8Array(heightBytes.buffer), offset);
+    offset += 2;
+
+    // 压力值 (2 字节)
+    const pressureValue = Math.floor(message.pressure * MAX_PRESSURE_VALUE);
+    const pressureBytes = new DataView(new ArrayBuffer(2));
+    pressureBytes.setUint16(0, pressureValue, false);
+    buffer.set(new Uint8Array(pressureBytes.buffer), offset);
+    offset += 2;
+
+    // 按钮状态 (4 字节)
+    const buttonsBytes = new DataView(new ArrayBuffer(4));
+    buttonsBytes.setUint32(0, message.buttons, false);
+    buffer.set(new Uint8Array(buttonsBytes.buffer), offset);
+
+    return buffer;
+};
+
+
+
+export function toBuffercomm(params) {
+    // 假设 PAYLOAD_LENGTH 是一个预定义的常量值（例如4），根据实际情况调整
+    const PAYLOAD_LENGTH = 4;
+
+    // 创建指定长度的 Buffer
+    const buffer = Buffer.alloc(PAYLOAD_LENGTH + 1);
+
+    // 从参数对象中获取 type 值并写入 Buffer
+    buffer.writeUInt8(params.type, 0);
+
+    console.log("转换comm", buffer);
+    return buffer;
+}
--- a/src/utils/countryUtil.js
+++ b/src/utils/countryUtil.js
@@ -0,0 +1,261 @@
+// country-utils.js
+export const CountryCode = {
+    AD: "安道尔",
+    AE: "阿拉伯联合酋长国",
+    AF: "阿富汗",
+    AG: "安提瓜和巴布达",
+    AI: "安圭拉",
+    AL: "阿尔巴尼亚",
+    AM: "亚美尼亚",
+    AO: "安哥拉",
+    AQ: "南极洲",
+    AR: "阿根廷",
+    AS: "美属萨摩亚",
+    AT: "奥地利",
+    AU: "澳大利亚",
+    AU1: "澳大利亚",
+    AW: "阿鲁巴",
+    AX: "奥兰群岛",
+    AZ: "阿塞拜疆",
+    BA: "波斯尼亚和黑塞哥维那",
+    BB: "巴巴多斯",
+    BD: "孟加拉国",
+    BE: "比利时",
+    BF: "布基纳法索",
+    BG: "保加利亚",
+    BH: "巴林",
+    BI: "布隆迪",
+    BJ: "贝宁",
+    BL: "圣巴泰勒米",
+    BM: "百慕大群岛",
+    BN: "文莱达鲁萨兰国",
+    BO: "玻利维亚",
+    BQ: "博奈尔、圣尤斯特歇斯和萨巴",
+    BR: "巴西",
+    BS: "巴哈马",
+    BT: "不丹",
+    BV: "布韦岛",
+    BW: "博茨瓦纳",
+    BY: "白俄罗斯",
+    BZ: "伯利兹",
+    CA: "加拿大",
+    CA1: "加拿大",
+    CC: "科科斯（基林）群岛",
+    CD: "刚果民主共和国",
+    CF: "中非共和国",
+    CG: "刚果共和国",
+    CH: "瑞士",
+    CI: "科特迪瓦",
+    CK: "库克群岛",
+    CL: "智利",
+    CM: "喀麦隆",
+    CN: "中国",
+    CO: "哥伦比亚",
+    CR: "哥斯达黎加",
+    CU: "古巴",
+    CV: "佛得角",
+    CW: "库拉索",
+    CX: "圣诞岛",
+    CY: "塞浦路斯",
+    CZ: "捷克共和国",
+    DE: "德国",
+    DG: "迪戈加西亚岛",
+    DJ: "吉布提",
+    DK: "丹麦",
+    DM: "多米尼克",
+    DO: "多米尼加共和国",
+    DZ: "阿尔及利亚",
+    EC: "厄瓜多尔",
+    EE: "爱沙尼亚",
+    EG: "埃及",
+    EH: "西撒哈拉",
+    ER: "厄立特里亚",
+    ES: "西班牙",
+    ET: "埃塞俄比亚",
+    FI: "芬兰",
+    FJ: "斐济",
+    FK: "福克兰群岛",
+    FM: "密克罗尼西亚",
+    FO: "法罗群岛",
+    FR: "法国",
+    GA: "加蓬",
+    GB: "英国",
+    GD: "格林纳达",
+    GE: "格鲁吉亚",
+    GF: "法属圭亚那",
+    GG: "根西岛",
+    GH: "加纳",
+    GI: "直布罗陀",
+    GL: "格陵兰",
+    GM: "冈比亚",
+    GN: "几内亚",
+    GP: "瓜德罗普",
+    GQ: "赤道几内亚",
+    GR: "希腊",
+    GS: "南乔治亚和南桑德威奇群岛",
+    GT: "危地马拉",
+    GU: "关岛",
+    GW: "几内亚比绍",
+    GY: "圭亚那",
+    HK: "中国香港特别行政区",
+    HM: "赫德岛和麦克唐纳群岛",
+    HN: "洪都拉斯",
+    HR: "克罗地亚",
+    HT: "海地",
+    HU: "匈牙利",
+    ID: "印度尼西亚",
+    IE: "爱尔兰",
+    IL: "以色列",
+    IM: "马恩岛",
+    IN: "印度",
+    IO: "英属印度洋领地",
+    IQ: "伊拉克",
+    IR: "伊朗",
+    IS: "冰岛",
+    IT: "意大利",
+    JE: "泽西岛",
+    JM: "牙买加",
+    JO: "约旦",
+    JP: "日本",
+    JP1: "日本",
+    KE: "肯尼亚",
+    KG: "吉尔吉斯斯坦",
+    KH: "柬埔寨",
+    KI: "基里巴斯",
+    KM: "科摩罗",
+    KN: "圣基茨和尼维斯",
+    KP: "朝鲜",
+    KR: "韩国",
+    KR1: "韩国",
+    KR1_UXWAUDIT: "韩国",
+    KW: "科威特",
+    KY: "开曼群岛",
+    KZ: "哈萨克斯坦",
+    LA: "老挝",
+    LB: "黎巴嫩",
+    LC: "圣卢西亚",
+    LI: "列支敦士登",
+    LK: "斯里兰卡",
+    LR: "利比里亚",
+    LS: "莱索托",
+    LT: "立陶宛",
+    LU: "卢森堡",
+    LV: "拉脱维亚",
+    LY: "利比亚",
+    MA: "摩洛哥",
+    MC: "摩纳哥",
+    MD: "摩尔多瓦",
+    ME: "黑山",
+    MF: "圣马丁",
+    MG: "马达加斯加",
+    MH: "马绍尔群岛",
+    MK: "北马其顿",
+    ML: "马里",
+    MM: "缅甸",
+    MN: "蒙古",
+    MO: "中国澳门特别行政区",
+    MP: "北马里亚纳群岛",
+    MQ: "马提尼克",
+    MR: "毛里塔尼亚",
+    MS: "蒙特塞拉特",
+    MT: "马耳他",
+    MU: "毛里求斯",
+    MV: "马尔代夫",
+    MW: "马拉维",
+    MX: "墨西哥",
+    MY: "马来西亚",
+    MZ: "莫桑比克",
+    NA: "纳米比亚",
+    NC: "新喀里多尼亚",
+    NE: "尼日尔",
+    NF: "诺福克岛",
+    NG: "尼日利亚",
+    NI: "尼加拉瓜",
+    NL: "荷兰",
+    NO: "挪威",
+    NP: "尼泊尔",
+    NR: "瑙鲁",
+    NU: "纽埃",
+    NZ: "新西兰",
+    OM: "阿曼",
+    PA: "巴拿马",
+    PE: "秘鲁",
+    PF: "法属玻利尼西亚",
+    PG: "巴布亚新几内亚",
+    PH: "菲律宾",
+    PK: "巴基斯坦",
+    PL: "波兰",
+    PM: "圣皮埃尔和密克隆群岛",
+    PN: "皮特凯恩群岛",
+    PR: "波多黎各",
+    PS: "巴勒斯坦",
+    PT: "葡萄牙",
+    PW: "帕劳",
+    PY: "巴拉圭",
+    QA: "卡塔尔",
+    RE: "留尼汪",
+    RO: "罗马尼亚",
+    RS: "塞尔维亚",
+    RU: "俄罗斯",
+    RW: "卢旺达",
+    SA: "沙特阿拉伯",
+    SB: "索罗门群岛",
+    SC: "塞舌尔",
+    SD: "苏丹",
+    SE: "瑞典",
+    SG: "新加坡",
+    SI: "斯洛文尼亚",
+    SJ: "斯瓦尔巴和扬马延",
+    SK: "斯洛伐克",
+    SL: "塞拉利昂",
+    SM: "圣马利诺",
+    SN: "塞内加尔",
+    SO: "索马里",
+    SR: "苏里南",
+    SS: "南苏丹",
+    ST: "圣多美和普林西比",
+    SV: "萨尔瓦多",
+    SX: "荷属圣马丁",
+    SY: "叙利亚",
+    SZ: "斯威士兰",
+    TC: "特克斯和凯科斯群岛",
+    TD: "乍得",
+    TF: "法属南部领地",
+    TG: "多哥",
+    TH: "泰国",
+    TJ: "塔吉克斯坦",
+    TK: "托克劳群岛",
+    TL: "东帝汶",
+    TM: "土库曼斯坦",
+    TN: "突尼斯",
+    TO: "汤加",
+    TR: "土耳其",
+    TT: "特立尼达和多巴哥",
+    TV: "图瓦卢",
+    TW: "台湾",
+    TZ: "坦桑尼亚",
+    UA: "乌克兰",
+    UG: "乌干达",
+    UM: "美国本土外小岛屿",
+    US: "美国",
+    UY: "乌拉圭",
+    UZ: "乌兹别克斯坦",
+    VA: "梵蒂冈",
+    VC: "圣文森特",
+    VE: "委内瑞拉",
+    VG: "英属维尔京群岛",
+    VI: "美属维尔京群岛",
+    VN: "越南",
+    VN1: "越南",
+    VU: "瓦努阿图",
+    WS: "萨摩亚",
+    YE: "也门",
+    YT: "马约特岛",
+    ZA: "南非",
+    ZM: "赞比亚",
+    ZW: "津巴布韦"
+};
+
+export function getCountryName(code) {
+    return CountryCode[code] || null;
+}
--- a/src/utils/storage.js
+++ b/src/utils/storage.js
@@ -0,0 +1,45 @@
+export function setToken(token) {
+	localStorage.setItem('token', token);
+}
+
+export function getToken() {
+	return localStorage.getItem('token');
+}
+
+export function removeToken() {
+	localStorage.removeItem('token');
+}
+
+export function setUser(user) {
+
+	localStorage.setItem('user', JSON.stringify(user));
+}
+
+export function getUser() {
+	return JSON.parse(localStorage.getItem('user'));
+}
+
+export function setNumData(numData) {
+	localStorage.setItem('num', JSON.stringify(numData));
+}
+export function getNumData() {
+	return JSON.parse(localStorage.getItem('num'));
+}
+
+// 导出一个函数，用于设置用户密码
+export function setUserPass(userdata) {
+	localStorage.setItem('userPass', JSON.stringify(userdata));
+}
+// 导出一个函数，用于获取用户密码
+export function getUserPass() {
+	return JSON.parse(localStorage.getItem('userPass'));
+}
+
+// 用于设置设备坐标信息 
+export function setphoneXYinfo(data) {
+	localStorage.setItem('XYinfo', JSON.stringify(data));
+}
+// 用于获取设备坐标信息
+export function getphoneXYinfo() {
+	return JSON.parse(localStorage.getItem('XYinfo'));
+}
--- a/src/utils/wsActions.js
+++ b/src/utils/wsActions.js
@@ -0,0 +1,47 @@
+// src/utils/wsActions.js
+
+// 传入 wslist、isStopLike 等需要依赖的外部变量
+export function createWsActions(wslist, isStopLike = null) {
+    // 通用 ws 发送方法
+    function send(index, payload) {
+        if (wslist[index]) {
+
+
+            setTimeout(() => {
+                mouseData.action = 1;
+                wslist[index].send(toBuffer(mouseData));
+            }, 100)
+            wslist[index].send(JSON.stringify(payload));
+        }
+    }
+
+    // 所有业务操作方法
+    return {
+        open: (udid, index) => send(index, { udid, action: 'openDY' }),   //打开tk
+        slideDown: (udid, index) => send(index, { udid, action: 'slideDown' }),//下滑动视频
+        slideUp: (udid, index) => send(index, { udid, action: 'slideUp' }),//上滑动视频
+        slideRight: (udid, index) => send(index, { udid, action: 'slideRight' }),//右滑动视频
+        getSize: (udid, index) => send(index, { udid, action: 'getSize', index }),//右滑动视频
+        clickLikes: (udid, index) => send(index, { udid, action: 'click', type: 'Likes', index, resourceId: 'com.zhiliaoapp.musically:id/dy6' }),//点赞
+        clickComment: (udid, index) => send(index, { udid, action: 'click', type: 'Comment', index, resourceId: 'com.zhiliaoapp.musically:id/cvd' }),//打开评论
+        clickComtext: (udid, index) => send(index, { udid, action: 'click', type: 'Comtext', index, resourceId: 'com.zhiliaoapp.musically:id/cs0' }),//点开输入框
+        clickComPush: (udid, index) => send(index, { udid, action: 'click', type: 'ComPush', index, resourceId: 'com.zhiliaoapp.musically:id/bqg' }),//发布评论
+        clicktomy: (udid, index) => send(index, { udid, action: 'click', type: 'tomy', index, resourceId: 'com.zhiliaoapp.musically:id/ts9' }),//进入个人资料
+        clickAttention: (udid, index) => send(index, { udid, action: 'click', type: 'Attention', index, resourceId: 'com.zhiliaoapp.musically:id/dhx' }),//关注
+        clickPrivatetext: (udid, index) => send(index, { udid, action: 'click', type: 'Privatetex', index, resourceId: 'com.zhiliaoapp.musically:id/hob' }), //私信输入框
+        clickPrivatePush: (udid, index) => send(index, { udid, action: 'click', type: 'PrivatePush', index, resourceId: 'com.zhiliaoapp.musically:id/hog' }),//私信发送
+        clickCopy: (udid, index) => send(index, { udid, action: 'click', type: 'clickCopy', index, resourceId: 'com.zhiliaoapp.musically:id/kg4' }),//查询最后一条信息并返回位置
+        clickCopyList: (udid, index) => send(index, { udid, action: 'click', type: 'clickCopyList', index, resourceId: 'com.zhiliaoapp.musically:id/kg4' }),//查询最后一条信息并返回位置
+        clickCopyText: (udid, index) => send(index, { udid, action: 'click', type: 'clickCopyText', index, resourceId: 'com.zhiliaoapp.musically:id/ui' }),//点击复制文字
+        getmesNum: (udid, index) => send(index, { udid, action: 'click', type: 'getmesNum', index, resourceId: 'com.zhiliaoapp.musically:id/jyv' }), //获取收件箱消息数量
+        clickMesage: (udid, index) => send(index, { udid, action: 'click', type: 'clickMesage', index, resourceId: 'com.zhiliaoapp.musically:id/e3_' }), //点击有消息的私信
+        isVideoAndLive: (udid, index) => send(index, { udid, action: 'click', type: 'isVideoAndLive', index, resourceId: 'com.zhiliaoapp.musically:id/long_press_layout' }), //获取是视频还是直播
+        addHost: (udid, index) => send(index, { udid, action: 'click', type: 'addHost', index, resourceId: 'com.zhiliaoapp.musically:id/fuq' }), //视频页面的关注
+        isHost: (udid, index) => send(index, { udid, action: 'click', type: 'isHost', index, resourceId: 'com.zhiliaoapp.musically:id/fuq' }), //判断视频页面的关注
+        search: (udid, index) => send(index, { udid, action: 'click', type: 'search', index, resourceId: 'com.zhiliaoapp.musically:id/gtz' }), //搜索页面
+        searchHost: (udid, index) => send(index, { udid, action: 'click', type: 'searchHost', index, resourceId: 'com.zhiliaoapp.musically:id/t6f' }), //搜索主播
+        toHost: (udid, index) => send(index, { udid, action: 'click', type: 'toHost', index, resourceId: 'com.zhiliaoapp.musically:id/iso' }), //进入主页二
+        hostVideo: (udid, index, num) => send(index, { udid, action: 'click', type: 'hostVideo', index, resourceId: 'com.zhiliaoapp.musically:id/d3u', num: num }), //主播视频
+        test: (udid, index) => send(index, { udid, action: 'click', type: 'test', index, resourceId: 'com.zhiliaoapp.musically:id/j7s' }), //截屏测试
+    };
+}
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -0,0 +1,327 @@
+<template>
+	<div class="main">
+		<div class="container">
+			<div class="right">
+				<img src="../assets/logoBg.png" class="background-video" alt="">
+				<!-- 设置 -->
+				<div class="center-align">
+					<div></div>
+					<div class="setup">
+						<div class="setup-item center-justify">
+							<div></div>
+							<span>
+								网络设置
+							</span>
+						</div>
+						<div class="setup-item center-justify">
+							<div></div>
+							<span>
+								简体中文
+							</span>
+						</div>
+					</div>
+				</div>
+				<div class="center-line" style="margin-top: 40px;">
+					<!-- logo -->
+					<div class="logo">
+						<div class="center-justify" style="height: 80px; width: 300px;">
+							<!-- <img style="margin-right: 20px;height: 100%;" src="@/assets/logo.png"> -->
+							<img style="height: 100%;" src="@/assets/logotext.png">
+						</div>
+					</div>
+
+					<!-- From -->
+					<div class="from">
+						<div class="from-title center-justify">
+							<div>账号登陆</div>
+						</div>
+
+						<div class="from-input">
+							<el-form label-position="left" label-width="100px" :model="formData">
+
+								<div class="from-input-item1">
+									<img src="@/assets/username.png" alt="">
+									<el-input style="height: 25px;" v-model="formData.userId" placeholder="账号" clearable
+										@keyup.enter="onSubmit" />
+								</div>
+								<div class="from-input-item1">
+									<img src="@/assets/password.png" alt="">
+									<el-input style="height: 25px; " v-model="formData.password" type="password"
+										placeholder="密码" show-password @keyup.enter="onSubmit" />
+								</div>
+
+								<div class="from-input-item">
+									<el-button class="loginButton" color="#8f7ee7" type="primary"
+										@click="onSubmit">登录</el-button>
+
+								</div>
+							</el-form>
+						</div>
+					</div>
+				</div>
+				<div class="version center-justify ">版本号：{{ version }}</div>
+
+			</div>
+
+		</div>
+	</div>
+</template>
+
+<script setup>
+import { ref, reactive, onMounted } from 'vue';
+import { useRouter } from 'vue-router';
+import { login } from '@/api/account';
+import { getToken, setToken, setUser, setUserPass, getUserPass } from '@/utils/storage';
+import { ElLoading } from 'element-plus';
+
+
+let version = ref('0.0.0');
+onMounted(() => {
+
+
+})
+
+
+const router = useRouter();
+
+const formData = ref({
+	userId: getUserPass() == null ? '' : getUserPass().userId,
+	password: getUserPass() == null ? '' : getUserPass().password,
+});
+
+
+
+const onSubmit = () => {
+
+
+	router.push('/Video');
+
+	return
+
+	const loading = ElLoading.service({
+		lock: true,
+		text: 'Loading',
+		background: 'rgba(0, 0, 0, 0.7)',
+	});
+	setUserPass(formData.value);
+	login({
+		userId: formData.value.userId,
+		password: formData.value.password,
+		source: 'app'
+	}).then((res) => {
+		loading.close();
+		console.log(res)
+		if (res.code == 200) {
+			if (res.data.activeYn == 'Y') {
+				setToken(res.data.currcode);
+				setUser(res.data);
+				router.push('/nav');
+			} else {
+				alert('账号未启用');
+			}
+
+		} else {
+			alert(res.mes);
+		}
+
+	}).catch((err) => {
+		loading.close();
+	});
+};
+</script>
+
+<style lang="less">
+.main {
+	width: 100vw;
+	height: 100vh;
+	overflow: hidden;
+	box-sizing: border-box;
+
+	/* 页面无法选中 */
+	-webkit-user-select: none;
+	-moz-user-select: none;
+	-ms-user-select: none;
+	user-select: none;
+
+	.container {
+		display: flex;
+		box-sizing: border-box;
+		width: 100vw;
+		height: 100vh;
+
+		.right {
+			box-sizing: border-box;
+			position: relative;
+			width: 100vw;
+			height: 100vh;
+			padding: 20px 40px 20px 50px;
+			border-left: 3px solid #23516e;
+			position: relative;
+			/* 添加 position: relative */
+			overflow: hidden;
+			/* 防止内容溢出 */
+
+			.version {
+				color: #fff;
+				position: absolute;
+				font-size: 20px;
+				bottom: 20px;
+				left: calc(50% - 50px);
+				// box-sizing: border-box;
+				// width: 1600px;
+
+			}
+
+
+			.background-video {
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 100%;
+				z-index: -1;
+				/* 确保视频在内容之下 */
+			}
+
+			.setup {
+				display: flex;
+				color: #fff;
+
+				.setup-item {
+					padding: 10px 6px;
+					display: flex;
+
+					div {
+						width: 20px;
+						height: 20px;
+						border-radius: 50%;
+						background-color: rgb(255, 255, 255);
+						margin-right: 5px;
+					}
+				}
+			}
+
+			.logo {
+				padding: 20px 0;
+			}
+
+			.from {
+				width: 420px;
+				height: 320px;
+				color: #022b4e;
+				background-color: #ffffff44;
+				border-radius: 20px;
+				border: 1px solid #fff;
+				padding: 32px;
+				box-sizing: border-box;
+
+				.from-title {
+					font-family: Source Han Sans SC;
+					font-weight: 500;
+					font-size: 24px;
+					color: #022b4e;
+					line-height: 37px;
+
+
+					div {
+						font-size: 20px;
+						font-weight: 600;
+						// border-bottom: 4px solid #1db97d;
+					}
+				}
+
+				.from-input {
+					width: 100%;
+					padding: 15px 0;
+
+					.from-input-item {
+						display: flex;
+						padding: 8px 0;
+
+						.from-input-item-title {
+							color: #022b4e;
+							font-size: 18px;
+							font-weight: 500;
+							width: 80px;
+							height: 50px;
+						}
+
+						.loginButton {
+							width: 359px;
+							height: 50px;
+							background: #FFFFFF;
+							border-radius: 24px;
+							border: 1px solid #FFFFFF;
+
+
+							font-family: Source Han Sans SC;
+							font-weight: 500;
+							font-size: 18px;
+							color: #022b4e;
+							line-height: 37px;
+						}
+					}
+
+					.from-input-item1 {
+						display: flex;
+						width: 359px;
+						height: 50px;
+						background: #022b4e1c;
+						border-radius: 24px;
+						border: 1px solid #FFFFFF;
+						padding: 12px 25px 13px 25px;
+						box-sizing: border-box;
+						margin-bottom: 16px;
+					}
+				}
+			}
+		}
+	}
+}
+
+.center-line {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+}
+
+.center-justify {
+	display: flex;
+	justify-content: space-around;
+	align-items: center;
+}
+
+.center-align {
+	display: flex;
+	justify-content: space-between;
+}
+
+.center-flex {
+	display: flex;
+	justify-content: center;
+	align-items: center;
+}
+
+.el-input__wrapper {
+	--el-input-focus-border-color: rgba(255, 255, 0, 0);
+	--el-menu-hover-bg-color: rgba(255, 255, 0, 0);
+
+}
+</style>
+
+<style scoped lang="less">
+::v-deep(.el-input__wrapper) {
+	background-color: rgba(255, 0, 0, 0);
+	box-shadow: none;
+
+}
+
+::v-deep(.el-input__inner) {
+	color: #fff;
+
+}
+
+::v-deep(.el-input__inner::placeholder) {
+	color: #022b4e;
+}
+</style>
--- a/src/views/Untitled-1.vue
+++ b/src/views/Untitled-1.vue
--- a/src/views/VideoStream.vue
+++ b/src/views/VideoStream.vue
--- a/vue.config.js
+++ b/vue.config.js
@@ -0,0 +1,24 @@
+const { defineConfig } = require('@vue/cli-service');
+
+module.exports = defineConfig({
+  devServer: {
+    client: {
+      overlay: false, // 重点：新版写法
+
+    },
+    historyApiFallback: true,
+  },
+  transpileDependencies: true,
+  publicPath: './', // 必须是相对路径，否则打包后图片路径会出错
+  css: {
+    loaderOptions: {
+      postcss: {
+        postcssOptions: {
+          plugins: [
+
+          ]
+        }
+      }
+    }
+  }
+});