9.6代码提交
This commit is contained in:
parent
e2d194eab3
commit
2aeb10ea03
File diff suppressed because it is too large
Load Diff
|
|
@ -15,8 +15,11 @@
|
|||
"element-plus": "^2.3.14",
|
||||
"less": "^4.2.0",
|
||||
"three": "^0.164.1",
|
||||
"video.js": "^7.21.6",
|
||||
"vue": "^3.3.4",
|
||||
"vue-router": "^4.2.5"
|
||||
"vue-router": "^4.2.5",
|
||||
"vue-video-player": "^5.0.2",
|
||||
"vue3-video-play": "^1.3.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vitejs/plugin-vue": "^4.2.3",
|
||||
|
|
|
|||
Binary file not shown.
Binary file not shown.
File diff suppressed because one or more lines are too long
Binary file not shown.
|
|
@ -0,0 +1 @@
|
|||
172.16.1.104:5005
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 665 B |
Binary file not shown.
|
After Width: | Height: | Size: 2.5 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 175 B |
Binary file not shown.
|
After Width: | Height: | Size: 96 B |
Binary file not shown.
|
After Width: | Height: | Size: 109 B |
Binary file not shown.
|
After Width: | Height: | Size: 74 B |
Binary file not shown.
|
After Width: | Height: | Size: 84 B |
|
|
@ -0,0 +1,24 @@
|
|||
body { overflow: hidden;
|
||||
height: 100%;
|
||||
width: 100%; }
|
||||
#unity-container { position: absolute }
|
||||
#unity-container.unity-desktop { left: 50%; top: 50%; transform: translate(-50%, -50%) }
|
||||
#unity-container.unity-mobile { width: 100%; height: 100% }
|
||||
#unity-canvas { background: url('bg1.jpg') no-repeat; }
|
||||
.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-logo { width: 154px; height: 130px; background: url('unity-logo-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;display: none; }
|
||||
#unity-progress-bar-full { width: 0%; height: 18px; margin-top: 10px; background: url('progress-bar-full-dark.png') no-repeat center;display: none; }
|
||||
#unity-footer { position: relative }
|
||||
.unity-mobile #unity-footer { display: none }
|
||||
/* #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-fullscreen-button { float: right; width: 38px; height: 38px; background: url('fullscreen-button.png') no-repeat center ;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;
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 3.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
|
|
@ -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>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<configuration>
|
||||
<system.webServer>
|
||||
<staticContent>
|
||||
<mimeMap fileExtension=".unity3d" mimeType="application/octet-stream" />
|
||||
<mimeMap fileExtension=".unityweb" mimeType="application/octet-stream" />
|
||||
</staticContent>
|
||||
</system.webServer>
|
||||
</configuration>
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
|
@ -64,7 +64,7 @@ export function allDevicId(params){
|
|||
// 易损件
|
||||
export function getPageDamageEquip(params){
|
||||
return request({
|
||||
url:'/api/equipManage/GetPageDamageEquip',
|
||||
url:'/api/equipManage/GetDamageElement',
|
||||
method:'get',
|
||||
params
|
||||
})
|
||||
|
|
@ -102,7 +102,7 @@ export function countYearErrors(params){
|
|||
}
|
||||
|
||||
|
||||
// 维护保养统计
|
||||
// 维修统计
|
||||
export function countMaintainRecord(params){
|
||||
return request({
|
||||
url:'/api/maintainManage/CountMaintainRecord',
|
||||
|
|
@ -151,4 +151,41 @@ export function getErrorRate(params){
|
|||
method:'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
|
||||
//运维指导
|
||||
|
||||
//指导文件下拉数据
|
||||
export function getDocsIdentity(params){
|
||||
return request({
|
||||
url:'/api/guide/GetDocsIdentity',
|
||||
method:'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
//指导文件
|
||||
export function GetPageGuideDocs(params){
|
||||
return request({
|
||||
url:'/api/guide/GetPageGuideDocs',
|
||||
method:'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
|
||||
//知识库
|
||||
//获取知识库下拉数据
|
||||
export function GetVideosIdentity(params){
|
||||
return request({
|
||||
url:'/api/guide/GetVideosIdentity',
|
||||
method:'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
//获取知识库列表数据
|
||||
export function GetPageGuideVideos(params){
|
||||
return request({
|
||||
url:'/api/guide/GetPageGuideVideos',
|
||||
method:'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 124 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 67 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 121 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 57 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 27 KiB |
|
|
@ -4,7 +4,7 @@
|
|||
<div class="box">
|
||||
<div class="box-header">
|
||||
<div class="box-title">
|
||||
{{ props.title === '维护保养统计'?"维修统计":props.title }}
|
||||
{{ props.title === '维修统计'?"维修统计":props.title }}
|
||||
</div>
|
||||
<div class="el-select1">
|
||||
<el-select
|
||||
|
|
@ -25,7 +25,7 @@
|
|||
</el-select>
|
||||
</div>
|
||||
<div class="el-select2">
|
||||
<el-select v-if="props.title === '维护保养统计'"
|
||||
<el-select v-if="props.title === '维修统计'"
|
||||
v-model="isMaintain"
|
||||
placeholder="请选择"
|
||||
@change="
|
||||
|
|
@ -83,10 +83,10 @@
|
|||
<el-table-column prop="remark" label="备注" align="center" />
|
||||
</el-table>
|
||||
</div>
|
||||
<!-- 维护保养统计 -->
|
||||
<!-- 维修统计 -->
|
||||
<div
|
||||
class="box-content-table"
|
||||
v-else-if="props.title === '维护保养统计'"
|
||||
v-else-if="props.title === '维修统计'"
|
||||
>
|
||||
<el-table :data="tableList" style="width: 100%">
|
||||
<el-table-column
|
||||
|
|
@ -177,7 +177,7 @@ function getTableList() {
|
|||
tableList.value = res.result.data;
|
||||
total.value = res.result.total;
|
||||
});
|
||||
} else if (props.title === "维护保养统计") {
|
||||
} else if (props.title === "维修统计") {
|
||||
params.isMaintain = isMaintain.value;
|
||||
getPageMaintainInfo(params).then((res) => {
|
||||
tableList.value = res.result.data;
|
||||
|
|
|
|||
|
|
@ -46,7 +46,7 @@
|
|||
</div>
|
||||
<!-- table -->
|
||||
<div class="box-content-left-table">
|
||||
<el-table :data="tableList" style="width: 100%">
|
||||
<el-table :data="tableList" style="width: 100%" @row-click="OperationData" :row-class-name="getCellClassName">
|
||||
<el-table-column prop="facCode" label="设备编号" />
|
||||
<el-table-column prop="deviceName" label="设备名称" />
|
||||
</el-table>
|
||||
|
|
@ -70,6 +70,15 @@
|
|||
<div class="box-content-right-top">
|
||||
<div class="box-content-right-title">
|
||||
<span>运行情况统计</span>
|
||||
<div style="display: flex; margin-left:50%">
|
||||
<el-date-picker
|
||||
v-model="value3"
|
||||
type="year"
|
||||
placeholder="请选择年份"
|
||||
@change="OperationData"
|
||||
/>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- 折线图 -->
|
||||
<div class="lineChart" id="lineChart"></div>
|
||||
|
|
@ -85,7 +94,7 @@
|
|||
:key="index"
|
||||
>
|
||||
<p>
|
||||
<span>{{item.equipment.facName }} {{item.equipment.facCode}}</span>
|
||||
<span>{{item.elementName }} {{item.elementCode}}</span>
|
||||
<span>{{ item.damageRatio*100 }}%</span>
|
||||
</p>
|
||||
<div class="switch-item-progress" :style="'width:' + item.damageRatio*100 + '%'"></div>
|
||||
|
|
@ -119,12 +128,25 @@ import {
|
|||
getEquipCode
|
||||
} from "@/api/equipmentManagement/index";
|
||||
const emit = defineEmits(["closeEquipmentAnalysis"]);
|
||||
const value3 = ref(new Date());
|
||||
function openDialog(event, val) {
|
||||
if (val !== undefined) {
|
||||
dialogTitle.value =
|
||||
event.target.parentNode.previousElementSibling.innerText;
|
||||
maintenanceDialogShow.value = true;
|
||||
} else {
|
||||
dialogTitle.value = event.target.previousElementSibling.innerText;
|
||||
maintenanceDialogShow.value = true;
|
||||
}
|
||||
// console.log(event.target.previousElementSibling.innerText);
|
||||
}
|
||||
const options = ref([
|
||||
{
|
||||
value: 1,
|
||||
label: 1,
|
||||
},
|
||||
]);
|
||||
const activeRow= ref(null)
|
||||
const tableList = ref([
|
||||
{
|
||||
id: "SFTR-003DB013",
|
||||
|
|
@ -174,7 +196,9 @@ function drawLineChart(data) {
|
|||
let myChart;
|
||||
myChart = echarts.init(dom);
|
||||
let option = {
|
||||
tooltip: {},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
grid: {
|
||||
top: "8%",
|
||||
left: "1%",
|
||||
|
|
@ -225,7 +249,7 @@ function drawLineChart(data) {
|
|||
],
|
||||
series: [
|
||||
{
|
||||
name: "异常流量",
|
||||
name: "运行情况",
|
||||
type: "line",
|
||||
|
||||
// symbol:'circle', // 默认是空心圆（中间是白色的），改成实心圆
|
||||
|
|
@ -308,7 +332,9 @@ const total = ref(0)
|
|||
function getDeviceList() {
|
||||
getPageEquipList(deviceListParams).then((res) => {
|
||||
tableList.value = res.result.data;
|
||||
OperationData(tableList.value[0]);
|
||||
total.value = res.result.totalNum
|
||||
|
||||
});
|
||||
}
|
||||
// 所有设备名称
|
||||
|
|
@ -320,6 +346,12 @@ function getAllDeviceNames() {
|
|||
allName.value = res.result;
|
||||
});
|
||||
}
|
||||
function getCellClassName({ row, rowIndex }) {
|
||||
if (currentRowId.value == row.id) {
|
||||
return "highlight-row";
|
||||
}
|
||||
return "";
|
||||
}
|
||||
// 所有设备id
|
||||
const deviceIds = ref([]);
|
||||
function deviceNameChange() {
|
||||
|
|
@ -336,32 +368,65 @@ function clearHandle() {
|
|||
deviceListParams.deviceCode = "";
|
||||
deviceIds.value = "";
|
||||
}
|
||||
// 初始id
|
||||
const currentRowId = ref(null);
|
||||
|
||||
const equipmentCode = ref('Car1')
|
||||
// 获取运行情况数据请求
|
||||
function OperationData() {
|
||||
countYearErrors().then((res) => {
|
||||
function OperationData(row) {
|
||||
console.log(row,"row")
|
||||
currentRowId.value = row.id;
|
||||
console.log(" equipmentCode.value", equipmentCode.value)
|
||||
let params={}
|
||||
if(row.facCode){
|
||||
equipmentCode.value = row.facCode
|
||||
params = {
|
||||
year: value3.value.getFullYear(),
|
||||
equipmentCode: row.facCode,
|
||||
};
|
||||
getPageDamageEquipList()
|
||||
}else{
|
||||
params = {
|
||||
year: value3.value.getFullYear(),
|
||||
equipmentCode: equipmentCode.value,
|
||||
};
|
||||
}
|
||||
|
||||
activeRow.value = row;
|
||||
countYearErrors(params).then((res) => {
|
||||
drawLineChart(res.result.slice(1));
|
||||
});
|
||||
}
|
||||
|
||||
const params = {
|
||||
facName:'',
|
||||
const params1 = {
|
||||
equipmentCode:'',
|
||||
pageIndex:1,
|
||||
pageSize:4
|
||||
}
|
||||
// 获取易损件数据
|
||||
function getPageDamageEquipList(){
|
||||
getPageDamageEquip(params).then(res=>{
|
||||
switchList.value = res.result.data
|
||||
params1.equipmentCode = equipmentCode.value
|
||||
getPageDamageEquip(params1).then(res=>{
|
||||
switchList.value = res.result
|
||||
})
|
||||
}
|
||||
onMounted(() => {
|
||||
getAllDeviceNames();
|
||||
getDeviceList();
|
||||
OperationData();
|
||||
getPageDamageEquipList()
|
||||
|
||||
// getPageDamageEquipList()
|
||||
});
|
||||
</script>
|
||||
<style>
|
||||
.active-row {
|
||||
background-color: #6ebd43;
|
||||
/* 其他你想要的样式 */
|
||||
}
|
||||
</style>
|
||||
<style scoped lang="scss">
|
||||
:deep(.highlight-row) {
|
||||
background-color:rgba(174, 211, 255, 0.2) !important;
|
||||
}
|
||||
.box {
|
||||
width: vw(1380);
|
||||
height: vh(716);
|
||||
|
|
@ -418,6 +483,7 @@ onMounted(() => {
|
|||
box-sizing: border-box;
|
||||
background-size: 100% 100%;
|
||||
background-image: url("@/assets/images/dialog/deviceInfo-title1.png");
|
||||
|
||||
span {
|
||||
font-size: 1.375rem;
|
||||
font-family: "pangmen";
|
||||
|
|
@ -437,6 +503,7 @@ onMounted(() => {
|
|||
box-sizing: border-box;
|
||||
background-size: 100% 100%;
|
||||
background-image: url("@/assets/images/dialog/deviceInfo-title2.png") !important;
|
||||
display: flex;
|
||||
span {
|
||||
font-size: 1.375rem;
|
||||
font-family: "pangmen";
|
||||
|
|
@ -463,6 +530,9 @@ onMounted(() => {
|
|||
}
|
||||
&-bottom {
|
||||
height: vh(288);
|
||||
.switch::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
.switch {
|
||||
margin-top: vh(16);
|
||||
width: 100%;
|
||||
|
|
@ -471,8 +541,10 @@ onMounted(() => {
|
|||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
align-content: space-between;
|
||||
overflow: scroll;
|
||||
&-item {
|
||||
width: vw(392);
|
||||
margin-bottom: vh(12);
|
||||
height: vh(92);
|
||||
box-sizing: border-box;
|
||||
padding: vh(8) vw(16);
|
||||
|
|
@ -552,4 +624,5 @@ onMounted(() => {
|
|||
:deep(.el-pagination__total){
|
||||
left: vw(40) !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -28,6 +28,7 @@
|
|||
v-model="value2"
|
||||
type="year"
|
||||
placeholder="请选择年份"
|
||||
@change="sparePartsInterface"
|
||||
/>
|
||||
<span
|
||||
style="margin-left: 1.25rem"
|
||||
|
|
@ -59,7 +60,7 @@
|
|||
</div>
|
||||
<div class="box-content-box4">
|
||||
<div class="title">
|
||||
<span>维护保养统计</span>
|
||||
<span>维修统计</span>
|
||||
<span class="more" @click="openDialog"></span>
|
||||
</div>
|
||||
<div class="maintenance">
|
||||
|
|
@ -139,14 +140,17 @@ function drawHealthIndex(list) {
|
|||
"rgba(174, 211, 255, 0.7)",
|
||||
];
|
||||
let result = []
|
||||
for (let key in list) {
|
||||
if (key !== "错误总数") {
|
||||
result.push({
|
||||
name: key,
|
||||
value: list[key],
|
||||
});
|
||||
}
|
||||
}
|
||||
let total = list.totalCount;
|
||||
for (var i = 0; i < list.columnDatas.length; i++) {
|
||||
// if (key != "totalCount") {
|
||||
result.push({
|
||||
name: list.columnDatas[i].name,
|
||||
value: list.columnDatas[i].number,
|
||||
});
|
||||
// } else {
|
||||
// total = list[key];
|
||||
// }
|
||||
}
|
||||
let dom = document.querySelector("#healthIndex");
|
||||
dom.removeAttribute("_echarts_instance_");
|
||||
let myChart;
|
||||
|
|
@ -186,6 +190,10 @@ function drawHealthIndex(list) {
|
|||
backgroundColor: "rgba(0,0,0,0.7)", // 背景
|
||||
padding: [8, 10], //内边距
|
||||
extraCssText: "box-shadow: 0 0 3px rgba(255, 255, 255, 0.4);", //添加阴影
|
||||
formatter: function (params) {
|
||||
// return params.name + ': ' + total*params.value
|
||||
return params.name + ': ' + params.value
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
orient: "vertical",
|
||||
|
|
@ -283,7 +291,7 @@ function drawHealthIndex(list) {
|
|||
if (el.name === "往复式提升机") {
|
||||
return {
|
||||
value: el.value,
|
||||
name: "往复式提升机",
|
||||
name: el.name,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "rgba(28, 238, 251, 0.62)",
|
||||
|
|
@ -293,7 +301,7 @@ function drawHealthIndex(list) {
|
|||
} else {
|
||||
return {
|
||||
value: el.value,
|
||||
name: "智能双向穿梭车",
|
||||
name:el.name,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "rgba(4, 132, 189, 0.62)",
|
||||
|
|
@ -319,14 +327,17 @@ function drawSpareParts(list) {
|
|||
"rgba(174, 211, 255, 0.7)",
|
||||
];
|
||||
let result = []
|
||||
for (let key in list) {
|
||||
if (key !== "总数") {
|
||||
result.push({
|
||||
name: key,
|
||||
value: list[key],
|
||||
});
|
||||
}
|
||||
}
|
||||
let total = list.totalCount;
|
||||
for (var i = 0; i < list.columnDatas.length; i++) {
|
||||
// if (key != "totalCount") {
|
||||
result.push({
|
||||
name: list.columnDatas[i].name,
|
||||
value: list.columnDatas[i].number,
|
||||
});
|
||||
// } else {
|
||||
// total = list[key];
|
||||
// }
|
||||
}
|
||||
let dom = document.querySelector("#spareParts");
|
||||
dom.removeAttribute("_echarts_instance_");
|
||||
let myChart;
|
||||
|
|
@ -342,6 +353,7 @@ function drawSpareParts(list) {
|
|||
shadowBlur: 40,
|
||||
borderWidth: 10,
|
||||
shadowColor: "rgba(0, 0, 0, 0)", //边框阴影
|
||||
|
||||
},
|
||||
};
|
||||
let placeHolderStyle = {
|
||||
|
|
@ -366,6 +378,10 @@ function drawSpareParts(list) {
|
|||
backgroundColor: "rgba(0,0,0,0.7)", // 背景
|
||||
padding: [8, 10], //内边距
|
||||
extraCssText: "box-shadow: 0 0 3px rgba(255, 255, 255, 0.4);", //添加阴影
|
||||
formatter: function (params) {
|
||||
// return params.name + ': ' + total*params.value
|
||||
return params.name + ': ' + params.value
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
orient: "vertical",
|
||||
|
|
@ -485,7 +501,7 @@ function drawFault(data) {
|
|||
let myChart;
|
||||
myChart = echarts.init(dom);
|
||||
let option = {
|
||||
tooltip: {},
|
||||
tooltip: {trigger: 'axis'},
|
||||
grid: {
|
||||
top: "8%",
|
||||
left: "1%",
|
||||
|
|
@ -536,7 +552,7 @@ function drawFault(data) {
|
|||
],
|
||||
series: [
|
||||
{
|
||||
name: "异常流量",
|
||||
name: "故障",
|
||||
type: "line",
|
||||
|
||||
// symbol:'circle', // 默认是空心圆（中间是白色的），改成实心圆
|
||||
|
|
@ -603,7 +619,7 @@ function getHealthIndex() {
|
|||
}
|
||||
|
||||
const maintenanceList = ref([]);
|
||||
// 维护保养统计接口
|
||||
// 维修统计接口
|
||||
function maintenanceInterface() {
|
||||
countMaintainRecord().then((res) => {
|
||||
for (let key in res.result) {
|
||||
|
|
@ -617,6 +633,7 @@ function faultAnalysisInterface() {
|
|||
year: value3.value.getFullYear(),
|
||||
};
|
||||
countYearErrors(params).then((res) => {
|
||||
console.log("res.result",res.result)
|
||||
drawFault(res.result.slice(1));
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,11 +11,11 @@
|
|||
<div class="title">
|
||||
<span> 已完成维保统计 </span>
|
||||
<el-date-picker
|
||||
v-model="value1"
|
||||
type="year"
|
||||
placeholder="请选择年份"
|
||||
@change="completedMaintenancePlan"
|
||||
/>
|
||||
v-model="value1"
|
||||
type="year"
|
||||
placeholder="请选择年份"
|
||||
@change="completedMaintenancePlan"
|
||||
/>
|
||||
</div>
|
||||
<div class="chart" id="pieChart1"></div>
|
||||
</div>
|
||||
|
|
@ -23,11 +23,11 @@
|
|||
<div class="title">
|
||||
<span> 保养计划 </span>
|
||||
<el-date-picker
|
||||
v-model="value2"
|
||||
type="year"
|
||||
placeholder="请选择年份"
|
||||
@change="maintenancePlan"
|
||||
/>
|
||||
v-model="value2"
|
||||
type="year"
|
||||
placeholder="请选择年份"
|
||||
@change="maintenancePlan"
|
||||
/>
|
||||
</div>
|
||||
<div class="chart" id="pieChart2"></div>
|
||||
</div>
|
||||
|
|
@ -36,9 +36,7 @@
|
|||
<div class="title">
|
||||
<span> 维护计划 </span>
|
||||
<el-select
|
||||
@change="
|
||||
getMaintenancePlanData();
|
||||
"
|
||||
@change="getMaintenancePlanData()"
|
||||
clearable
|
||||
v-model="planParams.facName"
|
||||
placeholder="请选择"
|
||||
|
|
@ -52,22 +50,19 @@
|
|||
</el-select>
|
||||
</div>
|
||||
<div class="box-content-bottom-table">
|
||||
<el-table
|
||||
:data="tableList"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table :data="tableList" style="width: 100%">
|
||||
<el-table-column prop="keepPlanTime" label="计划时间" />
|
||||
<el-table-column prop="facCode" label="设备编码" />
|
||||
<el-table-column prop="facName" label="设备名称" />
|
||||
<el-table-column prop="keepFinishTime" label="执行时间" />
|
||||
<el-table-column prop="keepContent" label="保养内容" />
|
||||
<el-table-column prop="status" label="状态" align="center">
|
||||
<template #default="{ row }">
|
||||
<div :style="row.status ? 'color:rgba(28, 238, 251, 1)' : ''">
|
||||
{{ row.status ? "已完成" : "未完成" }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<template #default="{ row }">
|
||||
<div :style="row.status ? 'color:rgba(28, 238, 251, 1)' : ''">
|
||||
{{ row.status ? "已完成" : "未完成" }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
|
||||
|
|
@ -91,11 +86,14 @@
|
|||
<script setup>
|
||||
import * as echarts from "echarts";
|
||||
import { onMounted, ref, nextTick, reactive } from "vue";
|
||||
import { countKeepRecord ,getMaintenancePlan,allDeviceNames} from "@/api/equipmentManagement/index";
|
||||
import {
|
||||
countKeepRecord,
|
||||
getMaintenancePlan,
|
||||
allDeviceNames,
|
||||
} from "@/api/equipmentManagement/index";
|
||||
const emit = defineEmits(["closeMaintenance"]);
|
||||
|
||||
function close() {
|
||||
|
||||
emit("closeMaintenance", -1);
|
||||
}
|
||||
const tableList = ref([
|
||||
|
|
@ -136,13 +134,16 @@ function drawLeftChart(list) {
|
|||
"rgba(174, 211, 255, 0.7)",
|
||||
];
|
||||
let result = [];
|
||||
for (let key in list) {
|
||||
if (key != "总数") {
|
||||
let total = list.totalCount;
|
||||
for (var i = 0; i < list.columnDatas.length; i++) {
|
||||
// if (key != "totalCount") {
|
||||
result.push({
|
||||
name: key,
|
||||
value: list[key],
|
||||
name: list.columnDatas[i].name,
|
||||
value: list.columnDatas[i].number,
|
||||
});
|
||||
}
|
||||
// } else {
|
||||
// total = list[key];
|
||||
// }
|
||||
}
|
||||
let dom = document.querySelector("#pieChart1");
|
||||
dom.removeAttribute("_echarts_instance_");
|
||||
|
|
@ -181,6 +182,10 @@ function drawLeftChart(list) {
|
|||
backgroundColor: "rgba(0,0,0,0.7)", // 背景
|
||||
padding: [8, 10], //内边距
|
||||
extraCssText: "box-shadow: 0 0 3px rgba(255, 255, 255, 0.4);", //添加阴影
|
||||
formatter: function (params) {
|
||||
// return params.name + ': ' + total*params.value
|
||||
return params.name + ': ' + params.value
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
orient: "vertical",
|
||||
|
|
@ -281,7 +286,7 @@ function drawLeftChart(list) {
|
|||
},
|
||||
},
|
||||
};
|
||||
})
|
||||
}),
|
||||
},
|
||||
],
|
||||
};
|
||||
|
|
@ -299,13 +304,16 @@ function drawRightChart(list) {
|
|||
"rgba(174, 211, 255, 0.7)",
|
||||
];
|
||||
let result = [];
|
||||
for (let key in list) {
|
||||
if (key != "总数") {
|
||||
let total = list.totalCount;
|
||||
for (var i = 0; i < list.columnDatas.length; i++) {
|
||||
// if (key != "totalCount") {
|
||||
result.push({
|
||||
name: key,
|
||||
value: list[key],
|
||||
name: list.columnDatas[i].name,
|
||||
value: list.columnDatas[i].number,
|
||||
});
|
||||
}
|
||||
// } else {
|
||||
// total = list[key];
|
||||
// }
|
||||
}
|
||||
let dom = document.querySelector("#pieChart2");
|
||||
dom.removeAttribute("_echarts_instance_");
|
||||
|
|
@ -343,6 +351,10 @@ function drawRightChart(list) {
|
|||
backgroundColor: "rgba(0,0,0,0.7)", // 背景
|
||||
padding: [8, 10], //内边距
|
||||
extraCssText: "box-shadow: 0 0 3px rgba(255, 255, 255, 0.4);", //添加阴影
|
||||
formatter: function (params) {
|
||||
// return params.name + ': ' + total*params.value
|
||||
return params.name + ': ' + params.value
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
orient: "vertical",
|
||||
|
|
@ -358,7 +370,6 @@ function drawRightChart(list) {
|
|||
},
|
||||
itemWidth: 8,
|
||||
itemHeight: 8,
|
||||
|
||||
},
|
||||
series: [
|
||||
{
|
||||
|
|
@ -460,45 +471,45 @@ function drawRightChart(list) {
|
|||
myChart.resize();
|
||||
});
|
||||
}
|
||||
const value1 = ref(new Date())
|
||||
const value2 = ref(new Date())
|
||||
const value1 = ref(new Date());
|
||||
const value2 = ref(new Date());
|
||||
|
||||
// 保养计划接口
|
||||
function maintenancePlan() {
|
||||
let params = {
|
||||
year:value2.value.getFullYear(),
|
||||
status:false
|
||||
}
|
||||
year: value2.value.getFullYear(),
|
||||
status: false,
|
||||
};
|
||||
countKeepRecord(params).then((res) => {
|
||||
drawRightChart(res.result);
|
||||
});
|
||||
}
|
||||
// 已完成维保计划接口
|
||||
function completedMaintenancePlan(){
|
||||
function completedMaintenancePlan() {
|
||||
let params = {
|
||||
year:value1.value.getFullYear(),
|
||||
status:true
|
||||
}
|
||||
year: value1.value.getFullYear(),
|
||||
status: true,
|
||||
};
|
||||
countKeepRecord(params).then((res) => {
|
||||
drawLeftChart(res.result);
|
||||
});
|
||||
}
|
||||
|
||||
const planParams = reactive({
|
||||
pageIndex:1,
|
||||
pageSize:3,
|
||||
facName:''
|
||||
})
|
||||
const total = ref(0)
|
||||
pageIndex: 1,
|
||||
pageSize: 3,
|
||||
facName: "",
|
||||
});
|
||||
const total = ref(0);
|
||||
// 维护计划接口
|
||||
function getMaintenancePlanData(){
|
||||
getMaintenancePlan(planParams).then(res=>{
|
||||
total.value = res.result.totalNum
|
||||
tableList.value = res.result.data
|
||||
})
|
||||
function getMaintenancePlanData() {
|
||||
getMaintenancePlan(planParams).then((res) => {
|
||||
total.value = res.result.totalNum;
|
||||
tableList.value = res.result.data;
|
||||
});
|
||||
}
|
||||
|
||||
const allName = ref([])
|
||||
const allName = ref([]);
|
||||
// 获取所有设备名称
|
||||
function getAllDeviceNames() {
|
||||
allDeviceNames().then((res) => {
|
||||
|
|
@ -508,11 +519,11 @@ function getAllDeviceNames() {
|
|||
onMounted(() => {
|
||||
maintenancePlan();
|
||||
|
||||
completedMaintenancePlan()
|
||||
completedMaintenancePlan();
|
||||
|
||||
getMaintenancePlanData()
|
||||
getMaintenancePlanData();
|
||||
|
||||
getAllDeviceNames()
|
||||
getAllDeviceNames();
|
||||
// drawRightChart();
|
||||
});
|
||||
</script>
|
||||
|
|
@ -700,7 +711,7 @@ onMounted(() => {
|
|||
position: absolute;
|
||||
left: vw(40) !important;
|
||||
}
|
||||
:deep(.el-input__inner){
|
||||
:deep(.el-input__inner) {
|
||||
color: #fff;
|
||||
}
|
||||
:deep(.el-input__wrapper) {
|
||||
|
|
@ -719,8 +730,8 @@ onMounted(() => {
|
|||
)
|
||||
1 1;
|
||||
}
|
||||
:deep(.el-input){
|
||||
:deep(.el-input) {
|
||||
width: vw(160);
|
||||
height: vh(28);
|
||||
height: vh(28);
|
||||
}
|
||||
</style>
|
||||
|
|
@ -12,17 +12,23 @@
|
|||
<li
|
||||
v-for="(item, index) in deviceList"
|
||||
:key="index"
|
||||
@click="toggleHandle(index)"
|
||||
@click="toggleHandle(index,item)"
|
||||
:class="liIndex === index ? 'device-select' : ''"
|
||||
>
|
||||
{{ item }}
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="box-content-middle">
|
||||
<div class="unity">
|
||||
<iframe src="Hoister/index.html" frameborder="0" id="unityModule"></iframe>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="box-content-msg">
|
||||
<div class="box-content-top">
|
||||
<div class="btn1"></div>
|
||||
<div class="btn2"></div>
|
||||
<div @click="openmodel" :class="openShow === true ? 'btn1' : 'btn11'"></div>
|
||||
<div @click="closemodel" :class="closeShow === true ? 'btn22' : 'btn2'"></div>
|
||||
</div>
|
||||
<div class="box-content-bottom">
|
||||
<div class="name">
|
||||
|
|
@ -30,7 +36,7 @@
|
|||
设备名称:
|
||||
</span>
|
||||
<span>
|
||||
穿梭车
|
||||
{{ changeName }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -41,18 +47,48 @@
|
|||
</template>
|
||||
<script setup>
|
||||
import { ref } from "vue";
|
||||
const deviceList = ref(["穿梭车", "TW4", "TW3", "快换电池"]);
|
||||
// const deviceList = ref(["穿梭车", "TW4", "TW3", "快换电池"]);
|
||||
const deviceList = ref(["穿梭车", "提升机"])
|
||||
const liIndex = ref(0);
|
||||
|
||||
const openShow= ref(false);
|
||||
const closeShow= ref(false);
|
||||
const emit = defineEmits(['closeExplosion'])
|
||||
|
||||
function toggleHandle(index) {
|
||||
const changeName = ref("穿梭车");
|
||||
function toggleHandle(index,item) {
|
||||
console.log("item",item)
|
||||
changeName.value = item
|
||||
liIndex.value = index;
|
||||
if(item==="穿梭车"){
|
||||
document.getElementById("unityModule").contentWindow.changeModel('小车');
|
||||
}else{
|
||||
document.getElementById("unityModule").contentWindow.changeModel('提升机');
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function close(){
|
||||
emit('closeExplosion',-1)
|
||||
}
|
||||
function openmodel(){
|
||||
openShow.value = true
|
||||
closeShow.value = false
|
||||
if(changeName.value==="穿梭车"){
|
||||
document.getElementById("unityModule").contentWindow.opencar();
|
||||
}else if(changeName.value==="提升机"){
|
||||
document.getElementById("unityModule").contentWindow.open();
|
||||
}
|
||||
|
||||
}
|
||||
function closemodel(){
|
||||
openShow.value = false
|
||||
closeShow.value = true
|
||||
if(changeName.value==="穿梭车"){
|
||||
document.getElementById("unityModule").contentWindow.closecar();
|
||||
}else if(changeName.value==="提升机"){
|
||||
document.getElementById("unityModule").contentWindow.close();
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.box {
|
||||
|
|
@ -105,6 +141,20 @@ function close(){
|
|||
}
|
||||
}
|
||||
}
|
||||
&-middle{
|
||||
width: vw(660);
|
||||
margin-left: vw(-100);
|
||||
// border: 1px solid greenyellow;
|
||||
.unity {
|
||||
width: 115%;
|
||||
height: 94%;
|
||||
// position: fixed;
|
||||
iframe {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
&-msg{
|
||||
width: vw(340);
|
||||
}
|
||||
|
|
@ -112,7 +162,7 @@ function close(){
|
|||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: vh(16);
|
||||
.btn1,.btn2{
|
||||
.btn1,.btn2,.btn11,.btn22{
|
||||
width: vw(160);
|
||||
height: vh(44);
|
||||
background-size: 100% 100%;
|
||||
|
|
@ -121,9 +171,15 @@ function close(){
|
|||
.btn1{
|
||||
background-image: url('@/assets/images/dialog/explosion-btn1-select.png');
|
||||
}
|
||||
.btn11{
|
||||
background-image: url('@/assets/images/dialog/explosion-btn11-select.png');
|
||||
}
|
||||
.btn2{
|
||||
background-image: url('@/assets/images/dialog/explosion-btn2-default.png');
|
||||
}
|
||||
.btn22{
|
||||
background-image: url('@/assets/images/dialog/explosion-btn22-default.png');
|
||||
}
|
||||
}
|
||||
&-bottom{
|
||||
width: vw(340);
|
||||
|
|
|
|||
|
|
@ -7,64 +7,274 @@
|
|||
<div class="box-btn" @click="close"></div>
|
||||
</div>
|
||||
<div class="box-content">
|
||||
<div class="box-content-left-title">
|
||||
<span>文件列表</span>
|
||||
</div>
|
||||
<!-- 选择框 -->
|
||||
<div class="box-content-right-select">
|
||||
<el-select
|
||||
@clear="clearHandle"
|
||||
@change="
|
||||
GetPageGuideDocsData(params1.code);
|
||||
"
|
||||
clearable
|
||||
v-model="params1.code"
|
||||
placeholder="请选择"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in allName"
|
||||
:key="item.showName"
|
||||
:label="item.showName"
|
||||
:value="item.realCode"
|
||||
/>
|
||||
</el-select>
|
||||
|
||||
</div>
|
||||
<ul>
|
||||
<li v-for="(item, index) in fileList" :key="'file' + index">
|
||||
<span>
|
||||
{{ item.name }}
|
||||
{{ item.fileName }}
|
||||
</span>
|
||||
<span>
|
||||
<span class="preview">预览</span>
|
||||
<span class="download">下载</span>
|
||||
<!-- <span class="preview">预览</span>
|
||||
<span class="download">下载</span> -->
|
||||
<el-button
|
||||
type="text"
|
||||
class="preview"
|
||||
@click="previewFile(item.filePath)"
|
||||
>预览</el-button
|
||||
>
|
||||
<el-button
|
||||
type="text"
|
||||
class="download"
|
||||
@click="down(item.filePath)"
|
||||
>下载</el-button
|
||||
>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <el-dialog
|
||||
:visible.sync="dialogVisible4"
|
||||
title="PDF预览"
|
||||
width="70%"
|
||||
append-to-body
|
||||
top
|
||||
>
|
||||
<div id="container">
|
||||
<div class="right-btn">
|
||||
<div @click="changePage('first')" class="turn">首页</div>
|
||||
<div style="width: 100%">
|
||||
<el-button
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
circle
|
||||
@click="zoomPDF('plus')"
|
||||
></el-button>
|
||||
<el-button
|
||||
plain
|
||||
icon="el-icon-minus"
|
||||
circle
|
||||
@click="zoomPDF('minus')"
|
||||
></el-button>
|
||||
<el-button
|
||||
plain
|
||||
icon="el-icon-refresh-right"
|
||||
circle
|
||||
@click="clock()"
|
||||
></el-button>
|
||||
<el-button
|
||||
plain
|
||||
icon="el-icon-refresh-left"
|
||||
circle
|
||||
@click="counterClock()"
|
||||
></el-button>
|
||||
</div>
|
||||
<div style="width: 100%">
|
||||
<el-button size="mini" @click="changePage(0)" round
|
||||
>上一页</el-button
|
||||
>
|
||||
<el-button size="mini" @click="changePage(1)" round
|
||||
>下一页</el-button
|
||||
>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="pageNum">
|
||||
<input
|
||||
v-model.number="currentPage"
|
||||
type="number"
|
||||
class="inputNumber"
|
||||
@input="inputEvent()"
|
||||
/>
|
||||
/ {{ pageCount }}
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div @click="changePage('last')" class="turn">尾页</div>
|
||||
</div>
|
||||
<div
|
||||
class="pdfArea"
|
||||
:style="{
|
||||
width: pdfWidth + '%',
|
||||
marginLeft: pdfLeft + '%',
|
||||
marginTop: pdfTop + '%',
|
||||
marginBottom: pdfBottom + '%',
|
||||
}"
|
||||
style="transition: all 0.3s"
|
||||
>
|
||||
<pdf
|
||||
:src="src"
|
||||
ref="pdf"
|
||||
v-show="loadedRatio === 1"
|
||||
:page="currentPage"
|
||||
@loaded="loadPdf"
|
||||
@num-pages="pageCount = $event"
|
||||
@progress="loadedRatio = $event"
|
||||
@page-loaded="currentPage = $event"
|
||||
@link-clicked="currentPage = $event"
|
||||
style="display: inline-block; width: 100%"
|
||||
id="pdfID"
|
||||
:rotate="pageRotate"
|
||||
></pdf>
|
||||
<div class="progress" v-if="loadedRatio != 1">
|
||||
<el-progress
|
||||
type="circle"
|
||||
:width="70"
|
||||
color="#53a7ff"
|
||||
:percentage="
|
||||
Math.floor(loadedRatio * 100)
|
||||
? Math.floor(loadedRatio * 100)
|
||||
: 0
|
||||
"
|
||||
></el-progress>
|
||||
<br />
|
||||
|
||||
<span>{{ remindShow }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog> -->
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref } from "vue";
|
||||
import {
|
||||
getDocsIdentity,GetPageGuideDocs
|
||||
} from "@/api/equipmentManagement/index";
|
||||
import { onMounted} from "vue";
|
||||
const emit = defineEmits(["closeGuidance"]);
|
||||
const fileList = ref([
|
||||
|
||||
{
|
||||
name: "CN12升降输送机说明书",
|
||||
},
|
||||
{
|
||||
name: "ABRC01型快换电池及电池充电系统使用说明书",
|
||||
},
|
||||
{
|
||||
name: "CN12升降输送机说明书",
|
||||
},
|
||||
{
|
||||
name: "ABRC01型快换电池及电池充电系统使用说明书",
|
||||
},
|
||||
{
|
||||
name: "CN12升降输送机说明书",
|
||||
},
|
||||
{
|
||||
name: "ABRC01型快换电池及电池充电系统使用说明书",
|
||||
},
|
||||
{
|
||||
name: "CN12升降输送机说明书",
|
||||
},
|
||||
{
|
||||
name: "ABRC01型快换电池及电池充电系统使用说明书",
|
||||
},
|
||||
{
|
||||
name: "CN12升降输送机说明书",
|
||||
},
|
||||
{
|
||||
name: "ABRC01型快换电池及电池充电系统使用说明书",
|
||||
},
|
||||
{
|
||||
name: "CN12升降输送机说明书",
|
||||
},
|
||||
]);
|
||||
|
||||
const allName = ref([]);
|
||||
const fileList = ref([]);
|
||||
//获取指导文件下拉数据
|
||||
function getDocsIdentityData(){
|
||||
|
||||
getDocsIdentity().then(res=>{
|
||||
allName.value = res.result
|
||||
})
|
||||
}
|
||||
const equipmentCode = ref('')
|
||||
const params1 = {
|
||||
code:'',
|
||||
pageIndex:1,
|
||||
pageSize:4
|
||||
}
|
||||
function zoomPDF(method) {
|
||||
const _this = this;
|
||||
if (method === "plus") {
|
||||
if (pdfWidth === 150) {
|
||||
// $message({
|
||||
// showClose: true,
|
||||
// message: "已放大至：100%",
|
||||
// type: "info",
|
||||
// });
|
||||
} else {
|
||||
pdfWidth = pdfWidth + 10;
|
||||
pdfLeft = (100 - pdfWidth) / 2;
|
||||
}
|
||||
}
|
||||
if (method === "minus") {
|
||||
if (pdfWidth === 10) {
|
||||
// $message({
|
||||
// showClose: true,
|
||||
// message: "已缩小至：10%，不可再缩小。",
|
||||
// type: "info",
|
||||
// });
|
||||
} else {
|
||||
pdfWidth = pdfWidth - 10;
|
||||
pdfLeft = (100 - pdfWidth) / 2;
|
||||
}
|
||||
}
|
||||
}
|
||||
// 顺时针
|
||||
function clock() {
|
||||
pageRotate += 90;
|
||||
}
|
||||
// 逆时针
|
||||
function counterClock() {
|
||||
pageRotate -= 90;
|
||||
}
|
||||
function down(url) {
|
||||
window.open(url);
|
||||
}
|
||||
// 翻页
|
||||
function changePage(val) {
|
||||
if (val === 0 && currentPage > 1) {
|
||||
currentPage--;
|
||||
}
|
||||
if (val === 1 && currentPage < pageCount) {
|
||||
currentPage++;
|
||||
} else if (val === "first") {
|
||||
currentPage = 1;
|
||||
toTop();
|
||||
} else if (val === "last" && currentPage < pageCount) {
|
||||
currentPage = pageCount;
|
||||
toTop();
|
||||
}
|
||||
}
|
||||
// pdf加载时
|
||||
function loadPdf() {
|
||||
currentPage = 1; // 加载的时候先加载第一页
|
||||
loadedRatio = 1;
|
||||
}
|
||||
// 输入页码时校验
|
||||
function inputEvent() {
|
||||
if (currentPage > pageCount) {
|
||||
// 1. 大于max
|
||||
currentPage = pageCount;
|
||||
} else if (currentPage < 1) {
|
||||
// 2. 小于min
|
||||
currentPage = 1;
|
||||
}
|
||||
}
|
||||
function toTop() {
|
||||
document.getElementById("container").scrollTop = 0;
|
||||
}
|
||||
// 获取指导文件数据
|
||||
function GetPageGuideDocsData(item){
|
||||
// console.log("item",item)
|
||||
// if(item){
|
||||
// // params1.code = item.showName
|
||||
// }
|
||||
GetPageGuideDocs(params1).then(res=>{
|
||||
fileList.value = res.result.data
|
||||
for (var i = 0; i < fileList.value.length; i++) {
|
||||
fileList.value[i].filePath =
|
||||
`http://192.168.55.13:5002` + fileList.value[i].filePath;
|
||||
}
|
||||
|
||||
})
|
||||
}
|
||||
function close() {
|
||||
emit("closeGuidance", -1);
|
||||
}
|
||||
onMounted(() => {
|
||||
getDocsIdentityData()
|
||||
GetPageGuideDocsData()
|
||||
// getPageDamageEquipList()
|
||||
});
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.box {
|
||||
|
|
@ -124,6 +334,43 @@ function close() {
|
|||
width: vw(1088);
|
||||
padding: vh(20) vw(20);
|
||||
box-sizing: border-box;
|
||||
&-left {
|
||||
padding: vh(20) vw(20);
|
||||
box-sizing: border-box;
|
||||
height: 100%;
|
||||
border: 1px solid;
|
||||
border-image: linear-gradient(
|
||||
180deg,
|
||||
rgba(144, 218, 255, 0.5),
|
||||
rgba(144, 218, 255, 0.1000000015)
|
||||
)
|
||||
1 1;
|
||||
&-title {
|
||||
width: 65%;
|
||||
height: vh(36);
|
||||
padding-left: vw(32);
|
||||
line-height: vh(36);
|
||||
box-sizing: border-box;
|
||||
background-size: 100% 100%;
|
||||
background-image: url("@/assets/images/dialog/deviceInfo-title1.png");
|
||||
display: inline-block;
|
||||
span {
|
||||
font-size: 1.375rem;
|
||||
font-family: "pangmen";
|
||||
}
|
||||
}
|
||||
}
|
||||
&-right {
|
||||
width: vw(480);
|
||||
&-select {
|
||||
margin: vh(12) 0;
|
||||
justify-content: space-between;
|
||||
display: inline-block;
|
||||
}
|
||||
&-table {
|
||||
height: vh(440);
|
||||
}
|
||||
}
|
||||
ul {
|
||||
|
||||
li {
|
||||
|
|
|
|||
|
|
@ -8,8 +8,24 @@
|
|||
<div class="box-content">
|
||||
<div class="box-content-left">
|
||||
<div class="box-content-select">
|
||||
<el-select v-model="value" clearable placeholder="请选择设备">
|
||||
<!-- <el-select v-model="value" clearable placeholder="请选择设备">
|
||||
<el-option>11</el-option>
|
||||
</el-select> -->
|
||||
<el-select
|
||||
@clear="clearHandle"
|
||||
@change="
|
||||
GetPageGuideDocsData(params1.code);
|
||||
"
|
||||
clearable
|
||||
v-model="params1.code"
|
||||
placeholder="请选择"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in allName"
|
||||
:key="item.showName"
|
||||
:label="item.showName"
|
||||
:value="item.realCode"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="box-content-table">
|
||||
|
|
@ -19,32 +35,105 @@
|
|||
style="width: 100%"
|
||||
@row-click="rowClick"
|
||||
>
|
||||
<el-table-column prop="code" label="序号" />
|
||||
<el-table-column prop="name" label="名称" />
|
||||
<el-table-column prop="deviceCode" label="序号" />
|
||||
<el-table-column prop="deviceName" label="名称" />
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-content-right">
|
||||
<div class="bg"></div>
|
||||
<div class="bg">
|
||||
<video-player
|
||||
class="video-player vjs-custom-skin"
|
||||
style="height: 500px; width: 500px"
|
||||
ref="VideoPlayer1"
|
||||
:playsinline="true"
|
||||
:options="playerOptions"
|
||||
>
|
||||
</video-player>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
<script setup name="knowledgeBase">
|
||||
import VideoPlayer from 'vue-video-player';
|
||||
import 'video.js/dist/video-js.css';
|
||||
import 'vue-video-player/src/custom-theme.css';
|
||||
import { ref } from "vue";
|
||||
import {
|
||||
GetVideosIdentity,GetPageGuideVideos
|
||||
} from "@/api/equipmentManagement/index";
|
||||
|
||||
import { onMounted} from "vue";
|
||||
const value = ref('')
|
||||
const emit = defineEmits(["closeKnowledgeBase"]);
|
||||
function close() {
|
||||
emit("closeKnowledgeBase", -1);
|
||||
}
|
||||
|
||||
const VideoPlayer1 = ref()
|
||||
const tableList = ref([
|
||||
{
|
||||
name:'智能双向穿梭车',
|
||||
code:1
|
||||
}
|
||||
|
||||
])
|
||||
// const videoUrl = ref("")
|
||||
// 视频控制设置
|
||||
const playerOptions= {
|
||||
height: 500,
|
||||
width: 500,
|
||||
playbackRates: [0.5, 1.0, 1.5, 2, 3], // 可选的播放速度
|
||||
autoplay: false, // 如果为true,浏览器准备好时开始回放。
|
||||
muted: false, // 默认情况下将会消除任何音频。
|
||||
loop: false, // 是否视频一结束就重新开始。
|
||||
preload: "auto", // 建议浏览器在<video>加载元素后是否应该开始下载视频数据。auto浏览器选择最佳行为,立即开始加载视频（如果浏览器支持）
|
||||
language: "zh-CN",
|
||||
aspectRatio: "16:9", // 将播放器置于流畅模式，并在计算播放器的动态大小时使用该值。值应该代表一个比例 - 用冒号分隔的两个数字（例如"16:9"或"4:3"）
|
||||
fluid: true, // 当true时，Video.js player将拥有流体大小。换句话说，它将按比例缩放以适应其容器。
|
||||
sources: [
|
||||
{
|
||||
type: "video/mp4", // 类型
|
||||
src: "", // url地址
|
||||
},
|
||||
],
|
||||
poster: "", // 封面地址
|
||||
notSupportedMessage: "此视频暂无法播放，请稍后再试", // 允许覆盖Video.js无法播放媒体源时显示的默认信息。
|
||||
controlBar: {
|
||||
timeDivider: true, // 当前时间和持续时间的分隔符
|
||||
durationDisplay: true, // 显示持续时间
|
||||
remainingTimeDisplay: true, // 是否显示剩余时间功能
|
||||
fullscreenToggle: true, // 是否显示全屏按钮
|
||||
},
|
||||
}
|
||||
const allName = ref([]);
|
||||
//获取知识库下拉数据
|
||||
function getVideosIdentityData(){
|
||||
|
||||
GetVideosIdentity().then(res=>{
|
||||
allName.value = res.result
|
||||
})
|
||||
}
|
||||
function rowClick(row) {
|
||||
console.log("rowClick",row)
|
||||
// playerOptions.sources[0].src =
|
||||
// // "http://220.163.114.158:5001/" + row.path.substring(1);
|
||||
// "http://192.168.55.13:5002/" + row.path.substring(1);
|
||||
}
|
||||
const equipmentCode = ref('')
|
||||
const params1 = {
|
||||
code:'',
|
||||
pageIndex:1,
|
||||
pageSize:4
|
||||
}
|
||||
// 获取知识库数据
|
||||
function getPageGuideVideosData(item){
|
||||
GetPageGuideVideos(params1).then(res=>{
|
||||
tableList.value = res.result.data
|
||||
})
|
||||
}
|
||||
onMounted(() => {
|
||||
getVideosIdentityData()
|
||||
getPageGuideVideosData()
|
||||
});
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.box {
|
||||
|
|
@ -103,11 +192,18 @@ const tableList = ref([
|
|||
height: vh(616);
|
||||
background-size: 100% 100%;
|
||||
background-image: url("@/assets/images/dialog/knowledgeBase-right.png");
|
||||
.video-js.vjs-fluid,
|
||||
.video-js.vjs-16-9,
|
||||
.video-js.vjs-4-3 {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
}
|
||||
.bg {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-image: url("@/assets/images/dialog/knowledgeBase-img.png");
|
||||
background-size: 100% 100%;
|
||||
// background-image: url("@/assets/images/dialog/knowledgeBase-img.png");
|
||||
// background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,4 +5,5 @@ import ElementPlus from 'element-plus'
|
|||
import 'element-plus/dist/index.css'
|
||||
import zhCn from 'element-plus/es/locale/lang/zh-cn'
|
||||
import router from "./router/router.js"
|
||||
|
||||
createApp(App).use(ElementPlus,{locale:zhCn}).use(router).mount('#app')
|
||||
|
|
|
|||
|
|
@ -210,13 +210,13 @@ const deviceList = ref([
|
|||
{
|
||||
deviceStatus: "运行设备",
|
||||
deviceNum: 1889,
|
||||
deviceImg: getPath.operatingEquipment,
|
||||
deviceImg: getPath.operatingEquipment1,
|
||||
color: "color:rgba(164, 255, 236, 1)",
|
||||
},
|
||||
{
|
||||
deviceStatus: "设备故障",
|
||||
deviceNum: 26,
|
||||
deviceImg: getPath.equipmentFailure,
|
||||
deviceImg: getPath.equipmentFailure1,
|
||||
color: "color:rgba(255, 244, 166, 1)",
|
||||
},
|
||||
]);
|
||||
|
|
@ -758,7 +758,6 @@ onMounted(() => {
|
|||
.home {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
background-size: 100% 100%;
|
||||
background-image: url("@/assets/images/home/home-bg.png");
|
||||
padding: vh(104) vw(20) 0 vw(20);
|
||||
|
|
@ -798,6 +797,9 @@ onMounted(() => {
|
|||
width: vw(368);
|
||||
}
|
||||
&-left {
|
||||
background-image: url("@/assets/images/home/左侧遮罩.png");
|
||||
background-size: 101%;
|
||||
// width: 22%;
|
||||
&-device {
|
||||
display: flex;
|
||||
height: vh(186);
|
||||
|
|
@ -881,6 +883,7 @@ onMounted(() => {
|
|||
}
|
||||
}
|
||||
&-right {
|
||||
background-image: url("@/assets/images/home/right-bg.png");
|
||||
&-inventoryNews {
|
||||
height: vh(222);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
import { defineConfig } from 'vite'
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
|
||||
import path from "path";
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
|
|
|
|||
Loading…
Reference in New Issue