Skip to content

Commit

Permalink
perf: product filter on the selected car deal depends on the car cate…
Browse files Browse the repository at this point in the history 
…gory (#5037)
  • Loading branch information
@Gerelsukh
Gerelsukh committed Mar 4, 2024
1 parent 7ad9ae8 commit b42256d
Show file tree
Hide file tree
Showing 7 changed files with 106 additions and 58 deletions.
6 changes: 4 additions & 2 deletions packages/plugin-cars-api/src/graphql/schema/car.ts
View file
@@ -1,6 +1,6 @@
import {
attachmentType,
attachmentInput
attachmentInput,
} from '@erxes/api-utils/src/commonTypeDefs';

export const types = ({ contacts, tags }) => `
Expand Down Expand Up @@ -48,6 +48,7 @@ export const types = ({ contacts, tags }) => `
carCount: Int
image: Attachment
secondaryImages: [Attachment]
productCategoryId: String
}
type Car {
_id: String!
Expand Down Expand Up @@ -143,7 +144,8 @@ const carCategoryParams = `
description: String,
parentId: String,
image: AttachmentInput,
secondaryImages: [AttachmentInput]
secondaryImages: [AttachmentInput],
productCategoryId: String
`;

export const mutations = `
Expand Down
56 changes: 31 additions & 25 deletions packages/plugin-cars-api/src/models/definitions/cars.ts
View file
Expand Up @@ -4,17 +4,17 @@ import { CAR_SELECT_OPTIONS } from './constants';
import { field, schemaHooksWrapper } from './utils';

const getEnum = (fieldName: string): string[] => {
return CAR_SELECT_OPTIONS[fieldName].map(option => option.value);
return CAR_SELECT_OPTIONS[fieldName].map((option) => option.value);
};

const attachmentSchema = new Schema(
{
name: String,
url: String,
type: String,
size: Number
size: Number,
},
{ _id: false }
{ _id: false },
);

const customFieldSchema = new Schema(
Expand All @@ -28,16 +28,16 @@ const customFieldSchema = new Schema(
type: {
type: String,
enum: ['Point'],
optional: true
optional: true,
},
coordinates: {
type: [Number],
optional: true
optional: true,
},
required: false
}
required: false,
},
},
{ _id: false }
{ _id: false },
);

customFieldSchema.index({ locationValue: '2dsphere' });
Expand Down Expand Up @@ -75,6 +75,7 @@ export interface ICarCategory {
description?: string;
image?: any;
secondaryImages?: any[];
productCategoryId?: string;
}

export interface ICarCategoryDocument extends ICarCategory, Document {
Expand All @@ -93,17 +94,22 @@ export const carCategorySchema = schemaHooksWrapper(
description: field({
type: String,
optional: true,
label: 'Description'
label: 'Description',
}),
image: field({ type: attachmentSchema }),
secondaryImages: field({ type: [attachmentSchema] }),
productCategoryId: field({
type: String,
optional: true,
label: 'Product Category Id',
}),
createdAt: field({
type: Date,
default: new Date(),
label: 'Created at'
})
label: 'Created at',
}),
}),
'erxes_carCategory'
'erxes_carCategory',
);

export const carSchema = schemaHooksWrapper(
Expand All @@ -120,14 +126,14 @@ export const carSchema = schemaHooksWrapper(
type: String,
optional: true,
label: 'Plate number',
index: true
index: true,
}),

vinNumber: field({
type: String,
label: 'VIN number',
optional: true,
index: true
index: true,
}),

colorCode: field({ type: String, label: 'Color code', optional: true }),
Expand All @@ -141,7 +147,7 @@ export const carSchema = schemaHooksWrapper(
optional: true,
label: 'Brand',
esType: 'keyword',
selectOptions: CAR_SELECT_OPTIONS.BODY_TYPES
selectOptions: CAR_SELECT_OPTIONS.BODY_TYPES,
}),

fuelType: field({
Expand All @@ -151,7 +157,7 @@ export const carSchema = schemaHooksWrapper(
optional: true,
label: 'Brand',
esType: 'keyword',
selectOptions: CAR_SELECT_OPTIONS.BODY_TYPES
selectOptions: CAR_SELECT_OPTIONS.BODY_TYPES,
}),

gearBox: field({
Expand All @@ -161,19 +167,19 @@ export const carSchema = schemaHooksWrapper(
optional: true,
label: 'Gear box',
esType: 'keyword',
selectOptions: CAR_SELECT_OPTIONS.BODY_TYPES
selectOptions: CAR_SELECT_OPTIONS.BODY_TYPES,
}),

vintageYear: field({
type: Number,
label: 'Vintage year',
default: new Date().getFullYear()
default: new Date().getFullYear(),
}),

importYear: field({
type: Number,
label: 'Imported year',
default: new Date().getFullYear()
default: new Date().getFullYear(),
}),

status: field({
Expand All @@ -184,22 +190,22 @@ export const carSchema = schemaHooksWrapper(
label: 'Status',
esType: 'keyword',
selectOptions: CAR_SELECT_OPTIONS.STATUSES,
index: true
index: true,
}),

description: field({ type: String, optional: true, label: 'Description' }),

tagIds: field({
type: [String],
optional: true,
label: 'Tags'
label: 'Tags',
}),

// Merged car ids
mergedIds: field({
type: [String],
optional: true,
label: 'Merged companies'
label: 'Merged companies',
}),

searchText: field({ type: String, optional: true, index: true }),
Expand All @@ -209,8 +215,8 @@ export const carSchema = schemaHooksWrapper(
customFieldsData: field({
type: [customFieldSchema],
optional: true,
label: 'Custom fields data'
})
label: 'Custom fields data',
}),
}),
'erxes_cars'
'erxes_cars',
);
39 changes: 32 additions & 7 deletions packages/plugin-cars-ui/src/components/carCategory/CategoryForm.tsx
View file
Expand Up @@ -7,15 +7,16 @@ import {
FormControl,
FormGroup,
Uploader,
extractAttachment
extractAttachment,
} from '@erxes/ui/src';
import {
IAttachment,
IButtonMutateProps,
IFormProps
IFormProps,
} from '@erxes/ui/src/types';
import React from 'react';
import { ICarCategory } from '../../types';
import SelectProductCategory from '@erxes/ui-products/src/containers/SelectProductCategory';

type Props = {
categories: ICarCategory[];
Expand All @@ -27,29 +28,32 @@ type Props = {
type State = {
image?: IAttachment;
secondaryImages?: IAttachment[];
productCategoryId?: String;
};

class CategoryForm extends React.Component<Props, State> {
constructor(props) {
super(props);

const category = props.category || ({} as ICarCategory);
const { image, secondaryImages } = category;
const { image, secondaryImages, productCategoryId } = category;

this.state = {
image: image ? image : undefined,
secondaryImages: secondaryImages ? secondaryImages : undefined
secondaryImages: secondaryImages || undefined,
productCategoryId: productCategoryId || '',
};
}

generateDoc = (values: {
_id?: string;
image?: IAttachment;
secondaryImages?: IAttachment[];
productCategoryId?: string;
}) => {
const { category } = this.props;
const finalValues = values;
const { image, secondaryImages } = this.state;
const { image, secondaryImages, productCategoryId } = this.state;

if (category) {
finalValues._id = category._id;
Expand All @@ -60,7 +64,8 @@ class CategoryForm extends React.Component<Props, State> {
return {
...finalValues,
image,
secondaryImages
secondaryImages,
productCategoryId,
};
};
onChangeAttachment = (files: IAttachment[]) => {
Expand All @@ -71,6 +76,10 @@ class CategoryForm extends React.Component<Props, State> {
this.setState({ secondaryImages: files ? files : undefined });
};

onSelectChange = (value) => {
this.setState({ productCategoryId: value });
};

renderContent = (formProps: IFormProps) => {
const { renderButton, closeModal, category, categories } = this.props;
const { values, isSubmitted } = formProps;
Expand Down Expand Up @@ -157,6 +166,22 @@ class CategoryForm extends React.Component<Props, State> {
/>
</FormGroup>

<FormGroup>
<ControlLabel>Product Category</ControlLabel>

<SelectProductCategory
label="Choose product category"
name="productCategoryId"
initialValue={object.productCategoryId || ''}
customOption={{
value: '',
label: '...Clear product category filter',
}}
onSelect={(categoryId) => this.onSelectChange(categoryId)}
multi={false}
/>
</FormGroup>

<ModalFooter>
<Button
btnStyle="simple"
Expand All @@ -172,7 +197,7 @@ class CategoryForm extends React.Component<Props, State> {
values: this.generateDoc(values),
isSubmitted,
callback: closeModal,
object: category
object: category,
})}
</ModalFooter>
</>
Expand Down
51 changes: 31 additions & 20 deletions packages/plugin-cars-ui/src/components/common/CarSection.tsx
View file
Expand Up @@ -5,7 +5,7 @@ import {
ModalTrigger,
MainStyleButtonRelated as ButtonRelated,
__,
SectionBodyItem
SectionBodyItem,
} from '@erxes/ui/src';
import GetConformity from '@erxes/ui-cards/src/conformity/containers/GetConformity';
import React from 'react';
Expand All @@ -31,10 +31,10 @@ function Component(
mainType = '',
mainTypeId = '',
onSelect,
collapseCallback
}: Props
collapseCallback,
}: Props,
) {
const renderCarChooser = props => {
const renderCarChooser = (props) => {
return (
<CarChooser
{...props}
Expand All @@ -44,7 +44,7 @@ function Component(
);
};

const renderRelatedCarChooser = props => {
const renderRelatedCarChooser = (props) => {
return (
<CarChooser
{...props}
Expand Down Expand Up @@ -84,20 +84,31 @@ function Component(
/>
);

const content = (
<>
{items.map((car, index) => (
<SectionBodyItem key={index}>
<Link to={`/erxes-plugin-car/details/${car._id}`}>
<Icon icon="arrow-to-right" />
</Link>
<span>{car.plateNumber || 'Unknown'}</span>
</SectionBodyItem>
))}
{items.length === 0 && <EmptyState icon="building" text="No car" />}
{mainTypeId && mainType && relQuickButtons}
</>
);
const content = () => {
if (items.length > 0) {
const categoryId = items[0].category?.productCategoryId;

localStorage.setItem(
'erxes_products:chooser_filter',
JSON.stringify({ categoryId }),
);
}

return (
<>
{items.map((car, index) => (
<SectionBodyItem key={index}>
<Link to={`/erxes-plugin-car/details/${car._id}`}>
<Icon icon="arrow-to-right" />
</Link>
<span>{car.plateNumber || 'Unknown'}</span>
</SectionBodyItem>
))}
{items.length === 0 && <EmptyState icon="building" text="No car" />}
{mainTypeId && mainType && relQuickButtons}
</>
);
};

return (
<Box
Expand All @@ -107,7 +118,7 @@ function Component(
isOpen={true}
callback={collapseCallback}
>
{content}
{content()}
</Box>
);
}
Expand Down

0 comments on commit b42256d

Please sign in to comment.