/**
 * 设备基础信息管理
 * @param Page
 * @returns
 */
 import type { ActionType, ProColumns } from '@ant-design/pro-components';
 import { ProTable } from '@ant-design/pro-components';
 import { Button, Modal, Form, Input, message, Popconfirm, Tag} from 'antd';
 import { useRef, useState, useEffect } from 'react';
 import AccountAPI from '@/api/sys/accountService';
 
 export default () => {
   //表单
   const [typeForm] = Form.useForm();
   const [modelTitle, setModelTitle] = useState<string>();
   //编辑/新增弹窗
   const [isModalOpen, setIsModalOpen] = useState(false);
   const actionRef = useRef<ActionType>();
   const columns: ProColumns<Account.TBAccountDTO>[] = [
     {
       title: '账号',
       dataIndex: 'account',
       ellipsis: true,
     },
     {
       title: '操作',
       valueType: 'option',
       key: 'option',
       render: (_, record) => [
         <Button
           key="edit"
           type="primary"  ghost
           onClick={async () => {
             setIsModalOpen(true);
             setModelTitle('编辑信息');
             const copyFormData = JSON.parse(JSON.stringify(record));
             copyFormData.state = copyFormData.state === '0' ? true : false;
             typeForm.setFieldsValue(copyFormData);
           }}
         >
           编辑
         </Button>,
         <Popconfirm
           key="del"
           title="确定要删除此条数据吗？"
           onConfirm={() => {
            
             const EnablejsonData: Account.TBAccountDTO = {
               id: record.id,
               name: '',
               code: ''
             };
             AccountAPI.Del(EnablejsonData).then((r) => {
               if (r.statusCode === 200) {
                 message.success(r.statusCode === 200 ? '删除成功' : r.message);
                 actionRef.current?.reload();
               }
             });
           }}
           onCancel={() => {
             message.info('已取消删除');
           }}
           okText="确认"
           cancelText="关闭"
         >
           <Button type="primary" danger  ghost>删除</Button>
         </Popconfirm>,
       ],
     },
   ];
 
   /*
    初始化
   */
   useEffect(() => {
     // 下拉列表信息
     const RegionDataList = () => {
      
     };
     RegionDataList();
   }, []);
 
   /*
    *表单提交
    */
   const OnSubmit = async (values: Account.TBAccountDTO) => {
     if (values.id) {
       const response = await AccountAPI.Update(values);
       if (response.statusCode === 200) {
         message.success('修改成功');
         actionRef.current?.reload();
         setIsModalOpen(false);
       } else {
         message.error(response.errors || '修改失败');
       }
     } else {
       const response = await AccountAPI.Add(values);
       console.log('response', response);
       if (response.statusCode === 200) {
         message.success('添加成功');
         actionRef.current?.reload();
         setIsModalOpen(false);
       } else {
         message.error(response.errors || '添加失败');
       }
     }
   };
   return (
     <>
       <ProTable<Account.TBAccountDTO>
         key="myTable"
         columns={columns}
         actionRef={actionRef}
         cardBordered
         request={async (params = {}) => {
           const jsonData: DeviceTypes.Page = {
             pageIndex: params.current || 1,
             pageSize: params.pageSize || 10,
             name: params.name || '',
             id: '',
             code: ''
           };
           const response = await AccountAPI.PagedList(jsonData);
           if (response.statusCode === 200) {
             return {
               data: response.data.items,
               success: true,
               total: response.data.total,
             };
           } else {
             return {
               data: [],
               success: false,
               total: 0,
             };
           }
         }}
         rowKey="id"
         pagination={{
           pageSize: 10,
         }}
         dateFormatter="string"
         headerTitle="设备列表"
         toolBarRender={() => [
           <Button
             key="button"
             type="primary"
             onClick={() => {
               typeForm.resetFields();
               setIsModalOpen(true);
               setModelTitle('新增信息');
             }}
           >
             新建
           </Button>,
         ]}
       />
       <Modal
         key="01"
         width={800}
         title={<Tag color="#cd201f">{modelTitle}</Tag>}
         open={isModalOpen}
         onCancel={() => {
           setIsModalOpen(false);
         }}
         footer={[
           <Button
             key="back"
             onClick={() => {
               setIsModalOpen(false);
             }}
           >
             返回
           </Button>,
           <Button key="submit" form="myForm" type="primary" htmlType="submit">
             提交
           </Button>,
         ]}
       >
         <Form
           form={typeForm}
           name="basic"
           id="myForm"
           labelCol={{ span: 4 }}
           wrapperCol={{ span: 12 }}
           onFinish={OnSubmit}
           autoComplete="off"
         >
           <Form.Item label="id" name="id" hidden>
             <Input />
           </Form.Item>
           <Form.Item
             label="账号"
             name="name"
             rules={[{ required: true, message: '此项为必填项!' }]}
           >
             <Input />
           </Form.Item>
         </Form>
       </Modal>
     </>
   );
 };
 