dashboard/src/views/Hotel.jsx

import React, { useContext } from 'react';
import { observer } from 'mobx-react';
import { stores_Context } from '../config';
import { Row, Col, Table } from 'antd';
import SearchForm from './../components/search/SearchForm';

export default observer((props) => {
  const { sale_store, date_picker_store: searchFormStore } = useContext(stores_Context);
  const { customerServicesStore, date_picker_store } = useContext(stores_Context);

  const { formValues, siderBroken } = searchFormStore;

  const tableProps = {
    size: 'small',
    columns: [
      { title: '目的地', dataIndex: 'op', key: 'op' },
      { title: '总间夜', dataIndex: 'action', key: 'action' },
      { title: '主推', dataIndex: 'action', key: 'action' },
      { title: '使用比例', dataIndex: 'action', key: 'action' },
    ],
  };

  return (
    <>
      <Row gutter={16} className={siderBroken ? '' : 'sticky-top'}>
        <Col md={24} lg={24} xxl={24}>
          <SearchForm
            defaultValue={{
              initialValue: {
                ...date_picker_store.formValues,
                ...customerServicesStore.searchValues,
              },
              // 'countryArea', 'DateType', 'dates',
              shows: ['DepartmentList', 'countryArea', 'orderStatus', 'bookType', 'recommandRate','hotelStar','DateType', 'dates',],
              sort: { DateType: 101, dates: 102 },
              fieldProps: {
                DepartmentList: { show_all: true, mode: 'multiple' },
                orderStatus: { show_all: true },
                // years: { hide_vs: false },
                DateType: { disabledKeys: ['applyDate'] },
              },
            }}
            onSubmit={(_err, obj, form) => {
              customerServicesStore.setSearchValues(obj, form);
              // customerServicesStore.fetchDestinationGroupCount();
            }}
          />
        </Col>
      </Row>
      <section>
        <Table {...tableProps} bordered />
      </section>
    </>
  );
});