import React from 'react';
import { connect } from 'dva';
import { Loader} from '@components';
import { Block, Page, Panel, Toolbar } from '@bizComponents';
import localCfg from './localCfg';

const PriceAdjust = ({ priceAdjust, dispatch, loading }) => {
  const { mode, formData, remoteCfg} = priceAdjust;
  const domain = 'priceAdjust';

  //返回
  const handleCancel = () => {
    dispatch({ type: `${domain}/cancel` });
  };

  //提交
  const handleSave = () => {
    dispatch({ type: `${domain}/submit` });
  };

  //同意
  const handleApprove = () => {
    dispatch({ type: `${domain}/approve` });
  };

  //拒绝
  const handleReject = () => {
    dispatch({ type: `${domain}/reject` });
  };

  //审批意见
  const handleAdviceChange = (value) => {
    dispatch({ type: `${domain}/updateState`, payload: { advice: value } });
  };

  const handleFormChange = (field) => {
    // console.log('field', field);
    const key = Object.keys(field)[0];
    dispatch({
      type: `${domain}/updateForm`,
      payload: {
        key,
        value: field[key],
      },
    });
  };

  if (remoteCfg) {
    remoteCfg.buttons.find(b => b.id === 'submit')['onClick'] = handleSave;
    remoteCfg.buttons.find(b => b.id === 'advice')['onChange'] = (e) => handleAdviceChange(e.target.value);
    remoteCfg.buttons.find(b => b.id === 'approve')['onClick'] = handleApprove;
    remoteCfg.buttons.find(b => b.id === 'reject')['onClick'] = handleReject;

    return (
      <div>
        <Toolbar prcId={formData.prcId} defId={formData.defId} loading={loading} record={formData} mode={mode}
          buttons={remoteCfg.buttons}
          handleCancel={handleCancel}
        />
        <Page dispatch={dispatch} loading={loading} localCfg={localCfg} remoteCfg={remoteCfg} id="priceAdjust">
          <Panel id="basic" title="物料信息">
            <Block id="basic" type="form" data={formData} onFieldsChange={handleFormChange}/>
          </Panel>
        </Page>
      </div>
    );
  } else {
    return <Loader fullScreen={false} spinning={loading.effects[`${domain}/query`]} />;
  }
};

export default connect(({ priceAdjust, loading }) => ({ priceAdjust, loading }))(PriceAdjust);
