dyh-evaluation-admin/src/pages/AssessmentDetail/components/IndexAssessment/index.tsx

import { FC } from "react";
import { Button, Form, Input, Select, Table } from "antd";
import { useNavigate } from "react-router-dom";

export interface IndexAssessmentProps {
  isReportDetail?: boolean;
  isEvalutionDetail?: boolean;
}

export const IndexAssessment: FC<IndexAssessmentProps> = ({
  isReportDetail,
  isEvalutionDetail,
}) => {
  const navigate = useNavigate();

  return (
    <>
      <Form layout="inline">
        <Form.Item label="搜索">
          <Input className="w220" placeholder="请输入指标名称" />
        </Form.Item>
        <Form.Item label="上传状态">
          <div className="w160">
            <Select placeholder="请选择" />
          </div>
        </Form.Item>
        <Form.Item label="责任部门">
          <div className="w160">
            <Select placeholder="请选择" />
          </div>
        </Form.Item>
        <Form.Item>
          <Button type="primary">查询</Button>
        </Form.Item>
      </Form>

      <div style={{ margin: "20px -25px" }}>
        <Table
          className="cus-table"
          rowKey="id"
          scroll={{
            x: true,
          }}
          dataSource={[
            {
              id: 1,
              name: "综合管理与基础设施",
              description:
                "消息一出，瞬间引爆互联网，分分钟登顶Hacker News。假如这次发现为真，那么我们就能实现无损的能量传输，全球的能耗问题将从源头上解决，人类能利用电能获得巨大的力量。",
            },
          ]}
          columns={[
            {
              title: "序号",
              align: "center",
              minWidth: 80,
              render: (val, record, index) => index,
            },
            {
              title: "标题",
              dataIndex: "name",
              align: "center",
              minWidth: 200,
            },
            {
              title: "说明",
              minWidth: 300,
              align: "center",
              render: (val) => (
                <p className="limit-line line-2">{val.description}</p>
              ),
            },
            {
              title: "分值",
              align: "center",
              render: (val) => <p className="empty-text">（空）</p>,
            },
            {
              title: "资料上传 ",
              align: "center",
              render: () => (
                <Button
                  type="link"
                  onClick={() =>
                    navigate(
                      isReportDetail
                        ? // 考核填报
                          "/management/form/detail/1/index"
                        : isEvalutionDetail
                        ? // 考核评定
                          "/management/evaluation/detail/1/index"
                        : // 考核管理
                          "/management/index/detail/1/index"
                    )
                  }
                >
                  查看
                </Button>
              ),
            },
            {
              title: "上传状态",
              align: "center",
              minWidth: 120,
              render: (val) => <p className="empty-text">（空）</p>,
            },
            {
              title: "打分点",
              align: "center",
              minWidth: 100,
              render: (val) => "是",
            },
            {
              title: "责任部门",
              align: "center",
              minWidth: 120,
              render: (val) => <p className="empty-text">（空）</p>,
            },
            {
              title: "自评得分",
              dataIndex: "rate",
              align: "center",
              minWidth: 120,
            },
            {
              title: "自评人",
              align: "center",
              minWidth: 100,
              render: (val) => <p className="empty-text">（空）</p>,
            },
            {
              title: "评定得分",
              dataIndex: "rates",
              align: "center",
              minWidth: 120,
            },
            {
              title: "评定人",
              align: "center",
              minWidth: 100,
              render: (val) => <p className="empty-text">（空）</p>,
            },
            {
              title: "评定意见",
              align: "center",
              minWidth: 120,
              render: (val) => <p className="empty-text">（空）</p>,
            },
            {
              title: "操作",
              align: "center",
              hidden: !isEvalutionDetail,
              render: () => (
                <Button
                  type="link"
                  onClick={() =>
                    navigate("/management/evaluation/detail/submit")
                  }
                >
                  评定
                </Button>
              ),
            },
          ]}
        />
      </div>
    </>
  );
};