修改优化意见_11_12

This commit is contained in:
lixiaobang 2024-11-12 11:06:11 +08:00
parent 4a10ebd599
commit 9dd813ee1f
30 changed files with 800 additions and 628 deletions

BIN
dist.rar

Binary file not shown.

BIN
dist.zip

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@ -1 +1 @@
172.16.1.104:5005 172.16.1.106:5005

View File

@ -1,24 +1,16 @@
body { overflow: hidden; body { padding: 0; margin: 0 }
height: 100%;
width: 100%; }
#unity-container { position: absolute } #unity-container { position: absolute }
#unity-container.unity-desktop { left: 50%; top: 50%; transform: translate(-50%, -50%) } #unity-container.unity-desktop { left: 50%; top: 50%; transform: translate(-50%, -50%) }
#unity-container.unity-mobile { width: 100%; height: 100% } #unity-container.unity-mobile { position: fixed; width: 100%; height: 100% }
#unity-canvas { background: url('bg1.jpg') no-repeat; } #unity-canvas { background: #231F20 }
.unity-mobile #unity-canvas { width: 100%; height: 100% } .unity-mobile #unity-canvas { width: 100%; height: 100% }
#unity-loading-bar { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: none ;background: url('bg1.jpg') no-repeat;display: none; } #unity-loading-bar { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: none }
#unity-logo { width: 154px; height: 130px; background: url('unity-logo-dark.png') no-repeat center ;display: none; } #unity-logo { width: 154px; height: 130px; background: url('unity-logo-dark.png') no-repeat center }
#unity-progress-bar-empty { width: 141px; height: 18px; margin-top: 10px; margin-left: 6.5px; background: url('progress-bar-empty-dark.png') no-repeat center;display: none; } #unity-progress-bar-empty { width: 141px; height: 18px; margin-top: 10px; margin-left: 6.5px; background: url('progress-bar-empty-dark.png') no-repeat center }
#unity-progress-bar-full { width: 0%; height: 18px; margin-top: 10px; background: url('progress-bar-full-dark.png') no-repeat center;display: none; } #unity-progress-bar-full { width: 0%; height: 18px; margin-top: 10px; background: url('progress-bar-full-dark.png') no-repeat center }
#unity-footer { position: relative } #unity-footer { position: relative }
.unity-mobile #unity-footer { display: none } .unity-mobile #unity-footer { display: none }
/* #unity-webgl-logo { float:left; width: 204px; height: 38px; background: url('webgl-logo.png') no-repeat center } */ #unity-webgl-logo { float:left; width: 204px; height: 38px; background: url('webgl-logo.png') no-repeat center }
#unity-build-title { float: right; margin-right: 10px; line-height: 38px; font-family: arial; font-size: 18px ;display: none} #unity-build-title { float: right; margin-right: 10px; line-height: 38px; font-family: arial; font-size: 18px }
#unity-fullscreen-button { float: right; width: 38px; height: 38px; background: url('fullscreen-button.png') no-repeat center ;display: none} #unity-fullscreen-button { cursor:pointer; float: right; width: 38px; height: 38px; background: url('fullscreen-button.png') no-repeat center }
#unity-warning { position: absolute; left: 50%; top: 5%; transform: translate(-50%); background: white; padding: 10px; display: none } #unity-warning { position: absolute; left: 50%; top: 5%; transform: translate(-50%); background: white; padding: 10px; display: none }
#blackleng{
width: 100%; height: 100%; background: url('bg1.jpg') no-repeat;
}
#black{
width: 100%; height: 100%; background: url('bg1.jpg') no-repeat;
}

View File

@ -1,139 +1,167 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en-us"> <html lang="en-us">
<head>
<meta charset="utf-8"> <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta charset="utf-8">
<title>Unity WebGL Player | U3D_TobaccoWarehouseISMDTSystem</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="shortcut icon" href="TemplateData/favicon.ico"> <title>Unity WebGL Player | U3D_TobaccoWarehouseISMDTSystem</title>
<link rel="stylesheet" href="TemplateData/style.css"> <link rel="shortcut icon" href="TemplateData/favicon.ico">
</head> <link rel="stylesheet" href="TemplateData/style.css">
<body> </head>
<div id="unity-container" class="unity-desktop" style="width: 100%;height: 100%;">
<canvas id="unity-canvas" style="width: 100%;height: 100%;"tabindex="-1"></canvas> <body>
<div id="unity-loading-bar"> <div id="unity-container" class="unity-desktop" style="width: 100%;height: 100%;">
<div id="unity-logo"></div> <canvas id="unity-canvas" style="width: 100%;height: 100%;" tabindex="-1"></canvas>
<div id="unity-progress-bar-empty"> <div id="unity-loading-bar">
<div id="unity-progress-bar-full"></div> <div id="unity-logo"></div>
</div> <div id="unity-progress-bar-empty">
<div id="unity-progress-bar-full"></div>
</div> </div>
<div id="unity-warning"> </div>
<!-- <div id="unity-footer">
<div id="unity-webgl-logo"></div>
<div id="unity-fullscreen-button"></div>
<div id="unity-build-title">U3D_TobaccoWarehouseISMDTSystem</div>
</div> -->
</div> </div>
<script> <div id="unity-warning"> </div>
<!-- <div id="unity-footer">
<div id="unity-webgl-logo"></div>
<div id="unity-fullscreen-button"></div>
<div id="unity-build-title">U3D_TobaccoWarehouseISMDTSystem</div>
</div> -->
</div>
<script>
var container = document.querySelector("#unity-container"); var container = document.querySelector("#unity-container");
var canvas = document.querySelector("#unity-canvas"); var canvas = document.querySelector("#unity-canvas");
var loadingBar = document.querySelector("#unity-loading-bar"); var loadingBar = document.querySelector("#unity-loading-bar");
var progressBarFull = document.querySelector("#unity-progress-bar-full"); var progressBarFull = document.querySelector("#unity-progress-bar-full");
var fullscreenButton = document.querySelector("#unity-fullscreen-button"); var fullscreenButton = document.querySelector("#unity-fullscreen-button");
var warningBanner = document.querySelector("#unity-warning"); var warningBanner = document.querySelector("#unity-warning");
var unity
// Shows a temporary message banner/ribbon for a few seconds, or // Shows a temporary message banner/ribbon for a few seconds, or
// a permanent error message on top of the canvas if type=='error'. // a permanent error message on top of the canvas if type=='error'.
// If type=='warning', a yellow highlight color is used. // If type=='warning', a yellow highlight color is used.
// Modify or remove this function to customize the visually presented // Modify or remove this function to customize the visually presented
// way that non-critical warnings and error messages are presented to the // way that non-critical warnings and error messages are presented to the
// user. // user.
function unityShowBanner(msg, type) { function unityShowBanner(msg, type) {
function updateBannerVisibility() { function updateBannerVisibility() {
warningBanner.style.display = warningBanner.children.length ? 'block' : 'none'; warningBanner.style.display = warningBanner.children.length ? 'block' : 'none';
}
var div = document.createElement('div');
div.innerHTML = msg;
warningBanner.appendChild(div);
if (type == 'error') div.style = 'background: red; padding: 10px;';
else {
if (type == 'warning') div.style = 'background: yellow; padding: 10px;';
setTimeout(function() {
warningBanner.removeChild(div);
updateBannerVisibility();
}, 5000);
}
updateBannerVisibility();
} }
var div = document.createElement('div');
var buildUrl = "Build"; div.innerHTML = msg;
var loaderUrl = buildUrl + "/Hoister.loader.js"; warningBanner.appendChild(div);
var config = { if (type == 'error') div.style = 'background: red; padding: 10px;';
dataUrl: buildUrl + "/Hoister.data.unityweb", else {
frameworkUrl: buildUrl + "/Hoister.framework.js.unityweb", if (type == 'warning') div.style = 'background: yellow; padding: 10px;';
codeUrl: buildUrl + "/Hoister.wasm.unityweb", setTimeout(function () {
streamingAssetsUrl: "StreamingAssets", warningBanner.removeChild(div);
companyName: "DefaultCompany", updateBannerVisibility();
productName: "U3D_TobaccoWarehouseISMDTSystem", }, 5000);
productVersion: "0.1",
showBanner: unityShowBanner,
};
// By default, Unity keeps WebGL canvas render target size matched with
// the DOM size of the canvas element (scaled by window.devicePixelRatio)
// Set this to false if you want to decouple this synchronization from
// happening inside the engine, and you would instead like to size up
// the canvas DOM size and WebGL render target sizes yourself.
// config.matchWebGLToCanvasSize = false;
if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) {
// Mobile device style: fill the whole browser client area with the game canvas:
var meta = document.createElement('meta');
meta.name = 'viewport';
meta.content = 'width=device-width, height=device-height, initial-scale=1.0, user-scalable=no, shrink-to-fit=yes';
document.getElementsByTagName('head')[0].appendChild(meta);
container.className = "unity-mobile";
canvas.className = "unity-mobile";
// To lower canvas resolution on mobile devices to gain some
// performance, uncomment the following line:
// config.devicePixelRatio = 1;
} else {
// Desktop style: Render the game canvas in a window that can be maximized to fullscreen:
canvas.style.width = "100%";
canvas.style.height = "100%";
} }
updateBannerVisibility();
}
// loadingBar.style.display = "block"; var buildUrl = "Build";
var loaderUrl = buildUrl + "/爆炸图.loader.js";
var config = {
dataUrl: buildUrl + "/爆炸图.data.unityweb",
frameworkUrl: buildUrl + "/爆炸图.framework.js.unityweb",
codeUrl: buildUrl + "/爆炸图.wasm.unityweb",
streamingAssetsUrl: "StreamingAssets",
companyName: "DefaultCompany",
productName: "U3D_TobaccoWarehouseISMDTSystem",
productVersion: "0.1",
showBanner: unityShowBanner,
};
var script = document.createElement("script"); // By default, Unity keeps WebGL canvas render target size matched with
script.src = loaderUrl; // the DOM size of the canvas element (scaled by window.devicePixelRatio)
script.onload = () => { // Set this to false if you want to decouple this synchronization from
createUnityInstance(canvas, config, (progress) => { // happening inside the engine, and you would instead like to size up
// progressBarFull.style.width = 100 * progress + "%"; // the canvas DOM size and WebGL render target sizes yourself.
// window.parent.getProgress(progress); // config.matchWebGLToCanvasSize = false;
}).then((unityInstance) => {
unity = unityInstance
// loadingBar.style.display = "none";
// fullscreenButton.onclick = () => {
// unityInstance.SetFullscreen(1);
// };
}).catch((message) => {
alert(message);
});
};
//切换模型
function changeModel(data){
unity.SendMessage('Controller','Displaymodel',data)
}
function open(){
unity.SendMessage('提升机','Unfold')
}
function close(){
unity.SendMessage('提升机','Restore')
}
function opencar(){
unity.SendMessage('AGV','Unfold')
}
function closecar(){
unity.SendMessage('AGV','Restore')
}
document.body.appendChild(script);
</script> if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) {
</body> // Mobile device style: fill the whole browser client area with the game canvas:
</html>
var meta = document.createElement('meta');
meta.name = 'viewport';
meta.content = 'width=device-width, height=device-height, initial-scale=1.0, user-scalable=no, shrink-to-fit=yes';
document.getElementsByTagName('head')[0].appendChild(meta);
container.className = "unity-mobile";
canvas.className = "unity-mobile";
// To lower canvas resolution on mobile devices to gain some
// performance, uncomment the following line:
// config.devicePixelRatio = 1;
} else {
// Desktop style: Render the game canvas in a window that can be maximized to fullscreen:
canvas.style.width = "100%";
canvas.style.height = "100%";
}
// loadingBar.style.display = "block";
var unity
var script = document.createElement("script");
script.src = loaderUrl;
script.onload = () => {
createUnityInstance(canvas, config, (progress) => {
progressBarFull.style.width = 100 * progress + "%";
}).then((unityInstance) => {
unity = unityInstance
// loadingBar.style.display = "none";
// fullscreenButton.onclick = () => {
// unityInstance.SetFullscreen(1);
// };
}).catch((message) => {
alert(message);
});
};
//切换小车
function changeShuttlebus(data) {
unity.SendMessage('GameObject', 'Shuttlebus', data)
}
//提升机1
function changeHoister(data) {
unity.SendMessage('GameObject', 'Hoister', data)
}
//提升机2
function changeHoister2(data) {
unity.SendMessage('GameObject', 'Hoister2', data)
}
//快换电池
function changeBattery(data) {
unity.SendMessage('GameObject', 'Battery', data)
}
// function open() {
// unity.SendMessage('GameObject', 'Unfold')
// }
// function close() {
// unity.SendMessage('提升机', 'Restore')
// }
//大模型爆炸
function opencar() {
unity.SendMessage('GameObject', 'Explode')
}
//大模型还原
function closecar() {
unity.SendMessage('GameObject', 'ResetPositions')
}
//小模型爆炸
function openSmall() {
unity.SendMessage('GameObject', 'Blowup')
}
//小模型还原
function closeSmall() {
unity.SendMessage('GameObject', 'Restore')
}
//接收状态
function modelStatus(val) {
window.parent.modelStatus(val)
}
document.body.appendChild(script);
</script>
</body>
</html>

139
public/Hoister/index1.html Normal file
View File

@ -0,0 +1,139 @@
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Unity WebGL Player | U3D_TobaccoWarehouseISMDTSystem</title>
<link rel="shortcut icon" href="TemplateData/favicon.ico">
<link rel="stylesheet" href="TemplateData/style.css">
</head>
<body>
<div id="unity-container" class="unity-desktop" style="width: 100%;height: 100%;">
<canvas id="unity-canvas" style="width: 100%;height: 100%;"tabindex="-1"></canvas>
<div id="unity-loading-bar">
<div id="unity-logo"></div>
<div id="unity-progress-bar-empty">
<div id="unity-progress-bar-full"></div>
</div>
</div>
<div id="unity-warning"> </div>
<!-- <div id="unity-footer">
<div id="unity-webgl-logo"></div>
<div id="unity-fullscreen-button"></div>
<div id="unity-build-title">U3D_TobaccoWarehouseISMDTSystem</div>
</div> -->
</div>
<script>
var container = document.querySelector("#unity-container");
var canvas = document.querySelector("#unity-canvas");
var loadingBar = document.querySelector("#unity-loading-bar");
var progressBarFull = document.querySelector("#unity-progress-bar-full");
var fullscreenButton = document.querySelector("#unity-fullscreen-button");
var warningBanner = document.querySelector("#unity-warning");
var unity
// Shows a temporary message banner/ribbon for a few seconds, or
// a permanent error message on top of the canvas if type=='error'.
// If type=='warning', a yellow highlight color is used.
// Modify or remove this function to customize the visually presented
// way that non-critical warnings and error messages are presented to the
// user.
function unityShowBanner(msg, type) {
function updateBannerVisibility() {
warningBanner.style.display = warningBanner.children.length ? 'block' : 'none';
}
var div = document.createElement('div');
div.innerHTML = msg;
warningBanner.appendChild(div);
if (type == 'error') div.style = 'background: red; padding: 10px;';
else {
if (type == 'warning') div.style = 'background: yellow; padding: 10px;';
setTimeout(function() {
warningBanner.removeChild(div);
updateBannerVisibility();
}, 5000);
}
updateBannerVisibility();
}
var buildUrl = "Build";
var loaderUrl = buildUrl + "/Hoister.loader.js";
var config = {
dataUrl: buildUrl + "/Hoister.data.unityweb",
frameworkUrl: buildUrl + "/Hoister.framework.js.unityweb",
codeUrl: buildUrl + "/Hoister.wasm.unityweb",
streamingAssetsUrl: "StreamingAssets",
companyName: "DefaultCompany",
productName: "U3D_TobaccoWarehouseISMDTSystem",
productVersion: "0.1",
showBanner: unityShowBanner,
};
// By default, Unity keeps WebGL canvas render target size matched with
// the DOM size of the canvas element (scaled by window.devicePixelRatio)
// Set this to false if you want to decouple this synchronization from
// happening inside the engine, and you would instead like to size up
// the canvas DOM size and WebGL render target sizes yourself.
// config.matchWebGLToCanvasSize = false;
if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) {
// Mobile device style: fill the whole browser client area with the game canvas:
var meta = document.createElement('meta');
meta.name = 'viewport';
meta.content = 'width=device-width, height=device-height, initial-scale=1.0, user-scalable=no, shrink-to-fit=yes';
document.getElementsByTagName('head')[0].appendChild(meta);
container.className = "unity-mobile";
canvas.className = "unity-mobile";
// To lower canvas resolution on mobile devices to gain some
// performance, uncomment the following line:
// config.devicePixelRatio = 1;
} else {
// Desktop style: Render the game canvas in a window that can be maximized to fullscreen:
canvas.style.width = "100%";
canvas.style.height = "100%";
}
// loadingBar.style.display = "block";
var script = document.createElement("script");
script.src = loaderUrl;
script.onload = () => {
createUnityInstance(canvas, config, (progress) => {
// progressBarFull.style.width = 100 * progress + "%";
// window.parent.getProgress(progress);
}).then((unityInstance) => {
unity = unityInstance
// loadingBar.style.display = "none";
// fullscreenButton.onclick = () => {
// unityInstance.SetFullscreen(1);
// };
}).catch((message) => {
alert(message);
});
};
//切换模型
function changeModel(data){
unity.SendMessage('Controller','Displaymodel',data)
}
function open(){
unity.SendMessage('提升机','Unfold')
}
function close(){
unity.SendMessage('提升机','Restore')
}
function opencar(){
unity.SendMessage('AGV','Unfold')
}
function closecar(){
unity.SendMessage('AGV','Restore')
}
document.body.appendChild(script);
</script>
</body>
</html>

Binary file not shown.

File diff suppressed because one or more lines are too long

View File

@ -1,97 +1,89 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en-us"> <html lang="en-us">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Unity WebGL Player | U3D_TobaccoWarehouseISMDTSystem</title> <title>Unity WebGL Player | U3D_TobaccoWarehouseISMDTSystem</title>
<link rel="shortcut icon" href="TemplateData/favicon.ico"> <link rel="shortcut icon" href="TemplateData/favicon.ico">
<link rel="stylesheet" href="TemplateData/style.css"> <link rel="stylesheet" href="TemplateData/style.css">
</head> </head>
<style> <style>
body,html{ body,html{
width: 100%; width: 100%;
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
} }
</style> </style>
<body> <body>
<div id="unity-container" class="unity-desktop" style="width: 100%;height:100%"> <div id="unity-container" class="unity-desktop" style="width: 100%;height: 100%;">
<canvas id="unity-canvas" style="width: 100%;height:100%" tabindex="-1"></canvas> <canvas id="unity-canvas" tabindex="-1" style="width: 100%;height: 100%;"></canvas>
<div id="unity-loading-bar"> <div id="unity-loading-bar">
<div id="unity-logo"></div> <div id="unity-logo"></div>
<div id="unity-progress-bar-empty"> <div id="unity-progress-bar-empty">
<div id="unity-progress-bar-full"></div> <div id="unity-progress-bar-full"></div>
</div> </div>
</div> </div>
<div id="unity-warning"></div> <div id="unity-warning"> </div>
<div id="unity-footer"> <div id="unity-footer">
<div id="unity-webgl-logo"></div> <div id="unity-webgl-logo"></div>
<div id="unity-fullscreen-button"></div> <div id="unity-fullscreen-button"></div>
<div id="unity-build-title">U3D_TobaccoWarehouseISMDTSystem</div> <div id="unity-build-title">U3D_TobaccoWarehouseISMDTSystem</div>
</div>
</div> </div>
</div> <script>
<button onclick="OpenHtmlMQTT()">Connect</button> var container = document.querySelector("#unity-container");
<button onclick="publishMessage()">Publish</button> var canvas = document.querySelector("#unity-canvas");
<button onclick="disconnectMQTT()">Disconnect</button> var loadingBar = document.querySelector("#unity-loading-bar");
<script src="./js/mqtt.min.js"></script> var progressBarFull = document.querySelector("#unity-progress-bar-full");
var fullscreenButton = document.querySelector("#unity-fullscreen-button");
var warningBanner = document.querySelector("#unity-warning");
// Shows a temporary message banner/ribbon for a few seconds, or
<script> // a permanent error message on top of the canvas if type=='error'.
// If type=='warning', a yellow highlight color is used.
var container = document.querySelector("#unity-container"); // Modify or remove this function to customize the visually presented
var canvas = document.querySelector("#unity-canvas"); // way that non-critical warnings and error messages are presented to the
var loadingBar = document.querySelector("#unity-loading-bar"); // user.
var progressBarFull = document.querySelector("#unity-progress-bar-full"); function unityShowBanner(msg, type) {
var fullscreenButton = document.querySelector("#unity-fullscreen-button");
var warningBanner = document.querySelector("#unity-warning");
// Shows a temporary message banner/ribbon for a few seconds, or
// a permanent error message on top of the canvas if type=='error'.
// If type=='warning', a yellow highlight color is used.
// Modify or remove this function to customize the visually presented
// way that non-critical warnings and error messages are presented to the
// user.
function unityShowBanner(msg, type) {
function updateBannerVisibility() { function updateBannerVisibility() {
warningBanner.style.display = warningBanner.children.length ? 'block' : 'none'; warningBanner.style.display = warningBanner.children.length ? 'block' : 'none';
} }
var div = document.createElement('div'); var div = document.createElement('div');
div.innerHTML = msg; div.innerHTML = msg;
warningBanner.appendChild(div); warningBanner.appendChild(div);
if (type == 'error') div.style = 'background: red; padding: 10px;'; if (type == 'error') div.style = 'background: red; padding: 10px;';
else { else {
if (type == 'warning') div.style = 'background: yellow; padding: 10px;'; if (type == 'warning') div.style = 'background: yellow; padding: 10px;';
setTimeout(function () { setTimeout(function() {
warningBanner.removeChild(div); warningBanner.removeChild(div);
updateBannerVisibility(); updateBannerVisibility();
}, 5000); }, 5000);
} }
updateBannerVisibility(); updateBannerVisibility();
} }
var buildUrl = "Build"; var buildUrl = "Build";
var loaderUrl = buildUrl + "/webgl.loader.js"; var loaderUrl = buildUrl + "/延安烟厂.loader.js";
var config = { var config = {
dataUrl: buildUrl + "/webgl.data.unityweb", dataUrl: buildUrl + "/延安烟厂.data.unityweb",
frameworkUrl: buildUrl + "/webgl.framework.js.unityweb", frameworkUrl: buildUrl + "/延安烟厂.framework.js.unityweb",
codeUrl: buildUrl + "/webgl.wasm.unityweb", codeUrl: buildUrl + "/延安烟厂.wasm.unityweb",
streamingAssetsUrl: "StreamingAssets", streamingAssetsUrl: "StreamingAssets",
companyName: "DefaultCompany", companyName: "DefaultCompany",
productName: "U3D_TobaccoWarehouseISMDTSystem", productName: "U3D_TobaccoWarehouseISMDTSystem",
productVersion: "0.1", productVersion: "0.1",
showBanner: unityShowBanner, showBanner: unityShowBanner,
}; };
// By default, Unity keeps WebGL canvas render target size matched with // By default, Unity keeps WebGL canvas render target size matched with
// the DOM size of the canvas element (scaled by window.devicePixelRatio) // the DOM size of the canvas element (scaled by window.devicePixelRatio)
// Set this to false if you want to decouple this synchronization from // Set this to false if you want to decouple this synchronization from
// happening inside the engine, and you would instead like to size up // happening inside the engine, and you would instead like to size up
// the canvas DOM size and WebGL render target sizes yourself. // the canvas DOM size and WebGL render target sizes yourself.
// config.matchWebGLToCanvasSize = false; // config.matchWebGLToCanvasSize = false;
if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) { if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) {
// Mobile device style: fill the whole browser client area with the game canvas: // Mobile device style: fill the whole browser client area with the game canvas:
var meta = document.createElement('meta'); var meta = document.createElement('meta');
@ -106,112 +98,32 @@
// config.devicePixelRatio = 1; // config.devicePixelRatio = 1;
} else { } else {
// Desktop style: Render the game canvas in a window that can be maximized to fullscreen: // Desktop style: Render the game canvas in a window that can be maximized to fullscreen:
// canvas.style.width = "960px"; // canvas.style.width = "1920px";
// canvas.style.height = "600px"; // canvas.style.height = "1080px";
} }
loadingBar.style.display = "block";
//----------------------------------------------------------------------------------MQTT----------------------------------------------------------------------------- var script = document.createElement("script");
let client; script.src = loaderUrl;
script.onload = () => {
function OpenHtmlMQTT() {
client = mqtt.connect('ws://172.16.1.106:8083/mqtt');
client.on('connect', () => {
console.log('连接...');
const devices = [
Array.from({length: 10}, (_, i) => `car${i + 1}`),//小车
"cm1",//去加盖机
Array.from({length: 7}, (_, i) => `convoyor510${i + 1}`),//输送机
Array.from({length: 51}, (_, i) => `convoyor52${String(i + 1).padStart(2, '0')}`),//输送机
Array.from({length: 30}, (_, i) => `convoyor54${String(i + 1).padStart(2, '0')}`),//输送机
Array.from({length: 4}, (_, i) => `dpm${i + 1}`),//拆码垛机
Array.from({length: 7}, (_, i) => `elv${i + 1}`),//提升机
"fe1",//落地时提升机
Array.from({length: 2}, (_, i) => `qcbd${i + 1}`)//快换电池装置
];
devices.forEach(device => {
console.log(device);
client.subscribe(device, {
onSuccess: () => {
console.log(`已订阅: ${device}`);
},
onFailure: (err) => {
console.error(`订阅失败: ${device}:`, err);
}
});
});
// client.subscribe('car1', (err) => {
// if (!err) {
// console.log('Subscribed to car1');
// }
// });
//
});
client.on('message', (topic, message) => {
const mes = JSON.stringify({device: topic, message: message.toString()});
// console.log(mes);
unityInstance.SendMessage('APP', 'Message', mes)
});
client.on('error', (err) => {
console.error('Connection error: ', err);
});
}
function publishMessage() {
if (client) {
client.publish('car1', 'Hello');
}
}
function disconnectMQTT() {
if (client) {
client.end(() => {
console.log('关闭连接');
});
}
}
//----------------------------------------------------------------------------------MQTT-----------------------------------------------------------------------------
loadingBar.style.display = "block";
var script = document.createElement("script");
script.src = loaderUrl;
script.onload = () => {
createUnityInstance(canvas, config, (progress) => { createUnityInstance(canvas, config, (progress) => {
progressBarFull.style.width = 100 * progress + "%"; progressBarFull.style.width = 100 * progress + "%";
}).then((unityInstance) => { }).then((unityInstance) => {
loadingBar.style.display = "none"; loadingBar.style.display = "none";
fullscreenButton.onclick = () => {
// 为window添加unityInstance对象 unityInstance.SetFullscreen(1);
window.unityInstance = unityInstance };
}).catch((message) => {
fullscreenButton.onclick = () => { alert(message);
unityInstance.SetFullscreen(1); });
}; };
}).catch((message) => {
alert(message);
});
};
document.body.appendChild(script); document.body.appendChild(script);
</script> </script>
</body> </body>
</html> </html>

File diff suppressed because one or more lines are too long

View File

@ -27,19 +27,18 @@ function initChart() {
let myChart = echarts.init( let myChart = echarts.init(
document.getElementById("classProportion" + props.dataMap.id) document.getElementById("classProportion" + props.dataMap.id)
); );
// let fontSize = (window.innerHeight * 27) / 1080; // let fontSize = (window.innerHeight * 27) / 1080;
// let fontSize1 = (window.innerHeight * 14) / 1080; // let fontSize1 = (window.innerHeight * 14) / 1080;
var data = { var data = {
value: [props.dataMap.value], value: [props.dataMap.value],
// nAmount: 1566557.14, nAmount: [props.dataMap.kg],
}; };
var color = ["rgb(50,100,162)", "rgb(50,100,162)", "rgb(50,100,162)"]; var color = ["rgb(50,100,162)", "rgb(50,100,162)", "rgb(50,100,162)"];
let option = { let option = {
title: { title: {
// text: data.value[0] + "%", // text: data.value[0] + "%",
text: `{a|${data.value[0]}}{b|%}`, text: `{a|${data.nAmount[0]}}{b|}`,
textStyle: { textStyle: {
color: "#FFFFFF", color: "#FFFFFF",
confine: true, confine: true,
@ -116,7 +115,7 @@ function initChart() {
top: "85%", top: "85%",
style: { style: {
fill: "rgba(255, 206, 84, 1)", fill: "rgba(255, 206, 84, 1)",
text: `${props.dataMap.kg ? props.dataMap.kg : ""}`, text: `${props.dataMap.weight ? props.dataMap.weight : ""}`,
fontSize: `1.1rem`, fontSize: `1.1rem`,
}, },
}, },
@ -139,7 +138,7 @@ function initChart() {
// % // %
// let unit = ""; // let unit = "";
return `<div style="width:80%;height:100%;background: rgba(38,67,108,0.85);"> return `<div style="width:80%;height:100%;background: rgba(38,67,108,0.85);">
数量${props.dataMap.kg} 数量${props.dataMap.weight}
</div>`; </div>`;
}, },
// formatter: function (params) { // formatter: function (params) {

View File

@ -4,8 +4,9 @@
<div class="box"> <div class="box">
<div class="box-header"> <div class="box-header">
<div class="box-title"> <div class="box-title">
{{ props.title === '维修统计'?"维修统计":props.title }} {{ props.title === "维修统计" ? "维修统计" : props.title }}
</div> </div>
<div class="el-select1"> <div class="el-select1">
<el-select <el-select
v-model="params.facName" v-model="params.facName"
@ -15,17 +16,14 @@
getTableList(); getTableList();
" "
clearable clearable
@clear="clearAll"
> >
<el-option <el-option v-for="item in allName" :key="item" :label="item" :value="item" />
v-for="item in allName"
:key="item"
:label="item"
:value="item"
/>
</el-select> </el-select>
</div> </div>
<div class="el-select2"> <div class="el-select2">
<el-select v-if="props.title === '维修统计'" <el-select
v-if="props.title === '维修统计'"
v-model="isMaintain" v-model="isMaintain"
placeholder="请选择" placeholder="请选择"
@change=" @change="
@ -37,6 +35,40 @@
<el-option label="已维修" :value="true" /> <el-option label="已维修" :value="true" />
<el-option label="未维修" :value="false" /> <el-option label="未维修" :value="false" />
</el-select> </el-select>
<el-select
v-else-if="props.title === '备件更换统计'"
v-model="params.facCode"
placeholder="请选择"
@change="
params.pageIndex = 1;
getTableList();
"
clearable
>
<el-option
v-for="item in deviceIdList"
:key="item"
:label="item"
:value="item"
/>
</el-select>
<el-select
v-else-if="props.title === '故障分析'"
v-model="params.facCode"
placeholder="请选择"
@change="
params.pageIndex = 1;
getTableList();
"
clearable
>
<el-option
v-for="item in deviceIdList"
:key="item"
:label="item"
:value="item"
/>
</el-select>
</div> </div>
<div class="box-btn" @click="close"></div> <div class="box-btn" @click="close"></div>
@ -45,67 +77,32 @@
<div class="box-content"> <div class="box-content">
<div class="box-content-table" v-if="props.title === '备件更换统计'"> <div class="box-content-table" v-if="props.title === '备件更换统计'">
<el-table :data="tableList" style="width: 100%"> <el-table :data="tableList" style="width: 100%">
<el-table-column <el-table-column prop="maintainTime" label="维修时间" align="center" />
prop="maintainTime"
label="维修时间"
align="center"
/>
<el-table-column prop="facCode" label="设备编码" align="center" /> <el-table-column prop="facCode" label="设备编码" align="center" />
<el-table-column <el-table-column prop="elementCode" label="零件编码" align="center" />
prop="elementCode" <el-table-column prop="elementName" label="零件名称" align="center" />
label="零件编码"
align="center"
/>
<el-table-column
prop="elementName"
label="零件名称"
align="center"
/>
</el-table> </el-table>
</div> </div>
<!-- 故障分析 --> <!-- 故障分析 -->
<div class="box-content-table" v-else-if="props.title === '故障分析'"> <div class="box-content-table" v-else-if="props.title === '故障分析'">
<el-table :data="tableList" style="width: 100%"> <el-table :data="tableList" style="width: 100%">
<el-table-column <el-table-column prop="errorDateTime" label="报错时间" align="center" />
prop="errorDateTime"
label="报错时间"
align="center"
/>
<el-table-column prop="facCode" label="设备编码" align="center" /> <el-table-column prop="facCode" label="设备编码" align="center" />
<el-table-column prop="errorName" label="故障名称" align="center" /> <el-table-column prop="errorName" label="故障名称" align="center" />
<el-table-column prop="maintainer" label="维修人" align="center" /> <!-- <el-table-column prop="maintainer" label="维修人" align="center" /> -->
<el-table-column <el-table-column prop="maintainDateTime" label="恢复时间" align="center" />
prop="maintainDateTime"
label="维修时间"
align="center"
/>
<el-table-column prop="reason" label="报错原因" align="center" /> <el-table-column prop="reason" label="报错原因" align="center" />
<el-table-column prop="remark" label="备注" align="center" /> <el-table-column prop="remark" label="备注" align="center" />
</el-table> </el-table>
</div> </div>
<!-- 维修统计 --> <!-- 维修统计 -->
<div <div class="box-content-table" v-else-if="props.title === '维修统计'">
class="box-content-table"
v-else-if="props.title === '维修统计'"
>
<el-table :data="tableList" style="width: 100%"> <el-table :data="tableList" style="width: 100%">
<el-table-column <el-table-column prop="errorDateTime" label="故障时间" align="center" />
prop="errorDateTime"
label="故障时间"
align="center"
/>
<el-table-column prop="facCode" label="设备编码" align="center" /> <el-table-column prop="facCode" label="设备编码" align="center" />
<el-table-column prop="facName" label="设备名称" align="center" /> <el-table-column prop="facName" label="设备名称" align="center" />
<el-table-column <el-table-column prop="maintainDateTime" label="维修时间" align="center" />
prop="maintainDateTime" <el-table-column prop="errorName" label="错误内容" align="center" />
label="维修时间"
align="center"
/>
<el-table-column
prop="errorName"
label="错误内容"
align="center"
/>
<el-table-column prop="status" label="状态" align="center"> <el-table-column prop="status" label="状态" align="center">
<template #default="{ row }"> <template #default="{ row }">
<div :style="row.isMaintain ? 'color:rgba(28, 238, 251, 1)' : ''"> <div :style="row.isMaintain ? 'color:rgba(28, 238, 251, 1)' : ''">
@ -140,7 +137,9 @@ import {
getPageSparePart, getPageSparePart,
getPageFaultAnalysisInfo, getPageFaultAnalysisInfo,
allDeviceNames, allDeviceNames,
allDevicId,
} from "@/api/equipmentManagement/index"; } from "@/api/equipmentManagement/index";
// import { pa } from "element-plus/es/locale";
const emit = defineEmits(["close"]); const emit = defineEmits(["close"]);
const props = defineProps({ const props = defineProps({
title: String, title: String,
@ -162,21 +161,25 @@ const params = reactive({
pageIndex: 1, pageIndex: 1,
pageSize: 10, pageSize: 10,
facName: "", facName: "",
facCode: "",
}); });
const isMaintain = ref(null); const isMaintain = ref(null);
const total = ref(0); const total = ref(0);
const deviceIdList = ref([]);
function getTableList() { function getTableList() {
// //
if (props.title === "备件更换统计") { if (props.title === "备件更换统计") {
getPageSparePart(params).then((res) => { getEquipCode();
tableList.value = res.result.data; // getPageSparePart(params).then((res) => {
total.value = res.result.totalNum; // tableList.value = res.result.data;
}); // total.value = res.result.totalNum;
// });
} else if (props.title === "故障分析") { } else if (props.title === "故障分析") {
getPageFaultAnalysisInfo(params).then((res) => { getEquipCode();
tableList.value = res.result.data; // getPageFaultAnalysisInfo(params).then((res) => {
total.value = res.result.totalNum; // tableList.value = res.result.data;
}); // total.value = res.result.totalNum;
// });
} else if (props.title === "维修统计") { } else if (props.title === "维修统计") {
params.isMaintain = isMaintain.value; params.isMaintain = isMaintain.value;
getPageMaintainInfo(params).then((res) => { getPageMaintainInfo(params).then((res) => {
@ -193,7 +196,41 @@ function getAllDeviceNames() {
allName.value = res.result; allName.value = res.result;
}); });
} }
//
function getEquipCode() {
let dataMap = {
name: params.facName,
};
allDevicId(dataMap)
.then((res) => {
deviceIdList.value = res.result
.map((item) => item.models) // models
.flat() //
.map((models) => models.split(",")) // "SFTR-003,SFTR-002"
.flat();
console.log(deviceIdList.value, "deviceIdList.value");
if (props.title === "备件更换统计") {
getPageSparePart(params).then((res) => {
tableList.value = res.result.data;
total.value = res.result.totalNum;
});
} else if (props.title === "故障分析") {
getPageFaultAnalysisInfo(params).then((res) => {
tableList.value = res.result.data;
total.value = res.result.totalNum;
});
}
})
.catch((err) => {
console.log(err);
});
}
//
function clearAll() {
params.facName = "";
params.facCode = "";
}
onMounted(() => { onMounted(() => {
getAllDeviceNames(); getAllDeviceNames();
getTableList(); getTableList();
@ -309,28 +346,27 @@ onMounted(() => {
position: absolute; position: absolute;
left: vw(20); left: vw(20);
} }
.el-select1{ .el-select1 {
position: absolute; position: absolute;
right: vw(104); right: vw(104);
top: vh(7); top: vh(7);
width: vw(212); width: vw(212);
height: vh(36); height: vh(36);
:deep(.el-input){ :deep(.el-input) {
border: none; border: none;
} }
} }
.el-select2{ .el-select2 {
position: absolute; position: absolute;
right: vw(340); right: vw(340);
top: vh(7); top: vh(7);
width: vw(212); width: vw(212);
height: vh(36); height: vh(36);
:deep(.el-input){ :deep(.el-input) {
border: none; border: none;
} }
} }
:deep(.el-select) { :deep(.el-select) {
width: vw(212); width: vw(212);
height: vh(36); height: vh(36);
border: 1px solid; border: 1px solid;
@ -340,19 +376,17 @@ onMounted(() => {
rgba(25.000000409781933, 174.00000482797623, 250.00000029802322, 0.5) rgba(25.000000409781933, 174.00000482797623, 250.00000029802322, 0.5)
) )
1 1; 1 1;
box-sizing: border-box; box-sizing: border-box;
} }
:deep(.el-select .el-input){ :deep(.el-select .el-input) {
width: vw(212); width: vw(212);
height: vh(36); height: vh(36);
line-height: vh(36); line-height: vh(36);
} }
:deep(.el-input .el-input__inner){ :deep(.el-input .el-input__inner) {
line-height: vh(36) !important; line-height: vh(36) !important;
height: vh(36) !important; height: vh(36) !important;
} }
:deep(.el-select:hover:not(.el-select--disabled) .el-input__wrapper), :deep(.el-select:hover:not(.el-select--disabled) .el-input__wrapper),
:deep(.el-select .el-input.is-focus .el-input__wrapper) { :deep(.el-select .el-input.is-focus .el-input__wrapper) {
box-shadow: none !important; box-shadow: none !important;
@ -365,4 +399,4 @@ onMounted(() => {
border-color: #dcdfe6 !important; border-color: #dcdfe6 !important;
box-shadow: none !important; box-shadow: none !important;
} }
</style> </style>

View File

@ -61,7 +61,7 @@
<div class="box-content-box4"> <div class="box-content-box4">
<div class="title"> <div class="title">
<span>维修统计</span> <span>维修统计</span>
<span class="more" @click="openDialog"></span> <!-- <span class="more" @click="openDialog"></span> -->
</div> </div>
<div class="maintenance"> <div class="maintenance">
<div class="maintenance-left"> <div class="maintenance-left">

View File

@ -12,7 +12,7 @@
<li <li
v-for="(item, index) in deviceList" v-for="(item, index) in deviceList"
:key="index" :key="index"
@click="toggleHandle(index,item)" @click="toggleHandle(index, item)"
:class="liIndex === index ? 'device-select' : ''" :class="liIndex === index ? 'device-select' : ''"
> >
{{ item }} {{ item }}
@ -20,24 +20,26 @@
</ul> </ul>
</div> </div>
<div class="box-content-middle"> <div class="box-content-middle">
<div class="unity"> <div class="unity">
<iframe src="Hoister/index.html" frameborder="0" id="unityModule"></iframe> <iframe
</div> src="Hoister/index.html"
scrolling="no"
frameborder="0"
id="unityModule"
></iframe>
</div>
</div> </div>
<div class="box-content-msg"> <div class="box-content-msg">
<div class="box-content-top"> <div class="box-content-top">
<div @click="openmodel" :class="openShow === true ? 'btn1' : 'btn11'"></div> <div @click="openmodel" :class="openShow === true ? 'btn1' : 'btn11'"></div>
<div @click="closemodel" :class="closeShow === true ? 'btn22' : 'btn2'"></div> <div @click="closemodel" :class="closeShow === true ? 'btn22' : 'btn2'"></div>
</div> </div>
<div class="box-content-bottom"> <div class="box-content-bottom">
<div class="name"> <div class="name">
<span> <span> 设备名称: </span>
设备名称: <span>
</span> {{ changeName }}
<span> </span>
{{ changeName }}
</span>
</div> </div>
</div> </div>
</div> </div>
@ -46,50 +48,67 @@
</div> </div>
</template> </template>
<script setup> <script setup>
import { ref } from "vue"; import { ref, onMounted } from "vue";
// const deviceList = ref(["穿", "TW4", "TW3", ""]); // const deviceList = ref(["穿", "TW4", "TW3", ""]);
const deviceList = ref(["穿梭车", "提升机"]) const deviceList = ref(["穿梭车", "提升机", "落地式提升机", "快换电池"]);
const liIndex = ref(0); const liIndex = ref(0);
const openShow= ref(false); const openShow = ref(false);
const closeShow= ref(false); const closeShow = ref(false);
const emit = defineEmits(['closeExplosion']) const emit = defineEmits(["closeExplosion"]);
const changeName = ref("穿梭车"); const changeName = ref("穿梭车");
function toggleHandle(index,item) { const Blowups = ref(false);
openShow.value = false function toggleHandle(index, item) {
closeShow.value = false Blowups.value = false
changeName.value = item openShow.value = false;
closeShow.value = false;
changeName.value = item;
liIndex.value = index; liIndex.value = index;
if(item==="穿梭车"){ if (item === "穿梭车") {
document.getElementById("unityModule").contentWindow.changeModel('小车'); document.getElementById("unityModule").contentWindow.changeShuttlebus();
}else{ } else if (item === "提升机") {
document.getElementById("unityModule").contentWindow.changeModel('提升机'); document.getElementById("unityModule").contentWindow.changeHoister();
} else if (item === "落地式提升机") {
document.getElementById("unityModule").contentWindow.changeHoister2();
} else if (item === "快换电池") {
document.getElementById("unityModule").contentWindow.changeBattery();
} }
} }
function close(){ function close() {
emit('closeExplosion',-1) emit("closeExplosion", -1);
} }
function openmodel(){ function openmodel() {
openShow.value = true openShow.value = true;
closeShow.value = false closeShow.value = false;
if(changeName.value==="穿梭车"){ // if(changeName.value==="穿"){
document.getElementById("unityModule").contentWindow.opencar(); if (Blowups.value == false) {
}else if(changeName.value==="提升机"){ document.getElementById("unityModule").contentWindow.opencar();
document.getElementById("unityModule").contentWindow.open(); }else{
} document.getElementById("unityModule").contentWindow.openSmall();
}
// }else if(changeName.value===""){
// document.getElementById("unityModule").contentWindow.open();
// }
} }
function closemodel(){ function closemodel() {
openShow.value = false openShow.value = false;
closeShow.value = true closeShow.value = true;
if(changeName.value==="穿梭车"){ // if(changeName.value==="穿"){
document.getElementById("unityModule").contentWindow.closecar(); if (Blowups.value == false) {
}else if(changeName.value==="提升机"){ document.getElementById("unityModule").contentWindow.closecar();
document.getElementById("unityModule").contentWindow.close(); }else{
} document.getElementById("unityModule").contentWindow.closeSmall();
}
// }else if(changeName.value===""){
// document.getElementById("unityModule").contentWindow.close();
// }
} }
function modelStatus(params) {
Blowups.value = params
}
onMounted(() => {
window.parent.modelStatus = modelStatus;
});
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.box { .box {
@ -142,69 +161,72 @@ function closemodel(){
} }
} }
} }
&-middle{ &-middle {
width: vw(660); width: vw(660);
margin-left: vw(-100); margin-left: vw(-100);
// border: 1px solid greenyellow; // border: 1px solid greenyellow;
.unity { .unity {
width: 115%; width: 115%;
height: 94%; height: 94%;
// position: fixed; // position: fixed;
iframe { iframe {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
} }
} }
&-msg{ &-msg {
width: vw(340); width: vw(340);
} }
&-top{ &-top {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
margin-bottom: vh(16); margin-bottom: vh(16);
.btn1,.btn2,.btn11,.btn22{ .btn1,
width: vw(160); .btn2,
height: vh(44); .btn11,
background-size: 100% 100%; .btn22 {
cursor: pointer; width: vw(160);
} height: vh(44);
.btn1{ background-size: 100% 100%;
background-image: url('@/assets/images/dialog/explosion-btn1-select.png'); cursor: pointer;
} }
.btn11{ .btn1 {
background-image: url('@/assets/images/dialog/explosion-btn11-select.png'); background-image: url("@/assets/images/dialog/explosion-btn1-select.png");
} }
.btn2{ .btn11 {
background-image: url('@/assets/images/dialog/explosion-btn2-default.png'); background-image: url("@/assets/images/dialog/explosion-btn11-select.png");
} }
.btn22{ .btn2 {
background-image: url('@/assets/images/dialog/explosion-btn22-default.png'); background-image: url("@/assets/images/dialog/explosion-btn2-default.png");
} }
} .btn22 {
&-bottom{ background-image: url("@/assets/images/dialog/explosion-btn22-default.png");
width: vw(340); }
height: vh(556); }
background-image: url('@/assets/images/dialog/explosion-msg.png'); &-bottom {
width: vw(340);
height: vh(556);
background-image: url("@/assets/images/dialog/explosion-msg.png");
background-size: 100% 100%;
padding: vh(66) vw(16) 0 vw(16);
box-sizing: border-box;
.name {
width: 100%;
height: vh(44);
line-height: vh(44);
padding-left: vw(28);
background-size: 100% 100%; background-size: 100% 100%;
padding:vh(66) vw(16) 0 vw(16);
box-sizing: border-box; box-sizing: border-box;
.name{ background-image: url("@/assets/images/dialog/explosion-name-bg.png");
width: 100%; span:nth-child(1) {
height: vh(44); color: rgba(174, 211, 255, 1);
line-height: vh(44);
padding-left: vw(28);
background-size: 100% 100%;
box-sizing: border-box;
background-image: url('@/assets/images/dialog/explosion-name-bg.png');
span:nth-child(1){
color:rgba(174, 211, 255, 1);
}
} }
}
} }
} }
} }
.device-select { .device-select {
background-image: url("@/assets/images/dialog/device-select.png") !important; background-image: url("@/assets/images/dialog/device-select.png") !important;
} }
</style> </style>

View File

@ -231,7 +231,7 @@ function drawChart1(data) {
name: el.name, name: el.name,
type: "bar", type: "bar",
barMaxWidth: 15, barMaxWidth: 15,
stack: "Total1", // stack: "Total1",
label: { label: {
show: false, show: false,
}, },

View File

@ -41,7 +41,7 @@
<ul v-if="storeList"> <ul v-if="storeList">
<li><span>单位</span><span>公斤</span></li> <li><span>单位</span><span>公斤</span></li>
<li> <li>
<span>总量</span><span>{{ storeList.totalWeight }}</span> <span>总量</span><span>{{ formatNumber(storeList.totalWeight) }}</span>
</li> </li>
<li> <li>
<span>品牌总量</span><span>{{ storeList.brandNum }}</span> <span>品牌总量</span><span>{{ storeList.brandNum }}</span>
@ -216,25 +216,27 @@ const chartList = ref([
// //
function getChartList() { function getChartList() {
if (props.title === "入库信息") { if (props.title === "入库信息") {
getBrandPercent().then((res) => { getBrandPercent(params).then((res) => {
chartList.value = res.result.columnDatas.map((ele, index) => { chartList.value = res.result.columnDatas.map((ele, index) => {
return { return {
id: index++, id: index++,
kg: ele.number + "箱", kg: ele.number + "箱",
name: ele.name, name: ele.name,
value: (ele.percentage * 100).toFixed(2), value: (ele.percentage * 100).toFixed(2),
weight: ele.weight + '公斤',
msg: true, msg: true,
}; };
}); });
}); });
} else { } else {
getOutBrandPercent().then((res) => { getOutBrandPercent(params).then((res) => {
chartList.value = res.result.columnDatas.map((ele, index) => { chartList.value = res.result.columnDatas.map((ele, index) => {
return { return {
id: index++, id: index++,
kg: ele.number + "箱", kg: ele.number + "箱",
name: ele.name, name: ele.name,
value: (ele.percentage * 100).toFixed(2), value: (ele.percentage * 100).toFixed(2),
weight: ele.weight + '公斤',
msg: true, msg: true,
}; };
}); });
@ -246,11 +248,11 @@ const storeList = ref(null);
// //
function getStoreDetail() { function getStoreDetail() {
if (props.title === "入库信息") { if (props.title === "入库信息") {
getRepoDetails().then((res) => { getRepoDetails(params).then((res) => {
storeList.value = res.result; storeList.value = res.result;
}); });
} else { } else {
getOutRepoDetails().then((res) => { getOutRepoDetails(params).then((res) => {
storeList.value = res.result; storeList.value = res.result;
}); });
} }
@ -275,12 +277,15 @@ function getAllBrandName(boolean) {
brandList.value = res.result; brandList.value = res.result;
params.brandName = brandList.value[0]; params.brandName = brandList.value[0];
getBrandChart(); getBrandChart();
//
getChartList()
}); });
} else { } else {
getOutBrandNames(params).then((res) => { getOutBrandNames(params).then((res) => {
brandList.value = res.result; brandList.value = res.result;
params.brandName = brandList.value[0]; params.brandName = brandList.value[0];
getBrandChart(); getBrandChart();
getChartList()
}); });
} }
} }
@ -301,10 +306,14 @@ function getBrandChart(boolean) {
if (props.title === "入库信息") { if (props.title === "入库信息") {
getBrandTimeCount(params).then((res) => { getBrandTimeCount(params).then((res) => {
drawBarChart(res.result); drawBarChart(res.result);
getChartList()
getStoreDetail()
}); });
} else { } else {
getOutBrandTimeCount(params).then((res) => { getOutBrandTimeCount(params).then((res) => {
drawBarChart(res.result); drawBarChart(res.result);
getChartList()
getStoreDetail()
}); });
} }
} }
@ -453,8 +462,22 @@ function drawBarChart(res) {
myChart.resize(); myChart.resize();
}); });
} }
//
function formatNumber(num) {
if (typeof num === "number" && !isNaN(num)) {
//
if (Number.isInteger(num)) {
return num; //
} else {
return Number.parseFloat(num).toFixed(2); //
}
} else {
throw new Error("Invalid input"); //
}
}
onMounted(() => { onMounted(() => {
getChartList(); // getChartList();
getStoreDetail(); getStoreDetail();
// //
getAllBrandName(true); getAllBrandName(true);

View File

@ -7,28 +7,30 @@ import zhCn from 'element-plus/es/locale/lang/zh-cn'
import router from "./router/router.js" import router from "./router/router.js"
// // 动态调整根字体大小的函数 // // 动态调整根字体大小的函数
const updateRootFontSize = () => { const updateRootFontSize = () => {
const baseSize = 1.5; // 基准字体大小 const baseSize = 1.5; // 基准字体大小
// const minFontSize = 12; // 最小字体大小 // const minFontSize = 12; // 最小字体大小
// const maxFontSize = 25; // 最大字体大小 // const maxFontSize = 25; // 最大字体大小
const designHeight = 1080; // 设计稿的宽度基准 const designHeight = 1080; // 设计稿的宽度基准
const clientHeight = document.documentElement.clientHeight; // 当前窗口的宽度 const clientHeight = document.documentElement.clientHeight; // 当前窗口的宽度
const scale = clientHeight / designHeight; // 计算当前窗口宽度与设计稿宽度的比例 const scale = clientHeight / designHeight; // 计算当前窗口宽度与设计稿宽度的比例
let newSize = baseSize * scale * 12; let newSize = baseSize * scale * 12;
console.log(newSize,'newSize'); console.log(newSize, 'newSize');
// 限制字体大小在最小和最大范围内 // 限制字体大小在最小和最大范围内
// if (newSize < minFontSize) { // if (newSize < minFontSize) {
// newSize = minFontSize; // newSize = minFontSize;
// } else if (newSize > maxFontSize) { // } else if (newSize > maxFontSize) {
// newSize = maxFontSize; // newSize = maxFontSize;
// } // }
// 设置根元素的字体大小 // 设置根元素的字体大小
document.documentElement.style.fontSize = `${newSize}px`; document.documentElement.style.fontSize = `${newSize}px`;
}; };
// 监听窗口大小变化,并动态调整字体大小 // 监听窗口大小变化,并动态调整字体大小
window.addEventListener('resize', updateRootFontSize); window.addEventListener('resize', updateRootFontSize);
// 初始化时立即设置一次字体大小 // 初始化时立即设置一次字体大小
updateRootFontSize(); updateRootFontSize();
createApp(App).use(ElementPlus,{locale:zhCn}).use(router).mount('#app') const app = createApp(App)
app.use(ElementPlus, { locale: zhCn }).use(router).mount('#app')

View File

@ -18,13 +18,10 @@
v-for="(item, index) in Math.ceil(list.length / 5)" v-for="(item, index) in Math.ceil(list.length / 5)"
:key="item.id" :key="item.id"
> >
<div v-if="listIndex == index" style="display: flex;width: 100%;"> <div v-if="listIndex == index" style="display: flex; width: 100%">
<div <div
class="box-content-chart-item" class="box-content-chart-item"
v-for="(item, index) in list.slice( v-for="(item, index) in list.slice(index * 5, 5 * (index + 1))"
index * 5,
5 * (index + 1)
)"
:key="item.id" :key="item.id"
> >
<div class="chart"> <div class="chart">
@ -85,17 +82,17 @@
</div> </div>
<div class="box-content-table"> <div class="box-content-table">
<el-table :data="tableList" @sort-change="sortHandle" style="width: 100%"> <el-table :data="tableList" @sort-change="sortHandle" style="width: 100%">
<el-table-column <el-table-column type="index" label="序号" :index="indexMethod" width="80" />
type="index"
label="序号"
:index="indexMethod"
width="80"
/>
<el-table-column prop="palletNum" label="托盘号" /> <el-table-column prop="palletNum" label="托盘号" />
<el-table-column prop="storeLoc" sortable="custom" label="当前存放位置" /> <el-table-column prop="storeLoc" sortable="custom" label="当前存放位置" />
<el-table-column prop="itemDesc" :show-overflow-tooltip="true" label="物料描述" /> <el-table-column
prop="itemDesc"
:show-overflow-tooltip="true"
label="物料描述"
/>
<el-table-column prop="batchNum" :show-overflow-tooltip="true" label="批次" /> <el-table-column prop="batchNum" :show-overflow-tooltip="true" label="批次" />
<el-table-column prop="inputTime" label="入库时间"/> <el-table-column prop="status" label="状态" />
<el-table-column prop="inputTime" label="入库时间" />
<!-- <el-table-column prop="number" label="编号" /> --> <!-- <el-table-column prop="number" label="编号" /> -->
<el-table-column prop="upWeight" label="上箱重量" /> <el-table-column prop="upWeight" label="上箱重量" />
<el-table-column prop="downWeight" label="下箱重量" /> <el-table-column prop="downWeight" label="下箱重量" />
@ -270,13 +267,14 @@ function getChartData() {
list.value = res.result.map((el, index) => { list.value = res.result.map((el, index) => {
return { return {
name: el.name, name: el.name,
kg: el.stockNum + "箱", kg: el.stockNum + '箱',
value: el.weightPercent, value: el.weightPercent,
id: index, id: index,
weight: el.weight + '公斤',
}; };
}); });
console.log(list.value); console.log(list.value, "数据");
}); });
} }
onMounted(() => { onMounted(() => {
@ -301,9 +299,9 @@ onMounted(() => {
getTableList(); getTableList();
}); });
function sortHandle(event){ function sortHandle(event) {
tableParams.orderByLoc = event.order == 'ascending' tableParams.orderByLoc = event.order == "ascending";
getTableList() getTableList();
} }
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
@ -378,7 +376,7 @@ function sortHandle(event){
display: flex; display: flex;
position: relative; position: relative;
height: vh(190); height: vh(190);
&-item:nth-child(1){ &-item:nth-child(1) {
margin-left: vw(25); margin-left: vw(25);
} }
&-item { &-item {
@ -531,4 +529,4 @@ function sortHandle(event){
position: absolute; position: absolute;
left: vw(20); left: vw(20);
} }
</style> </style>

View File

@ -53,7 +53,7 @@
</li> </li>
<li> <li>
<span class="name">计划量</span> <span class="name">计划量</span>
<span>{{ item.planWeight }}公斤</span> <span>{{ formatNumber(item.planWeight) }}公斤</span>
</li> </li>
<li> <li>
@ -96,11 +96,11 @@
<div class="out-right"> <div class="out-right">
<ul> <ul>
<li> <li>
<span class="name">工单号</span> <span class="name">品牌编码</span>
<span>{{ item.orderNum }}</span> <span>{{ item.itemNum }}</span>
</li> </li>
<li> <li>
<span class="name">品牌</span> <span class="name">品牌名称</span>
<span>{{ item.itemDesc }}</span> <span>{{ item.itemDesc }}</span>
</li> </li>
<li> <li>
@ -116,8 +116,14 @@
<span class="name">剩余箱数</span> <span class="name">剩余箱数</span>
<span>{{ item.leftNum }}</span> <span>{{ item.leftNum }}</span>
</li> </li>
<li style="opacity:0"></li> <li>
<li style="opacity:0"></li> <span class="name">当前批次</span>
<span>{{ item.currentBatch }}</span>
</li>
<li>
<span class="name">下一批次</span>
<span>{{ item.preset1 }}</span>
</li>
</ul> </ul>
</div> </div>
</div> </div>
@ -235,6 +241,18 @@ function getOrderDetail(){
function getResult(item){ function getResult(item){
return item.planBoxQuantity - item.inNum return item.planBoxQuantity - item.inNum
} }
function formatNumber(num) {
if (typeof num === "number" && !isNaN(num)) {
//
if (Number.isInteger(num)) {
return num; //
} else {
return Number.parseFloat(num).toFixed(2); //
}
} else {
throw new Error("Invalid input"); //
}
}
onMounted(()=>{ onMounted(()=>{
getOrderDetail() getOrderDetail()
}) })

View File

@ -7,8 +7,8 @@
</div> </div>
<div class="box-content"> <div class="box-content">
<el-table :data="list" style="width: 100%"> <el-table :data="list" style="width: 100%">
<el-table-column prop="batchNum" label="批次号" width="180" />
<el-table-column prop="itemDesc" label="品牌" width="180" /> <el-table-column prop="itemDesc" label="品牌" width="180" />
<el-table-column prop="batchNum" label="批次号" width="180" />
<el-table-column prop="inTime" label="入库时间" /> <el-table-column prop="inTime" label="入库时间" />
<el-table-column prop="weight" label="重量(kg)" /> <el-table-column prop="weight" label="重量(kg)" />
<el-table-column prop="boxCount" label="箱数" /> <el-table-column prop="boxCount" label="箱数" />

View File

@ -3,7 +3,7 @@
<div class="header-date"> <div class="header-date">
{{ nowDate }} {{ nowDate }}
</div> </div>
<div class="header-title">数字孪生三维可视化系统</div> <div class="header-title">三维孪生信息系统</div>
<div class="header-weather"></div> <div class="header-weather"></div>
</div> </div>
</template> </template>

View File

@ -1,7 +1,7 @@
<template> <template>
<Nav /> <Nav />
<div class="unity"> <div class="unity">
<!-- <iframe src="model/index.html" frameborder="0"></iframe> --> <iframe src="model/index.html" frameborder="0"></iframe>
</div> </div>
<div class="home"> <div class="home">
<div class="home-left"> <div class="home-left">
@ -11,11 +11,7 @@
<!-- <span class="home-title-more"> </span> --> <!-- <span class="home-title-more"> </span> -->
</div> </div>
<div class="home-left-device"> <div class="home-left-device">
<div <div class="home-left-device-box" v-for="(s, i) in deviceList" :key="'d' + i">
class="home-left-device-box"
v-for="(s, i) in deviceList"
:key="'d' + i"
>
<img :src="s.deviceImg" alt="" /> <img :src="s.deviceImg" alt="" />
<div> <div>
<p>{{ s.deviceStatus }}</p> <p>{{ s.deviceStatus }}</p>
@ -29,16 +25,16 @@
<span class="home-title-more" @click="brandShow = true"> </span> <span class="home-title-more" @click="brandShow = true"> </span>
</div> </div>
<div class="home-left-brand" id="brand"> <div class="home-left-brand" id="brand">
<div <div v-for="(item, index) in brandList" :key="'brand' + index" class="item">
v-for="(item, index) in brandList"
:key="'brand' + index"
class="item"
>
<div class="home-left-brand-title"> <div class="home-left-brand-title">
<span>{{ item.name }}</span <span>{{ item.name }}</span
><span class="pct" ><span class="pct"
>{{ item.stockNum }}<span class="kg"></span></span >{{ item.stockNum
> }}<span class="kg"
>
<span> &nbsp; {{ formatNumber(item.weight) }}<span class="kg">公斤</span></span>
</span>
</span>
</div> </div>
<div class="home-left-brand-progress"> <div class="home-left-brand-progress">
<div <div
@ -55,18 +51,13 @@
</div> </div>
<div class="home-left-messageReminder"> <div class="home-left-messageReminder">
<el-timeline> <el-timeline>
<el-timeline-item <el-timeline-item v-for="(activity, index) in messageReminder" :key="index">
v-for="(activity, index) in messageReminder"
:key="index"
>
<p>{{ activity.msg }}</p> <p>{{ activity.msg }}</p>
<p class="home-left-messageReminder-data"> <p class="home-left-messageReminder-data">
<span style="color: rgba(148, 219, 255, 1)">{{ <span style="color: rgba(148, 219, 255, 1)">{{
activity.reminderMsg activity.reminderMsg
}}</span> }}</span>
<span style="color: rgba(192, 192, 192, 1)">{{ <span style="color: rgba(192, 192, 192, 1)">{{ activity.date }}</span>
activity.date
}}</span>
</p> </p>
</el-timeline-item> </el-timeline-item>
</el-timeline> </el-timeline>
@ -212,7 +203,7 @@ import inventoryNews from "./components/homeDialog/inventoryNews"; //库存消
import inOutBound from "./components/homeDialog/inOutBound"; import inOutBound from "./components/homeDialog/inOutBound";
import { Search } from "@element-plus/icons-vue"; // import { Search } from "@element-plus/icons-vue"; //
import * as echarts from "echarts"; import * as echarts from "echarts";
import { ref, onMounted } from "vue"; import { ref, onMounted, proxyRefs, getCurrentInstance } from "vue";
import getPath from "@/utils/getPath"; import getPath from "@/utils/getPath";
import { import {
getEquipStatus, getEquipStatus,
@ -224,6 +215,8 @@ import {
getLocInfo, getLocInfo,
} from "@/api/home"; } from "@/api/home";
import { fontSize } from "@/utils/common"; import { fontSize } from "@/utils/common";
const { proxy } = getCurrentInstance();
// //
const deviceList = ref([ const deviceList = ref([
{ {
@ -425,71 +418,79 @@ const searchData = ref();
// echarts // echarts
function drawInventoryNewsEcahrt(result) { function drawInventoryNewsEcahrt(result) {
console.log(result, "库存消息");
// result. = 400 // result. = 400
// result. = 300 // result. = 300
let myChart = echarts.init(document.getElementById("inventoryNews")); let myChart = echarts.init(document.getElementById("inventoryNews"));
var scaleData = [ var scaleData = [
// { {
// name: "", name: "正在进行任务数",
// value: 1174, value: result.taskDoingNum,
// radius1: ["51%", "53%"], radius1: ["51%", "53%"],
// }, },
// { {
// name: "", name: "实箱",
// value: 1101, value: result.fullBoxNum,
// radius1: ["59%", "60%"], radius1: ["59%", "60%"],
// }, },
// { {
// name: "", name: "空箱",
// value: 68, value: result.emptyBoxNum,
// radius1: ["67%", "68%"], radius1: ["67%", "68%"],
// }, },
{
name: "库存总量",
value: result.inventoryNum,
radius1: ["67%", "68%"],
},
{
name: "批次数量",
value: result.batchNum,
radius1: ["67%", "68%"],
},
]; ];
let index = 0; let index = 0;
for (let key in result) { // for (let key in result) {
scaleData.push({ // scaleData.push({
name: key, // name: key,
value: result[key], // value: result[key],
// });
}); // index++;
index++; // }
}
// let box = { // let box = {
// name:'', // name:'',
// value:, // value:,
// } // }
// //
// scaleData.forEach((el,index) => { // scaleData.forEach((el,index) => {
// console.log(el); // console.log(el);
// }); // });
let box = { let box = {
name:'特殊箱子', name: "特殊箱子",
value:0, value: 0,
};
} // for (let i = 0; i < scaleData.length; i++) {
for(let i = 0;i<scaleData.length;i++){ // if (scaleData[i].name === "") {
if(scaleData[i].name==='特殊空箱子'){ // box.value = box.value + scaleData[i].value;
box.value = box.value + scaleData[i].value // scaleData.splice(i, 1);
scaleData.splice(i,1) // i--;
i-- // }
} // if (scaleData[i].name === "") {
if(scaleData[i].name==='特殊实箱子'){ // box.value = box.value + scaleData[i].value;
box.value = box.value + scaleData[i].value // scaleData.splice(i, 1);
scaleData.splice(i,1) // i--;
i-- // }
// }
}
}
// console.log(scaleData); // console.log(scaleData);
// box.radius1 = [43 + (scaleData.length-1) * 8 + "%" + "", 45 + (scaleData.length-1) * 8 + "%" + ""] // box.radius1 = [43 + (scaleData.length-1) * 8 + "%" + "", 45 + (scaleData.length-1) * 8 + "%" + ""]
if(box.value != 0){ if (box.value != 0) {
scaleData.push(box) scaleData.push(box);
} }
scaleData.forEach((el,index)=>{ scaleData.forEach((el, index) => {
el.radius1 = [43 + index * 8 + "%" + "", 45 + index * 8 + "%" + ""] el.radius1 = [43 + index * 8 + "%" + "", 45 + index * 8 + "%" + ""];
}) });
var placeHolderStyle = { var placeHolderStyle = {
label: { label: {
show: false, show: false,
@ -511,7 +512,6 @@ function drawInventoryNewsEcahrt(result) {
// "rgba(0, 245, 194, 1)", // "rgba(0, 245, 194, 1)",
"rgba(28, 238, 251, 1)", "rgba(28, 238, 251, 1)",
"rgba(255, 192, 203,1)", "rgba(255, 192, 203,1)",
]; ];
for (var i = 0; i < scaleData.length; i++) { for (var i = 0; i < scaleData.length; i++) {
seriesObj.push({ seriesObj.push({
@ -578,7 +578,7 @@ function drawInventoryNewsEcahrt(result) {
itemWidth: fontSize(0.1), itemWidth: fontSize(0.1),
itemHeight: fontSize(0.1), itemHeight: fontSize(0.1),
itemGap: fontSize(0.2), itemGap: fontSize(0.2),
data: scaleData.map((el,index) => { data: scaleData.map((el, index) => {
return el.name; return el.name;
}), }),
// itemStyle:{ // itemStyle:{
@ -857,9 +857,23 @@ function getInboundWorkOrder() {
inboundWorkOrder.value = res.result; inboundWorkOrder.value = res.result;
inboundWorkOrder.value.forEach((el) => { inboundWorkOrder.value.forEach((el) => {
el.pic = getPath.inDevice; el.pic = getPath.inDevice;
el.inWeight = formatNumber(el.inWeight);
el.planWeight = formatNumber(el.planWeight);
}); });
}); });
} }
function formatNumber(num) {
if (typeof num === "number" && !isNaN(num)) {
//
if (Number.isInteger(num)) {
return num; //
} else {
return Number.parseFloat(num).toFixed(2); //
}
} else {
throw new Error("Invalid input"); //
}
}
onMounted(() => { onMounted(() => {
getDeviceStatus(); // getDeviceStatus(); //
@ -925,7 +939,7 @@ onMounted(() => {
position: relative; position: relative;
z-index: 99; z-index: 99;
width: vw(368); width: vw(358);
} }
&-left { &-left {
background-image: url("@/assets/images/home/左侧遮罩.png"); background-image: url("@/assets/images/home/左侧遮罩.png");
@ -1165,4 +1179,4 @@ onMounted(() => {
top: 2rem; top: 2rem;
left: 6px; left: 6px;
} }
</style> </style>

View File

@ -94,7 +94,7 @@ function submitForm(elForm) {
localStorage.setItem("loginInfo", JSON.stringify({})); localStorage.setItem("loginInfo", JSON.stringify({}));
} }
login(ruleForm).then((res) => { login(ruleForm).then((res) => {
if (res.result) { if (res.result == '登录成功') {
ElMessage({ ElMessage({
message: "登录成功", message: "登录成功",
type: "success", type: "success",