Added owners search + owner pagination page BOD-115
This commit is contained in:
@@ -1,12 +1,22 @@
|
||||
import { SyncOutlined } from "@ant-design/icons";
|
||||
import { Button, Input, Table } from "antd";
|
||||
import queryString from "query-string";
|
||||
import React, { useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { Link } from "react-router-dom";
|
||||
import { Link, useHistory, useLocation } from "react-router-dom";
|
||||
import PhoneFormatter from "../../utils/PhoneFormatter";
|
||||
import { alphaSort } from "../../utils/sorters";
|
||||
|
||||
export default function OwnersListComponent({ loading, owners, refetch }) {
|
||||
export default function OwnersListComponent({
|
||||
loading,
|
||||
owners,
|
||||
total,
|
||||
refetch,
|
||||
}) {
|
||||
const search = queryString.parse(useLocation().search);
|
||||
const { page, sortcolumn, sortorder } = search;
|
||||
const history = useHistory();
|
||||
|
||||
const [state, setState] = useState({
|
||||
sortedInfo: {},
|
||||
filteredInfo: { text: "" },
|
||||
@@ -19,9 +29,6 @@ export default function OwnersListComponent({ loading, owners, refetch }) {
|
||||
title: t("owners.fields.name"),
|
||||
dataIndex: "name",
|
||||
key: "name",
|
||||
sorter: (a, b) => alphaSort(a.ownr_ln, b.ownr_ln),
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "name" && state.sortedInfo.order,
|
||||
render: (text, record) => (
|
||||
<Link to={"/manage/owners/" + record.id}>
|
||||
{`${record.ownr_fn} ${record.ownr_ln}`}
|
||||
@@ -32,9 +39,6 @@ export default function OwnersListComponent({ loading, owners, refetch }) {
|
||||
title: t("owners.fields.ownr_ph1"),
|
||||
dataIndex: "ownr_ph1",
|
||||
key: "ownr_ph1",
|
||||
sorter: (a, b) => alphaSort(a.ownr_ph1, b.ownr_ph1),
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "ownr_ph1" && state.sortedInfo.order,
|
||||
render: (text, record) => {
|
||||
return <PhoneFormatter>{record.ownr_ph1}</PhoneFormatter>;
|
||||
},
|
||||
@@ -60,32 +64,41 @@ export default function OwnersListComponent({ loading, owners, refetch }) {
|
||||
|
||||
const handleTableChange = (pagination, filters, sorter) => {
|
||||
setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
|
||||
search.page = pagination.current;
|
||||
search.sortcolumn = sorter.columnKey;
|
||||
search.sortorder = sorter.order;
|
||||
history.push({ search: queryString.stringify(search) });
|
||||
};
|
||||
return (
|
||||
<Table
|
||||
loading={loading}
|
||||
title={() => {
|
||||
return (
|
||||
<div className='imex-table-header'>
|
||||
<div className="imex-table-header">
|
||||
<Button onClick={() => refetch()}>
|
||||
<SyncOutlined />
|
||||
</Button>
|
||||
<Input.Search
|
||||
className='imex-table-header__search'
|
||||
className="imex-table-header__search"
|
||||
placeholder={t("general.labels.search")}
|
||||
onChange={(e) => {
|
||||
//setSearchText(e.target.value);
|
||||
onSearch={(value) => {
|
||||
search.search = value;
|
||||
history.push({ search: queryString.stringify(search) });
|
||||
}}
|
||||
//vale={searchText}
|
||||
enterButton
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}}
|
||||
size='small'
|
||||
pagination={{ position: "top" }}
|
||||
size="small"
|
||||
pagination={{
|
||||
position: "top",
|
||||
pageSize: 25,
|
||||
current: parseInt(page || 1),
|
||||
total: total,
|
||||
}}
|
||||
columns={columns}
|
||||
rowKey='id'
|
||||
rowKey="id"
|
||||
scroll={{ x: true }}
|
||||
dataSource={owners}
|
||||
onChange={handleTableChange}
|
||||
|
||||
@@ -1,19 +1,40 @@
|
||||
import { useQuery } from "@apollo/react-hooks";
|
||||
import React from "react";
|
||||
import { QUERY_ALL_OWNERS } from "../../graphql/owners.queries";
|
||||
import { QUERY_ALL_OWNERS_PAGINATED } from "../../graphql/owners.queries";
|
||||
import AlertComponent from "../alert/alert.component";
|
||||
import OwnersListComponent from "./owners-list.component";
|
||||
import queryString from "query-string";
|
||||
import { useLocation } from "react-router-dom";
|
||||
|
||||
export default function OwnersListContainer() {
|
||||
const { loading, error, data, refetch } = useQuery(QUERY_ALL_OWNERS, {
|
||||
fetchPolicy: "network-only",
|
||||
});
|
||||
const searchParams = queryString.parse(useLocation().search);
|
||||
const { page, sortcolumn, sortorder, search } = searchParams;
|
||||
const { loading, error, data, refetch } = useQuery(
|
||||
QUERY_ALL_OWNERS_PAGINATED,
|
||||
{
|
||||
variables: {
|
||||
search: search || "",
|
||||
offset: page ? (page - 1) * 25 : 0,
|
||||
limit: 25,
|
||||
order: [
|
||||
{
|
||||
[sortcolumn || "created_at"]: sortorder
|
||||
? sortorder === "descend"
|
||||
? "desc"
|
||||
: "asc"
|
||||
: "desc",
|
||||
},
|
||||
],
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
if (error) return <AlertComponent message={error.message} type='error' />;
|
||||
if (error) return <AlertComponent message={error.message} type="error" />;
|
||||
return (
|
||||
<OwnersListComponent
|
||||
loading={loading}
|
||||
owners={data ? data.owners : null}
|
||||
owners={data ? data.search_owners : null}
|
||||
total={data ? data.search_owners_aggregate.aggregate.count : 0}
|
||||
refetch={refetch}
|
||||
/>
|
||||
);
|
||||
|
||||
@@ -89,6 +89,46 @@ export const QUERY_ALL_OWNERS = gql`
|
||||
}
|
||||
`;
|
||||
|
||||
export const QUERY_ALL_OWNERS_PAGINATED = gql`
|
||||
query QUERY_ALL_OWNERS_PAGINATED(
|
||||
$search: String
|
||||
$offset: Int
|
||||
$limit: Int
|
||||
$order: [owners_order_by!]!
|
||||
) {
|
||||
search_owners(
|
||||
args: { search: $search }
|
||||
offset: $offset
|
||||
limit: $limit
|
||||
order_by: $order
|
||||
) {
|
||||
id
|
||||
allow_text_message
|
||||
created_at
|
||||
ownr_addr1
|
||||
ownr_addr2
|
||||
ownr_co_nm
|
||||
ownr_city
|
||||
ownr_ctry
|
||||
ownr_ea
|
||||
ownr_fn
|
||||
ownr_ph1
|
||||
ownr_ln
|
||||
ownr_ph2
|
||||
ownr_st
|
||||
ownr_title
|
||||
ownr_zip
|
||||
preferred_contact
|
||||
updated_at
|
||||
}
|
||||
search_owners_aggregate(args: { search: $search }) {
|
||||
aggregate {
|
||||
count(distinct: true)
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
export const QUERY_OWNER_FOR_JOB_CREATION = gql`
|
||||
query QUERY_OWNER_FOR_JOB_CREATION($id: uuid!) {
|
||||
owners_by_pk(id: $id) {
|
||||
|
||||
@@ -46,7 +46,7 @@ export function AllJobs({ bodyshop, setBreadcrumbs }) {
|
||||
setBreadcrumbs([{ link: "/manage/jobs", label: t("titles.bc.jobs-all") }]);
|
||||
}, [t, setBreadcrumbs]);
|
||||
|
||||
if (error) return <AlertComponent message={error.message} type='error' />;
|
||||
if (error) return <AlertComponent message={error.message} type="error" />;
|
||||
return (
|
||||
<div>
|
||||
<JobsListPaginated
|
||||
|
||||
@@ -0,0 +1 @@
|
||||
[]
|
||||
19
hasura/migrations/1594681018728_run_sql_migration/up.yaml
Normal file
19
hasura/migrations/1594681018728_run_sql_migration/up.yaml
Normal file
@@ -0,0 +1,19 @@
|
||||
- args:
|
||||
cascade: true
|
||||
read_only: false
|
||||
sql: "CREATE INDEX idx_owners_ownr_fn ON owners USING GIN (ownr_fn gin_trgm_ops);\nCREATE
|
||||
INDEX idx_owners_ownr_ln ON owners USING GIN (ownr_ln gin_trgm_ops);\nCREATE
|
||||
INDEX idx_owners_ownr_co_nm ON owners USING GIN (ownr_co_nm gin_trgm_ops);\nCREATE
|
||||
INDEX idx_owners_ownr_ph1 ON owners USING GIN (ownr_ph1 gin_trgm_ops);\nCREATE
|
||||
INDEX idx_owners_ownr_addr1 ON owners USING GIN (ownr_addr1 gin_trgm_ops);\n\n\nCREATE
|
||||
OR REPLACE FUNCTION public.search_owners(search text)\n RETURNS SETOF owners\n
|
||||
LANGUAGE plpgsql\n STABLE\nAS $function$\n\nBEGIN\n if search = '' then\n return
|
||||
query select * from owners ;\n else \n return query SELECT\n *\nFROM\n
|
||||
\ owners\nWHERE\n search <% (ownr_fn) OR\n search <% (ownr_ln) OR\n search
|
||||
<% (ownr_co_nm) OR\n search <% (ownr_ph1) OR\n search <% (ownr_addr1);\n end
|
||||
if;\n\n\tEND\n$function$;"
|
||||
type: run_sql
|
||||
- args:
|
||||
name: search_owners
|
||||
schema: public
|
||||
type: track_function
|
||||
@@ -0,0 +1,45 @@
|
||||
- args:
|
||||
role: user
|
||||
table:
|
||||
name: owners
|
||||
schema: public
|
||||
type: drop_select_permission
|
||||
- args:
|
||||
permission:
|
||||
allow_aggregations: false
|
||||
columns:
|
||||
- allow_text_message
|
||||
- accountingid
|
||||
- ownr_addr1
|
||||
- ownr_addr2
|
||||
- ownr_city
|
||||
- ownr_co_nm
|
||||
- ownr_ctry
|
||||
- ownr_ea
|
||||
- ownr_fn
|
||||
- ownr_ln
|
||||
- ownr_ph1
|
||||
- ownr_ph2
|
||||
- ownr_st
|
||||
- ownr_title
|
||||
- ownr_zip
|
||||
- preferred_contact
|
||||
- created_at
|
||||
- updated_at
|
||||
- id
|
||||
- shopid
|
||||
computed_fields: []
|
||||
filter:
|
||||
bodyshop:
|
||||
associations:
|
||||
_and:
|
||||
- user:
|
||||
authid:
|
||||
_eq: X-Hasura-User-Id
|
||||
- active:
|
||||
_eq: true
|
||||
role: user
|
||||
table:
|
||||
name: owners
|
||||
schema: public
|
||||
type: create_select_permission
|
||||
@@ -0,0 +1,45 @@
|
||||
- args:
|
||||
role: user
|
||||
table:
|
||||
name: owners
|
||||
schema: public
|
||||
type: drop_select_permission
|
||||
- args:
|
||||
permission:
|
||||
allow_aggregations: true
|
||||
columns:
|
||||
- allow_text_message
|
||||
- accountingid
|
||||
- ownr_addr1
|
||||
- ownr_addr2
|
||||
- ownr_city
|
||||
- ownr_co_nm
|
||||
- ownr_ctry
|
||||
- ownr_ea
|
||||
- ownr_fn
|
||||
- ownr_ln
|
||||
- ownr_ph1
|
||||
- ownr_ph2
|
||||
- ownr_st
|
||||
- ownr_title
|
||||
- ownr_zip
|
||||
- preferred_contact
|
||||
- created_at
|
||||
- updated_at
|
||||
- id
|
||||
- shopid
|
||||
computed_fields: []
|
||||
filter:
|
||||
bodyshop:
|
||||
associations:
|
||||
_and:
|
||||
- user:
|
||||
authid:
|
||||
_eq: X-Hasura-User-Id
|
||||
- active:
|
||||
_eq: true
|
||||
role: user
|
||||
table:
|
||||
name: owners
|
||||
schema: public
|
||||
type: create_select_permission
|
||||
@@ -2948,6 +2948,7 @@ tables:
|
||||
_eq: X-Hasura-User-Id
|
||||
- active:
|
||||
_eq: true
|
||||
allow_aggregations: true
|
||||
update_permissions:
|
||||
- role: user
|
||||
permission:
|
||||
@@ -3983,6 +3984,9 @@ functions:
|
||||
- function:
|
||||
schema: public
|
||||
name: search_owner
|
||||
- function:
|
||||
schema: public
|
||||
name: search_owners
|
||||
- function:
|
||||
schema: public
|
||||
name: search_payments
|
||||
|
||||
Reference in New Issue
Block a user