Code Monkey home page Code Monkey logo

mojito_pdm's Introduction

mojito_pdm

React / Typescript Catalogue for PDM, complete with test driving and purchasing

Light Theme Colour Picker

Imgur Album

Features

  • High Performance Material UI
  • Filter vehicles by category
  • Pre-configured vehicles and prices
  • Test Driving with configurable locations and timer
  • Buy vehicles from the catalogue
  • Finance vehicles
  • View Outstanding Balances neatly organised in a menu
  • Choose custom RGB colours for your vehicles

Instalation

Download the latest version from the releases. Note that the master branch is not considered the most stable branch and you should not build from master unless you know what you're doing.

If you have buying and finance enabled you need to add the following to your database and install the cron dependency

CREATE TABLE `vehicle_finance` (
    `id` INT(11) NOT NULL AUTO_INCREMENT,
    `plate` VARCHAR(10) NOT NULL COLLATE 'utf8mb4_general_ci',
    `citizenid` VARCHAR(50) NULL DEFAULT NULL COLLATE 'utf8mb4_general_ci',
    `model` VARCHAR(50) NULL DEFAULT NULL COLLATE 'utf8mb4_general_ci',
    `interest_rate` INT(11) NULL DEFAULT NULL,
    `outstanding_bal` INT(11) NULL DEFAULT NULL,
    `warning` TINYINT(4) NULL DEFAULT '0',
    PRIMARY KEY (`id`) USING BTREE,
    INDEX `citizenid` (`citizenid`) USING BTREE,
    INDEX `plate` (`plate`) USING BTREE
) COLLATE='utf8_general_ci' ENGINE=InnoDB AUTO_INCREMENT=1;

Config

{
  "pdmlocation": {"x": -56.54, "y": -1096.18, "z": 26.42},                            // Location to teleport the player back to
  "testdrivespawn": {"x": -16.84, "y":  -1105.11, "z": 26.36, "h": 158.76},           // Location to spawn the car for test drives
  "buylocation": {"x": -16.84, "y":  -1105.11, "z": 26.36, "h": 158.76},	      // Location to spawn the car when it is purchased
  "temporary": {
    "enabled": true,                                                                  // Enable time limit on test drives
    "time": 120                                                                       // Time (in seconds) of the test drive
  },
  "canbuy": true,								      // Set to false to disable buying vehicles
  "colours": true,                                                                    // Set to false to disable custom RGB colours      
  "limit": {                                              
    "enabled": true,                                                                  // Set to true to restrict usage when car dealers are online                                  
    "jobname": "cardealer",                                                           // Name of car dealer job
    "count": 2                                                                        // Maximum amount of car dealers that can be online before restrictions
  },
  "finance": {
    "installment_percent": 10,                                                        // Percentage cost of finance installments
    "runs_on": 1,                                                                     // The day of the week the installments are taken 1 = monday
    "runs_at": "18:30"                                                                // The time of day the installments are taken in 24h format
  },
  "qbtarget": true                                                                    // Enable qb-target by default  
}

By default mojito_pdm comes with some preconfigured vehicles from the base build (DLC content is not included). To add more cars simply add to the cars.json file, this no longer requires a re-build and changes will be seen after restarting the resource.

Usage

By default, the resource is configured with qb-target however if you wish to disable this and do it your own way you can do the following:

To open the catalogue trigger the event mojito_pdm:client:open To open the propmt to check finance trigger the event mojito_pdm:client:check_finance

Building

Builds are automatically generated when a tagged release is pushed, to build manually from the master branch you can use the following:

Yarn:

To build the UI: cd ui -> yarn -> yarn build

To build the script: cd resources -> yarn -> yarn build

NPM:

To build the UI:

cd ui -> npm i -> npm run build

To build the script:

cd resources -> npm i -> npm run build

Developing

Issues and pull requests are welcomed.

This project is using Project Error's React Boilerplate which comes with useful utilities, use yarn start to start the dev server or yarn start:game to open the dev server and build at the same time.

Credits

  • Images and Brand Logos taken from GTA Fandom Wiki under CC-BY-SA license
  • Build and Release script taken from fivem-appearance under MIT license
  • Github Actions workflow was created by Taso for txAdmin under MIT license

Creative Commons License
This work is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.

mojito_pdm's People

Contributors

liamdormon avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

mojito_pdm's Issues

Unable to change the colour

Not sure if its just my case, but after selecting a colour, and purchasing the vehicle, you can no longer change the colour of that vehicle.
Seems to be happening with all of the colours.

Using vMenu and qb-customs to modify the cars.

Cannot read properties of undefined

all of the sudden getting this error when trying to open the UI

[ script:mojito_pdm] SCRIPT ERROR in event `fetch:pdm_online': TypeError: Cannot read properties of undefined (reading 'name')
[ script:mojito_pdm] > eval (webpack://mojito_pdm/./server/server.ts?:117)
[ script:mojito_pdm] > eval (webpack://mojito_pdm/./node_modules/@project-error/pe-utils/lib/server/sv_utils.js?:38)
[ script:mojito_pdm]

I dont see the catalogue in games

Hello excuse me to disturb you but I do not see the catalog in games do you know where it could come from?
However it starts fine in the console

Thanks for your help

Sincerely, AwoxiZ

[BUG] UI not opening

whenever the resource starts it throws
TypeError: Cannot read property 'map' of null (@mojito_pdm/ui/build/static/js/2.e4f98f24.chunk.js:2)
which makes it unable to show the UI when selecting Open Catalogue

Using lastest release 2.5.0
All up-to date default QBCore files

Cars.json is included in build

Having Cars.json included in build prevents user from editing the vehicles in the catalog unless they build from source. Inconsistencies can arise between PDM Catalog and Shared lua.

Menu does not open

Hi everyone, I'm not able to open the vehicleshop menu... I put it in qb-target and cd_drawtextui but none of them works. Anyone have an idea what it could be? PS: It doesn't give any error
Thanks in advance!

no options

I have no options in pdm for the catalog? i have went to the coords and nothing.. i see all this to build the UI do do yarn. but i am unsure on how to do this? is there something i am missing?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.