import React, { useState, useRef, useEffect } from 'react';
|
import { Descriptions, Button, Skeleton, Badge, Space } from 'antd';
|
import { FormattedMessage, useIntl, useModel } from '@umijs/max';
|
import { createStyles } from 'antd-style';
|
import * as Utils from '../../utils'
|
import Http from '@/utils/http';
|
import BoolValueIcon from '@/components/BoolValueIcon';
|
|
const useStyles = createStyles(({ token, css }) => {
|
return {
|
infoBox: {
|
height: '100%',
|
display: 'flex',
|
gap: '0px',
|
},
|
tableInfo: {
|
height: '100%',
|
width: '100%',
|
padding: '0 10px 0 15px',
|
overflow: 'auto',
|
},
|
tableButton: {
|
width: '100%',
|
marginBottom: '10px',
|
fontWeight: 'bold',
|
letterSpacing: '1px',
|
}
|
}
|
})
|
|
|
|
const ShuttleView = (props) => {
|
const intl = useIntl();
|
const { styles } = useStyles();
|
|
const { data } = props;
|
const [loading, setLoading] = React.useState(false);
|
const [info, setInfo] = React.useState(null);
|
|
useEffect(() => {
|
setLoading(true);
|
const fetchShuttleInfo = async (shuttleNo) => {
|
const res = await Http.doGet('/api/map/shuttle/info', { shuttleNo: shuttleNo });
|
if (res?.data) {
|
setInfo(res.data);
|
}
|
setLoading(false);
|
}
|
fetchShuttleInfo(data.no);
|
}, [data]);
|
|
useEffect(() => {
|
console.log(info);
|
}, [info])
|
|
return (
|
<>
|
<div className={styles.infoBox}>
|
{loading ? (
|
<Skeleton active />
|
) : (
|
<div className={styles.tableInfo}>
|
<Descriptions
|
bordered
|
title=''
|
size='middle' // default | middle | small
|
layout="vertical" // horizontal | vertical
|
column={4}
|
items={
|
[
|
{
|
label: intl.formatMessage({ id: 'map.shuttle.no', defaultMessage: '穿梭车编号' }),
|
children: info?.shuttleNo,
|
},
|
{
|
label: intl.formatMessage({ id: 'map.task.no', defaultMessage: '任务号' }),
|
children: info?.taskNo,
|
},
|
{
|
label: intl.formatMessage({ id: 'map.device.status', defaultMessage: '设备状态' }),
|
children: <Badge status="processing" text={info?.status} />,
|
},
|
{
|
label: intl.formatMessage({ id: 'map.shuttle.current.code', defaultMessage: '定位条码' }),
|
children: info?.currentCode,
|
},
|
{
|
label: intl.formatMessage({ id: 'map.loc.no', defaultMessage: '库位号' }),
|
children: <Badge status="processing" text="Running" />,
|
},
|
{
|
label: intl.formatMessage({ id: 'map.pallet.barcode', defaultMessage: '托盘条码' }),
|
children: '80000010',
|
},
|
{
|
label: intl.formatMessage({ id: 'map.origin.loc', defaultMessage: '起始库位' }),
|
children: info?.originLocNo,
|
},
|
{
|
label: intl.formatMessage({ id: 'map.dest.loc', defaultMessage: '目标库位' }),
|
children: info?.destLocNo,
|
},
|
|
{
|
label: intl.formatMessage({ id: 'map.shuttle.batter.power', defaultMessage: '电池电量' }),
|
children: info?.batteryPower,
|
},
|
{
|
label: intl.formatMessage({ id: 'map.shuttle.batter.voltage', defaultMessage: '电池电压' }),
|
children: info?.batteryVoltage,
|
},
|
{
|
label: intl.formatMessage({ id: 'map.shuttle.batter.temp', defaultMessage: '电池温度' }),
|
children: info?.batteryTemp,
|
},
|
{
|
label: intl.formatMessage({ id: 'map.error', defaultMessage: '异常信号' }),
|
children: info?.errorCode,
|
},
|
{
|
label: intl.formatMessage({ id: 'map.shuttle.has.lift', defaultMessage: '顶升信号' }),
|
children: <BoolValueIcon value={info?.hasLift} />,
|
},
|
{
|
label: intl.formatMessage({ id: 'map.shuttle.has.pallet', defaultMessage: '托盘信号' }),
|
children: <BoolValueIcon value={info?.hasPallet} />,
|
},
|
{
|
label: intl.formatMessage({ id: 'map.shuttle.has.charge', defaultMessage: '充电信号' }),
|
children: <BoolValueIcon value={info?.hasCharge} />,
|
},
|
{
|
label: intl.formatMessage({ id: 'map.pakmk', defaultMessage: '作业标记' }),
|
children: <BoolValueIcon value={info?.pakMk} />,
|
},
|
{
|
label: intl.formatMessage({ id: 'map.is.enable', defaultMessage: '是否启用' }),
|
children: 'Disabled',
|
},
|
{
|
label: intl.formatMessage({ id: 'map.loc.operation', defaultMessage: '库位操作' }),
|
span: 3,
|
children: (
|
<>
|
<Button className={styles.tableButton} size='default' type="primary" danger>
|
<FormattedMessage id='map.loc.lock' defaultMessage='锁定' />
|
</Button>
|
<Button className={styles.tableButton} size='default' disabled>
|
<FormattedMessage id='map.loc.unlock' defaultMessage='解锁' />
|
</Button>
|
<Button className={styles.tableButton} size='default'>
|
<FormattedMessage id='map.loc.reset' defaultMessage='清除库位' />
|
</Button>
|
</>
|
)
|
},
|
]
|
}
|
/>
|
</div>
|
)}
|
</div>
|
</>
|
)
|
}
|
|
export default ShuttleView;
|
