import React, { useState, useEffect } from 'react';
import {
  ProFormSelect,
  ProFormText,
  ModalForm,
  ProFormDependency
} from '@ant-design/pro-form';
import { useIntl, FormattedMessage } from 'umi';

import { getApportionmentLevelListNoPage } from '../apportionmentLevel/service';
import { getResponsibilityCenterList, editResponsibilityCenterList, delResponsibilityCenter, addResponsibilityCenter } from './service';


const UpdateForm = (props) => {
  const { updateModalVisible, updateModalVisibleChange, values, onSubmit } = props;
  const { responsibilityLevel, parentId } = values;
  const [selectedLevelList, setSelectedLevelList] = useState([]); //可选的分摊层级列表
  const [selectedLevel, setSelectedLevel] = useState(null);
  console.log({ values });


  useEffect(() => {
    const temp = selectedLevelList.filter(item => item.leverSort == responsibilityLevel);
    setSelectedLevel(temp);
  }, [values])

  return (
    <>
      {
        JSON.stringify(values) !== '{}' && <ModalForm
          title="编辑医院"
          width="800px"
          initialValues={{ ...values }}
          labelCol={{ span: 5, offset: 3 }}
          layout={'horizontal'}
          visible={updateModalVisible}
          onVisibleChange={(visible) => updateModalVisibleChange(visible)}
          onFinish={(value) => onSubmit({ ...values, ...value, selectedLevel })}
        >
          {
            parentId != 0 &&<ProFormSelect
              name="parentId"
              label="责任管理中心"
              showSearch
              request={async ({ keyWords }) => {
                const res = await getResponsibilityCenterList();
                if (res.status == 200) {
                  // console.log({res});
                  const filter_arr = res.data.list.filter(item => {
                    //  console.log({item});
                    if (keyWords) {
                      return item.responsibilityName.indexOf(keyWords) != -1
                    } else {
                      return item
                    }

                  });
                  const arr = filter_arr.map(item => ({ label: item.responsibilityName, value: item.id }));
                  return arr;
                } else {
                  return [];
                }

              }}
              width='md'
              placeholder="选择需要新增在哪个责任中心下，默认新增最外层"
              rules={[{ required: false, message: '' }]}
            />
          }

          <ProFormText
            label="责任中心名"
            rules={[
              {
                required: true,
                message: (
                  <FormattedMessage id="pages.searchTable.responsibilityName" defaultMessage="医院名是必填项" />
                ),
              },
            ]}
            width="sm"
            name="responsibilityName"
          />
          <ProFormSelect
            rules={[
              {
                required: true,
                message: (
                  <FormattedMessage id="pages.searchTable.isGatherCenter" defaultMessage="请选择是否为汇总中心" />
                ),
              },
            ]}
            options={[
              {
                value: 1,
                label: '是',
              },
              {
                value: 2,
                label: '否',
              },
            ]}
            width="sm"
            name="isGatherCenter"
            label="是否汇总中心"
          />
          <ProFormSelect
            rules={[
              {
                required: true,
                message: (
                  <FormattedMessage id="pages.searchTable.responsibilityType" defaultMessage="请选择责任类型" />
                ),
              },
            ]}
            options={[
              {
                value: 1,
                label: '收益中心',
              },
              {
                value: 2,
                label: '成本(费用)中心',
              },
            ]}
            width="sm"
            name="responsibilityType"
            label="选择责任类型"
          />
          <ProFormSelect
            rules={[
              {
                required: true,
                message: (
                  <FormattedMessage id="pages.searchTable.shareLevel" defaultMessage="请选择分摊级别" />
                ),
              },
            ]}
            fieldProps={{
              onChange: async (val) => {

                const needItem = selectedLevelList.filter(item => item.leverSort == val);
                setSelectedLevel(needItem);
              },
            }}

            request={async () => {
              const resp = await getApportionmentLevelListNoPage();
              const { status, data } = resp;
              if (status == 200) {
                setSelectedLevelList(data.list);
                return data.list.map(item => ({ label: `级别${item.leverSort}-${item.shareName}`, value: item.leverSort }))
              } else {
                return []
              }
            }}
            width="sm"
            name='responsibilityLevel'
            label="选择分摊级别"
          />
        </ModalForm>
      }
    </>
  );
};

export default UpdateForm;
