import React, { useEffect, useState, useRef, useMemo } from 'react';
import { UserOutlined } from '@ant-design/icons';
import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import { Drawer, Descriptions, Card, Table } from 'antd';
import moment from 'moment';
import { connect } from 'dva';
import CommentContent from '@/components/CommentContent';

// 评论
function HistoryDrawer(props) {
  const {
    visible,
    onClose,
    version,
    loading,
    dispatch,
    versionTree,
    onChangeVersion,
  } = props;
  const columns = useMemo(() => {
    return [
      {
        title: '名称',
        width: '33%',
        render: item => (
          <div style={{ color: '#9b9b9b'}}>
            {/* {item.id == version.id && <dix style={{ marginRight: 10 }} />} */}
            {`${item.version_name}.${item.version_no}`}
          </div>
        ),
      },
      // {
      //   title: '状态',
      //   width: '33%',
      //   render: item => {
      //     let style = { color: getColor(item) };
      //     let txt = '';
      //     switch (item.audit_status) {
      //       case 0:
      //         txt = '未提交';
      //         break;
      //       case 1:
      //         txt = '待审批';
      //         break;
      //       case 2:
      //         txt = '拒绝';
      //         break;
      //       case 3:
      //         txt = '通过';
      //         break;
      //       case 4:
      //         txt = '已提交';
      //         break;
      //     }
      //     return <span style={style}>{txt}</span>;
      //   },
      // },
      {
        title: '操作',
        render: item =>
          item.id != version.id && (
            <a
              onClick={() => {
                onChangeVersion(item);
                onClose();
              }}
            >
              切换
            </a>
          ),
      },
    ];
  }, [version]);
  // const [commentList, setCommentList] = useState([]);

  // const handleSubmitBom = (value, callback) => {
  //   if (!value) return;
  //   dispatch({
  //     type: 'detail/addBomComment',
  //     payload: {
  //       excel_id: version.id,
  //       comment: value,
  //     },
  //     callback,
  //   });
  // };
  // const handleSubmitCell = (value, callback) => {
  //   if (!value) return;
  //   dispatch({
  //     type: 'detail/addComment',
  //     payload: {
  //       ...cellPosition.current,
  //       comment: value,
  //     },
  //     callback,
  //   });
  // };

  useEffect(() => {
    console.log("====================================",versionTree)
  }, [version.id]);

  return (
    <Drawer
      width={600}
      title="历史版本"
      mask={false}
      placement="right"
      onClose={onClose}
      visible={visible}
    >
      <Table columns={columns} dataSource={versionTree} bordered={false} />
    </Drawer>
  );
}
export default connect(({ detail, user, loading }) => ({
  comment: detail.comment,
  userList: user.list,
  bomComment: detail.bomComment,
  loading: loading,
}))(HistoryDrawer);