tsg-web/src/views/sz/pxjlgl/chartToolbar.js

import React, { useEffect,useState } from 'react';
import { Form, Upload, Button,Row, Col, Input, DatePicker, message,Modal } from 'antd';
import NormalSelect from '../../../components/Form/NormalSelect';
import moment from 'moment';

const ToolBar = ({ setSearchVal }) => {
  const [form] = Form.useForm();
  const types = [
    {
      label: '培训人次',
      value: 1
    },
    {
      label: '培训期数',
      value: 2
    },
  ]
  const valuesChange = (e,allvalue) => {
    setSearchVal({ ...allvalue,year:moment(allvalue.year).format("YYYY") })
  }

  useEffect(() => {
    const value = {teamName:1,year:moment()}
    form.setFieldsValue(value)
    setSearchVal({...value,year:moment().format("YYYY")})
  }, [])
  
  return (
    <>
      <div style={{display:'flex',justifyContent:'space-between'}}>
        <Form form={form} className='toolbarBox' layout="inline" onValuesChange={valuesChange}>
        <Form.Item label="统计维度" name="teamName">
            <NormalSelect allowClear style={{ width: '150px' }} options={types} />
          </Form.Item>
          <Form.Item label="选择年份" name="year">
            <DatePicker
              allowClear
              showTime 
              style={{ width: "150px" }}
               picker='year'
            />
          </Form.Item>
          
        </Form>
      </div>
  
    </>
  );
}

export default ToolBar;