From c377d90fe2a01c2118f6c69c3c177f75be7c318b Mon Sep 17 00:00:00 2001
From: wangfei <3597712270@qq.com>
Date: 星期五, 29 十一月 2024 15:20:51 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'
---
UI-Project/src/views/largescreen/largescreen.vue | 227 ++++++++++++++++++++++++++++++++++----------------------
1 files changed, 138 insertions(+), 89 deletions(-)
diff --git a/UI-Project/src/views/largescreen/largescreen.vue b/UI-Project/src/views/largescreen/largescreen.vue
index 82bf8db..3f105fa 100644
--- a/UI-Project/src/views/largescreen/largescreen.vue
+++ b/UI-Project/src/views/largescreen/largescreen.vue
@@ -1,30 +1,16 @@
-<template>
- <el-card style="flex: 1;margin-left: 1px;margin-top: 10px;margin-right: 1px;" v-loading="loading">
- <el-scrollbar height="800px">
-<div id="top" style="height: 150px;display: flex;">
- <div class="echarts-container">
- <div v-for="(processData, index) in processesData" :key="index" class="echarts-item">
- <div :id="'pieChart_' + index" class="pie-chart"></div>
- </div>
-</div>
-</div>
-<div style="display: flex;">
-<!-- <div id="centerleft" style="margin-top: 10px;height: 240px;width: 340px;background-color: #911005;">
- <el-table height="240" ref="table" width="340px"
- @selection-change="handleSelectionChange"
- :data="tableData" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}">
- <el-table-column fixed prop="orderId" align="center" :label="$t('large.number')" min-width="110" />
- <el-table-column prop="project" align="center" :label="$t('large.projectname')" min-width="100" />
- <el-table-column prop="responsibleProcess" align="center" :label="$t('large.responsibleprocess')" min-width="100" />
- <el-table-column prop="breakageQuantity" align="center" :label="$t('large.numberfractions')" min-width="110" />
- <el-table-column prop="patchProcesses" align="center" :label="$t('large.process')" min-width="100" />
- <el-table-column fixed="right" :label="$t('large.operate')" align="center" width="100">
- <template #default="scope">
- <el-button size="mini" type="text" plain @click="handleBinda">{{ $t('large.mes') }}</el-button>
- </template>
- </el-table-column>
- </el-table>
-</div> -->
+<template>
+ <div style="height: 500px;">
+ <el-card style="flex: 1;margin-left: 1px;margin-top: 10px;margin-right: 1px;" v-loading="loading">
+ <el-scrollbar height="800px">
+ <div style="font-size: 20px;font-weight: bold;">{{ $t('large.loading') }}{{ temperingtotal }}</div>
+ <div id="top" style="height: 150px;display: flex; justify-content: center; align-items: center;">
+ <div class="echarts-container">
+ <div v-for="(processData, index) in processesData" :key="index" class="echarts-item" @click="showDialog">
+ <div :id="'pieChart_' + index" class="pie-chart"></div>
+ </div>
+ </div>
+ </div>
+ <div style="display: flex;">
<div class="parter" style="margin-top: 10px;margin-left: 150px; height: 240px;width: 1000px;">
<img src="../../assets/dpxsa.png" style="margin-left: -10px; width: 100%;height: 100%;" alt="Your Image">
<div class="moving-rect lipiana" v-show="woshia"></div>
@@ -34,7 +20,6 @@
<div class="moving-rect overlaya" v-show="flake"></div>
<div class="moving-rect overlayb" v-show="flakeb"></div>
<div class="moving-rect overlayc" v-show="flakec"></div>
- <div class="moving-rect overlayd" v-show="flaked"></div>
<div class="moving-rect longa" v-show="dalipiana"></div>
<div class="moving-rect longb" v-show="dalipianb"></div>
<div class="moving-rect shangpianji" v-show="shangpian"></div>
@@ -46,32 +31,9 @@
<div class="moving-rect xiapianji5" v-show="xiapian5"></div>
<div class="moving-rect xiapianji6" v-show="xiapian6"></div>
</div>
-<!-- <div class="parter" style="margin-top: 10px;margin-left: 150px; height: 240px;width: 1000px;">
- <img src="../../assets/dpxsa.png" style="margin-left: -10px; width: 100%;height: 100%;" alt="Your Image">
- <div class="moving-rect vertical"></div>
- <div class="moving-rect all"></div>
- <div class="moving-rect horizontal"></div>
- <div class="moving-rect xiao"></div>
- <div class="moving-rect zhan"></div>
- <div class="moving-rect tu"></div>
- <div class="moving-rect zi"></div>
- <div class="moving-rect xia"></div>
- <div class="moving-rect zan"></div>
- <div class="moving-rect fa"></div>
- <div class="moving-rect hua"></div>
- <div class="moving-rect shui"></div>
-</div> -->
-<!-- <div id="centerright" style="margin-top: 10px;margin-left: 10px; height: 240px;width: 240px;background-color: #911005;">
- <el-table height="240" ref="table" width="340px"
- @selection-change="handleSelectionChange"
- :data="tableDatab" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}">
- <el-table-column prop="projectNo" align="center" :label="$t('large.projectnumber')" min-width="50" />
- <el-table-column prop="projectName" align="center" :label="$t('large.projectname')" min-width="50" />
- </el-table>
-</div> -->
</div>
<div id="bottom" style="margin-top: 10px;height: 190px;">
-<el-table height="390" ref="table"
+<el-table height="350" ref="table"
@selection-change="handleSelectionChange"
:data="tableDatac" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}">
<el-table-column prop="orderId" align="center" :label="$t('large.orderId')" min-width="50" />
@@ -102,7 +64,7 @@
</el-scrollbar>
</el-card>
<el-dialog v-model="blinda" top="5vh" width="85%">
- <el-table height="400" ref="table"
+ <el-table height="650" ref="table"
@selection-change="handleSelectionChange"
:data="tableData" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}">
<el-table-column prop="orderId" fixed align="center" :label="$t('large.orderId')" min-width="110" />
@@ -142,26 +104,42 @@
</div>
</template>
</el-dialog>
-</template>
-<script setup>
-import { Delete, Upload } from '@element-plus/icons-vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { ref, onMounted , onBeforeUnmount, reactive, computed, shallowRef, onUnmounted, watchEffect } from "vue";
+<el-dialog v-model="blind" top="10vh" width="70%" >
+ <el-date-picker style="margin-left: 1px;" v-model="timeRange" type="daterange" format="YYYY/MM/DD" value-format="YYYY-MM-DD"
+ :start-placeholder="$t('large.starttime')" :end-placeholder="$t('large.endtime')"
+ :default-time="defaultTime"/>
+ <el-button type="primary" style="margin-left: 10px;margin-top: -6px;" @click="selectReportData()">
+ {{ $t('large.inquire') }}
+ </el-button>
+ <div style="height: 550px;display: flex;margin-top: 10px;justify-content: center; align-items: center;">
+ <div class="echarts-container">
+ <div v-for="(processData, index) in dialogprocesses" :key="index" class="echarts-item">
+ <div :id="'dialogPieChart_' + index" class="pie-chart"></div>
+ </div>
+ </div>
+ </div>
+</el-dialog>
+ </div>
+</template>
+<script setup>
+import {ElMessage} from 'element-plus'
+import {nextTick, onBeforeUnmount, onMounted, onUnmounted, ref} from "vue";
import request from "@/utils/request"
-import { WebSocketHost ,host} from '@/utils/constants'
-import { initializeWebSocket, closeWebSocket } from '@/utils/WebSocketService';
-import { useI18n } from 'vue-i18n'
-const { t } = useI18n()
+import {host, WebSocketHost} from '@/utils/constants'
+import {closeWebSocket, initializeWebSocket} from '@/utils/WebSocketService';
+import {useI18n} from 'vue-i18n'
import * as echarts from 'echarts';
+
+const {t} = useI18n()
const tableData = ref([])
const tableDatab = ref([])
const tableDatac = ref([])
-const adjustedRects = ref([]);
-const chartRefs = ref([]);
+const adjustedRects = ref([]);
+const chartRefs = ref([]);
+const timeRange = ref([])
const flake = ref(false)
const flakeb = ref(false)
const flakec = ref(false)
-const flaked = ref(false)
const woshia = ref(false)
const woshic = ref(false)
const dalipiana = ref(false)
@@ -174,7 +152,9 @@
const xiapian4 = ref(false)
const xiapian5 = ref(false)
const xiapian6 = ref(false)
-
+const blind = ref(false)
+const temperingtotal = ref(0)
+
const thisProcess = ref(); // 鐢ㄤ簬瀛樺偍process_id鐨勫搷搴斿紡寮曠敤
// 瀹氫箟涓�涓搷搴斿紡寮曠敤鏉ュ瓨鍌ㄥ浘琛ㄥ疄渚�
const chartDom = ref(null);
@@ -185,6 +165,7 @@
await fetchFlowCardId(row.orderId);
};
const processesData = ref([]);
+const dialogprocesses = ref([]);
const fetchFlowCardId = async (orderId) => {
try {
const response = await request.post('/loadGlass/order/order/selectOrderdetail',{
@@ -236,6 +217,8 @@
tableDatac.value = data.orders[0]
socket.onmessage = (event) => {
const data = JSON.parse(event.data);
+ console.log(data.device[0]);
+
processesData.value = data.device[0].map(rect => ({
...rect,
completedQuantity: rect.completedQuantity,
@@ -258,38 +241,36 @@
flake.value = tasks.some(task => task.state == 1);
flakeb.value = tasks.some(task => task.state == 2);
flakec.value = tasks.some(task => task.state == 3);
- flaked.value = tasks.some(task => task.state == 4);
};
// 鍗у紡鐞嗙墖
const socketUrl3 = `ws://${WebSocketHost}:${host}/api/cacheGlass/api/talk/cacheGlassIsRun`;
const handleMessage3 = (data) => {
- const tasks = data.taskCaches[0];
+ const tasks = data.taskCaches[0];
woshia.value = tasks.some(task => task.line == 2001);
woshic.value = tasks.some(task => task.line == 2002);
- console.log(tasks);
-
};
// 澶х悊鐗囩
const socketUrl4 = `ws://${WebSocketHost}:${host}/api/cacheVerticalGlass/api/talk/isRun`;
const handleMessage4 = (data) => {
- const tasks = data.bigStorageCageDetailsOutTask[0];
- const taskss = data.bigStorageCageDetailsFeedTask[0];
+ const tasks = data.bigStorageCageDetailsOutTask[0];
dalipiana.value = tasks.some(task => task.slot !== null && task.slot !== undefined);
+ const taskss = data.bigStorageCageDetailsFeedTask[0];
dalipianb.value = taskss.some(task => task.slot !== null && task.slot !== undefined);
};
// 涓婄墖
const socketUrl5 = `ws://${WebSocketHost}:${host}/api/loadGlass/api/talk/loadGlassIsRun`;
const handleMessage5 = (data) => {
- if(data.engineering.length !==0 ){
- shangpian.value = true;
-}
-};
+ const tasks = data.engineering;
+ shangpian.value = tasks.some(task => task.state == 1);
+ temperingtotal.value = data.engineering[0].engineerId
+ };
// 涓嬬墖
const socketUrl6 = `ws://${WebSocketHost}:${host}/api/unLoadGlass/api/talk/unLoadGlassIsRun`;
const handleMessage6 = (data) => {
const tasks = data.downWorkstation[0];
- if (tasks && tasks.length >= 6) {
- xiapian.value = tasks.some(task => task.racksNumber!== 0);
+ const tasks1 = data.downGlassTask[0];
+ xiapian.value = tasks1.some(task => task.thickness!== '');
+ if (tasks && tasks.length >= 6) {
xiapian1.value = tasks[0].racksNumber !== 0;
xiapian2.value = tasks[1].racksNumber !== 0;
xiapian3.value = tasks[2].racksNumber !== 0;
@@ -336,7 +317,49 @@
}
]
};
-
+
+ chart.setOption(options);
+});
+};
+const renderPieCharts1 = () => {
+dialogprocesses.value.forEach((data, index) => {
+ const chart = echarts.init(document.getElementById('dialogPieChart_' + index));
+ const options = {
+ title: {
+ text: `${data.thisProcess} `,
+ left: 'center',
+ },
+ tooltip: {
+ trigger: 'item',
+ },
+ series: [
+ {
+ name: `${data.thisProcess} `,
+ type: 'pie',
+ radius: ['40%', '70%'],
+ avoidLabelOverlap: false,
+ data: [
+ { value: data.completedQuantity, name: t('large.completedquantity') },
+ { value: data.breakageQuantity, name: t('large.scrapquantity') }
+ ],
+ emphasis: {
+ itemStyle: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: 'rgba(0, 0, 0, 0.5)'
+ }
+ },
+ label: {
+ show: false,
+ position: 'center',
+ },
+ labelLine: {
+ show: false
+ },
+ }
+ ]
+ };
+
chart.setOption(options);
});
};
@@ -377,8 +400,34 @@
closeWebSocket5();
closeWebSocket6();
});
-</script>
+function showDialog() {
+ blind.value = true;
+}
+// 鏌ヨ鏁版嵁
+const selectReportData = async () => {
+ const response = await request.post("/loadGlass/reporting_work/reporting-work/selectDamage", {
+ reportingWorkTime: timeRange.value[0],
+ reportingWorkTime2: timeRange.value[1],
+ })
+ if (response.code === 200) {
+ console.log(response.data);
+
+ dialogprocesses.value = response.data.map(rect => ({
+ ...rect,
+ completedQuantity: rect.completedQuantity,
+ breakageQuantity: rect.breakageQuantity,
+ thisProcess: rect.thisProcess,
+ }));
+ await nextTick();
+ renderPieCharts1();
+ ElMessage.success(response.message);
+ } else {
+ ElMessage.error(response.message);
+ }
+};
+</script>
+
<style scoped>
.echarts-container {
display: flex;
@@ -480,7 +529,7 @@
top: 9px;
left: 200px;
transform: translateX(-50%);
- animation: move-xiapianji 6s infinite;
+ animation: move-xiapianji 15s infinite;
}
@keyframes move-xiapianji {
0% {
@@ -497,7 +546,7 @@
top: 190px;
right: 530px;
transform: translateX(-50%);
- animation: move-lipiana 6s infinite;
+ animation: move-lipiana 15s infinite;
}
@keyframes move-lipiana {
0% {
@@ -514,7 +563,7 @@
top: 160px;
left: 502px;
transform: translateX(-50%);
- animation: move-lipianb 6s infinite;
+ animation: move-lipianb 15s infinite;
}
@keyframes move-lipianb {
0% {
@@ -531,7 +580,7 @@
top: 215px;
right: 490px;
transform: translateX(-50%);
- animation: move-lipianc 6s infinite;
+ animation: move-lipianc 15s infinite;
}
@keyframes move-lipianc {
0% {
@@ -548,7 +597,7 @@
top: 160px;
left: 555px;
transform: translateX(-50%);
- animation: move-lipiand 6s infinite;
+ animation: move-lipiand 15s infinite;
}
@keyframes move-lipiand {
0% {
@@ -565,7 +614,7 @@
top: 213px;
right: 800px;
transform: translateX(-50%);
- animation: move-overlaya 6s infinite;
+ animation: move-overlaya 15s infinite;
}
@keyframes move-overlaya {
0% {
@@ -582,7 +631,7 @@
top: 110px;
left: 13px;
transform: translateX(-50%);
- animation: move-overlayb 6s infinite;
+ animation: move-overlayb 15s infinite;
}
@keyframes move-overlayb {
0% {
@@ -599,7 +648,7 @@
top: 7px;
left: 13px;
transform: translateX(-50%);
- animation: move-overlayc 6s infinite;
+ animation: move-overlayc 15s infinite;
}
@keyframes move-overlayc {
0% {
@@ -616,7 +665,7 @@
top: 157px;
right: 90px;
transform: translateX(-50%);
- animation: move-shangpianji 6s infinite;
+ animation: move-shangpianji 15s infinite;
}
@keyframes move-shangpianji {
0% {
--
Gitblit v1.8.0