import { useState, useEffect, useRef } from 'react';
import InitForm from '@/components/InitForm';
import { message } from 'antd';
import { doFetch } from '@/utils/doFetch';

const App = ({ url, actionRef, setdrawer }) => {
  const columns = [
    {
      title: '选择设备',
      dataIndex: 'equipmentId',
      key: 'equipmentId',
      valueType: 'select',
      options: { path: '/asset/equipment/selection/user/shop', params: {} },
      formItemProps: {
        rules: [
          {
            required: true,
            message: '此项为必填项',
          },
        ],
      },
    },
    {
      title: '是否停机',
      dataIndex: 'isShutdown',
      key: 'isShutdown',
      valueType: 'radio',
      options: [
        {
          value: 1,
          label: '是',
        },
        {
          value: 2,
          label: '否',
        },
      ],
      formItemProps: {
        rules: [
          {
            required: true,
            message: '此项为必填项',
          },
        ],
      },
    },
    {
      title: '故障类型',
      dataIndex: 'faultSettingId',
      key: 'faultSettingId',
      valueType: 'select',
      options: {
        path: '/repair/umFaultSetting/selected/queryList',
        linkParams: {
          equipmentId: '',
        },
      },
    },
    {
      title: '故障名称',
      dataIndex: 'faultDetailId',
      key: 'faultDetailId',
      valueType: 'select',
      options: {
        path: '/repair/umFaultSettingDetail/selected/queryList',
        linkParams: {
          faultSettingId: '',
        },
      },
    },
    {
      title: '故障描述',
      dataIndex: 'faultDescription',
      key: 'faultDescription',
      valueType: 'textarea',
      formItemProps: {
        rules: [
          {
            required: true,
            message: '此项为必填项',
          },
        ],
      },
    },
    {
      title: '故障图片',
      dataIndex: 'picList',
      key: 'picList',
      valueType: 'uploadImage',
      fieldProps: {
        limit: 5,
      },
      formItemProps: {
        rules: [
          {
            required: false,
            message: '此项为必填项',
          },
        ],
      },
    },
  ];

  const formRef = useRef();

  return (
    <>
      <InitForm
        formRef={formRef}
        fields={columns}
        onValuesChange={(changedValues, allValues) => {
          //console.log(changedValues, allValues);
          if (Object.keys(changedValues)[0] == 'faultDetailId') {
            doFetch({
              url: '/repair/umFaultSettingDetail/queryById',
              params: {
                id: changedValues?.faultDetailId,
              },
            }).then((res) => {
              //console.log(res);
              formRef?.current?.setFieldsValue({
                faultDescription: res?.data?.data.faultPhenomenon,
              });
            });
          }
        }}
        onFinish={async (vals) => {
          //console.log(vals);
          let params = {
            ...vals,
          };
          let res = await doFetch({
            url,
            params,
          });
          if (res.code === '0000') {
            message.success('新建成功！');
            setdrawer((s) => ({
              ...s,
              open: false,
            }));
            actionRef.current.reload();
          }
        }}
      />
    </>
  );
};

export default App;