admin/src/pages/package/index.jsx

import React from 'react';
import { PageContainer } from '@ant-design/pro-components';
import { Button, Row, Col, Card } from 'antd';
import List from './List';
import BasicForm from './BasicForm';
import DishList from './DishList';

import './style.less';

export default (props) => {
  const [current, setCurrent] = React.useState({});
  const pkgRef = React.useRef();
  const dishRef = React.useRef();

  const onAdd = () => pkgRef.current.new();
  const onDishAdd = () => dishRef.current.new();

  return (
    <Row gutter={24}>
      <Col span={12}>
        <Card title="套餐列表" extra={<Button type='primary' onClick={onAdd}>新增</Button>}>
          <List ref={pkgRef} current={current} setCurrent={setCurrent}/>
        </Card>
      </Col>
      <Col span={12}>
        <Card title={`${current.name || '套餐'} 明细`} extra={<Button onClick={onDishAdd}>新增</Button>}>
          <DishList current={current} ref={dishRef} />
        </Card>
      </Col>
    </Row>
  )
}