Skip to content

T
tokcos-socket-web-ts-user
提交 16de3dbb 作者: Hao
操作

add

父级 aa0f611f
正在显示 包含 175 行增加 和 39 行删除
index.html
...@@ -5,7 +5,11 @@ ...@@ -5,7 +5,11 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>用户端</title> <title>userSide</title>
<script >
this.resizeTo(800,600);
this.focus();
</script>
</head> </head>
<body> <body>
......
package.json
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
"type": "module", "type": "module",
"license":"MIT", "license":"MIT",
"scripts": { "scripts": {
"build": "vue-tsc --noEmit && vite build --mode production", "build": "vite build --mode production",
"serve": "vite --mode development", "serve": "vite --mode development",
"preview": "vite preview" "preview": "vite preview"
}, },
......
public/favicon.ico
No preview for this file type
src/assets/css/reset.css
...@@ -102,14 +102,18 @@ section { ...@@ -102,14 +102,18 @@ section {
display: block; display: block;
} }
*{ * {
padding: 0; padding: 0;
margin: 0; margin: 0;
box-sizing: border-box; box-sizing: border-box;
} }
html,
body { body {
font-size: 14px;
line-height: 1; line-height: 1;
font-family: "Helvetica Neue", "Avenir", "Helvetica", "microsoft yahei", "PingHei", "Arial", "Verdana", "sans-serif";
} }
ol, ol,
...@@ -134,6 +138,35 @@ table { ...@@ -134,6 +138,35 @@ table {
border-collapse: collapse; border-collapse: collapse;
border-spacing: 0; border-spacing: 0;
} }
::-webkit-scrollbar { ::-webkit-scrollbar {
display: none; display: none;
}
.ellipsis {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
display: -webkit-box !important;
white-space: normal;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.pointer{
cursor:pointer;
}
@media screen and (max-width: 600px) {
#app {
width: 600px;
}
}
@media screen and (max-height: 400px) {
#app {
height: 400px;
}
.el-footer{
height: 200px !important;
}
} }
\ No newline at end of file
src/axios/model/user.ts
...@@ -52,7 +52,7 @@ const getUploadConfigInfo = (query: any) => { ...@@ -52,7 +52,7 @@ const getUploadConfigInfo = (query: any) => {
//系统上传 //系统上传
const upload = (query: any) => { const upload = (query: any) => {
return http({ return http({
url: "/sys/common/upload", url: "/upload/uploadFile",
method: "post", method: "post",
data: query, data: query,
}); });
......
src/components/AutomaticPrompt.vue
...@@ -5,20 +5,20 @@ ...@@ -5,20 +5,20 @@
<div> <div>
<img <img
src="../assets/emojiSmiles-v1-light.png" src="../assets/emojiSmiles-v1-light.png"
class="icon emoji" class="icon emoji pointer"
@click.stop="showEmotion = true" @click.stop="showEmotion = true"
/> />
<img <img
src="../assets/icon_image_s1_01.png" src="../assets/icon_image_s1_01.png"
@click="upImgfile" @click="upImgfile"
class="icon emoji" class="icon emoji pointer"
alt="" alt=""
/> />
<img <img
src="../assets/icon_folder_s1_01.png" src="../assets/icon_folder_s1_01.png"
@click="upfile" @click="upfile"
class="icon emoji" class="icon emoji pointer"
alt="" alt=""
/> />
</div> </div>
...@@ -36,7 +36,6 @@ ...@@ -36,7 +36,6 @@
class="el-autocomplete textarea" class="el-autocomplete textarea"
id="el-autocomplete" id="el-autocomplete"
ref="elAutocomplete" ref="elAutocomplete"
placeholder="输入信息"
contenteditable="true" contenteditable="true"
style="outline: none;" style="outline: none;"
@paste.prevent="handlePaste" @paste.prevent="handlePaste"
...@@ -303,4 +302,6 @@ defineExpose({ ...@@ -303,4 +302,6 @@ defineExpose({
margin-right: 8px; margin-right: 8px;
} }
} }
</style> </style>
src/minxins/UploadMixin.ts
...@@ -152,7 +152,7 @@ export const upLoadHander = async (obj: any) => { ...@@ -152,7 +152,7 @@ export const upLoadHander = async (obj: any) => {
); );
} else { } else {
//走系统上传 //走系统上传
let VUE_APP_API_URL = import.meta.env.VITE_USER_APP_API_URL; let VITE_USER_APP_API_URL = import.meta.env.VITE_USER_APP_API_URL;
let newFile = fileInfo.file; let newFile = fileInfo.file;
if (/[\u4e00-\u9fa5]/.test(newFile.name)) { if (/[\u4e00-\u9fa5]/.test(newFile.name)) {
const folder = newFile.name.replace(/[\u4e00-\u9fa5]{1,}/g, "_"); const folder = newFile.name.replace(/[\u4e00-\u9fa5]{1,}/g, "_");
...@@ -162,7 +162,7 @@ export const upLoadHander = async (obj: any) => { ...@@ -162,7 +162,7 @@ export const upLoadHander = async (obj: any) => {
formData.append("biz", fileInfo.biz); formData.append("biz", fileInfo.biz);
formData.append("file", newFile); formData.append("file", newFile);
const uploadRes = await axios.post( const uploadRes = await axios.post(
`${VUE_APP_API_URL}/sys/common/upload`, `${VITE_USER_APP_API_URL}/upload/uploadFile`,
formData, formData,
{ {
headers: { ...obj.headers }, headers: { ...obj.headers },
...@@ -172,10 +172,10 @@ export const upLoadHander = async (obj: any) => { ...@@ -172,10 +172,10 @@ export const upLoadHander = async (obj: any) => {
} }
); );
let data = uploadRes.data; let data = uploadRes.data;
console.log(data,'uploadRes') console.log(data, "uploadRes");
if (data.success && data.message) { if (data.success && data.result) {
//保存绝对路径，不然小程序会有问题 //保存绝对路径，不然小程序会有问题
let url = data.message; let url = data.result;
// console.log(url,'url') // console.log(url,'url')
// url = data.message.replaceAll("//", "/"); // url = data.message.replaceAll("//", "/");
// const pre = url.startsWith("/") ? "" : "/"; // const pre = url.startsWith("/") ? "" : "/";
...@@ -185,7 +185,7 @@ export const upLoadHander = async (obj: any) => { ...@@ -185,7 +185,7 @@ export const upLoadHander = async (obj: any) => {
} else { } else {
obj.onError({ obj.onError({
success: false, success: false,
message: data.message || "图片上传失败", message: data.result || "图片上传失败",
}); });
} }
} }
...@@ -196,5 +196,5 @@ export const upLoadHander = async (obj: any) => { ...@@ -196,5 +196,5 @@ export const upLoadHander = async (obj: any) => {
}); });
} }
}; };
none(true); none(false);
}; };
src/router/index.ts
...@@ -5,12 +5,6 @@ const routes: Array<RouteRecordRaw> = [ ...@@ -5,12 +5,6 @@ const routes: Array<RouteRecordRaw> = [
name: "home", name: "home",
component: () => import(/* @vite-ignore */ `@/views/homeView.vue`), component: () => import(/* @vite-ignore */ `@/views/homeView.vue`),
}, },
{
path: "/loging",
name: "loging",
component: () =>
import(/* webpackChunkName: "about" */ `@/views/logingView.vue`),
},
]; ];
const router = createRouter({ const router = createRouter({
......
src/store/modules/user.ts
...@@ -6,13 +6,14 @@ export const useUserStore = defineStore("user", { ...@@ -6,13 +6,14 @@ export const useUserStore = defineStore("user", {
isConnected: false, //连接状态 isConnected: false, //连接状态
messages: [], messages: [],
customerInfo: { customerInfo: {
username: "10086", username: "1489785944",
messages: [], messages: [],
}, },
count: 0, count: 0,
userInfo: { userInfo: {
password: "", password: "",
token: "", token: "",
username:""
}, },
}; };
}, },
...@@ -24,7 +25,6 @@ export const useUserStore = defineStore("user", { ...@@ -24,7 +25,6 @@ export const useUserStore = defineStore("user", {
this.customerInfo = res; this.customerInfo = res;
}, },
setUserInfo(res: any) { setUserInfo(res: any) {
console.log(res,'res')
this.userInfo = res; this.userInfo = res;
}, },
setUserListMessages(res: any) { setUserListMessages(res: any) {
......
src/type/Login.ts
...@@ -3,6 +3,6 @@ export interface LoginFace { ...@@ -3,6 +3,6 @@ export interface LoginFace {
password: string; password: string;
} }
export class LoginData<LoginFace> { export class LoginData<LoginFace> {
username = "10086"; username = "1489785944";
password = "123456"; password = "123456";
} }
src/utils/index.ts
...@@ -27,3 +27,43 @@ export const require = (imgPath: any) => { ...@@ -27,3 +27,43 @@ export const require = (imgPath: any) => {
console.warn(error); console.warn(error);
} }
}; };
export const unitList = [
{ label: "包", value: "Bags" },
{ label: "桶", value: "Barrels" },
{ label: "盒", value: "Boxes" },
{ label: "纸箱", value: "Cartons" },
{ label: "厘米", value: "Centimeters" },
{ label: "容器", value: "Containers" },
{ label: "立方米", value: "Cubic Meters" },
{ label: "打", value: "Dozens" },
{ label: "英尺", value: "Feet" },
{ label: "加仑（英）", value: "Gallons (UK)" },
{ label: "加仑（美）", value: "Gallons (US)" },
{ label: "克", value: "Grams" },
{ label: "英寸", value: "Inches" },
{ label: "公斤", value: "Kilograms" },
{ label: "千米", value: "Kilometers" },
{ label: "升", value: "Liters" },
{ label: "米", value: "Meters" },
{ label: "公吨", value: "Metric Tonnes" },
{ label: "毫升", value: "Milliliters" },
{ label: "毫米", value: "Millimeters" },
{ label: "盎司", value: "Ounces" },
{ label: "双", value: "Pairs" },
{ label: "件", value: "Pieces" },
{ label: "品脱（英）", value: "Pints (UK)" },
{ label: "品脱（美）", value: "Pints (US)" },
{ label: "磅", value: "Pounds" },
{ label: "夸脱", value: "Quarts" },
{ label: "套", value: "Sets" },
{ label: "张", value: "Sheets" },
{ label: "平方英尺", value: "Square Feet" },
{ label: "平方英寸", value: "Square Inches" },
{ label: "平方米", value: "Square Meters" },
{ label: "平方码", value: "Square Yards" },
{ label: "吨（英）", value: "Tons (UK)" },
{ label: "吨（美）", value: "Tons (US)" },
{ label: "单位", value: "Units" },
{ label: "码", value: "Yards" },
];
src/utils/websocket.ts
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
import { useUserStore } from "../store/modules/user"; import { useUserStore } from "../store/modules/user";
let HeartbeatTime:any = null;
let websocket: WebSocket | null = null; // 用于存储实例化后websocket let websocket: WebSocket | null = null; // 用于存储实例化后websocket
let rec: any; // 断线重连后，延迟5秒重新创建WebSocket连接 rec用来存储延迟请求的代码 let rec: any; // 断线重连后，延迟5秒重新创建WebSocket连接 rec用来存储延迟请求的代码
// 创建websocket // 创建websocket
...@@ -14,7 +14,6 @@ function creatWebSocket(wsUrl: string) { ...@@ -14,7 +14,6 @@ function creatWebSocket(wsUrl: string) {
} else { } else {
console.log("当前浏览器不支持 WebSocket"); console.log("当前浏览器不支持 WebSocket");
} }
try { try {
initWebSocket(wsUrl); // 初始化websocket连接 initWebSocket(wsUrl); // 初始化websocket连接
} catch (e) { } catch (e) {
...@@ -26,26 +25,32 @@ function creatWebSocket(wsUrl: string) { ...@@ -26,26 +25,32 @@ function creatWebSocket(wsUrl: string) {
// 初始化websocket // 初始化websocket
function initWebSocket(wsUrl: string) { function initWebSocket(wsUrl: string) {
if (!websocket) websocket = new WebSocket(wsUrl); if (!websocket) websocket = new WebSocket(wsUrl);
websocket.onopen = function () { websocket.onopen = function (eee) {
websocketOpen(); websocketOpen();
}; };
// // 接收 // // 接收
websocket.onmessage = function (e: MessageEvent<any>) { websocket.onmessage = function (e: MessageEvent<any>) {
websocketonmessage(e); websocketonmessage(e);
}; };
// 连接发生错误 // 连接发生错误
websocket.onerror = function () { websocket.onerror = function () {
console.log("WebSocket连接发生错误");
// isConnect = false; // 连接断开修改标识 // isConnect = false; // 连接断开修改标识
reConnect(wsUrl); // 连接错误 需要重连 reConnect(wsUrl); // 连接错误 需要重连
}; };
websocket.onclose = function (e) { websocket.onclose = function (e) {
websocketclose(e); websocketclose(e);
}; };
} }
//调取心跳
function websocketHeartbeat(){
clearInterval(HeartbeatTime)
HeartbeatTime = setInterval(()=>{
console.log('调取心跳')
websocketsend({
cmd:13
});
},10000)
}
// 定义重连函数 // 定义重连函数
const reConnect = (wsUrl: string) => { const reConnect = (wsUrl: string) => {
if (useUserStore().isConnected) return; // 如果已经连上就不在重连了 if (useUserStore().isConnected) return; // 如果已经连上就不在重连了
...@@ -59,28 +64,29 @@ const reConnect = (wsUrl: string) => { ...@@ -59,28 +64,29 @@ const reConnect = (wsUrl: string) => {
// 创建连接 // 创建连接
function websocketOpen() { function websocketOpen() {
useUserStore().connect(); useUserStore().connect();
websocketHeartbeat()
} }
// 数据接收 // 数据接收
function websocketonmessage(e: MessageEvent<any>) { function websocketonmessage(e: MessageEvent<any>) {
const res = JSON.parse(e.data); // 解析JSON格式的数据 const res = JSON.parse(e.data); // 解析JSON格式的数据
console.log(res, "接受到的数据");
// 下面的判断则是后台返回的接收到的数据 如何处理自己决定
if (res.command == 11) { if (res.command == 11) {
//将数据放在store中 //将数据放在store中
useUserStore().setUserListMessages(res.data); // 下面的判断则是后台返回的接收到的数据 如何处理自己决定
} else if (res.command == 20) { setTimeout(() => {
useUserStore().setusernameMessage(res.data); useUserStore().setUserListMessages(res.data).then();
}, 10);
} }
} }
// 关闭 // 关闭
function websocketclose(e: any) { function websocketclose(e: any) {
console.log('关闭')
clearInterval(HeartbeatTime)
useUserStore().disconnect(); // 修改连接状态 useUserStore().disconnect(); // 修改连接状态
} }
// 数据发送 // 数据发送
function websocketsend(res: any) { function websocketsend(res: any) {
console.log(websocket, "websocket");
if (websocket && useUserStore().isConnected) { if (websocket && useUserStore().isConnected) {
// 检查连接状态 // 检查连接状态
console.log("发送的数据", JSON.stringify(res)); console.log("发送的数据", JSON.stringify(res));
...@@ -105,6 +111,7 @@ function sendWebSocket(data: any) { ...@@ -105,6 +111,7 @@ function sendWebSocket(data: any) {
message: "请选择设备连接", message: "请选择设备连接",
type: "error", type: "error",
}); });
// websocketsend(data);
} else { } else {
websocketsend(data); websocketsend(data);
console.log("------------------"); console.log("------------------");
......
vite.config.ts
import { defineConfig } from "vite"; import { defineConfig } from "vite";
import Components from "unplugin-vue-components/vite"; import Components from "unplugin-vue-components/vite";
import vuePluginsAutoI18n from "vite-plugin-auto-i18n"; import vuePluginsAutoI18n from "vite-plugin-auto-i18n";
import createVuePlugin from '@vitejs/plugin-vue'; import createVuePlugin from "@vitejs/plugin-vue";
import AutoImport from "unplugin-auto-import/vite"; import AutoImport from "unplugin-auto-import/vite";
import { VantResolver } from "unplugin-vue-components/resolvers"; import { VantResolver } from "unplugin-vue-components/resolvers";
import { ElementPlusResolver } from "unplugin-vue-components/resolvers"; import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
...@@ -44,10 +44,21 @@ export default defineConfig({ ...@@ -44,10 +44,21 @@ export default defineConfig({
// }, // },
// }), // }),
], ],
build: {
outDir: "yonghu",
rollupOptions: {
output: {
// 手动配置 chunks
manualChunks: {
vendor: ["lodash"],
},
},
},
},
server: { server: {
host: "0.0.0.0", host: "0.0.0.0",
port: 8082, port: 8082,
open: false, open: false,
overlay:true, overlay: true,
}, },
}); });
yonghu.zip 0 → 100644
File added
yonghu/assets/homeView.e2f33bfb.js 0 → 100644
This source diff could not be displayed because it is too large. You can view the blob instead.
yonghu/assets/index.4140441c.css 0 → 100644
This source diff could not be displayed because it is too large. You can view the blob instead.
yonghu/assets/index.ef2e387f.js 0 → 100644
This source diff could not be displayed because it is too large. You can view the blob instead.
yonghu/assets/vendor.d471d1e7.js 0 → 100644
var o=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{};function l(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}export{o as c,l as g};
yonghu/index.html 0 → 100644
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>userSide</title>
<script type="module" crossorigin src="/assets/index.ef2e387f.js"></script>
<link rel="modulepreload" crossorigin href="/assets/vendor.d471d1e7.js">
<link rel="stylesheet" href="/assets/index.4140441c.css">
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled.
Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<script>
window.onresize = () => {
let targetWidth = 1600;
// 2.拿到当前设备（浏览器）的宽度
// document.documentElement 获取html的宽度
let currentWidth =
document.documentElement.clientWidth || document.body.clientWidth;
console.log(currentWidth)
// 3.计算缩放比率(屏幕过宽，根据高度计算缩放比例)
let scaleRatio = currentWidth / targetWidth;
let fontSize = (currentWidth / targetWidth) * 100;
// 4.开始缩放网页
console.log(scaleRatio,fontSize, 'scaleRatio')
// 4.开始缩放网页
console.log(scaleRatio,'scaleRatio')
// document.body.style = `zoom:${scaleRatio}`;
console.log(document.body, ' document.body')
}
</script>
</body>
</html>
\ No newline at end of file
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论