import ProTable  from '@ant-design/pro-table';
import { Modal,Space, Form,Button,Select,message,Popconfirm} from 'antd';
import { PlusOutlined } from '@ant-design/icons';
import React, { useState,useRef } from 'react';
import CreateAction from './CreateAction';

const { Option, OptGroup } = Select;

    
const ActionForm = (props) => {
    const [currentRow , setcurrentRow ] =  useState([]);;
    const [dataSource, setDataSource] = useState([]);
    const actionRef = useRef();
    const [form] = Form.useForm();
    const [actionValueName,setactionValueName]=useState();
    const [createModalVisible, handleModalVisible] = useState(false);
    const options = {
      text:{value:'text',text: `文本框`},
      select:{ value: `select`, text: `下拉框`},
      // money:{ value: `money`, text: `金额输入`},
      textarea:{ value: `textarea`, text: `文本域`},
      // date:{ value: `date`, text: `日期`},
      // dateTime:{ value: `dateTime`, text: `日期时间`},
      // radio:{ value: `radio`, text: `单选框`},
      // radioButton:{ value: `radioButton`, text: `按钮单选框`},
      digit:{ value: `digit`, text: `数字输入框`},
      switch:{ value: `switch`, text: `开关`},
    }
    const columns= [
        {
            title: '模型名称',
            dataIndex: 'actionName',
            width: '15%',
          },
      
          {
            title: '输入类型',
            key: 'actionType',
            dataIndex: 'actionType',
            valueType: 'select',
            width: '15%',
            valueEnum:options,
           
          },
          // {
          //   title: '类型值',
          //   dataIndex: 'actionValue',
          //   width: '15%',
          //   valueType:'select',
          //   valueEnum: {
          //     text:{
          //       text: '文本框',
          //       status: 'text',
          //     },
          //     select:{
          //       text: '下拉框',
          //       status: 'select',
          //     }
          //   }
          // },
          // {
          //   title: '单位',
          //   dataIndex: 'unit',
          //   width: '8%',
          // },
          // {
          //   title: '是否绑定物料',
          //   dataIndex: 'isBatch',
          //   width: '15%',
          //   valueEnum: {
          //     true:{
          //       text: '是',
          //       status: 'Success',
          //     },
          //     false:{
          //       text: '否',
          //       status: 'Processing',
          //     }
          //   }
          // },
          {
            title: '排序',
            dataIndex: 'sort',
            valueType:'digit',
            width: '8%',
          },
          {
            title: '操作',
            valueType: 'option',
            width: 200,
            render: (text, record, _, action) => [
              <a
                key="editable"
                onClick={() => {
                  handleModalVisible(true);
                  setcurrentRow(record);
                }}
              >
                查看
              </a>,
              //   <Popconfirm
              //   type="primary"
              //   key="primary"
              //   title="确认删除吗？"
              //   okText="是"
              //   cancelText="否"
              //   onConfirm={() => {
              //     handleRemove([record.id]);
              //     actionRef.current?.reloadAndRest();
              //   }}
              //   onCancel={() => { }}
              // >
              //   <a href="#">删除</a>
              // </Popconfirm>,,
            ],
          },
    ]
    return (
        <>
        <Modal
      title={'模型配置'}
      width={1140}
      visible={props?.actionFormModalVisible}
      bodyStyle={{ padding: '32px 40px 1px 48px' }}
      footer={null}
      onCancel={() => { 
        props?.onCancel();
      }}
      destroyOnClose
      maskClosable={false}
    >
        <ProTable rowKey="id"
        headerTitle="模型配置列表"
        actionRef={actionRef}
        pagination={false}
        search={false}
        toolBarRender={false}
        columns={columns}
        dataSource={props.dataSource}
        >
        </ProTable>
        <CreateAction
        onFinish={async (value) => {
          var success = false;
          console.log(value)
          console.log(value.actionValue)
          value.goodstechnologyId=props.values.id;
         
          if (value.id) {
            success = await handleUpdate(value);
          } else {
            success = await onFinish(value);
          }
          if (success) {
            handleModalVisible(false);
            if (actionRef.current) {
              actionRef.current.reload();
            }
          }
        }}
        onCancel={() => {
          setcurrentRow(undefined);
          handleModalVisible(false);
        }}
        createModalVisible={createModalVisible}
        actionValueName={actionValueName}
        values={currentRow || {}}
      />
        </Modal>
        </>
    );
};
export default ActionForm;