替换三维模型

This commit is contained in:
luoshiwen 2024-03-25 11:01:45 +08:00
parent 1921755332
commit ecaac9831f
11 changed files with 339 additions and 132 deletions

File diff suppressed because one or more lines are too long

View File

@ -1,127 +1,133 @@
<!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 | CD</title>
<link rel="shortcut icon" href="TemplateData/favicon.ico">
<link rel="stylesheet" href="TemplateData/style.css">
</head>
<style>body,html{
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Unity WebGL Player | CD</title>
<link rel="shortcut icon" href="TemplateData/favicon.ico">
<link rel="stylesheet" href="TemplateData/style.css">
</head>
<style>
body,
html {
width: 100%;
height: 100%;
overflow: hidden;
}</style>
<body>
<div id="unity-container" class="unity-desktop" style="width: 100%;height: 100%">
<canvas id="unity-canvas" style="width: 100%;height: 100%"></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">CD</div>
}
</style>
<body>
<div id="unity-container" class="unity-desktop" style="width: 100%;height: 100%">
<canvas id="unity-canvas" style="width: 100%;height: 100%"></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>
<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");
<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">CD</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");
// 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();
// 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 buildUrl = "Build";
var loaderUrl = buildUrl + "/build.loader.js";
var config = {
dataUrl: buildUrl + "/build.data.unityweb",
frameworkUrl: buildUrl + "/build.framework.js.unityweb",
codeUrl: buildUrl + "/build.wasm.unityweb",
streamingAssetsUrl: "StreamingAssets",
companyName: "DefaultCompany",
productName: "CD",
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;
unityShowBanner('WebGL builds are not supported on mobile devices.');
} else {
// Desktop style: Render the game canvas in a window that can be maximized to fullscreen:
// canvas.style.width = "960px";
// canvas.style.height = "600px";
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();
}
loadingBar.style.display = "block";
var unityInstanceA
var script = document.createElement("script");
script.src = loaderUrl;
script.onload = () => {
createUnityInstance(canvas, config, (progress) => {
progressBarFull.style.width = 100 * progress + "%";
}).then((unityInstance) => {
unityInstanceA = unityInstance
loadingBar.style.display = "none";
fullscreenButton.onclick = () => {
unityInstance.SetFullscreen(1);
};
}).catch((message) => {
alert(message);
});
};
document.body.appendChild(script);
// unity交互
function unity3D(val){
var buildUrl = "Build";
var loaderUrl = buildUrl + "/build.loader.js";
var config = {
dataUrl: buildUrl + "/build.data.gz",
frameworkUrl: buildUrl + "/build.framework.js.gz",
codeUrl: buildUrl + "/build.wasm.gz",
streamingAssetsUrl: "StreamingAssets",
companyName: "DefaultCompany",
productName: "CD",
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;
unityShowBanner('WebGL builds are not supported on mobile devices.');
} else {
// Desktop style: Render the game canvas in a window that can be maximized to fullscreen:
// canvas.style.width = "1920px";
// canvas.style.height = "1080px";
}
loadingBar.style.display = "block";
var script = document.createElement("script");
var unityInstanceA
script.src = loaderUrl;
script.onload = () => {
createUnityInstance(canvas, config, (progress) => {
progressBarFull.style.width = 100 * progress + "%";
}).then((unityInstance) => {
unityInstanceA = unityInstance
loadingBar.style.display = "none";
fullscreenButton.onclick = () => {
unityInstance.SetFullscreen(1);
};
}).catch((message) => {
alert(message);
});
};
document.body.appendChild(script);
// unity交互
function unity3D(val){
// OpenWebPanel()
unityInstanceA.SendMessage("App", "SetState", val + '')
}
@ -139,6 +145,7 @@
function closeStrategy(){
unityInstanceA.SendMessage("空调tip", "HideUnityPanel",'')
}
</script>
</body>
</html>
</script>
</body>
</html>

View File

@ -0,0 +1,144 @@
<!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 | CD</title>
<link rel="shortcut icon" href="TemplateData/favicon.ico">
<link rel="stylesheet" href="TemplateData/style.css">
</head>
<style>body,html{
width: 100%;
height: 100%;
overflow: hidden;
}</style>
<body>
<div id="unity-container" class="unity-desktop" style="width: 100%;height: 100%">
<canvas id="unity-canvas" style="width: 100%;height: 100%"></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">CD</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");
// 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 + "/build.loader.js";
var config = {
dataUrl: buildUrl + "/build.data.unityweb",
frameworkUrl: buildUrl + "/build.framework.js.unityweb",
codeUrl: buildUrl + "/build.wasm.unityweb",
streamingAssetsUrl: "StreamingAssets",
companyName: "DefaultCompany",
productName: "CD",
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;
unityShowBanner('WebGL builds are not supported on mobile devices.');
} else {
// Desktop style: Render the game canvas in a window that can be maximized to fullscreen:
// canvas.style.width = "960px";
// canvas.style.height = "600px";
}
loadingBar.style.display = "block";
var unityInstanceA
var script = document.createElement("script");
script.src = loaderUrl;
script.onload = () => {
createUnityInstance(canvas, config, (progress) => {
progressBarFull.style.width = 100 * progress + "%";
}).then((unityInstance) => {
unityInstanceA = unityInstance
loadingBar.style.display = "none";
fullscreenButton.onclick = () => {
unityInstance.SetFullscreen(1);
};
}).catch((message) => {
alert(message);
});
};
document.body.appendChild(script);
// unity交互
function unity3D(val){
// OpenWebPanel()
unityInstanceA.SendMessage("App", "SetState", val + '')
}
// 打开web弹窗
function OnButtonClick(val){
console.log(val)
let name = "控制箱名称"
window.parent.openBox(name)
}
// 关闭照明
function closeLight(){
unityInstanceA.SendMessage("照明tip", "HideUnityPanel",'')
}
// 关闭策略
function closeStrategy(){
unityInstanceA.SendMessage("空调tip", "HideUnityPanel",'')
}
</script>
</body>
</html>

View File

@ -47,4 +47,12 @@ export function getPolicyEditing(params){
method:'get',
params
})
}
// 获取开机设备
export function getStrategyCompilation(params){
return http({
url:'/api/GetStrategyCompilation',
method:'get',
params
})
}

View File

@ -52,12 +52,12 @@ p,ul,li{
&-right-box {
padding-right: 2.375rem;
//animation: slide-out 2s ease-in-out;
animation: slide-out 2s ease-in-out;
}
&-left-box {
padding-left: 2.375rem;
//animation: slide-out 2s ease-in-out;
animation: slide-out 2s ease-in-out;
//transform: translateX(-100%);
}
}

View File

@ -1,7 +1,8 @@
<script setup>
import {ref} from 'vue'
import {getStrategyCompilation} from '@/api/air-conditioning';
import {ref,onMounted} from 'vue'
const checkAll = ref(false)
const isIndeterminate = ref(true)
const isIndeterminate = ref(false)
//
const props = defineProps({
dialogName:{
@ -9,31 +10,47 @@ const props = defineProps({
default:''
}
})
onMounted(()=>{
getStrategyCompilation({name:props.dialogName}).then(res=>{
checkedSystem.value = res.data[0].UnitName.filter(el=>{return el !== ''})
systems.value = res.data[0].PlantName
//
checkAll.value = checkedSystem.value.length === systems.value.length
//
isIndeterminate.value = checkedSystem.value.length > 0 && checkedSystem.value.length < systems.value.length
})
})
const emit = defineEmits(['update'])
const closeDialog = () =>{
emit('sendDevice',checkedSystem.value)
//
emit('update',false)
}
//
const checkedSystem = ref(['2号机窗'])
const systems = ['1号机窗', '2号机窗', '3号机窗', '4号机窗']
const systems = ref(['1号机窗', '2号机窗', '3号机窗', '4号机窗'])
//
const handleCheckAllChange = (val) => {
checkedSystem.value = val ? systems : []
checkedSystem.value = val ? systems.value : []
isIndeterminate.value = false
}
const handleCheckedCitiesChange = (value) => {
//
const handleCheckedCitiesChange = (value) => {
const checkedCount = value.length
checkAll.value = checkedCount === systems.length
isIndeterminate.value = checkedCount > 0 && checkedCount < systems.length
checkAll.value = checkedCount === systems.value.length
isIndeterminate.value = (checkedCount > 0 && checkedCount < systems.value.length)
}
//
const toggleClose = (index) =>{
checkedSystem.value.splice(index,1)
const checkedCount = checkedSystem.value.length
checkAll.value = checkedCount === systems.length
isIndeterminate.value = checkedCount > 0 && checkedCount < systems.length
checkAll.value = checkedCount === systems.value.length
isIndeterminate.value = checkedCount > 0 && checkedCount < systems.value.length
}
</script>
@ -81,6 +98,12 @@ const toggleClose = (index) =>{
</template>
<style scoped lang="scss">
:deep(.el-checkbox-group){
overflow-y:scroll;
}
:deep(.el-checkbox-group::-webkit-scrollbar){
display:none
}
.dialog-box{
width: 100%;
height: 90%;
@ -107,11 +130,15 @@ const toggleClose = (index) =>{
align-items: center;
margin-bottom: 2%;
}
.system::-webkit-scrollbar{
display:none;
}
.system{
overflow-y:scroll;
height: 80%;
.select-system{
margin-bottom: 2%;
width: 60%;
width: 70%;
padding-left: 1rem;
padding-right: .5rem;
box-sizing: border-box;
@ -124,6 +151,7 @@ const toggleClose = (index) =>{
align-items: center;
.close{
width: 8%;
margin-left:.54rem;
cursor: pointer;
height: 40%;
background-image: url("@/assets/images/air-conditioning/close-btn.png");

View File

@ -1,4 +1,5 @@
<script setup>
import { ElMessage } from 'element-plus'
import {ref, reactive,onMounted} from "vue";
import getPath from "@/utils/getPath.js";
import dialogBox from './components/dialogBox.vue'
@ -161,12 +162,31 @@ const dialogName = ref('')
const openDialog = (name) =>{
emit("closeAir","")
dialogBoxShow.value = true
dialogName.value = name
}
const closeDialog = (val) =>{
let params = {
name:dialogName.value,
value:deviceList.value===""?null: deviceList.value
}
console.log(deviceList.value,'参数',params);
getPolicyEditing(params).then(res=>{
if(res.code===200){
ElMessage({
message: '保存成功',
type: 'success',
})
}
})
dialogBoxShow.value = val
}
const deviceList = ref('')
//
const getDevice = (data) =>{
console.log(data);
//
deviceList.value = data.join(',')
}
//
const controlBtn = ref('on')
const toggleControl = (event) => {
@ -250,7 +270,7 @@ onMounted(()=>{
<template>
<div class="page m100">
<!-- 弹窗-->
<dialogBox v-show="dialogBoxShow" @update="closeDialog" :dialogName="dialogName"/>
<dialogBox v-if="dialogBoxShow" @update="closeDialog" :dialogName="dialogName" @sendDevice="getDevice"/>
<div class="page-left-box">
<!-- 概况-->
<div class="title">

View File

@ -23,7 +23,7 @@ export default defineConfig({
proxy: {
// https://cn.vitejs.dev/config/#server-proxy
'/dev-api': {
target: 'http://172.16.1.156:8021/',
target: 'http://172.16.1.125:8021/',
changeOrigin: true,
rewrite: (p) => p.replace(/^\/dev-api/, '')
}