gao.zhiyuan
/
CraneAntiCollision
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

WEBSOCKET 数据接入

master
巴林闲侠 3 years ago
parent
4005a7d181
commit
9791d90611
11 changed files with 1130 additions and 24325 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      console/client/assets/env.js
  2. 4
      console/client/src/layout/containers/layout/index.js
  3. 28
      console/client/src/sections/console/actions/index.js
  4. 821
      console/client/src/sections/console/containers/index.js
  5. 256
      console/client/src/sections/console/containers/setUp.js
  6. 4
      console/client/src/sections/console/nav-item.js
  7. 16
      console/client/src/utils/webapi.js
  8. 1
      console/config.js
  9. 77
      console/log/development.txt
  10. 24244
      console/package-lock.json
  11. 2
      console/package.json

2
console/client/assets/env.js
View File

@ -1 +1 @@
window.FS_API_ROOT = 'http://localhost:4600'
window.FS_API_ROOT = 'http://10.8.30.183:4100'

4
console/client/src/layout/containers/layout/index.js
View File

@ -65,7 +65,7 @@ const LayoutContainer = props => {
dom.scrollTop = 0;
}
})
return (
<Layout id="layout">
<Layout.Header style={{ padding: 0 }}>
@ -114,7 +114,7 @@ const LayoutContainer = props => {
)
}
function mapStateToProps(state) {
function mapStateToProps (state) {
const { global, auth, ajaxResponse } = state;
return {
title: global.title,

28
console/client/src/sections/console/actions/index.js
View File

@ -1,6 +1,32 @@
'use strict';
import { ApiTable } from '$utils'
import { Request, basicAction } from '@peace/utils'
export default {
export function editCrane (params) {
return dispatch => basicAction({
type: 'post',
data: params,
dispatch: dispatch,
actionType: 'EDIT_CRANE',
url: ApiTable.craneSetting,
msg: { option: '修改配置信息' },
});
}
export function getCrane (params) {
return dispatch => basicAction({
type: 'get',
query: params,
dispatch: dispatch,
actionType: 'GET_CRANE',
url: ApiTable.craneSetting,
msg: { error: '获取配置信息失败' },
reducer: { name: 'crane' }
});
}
export default {
editCrane,
getCrane,
}

821
console/client/src/sections/console/containers/index.js
View File

@ -1,10 +1,14 @@
import React, { useEffect, useState, useRef } from 'react'
import { push } from 'react-router-redux';
import { connect } from 'react-redux';
import request from 'superagent';
import { getCrane } from '../actions'
import { ApiTable } from '$utils'
import { Colors } from '@peace/utils'
import {
SettingOutlined
SettingOutlined, VideoCameraOutlined
} from '@ant-design/icons';
import { Col, Row, Button, Modal, Input } from 'antd';
import { Col, Row, Button, Modal, Input, Space } from 'antd';
import '../style.less'
function calculateIntersection (cx, cy, d, angle) {
@ -36,11 +40,13 @@ function calculateIntersection (cx, cy, d, angle) {
return [intersection_x, intersection_y];
}
let ws;
let interval;
function Index (props) {
const { dispatch } = props
const { dispatch, craneData } = props
const xyCvs = useRef()
const xzCvs = useRef()
const [craneParams, setCraneParams] = useState({})
const [darkModde] = useState(true)
const [darkColor] = useState({
background: '#1E1E1E',
@ -50,367 +56,413 @@ function Index (props) {
})
const [isModalOpen, setIsModalOpen] = useState(false);
useEffect(() => {
console.log(FS_API_ROOT, window.FS_API_ROOT);
const draw = (type, params = {}) => {
const canvasArea = document.getElementById('canvasArea')
const canvasHeight = canvasArea.clientHeight - 12 * 2 - 6
const canvasWidth = canvasArea.clientWidth - 12 * 2
const mainColor = "rgb(249,179,45)"
// xy 视图
console.log(xyCvs, xyCvs.current, canvasHeight);
const xyCtx = xyCvs.current.getContext("2d");
xyCvs.current.height = canvasHeight
xyCvs.current.width = canvasWidth
const center = [canvasWidth / 2, canvasHeight / 2]
const diameter = Math.min(canvasWidth, canvasHeight)
// 画圆
xyCtx.beginPath();
xyCtx.arc(...center, diameter / 2, 0, 2 * Math.PI);
if (darkModde) {
xyCtx.strokeStyle = darkColor.subTextColor;
// xyCtx.fill();
if (type == 'xy') {
// xy 视图
console.log(xyCvs, xyCvs.current, canvasHeight);
const xyCtx = xyCvs.current.getContext("2d");
xyCvs.current.height = canvasHeight
xyCvs.current.width = canvasWidth
const center = [canvasWidth / 2, canvasHeight / 2]
// 直径
const diameter = Math.min(canvasWidth, canvasHeight)
// 画圆
xyCtx.beginPath();
xyCtx.arc(...center, diameter / 2, 0, 2 * Math.PI);
if (darkModde) {
xyCtx.strokeStyle = darkColor.subTextColor;
// xyCtx.fill();
}
xyCtx.stroke();
// 圆心圆
xyCtx.beginPath();
// 吊索位置
xyCtx.arc(...center, diameter / 48, 0, 2 * Math.PI);
xyCtx.fillStyle = mainColor;
xyCtx.fill();
xyCtx.stroke();
// 吊臂
let curRotation = params?.rotation?.Value || 42
xyCtx.moveTo(...center);
xyCtx.lineTo(...calculateIntersection(...center, diameter, curRotation));
// 配重臂
xyCtx.moveTo(...center);
xyCtx.lineTo(...calculateIntersection(...center, diameter / 8, curRotation + 180));
xyCtx.strokeStyle = mainColor;
xyCtx.stroke();
// 索
xyCtx.beginPath();
xyCtx.arc(...calculateIntersection(...center, 168, curRotation), diameter / 48, 0, 2 * Math.PI);
xyCtx.fillStyle = mainColor;
xyCtx.fill();
xyCtx.stroke();
}
xyCtx.stroke();
// 圆心圆
xyCtx.beginPath();
xyCtx.arc(...center, diameter / 48, 0, 2 * Math.PI);
xyCtx.fillStyle = mainColor;
xyCtx.fill();
xyCtx.stroke();
// 吊臂
xyCtx.moveTo(...center);
xyCtx.lineTo(...calculateIntersection(...center, diameter, 42));
// 配重臂
xyCtx.moveTo(...center);
xyCtx.lineTo(...calculateIntersection(...center, diameter / 8, 42 + 180));
xyCtx.strokeStyle = mainColor;
xyCtx.stroke();
// 索
xyCtx.beginPath();
xyCtx.arc(...calculateIntersection(...center, 168, 42), diameter / 48, 0, 2 * Math.PI);
xyCtx.fillStyle = mainColor;
xyCtx.fill();
xyCtx.stroke();
// xz 视图
const xzCtx = xzCvs.current.getContext("2d");
xzCvs.current.height = canvasHeight
xzCvs.current.width = canvasWidth
/**
* 1、绘制矩形(主要分为:绘制填充矩形和绘制边框矩形和清除矩形区域(利用isClear标记是否绘制清除矩形,实际上就是绘制一个与画布背景色一致的矩形区域),利用isFill变量来标记)
* 主要使用canvas原生的API:FillRect(x,y,width,height),StrokeRect(x,y,width,height),ClearRect(x,y,width,height)
* 自己封装的参数:drawRect(x,y,width,height,isClear,isFill,bgColor)
* x:矩形起点的X坐标(注意:相对坐标系是以画布的左上角为原点,向右为X坐标正方向,向下为Y坐标的正方向)
* y:矩形终点的Y坐标
* width:矩形的宽度
* height:矩形的高度
* isClear:是否绘制清除画布的矩形区域,true则就是绘制一个清除画布矩形区域,false就是绘制其他两种矩形
* isFill:是否是填充,false为绘制边框,true为绘制填充
* bgColor:矩形的颜色,若为填充则为整个矩形背景色,边框则为边框色
* */
function drawRect (x, y, width, height, isClear, isFill, bgColor) {
if (isClear) { //为true表示绘制清除画布的矩形区域,那么传入的isFill, bgColor值可以为任意值
xzCtx.clearRect(x, y, width, height);
} else { //false
if (isFill) { //为true,则绘制填充矩形
if (type == 'xz') {
// xz 视图
const xzCtx = xzCvs.current.getContext("2d");
xzCvs.current.height = canvasHeight
xzCvs.current.width = canvasWidth
/**
* 1、绘制矩形(主要分为:绘制填充矩形和绘制边框矩形和清除矩形区域(利用isClear标记是否绘制清除矩形,实际上就是绘制一个与画布背景色一致的矩形区域),利用isFill变量来标记)
* 主要使用canvas原生的API:FillRect(x,y,width,height),StrokeRect(x,y,width,height),ClearRect(x,y,width,height)
* 自己封装的参数:drawRect(x,y,width,height,isClear,isFill,bgColor)
* x:矩形起点的X坐标(注意:相对坐标系是以画布的左上角为原点,向右为X坐标正方向,向下为Y坐标的正方向)
* y:矩形终点的Y坐标
* width:矩形的宽度
* height:矩形的高度
* isClear:是否绘制清除画布的矩形区域,true则就是绘制一个清除画布矩形区域,false就是绘制其他两种矩形
* isFill:是否是填充,false为绘制边框,true为绘制填充
* bgColor:矩形的颜色,若为填充则为整个矩形背景色,边框则为边框色
* */
function drawRect (x, y, width, height, isClear, isFill, bgColor) {
if (isClear) { //为true表示绘制清除画布的矩形区域,那么传入的isFill, bgColor值可以为任意值
xzCtx.clearRect(x, y, width, height);
} else { //false
if (isFill) { //为true,则绘制填充矩形
xzCtx.fillStyle = bgColor;
xzCtx.fillRect(x, y, width, height);
} else { //为false,则绘制边框矩形
xzCtx.strokeStyle = bgColor;
xzCtx.strokeRect(x, y, width, height);
}
}
}
/**
* 2、绘制圆弧(主要分为:绘制填充圆弧和绘制圆弧边框利用isFill变量来标记,注意:在绘制圆弧边框的时候还有一种特殊情况就是,只需要仅仅绘制弧边,不需要绘制圆弧开始起点和终点之间的连线,这个就是调用了beginPath()不需要调用closePath(),这里也使用一个isOnlyArc变量来标记true为仅仅绘制弧边
*其他的正常)
* 主要是使用的是canvas原生的API:
* arc(x,y,radius,startAngle,endAngle,anticlockwise);
* x:圆心X坐标
* y:圆心Y坐标
* startAngle:开始的弧度
* endAngle:结束的弧度
* anticlockwise:true为逆时针,false为顺时针
* 自己封装的参数:drawCircle(x,y,radius,startAngle,endAngle,anticlockwise,isFill,bgColor)
* x:圆心X坐标
* y:圆心Y坐标
* startAngle:开始的角度(通过getAngle方法将传入的角度转换成相应角度的弧度,
* 因为在原生的绘制圆弧的API它是根据弧度大小来绘制的,例如如果你想绘制一个30度的圆弧,如果直接传入30是不行的,要传入Math.PI/6
* 所以在这里个人做了一个优化,直接传入30就通过getAngle方法转换成Math.PI/6,这样就很方便的绘制自己传入的角度大小的圆弧.
* )
* endAngle:结束的角度
* 注意:如果要绘制圆形那么只需要调用该方法,传入的startAngle和endAngle是0度和360度即可.
* anticlockwise:true为逆时针,false为顺时针
* isFill:是否是填充,false为绘制边框,true为绘制填充
* bgColor:圆弧的颜色
* */
function drawArc (x, y, radius, startAngle, endAngle, anticlockwise, isOnlyArc, isFill, bgColor) {
if (isFill) { //为true绘制填充圆弧
xzCtx.fillStyle = bgColor;
xzCtx.fillRect(x, y, width, height);
} else { //为false,则绘制边框矩形
xzCtx.beginPath();
xzCtx.arc(x, y, radius, getAngle(startAngle), getAngle(endAngle), anticlockwise);
xzCtx.closePath();
xzCtx.fill();
} else { //为false绘制边框圆弧
xzCtx.strokeStyle = bgColor;
xzCtx.strokeRect(x, y, width, height);
xzCtx.beginPath();
xzCtx.arc(x, y, radius, getAngle(startAngle), getAngle(endAngle), anticlockwise);
if (isOnlyArc) { //绘制边框的另一种情况就是仅仅绘制弧边不需要调用closePath()
} else { //否则就是不仅绘制边框还得绘制起点和终点的连线,需要调用了closePath();
xzCtx.closePath();
}
xzCtx.stroke();
}
}
}
/**
* 2、绘制圆弧(主要分为:绘制填充圆弧和绘制圆弧边框利用isFill变量来标记,注意:在绘制圆弧边框的时候还有一种特殊情况就是,只需要仅仅绘制弧边,不需要绘制圆弧开始起点和终点之间的连线,这个就是调用了beginPath()不需要调用closePath(),这里也使用一个isOnlyArc变量来标记true为仅仅绘制弧边
*其他的正常)
* 主要是使用的是canvas原生的API:
* arc(x,y,radius,startAngle,endAngle,anticlockwise);
* x:圆心X坐标
* y:圆心Y坐标
* startAngle:开始的弧度
* endAngle:结束的弧度
* anticlockwise:true为逆时针,false为顺时针
* 自己封装的参数:drawCircle(x,y,radius,startAngle,endAngle,anticlockwise,isFill,bgColor)
* x:圆心X坐标
* y:圆心Y坐标
* startAngle:开始的角度(通过getAngle方法将传入的角度转换成相应角度的弧度,
* 因为在原生的绘制圆弧的API它是根据弧度大小来绘制的,例如如果你想绘制一个30度的圆弧,如果直接传入30是不行的,要传入Math.PI/6
* 所以在这里个人做了一个优化,直接传入30就通过getAngle方法转换成Math.PI/6,这样就很方便的绘制自己传入的角度大小的圆弧.
* )
* endAngle:结束的角度
* 注意:如果要绘制圆形那么只需要调用该方法,传入的startAngle和endAngle是0度和360度即可.
* anticlockwise:true为逆时针,false为顺时针
* isFill:是否是填充,false为绘制边框,true为绘制填充
* bgColor:圆弧的颜色
* */
function drawArc (x, y, radius, startAngle, endAngle, anticlockwise, isOnlyArc, isFill, bgColor) {
if (isFill) { //为true绘制填充圆弧
xzCtx.fillStyle = bgColor;
xzCtx.beginPath();
xzCtx.arc(x, y, radius, getAngle(startAngle), getAngle(endAngle), anticlockwise);
xzCtx.closePath();
xzCtx.fill();
} else { //为false绘制边框圆弧
xzCtx.strokeStyle = bgColor;
xzCtx.beginPath();
xzCtx.arc(x, y, radius, getAngle(startAngle), getAngle(endAngle), anticlockwise);
if (isOnlyArc) { //绘制边框的另一种情况就是仅仅绘制弧边不需要调用closePath()
/**
* 3、绘制扇形(主要分为:绘制填充扇形和绘制扇形边框利用isFill变量来标记)
*主要是使用的是canvas原生的API:
* arc(x,y,radius,startAngle,endAngle,anticlockwise);
* x:圆心X坐标
* y:圆心Y坐标
* startAngle:开始的弧度
* endAngle:结束的弧度
* anticlockwise:true为逆时针,false为顺时针
* 自己封装参数API:drawSector(x,y,radius,startAngle,endAngle,anticlockwise,isFill,bgColor);
* x:圆心X坐标
* y:圆心Y坐标
* startAngle:开始的角度(通过getAngle方法将传入的角度转换成相应角度的弧度,
* 因为在原生的绘制圆弧的API它是根据弧度大小来绘制的,例如如果你想绘制一个30度的圆弧,如果直接传入30是不行的,要传入Math.PI/6
* 所以在这里个人做了一个优化,直接传入30就通过getAngle方法转换成Math.PI/6,这样就很方便的绘制自己传入的角度大小的圆弧.
* )
* endAngle:结束的角度
* anticlockwise:true为逆时针,false为顺时针
* isFill:是否是填充,false为绘制边框,true为绘制填充
* bgColor:扇形的颜色
* */
function drawSector (x, y, radius, startAngle, endAngle, anticlockwise, isFill, bgColor) {
if (isFill) {
xzCtx.fillStyle = bgColor;
xzCtx.beginPath();
xzCtx.moveTo(x, y); //把路径移动到画布中的指定点,不创建线条,注意:绘制扇形唯一与绘制弧的区别在于,紧跟着beginPath()后面调用,首先将路径移动到圆心位置
xzCtx.arc(x, y, radius, getAngle(startAngle), getAngle(endAngle), false);
xzCtx.closePath();
xzCtx.fill();
} else {
xzCtx.strokeStyle = bgColor;
} else { //否则就是不仅绘制边框还得绘制起点和终点的连线,需要调用了closePath();
xzCtx.beginPath();
xzCtx.moveTo(x, y);
xzCtx.arc(x, y, radius, getAngle(startAngle), getAngle(endAngle), false);
xzCtx.closePath();
xzCtx.stroke();
}
xzCtx.stroke();
}
}
/**
* 3、绘制扇形(主要分为:绘制填充扇形和绘制扇形边框利用isFill变量来标记)
*主要是使用的是canvas原生的API:
* arc(x,y,radius,startAngle,endAngle,anticlockwise);
* x:圆心X坐标
* y:圆心Y坐标
* startAngle:开始的弧度
* endAngle:结束的弧度
* anticlockwise:true为逆时针,false为顺时针
* 自己封装参数API:drawSector(x,y,radius,startAngle,endAngle,anticlockwise,isFill,bgColor);
* x:圆心X坐标
* y:圆心Y坐标
* startAngle:开始的角度(通过getAngle方法将传入的角度转换成相应角度的弧度,
* 因为在原生的绘制圆弧的API它是根据弧度大小来绘制的,例如如果你想绘制一个30度的圆弧,如果直接传入30是不行的,要传入Math.PI/6
* 所以在这里个人做了一个优化,直接传入30就通过getAngle方法转换成Math.PI/6,这样就很方便的绘制自己传入的角度大小的圆弧.
* )
* endAngle:结束的角度
* anticlockwise:true为逆时针,false为顺时针
* isFill:是否是填充,false为绘制边框,true为绘制填充
* bgColor:扇形的颜色
* */
function drawSector (x, y, radius, startAngle, endAngle, anticlockwise, isFill, bgColor) {
if (isFill) {
xzCtx.fillStyle = bgColor;
/**
* @description 4、绘制线段(主要分为:绘制填充线段和绘制空心线段利用isFill变量来标记)
* 主要是使用的是canvas原生的API:
* lineTo(x,y):表示从某点连线到该坐标点
*moveTo(x,y):表示将路径移动到画布中的该坐标点
* x:画布中某点的X坐标
* y:画布中某点的Y坐标
* 注意:如果开始没有调用moveTo,那么第一个lineTo的功能就相当于一个moveTo
* 自己封装的API:drawLine(startX,startY,endX,endY,lineWidth,bgcolor)
*
* startX:表示线的起点的X坐标
* startY:表示起点的Y坐标
* endX:表示线的终点的X坐标
* endY:表示线的终点的Y坐标
* lineWidth:表示线段的宽度
* bgColor:线的颜色
* */
function drawLine (startX, startY, endX, endY, lineWidth, bgColor) {
xzCtx.beginPath();
xzCtx.moveTo(x, y); //把路径移动到画布中的指定点,不创建线条,注意:绘制扇形唯一与绘制弧的区别在于,紧跟着beginPath()后面调用,首先将路径移动到圆心位置
xzCtx.arc(x, y, radius, getAngle(startAngle), getAngle(endAngle), false);
xzCtx.closePath();
xzCtx.lineWidth = lineWidth;
xzCtx.strokeStyle = bgColor;
xzCtx.moveTo(startX, startY);
xzCtx.lineTo(endX, endY);
xzCtx.stroke();
xzCtx.fill();
} else {
}
/**
* @description 5、绘制贝塞尔曲线
* drawBezierCurve
* */
//将角度转换成弧度函数,
function getAngle (arc) {
return Math.PI * (arc / 180);
}
/**
* @description 6、吊钩
* variousHooks
* x原点横坐标,
* y原点纵坐标,
* X变量值左右,
* Y变量值上下,
* bgColor颜色
* */
function variousHooks (x, y, X, Y, bgColor) {
xzCtx.beginPath();
xzCtx.strokeStyle = bgColor;
//钩子头部分
xzCtx.moveTo(x + 5 + X, y);
xzCtx.lineTo(x + 35 + X, y);
xzCtx.moveTo(x + 5 + X, y + 10);
xzCtx.lineTo(x + 35 + X, y + 10)
xzCtx.moveTo(x + 10 + X, y);
xzCtx.lineTo(x + 10 + X, y + 10);
xzCtx.moveTo(x + 30 + X, y);
xzCtx.lineTo(x + 30 + X, y + 10);
xzCtx.moveTo(x + 11 + X, y + 10);
xzCtx.lineTo(x + 11 + X, y + 10 + Y);
xzCtx.moveTo(x + 29 + X, y + 10);
xzCtx.lineTo(x + 29 + X, y + 10 + Y);
//半圆
xzCtx.moveTo(x + 20 + X, y + 10 + Y);
xzCtx.arc(x + 20 + X, y + 10 + Y, 10, 0, 180 * Math.PI / 180, false);
xzCtx.moveTo(x + 20 + X, y + 10 + Y + 5);
xzCtx.lineTo(x + 10 + X, y + 10 + Y + 15);
xzCtx.moveTo(x + 20 + X, y + 10 + Y + 5);
xzCtx.lineTo(x + 30 + X, y + 10 + Y + 15);
xzCtx.moveTo(x + 30 + X, y + 10 + Y + 15);
xzCtx.lineTo(x + 30 + X, y + 10 + Y + 35);
xzCtx.lineTo(x + 10 + X, y + 10 + Y + 35);
xzCtx.lineTo(x + 10 + X, y + 10 + Y + 35);
xzCtx.lineTo(x + 10 + X, y + 10 + Y + 15);
xzCtx.lineTo(x + 30 + X, y + 10 + Y + 15);
xzCtx.stroke();
xzCtx.fill();
}
/**
* @description 7、叉线
* wiredCables
* */
function wiredCables (x, y, lineWidth, bgColor) {
xzCtx.beginPath();
xzCtx.moveTo(x, y);
xzCtx.arc(x, y, radius, getAngle(startAngle), getAngle(endAngle), false);
xzCtx.closePath();
xzCtx.lineWidth = lineWidth;
xzCtx.strokeStyle = bgColor;
xzCtx.moveTo(x - 10, y + 15);
xzCtx.lineTo(x + 10, y - 15);
xzCtx.moveTo(x - 10, y - 15);
xzCtx.lineTo(x + 10, y + 15);
xzCtx.stroke();
xzCtx.fill();
}
}
/**
* @description 4、绘制线段(主要分为:绘制填充线段和绘制空心线段利用isFill变量来标记)
* 主要是使用的是canvas原生的API:
* lineTo(x,y):表示从某点连线到该坐标点
*moveTo(x,y):表示将路径移动到画布中的该坐标点
* x:画布中某点的X坐标
* y:画布中某点的Y坐标
* 注意:如果开始没有调用moveTo,那么第一个lineTo的功能就相当于一个moveTo
* 自己封装的API:drawLine(startX,startY,endX,endY,lineWidth,bgcolor)
*
* startX:表示线的起点的X坐标
* startY:表示起点的Y坐标
* endX:表示线的终点的X坐标
* endY:表示线的终点的Y坐标
* lineWidth:表示线段的宽度
* bgColor:线的颜色
* */
function drawLine (startX, startY, endX, endY, lineWidth, bgColor) {
xzCtx.beginPath();
xzCtx.lineWidth = lineWidth;
xzCtx.strokeStyle = bgColor;
xzCtx.moveTo(startX, startY);
xzCtx.lineTo(endX, endY);
xzCtx.stroke();
xzCtx.fill();
}
/**
* @description 5、绘制贝塞尔曲线
* drawBezierCurve
* */
//将角度转换成弧度函数,
function getAngle (arc) {
return Math.PI * (arc / 180);
}
/**
* @description 6、吊钩
* variousHooks
* x原点横坐标,
* y原点纵坐标,
* X变量值左右,
* Y变量值上下,
* bgColor颜色
* */
function variousHooks (x, y, X, Y, bgColor) {
xzCtx.beginPath();
xzCtx.strokeStyle = bgColor;
//钩子头部分
xzCtx.moveTo(x + 5 + X, y);
xzCtx.lineTo(x + 35 + X, y);
xzCtx.moveTo(x + 5 + X, y + 10);
xzCtx.lineTo(x + 35 + X, y + 10)
xzCtx.moveTo(x + 10 + X, y);
xzCtx.lineTo(x + 10 + X, y + 10);
xzCtx.moveTo(x + 30 + X, y);
xzCtx.lineTo(x + 30 + X, y + 10);
xzCtx.moveTo(x + 11 + X, y + 10);
xzCtx.lineTo(x + 11 + X, y + 10 + Y);
xzCtx.moveTo(x + 29 + X, y + 10);
xzCtx.lineTo(x + 29 + X, y + 10 + Y);
//半圆
xzCtx.moveTo(x + 20 + X, y + 10 + Y);
xzCtx.arc(x + 20 + X, y + 10 + Y, 10, 0, 180 * Math.PI / 180, false);
xzCtx.moveTo(x + 20 + X, y + 10 + Y + 5);
xzCtx.lineTo(x + 10 + X, y + 10 + Y + 15);
xzCtx.moveTo(x + 20 + X, y + 10 + Y + 5);
xzCtx.lineTo(x + 30 + X, y + 10 + Y + 15);
xzCtx.moveTo(x + 30 + X, y + 10 + Y + 15);
xzCtx.lineTo(x + 30 + X, y + 10 + Y + 35);
xzCtx.lineTo(x + 10 + X, y + 10 + Y + 35);
xzCtx.lineTo(x + 10 + X, y + 10 + Y + 35);
xzCtx.lineTo(x + 10 + X, y + 10 + Y + 15);
xzCtx.lineTo(x + 30 + X, y + 10 + Y + 15);
xzCtx.stroke();
xzCtx.fill();
}
/**
* @description 7、叉线
* wiredCables
* */
function wiredCables (x, y, lineWidth, bgColor) {
xzCtx.beginPath();
xzCtx.lineWidth = lineWidth;
xzCtx.strokeStyle = bgColor;
xzCtx.moveTo(x - 10, y + 15);
xzCtx.lineTo(x + 10, y - 15);
xzCtx.moveTo(x - 10, y - 15);
xzCtx.lineTo(x + 10, y + 15);
xzCtx.stroke();
xzCtx.fill();
}
/**
* @description 8、文字
* wiredCables
* */
/**
* @description 8、文字
* wiredCables
* */
function drawText (text, x, y, color, font, textAlign) {
xzCtx.font = font;
xzCtx.textAlign = textAlign;
xzCtx.fillStyle = color;
xzCtx.fillText(text, x, y);
}
function drawText (text, x, y, color, font, textAlign) {
xzCtx.font = font;
xzCtx.textAlign = textAlign;
xzCtx.fillStyle = color;
xzCtx.fillText(text, x, y);
function initCanvas () { //onload事件加载该方法,当HTML5页面加载的时候就会回调该方法
// 适应塔吊的高的高度
// 150 是驾驶舱底部的开始高度 180是预留的底座的高度
const autoHeight = canvasHeight - 150 - 60
const autoWidth = canvasWidth - 170 - 60
let maxHeightAutoI = 0
for (let i = 0; i * 30 < autoHeight; i++) {
/** 画矩形 */
drawRect(150, 160 + i * 30, 20, 30, false, false, mainColor);
/** 画点 */
drawArc(150, 160 + i * 30, 2, 0, 360, false, false, true, mainColor);
drawArc(170, 160 + i * 30, 2, 0, 360, false, false, true, mainColor);
/** 话叉线 */
wiredCables(160, 175 + i * 30, 1, mainColor)
maxHeightAutoI = i
}
maxHeightAutoI += 1
// 底座
drawLine(110, 160 + maxHeightAutoI * 30, 210, 160 + maxHeightAutoI * 30, 1, mainColor);
drawLine(135, 160 + maxHeightAutoI * 30, 150, 160 + (maxHeightAutoI - 2) * 30, 1, mainColor);
drawLine(185, 160 + maxHeightAutoI * 30, 170, 160 + (maxHeightAutoI - 2) * 30, 1, mainColor);
// 右臂斜线
let maxWidthAutoI = 0
for (let i = 0; i * 20 < autoWidth; i++) {
drawLine(170 + i * 20, 110, 180 + i * 20, 90, 1, mainColor);
drawLine(190 + i * 20, 110, 180 + i * 20, 90, 1, mainColor);
maxWidthAutoI = i
}
// 右臂上下线条
maxWidthAutoI += 1
drawLine(170, 110, 170 + maxWidthAutoI * 20, 110, 1, mainColor);
drawLine(180, 90, 180 + maxWidthAutoI * 20 - 20, 90, 1, mainColor);
// 驾驶舱左
drawRect(150, 115, 10, 40, false, true, mainColor);
//左小重物
drawRect(57, 113, 9, 15, false, true, mainColor);
drawRect(67, 113, 9, 15, false, true, mainColor);
drawRect(77, 113, 9, 15, false, true, mainColor);
//驾驶室
drawLine(160, 115, 170, 115, 1, mainColor);
drawLine(170, 115, 180, 135, 1, mainColor);
drawLine(180, 135, 160, 135, 1, mainColor);
drawLine(180, 135, 170, 155, 1, mainColor);
drawLine(170, 155, 160, 155, 1, mainColor);
//塔吊尖
drawLine(150, 110, 170, 110, 1, mainColor);
drawLine(150, 110, 160, 20, 1, mainColor);
drawLine(170, 110, 160, 20, 1, mainColor);
drawLine(152, 90, 168, 90, 1, mainColor);
drawLine(155, 70, 165, 70, 1, mainColor);
drawLine(158, 50, 162, 50, 1, mainColor);
drawLine(160, 45, 85, 80, 1, mainColor);
drawLine(160, 45, 88, 80, 1, mainColor);
drawLine(160, 45, 91, 80, 1, mainColor);
drawLine(160, 45, 240, 90, 1, mainColor);
drawLine(160, 45, 243, 90, 1, mainColor);
drawLine(160, 45, 246, 90, 1, mainColor);
drawLine(160, 45, 350, 90, 1, mainColor);
drawLine(160, 45, 353, 90, 1, mainColor);
drawLine(160, 45, 356, 90, 1, mainColor);
//左吊臂
drawLine(55, 110, 150, 110, 1, mainColor);
drawLine(55, 110, 55, 80, 1, mainColor);
drawLine(85, 110, 85, 80, 1, mainColor);
drawLine(115, 110, 115, 80, 1, mainColor);
drawLine(145, 110, 145, 80, 1, mainColor);
drawLine(55, 100, 145, 100, 1, mainColor);
drawLine(55, 90, 145, 90, 1, mainColor);
drawLine(55, 80, 145, 80, 1, mainColor);
//左小重物竖线
drawLine(62, 110, 62, 130, 1, mainColor);
drawLine(72, 110, 72, 130, 1, mainColor);
drawLine(82, 110, 82, 130, 1, mainColor);
//6.控制吊钩的运动 以(165,110)为原点 X~(0--180),Y~(0--240)
variousHooks(110, 110, 180, 444, mainColor)
//8 吊钩区域文字
// drawText('尾臂: ', 20, 35, "#01adec", '18px 微软雅黑', "left")
// drawText('12.5米', 65, 35, "#01adec", '18px 微软雅黑', "left")
// drawText('倾角: ', 20, 240, "#01adec", '18px 微软雅黑', "left")
// drawText('0°', 65, 240, "#01adec", '18px 微软雅黑', "left")
// drawText('更新时间: ', 75, 430, "#01adec", '18px 微软雅黑', "left")
// drawText('2018-11-12', 160, 430, "#01adec", '18px 微软雅黑', "left")
// drawText('14:57:30', 275, 430, "#01adec", '18px 微软雅黑', "left")
// drawText('长臂: ', 280, 35, "#01adec", '18px 微软雅黑', "left")
// drawText('30.26米', 325, 35, "#01adec", '18px 微软雅黑', "left")
}
initCanvas()
}
function initCanvas () { //onload事件加载该方法,当HTML5页面加载的时候就会回调该方法
// 适应塔吊的高的高度
// 150 是驾驶舱底部的开始高度 180是预留的底座的高度
const autoHeight = canvasHeight - 150 - 60
const autoWidth = canvasWidth - 170 - 60
let maxHeightAutoI = 0
for (let i = 0; i * 30 < autoHeight; i++) {
/** 画矩形 */
drawRect(150, 160 + i * 30, 20, 30, false, false, mainColor);
/** 画点 */
drawArc(150, 160 + i * 30, 2, 0, 360, false, false, true, mainColor);
drawArc(170, 160 + i * 30, 2, 0, 360, false, false, true, mainColor);
/** 话叉线 */
wiredCables(160, 175 + i * 30, 1, mainColor)
maxHeightAutoI = i
}
useEffect(() => {
draw('xy')
draw('xz')
//
dispatch(getCrane())
//
ws = new WebSocket(`ws://10.8.30.183:4100/${ApiTable.dataLive}`); //建立websocket连接
ws.onopen = function (e) {
console.log("websocket 连接成功");
interval = setInterval(() => {
// console.log("发送心跳保持长连接不超时断开");
this.send(JSON.stringify({ "act": "ma_get_active_devices" }));
}, 20000);//20秒一次
}
ws.onerror = e => {
console.log("websocket 发生错误：" + e)
}
ws.onmessage = evt => {
let msg = JSON.parse(evt.data);
console.log(msg);
if (msg) {
setCraneParams(msg)
draw('xy', msg)
draw('xz', msg)
}
maxHeightAutoI += 1
// 底座
drawLine(110, 160 + maxHeightAutoI * 30, 210, 160 + maxHeightAutoI * 30, 1, mainColor);
drawLine(135, 160 + maxHeightAutoI * 30, 150, 160 + (maxHeightAutoI - 2) * 30, 1, mainColor);
drawLine(185, 160 + maxHeightAutoI * 30, 170, 160 + (maxHeightAutoI - 2) * 30, 1, mainColor);
// 右臂斜线
let maxWidthAutoI = 0
for (let i = 0; i * 20 < autoWidth; i++) {
drawLine(170 + i * 20, 110, 180 + i * 20, 90, 1, mainColor);
drawLine(190 + i * 20, 110, 180 + i * 20, 90, 1, mainColor);
maxWidthAutoI = i
}
return () => {
if (ws) {
ws.close();//关闭连接
window.clearInterval(interval);
}
// 右臂上下线条
maxWidthAutoI += 1
drawLine(170, 110, 170 + maxWidthAutoI * 20, 110, 1, mainColor);
drawLine(180, 90, 180 + maxWidthAutoI * 20 - 20, 90, 1, mainColor);
// 驾驶舱左
drawRect(150, 115, 10, 40, false, true, mainColor);
//左小重物
drawRect(57, 113, 9, 15, false, true, mainColor);
drawRect(67, 113, 9, 15, false, true, mainColor);
drawRect(77, 113, 9, 15, false, true, mainColor);
//驾驶室
drawLine(160, 115, 170, 115, 1, mainColor);
drawLine(170, 115, 180, 135, 1, mainColor);
drawLine(180, 135, 160, 135, 1, mainColor);
drawLine(180, 135, 170, 155, 1, mainColor);
drawLine(170, 155, 160, 155, 1, mainColor);
//塔吊尖
drawLine(150, 110, 170, 110, 1, mainColor);
drawLine(150, 110, 160, 20, 1, mainColor);
drawLine(170, 110, 160, 20, 1, mainColor);
drawLine(152, 90, 168, 90, 1, mainColor);
drawLine(155, 70, 165, 70, 1, mainColor);
drawLine(158, 50, 162, 50, 1, mainColor);
drawLine(160, 45, 85, 80, 1, mainColor);
drawLine(160, 45, 88, 80, 1, mainColor);
drawLine(160, 45, 91, 80, 1, mainColor);
drawLine(160, 45, 240, 90, 1, mainColor);
drawLine(160, 45, 243, 90, 1, mainColor);
drawLine(160, 45, 246, 90, 1, mainColor);
drawLine(160, 45, 350, 90, 1, mainColor);
drawLine(160, 45, 353, 90, 1, mainColor);
drawLine(160, 45, 356, 90, 1, mainColor);
//左吊臂
drawLine(55, 110, 150, 110, 1, mainColor);
drawLine(55, 110, 55, 80, 1, mainColor);
drawLine(85, 110, 85, 80, 1, mainColor);
drawLine(115, 110, 115, 80, 1, mainColor);
drawLine(145, 110, 145, 80, 1, mainColor);
drawLine(55, 100, 145, 100, 1, mainColor);
drawLine(55, 90, 145, 90, 1, mainColor);
drawLine(55, 80, 145, 80, 1, mainColor);
//左小重物竖线
drawLine(62, 110, 62, 130, 1, mainColor);
drawLine(72, 110, 72, 130, 1, mainColor);
drawLine(82, 110, 82, 130, 1, mainColor);
//6.控制吊钩的运动 以(165,110)为原点 X~(0--180),Y~(0--240)
variousHooks(110, 110, 180, 444, mainColor)
//8 吊钩区域文字
// drawText('尾臂: ', 20, 35, "#01adec", '18px 微软雅黑', "left")
// drawText('12.5米', 65, 35, "#01adec", '18px 微软雅黑', "left")
// drawText('倾角: ', 20, 240, "#01adec", '18px 微软雅黑', "left")
// drawText('0°', 65, 240, "#01adec", '18px 微软雅黑', "left")
// drawText('更新时间: ', 75, 430, "#01adec", '18px 微软雅黑', "left")
// drawText('2018-11-12', 160, 430, "#01adec", '18px 微软雅黑', "left")
// drawText('14:57:30', 275, 430, "#01adec", '18px 微软雅黑', "left")
// drawText('长臂: ', 280, 35, "#01adec", '18px 微软雅黑', "left")
// drawText('30.26米', 325, 35, "#01adec", '18px 微软雅黑', "left")
}
initCanvas()
}, [])
console.log(darkColor, darkModde ? darkColor.textColor : 'auto');
@ -426,9 +478,14 @@ function Index (props) {
background: darkModde ? darkColor.background : 'auto'
}}>
<div style={{ padding: '0 8px 8px', textAlign: 'right' }}>
<Button type="primary" size={'large'} style={{}} icon={<SettingOutlined />} onClick={() => setIsModalOpen(true)}>
设置
</Button>
<Space>
<Button type="primary" size={'large'} style={{}} icon={<VideoCameraOutlined />} onClick={() => { }}>
监控视频
</Button>
<Button type="primary" size={'large'} style={{}} icon={<SettingOutlined />} onClick={() => setIsModalOpen(true)}>
设置
</Button>
</Space>
</div>
<div style={{ height: 'calc(80% - 40px)', padding: 8 }}>
@ -454,32 +511,40 @@ function Index (props) {
{
[{
k: '高度',
v: '100m',
s: '上升',
v: 'tower_height',
s: '-',
unit: 'm'
}, {
k: '幅度',
v: '100m',
s: '上升',
v: 'max_amp',
s: '-',
}, {
k: '回转',
v: '100m',
s: '上升',
k: '回转角',
v: 'rotation',
s: '-',
unit: '°',
dataFrom: 'live',
}, {
k: '重量',
v: '100m',
s: '上升',
v: 'x',
s: '-',
}, {
k: '力矩',
v: '100m',
s: '上升',
v: 'max_torque',
s: '-',
unit: 'KN*m'
}, {
k: '风速',
v: '100m',
s: '上升',
k: '俯仰角',
v: 'pitch',
s: '-',
unit: '°',
dataFrom: 'live',
}, {
k: '倾角',
v: '100m',
s: '上升',
k: '倾斜角',
v: 'inclination',
s: '-',
unit: '°',
dataFrom: 'live',
}, {
k: '',
v: '',
@ -495,9 +560,35 @@ function Index (props) {
{
s.k ?
<>
<h2 style={{ color: darkModde ? darkColor.textColor : 'auto' }}>{s.k}</h2>
<p style={{ color: darkModde ? darkColor.subTextColor : 'auto' }}>{s.v}</p>
<span className="status">{s.s}</span>
<h2 style={{ color: darkModde ? darkColor.textColor : 'auto' }}>
{s.k}
</h2>
<p style={{ color: darkModde ? darkColor.subTextColor : 'auto' }}>
{
s.dataFrom === 'live' ?
(
craneParams[s.v]?.Value || '-'
) + (
craneParams[s.v] && s.unit ? s.unit : ''
)
:
(
craneData[s.v] || '-'
) + (
craneData[s.v] && s.unit ? s.unit : ''
)
}
</p>
<span className="status" style={{
backgroundColor: s.dataFrom === 'live' && craneParams[s.v]?.Warn ? Colors.getAlarmLevelColors(craneParams[s.v]?.Warn) : undefined
}}>
{
s.dataFrom === 'live' ?
(craneParams[s.v]?.State || '-')
:
s.s
}
</span>
</>
: ''
}
@ -516,15 +607,17 @@ function Index (props) {
setIsModalOpen(false)
}}
>
<Input.Password size="large" placeholder="请输入密码" />
<Input.Password size="large" placeholder="请输入密码" />
</Modal>
</div>
)
}
function mapStateToProps (state) {
const { auth } = state;
return {}
const { crane } = state;
return {
craneData: crane.data || {}
}
}
export default connect(mapStateToProps)(Index);

256
console/client/src/sections/console/containers/setUp.js
View File

@ -1,35 +1,26 @@
import React, { useEffect, useState, useRef } from 'react'
import { push } from 'react-router-redux';
import request from 'superagent';
import { connect } from 'react-redux';
import { editCrane } from '../actions'
import {
BorderlessTableOutlined, BlockOutlined, RollbackOutlined
BorderlessTableOutlined, BlockOutlined, RollbackOutlined, SaveOutlined
} from '@ant-design/icons';
import { Col, Row, Button, Modal, Form, Input } from 'antd';
import { Col, Row, Button, Modal, Form, Input, InputNumber, message } from 'antd';
import '../style.less'
function SetUp ({ dispatch }) {
const [form] = Form.useForm();
const [renderMenu, setRenderMenu] = useState([])
const [renderForm, setRenderForm] = useState(false)
const [formItems, setFormItems] = useState([])
const [formIndex, setFormIndex] = useState(0)
const [levelOneMenu] = useState([{
n: '参数标定',
ic: <BlockOutlined className='setup-icon' />,
click: () => {
setRenderMenu([
{
n: '塔机参数',
ic: <BorderlessTableOutlined className='setup-icon' />,
click: () => {
setRenderForm(true)
}
}, {
n: '返回',
ic: <RollbackOutlined className='setup-icon' />,
click: () => {
setRenderMenu(levelOneMenu)
}
},
])
setTowerCraneParams()
}
}, {
n: '限位告警参数',
@ -42,48 +33,225 @@ function SetUp ({ dispatch }) {
}
},])
const setTowerCraneParams = () => {
setRenderForm(false)
setFormIndex(0)
setRenderMenu([
{
n: '塔机参数',
ic: <BorderlessTableOutlined className='setup-icon' />,
click: () => {
setRenderForm(true)
setFormIndex(1)
setFormItems([
{
label: '设备编号',
name: 'device_no',
type: 'string',
},
{
label: '经度',
name: 'longitude',
type: 'number',
},
{
label: '纬度',
name: 'latitude',
type: 'number',
},
{
label: '大臂长度',
name: 'boom_length',
type: 'number',
},
{
label: '小臂长度',
name: 'jib_length',
type: 'number',
},
{
label: '倍率',
name: 'magnification_ratio',
type: 'number',
},
{
label: '最大幅度',
name: 'max_amp',
type: 'number',
},
{
label: '最大高度',
name: 'max_height',
type: 'number',
},
{
label: '最大力矩（KN*m）',
name: 'max_torque',
type: 'number',
},
{
label: '最大起重量',
name: 'max_weight',
type: 'number',
},
{
label: '塔机编号',
name: 'tc_num',
type: 'string',
},
{
label: '塔高',
name: 'tower_height',
type: 'number',
},
{
label: '坐标 X',
name: 'x',
type: 'number',
},
{
label: '坐标 Y',
name: 'y',
type: 'number',
},
])
}
}, {
n: '返回',
ic: <RollbackOutlined className='setup-icon' />,
click: () => {
setRenderMenu(levelOneMenu)
}
},
])
}
useEffect(() => {
setRenderMenu(levelOneMenu)
}, [])
const mapMenu = (item, index) => {
return (
<div key={index} style={{ width: 168, textAlign: 'center', margin: 32, boxShadow: ' 0 0 10px var(--antd-wave-shadow-color)' }} onClick={item.click}>
{item.ic}
<div style={{ lineHeight: '64px', fontSize: 24 }}>
{item.n}
</div>
</div>
)
}
return (
<div style={{ height: '100vh' }}>
<div style={{ display: 'flex', height: '100%', justifyContent: 'center', alignItems: 'center' }}>
{
renderMenu.map((item, index) => {
return (
<div key={index} style={{ width: 168, textAlign: 'center', margin: 32, boxShadow: ' 0 0 10px var(--antd-wave-shadow-color)' }} onClick={item.click}>
{item.ic}
<div style={{ lineHeight: '64px', fontSize: 24 }}>
{item.n}
</div>
</div>
)
})
}
</div>
{/* <Form form={form} name="control-hooks" >
<Form.Item
name="note"
label="Note"
rules={[
{
!renderForm ?
<div style={{ display: 'flex', height: '100%', justifyContent: 'center', alignItems: 'center' }}>
{
required: true,
renderMenu.map(mapMenu)
}
</div>
: ''
}
{
renderForm ?
<Form form={form} {...{
labelCol: {
span: 6,
},
]}
>
<Input />
</Form.Item>
</Form> */}
wrapperCol: {
span: 18,
},
}} name="control-hooks" size='large'>
<Row style={{ padding: '8% 12% 0' }}>
{
(() => {
const halfItemNum = Math.ceil(formItems.length / 2)
const leftItems = formItems.slice(0, halfItemNum)
const rightItems = formItems.slice(halfItemNum)
const mapItem = (item, index) => {
return (
<Form.Item
key={index}
name={item.name}
label={item.label}
// rules={[{
// // required: true,
// // message: '请输入' + item.label
// }]}
>
{
item.type === 'number' ?
<InputNumber style={{ width: '100%' }} /> :
<Input />
}
</Form.Item>
)
}
return [
<Col span={12} style={{ paddingRight: 24 }}>
{leftItems.map(mapItem)}
</Col>
,
<Col span={12} style={{ paddingLeft: 24 }}>
{rightItems.map(mapItem)}
</Col>
]
})()
}
</Row>
<div style={{ display: 'flex', justifyContent: 'space-around' }}>
{
[{
n: '保存',
ic: <SaveOutlined className='setup-icon' />,
click: () => {
if (formIndex == 1) {
const values = form.getFieldsValue()
console.log(values);
dispatch(editCrane(values)).then(res => {
console.log(res
);
if (res.success) {
message.success('修改配置信息成功')
} else {
message.error('修改配置信息失败')
}
})
// setTowerCraneParams()
}
}
}, {
n: '返回',
ic: <RollbackOutlined className='setup-icon' />,
click: () => {
if (formIndex == 1) {
setTowerCraneParams()
}
}
},].map(mapMenu)
}
</div>
</Form>
: ''
}
<div>
</div>
</div>
)
}
function mapStateToProps (state) {
console.log(state);
const { auth } = state;
return {}
return {
}
}
export default connect(mapStateToProps)(SetUp);

4
console/client/src/sections/console/nav-item.js
View File

@ -4,8 +4,8 @@ import { Menu } from 'antd';
import { HomeOutlined } from '@ant-design/icons';
export function getNavItem() {
return (
<Menu.Item key="homePage" icon={<HomeOutlined />}>
<Link to="/homePage">首页</Link>
<Menu.Item key="console" icon={<HomeOutlined />}>
<Link to="/">控制台</Link>
</Menu.Item>
);
}

16
console/client/src/utils/webapi.js
View File

@ -2,13 +2,17 @@
import request from 'superagent';
export const ApiTable = {
login: 'login',
logout: 'logout',
validatePhone: 'validate/phone',
login: 'login',
logout: 'logout',
validatePhone: 'validate/phone',
// console
dataLatest: 'v1/data/latest',
craneSetting: 'v1/settings',
dataLive: 'v1/data/live',
};
export const RouteTable = {
fileUpload: '/_upload/new',
cleanUpUploadTrash: '/_upload/cleanup',
fileUpload: '/_upload/new',
cleanUpUploadTrash: '/_upload/cleanup',
};

1
console/config.js
View File

@ -22,7 +22,6 @@ args.option('qndmn', 'qiniuDomain');
const flags = dev ? args.parse(process.argv) : {};
const FS_UNIAPP_API =
`http://localhost:4600` ||
process.env.FS_UNIAPP_API ||
flags.apiUrl;

77
console/log/development.txt
View File

@ -1,2 +1,79 @@
2023-03-14 15:50:33.526 - debug: [FS-LOGGER] Init.
2023-03-14 15:50:33.759 - info: [Router] Inject api: attachment/index
2023-03-28 14:41:25.457 - debug: [FS-LOGGER] Init.
2023-03-28 14:41:25.778 - info: [Router] Inject api: attachment/index
2023-03-28 14:44:17.446 - error: [FS-ERRHD]
{
message: 'Error: connect ECONNREFUSED 127.0.0.1:4600',
name: 'RequestError',
cause: {
errno: 'ECONNREFUSED',
code: 'ECONNREFUSED',
syscall: 'connect',
address: '127.0.0.1',
port: 4600
},
error: { '$ref': '$["cause"]' },
options: {
jar: false,
url: 'http://localhost:4600/settings',
headers: {
host: 'localhost:4600',
connection: 'keep-alive',
'content-length': '30',
'sec-ch-ua': '"Chromium";v="110", "Not A(Brand";v="24", "Google Chrome";v="110"',
'sec-ch-ua-platform': '"Windows"',
'sec-ch-ua-mobile': '?0',
'user-agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/110.0.0.0 Safari/537.36',
'content-type': 'application/json',
'cache-control': 'no-cache,no-store,must-revalidate,max-age=-1,private',
'x-requested-with': 'XMLHttpRequest',
expires: '-1',
accept: '*/*',
origin: 'http://localhost:5400',
'sec-fetch-site': 'same-origin',
'sec-fetch-mode': 'cors',
'sec-fetch-dest': 'empty',
referer: 'http://localhost:5400/setup',
'accept-encoding': 'gzip, deflate, br',
'accept-language': 'zh-CN,zh;q=0.9'
},
encoding: null,
followRedirect: true,
method: 'POST',
body: '{"tower_height":22222,"x":111}',
simple: false,
resolveWithFullResponse: true,
callback: [Function: RP$callback],
transform: undefined,
transform2xxOnly: false
},
response: undefined,
stack: 'RequestError: Error: connect ECONNREFUSED 127.0.0.1:4600\n' +
' at new RequestError (C:\\_WorkCode\\CraneAntiCollision\\console\\node_modules\\request-promise-core\\lib\\errors.js:14:15)\n' +
' at Request.plumbing.callback (C:\\_WorkCode\\CraneAntiCollision\\console\\node_modules\\request-promise-core\\lib\\plumbing.js:87:29)\n' +
' at Request.RP$callback [as _callback] (C:\\_WorkCode\\CraneAntiCollision\\console\\node_modules\\request-promise-core\\lib\\plumbing.js:46:31)\n' +
' at self.callback (C:\\_WorkCode\\CraneAntiCollision\\console\\node_modules\\request\\request.js:185:22)\n' +
' at Request.emit (events.js:314:20)\n' +
' at Request.onRequestError (C:\\_WorkCode\\CraneAntiCollision\\console\\node_modules\\request\\request.js:877:8)\n' +
' at ClientRequest.emit (events.js:314:20)\n' +
' at Socket.socketErrorListener (_http_client.js:427:9)\n' +
' at Socket.emit (events.js:314:20)\n' +
' at emitErrorNT (internal/streams/destroy.js:92:8)\n' +
' at emitErrorAndCloseNT (internal/streams/destroy.js:60:3)\n' +
' at processTicksAndRejections (internal/process/task_queues.js:84:21)'
}
2023-03-28 14:45:03.014 - debug: [FS-LOGGER] Init.
2023-03-28 14:45:03.232 - info: [Router] Inject api: attachment/index
2023-03-28 15:21:28.503 - debug: [FS-LOGGER] Init.
2023-03-28 15:21:28.747 - info: [Router] Inject api: attachment/index
2023-03-28 15:42:42.554 - debug: [FS-LOGGER] Init.
2023-03-28 15:42:42.743 - info: [Router] Inject api: attachment/index
2023-03-28 16:39:29.707 - debug: [FS-LOGGER] Init.
2023-03-28 16:39:29.892 - info: [Router] Inject api: attachment/index
2023-03-28 16:50:59.167 - debug: [FS-LOGGER] Init.
2023-03-28 16:50:59.377 - info: [Router] Inject api: attachment/index
2023-03-28 17:10:51.565 - debug: [FS-LOGGER] Init.
2023-03-28 17:10:51.751 - info: [Router] Inject api: attachment/index
2023-03-29 11:10:34.765 - debug: [FS-LOGGER] Init.
2023-03-29 11:10:35.030 - info: [Router] Inject api: attachment/index

24244
console/package-lock.json
View File

File diff suppressed because it is too large

2
console/package.json
View File

@ -8,7 +8,7 @@
"test": "mocha",
"start-elctr-forge": "electron-forge start",
"start": "cross-env NODE_ENV=development npm run start-params",
"start-params": "node server -p 5400 -u http://127.0.0.1:4400",
"start-params": "node server -p 5400 -u http://10.8.30.183:4100",
"deploy": "export NODE_ENV=production && npm run build && node server",
"build-dev": "set NODE_ENV=development&&webpack --config webpack.config.js",
"build": "set NODE_ENV=production&&webpack --config webpack.config.prod.js",

Write Preview
Loading…
Cancel
Save