Skip to content

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

add

父级 aa0f611f
正在显示 包含 175 行增加 和 39 行删除
index.html
......@@ -5,7 +5,11 @@
<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>用户端</title>
<title>userSide</title>
<script >
this.resizeTo(800,600);
this.focus();
</script>
</head>
<body>
......
package.json
......@@ -4,7 +4,7 @@
"type": "module",
"license":"MIT",
"scripts": {
"build": "vue-tsc --noEmit && vite build --mode production",
"build": "vite build --mode production",
"serve": "vite --mode development",
"preview": "vite preview"
},
......
public/favicon.ico
No preview for this file type
src/assets/css/reset.css
......@@ -102,14 +102,18 @@ section {
display: block;
}
*{
* {
padding: 0;
margin: 0;
box-sizing: border-box;
}
html,
body {
font-size: 14px;
line-height: 1;
font-family: "Helvetica Neue", "Avenir", "Helvetica", "microsoft yahei", "PingHei", "Arial", "Verdana", "sans-serif";
}
ol,
......@@ -134,6 +138,35 @@ table {
border-collapse: collapse;
border-spacing: 0;
}
::-webkit-scrollbar {
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) => {
//系统上传
const upload = (query: any) => {
return http({
url: "/sys/common/upload",
url: "/upload/uploadFile",
method: "post",
data: query,
});
......
src/components/AutomaticPrompt.vue
......@@ -5,20 +5,20 @@
<div>
<img
src="../assets/emojiSmiles-v1-light.png"
class="icon emoji"
class="icon emoji pointer"
@click.stop="showEmotion = true"
/>
<img
src="../assets/icon_image_s1_01.png"
@click="upImgfile"
class="icon emoji"
class="icon emoji pointer"
alt=""
/>
<img
src="../assets/icon_folder_s1_01.png"
@click="upfile"
class="icon emoji"
class="icon emoji pointer"
alt=""
/>
</div>
......@@ -36,7 +36,6 @@
class="el-autocomplete textarea"
id="el-autocomplete"
ref="elAutocomplete"
placeholder="输入信息"
contenteditable="true"
style="outline: none;"
@paste.prevent="handlePaste"
......@@ -303,4 +302,6 @@ defineExpose({
margin-right: 8px;
}
}
</style>
src/minxins/UploadMixin.ts
......@@ -152,7 +152,7 @@ export const upLoadHander = async (obj: any) => {
);
} 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;
if (/[\u4e00-\u9fa5]/.test(newFile.name)) {
const folder = newFile.name.replace(/[\u4e00-\u9fa5]{1,}/g, "_");
......@@ -162,7 +162,7 @@ export const upLoadHander = async (obj: any) => {
formData.append("biz", fileInfo.biz);
formData.append("file", newFile);
const uploadRes = await axios.post(
`${VUE_APP_API_URL}/sys/common/upload`,
`${VITE_USER_APP_API_URL}/upload/uploadFile`,
formData,
{
headers: { ...obj.headers },
......@@ -172,10 +172,10 @@ export const upLoadHander = async (obj: any) => {
}
);
let data = uploadRes.data;
console.log(data,'uploadRes')
if (data.success && data.message) {
console.log(data, "uploadRes");
if (data.success && data.result) {
//保存绝对路径，不然小程序会有问题
let url = data.message;
let url = data.result;
// console.log(url,'url')
// url = data.message.replaceAll("//", "/");
// const pre = url.startsWith("/") ? "" : "/";
......@@ -185,7 +185,7 @@ export const upLoadHander = async (obj: any) => {
} else {
obj.onError({
success: false,
message: data.message || "图片上传失败",
message: data.result || "图片上传失败",
});
}
}
......@@ -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> = [
name: "home",
component: () => import(/* @vite-ignore */ `@/views/homeView.vue`),
},
{
path: "/loging",
name: "loging",
component: () =>
import(/* webpackChunkName: "about" */ `@/views/logingView.vue`),
},
];
const router = createRouter({
......
src/store/modules/user.ts
......@@ -6,13 +6,14 @@ export const useUserStore = defineStore("user", {
isConnected: false, //连接状态
messages: [],
customerInfo: {
username: "10086",
username: "1489785944",
messages: [],
},
count: 0,
userInfo: {
password: "",
token: "",
username:""
},
};
},
......@@ -24,7 +25,6 @@ export const useUserStore = defineStore("user", {
this.customerInfo = res;
},
setUserInfo(res: any) {
console.log(res,'res')
this.userInfo = res;
},
setUserListMessages(res: any) {
......
src/type/Login.ts
......@@ -3,6 +3,6 @@ export interface LoginFace {
password: string;
}
export class LoginData<LoginFace> {
username = "10086";
username = "1489785944";
password = "123456";
}
src/utils/index.ts
......@@ -27,3 +27,43 @@ export const require = (imgPath: any) => {
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 { useUserStore } from "../store/modules/user";
let HeartbeatTime:any = null;
let websocket: WebSocket | null = null; // 用于存储实例化后websocket
let rec: any; // 断线重连后，延迟5秒重新创建WebSocket连接 rec用来存储延迟请求的代码
// 创建websocket
......@@ -14,7 +14,6 @@ function creatWebSocket(wsUrl: string) {
} else {
console.log("当前浏览器不支持 WebSocket");
}
try {
initWebSocket(wsUrl); // 初始化websocket连接
} catch (e) {
......@@ -26,26 +25,32 @@ function creatWebSocket(wsUrl: string) {
// 初始化websocket
function initWebSocket(wsUrl: string) {
if (!websocket) websocket = new WebSocket(wsUrl);
websocket.onopen = function () {
websocket.onopen = function (eee) {
websocketOpen();
};
// // 接收
websocket.onmessage = function (e: MessageEvent<any>) {
websocketonmessage(e);
};
// 连接发生错误
websocket.onerror = function () {
console.log("WebSocket连接发生错误");
// isConnect = false; // 连接断开修改标识
reConnect(wsUrl); // 连接错误 需要重连
};
websocket.onclose = function (e) {
websocketclose(e);
};
}
//调取心跳
function websocketHeartbeat(){
clearInterval(HeartbeatTime)
HeartbeatTime = setInterval(()=>{
console.log('调取心跳')
websocketsend({
cmd:13
});
},10000)
}
// 定义重连函数
const reConnect = (wsUrl: string) => {
if (useUserStore().isConnected) return; // 如果已经连上就不在重连了
......@@ -59,28 +64,29 @@ const reConnect = (wsUrl: string) => {
// 创建连接
function websocketOpen() {
useUserStore().connect();
websocketHeartbeat()
}
// 数据接收
function websocketonmessage(e: MessageEvent<any>) {
const res = JSON.parse(e.data); // 解析JSON格式的数据
console.log(res, "接受到的数据");
// 下面的判断则是后台返回的接收到的数据 如何处理自己决定
if (res.command == 11) {
//将数据放在store中
useUserStore().setUserListMessages(res.data);
} else if (res.command == 20) {
useUserStore().setusernameMessage(res.data);
// 下面的判断则是后台返回的接收到的数据 如何处理自己决定
setTimeout(() => {
useUserStore().setUserListMessages(res.data).then();
}, 10);
}
}
// 关闭
function websocketclose(e: any) {
console.log('关闭')
clearInterval(HeartbeatTime)
useUserStore().disconnect(); // 修改连接状态
}
// 数据发送
function websocketsend(res: any) {
console.log(websocket, "websocket");
if (websocket && useUserStore().isConnected) {
// 检查连接状态
console.log("发送的数据", JSON.stringify(res));
......@@ -105,6 +111,7 @@ function sendWebSocket(data: any) {
message: "请选择设备连接",
type: "error",
});
// websocketsend(data);
} else {
websocketsend(data);
console.log("------------------");
......
vite.config.ts
import { defineConfig } from "vite";
import Components from "unplugin-vue-components/vite";
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 { VantResolver } from "unplugin-vue-components/resolvers";
import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
......@@ -44,10 +44,21 @@ export default defineConfig({
// },
// }),
],
build: {
outDir: "yonghu",
rollupOptions: {
output: {
// 手动配置 chunks
manualChunks: {
vendor: ["lodash"],
},
},
},
},
server: {
host: "0.0.0.0",
port: 8082,
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 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论