import BTable from "@/components/b_table";
import { UserDataType } from "@/model/userModel";
import { Button, message, Modal, Space } from "antd";
import { Store } from "antd/es/form/interface";
import TextArea from "antd/lib/input/TextArea";
import { ColumnsType } from "antd/lib/table";
import dayjs from "dayjs";
import { inject, observer } from "mobx-react";
import { useEffect, useState } from "react";

const ExceCompet = (props: Store) => {
  const { exceCompetStore } = props;
  const [isModalOpen, setIsModalOpen] = useState(false);
  const [value, setValue] = useState('');
  const [id, setId] = useState('');
  useEffect(() => {
    exceCompetStore.getlist();
  }, [exceCompetStore]);
  const columns: ColumnsType<UserDataType> = [
    { title: "评优标题", dataIndex: "title" },
    { title: "内容", dataIndex: "content" },
    {
      title: "评优申请人",
      dataIndex: "users",
      render: (users) => <span>{users?.user_name}</span>,
    },
    { title: "申请积分", dataIndex: "reviewer_score" },
    {
      title: "申请时间",
      dataIndex: "created_at",
      render: (created_at) => (
        <span>{dayjs(created_at).format("YYYY-MM-DD")}</span>
      ),
    },
    { title: "描述", dataIndex: "desc" },
    {
      title: "审核状态",
      dataIndex: "status",
      render: (status) =>
        status === 1 ? "已通过" : status === 2 ? "驳回" : "未审核",
      width: 200,
    },
    {
      title: "审核人",
      dataIndex: "reviewer_users",
      render: (reviewer_users) => <span>{reviewer_users?.user_name}</span>,
    },
    {
      title: "操作",
      dataIndex: "identity",
      render: (any, record) =>
        record.status === 0 ? (
          <Space>
            <Button
              type="dashed"
              size="small"
              onClick={() => {
                setId(record.identity)
                setIsModalOpen(true);
              }}
            >
              驳回
            </Button>
            <Button
              type="dashed"
              size="small"
              onClick={() => {
                exceCompetStore.audit(record.identity, {status: 1});
              }}
            >
              通过
            </Button>
          </Space>
        ) : null,
    },
  ];
 

  const handleOk = () => {
    if (!value) {
      message.error("请输入驳回理由")
      return;
    }
    exceCompetStore.audit(id, {status: 2,remark:value});
    setIsModalOpen(false);
  };

  const handleCancel = () => {
    setIsModalOpen(false);
  };

  return (
    <div>
      <BTable
        store={exceCompetStore}
        columns={columns}
        dataSource={exceCompetStore.list}
      />
      <Modal title="驳回" open={isModalOpen} onOk={handleOk} onCancel={handleCancel}>
      <TextArea
        value={value}
        onChange={(e) => setValue(e.target.value)}
        placeholder="请输入驳回理由"
        autoSize={{ minRows: 3, maxRows: 5 }}
      />
      </Modal>
    </div>
  );
};
export default inject("exceCompetStore")(observer(ExceCompet));
