三维场景切换

This commit is contained in:
luoshiwen 2023-04-14 14:26:08 +08:00
parent cb7869b4dc
commit 17c8898a13
19 changed files with 205 additions and 189 deletions

File diff suppressed because one or more lines are too long

View File

@ -1,15 +1,14 @@
<!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 | ElectricPowerStorage_Digital Twin</title>
<link rel="shortcut icon" href="TemplateData/favicon.ico">
<link rel="stylesheet" href="TemplateData/style.css">
</head>
<style>
body,
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Unity WebGL Player | ElectricPowerStorage_Digital Twin</title>
<link rel="shortcut icon" href="TemplateData/favicon.ico">
<link rel="stylesheet" href="TemplateData/style.css">
</head>
<style>
body,
html {
width: 100%;
height: 100%;
@ -17,120 +16,119 @@
padding: 0;
overflow: hidden;
}
</style>
<body>
<div id="unity-container" style="width: 100%;height:100%" class="unity-desktop">
<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>
</style>
<body>
<div id="unity-container" style="width: 100%;height:100%" class="unity-desktop">
<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">ElectricPowerStorage_Digital Twin</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">ElectricPowerStorage_Digital Twin</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");
<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';
// 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 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);
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: "ElectricPowerStorage_Digital Twin",
productVersion: "0.1.0",
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";
// To lower canvas resolution on mobile devices to gain some
// performance, uncomment the following line:
// config.devicePixelRatio = 1;
canvas.style.width = window.innerWidth + 'px';
canvas.style.height = window.innerHeight + 'px';
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";
}
updateBannerVisibility();
}
var buildUrl = "Build";
var loaderUrl = buildUrl + "/WebglQidong.loader.js";
var config = {
dataUrl: buildUrl + "/WebglQidong.data.unityweb",
frameworkUrl: buildUrl + "/WebglQidong.framework.js.unityweb",
codeUrl: buildUrl + "/WebglQidong.wasm.unityweb",
streamingAssetsUrl: "StreamingAssets",
companyName: "DefaultCompany",
productName: "ElectricPowerStorage_Digital Twin",
productVersion: "0.1.0",
showBanner: unityShowBanner,
};
loadingBar.style.display = "block";
// 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";
// To lower canvas resolution on mobile devices to gain some
// performance, uncomment the following line:
// config.devicePixelRatio = 1;
canvas.style.width = window.innerWidth + 'px';
canvas.style.height = window.innerHeight + 'px';
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 script = document.createElement("script");
var unityInstanceA
script.src = loaderUrl;
script.onload = () => {
createUnityInstance(canvas, config, (progress) => {
progressBarFull.style.width = 100 * progress + "%";
}).then((unityInstance) => {
loadingBar.style.display = "none";
unityInstanceA = unityInstance
fullscreenButton.onclick = () => {
unityInstance.SetFullscreen(1);
};
}).catch((message) => {
alert(message);
});
};
document.body.appendChild(script);
function shelvesList(val) {
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);
function shelvesList(val) {
console.log(val,'unity');
// unityInstanceA.Unity_ShelvesList(val)
unityInstanceA.SendMessage("Manager", "Unity_ShelvesList", val);
@ -143,7 +141,7 @@
// 库房的定位
function selectHome(val) {
console.log(val,'库房的定位');
unityInstanceA.SendMessage("Manager", "Unity_WarehouseList", val);
unityInstanceA.SendMessage("Manager", "Unity_WarehouseList",val);
}
// 库外的按钮
function outHome() {
@ -173,7 +171,6 @@
console.log('仓位号位置' + val);
unityInstanceA.SendMessage("Manager","Unity_LocateWarehouseNo",val+'')
}
</script>
</body>
</html>
</script>
</body>
</html>

3
public/config.js Normal file
View File

@ -0,0 +1,3 @@
const config = {
VUE_APP_API_BASE_URL: 'http://20.47.106.51:30005/gwcpedge/',
}

View File

@ -5,7 +5,8 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title>启东南苑路数字孪生仓库</title>
<title>启东南苑路仓库</title>
<script src="./config.js"></script>
</head>
<body>
<noscript>

View File

@ -7,10 +7,10 @@
</div>
<!-- 头部 -->
<header class="nav">
<div class="wether">
<!-- <div class="wether">
<img src="@/assets/images/cloudy.png" alt="" />
<span class="tianqi">多云</span>
</div>
</div> -->
<el-select v-model="value" placeholder="请选择">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" >
</el-option>
@ -21,8 +21,8 @@
<ul>
<li v-for="(s, i) in liImgs" class="nav-li" :key="i" @click="handleBtn($event, i)">
<el-dropdown trigger="click" placement="bottom" v-if="i == 0" :hide-on-click="false" ref="drop1">
<span class="downPull"><img :src="i==index ? s.selectImg : s.img" alt="" /></span>
<el-dropdown trigger="click" placement="bottom" v-if="i == 0" :hide-on-click="false" ref="drop1" @visible-change="visibleChange1">
<span class="downPull"><img :src="drop1 ? s.selectImg : s.img" alt="" /></span>
<el-dropdown-menu slot="dropdown">
<ul class="menuContent">
<!-- <li v-for="(num, index) in 15" :key="index" @click="shelfHanlder($event)">LD1_B01-{{ num < 10 ? "0" + num
@ -40,8 +40,8 @@
</el-dropdown>
<el-dropdown trigger="click" placement="bottom" v-else-if="i == 2" :hide-on-click="true"
>
<span class="downPull"><img :src="i==index ? s.selectImg : s.img" alt="" /></span>
@visible-change="visibleChange2">
<span class="downPull"><img :src="drop2 ? s.selectImg : s.img" alt="" /></span>
<el-dropdown-menu slot="dropdown">
<ul class="menuContent">
<!-- <li @click="selectHomeN($event)">B01</li>
@ -64,11 +64,11 @@
</ul>
</header>
<!-- 右侧边栏 -->
<aside class="right-aside">
<!-- <aside class="right-aside">
<span v-for="(s, i) in heatList" :class="`span${i}`" :key="i">
{{ s }}
</span>
</aside>
</aside> -->
<router-view />
</div>
</template>
@ -116,11 +116,15 @@ export default {
navLiState: false,
loadShow:true,
drop1:false,
drop2:false
};
},
created() {
this.$nextTick(() => {
// getVisualStorageList({ wareHouseCode: "HA1" }).then((res) => {
// getVisualStorageList({ wareHouseCode: "FF1" }).then((res) => {
// console.log(res, "shuju");
// });
});
@ -133,9 +137,16 @@ export default {
// this.load()
},
methods: {
//
visibleChange1(bool) {
this.drop1 = bool;
},
visibleChange2(bool) {
this.drop2 = bool;
},
// unity
searchHouse(){
console.log(1111);
// console.log(1111);
if (this.value == "仓位号") {
this.$refs.dome.contentWindow.wareHouse(this.input3)
} else if (this.value == "物料编码") {

View File

@ -1,59 +1,62 @@
// 测试请求是否能跨域
// export const getWather = (params) => {
// return axios.get('api/Handler/Weather.ashx', {
// return axios.get('Handler/Weather.ashx', {
// params
// })
// };
import axios from 'axios'
// axios.defaults.baseURL = 'http://20.47.106.51:30005/gwcpedge/'
axios.defaults.baseURL = config.VUE_APP_API_BASE_URL
export const getVisualStorageList = (params) => {
return axios.get('api/visualStorage/getVisualStorageList', {
return axios.get('visualStorage/getVisualStorageList', {
params
})
}
// 获取仓位得接口
export const byPosition = (params) => {
return axios.get('api/visualStorage/getVisualStorageListByPosition', {
return axios.get('visualStorage/getVisualStorageListByPosition', {
params
})
}
// 获取物料和批次
export const byBatchAndMateri = (params) => {
return axios.get('api/visualStorage/getVisualStorageListByBatchAndMateriel', {
return axios.get('visualStorage/getVisualStorageListByBatchAndMateriel', {
params
})
}
// 仓库使用率
export const getWarehouseUsages = (params) => {
return axios.get('api/visualStorage/getWarehouseUsages', {
return axios.get('visualStorage/getWarehouseUsages', {
params
})
}
// 每月的周转率
export const getTurnoverRate = (params) => {
return axios.get('api/visualStorage/getTurnoverRateList', {
return axios.get('visualStorage/getTurnoverRateList', {
params
})
}
// 当月出入库金额
export const getChangeAmount = (params) => {
return axios.get('api/visualStorage/getChangeAmount', {
return axios.get('visualStorage/getChangeAmount', {
params
})
}
// 积压物质
export const getBacklogMaterialInfo = (params) => {
return axios.get('api/visualStorage/getBacklogMaterialInfo', {
return axios.get('visualStorage/getBacklogMaterialInfo', {
params
})
}
// 库龄结构
export const getInventoryAgeInfo = (params) => {
return axios.get('api/visualStorage/getInventoryAgeInfo', {
return axios.get('visualStorage/getInventoryAgeInfo', {
params
})
}
@ -61,14 +64,14 @@ export const getInventoryAgeInfo = (params) => {
// 库存构成
export const getStore = (params) => {
return axios.get('api/visualStorage/getInventoryConstitute', {
return axios.get('visualStorage/getInventoryConstitute', {
params
})
}
// 库容预测
export const getMaterialDataList = (params) => {
return axios.get('api/visualStorage/getMaterialDataList', {
return axios.get('visualStorage/getMaterialDataList', {
params
})
}

View File

@ -64,22 +64,24 @@ export default {
},
created() {
// 使
// getWarehouseUsages({wareHouseCode:'HA1'}).then(res=>{
// console.log(res,'使');
// this.storeData = res.data.data
// this.drawStore(this.storeData)
// // console.log(this.storeData,'......');
// })
// getTurnoverRate({wareHouseCode:'HA1'}).then(res=>{
// console.log(res,'');
// this.drawTurnoverChart(res.data.data.rateList)
// })
// getBacklogMaterialInfo({wareHouseCode:'HA1'}).then(res=>{
// console.log(res,'');
// this.drawOverStock(res.data.data)
// })
// },
getWarehouseUsages({wareHouseCode:'FF1'}).then(res=>{
console.log(res,'仓库使用率');
this.storeData = res.data.data
this.drawStore(this.storeData)
// console.log(this.storeData,'......');
})
//
getTurnoverRate({wareHouseCode:'FF1'}).then(res=>{
console.log(res,'每月的周转率');
this.drawTurnoverChart(res.data.data.rateList)
})
//
getBacklogMaterialInfo({wareHouseCode:'FF1'}).then(res=>{
console.log(res,'积压物资');
this.drawOverStock(res.data.data)
})
},
methods: {
// 使ecahrt
@ -161,7 +163,7 @@ export default {
icon: "circle",
itemWidth: 4,
itemHeight: 6, //'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow', 'none'
left: '65%',
left: '60%',
top: tops1[i],
// width:'1000',
backgroundColor: colorList[i],

View File

@ -78,14 +78,14 @@ export default {
created() {
//
// getStore({wareHouseCode:'HA1'}).then(res=>{
// // console.log(res,'');
// if(res.data.code==200){
// // console.log(res.data.data,'kulin');
// this.ulList = res.data.data.infoList
// // console.log(this.ulList);
// }
// })
getStore({wareHouseCode:'FF1'}).then(res=>{
// console.log(res,'');
if(res.data.code==200){
// console.log(res.data.data,'kulin');
this.ulList = res.data.data.infoList
// console.log(this.ulList);
}
})
},
computed: {

View File

@ -101,23 +101,23 @@ export default {
this.view = "OverView";
// },2000)
//
// byPosition({ wareHouseCode: "HA1", position: "B01-010102" }).then((res) => {
// console.log(res, "");
// });
// //
// byBatchAndMateri({ batch:"2021093009",wareHouseCode:'HA1' }).then((res) => {
// console.log(res,'');
// });
byPosition({ wareHouseCode: "FF1", position: "B01-010102" }).then((res) => {
console.log(res, "仓位号");
});
//
byBatchAndMateri({ batch:"2021093009",wareHouseCode:'FF1' }).then((res) => {
console.log(res,'物料批次');
});
// // 使
// getWarehouseUsages({wareHouseCode:'HA1'}).then(res=>{
// getWarehouseUsages({wareHouseCode:'FF1'}).then(res=>{
// console.log(res,'使');
// })
//
// getTurnoverRate({wareHouseCode:'HA1'}).then(res=>{
// getTurnoverRate({wareHouseCode:'FF1'}).then(res=>{
// console.log(res,'');
// })
//
// getChangeAmount({wareHouseCode:'HA1'}).then(res=>{
// getChangeAmount({wareHouseCode:'FF1'}).then(res=>{
// console.log(res,'');
// })
//
@ -125,19 +125,19 @@ export default {
//
// getInventoryAgeInfo({wareHouseCode:'HA1'}).then(res=>{
// console.log(res,'');
// })
getInventoryAgeInfo({wareHouseCode:'FF1'}).then(res=>{
console.log(res,'库龄结构');
})
//
// getStore({wareHouseCode:'HA1'}).then(res=>{
// console.log(res,'');
// })
getStore({wareHouseCode:'FF1'}).then(res=>{
console.log(res,'库存结构');
})
//
// getMaterialDataList({method:'getYckc',LGUNM:"HA1",NY:"202304"}).then(res=>{
// console.log(res,'');
// })
getMaterialDataList({method:'getYckc',LGUNM:"FF1",NY:"202304"}).then(res=>{
console.log(res,'库容预测');
})
},
created() {},
computed: {},

View File

@ -4,7 +4,7 @@
// })
module.exports = {
// 打包文件配置
publicPath: "/",
publicPath: "./",
assetsDir: "static",
lintOnSave: false,
devServer: {