import { Connect } from "@cqsjjb/jjb-dva-runtime";
import { Button, Space } from "antd";
import Page from "zy-react-library/components/Page";
import Search from "zy-react-library/components/Search";
import DictionarySelect from "zy-react-library/components/Select/Dictionary";
import Table from "zy-react-library/components/Table";
import { FORM_ITEM_RENDER_ENUM } from "zy-react-library/enum/formItemRender";
import useGetUrlQuery from "zy-react-library/hooks/useGetUrlQuery";
import useTable from "zy-react-library/hooks/useTable";
import { NS_VEHICLE_APPLY } from "~/enumerate/namespace";

function List(props) {
  const query = useGetUrlQuery();
  const [form] = Search.useForm();
  const { tableProps, getData } = useTable(props["vehicleApplyList"], {
    form,
    params: { employeeVehicleUserId: query.id, vehicleBelongType:  props.vehicleBelongType?props.vehicleBelongType:3 },
  });
  return (
    <Page headerTitle="车辆管理">
      <Search
        form={form}
        onFinish={getData}
        options={[
          { name: "licenceNo", label: "车牌号" },
          // {
          //   name: "todo2",
          //   label: "当前在港状态",
          //   render: FORM_ITEM_RENDER_ENUM.SELECT,
          //   items: CURRENT_IN_PORT_STATUS_ENUM,
          // },
          { name: "gateLevelAuthArea", label: "访问港区范围", render: (<DictionarySelect dictValue="HG_AUTH_AREA" />) },
          { name: "visitStartTime", label: "访问开始时间", render: FORM_ITEM_RENDER_ENUM.DATE },
          { name: "visitEndTime", label: "访问结束时间", render: FORM_ITEM_RENDER_ENUM.DATE },
        ]}
      />
      <Table
        columns={[
          { title: "车辆归属人", dataIndex: "employeeVehicleUserName" },
          { title: "车牌号", dataIndex: "licenceNo" },
          { title: "车牌类型", dataIndex: "licenceTypeName" },
          { title: "车辆类型", dataIndex: "vehicleTypeName" },
          {
            title: "访问港区范围",
            dataIndex: "gateLevelAuthArea",
            render: (_, record) => record.gateLevelAuthArea && JSON.parse(record.gateLevelAuthArea).area.map(item => item.value).join("、"),
          },
          { title: "访问起始时间", dataIndex: "visitStartTime" },
          { title: "访问结束时间", dataIndex: "visitEndTime" },
          // { title: "当前在港状态", dataIndex: "todo8" },
          {
            title: "操作",
            width: 200,
            fixed: "right",
            render: (_, record) => (
              <Space>
                <Button
                  type="link"
                  onClick={() => {
                    props.history.push(`./vehicleRecords?licenceNo=${record.licenceNo}`);
                  }}
                >
                  车辆进出记录
                </Button>
                <Button
                  type="link"
                  onClick={() => {
                    props.history.push(`./approvalRecords?id=${record.id}`);
                  }}
                >
                  审核记录
                </Button>
                <Button
                  type="link"
                  onClick={() => {
                    props.history.push(`./view?id=${record.id}`);
                  }}
                >
                  查看
                </Button>
              </Space>
            ),
          },
        ]}
        {...tableProps}
      />
    </Page>
  );
}

export default Connect([NS_VEHICLE_APPLY], true)(List);
