smart-web.git - Gitblit

			@@ -1,8 +1,8 @@
			<!--
			* @Author: lzhe lzhe@example.com
			* @Date: 2024-03-26 10:28:33
			* @LastEditors: lzhe lzhe@example.com
			* @LastEditTime: 2024-11-08 18:26:10
			* @LastEditors: 李喆(开发组) lzhe@yxqiche.com
			* @LastEditTime: 2025-11-18 16:57:42
			* @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
			-->
			@@ -10,10 +10,54 @@
			<div class="aposcope-main">
			<div class="aposcope-left">
			<!-- <div class="left-title">查询条件</div> -->
			<MYTree v-model="treeChecked" @loaded="query"></MYTree>
			<MYTree v-model="treeChecked" @loaded="query" :isSelectId="$route.query.code"></MYTree>
			</div>
			<div class="aposcope-right">
			<div class="content-machine-box">
			<div class="content-machine-box" style="min-height: 450px;">
			<div class="content-one content-border">
			<div style="text-align: center;margin-bottom: 12px;margin-top:12px;">
			<el-date-picker v-model="wcsDate" type="date" @change="wcschangedate" value-format="YYYY-MM-DD" size="small" />
			</div>
			<stationLiveItem :getwcsRData="getwcsRData"></stationLiveItem>
			</div>
			<div class="content-two content-border">
			<tationLiveSpeed :dmpList="dmpList"></tationLiveSpeed>
			</div>
			<div class="content-three content-border">
			<speenBaseInfo :stationFormData="stationForm" :dmpList="dmpList"></speenBaseInfo>
			</div>
			</div>
			<div class="dataHr"></div>
			<div class="content-zhou-box">
			<div class="zhou-one content-zhou-border">
			<div><div id="wcs-left" style="width: 100%;height:340px;"></div></div>
			</div>
			<div class="zhou-two content-zhou-border">
			<el-table :data="tableData2" style="width: 100%;height:340px;">
			<el-table-column prop="test" label="轴"></el-table-column>
			<el-table-column prop="test" label="坐标"></el-table-column>
			<el-table-column prop="test" label="扭矩"></el-table-column>
			</el-table>
			</div>
			<div class="zhou-three content-zhou-border">
			<el-table :data="alarmtableData" style="height:300px;">
			<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: 6px;padding-left: 6px;padding-right: 6px;width: 450;position:absolute;right:0;"
			@size-change="alarmSizeChange"
			@current-change="alarmCurrentChange"
			:current-page="alarmsearchData.current"
			:page-size="15"
			layout="total, prev, pager, next"
			:total="alarmtotal">
			</el-pagination>
			</div>
			</div>
			<div>------------------------------------</div>
			<!-- <div class="content-machine-box">
			<div class="content-machine-img"><img :src="stationForm.avatar" alt=""></div>
			<div class="content-machine-detail">
			<div class="content-machine-name">{{stationForm.machineName}}</div>
			@@ -34,13 +78,10 @@
			</el-row>
			</el-form>
			</div>
			</div>
			<div class="collect-info-panel">
			</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>
			@@ -51,17 +92,14 @@
			</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>

			</el-tab-pane>
			<el-tab-pane label="机器履历">
			<div class="alarm-title">报警信息履历</div>
			@@ -81,8 +119,7 @@
			:total="alarmtotal">
			</el-pagination>
			</el-tab-pane>
			</el-tabs>

			</el-tabs> -->
			<div class="bottom-panel content-panel">
			<div class="panel-title">班次状态记录</div>
			<div class="panel-content bottom-panel-chart">
			@@ -132,10 +169,18 @@
			import * as echarts from 'echarts';
			import saveDialog from './add-station-status';
			import MYTree from './MYTree.vue';
			import stationLiveItem from './components/StationLiveItem'; //饼状图
			import tationLiveSpeed from './components/StationLiveSpeed'; //speed
			import speenBaseInfo from './components/speenBaseInfo'; //speenBaseInfo
			export default {
			name: "state-feedback",
			data(){
			return {
			currentPage4: 1,
			getwcsRData: [],
			tableData1: [],
			tableData2: [],
			tableData3: [],
			treeChecked: [],
			achievements: [],
			collectionstatus: [],
			@@ -151,9 +196,6 @@
			fontSize:14
			}
			},
			grid: {
			top: 0,
			},
			tooltip: {
			trigger: 'item',
			//formatter: '{a} <br/>{b} : {c} ({d}%)'
			@@ -162,15 +204,14 @@
			legend: {
			orient: 'vertical',
			bottom: 'bottom',
			data: ['调试', '离线', '待机', '报告', '报警', '运行']
			data: ['调试', '离线', '待机', '报告', '报警', '运行']
			},
			series: [
			{
			top: -30,
			{
			name: '用时:',
			type: 'pie',
			radius: '55%',
			center: ['40%', '50%'],
			center: ['50%', '50%'],
			data: [],
			itemStyle: {
			borderRadius: 10,
			@@ -296,18 +337,19 @@
			}
			},
			created(){


			},
			watch: {
			treeChecked() {
			this.query()
			this.query();
			}
			},
			mounted(){
			this.newDate(); //获取当前日期
			this.getachievements();
			},
			components: {
			saveDialog,MYTree
			saveDialog,MYTree,stationLiveItem,tationLiveSpeed,speenBaseInfo
			},
			methods: {
			table_edit(){
			@@ -613,15 +655,16 @@
			}
			this.$HTTP.post(`/api/mdc/status-record/equipment-efficiency`,obj).then(res=> {
			if(res.code == 200) {
			var myChart = echarts.init(document.getElementById('wcs-right'));
			//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);
			//this.wcsOptionR.series[0].data = res.data;
			this.getwcsRData = res.data; //新图形
			//myChart.setOption(this.wcsOptionR);
			}
			})
			},
			@@ -664,53 +707,54 @@
			workstationIdList: this.treeChecked
			}
			if(res.data.dpConfig == null \|\| res.data.dpConfig.length == 0) return; //没值不用循环

			if(this.$TOOL.socket.websocket == null) { //没有建立先建立
			this.$TOOL.socket.connectToWebSocket(this.$TOOL.cookie.get("TOKEN"));
			}
			this.$TOOL.socket.sendDataToWebSocket(obj); //发送
			var intervalId123 = setInterval(function () {
			if (that.$TOOL.socket.websocket.readyState == 1) {
			clearInterval(intervalId123);
			that.$TOOL.socket.sendDataToWebSocket(obj); //发送
			}
			}, 500);
			this.$TOOL.socket.websocket.onmessage = function(event) {
			var JSONData = JSON.parse(res.data.dpConfig);
			var SpindleLoad = JSONData.some(obj => obj.dpName === 'spindleLoad'); //判断是否有主轴负载(SpindleLoad)；
			var SpindleRate = JSONData.some(obj => obj.dpName === 'spindleRate'); //判断是否有主轴倍率(SpindleRate)；
			var FeedRate = JSONData.some(obj => obj.dpName === 'feedRate'); //判断是否有进给倍率(FeedRate)；
			if(!SpindleLoad) JSONData.push({dpName: "spindleLoad",dpLabel: "主轴负载"});
			if(!SpindleRate) JSONData.push({dpName: "spindleRate",dpLabel: "主轴倍率"});
			if(!FeedRate) JSONData.push({dpName: "feedRate",dpLabel: "进给倍率"});
			var eventData = JSON.parse(event.data);
			if(Object.keys(eventData.data).length == 0) return;
			JSONData.forEach((item,index)=> { //第一步把v放到code里
			if(item.dpName == "DeviceStatus") { //机器状态
			if(eventData.data[item.dpName]) {
			item.code = eventData.data[item.dpName].v;
			}
			setTimeout(()=> {
			console.log(that.allwcs,888)
			},5000)
			that.allwcs.forEach((item1)=> {
			if(item.code == item1.code) {
			item.codeName = item1.name; //第二步把v的code和运行对应
			item.color = item1.color;
			}
			})
			}else {
			if(item.dpName == 'Alarm') { //报警
			if(eventData.data[item.dpName]) {
			var v = JSON.parse(eventData.data[item.dpName].v);
			if(Array.isArray(v)) { //如果是数组，不赋值
			if(v.length == 0) {
			JSONData.splice(index,1);
			}else {
			item.codeName = v[0].msg;
			}
			}else {
			item.codeName = v.msg;
			}
			item.codeName = eventData.data[item.dpName].v;
			}
			}else {
			if(eventData.data[item.dpName]) {
			item.codeName = eventData.data[item.dpName].v;
			}else {
			item.codeName = "";
			}else { //ws没有的情况
			if(item.dpName == "spindleLoad" \|\| item.dpName == "spindleRate" \|\| item.dpName == "feedRate") {
			item.codeName = 0;
			}else {
			item.codeName = "";
			}
			}
			}
			that.allwcs.forEach((item1)=> {
			if(item.code == item1.code) {
			item.color = item1.color;
			}else {
			item.color = "#7FC0C0";
			}
			})
			}
			});
			that.dmpList = JSONData;
			@@ -803,15 +847,44 @@
			color: #fff;
			border-radius: 2px 2px 0 0;
			}
			.content-machine-box {
			.content-machine-box,.content-zhou-box {
			display: flex;
			align-items: center;
			align-items: flex-start;
			flex-direction: row;
			flex-wrap: nowrap;
			align-content: center;
			justify-content: flex-start;
			background-color: rgba(59, 142, 142, .06);
			border-radius: 2px;
			border: 1px solid #ccc;
			}
			.content-border {
			height: 100%;
			}
			.content-zhou-border {
			height: 100%;
			}
			.content-one {
			width: 25%;
			}
			.content-two,.zhou-three {
			flex: 1;
			position: relative;
			}
			.content-two {
			border-left: 1px solid #eee;
			border-right: 1px solid #eee;
			min-height: 450px;
			}
			.content-three {
			width: 25%;
			}
			.zhou-one {
			width: 330px;
			}
			.zhou-two {
			width:28%;
			border-left: 1px solid #eee;
			border-right: 1px solid #eee;
			}
			.content-machine-img {
			margin: 14px;
			@@ -1016,4 +1089,16 @@
			display: inline-block;
			border-bottom: 1px solid #eee;
			}
			.dataHr {
			background-color: #48ACF8;
			height: 30px;
			width: 100%;
			text-align: center;
			line-height: 30px;
			font-size: 13px;
			color: #fff;
			font-weight: bold;
			margin-top: 12px;
			margin-bottom: 12px;
			}
			</style>