import { Layout, Image, Col, Row, Carousel, Spin } from 'antd';
import 'antd/dist/reset.css';
import './App.css';
import axios from 'axios';
import { Component } from 'react';
import { withRouter } from 'react-router-dom';
import TweenOne from 'rc-tween-one';
import PathPlugin from 'rc-tween-one/lib/plugin/SvgDrawPlugin';
const { Header, Footer, Content } = Layout;
TweenOne.plugins.push(PathPlugin);
const headerStyle = {
textAlign: 'center',
color: '#fff',
minHeight: "5vh",
paddingInline: 50,
lineHeight: '64px',
backgroundColor: 'rgb(49, 70, 89)',
};
const contentStyle = {
textAlign: 'center',
minHeight: "90vh",
backgroundColor: 'white'
};
const footerStyle = {
textAlign: 'center',
color: '#fff',
backgroundColor: 'rgb(49, 70, 89)',
};
const empStyle = {
lineHeight: '5vh',
color: 'black',
marginTop: "2px",
fontFamily: "Yahei",
textAlign: 'center',
// fontWeight: 'bold'
}
class HostBoard extends Component {
constructor(props) {
super(props);
//四個看闆資料
this.state = {
current_item: {
employee_no: '',
name: "",
mfg_no: "",
svgdraw: 0,
lineStatus: false,
tractor_lt: "曳引輪法嚮跳動≤0.10mm ",
tractor_rt: "製動器安裝氣間隙與微動開關",
tractor_lb: "轉子徑嚮跳動≤0.05mm",
tractor_rb1: "製動力與空載性能轉矩、電",
tractor_rb2: "壓、電流、異音",
encoderlt: "表面塗裝無繡、油漆無脫落",
encoderrb: "編碼器安裝"
},
current_item_list: [],
paused: true,
reverse: true,
moment: 0,
lineStatus: true,
index: 0,
seq: 1,
start: 0, //從數據庫第0條開始讀
total_record: 0
};
}
componentDidMount() {
const id = this.props.match;
this.setState({ seq: id.params.seq });
this.fetchKabanData();
console.log(this.state);
}
interval = () => {
const { seq } = this.state;
// setInterval(() => this.fetchKabanData(), 20000);
};
afterChange = () => {
const { current_item_list, index } = this.state;
console.info("current_item_list.length");
console.info(current_item_list.length);
console.info(current_item_list);
console.info(index);
var _item = (current_item_list.length) == index
? current_item_list[0]
: current_item_list[index];
this.setState({
paused: false,
reverse: false,
moment: 0,
lineStatus: false,
current_item: _item,
svgdraw: 0,
index: (current_item_list.length == index) ? 0 : index + 1
}, () => {
this.setState({
moment: null,
});
});
}
//每次取四條記錄,
fetchKabanData = async () => {
const { seq, start } = this.state;
let data = await axios.get(`https://www.masada.com.tw/kanban_api/index.php?kind=host&seq=${seq}&start=${start}`)
.then(function (response) {
return {
start: response.data[0],
paused: false,
index: 0,
current_item_list: response.data[1]
}
})
.catch(function (error) {
console.log(error);
})
.finally(function () {
});
this.setState(data, () => {
this.forceUpdate();
});
}
getTractorLt = (current_item) => {
return
}
getTractorRt = (current_item) => {
return
}
getTractorLb = (current_item) => {
return
}
getTractorRb = (current_item) => {
return
}
getEncoderRt = (current_item) => {
return
}
getEncoderRb = (current_item) => {
return
}
render() {
let { current_item, current_item_list, reverse, moment } = { ...this.state };
let items = [current_item_list];
let prop_display = current_item_list.length == 0 ? "none" : "block";
console.info(current_item_list.length);
return (
{/*
{
this.state.current_item_list.map(function (element, index) {
return
姓名:{current_item.name || ""}
員工編號:{current_item.employee_no || ""}
電梯ID:{current_item.mfg_no || ""}
{this.getTractorLt(current_item)}
{this.getTractorLb(current_item)}
{this.getTractorRt(current_item)}
{this.getTractorRb(current_item)}
{this.getEncoderRt(current_item)}
{this.getEncoderRb(current_item)}
{this.getTractorLt(current_item)}
{this.getTractorLb(current_item)}
{this.getTractorRt(current_item)}
{this.getTractorRb(current_item)}
{this.getEncoderRt(current_item)}
{this.getEncoderRb(current_item)}
}, this)
}
{this.state.current_item.name == '' ? : ""}
);
}
}
export default withRouter(HostBoard);