Usage

Basic sanitize config for the sanitize-html library

Mixin for USelectEntity/USelectMultiple like components to close options dropdown on click outside

The module provides column settings, cell templates,s and filter templates by UB data types or by the customSettings.columnTemplate value. Different types can have the same templates or settings.

Entity attributes with Text, BLOB, TimeLog dataTypes do not have a default render template. If you need to render attributes values with these data types, register a custom column template for them or use column slots. You should decide to display this column type with great caution because this column can create large server requests

See module:formHelpers.computedVuex

Show modal dialog with 3 optional button and text/html content, see uDialogs.dialog

Error dialog, see uDialogs.dialogError

Information dialog, see uDialogs.dialogInfo

Confirmation dialog, see uDialogs.dialogYesNo

Error reporter dialog, see uDialogs.errorReporter

Helper functions for creating files in a specific way: with dictaphone or webcam help

Mixin for reusing common logic needed for registering custom UTableEntity filter templates components

Creates a new instance of UI module. See module:Form.Form

Helper functions for forms. See module:formHelpers. mapInstanceFields and computedVuex are aliased into @unitybase/adminui-vue

A reactive (in terms of Vue reactivity) entities data cache. See examples in lookups module documentation

MagicLinks instance. adminui-vue registers the following commands (using addCommand):

• showList: runs an $App.doCommand({cmdType: 'showList', ...}
• showForm: runs an $App.doCommand({cmdType: 'showForm', ...}
• showReport: runs an $App.doCommand({cmdType: 'showReport', ...}
• setFocus: sets a focus to specified HTML element

Usage of setFocus: <a href="#" data-cmd-type="setFocus" data-elm-id="my-html-element-id">focus other</a>

For usage examples for showList/Form/Repost see magicLinks module documentation

See module:formHelpers.mapInstanceFields

Mount a Vue based component as a navbar tab, a modal form or inside other component (as a container). See mountUtils module documentation for samples.

The module provides the ability to extend default CSS styles, fonts, .etc for the rich text editor (tinymce)

Function for synchronizing between sidebar size and EXT body width needed if need to override sidebar component

throttle-debounce see original doc

Modal uDialogs (message boxes) for showing errors, information and confirmation For usage examples see uDialogs module documentation

Storage for User Interface settings. Wrapper around localStorage

  
      // inside vue can be used as this.$uiSettings
this.videoRatio = this.$uiSettings.get('UFileWebcamButton', 'videoRatio') ?? this.videoRatios[0]
this.$uiSettings.put(this.videoRatios[0], 'UFileWebcamButton', 'videoRatio')

// or from adminui-vue exports
const App = require('@unitybase/adminui-vue')
const isCollapsed = App.uiSettings.get('sidebar', 'isCollapsed')
  

Mixin for using in forms with own single-form validation. Mixin automatically creates and passes a validator instance for use in nested controls (UFormRow for example).

Open files using WebDav protocol (require @ub-e/web-daw to be added into application)

Sanitize-html library with pre-defined basic config if not passed as second argument

Fires after application loads all models and mounts UI

portal:loader event, which shall be set or remove global loader (overlay) over UI, so that user won't trigger action in the process loading, for example, big components over a poor network connection.

  
      try {
      $App.fireEvent('portal:loader', {
        text: 'portal.loader.form',
        show: true
      })

      // Do action which takes long.  Await for it, if just return unresolved promise, the "finally" block execute
      // before action finish
    } finally {
      // ALWAYS use try-finally to avoid loading overlay hanging in case of errors
      $App.fireEvent('portal:loader', {
        text: 'portal.loader.form',
        show: false
      })
    }
  

Fired before the showList (dictionary shown) command. Handler can cancel command by set params.continue = false

  
      window.$App.on('portal:mountTableEntity:before', (params) => {
    if (params.entityName.startsWith('org_') && !$App.connection.userData.hasRole('LocalOrgManager')) {
      params.continue = false // prevent show dictionary
      $App.dialogError('recordNotExistsOrDontHaveRights')
    }
  })
  

Additional components can be added to the Sidebar and NavBar using this event

  
      window.$App.on('applicationReady', () => {
    const SidebarSlotExample = require('./samples/SidebarSlotExample.vue').default
    $App.fireEvent('portal:sidebar:defineSlot', SidebarSlotExample, { some attrs })

    const NavBarSlotExample = require('./samples/NavbarSlotExample.vue').default
    $App.fireEvent('portal:navbar:defineSlot', NavBarSlotExample, { some attrs })
  }
  

Insert some elements into user menu

  
      Vue.nextTick(() => {
    const UserButtonSelectDepartment = require('./components/UserButtonSelectDepartment.vue').default
    $App.fireEvent('portal:navbar:userButton:appendSlot', UserButtonSelectDepartment, {})
  })
  

Fired when globally resetting UI settings (not for an individual component or property). Handlers can do custom reset UI actions, possible for keys, which do not start with portal:

Fired on desktop changed