import React, { useState, useRef, useEffect } from 'react';
|
import { Card, Form, Button } 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 ShowJson from '../showJson';
|
import ShelfView from './view'
|
|
const useStyles = createStyles(({ token, css }) => {
|
|
})
|
|
const ShelfDrawer = (props) => {
|
const intl = useIntl();
|
const { styles } = useStyles();
|
const { curSprite, curFloor } = props;
|
|
const [activeTabKey, setActiveTabKey] = useState('view');
|
const [curLocNo, setCurLocNo] = React.useState(curSprite.data.no + '-' + curFloor);
|
|
useEffect(() => {
|
const locNo = curSprite.data.no + '-' + curFloor;
|
props.setDrawerTitle(intl.formatMessage({ id: 'map.loc.no', defaultMessage: '库位号' }) + ': ' + locNo);
|
setCurLocNo(locNo);
|
}, [curSprite]);
|
|
useEffect(() => {
|
if (!curSprite) {
|
return
|
}
|
console.log("curLocNo - " + curLocNo);
|
props.setDrawerTitle(intl.formatMessage({ id: 'map.loc.no', defaultMessage: '库位号' }) + ': ' + curLocNo);
|
}, [curLocNo]);
|
|
const contentList = {
|
view: (
|
<ShelfView
|
curLocNo={curLocNo}
|
setCurLocNo={setCurLocNo}
|
data={curSprite.data}
|
curFloor={curFloor}
|
/>
|
),
|
json: (
|
<ShowJson
|
data={curSprite.data}
|
/>
|
),
|
};
|
|
return (
|
<>
|
<Card
|
className='drawer-card'
|
hoverable
|
bordered={false}
|
type='inner'
|
tabList={[
|
{
|
key: 'view',
|
tab: intl.formatMessage({ id: 'map.drawer.shelf.view.title', defaultMessage: '库位信息' }),
|
},
|
{
|
key: 'json',
|
tab: intl.formatMessage({ id: 'map.drawer.json', defaultMessage: 'JSON' }),
|
},
|
]}
|
activeTabKey={activeTabKey}
|
onTabChange={(key) => {
|
setActiveTabKey(key)
|
}}
|
tabProps={{
|
centered: true,
|
size: 'large',
|
type: "card",
|
style: {
|
}
|
}}
|
style={{
|
height: '100%'
|
}}
|
>
|
{contentList[activeTabKey]}
|
</Card>
|
</>
|
)
|
}
|
|
export default ShelfDrawer;
|