97 lines
3.6 KiB
JavaScript
97 lines
3.6 KiB
JavaScript
import React from "react";
|
|
import { Card, Row, Col, Dropdown } from "antd";
|
|
import { DateTimeFormatter } from "../../utils/DateFormatter";
|
|
import ProductionAlert from "../production-list-columns/production-list-columns.alert.component";
|
|
import { EyeFilled } from "@ant-design/icons";
|
|
import { Link } from "react-router-dom";
|
|
import "./production-board-card.styles.scss";
|
|
import ProductionRemoveButton from "../production-remove-button/production-remove-button.component";
|
|
import { useTranslation } from "react-i18next";
|
|
import ProductionSubletsManageComponent from "../production-sublets-manage/production-sublets-manage.component";
|
|
import ProductionListColumnProductionNote from "../production-list-columns/production-list-columns.productionnote.component";
|
|
|
|
export default function ProductionBoardCard(card) {
|
|
const { t } = useTranslation();
|
|
const menu = (
|
|
<div>
|
|
<Card title={t("general.labels.actions")}>
|
|
<ProductionRemoveButton jobId={card.id} />
|
|
</Card>
|
|
</div>
|
|
);
|
|
|
|
return (
|
|
<Dropdown overlay={menu} trigger={["contextMenu"]}>
|
|
<Card
|
|
className="react-kanban-card imex-kanban-card tight-antd-rows"
|
|
style={{ margin: ".2rem 0rem" }}
|
|
size="small"
|
|
title={`${card.ro_number || t("general.labels.na")} - ${
|
|
card.v_model_yr
|
|
} ${card.v_make_desc || ""} ${card.v_model_desc || ""}`}
|
|
>
|
|
<Row>
|
|
<Col span={24}>
|
|
<div className="ellipses">{`${card.ownr_fn || ""} ${
|
|
card.ownr_ln || ""
|
|
} ${card.ownr_co_nm || ""}`}</div>
|
|
</Col>
|
|
</Row>
|
|
<Row>
|
|
<Col span={12}>
|
|
<div className="ellipses">{card.clm_no || ""}</div>
|
|
</Col>
|
|
<Col span={12}>
|
|
<div className="ellipses">{card.ins_co_nm || ""}</div>
|
|
</Col>
|
|
</Row>
|
|
<Row>
|
|
<Col span={24}>
|
|
<div className="imex-flex-row imex-flex-row__flex-space-around">
|
|
<div className="mex-flex-row__margin">
|
|
<div>{`B: ${card.labhrs.aggregate.sum.mod_lb_hrs || "?"}`}</div>
|
|
<div>{`R: ${card.larhrs.aggregate.sum.mod_lb_hrs || "?"}`}</div>
|
|
</div>
|
|
<div className="mex-flex-row__margin">
|
|
<div>{`B: ${
|
|
card.employee_body_rel
|
|
? `${card.employee_body_rel.first_name} ${card.employee_body_rel.last_name}`
|
|
: ""
|
|
}`}</div>
|
|
<div>{`P: ${
|
|
card.employee_prep_rel
|
|
? `${card.employee_prep_rel.first_name} ${card.employee_prep_rel.last_name}`
|
|
: ""
|
|
}`}</div>
|
|
<div>{`R: ${
|
|
card.employee_refinish_rel
|
|
? `${card.employee_refinish_rel.first_name} ${card.employee_refinish_rel.last_name}`
|
|
: ""
|
|
}`}</div>
|
|
</div>
|
|
</div>
|
|
</Col>
|
|
</Row>
|
|
<Row>
|
|
<Col span={18}>
|
|
<DateTimeFormatter>{card.scheduled_completion}</DateTimeFormatter>
|
|
</Col>
|
|
<Col span={6}>
|
|
<div>{card.alt_transport || ""}</div>
|
|
</Col>
|
|
</Row>
|
|
<div>
|
|
<ProductionListColumnProductionNote record={card} />
|
|
</div>
|
|
<div className="imex-flex-row imex-flex-row__flex-space-around">
|
|
<ProductionAlert record={card} key="alert" />
|
|
<ProductionSubletsManageComponent subletJobLines={card.subletLines} />
|
|
<Link to={`/manage/jobs/${card.id}`}>
|
|
<EyeFilled />
|
|
</Link>
|
|
</div>
|
|
</Card>
|
|
</Dropdown>
|
|
);
|
|
}
|