nxp-notification-configuration-ui-library
Advanced tools
Nxp-Notifications-Ui-Library is a vueJs library for managing institution Notification settings.
Readme
Nxp-Notifications-Ui-Library is a vueJs library for managing institution Notification settings.
via npm :
---------
npm i nxp-notification-configuration-ui-library
in package.json with specific version :
"nxp-notification-configuration-ui-library": "^1.0.0",
---------
| institution |
------------- | ------------- |
Type | Object |
close : when the user click on Close Button.
You can simply import The base Componenet as follow :
<nxp-notification-configuration
:institution="institution"
/>
with Properties as follow :
institution : {
institutionId :'000001',
institutionName : 'BMCE Bank'
}
VueNxpUiComponents :
"vue-nxp-ui-components": "^2.1.4",
Axios :
"axios": "^0.21.1",
"vue-axios": "^3.2.4",
VueMultiSelect :
"vue-multiselect": "^2.1.6",
VueLidate :
"vuelidate": "^0.7.6",
i18n :
"vue-i18n": "^8.17.3",
Notyf :
"notyf": "^3.9.0",
FontAwesome Icons :
"@fortawesome/fontawesome-svg-core": "^1.2.32",
"@fortawesome/free-brands-svg-icons": "^5.15.1",
"@fortawesome/free-regular-svg-icons": "^5.15.1",
"@fortawesome/free-solid-svg-icons": "^5.15.1",
"@fortawesome/vue-fontawesome": "^2.0.0",
After Installing the Requirements, Use them Globaly in your main.js file
import NxpUiLibrary from 'vue-nxp-ui-components'
Vue.use(NxpUiLibrary);
import axios from 'axios';
import VueAxios from 'vue-axios';
Vue.use(VueAxios, axios);
import i18n from '../src/plugins/i18n'
//use i18n
import {FontAwesomeIcon} from '@fortawesome/vue-fontawesome';
Vue.component('font-awesome-icon', FontAwesomeIcon);
//use the library globally
import NxpNotificationConfigurationUiLibrary from 'nxp-notification-configuration-ui-library';
Vue.use(NxpNotificationConfigurationUiLibrary);
import Vuelidate from 'vuelidate';
Vue.use(Vuelidate);
NB:
Add Multiselect CSS.This can be added as a static asset or inside your App.vue.
en.json :
---------
{
"notification-settings" : {
"card-title": "Notification Settings",
"space": {
"configuration-name": "Configuration Name",
"no-notifications-found": "No Notification Configuration Found",
"configuration-deleted": "configuration has been Deleted",
"errors": {
"notification-ms-down": "notification microservice might be down...",
"configuration-used-error": "Cannot delete a configuration that is used in a BIN",
"parameters-ms-down": "parameters microservice might be down..."
}
},
"add-view": {
"input-labels": {
"configuration-name": "Configuration Name *",
"configuration-type": "Configuration Type *",
"add-channel": "Add Channel",
"configuration-channel": "Configuration Channel*",
"notification-strategy": "Notification Strategy *",
"server-address": "Server Address *",
"server-port": "Server Port *",
"from-email": "From Email *",
"from-password": "From Password *"
},
"validation-errors": {
"notification-error-message": "All fields are required",
"configuration-name-required": "Configuration name is required",
"configuration-type-required": "Configuration type is required",
"smtp-configuration-email-required": "email is required",
"smtp-configuration-password-required": "password is required",
"smtp-configuration-server-address-required": "server address is required",
"smtp-configuration-server-port-required": "server port is required"
},
"notyf": {
"success" : "configuration has been added!",
"reset": "the form has been reset!"
},
"api-errors": {
"duplicated-configuration-name": "duplicated configuration name!",
"institution-not-found" : "institution not found!"
}
},
"update-view": {
"input-labels": {
"configuration-name": "Configuration Name",
"add-channel": "Add Channel",
"configuration-channel": "Configuration Channel*",
"notification-strategy": "Notification Strategy *",
"server-address": "Server Address *",
"server-port": "Server Port *",
"from-email": "From Email *",
"from-password": "From Password *"
},
"validation-errors": {
"notification-error-message": "All fields are required",
"configuration-name-required": "Configuration name is required",
"configuration-type-required": "Configuration type is required",
"smtp-configuration-email-required": "email is required",
"smtp-configuration-password-required": "password is required",
"smtp-configuration-server-address-required": "server address is required",
"smtp-configuration-server-port-required": "server port is required"
},
"notyf": {
"success" : "configuration has been updated!",
"reset": "the form has been reset!"
},
"api-errors": {
"configuration-non-existing": "Cannot Update Non existing Configuration"
}
},
"details-view": {
"input-labels": {
"configuration-name": "Configuration Name",
"configuration-channel": "Configuration Channel",
"notification-strategy": "Notification Strategy",
"server-address": "Server Address",
"server-port": "Server Port",
"from-email": "From Email",
"from-password": "From Password"
}
}
}
}
fr.json :
---------
{
"institution-settings" : {
"card-title": "Gestion de Notification",
"space": {
"configuration-name": "Nom Configuration",
"no-notifications-found": "Aucune configuration de notification trouvée",
"configuration-deleted": "la configuration a été supprimée avec success",
"errors": {
"notification-ms-down": "le microservice de notifications est non disponible...",
"configuration-used-error": "Impossible de supprimer une configuration utilisée dans un BIN",
"parameters-ms-down": "le microservice parameters est non disponible..."
}
},
"add-view": {
"input-labels": {
"configuration-name": "Nom configuration *",
"configuration-type": "Type configuration *",
"configuration-protocol": "Protocole configuration *",
"add-channel": "Ajouter un Canal",
"configuration-channel": "Canal de configuration *",
"notification-strategy": "Stratégie de notification *",
"server-address": "Adresse du serveur *",
"server-port": "Port du serveur *",
"from-email": "Email Envoie *",
"from-password": "Mot de passe Envoie *"
},
"validation-errors": {
"notification-error-message": "Tous les champs sont requis",
"configuration-name-required": "Le nom de la configuration est requis",
"configuration-type-required": "Le type de configuration est requis",
"smtp-configuration-email-required": "email d'envoie est requis",
"smtp-configuration-password-required": "le mot de passe est requis",
"smtp-configuration-server-address-required": "addresse du serveur est requise",
"smtp-configuration-server-port-required": "port du serveur est requis"
},
"notyf": {
"success" : "La configuration a été ajoutée!",
"reset": "le formulaire a été réinitialisé!"
},
"api-errors": {
"duplicated-configuration-name": "nom de configuration est dupliqué!",
"institution-not-found" : "institution introuvable!"
}
},
"update-view": {
"input-labels": {
"configuration-name": "Nom configuration",
"add-channel": "Ajouter un Canal",
"configuration-channel": "Canal de configuration *",
"notification-strategy": "Stratégie de notification *",
"server-address": "Adresse du serveur *",
"server-port": "Port du serveur *",
"from-email": "Email Envoie *",
"from-password": "Mot de passe Envoie *"
},
"validation-errors": {
"notification-error-message": "Tous les champs sont requis",
"configuration-name-required": "Le nom de la configuration est requis",
"configuration-type-required": "Le type de configuration est requis",
"smtp-configuration-email-required": "email d'envoie est requis",
"smtp-configuration-password-required": "le mot de passe est requis",
"smtp-configuration-server-address-required": "addresse du serveur est requise",
"smtp-configuration-server-port-required": "port du serveur est requis"
},
"notyf": {
"success" : "la configuration a été mis à jour!",
"reset": "le formulaire a été réinitialisé!"
},
"api-errors": {
"configuration-non-existing": "Impossible de mettre à jour une configuration non existante"
}
},
"details-view": {
"input-labels": {
"configuration-name": "Nom configuration",
"configuration-channel": "Canal de configuration",
"notification-strategy": "Stratégie de notification",
"server-address": "Adresse du serveur",
"server-port": "Port du serveur",
"from-email": "Email Envoie",
"from-password": "Mot de passe Envoie"
}
}
}
}
to display icons, add this code to your icons.js file
import {library} from "@fortawesome/fontawesome-svg-core";
import {
faCogs,
faCog,
faEdit,
faMinus,
faList,
faChevronDown
} from "@fortawesome/free-solid-svg-icons";
import {faPlusCircle} from "@fortawesome/free-solid-svg-icons/faPlusCircle";
import {faTv} from "@fortawesome/free-solid-svg-icons/faTv";
import {faChevronRight} from "@fortawesome/free-solid-svg-icons/faChevronRight";
import { faFontAwesome } from '@fortawesome/free-brands-svg-icons'
library.add(
faPlusCircle,faCog,faMinus,faTv, faChevronRight,faChevronDown,faEdit,faCog,faMinus,faTv, faChevronRight,faChevronDown,faEdit, faCog, faCogs, faList, faFontAwesome);
in order to communicate with your Notification Apis add environment variables
.env file :
-----------
VUE_APP_ITSP_NOTIFICATION_URL = Your_Host_Url
.env.production :
-----------------
VUE_APP_ITSP_NOTIFICATION_URL = $ITSP_NOTIFICATION_URL
jenkins file (post validation) :
--------------------------------
ITSP_NOTIFICATION_URL="https://notifications-transvers-integration.app.dev.s2m.ma/api/"
a sample example of using this library is available in a private git repository :
git clone https://github.com/BoukhtaAli/Nxp-Institution-Settings-Test.git
contact aboukhta@s2m.ma to get necessary access rights
FAQs
Nxp-Notifications-Ui-Library is a vueJs library for managing institution Notification settings.
The npm package nxp-notification-configuration-ui-library receives a total of 3 weekly downloads. As such, nxp-notification-configuration-ui-library popularity was classified as not popular.
We found that nxp-notification-configuration-ui-library demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
This episode of the Risky Biz podcast discusses how the rise of small open source packages and the shift towards individual maintainers makes the ecosystem more vulnerable to supply chain attacks.
Product
Streamline your login process and enhance security by enabling Single Sign-On (SSO) on the Socket platform, now available for all customers on the Enterprise plan, supporting 20+ identity providers.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.