diff --git a/client/src/components/jobs-list-paginated/jobs-list-paginated.component.jsx b/client/src/components/jobs-list-paginated/jobs-list-paginated.component.jsx index 9723786d0..904304563 100644 --- a/client/src/components/jobs-list-paginated/jobs-list-paginated.component.jsx +++ b/client/src/components/jobs-list-paginated/jobs-list-paginated.component.jsx @@ -3,13 +3,25 @@ import { Button, Input, Table } from "antd"; import queryString from "query-string"; import React from "react"; import { useTranslation } from "react-i18next"; +import { connect } from "react-redux"; import { Link, useHistory, useLocation } from "react-router-dom"; +import { createStructuredSelector } from "reselect"; +import { selectBodyshop } from "../../redux/user/user.selectors"; import CurrencyFormatter from "../../utils/CurrencyFormatter"; import PhoneFormatter from "../../utils/PhoneFormatter"; import { alphaSort } from "../../utils/sorters"; import StartChatButton from "../chat-open-button/chat-open-button.component"; +import _ from "lodash"; -export default function JobsList({ refetch, loading, jobs, total }) { +const mapStateToProps = createStructuredSelector({ + //currentUser: selectCurrentUser + bodyshop: selectBodyshop, +}); +const mapDispatchToProps = (dispatch) => ({ + //setUserLanguage: language => dispatch(setUserLanguage(language)) +}); + +export function JobsList({ bodyshop, refetch, loading, jobs, total }) { const search = queryString.parse(useLocation().search); const { page, sortcolumn, sortorder } = search; const history = useHistory(); @@ -36,9 +48,9 @@ export default function JobsList({ refetch, loading, jobs, total }) { dataIndex: "owner", key: "owner", ellipsis: true, - sorter: (a, b) => alphaSort(a.ownr_ln, b.ownr_ln), + // sorter: (a, b) => alphaSort(a.ownr_ln, b.ownr_ln), width: "25%", - sortOrder: sortcolumn === "owner" && sortorder, + // sortOrder: sortcolumn === "owner" && sortorder, render: (text, record) => { return record.owner ? ( @@ -79,6 +91,10 @@ export default function JobsList({ refetch, loading, jobs, total }) { render: (text, record) => { return record.status || t("general.labels.na"); }, + filters: bodyshop.md_ro_statuses.statuses.map((s) => { + return { text: s, value: [s] }; + }), + onFilter: (value, record) => value.includes(record.status), }, { @@ -162,9 +178,15 @@ export default function JobsList({ refetch, loading, jobs, total }) { ]; const handleTableChange = (pagination, filters, sorter) => { + console.log("filters :>> ", filters); search.page = pagination.current; search.sortcolumn = sorter.columnKey; search.sortorder = sorter.order; + if (filters.status) { + search.statusFilters = JSON.stringify(_.flattenDeep(filters.status)); + } else { + delete search.statusFilters; + } history.push({ search: queryString.stringify(search) }); }; @@ -206,3 +228,4 @@ export default function JobsList({ refetch, loading, jobs, total }) { ); } +export default connect(mapStateToProps, mapDispatchToProps)(JobsList); diff --git a/client/src/graphql/jobs.queries.js b/client/src/graphql/jobs.queries.js index 01cdef9f7..12f0a6ec0 100644 --- a/client/src/graphql/jobs.queries.js +++ b/client/src/graphql/jobs.queries.js @@ -1126,18 +1126,20 @@ export const QUERY_JOBS_IN_PRODUCTION = gql` } `; -export const QUERY_ALL_JOBS_PAGINATED = gql` - query QUERY_ALL_JOBS_PAGINATED( +export const QUERY_ALL_JOBS_PAGINATED_STATUS_FILTERED = gql` + query QUERY_ALL_JOBS_PAGINATED_STATUS_FILTERED( $search: String $offset: Int $limit: Int $order: [jobs_order_by!] + $statusList: [String!] ) { search_jobs( args: { search: $search } offset: $offset limit: $limit order_by: $order + where: { status: { _in: $statusList } } ) { ownr_fn ownr_ln @@ -1154,7 +1156,6 @@ export const QUERY_ALL_JOBS_PAGINATED = gql` actual_completion actual_delivery actual_in - id ins_co_nm ins_ct_fn @@ -1178,7 +1179,10 @@ export const QUERY_ALL_JOBS_PAGINATED = gql` ded_amt vehicleid } - search_jobs_aggregate(args: { search: $search }) { + search_jobs_aggregate( + args: { search: $search } + where: { status: { _in: $statusList } } + ) { aggregate { count(distinct: true) } diff --git a/client/src/pages/jobs-all/jobs-all.container.jsx b/client/src/pages/jobs-all/jobs-all.container.jsx index 907e7edee..85ffc4351 100644 --- a/client/src/pages/jobs-all/jobs-all.container.jsx +++ b/client/src/pages/jobs-all/jobs-all.container.jsx @@ -7,12 +7,12 @@ import { useLocation } from "react-router-dom"; import { createStructuredSelector } from "reselect"; import AlertComponent from "../../components/alert/alert.component"; import JobsListPaginated from "../../components/jobs-list-paginated/jobs-list-paginated.component"; -import { QUERY_ALL_JOBS_PAGINATED } from "../../graphql/jobs.queries"; +import RbacWrapper from "../../components/rbac-wrapper/rbac-wrapper.component"; +import { QUERY_ALL_JOBS_PAGINATED_STATUS_FILTERED } from "../../graphql/jobs.queries"; import { setBreadcrumbs, setSelectedHeader, } from "../../redux/application/application.actions"; -import RbacWrapper from "../../components/rbac-wrapper/rbac-wrapper.component"; const mapStateToProps = createStructuredSelector({ //bodyshop: selectBodyshop, @@ -25,24 +25,28 @@ const mapDispatchToProps = (dispatch) => ({ export function AllJobs({ setBreadcrumbs, setSelectedHeader }) { const searchParams = queryString.parse(useLocation().search); - const { page, sortcolumn, sortorder, search } = searchParams; + const { page, sortcolumn, sortorder, search, statusFilters } = searchParams; - const { loading, error, data, refetch } = useQuery(QUERY_ALL_JOBS_PAGINATED, { - variables: { - search: search || "", - offset: page ? (page - 1) * 25 : 0, - limit: 25, - order: sortcolumn && [ - { - [sortcolumn || "created_at"]: sortorder - ? sortorder === "descend" - ? "desc" - : "asc" - : "desc", - }, - ], - }, - }); + const { loading, error, data, refetch } = useQuery( + QUERY_ALL_JOBS_PAGINATED_STATUS_FILTERED, + { + variables: { + search: search || "", + offset: page ? (page - 1) * 25 : 0, + limit: 25, + ...(statusFilters ? { statusList: JSON.parse(statusFilters) } : {}), + order: sortcolumn && [ + { + [sortcolumn || "created_at"]: sortorder + ? sortorder === "descend" + ? "desc" + : "asc" + : "desc", + }, + ], + }, + } + ); const { t } = useTranslation(); useEffect(() => { @@ -56,15 +60,13 @@ export function AllJobs({ setBreadcrumbs, setSelectedHeader }) { if (error) return ; return ( -
- -
+
); }