openmrs-module-appointments-frontend
openmrs-module-appointments-frontend copied to clipboard
Bahmni
UI for Bahmni Appointment Scheduling written in both React and Angular
Openmrs Module Appointment Dashboard
This repository is extracted appointments module from openmrs-module-bahmniapps. This repository acts as the front end for the Bahmni Appointment Scheduling. It is written in React and Angular.
Differences with OpenMRS-Module-bahmniapps
We have moved away from bower and installing dependencies from NPM.
Below has been the changes in libraries from OpenMRS-Module-bahmniapps
| Library | Change |
|---|---|
| ngDialog | Using ng-dialog instead (Rename). |
| [email protected] | Upgraded to 1.4.1 since the existing version is not present in NPM. Manually changed the line 12 from define(['jquery/jquery'], factory); instead of define(['jquery'], factory);. Reference link |
| angular-ui-router | Renamed to @uirouter/angularjs. |
| angular-bindonce | Using directly from github since the latest is not published in NPM. |
| [email protected] | Using [email protected], since this is the latest version on NPM. According to this thread there are no code changes between 1.3.0 to 1.3.4. |
| jquery-ui-1.10.4.custom.min | Using [email protected] since the jquery-ui is not bundled by default. 1.11.4 is the oldest version on NPM |
- Images for scss are being served in bundled.
Global variables from library
Few libraries(angular, jquery) used in BahmniApps export themselves as global variables. Webpack doesn't support the idea of global variables by default. All these global variables are exported using webpack.ProvidePlugin. Check the webpack.config.js plugins section.
Other Fixes
- According to this issue,
webpackdoesn't work well withangular 1. There has been a fix provided for them usingexports-loader. There were similar issues forjquery 1.
Duplicate code
- Duplicated
error-routehandler. It is a small utility and need not to be extracted in library. If we are putting more stuff, it can go to a library. - Duplicated
openmrs-module-bahmniapps/ui/app/common/constants.js. This can be merged withappointments/constants.js
Running it with bahmni
- Clone the repo
- Go to UI folder and install dependencies
cd ui && npm install - Switch back to root folder
cd .. - Run
npm install - RUN
npm run build - Take a backup of
/var/www/bahmniapps/appointments.(vagrant) - Replace content of
/var/www/bahmniapps/appointmentswith generateddistfolder content.(Vagrant) - Go to bahmni Appointment scheduling UI. It should serve new appointments content.
Running Tests
- Run
npm run test.
React
Build
npm run build-react
Development
Build with watch
npm run build-react-dev
Run storybook
npm run storybook
Test
npm run test-react
Test with watch
npm run test-react-watch
Deploy
- Create a folder called 'appointments' under '/var/www'.
- Add an alias in httpd ssl.conf, like below:
Alias /appointments /var/www/appointments
Project Structure
|-- .tx
|
|-- scripts
|
`-- ui
|-- Gruntfile.js
|-- app
| |-- appointment
| |-- common
| |-- images
| |-- i18n
| |-- lib
| |-- styles
|-- react-components
| |-- __mocks__
| |-- api
| |-- components
| |-- containers
| |-- stories
| |-- utils
| |-- bahmni-theme.css
| |-- constants.js
| |-- jest.config.js
| |-- variable.scss
|-- test
|-- bower.json
|-- package.json
Bahmni