Development of an interactive spare parts catalog on OpenCart

We received an order to develop an interactive online spare parts catalogue on OpenCart. In today's technological world, you can't do without component parts and assemblies, and a convenient system for searching and selecting them in a visual representation on diagrams will be a significant advantage over other sellers and suppliers. The extension for selecting parts from spare parts catalogues on the OpenCart platform is a step towards providing customers with accurate and easy navigation in a large assortment of parts, accessories, assemblies and assemblies. And we have created such an extension.

Functional requirements for catalog development

• Convenient administrative interface.
  
• A separate tab "Online catalogue" in the admin menu for quick access to module management.
• Create, edit, and delete spare parts schemes.
• Ability to upload technical drawings in JPG, PNG, GIF, etc. formats.
• Selecting and creating a folder to store a file with a technical drawing.
• Possibility of multi-level categorisation and grouping of schematics.
• One and the same technical drawing can belong to two or more products/categories.
• A technical drawing has a numbered product in terms of components or a specific product assembly.
• Adding items to the diagram with the mouse and linking products to points.
• Rectangular or circular marking areas.
• The ability to change the size of the marking area, as there may be two or more digits in the item number on the technical drawing.
• The ability to set an automatic fill in the desired colour of the selected area so that the customer sees the specified colour when hovering the mouse cursor, if the item is available in green, yellow on order, and pink out of stock.
• When hovering and/or clicking, the product card window should pop up in a simplified form, with a photo (if the item has a photo or the splash screen does not have a photo), and with the product name and price according to the customer group, if there is a price.
• Under the image of the product in the pop-up window, there should be a green "Buy" button, if the product is available on the site, when you click the button, the product is added to the cart, the customer receives a message that the product "Product Name" has been added to your cart.
• If the product is out of stock, the red "Order" button, if there is a price for this item on the site, when you click it, a new window opens with the internal item in the basket, and this product should be added to the list of favourite products (in Wish list). You cannot order an item that is out of stock.
• If the item is not in the website catalogue, a contact form should open, where the text with the name of the part and assembly is automatically substituted.
• Under the uploaded technical drawing itself, there should be a field in which we indicate the manufacturer's article and a list for auto-completion appears, where this article is used, if there is no product in the site database, then we indicate the article from the manufacturer's catalogue - OEM.
• Sometimes the same item on the technical drawing can have several analogue products, you need to take this into account so that you can specify several items on one number.
• Ensure that only certain groups of customers can access the schemes.
• The website should have the "Online catalogue" button in the main menu.
• SEO-optimisation of the online catalogue, category pages and technical drawing pages for proper indexation in search engines.
• Adaptation to different devices for comfortable viewing on different display sizes.

Screenshots of the work done