Appearance
eWizard tokens
eWizard tokens are special markers that are replaced by the matching values, such as the Veeva Vault approval document number or country code, after publishing your e-Detailers and emails from eWizard to Veeva Vault as PDF, and interactive, or when exporting your item to PDF.
To use this feature, check package.json to ensure a Vuex dependency and that the eWizard.js version is 5.27.7 or higher. You can install Vuex when initializing an e-Detailer or an email.
To use tokens, create a Vuex store in your template. For this:
Define the
createStorefunction in the./store/index.jsfile.jsimport Vuex from 'vuex'; import actions from './actions'; import mutations from './mutations'; import getTokensModule from './tokens'; export default ({ settings, navigator, createStoreModule }) => new Vuex.Store({ state: {}, actions, mutations, modules: { tokens: createStoreModule('tokens', getTokensModule()), }, });Make a function where the
statefield returns theimport state from './state.json'value in thetokensmodule. For example, thedefault function:js// ./store/tokens/index.js import state from './state.json'; export default function () { return { state, }; }Import the
createStorefunction and export thedefault functionto the./extensions/store.jsfile.js// ./extensions/store.js import Vuex from 'vuex'; import { createStore } from '../store'; export default function (Vue, { settings, navigator, createStoreModule }) { Vue.use(Vuex); return { store: createStore({ settings, navigator, createStoreModule }), }; }
The token data is stored in the state.json file.
json
// ./store/tokens/state.json
{
"VeevaApprovalDocumentNumber": "AB-12345"
}To display the token, add it to the index.vue file of an e-Detailer slide or the App.vue file of the email layout.
For example, the VeevaApprovalDocumentNumber token:
html
<!-- ./slides/default/index.vue -->
<i18n>
{
"eng": {
"token": "<div><span>{$$.VeevaApprovalDocumentNumber}</span></div>"
}
}
</i18n>
<template>
<wiz-slide>
<wiz-text :text="$t('token', { $$ })"></wiz-text>
</wiz-slide>
</template>
<script>
export default {};
</script>
<style scoped></style>As a result, when you export a Veeva Vault build, the e-Detailer or email is displayed with the token value.
The token name can only include the following:
Lower and upper case letters of the English alphabet:
a–z,A–Z.The
_and$symbols.Numbers.
The token name mustn't begin with a number.