From dcf9c9e0410fe1186239e3f8d6f7bdc789c08010 Mon Sep 17 00:00:00 2001
From: lzhe <lzhe@example.com>
Date: 星期三, 05 六月 2024 18:00:39 +0800
Subject: [PATCH] 1
---
src/views/mdc/station-live.vue | 1060 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 1,043 insertions(+), 17 deletions(-)
diff --git a/src/views/mdc/station-live.vue b/src/views/mdc/station-live.vue
index 8cfa92b..acc9866 100644
--- a/src/views/mdc/station-live.vue
+++ b/src/views/mdc/station-live.vue
@@ -1,24 +1,1050 @@
<!--
- * @Date: 2024-04-09 22:11:21
- * @LastEditors: Sneed
- * @LastEditTime: 2024-04-13 22:15:47
- * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/mdc/station-live.vue
- 鐘舵�佸弽棣�
+ * @Author: lzhe lzhe@example.com
+ * @Date: 2024-03-26 10:28:33
+ * @LastEditors: lzhe lzhe@example.com
+ * @LastEditTime: 2024-06-05 11:37:17
+ * @FilePath: /smart-web/src/views/master/person/main/index.vue
+ * @Description: 杩欐槸榛樿璁剧疆,璇疯缃甡customMade`, 鎵撳紑koroFileHeader鏌ョ湅閰嶇疆 杩涜璁剧疆: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
- <el-main>
- <el-card shadow="never">
- 鏁堢巼鍒嗘瀽
- </el-card>
- </el-main>
+ <div class="aposcope-main">
+ <div class="aposcope-left">
+ <div class="left-title">鏌ヨ鏉′欢</div>
+ <el-tree :data="tableData" node-key="id" default-expand-all :expand-on-click-node="false" :props="defalutProps" @node-click="handleNodeClick" ref="treeRef" highlight-current />
+ </div>
+ <div class="aposcope-right">
+ <div class="content-machine-box">
+ <div class="content-machine-img"><img src="./station.png" alt=""></div>
+ <div class="content-machine-detail">
+ <div class="content-machine-name">{{stationForm.machineName}}</div>
+ <el-form :model="stationForm" ref="dialogForm" label-width="80px" label-position="center" style="width: 100%;">
+ <el-row>
+ <el-col :span="8">
+ <el-form-item label="宸ヤ綅缂栧彿">{{stationForm.code}}</el-form-item>
+ </el-col>
+ <el-col :span="8">
+ <el-form-item label="鏈哄櫒鍝佺墝">{{stationForm.machineBrand}}</el-form-item>
+ </el-col>
+ <el-col :span="8">
+ <el-form-item label="鏈哄櫒缂栧彿">{{stationForm.machineCode}}</el-form-item>
+ </el-col>
+ <el-col :span="8">
+ <el-form-item label="鏈哄櫒鍚嶇О">{{stationForm.machineName}}</el-form-item>
+ </el-col>
+ </el-row>
+ </el-form>
+ </div>
+ </div>
+ <div class="collect-info-panel">
+ <div class="fact-analysis-realtim">
+ <div class="wimi-empty" style="background-color: rgb(255, 255, 255);" v-if="dmpList.length == 0">
+ <!-- <div class="wimi-empty-img" style="width: 150px; height: 150px;">
+ <img src="./quesheng.bd026700.png" style="height: auto; width: 100%;">
+ </div> -->
+ <div class="empty-description">
+ <div>鏆傛棤鏁版嵁</div>
+ </div>
+ </div>
+ <div class="fact-analysis-card" v-for="item in dmpList" v-if="dmpList.length != 0">
+ <div class="card-name" :style="{'background-color': item.color}">{{item.description}}</div>
+ <div :class="{'card-value': true,'card-value-bg1':item.name != 'Alarm','card-value-bg2':item.name == 'Alarm'}">{{item.codeName}}</div>
+ </div>
+ </div>
+ </div>
+ <el-tabs type="border-card" class="demo-tabs">
+ <el-tab-pane label="宸ヤ綅鏁版嵁">
+ <div style="text-align: right;margin-bottom: 14px;">
+ <el-date-picker v-model="wcsDate" type="date" @change="wcschangedate" value-format="YYYY-MM-DD" size="small" />
+ </div>
+ <div class="wcs-main">
+ <div><div id="wcs-left" style="width: 100%;height:400px;"></div></div>
+ <div><div id="wcs-right" style="width: 100%;height:400px;"></div></div>
+ </div>
+ <div class="bottom-panel content-panel">
+ <div class="panel-title">鐝鐘舵�佽褰�</div>
+ <div class="panel-content bottom-panel-chart">
+ <div class="status">
+ <div class="feed-button" @click="table_edit">鐘舵�佸弽棣�</div>
+ <div class="status-wrap align-left">
+ <div class="collect-status">閲囬泦鐘舵��</div>
+ <div class="status-box" v-for="item in achievements"><div class="status-color" :style="{'background-color': item.color}"></div>{{ item.name }}</div>
+ </div>
+ <div class="status-wrap">
+ <el-checkbox v-model="checked1" label="浜哄伐鍙嶉鐘舵��" size="large" />
+ <div class="status-con">
+ <div class="status-box" v-for="item in collectionstatus"><div class="status-color" :style="{'background-color': item.color}"></div>{{ item.name }}</div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div style="padding: 8px;">
+ <div id="wcs-log" style="width: 100%;height:200px;"></div>
+ <el-table ref="multipleTableRef1" :data="recordData" border style="width: 100%;">
+ <el-table-column prop="shiftIndexName" label="鐝"></el-table-column>
+ <el-table-column prop="5" label="璋冭瘯"></el-table-column>
+ <el-table-column prop="4" label="绂荤嚎"></el-table-column>
+ <el-table-column prop="3" label="寰呮満"></el-table-column>
+ <el-table-column prop="1" label="鎶ヨ"></el-table-column>
+ <el-table-column prop="2" label="杩愯"></el-table-column>
+ <el-table-column prop="oee" label="绋煎姩鐜�%">
+ <template #default="scope">
+ <span>{{(Number(scope.row.oee) * 100).toFixed(2)}}</span>
+ </template>
+ </el-table-column>
+ <el-table-column prop="perdata" label="鎶ヨ鐜�%">
+ <template #default="scope">
+ <span>{{(Number(scope.row.fault) * 100).toFixed(2)}}</span>
+ </template>
+ </el-table-column>
+ </el-table>
+ </div>
+ </div>
+ </el-tab-pane>
+ <el-tab-pane label="鏈哄櫒灞ュ巻">
+ <div class="alarm-title">鎶ヨ淇℃伅灞ュ巻</div>
+ <el-table ref="multipleTableRef" :data="alarmtableData" border style="width: 100%" class="multipleTableRef">
+ <el-table-column prop="alarmCode" label="鎶ヨ浠ｇ爜"></el-table-column>
+ <el-table-column prop="alarmMsg" label="鎶ヨ淇℃伅"></el-table-column>
+ <el-table-column prop="alarmTime" label="鎶ヨ鏃堕棿"></el-table-column>
+ </el-table>
+ <el-pagination
+ style="margin-top: 12px;"
+ @size-change="alarmSizeChange"
+ @current-change="alarmCurrentChange"
+ :current-page="currentPage4"
+ :page-sizes="[15, 50, 100]"
+ :page-size="15"
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="alarmtotal">
+ </el-pagination>
+ </el-tab-pane>
+ </el-tabs>
+ </div>
+ </div>
+ <save-dialog v-if="dialog.save" ref="saveDialog" @success="addfeedbackSuccess" :workstationId="lastLevelId" @closed="dialog.save=false"></save-dialog>
</template>
-
<script>
- export default {
-
- }
+ import moment from 'moment'
+ import * as echarts from 'echarts';
+ import saveDialog from './add-station-status'
+ export default {
+ name: "state-feedback",
+ data(){
+ return {
+ achievements: [],
+ collectionstatus: [],
+ checked1: "",
+ alarmtotal: 0,
+ alarmtableData: [],
+ wcsDate: "",
+ wcsOptionL: {
+ title: {
+ text: '鐢ㄦ椂鍒嗗竷鎯呭喌',
+ left: 'left',
+ textStyle: {
+ fontSize:14
+ }
+ },
+ grid: {
+ top: 0,
+ },
+ tooltip: {
+ trigger: 'item',
+ //formatter: '{a} <br/>{b} : {c} ({d}%)'
+ formatter: '{a} {c}鍒嗛挓'
+ },
+ legend: {
+ orient: 'vertical',
+ bottom: 'bottom',
+ data: ['璋冭瘯', '绂荤嚎', '寰呮満', '鎶ュ憡', '鎶ヨ', '杩愯']
+ },
+ series: [
+ {
+ top: -30,
+ name: '鐢ㄦ椂:',
+ type: 'pie',
+ radius: '55%',
+ center: ['40%', '50%'],
+ data: [],
+ itemStyle: {
+ borderRadius: 10,
+ borderColor: '#fff',
+ borderWidth: 2
+ },
+ emphasis: {
+ itemStyle: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: 'rgba(0, 0, 0, 0.5)'
+ }
+ }
+ }
+ ]
+ },
+ wcsOptionR:{
+ title: {
+ text: '璁惧鏁堢巼',
+ left: 'left',
+ textStyle: {
+ fontSize:14
+ }
+ },
+ xAxis: {
+ max: '100'
+ },
+ yAxis: {
+ type: 'category',
+ data: ['杩愯鐜�', '鎶ヨ鐜�', '绋煎姩鐜�']
+ },
+ tooltip: {
+ trigger: 'item',
+ //formatter: '{a} <br/>{b} : {c} ({d}%)'
+ formatter: '{b} {c}%'
+ },
+ series: [
+ {
+ top: -30,
+ name: 'wcsR',
+ type: 'bar',
+ center: ['40%', '50%'],
+ data: [],
+ itemStyle: {
+ borderRadius: 8,
+ borderColor: '#fff',
+ borderWidth: 1
+ },
+ label: {
+ show: true,
+ position: 'right',
+ formatter: '{c}%',
+ valueAnimation: true
+ },
+ emphasis: {
+ itemStyle: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: 'rgba(0, 0, 0, 0.5)'
+ }
+ }
+ }
+ ],
+ legend: {
+ show: true, // 寮哄埗鏄剧ず鍥句緥
+ orient: 'vertical', // 鍥句緥鍒楄〃鐨勫竷灞�鏈濆悜锛屽彲閫夊�间负锛�'horizontal' 鎴� 'vertical'
+ left: 'left', // 鍥句緥缁勪欢绂诲鍣ㄥ乏渚х殑璺濈
+ top: 'top', // 鍥句緥缁勪欢绂诲鍣ㄤ笂渚х殑璺濈
+ data: ['杩愯鐜�', '鎶ヨ鐜�', '绋煎姩鐜�'] // 涓巗eries涓殑name瀵瑰簲锛岀敤浜庢樉绀哄浘渚嬪悕绉�
+ }
+ },
+ wcsOptionLog:{
+ grid: {
+ top: '0%'
+ },
+ xAxis: {
+ type: 'category',
+ data: [],
+ },
+ yAxis: {
+ type: 'category',
+ data: ['1', '2']
+ },
+ series: []
+ },
+ dmpList: [],
+ stationForm: {
+ code: "",
+ machineBrand: "",
+ machineCode: "",
+ machineName: ""
+ },
+ dialog: {
+ save: false
+ },
+ lastLevelId: "",
+ current: "1",
+ size: "15",
+ searchData: {
+ feedBackStatus: [],
+ date: [],
+ endDate: "",
+ startDate: ""
+ },
+ searchDataList: [], //鍙充晶鏁版嵁list
+ aList: [],
+ defalutProps: {
+ label: 'title',
+ children: 'children',
+ isLeaf: 'hasChildren',
+ disabled: 'disabled'
+ },
+ parentId: "0",
+ tableData: [],
+ searchSelection: [],
+ wcsBeginOption: {},
+ alarmsearchData: {
+ current: "1",
+ size: "15"
+ },
+ records: [],
+ recordData: [], // 鐝鐘舵�佽褰晅able
+ allwcs: []
+ }
+ },
+ created(){
+
+ },
+ mounted(){
+ this.newDate(); //鑾峰彇褰撳墠鏃ユ湡
+ this.getTreeList(this.$route.query.code);
+ },
+ components: {
+ saveDialog
+ },
+ methods: {
+ table_edit(){
+ this.dialog.save = true
+ this.$nextTick(() => {
+ this.$refs.saveDialog.open('edit').setData(this.lastLevelId);
+ })
+ },
+ alarmSizeChange(val) {
+ console.log(`姣忛〉 ${val} 鏉);
+ this.alarmsearchData.current = "1";
+ this.alarmsearchData.size = val;
+ this.alarmsearchBtn();
+ },
+ alarmCurrentChange(val) {
+ console.log(`褰撳墠椤�: ${val}`);
+ this.alarmsearchData.current = val;
+ this.alarmsearchBtn();
+ },
+ alarmsearchBtn() {
+ this.$HTTP.get(`/api/blade-mdc/work-station-analysis/alarm/${this.lastLevelId}?current=${this.alarmsearchData.current}&size=${this.alarmsearchData.size}`).then(res=> {
+ if(res.code == 200) {
+ this.alarmtableData = res.data.records;
+ this.alarmtotal = res.data.total;
+ }
+ })
+ },
+ wcschangedate(date) {
+ this.wcsDate = date;
+ this.getwscLvalue(); //宸︿晶鍥捐〃
+ this.getwcsR();
+ this.getrecord(); //鐝鐘舵�佽褰晅able
+ this.getlogcart(); //鐝鐘舵�佽褰昪hart
+ },
+ getrecord() { //鐝鐘舵�佽褰晅able
+ var obj = {
+ date: this.wcsDate,
+ humanFeedback: true,
+ workstationId: this.lastLevelId
+ }
+ this.$HTTP.post(`/api/blade-mdc/status-record/shift-index-status-record-table`,obj).then(res=> {
+ if(res.code == 200) {
+ var defaultValues = {
+ oee: 0,
+ fault: 0,
+ '1': "00:00:00",
+ '2': "00:00:00",
+ '3': "00:00:00",
+ '4': "00:00:00",
+ '5': "00:00:00"
+ };
+ res.data.forEach(item => {
+ Object.keys(defaultValues).forEach(key => {
+ if (!item[key]) {
+ item[key] = defaultValues[key];
+ }
+ });
+ });
+ this.recordData = res.data;
+ }
+ })
+ },
+ renderItem(params, api) {
+ var categoryIndex = api.value(0);
+ var start = api.coord([api.value(1), categoryIndex]);
+ var end = api.coord([api.value(2), categoryIndex]);
+ var height = api.size([0, 1])[1] * 0.6;
+ var rectShape = echarts.graphic.clipRectByRect(
+ {
+ x: start[0],
+ y: start[1] - height / 2,
+ width: end[0] - start[0],
+ height: height
+ },
+ {
+ x: params.coordSys.x,
+ y: params.coordSys.y,
+ width: params.coordSys.width,
+ height: params.coordSys.height
+ }
+ );
+ return (
+ rectShape && {
+ type: 'rect',
+ transition: ['shape'],
+ shape: rectShape,
+ style: api.style()
+ }
+ );
+ },
+ getColor(name) {
+ var color = '';
+ this.achievements.forEach(item=> {
+ if(item.code == name) {
+ color = item.color;
+ }
+ })
+ return color;
+ },
+ getStatus(name) {
+ var stauts = {};
+ this.allwcs.forEach(item=> {
+ if(item.code == name) {
+ stauts.name= item.name;
+ stauts.type= item.type;
+ }
+ })
+ return stauts;
+ },
+ getlogcart() { //鐝鐘舵�佽褰昪hart
+ var obj = {
+ date: this.wcsDate,
+ //date : "2024-05-15",
+ humanFeedback: true,
+ workstationId: this.lastLevelId
+ }
+ this.$HTTP.post(`/api/blade-mdc/status-record/shift-index-status-record-chart`,obj).then(res=> {
+ if(res.code == 200) {
+ var yAxisData = [];
+ var newData = [];
+ this.records = res.data.reverse();
+ res.data.forEach(item=> {
+ if(item.statusRecordList == null) item.statusRecordList = [];
+ var filterRecordList = [];
+ item.statusRecordList.forEach(item1=> {
+ if(item1.endTime.startsWith(this.wcsDate)) { //鍙繑鍥炲綋鍓嶇粨鏉熸棩鏈熺殑
+ filterRecordList.push(item1)
+ }
+ })
+ item.statusRecordList = filterRecordList;
+ })
+ res.data.forEach((item,index)=> {
+ yAxisData.push(item.shiftIndex);
+ //璁＄畻寮�濮嬫椂闂达紝鏄剧ず鏃堕棿
+ if(item.statusRecordList == null) item.statusRecordList = [];
+ item.statusRecordList.forEach(item1=> {
+ var initstart = item1.startTime.split(" ")[0]; //鏍规嵁鏃ユ湡璁＄畻宸��
+ var startTime = moment(item1.startTime).diff(moment(initstart + " 00:00:00"), 'minutes');
+ var endTime = moment(item1.endTime).diff(moment(initstart + " 00:00:00"), 'minutes');
+ var diff = moment(item1.endTime).diff(moment(item1.startTime), 'minutes') //寮�濮嬩簡澶氫箙
+ var color = this.getColor(item1.wcs);
+ item1.value = [index,startTime,endTime,diff];
+ item1.itemStyle = {"normal": {"color": color}};
+ item1.statusName = this.getStatus(item1.wcs).name;
+ item1.statusType = this.getStatus(item1.wcs).type;
+ })
+ newData.push(...item.statusRecordList);
+ })
+ //娓叉煋鍥捐〃
+ this.setCharts(yAxisData,newData);
+
+ var nowTime = moment().format("HH:mm:ss"); //11:37:54
+ var spaceTime = moment(obj.date + " " + nowTime).diff(moment(obj.date + " 00:00:00"), 'hours'); //绂诲綋澶�00:00:00杩囦簡澶氬皯灏忔椂
+ //console.log(spaceTime,obj.date + " " + nowTime,234)
+ return;
+ //璁＄畻鏃堕棿
+ var startOfDay = moment().startOf('day'); //00:00:00
+ var now = moment(); //褰撳墠鏃堕棿
+ var diffInMilliseconds = now.diff(startOfDay); //鏃堕棿宸�
+ var diffInHours = Math.floor(diffInMilliseconds / (1000 * 60 * 60)); //鏃堕棿宸浆鎹㈡垚灏忔椂
+ //鍒嗗壊
+ var everTime = Math.ceil(diffInHours/8);
+ var arrData = [];
+ for(var i=0;i<=diffInHours;i+=everTime) {
+ if(i<=10) {
+ var num = '0' + i;
+ }else {
+ var num = i;
+ }
+ arrData.push(num + ':00:00');
+ }
+ //璁＄畻鏃堕棿缁撴潫
+ this.wcsOptionLog.xAxis.data = [...arrData,moment().format("HH:mm:ss")];
+ myChart.setOption(this.wcsOptionLog);
+ }
+ })
+ },
+ setCharts(yAxisData,data) {
+ var option = {
+ tooltip: {
+ formatter: function (params) {
+ if(params.data.statusType == 4) {
+ var dom = `<span class="tipdesc">宸ヤ綅:</span>${params.data.name}</br>
+ <span class="tipdesc">鐘舵��:</span>${params.data.wcsDesc}</br>
+ <span class="tipdesc">鎻忚堪:</span>${params.data.feedbackDesc}</br>
+ <span class="tipdesc">鐘舵�佹椂闂�:</span>${params.data.startTime} 锝� ${params.data.endTime}</br>
+ <span class="tipdesc">鍙嶉鏃堕棿:</span>${params.data.feedbackTime}</br>
+ <span class="tipdesc">鍙嶉浜�:</span>${params.data.feedUser}</br>`
+ }else {
+ var dom = `<span class="tipstatus">${params.data.statusName}</span></br>
+ <span class="tipdesc">鏃舵:</span><span>${params.data.startTime.split(" ")[1]} 锝� ${params.data.endTime.split(" ")[1]}</span></br>`
+ }
+ return dom;
+ }
+ },
+ grid: {
+ top: 10,
+ left: 70,
+ bottom: 120
+ },
+ xAxis: {
+ min: 0,
+ max: 1440, // 鍗曚綅鍒嗛挓
+ interval: 1440/6, //姣忛殧澶氬皯鍒嗛挓鏄剧ず涓�涓埢搴�
+ axisLabel: {
+ formatter: (value)=> {
+ if(value == 0) {
+ return "00:00:00";
+ }else if(value == 240) {
+ return "04:00:00";
+ }else if(value == 480) {
+ return "08:00:00";
+ }else if(value == 720) {
+ return "12:00:00";
+ }else if(value == 960) {
+ return "16:00:00";
+ }else if(value == 1200) {
+ return "18:00:00";
+ }else if(value == 1440) {
+ return "00:00:00";
+ }
+ }
+ }
+ },
+ yAxis: {
+ type: 'category',
+ axisLabel: {
+ formatter: function (value) {
+ return value;
+ },
+ rich: {
+ a: {
+ color: '#409eff',
+ cursor: 'pointer',
+ fontSize: '12px'
+ }
+ }
+ },
+ data: yAxisData
+ },
+ series: [
+ {
+ type: 'custom',
+ renderItem: this.renderItem,
+ itemStyle: {
+ opacity: 0.8
+ },
+ encode: {
+ x: [1, 2],
+ y: 0
+ },
+ data: data
+ }
+ ]
+ };
+ var myChart = echarts.init(document.getElementById('wcs-log'));
+ myChart.setOption(option);
+ },
+ getwscLvalue() {
+ var obj = {
+ date: this.wcsDate,
+ humanFeedback: true,
+ workstationId: this.lastLevelId
+ }
+ this.$HTTP.post(`/api/blade-mdc/status-record/time-distribution`,obj).then(res=> {
+ if(res.code == 200) {
+ var myChart = echarts.init(document.getElementById('wcs-left'));
+ var wcsOption = JSON.parse(JSON.stringify(this.wcsBeginOption));
+ if(res.data.length == 0) {
+ wcsOption.forEach(item=> {
+ item.value = 0;
+ })
+ }else {
+ wcsOption.forEach(item=> {
+ res.data.forEach(item2=> {
+ if(item.code == item2.name) {
+ item.value = item2.value;
+ }
+ })
+ })
+ }
+ this.wcsOptionL.series[0].data = wcsOption;
+ myChart.setOption(this.wcsOptionL);
+ }
+ })
+ },
+ getwcsLcolor() {
+ this.$HTTP.get(`/api/blade-cps/global_wcs/list?code=&name=`).then(res=> {
+ if(res.code == 200) {
+ res.data.forEach(item=> {
+ item.itemStyle = {color: item.color};
+ })
+ this.wcsBeginOption = res.data;
+ this.getwscLvalue();
+ }
+ })
+ },
+ getwcsR() {
+ var obj = {
+ date: this.wcsDate,
+ humanFeedback: true,
+ workstationId: this.lastLevelId
+ }
+ this.$HTTP.post(`/api/blade-mdc/status-record/equipment-efficiency`,obj).then(res=> {
+ if(res.code == 200) {
+ var myChart = echarts.init(document.getElementById('wcs-right'));
+ res.data.forEach(item=> {
+ item.value = (Number(item.value)*100).toFixed(2);
+ if(item.name == "杩愯鐜�") item.itemStyle = {color: '#73d13d'};
+ if(item.name == "鎶ヨ鐜�") item.itemStyle = {color: '#ff4d4f'};
+ if(item.name == "绋煎姩鐜�") item.itemStyle = {color: '#40a9ff'};
+ })
+ this.wcsOptionR.series[0].data = res.data;
+ myChart.setOption(this.wcsOptionR);
+ }
+ })
+ },
+ newDate() {
+ var date = new Date();
+ var year = date.getFullYear();
+ var month = (1 + date.getMonth()).toString().padStart(2, '0'); // JavaScript涓湀浠芥槸浠�0寮�濮嬬殑锛屾墍浠ユ垜浠渶瑕佸姞1
+ var day = date.getDate().toString().padStart(2, '0'); // getDate()杩斿洖鐨勬槸褰撳墠鏈堢殑鏃ユ暟锛屼笉闇�瑕佸姞1
+ this.wcsDate = year + '-' + month + '-' + day;
+ },
+ addfeedbackSuccess() {
+
+ },
+ handleNodeClick(data) {
+ if(data.code) {
+ this.lastLevelId = data.id;
+ this.$HTTP.get(`/api/blade-cps/workstation/get?workstationId=${this.lastLevelId}`).then(res=> {
+ if(res.code == 200) {
+ this.stationForm = res.data;
+ this.getdmp(this.lastLevelId,this.stationForm.machineId);
+ //this.newDate(); //鑾峰彇褰撳墠鏃ユ湡
+ this.getwcsR();
+ this.getwscLvalue(); //宸︿晶鍥捐〃
+ this.alarmsearchBtn(); //鏈哄櫒灞ュ巻
+ this.getrecord(); //鐝鐘舵�佽褰晅able
+ this.getlogcart(); //鐝鐘舵�佽褰昪hart
+ }
+ })
+ }
+ },
+ getdmp(lastLevelId,machineId) {
+ console.log(lastLevelId,machineId)
+ this.$HTTP.get(`/api/blade-cps/workstation/get-dmp-variables?machineId=${machineId}&workstationId=${lastLevelId}`).then(res=> {
+ if(res.code == 200) {
+ this.dmpList = [];
+ var that = this;
+ //鍙戦�亀ebsocket
+ var obj = {
+ type: "realTimeData",
+ workstationIdList: [lastLevelId]
+ }
+ if(this.$TOOL.socket.websocket == null) { //娌℃湁寤虹珛鍏堝缓绔�
+ this.$TOOL.socket.connectToWebSocket(this.$TOOL.cookie.get("TOKEN"));
+ }
+ this.$TOOL.socket.sendDataToWebSocket(obj); //鍙戦��
+ this.$TOOL.socket.websocket.onmessage = function(event) {
+ if(res.data.length == 0) return; //娌″�间笉鐢ㄥ惊鐜�
+ res.data.forEach(item=> { //绗竴姝ユ妸v鏀惧埌code閲�
+ var eventData = JSON.parse(event.data);
+ if(item.name == "DeviceStatus") { //鏈哄櫒鐘舵��
+ item.code = eventData.data[item.name].v;
+ that.allwcs.forEach(item1=> {
+ if(item.code == item1.code) {
+ item.codeName = item1.name; //绗簩姝ユ妸v鐨刢ode鍜岃繍琛屽搴�
+ if(item.code == "2") {
+ item.color = "#73D13D";
+ }else {
+ item.color = "#75C0C0";
+ }
+ }
+ })
+ }else {
+ if(item.name == 'Alarm') { //鎶ヨ
+ var v = JSON.parse(eventData.data[item.name].v);
+ item.description = v.code;
+ item.codeName = v.msg;
+ item.color = "#370C0D";
+ }else {
+ item.codeName = eventData.data[item.name].v;
+ item.color = "#75C0C0";
+ }
+ }
+ });
+ that.dmpList = res.data;
+ };
+ }
+ })
+ },
+ getLastLevelIds(tree) {
+ if (tree.length === 0) return ""; // 濡傛灉娌℃湁鏍硅妭鐐癸紝杩斿洖绌�
+ const lastLevelIds = [];
+ const lastLevelCodes = [];
+ function traverseTree(node) {
+ if(!node.code) {
+ lastLevelCodes.push(node.id);
+ }
+ if (node.children.length > 0) {
+ node.children.forEach(traverseTree); // 閫掑綊閬嶅巻瀛愯妭鐐�
+ } else {
+ if(node.code) {
+ lastLevelIds.push(node.id); // 鏈塩ode鎵嶈
+ }
+ }
+ }
+ // 鍙亶鍘嗙涓�涓牴鑺傜偣
+ traverseTree(tree[0]);
+ return {lastLevelCodes,lastLevelId:lastLevelIds[0]}; // 杩斿洖lastLevelCodes锛氭病鏈塩ode鐨勬暟缁勩�俵astLevelId锛氭湁code鐨勭涓�涓猧d
+ },
+ buildTree(items) {
+ const idMap = {};
+ const tree = [];
+ // 绗竴姝ワ細鍒涘缓id鍒板璞＄殑鏄犲皠
+ items.forEach(item => {
+ idMap[item.id] = { ...item, children: [] };
+ });
+ // 绗簩姝ワ細鏋勫缓鏍戝舰缁撴瀯
+ items.forEach(item => {
+ const currentNode = idMap[item.id];
+ // 濡傛灉parentId涓�0锛岃鏄庢槸鏍硅妭鐐�
+ if (item.parentId === 0) {
+ tree.push(currentNode);
+ } else {
+ // 鍚﹀垯锛屾煡鎵剧埗鑺傜偣锛屽苟灏嗗綋鍓嶈妭鐐规坊鍔犲埌鐖惰妭鐐圭殑children鏁扮粍涓�
+ const parentId = item.parentId;
+ if (idMap[parentId]) {
+ idMap[parentId].children.push(currentNode);
+ }
+ }
+ });
+ return tree;
+ },
+ addTreeDisable(treeData) {
+ var tree = [];
+ treeData.forEach(item=> {
+ if(item.code) {
+ item.disabled = false;
+ }else {
+ item.disabled = true;
+ }
+ tree.push(item);
+ })
+ return tree;
+ },
+ getTreeList(id) {
+ var obj = {
+ groupCategory: 1,
+ groupType: "group_workstation"
+ }
+ this.$HTTP.post("/api/blade-cps/group/groupWorkstation/type",obj).then(res=> {
+ if(res.code == 200) {
+ if (res.code == 200) {
+ var treeDisabled = this.addTreeDisable(res.data);
+ this.tableData = this.buildTree(treeDisabled); //浠庢墎骞冲寲鍙樹负鏍戠姸缁撴瀯
+ this.$nextTick(()=> {
+ if(id) {
+ this.lastLevelId = id; //鎸囧畾id
+ }else {
+ this.lastLevelId = this.getLastLevelIds(this.tableData).lastLevelId;
+ }
+ this.$refs.treeRef.setCurrentKey(this.lastLevelId); //绗竴涓妭鐐圭殑绗竴涓瓙鑺傜偣鏈�鍚庝竴绾ч粯璁ら�変腑
+ //浠ヤ笅鏄垵濮嬪寲鏁版嵁
+ this.getlist(); //娓叉煋璇︽儏鍜�(鐘舵�乴ist)
+ this.getwcsLcolor(); //宸︿晶鍥捐〃
+ this.getwcsR(); //鍙充晶鍥炬爣
+ this.getachievements(); //鐝鐘舵�佽褰曢噰闆嗙姸鎬�
+ this.getrecord(); //鐝鐘舵�佽褰晅able
+ this.getlogcart(); //鐝鐘舵�佽褰昪hart
+ })
+
+ }
+ }
+ })
+ },
+ getachievements() { //鐝鐘舵�佽褰曢噰闆嗙姸鎬�
+ this.$HTTP.get(`/api/blade-cps/global_wcs/wcs-achievements`).then(res=> {
+ if(res.code == 200) {
+ var achievements = [];//閲囬泦鐘舵��
+ var collectionstatus = []; //浜哄伐鍙嶉鐘舵��
+ res.data.forEach(item=> {
+ if(item.type == 1) {
+ achievements.push(item);
+ }
+ if(item.type == 4) {
+ collectionstatus.push(item);
+ }
+ })
+ this.achievements = achievements;
+ this.collectionstatus = collectionstatus;
+ this.allwcs = res.data;
+ }
+ })
+ },
+ getlist() {
+ this.$HTTP.get(`/api/blade-cps/workstation/get?workstationId=${this.lastLevelId}`).then(res=> {
+ if(res.code == 200) {
+ this.stationForm = res.data;
+ this.getdmp(this.lastLevelId,this.stationForm.machineId);
+ }
+ })
+ }
+ }
+ }
</script>
-
-<style lang="scss" scoped>
-
+<style scoped>
+.aposcope-main {
+ display: flex;
+ min-height: 100%;
+ margin: 8px;
+}
+.aposcope-left {
+ width: 240px;
+ margin-right: 8px;
+ padding: 4px;
+ background-color: #fff;
+}
+.aposcope-right {
+ flex: 1;
+ padding: 8px;
+ background-color: #fff;
+}
+.left-title {
+ font-size: 16px;
+ text-align: center;
+ height: 38px;
+ line-height: 38px;
+ border-bottom: 1px solid #e2e2e2;
+ background-color: #409eff;
+ color: #fff;
+ border-radius: 2px 2px 0 0;
+}
+.content-machine-box {
+ display: flex;
+ align-items: center;
+ flex-direction: row;
+ flex-wrap: nowrap;
+ align-content: center;
+ justify-content: flex-start;
+ background-color: rgba(59, 142, 142, .06);
+ border-radius: 2px;
+}
+.content-machine-img {
+ margin: 14px;
+ padding: 2px;
+ border: 1px solid #e8e8e8;
+ width: 148px;
+ height: 145px;
+ justify-content: center;
+}
+.content-machine-img img {
+ width: 135px;
+ height: 135px;
+}
+.content-machine-detail {
+ display: flex;
+ width: calc(100% - 210px);
+ flex-direction: column;
+ align-items: flex-start;
+ align-content: flex-start;
+ flex-wrap: nowrap;
+}
+.content-machine-name {
+ margin-bottom: 12px;
+ font-size: 24px;
+ font-weight: 700;
+}
+.collect-info-panel {
+ background-color: rgba(59, 142, 142, .06);
+ padding: 8px;
+ padding-top: 0;
+}
+.fact-analysis-realtim {
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+ justify-content: flex-start;
+ align-content: flex-start;
+ box-sizing: border-box;
+ background: #fff;
+}
+.fact-analysis-card {
+ border-radius: 2px;
+ box-sizing: border-box;
+ display: flex;
+ margin: 8px;
+}
+.fact-analysis-card .card-name {
+ width: 98px;
+ height: 68px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ color: #fff;
+}
+.fact-analysis-card .card-value {
+ min-width: 118px;
+ max-width: 396px;
+ align-items: center;
+ padding: 0 8px;
+ overflow: hidden;
+ word-break: break-all;
+ line-height: 68px;
+}
+.card-value-bg1 {
+ background-color: rgba(115, 209, 61, 0.14);
+}
+.card-value-bg2 {
+ background-color: rgba(55, 12, 13, 0.14);
+}
+.wcs-main {
+ display: flex;
+}
+.wcs-main > div {
+ padding: 6px;
+ box-shadow: 2px 3px 10px rgba(0,0,0,.16);
+}
+.wcs-main > div:nth-child(1) {
+ width: 50%;
+ margin-right: 4px;
+}
+.wcs-main > div:nth-child(2) {
+ flex:1;
+}
+.alarm-title {
+ padding-bottom: 8px;
+ font-size: 14px;
+}
+.wimi-empty {
+ height: 100%;
+ width: 100%;
+ display: flex;
+ border-radius: 2px;
+ flex-direction: column;
+ flex-wrap: nowrap;
+ align-content: center;
+ justify-content: center;
+ align-items: center;
+}
+.empty-description {
+ margin-bottom: 20px;
+ font-size: 14px;
+ color: #5e6d82;
+ margin-top: -16px;
+ line-height: 28px;
+}
+.bottom-panel {
+ margin-top: 8px;
+ min-height: 300px;
+}
+.content-panel {
+ height: 100%;
+ box-shadow: 2px 3px 10px rgba(0,0,0,.16);
+}
+.panel-title {
+ font-size: 16px;
+ box-sizing: border-box;
+ padding: 12px 24px;
+ width: 100%;
+ position: relative;
+ color: #333;
+ font-weight: 700;
+}
+.bottom-panel-chart {
+ display: flex;
+ flex-direction: column;
+ flex-wrap: nowrap;
+ align-content: flex-start;
+ align-items: flex-start;
+ padding: 8px;
+ padding-top: 0;
+ box-sizing: border-box;
+}
+.panel-content {
+ width: 100%;
+ height: calc(100% - 45px);
+}
+.panel-content-gant, .panel-content-table {
+ width: 100%;
+}
+.gant {
+ box-sizing: border-box;
+ padding: 8px;
+}
+.status {
+ display: flex;
+ align-items: start;
+ flex-direction: column;
+ justify-content: start;
+ margin: 8px 0;
+ position: relative;
+ width: 100%;
+ font-size: 16px;
+ cursor: pointer;
+}
+.feed-button {
+ position: absolute;
+ right: 10px;
+ top: -2px;
+ color: #409eff;
+ cursor: pointer;
+}
+.status-wrap.align-left, .status-wrap:first-child {
+ padding-left: 24px;
+ margin-bottom: 8px;
+}
+.status-wrap {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: start;
+}
+.collect-status {
+ color: #409eff;
+ margin-right: 16px;
+ font-size: 14px;
+}
+.status-box {
+ margin: 0 8px;
+ display: flex;
+ align-items: center;
+ justify-content: flex-start;
+}
+.status-color {
+ width: 40px;
+ height: 15px;
+ border-radius: 2px;
+ margin-right: 8px;
+}
+.status-wrap {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: start;
+}
+.status-wrap .status-con {
+ display: flex;
+ flex: 1;
+ flex-wrap: wrap;
+}
+.status-wrap /deep/ .el-checkbox.el-checkbox--large {
+ color: #409eff;
+}
+#record /deep/ .tipstatus {
+ width: 100%;
+ display: inline-block;
+ border-bottom: 1px solid #eee;
+}
</style>
\ No newline at end of file
--
Gitblit v1.9.3