@questwork/vue-q-widget-vue3 3.1.0

package/lib/helpers/utilities/setId/setId.js

@@ -0,0 +1,10 @@
+function setId(name) {
+  return `${name}-${Math.floor(Math.random() * 1000000000)}`
+}
+
+export default {
+  setId
+}
+export {
+  setId
+}

package/lib/index.js

@@ -0,0 +1,2 @@
+export * from './helpers'
+export * from './models'

package/lib/models/configs/config.js

@@ -0,0 +1,23 @@
+class Config {
+  constructor(opt = {}) {
+    this.css = opt.css
+    this.configType = 'Config'
+  }
+
+  get isValid() {
+    return !!this
+  }
+
+  static init(config) {
+    const instance = new this(config)
+    return instance.isValid ? instance : null
+  }
+}
+
+export default {
+  Config
+}
+
+export {
+  Config
+}

package/lib/models/configs/elementQForm/buttonHandler.js

@@ -0,0 +1,68 @@
+function buttonHandler(obj, helpers) {
+  const { button, klass } = obj
+  const { element } = helpers
+  const state = element.getState() || {}
+  const { formData = {} } = state
+  class QWidgetQFormButton extends klass {
+    constructor(opt) {
+      super(opt)
+      this.hidden = opt.hidden || false
+      this.permissionResult = opt.permissionResult
+      this.permissionResultHandler(this.permissionResult)
+    }
+
+    get isValid() {
+      return !this.hidden
+        && super.isValid
+    }
+
+    static init(options, _helpers) {
+      if (options instanceof QWidgetQFormButton) {
+        return options
+      }
+      const permissionResult = options.permissions ? _helpers.permissionHandler(options.permissions, formData) : {
+        isAllowCreate: true,
+        isAllowRead: true,
+        isAllowUpdate: true,
+        isAllowDelete: true,
+      }
+      const instance = new QWidgetQFormButton({
+        ...options,
+        permissionResult
+      })
+      return instance.isValid ? instance : null
+    }
+
+    permissionResultHandler(permissionResult) {
+      const {
+        event, isAllowCreate, isAllowRead, isAllowUpdate, isAllowDelete
+      } = permissionResult
+      if (event) {
+        if (typeof this[event] === 'function') {
+          this[event]({ val: true })
+        } else {
+          console.log(`do not have the event ${event}`)
+        }
+      } else if (!(isAllowCreate && isAllowRead && isAllowUpdate && isAllowDelete)) {
+        this.setHidden({ val: true })
+      }
+    }
+
+    setDisabled({ val }) {
+      this.disabled = val
+    }
+
+    setHidden({ val }) {
+      this.hidden = val
+    }
+  }
+  return QWidgetQFormButton.init(button, helpers)
+}
+
+export default {
+  buttonHandler
+}
+
+export {
+  buttonHandler
+}

package/lib/models/configs/elementQForm/elementQForm.js

@@ -0,0 +1,34 @@
+import { Config } from '../config'
+import { makeFormHandler } from './makeFormHandler'
+
+class ElementQFormConfig extends Config {
+  constructor(opt = {}) {
+    super(opt)
+    this.configType = 'ElementQFormConfig'
+    this.buttons = opt.buttons
+    this.css = opt.css || {}
+    this.disabledForm = opt.disabledForm || false
+    this.eventName = opt.eventName || {}
+    this.formHandler = makeFormHandler(opt.helpers)
+    this.layout = opt.layout
+    this.previewForm = opt.previewForm || false
+    this.updateLayoutConfigs = opt.updateLayoutConfigs || []
+  }
+
+  get isValid() {
+    return !!this
+  }
+
+  static init(layout) {
+    const instance = new this(layout)
+    return instance.isValid ? instance : null
+  }
+}
+
+export default {
+  ElementQFormConfig
+}
+
+export {
+  ElementQFormConfig
+}

package/lib/models/configs/elementQForm/index.js

@@ -0,0 +1 @@
+export { ElementQFormConfig } from './elementQForm'

package/lib/models/configs/elementQForm/makeFormHandler.js

@@ -0,0 +1,27 @@
+import { buttonHandler } from './buttonHandler'
+import { nodeHandler } from './nodeHandler'
+
+function makeFormHandler(helpers) {
+  return (obj) => {
+    const { type } = obj
+    switch (type) {
+      case ('button'): {
+        return buttonHandler(obj, helpers)
+      }
+      case ('node'): {
+        return nodeHandler(obj, helpers)
+      }
+      default: {
+        return null
+      }
+    }
+  }
+}
+
+export default {
+  makeFormHandler
+}
+
+export {
+  makeFormHandler
+}

package/lib/models/configs/elementQForm/nodeHandler.js

@@ -0,0 +1,60 @@
+function nodeHandler(obj, helpers) {
+  const { layout, klass } = obj
+  const { element } = helpers
+  const state = element.getState() || {}
+  const { formData = {} } = state
+  class QWidgetQFormNode extends klass {
+    constructor(opt) {
+      super(opt)
+      this.permissionResult = opt.permissions ? helpers.permissionHandler(opt.permissions, formData) : {
+        isAllowCreate: true,
+        isAllowRead: true,
+        isAllowUpdate: true,
+        isAllowDelete: true,
+      }
+      this.permissionResultHandler(this.permissionResult)
+    }
+
+    permissionResultHandler(permissionResult) {
+      const { event, isAllowCreate, isAllowRead, isAllowUpdate, isAllowDelete } = permissionResult
+      if (event) {
+        if (typeof this[event] === 'function') {
+          this[event]({ val: true })
+        } else {
+          console.log(`do not have the event ${event}`)
+        }
+      } else if (!isAllowRead) {
+        this.setHidden({ val: true })
+      } else if (!isAllowUpdate) {
+        this.setPreview({ val: true })
+      }
+      if (Array.isArray(this.children)) {
+        this.children.forEach((child) => {
+          child.permissionResultHandler(permissionResult)
+        })
+      }
+    }
+
+    setDecoratorDisabled({ val }) {
+      this.setDisabled({ val })
+    }
+
+    setDecoratorHidden({ val }) {
+      this.setHidden({ val })
+    }
+
+    setDecoratorPreview({ val }) {
+      this.setPreview({ val })
+    }
+  }
+  const i = QWidgetQFormNode.init(layout)
+  return i
+}
+
+export default {
+  nodeHandler
+}
+
+export {
+  nodeHandler
+}

package/lib/models/configs/elementQGrid/elementQGrid.js

@@ -0,0 +1,50 @@
+import { Config } from '../config'
+import { makeClasses } from './makeClasses'
+
+class ElementQGridConfig extends Config {
+  constructor(opt = {}) {
+    super(opt)
+    this.configType = 'ElementQGridConfig'
+    this.classes = makeClasses({
+      helpers: opt.helpers
+    })
+    this.converter = makeConvert({
+      helpers: opt.helpers,
+    })
+    this.eventName = opt.eventName
+    this.layout = opt.layout
+    this.fillLastRow = opt.fillLastRow
+    this.placeholder = opt.placeholder
+    this.urlDelegate = opt.urlDelegate
+  }
+
+  get isValid() {
+    return !!this
+  }
+
+  static init(layout) {
+    const instance = new this(layout)
+    return instance.isValid ? instance : null
+  }
+}
+
+function makeConvert({ helpers }) {
+  const { element } = helpers
+  const { converter } = element.getHandlers()
+  if (typeof converter !== 'function') {
+    return (item) => (item)
+  }
+  const { QItem } = helpers.qGrid
+  return converter({
+    helpers: {
+      QItem,
+      ...helpers,
+    },
+  })
+}
+
+export default {
+  ElementQGridConfig,
+}
+
+export { ElementQGridConfig }

package/lib/models/configs/elementQGrid/index.js

@@ -0,0 +1 @@
+export { ElementQGridConfig } from './elementQGrid'

package/lib/models/configs/elementQGrid/makeClasses.js

@@ -0,0 +1,86 @@
+// The current (vue-q-grid@0.1.20) return type must be { Cell: CustomCell } or {}
+// where CustomCell extends from Cell.
+function makeClasses({ helpers }) {
+  const { element } = helpers
+  const { getClasses } = element.getHandlers()
+
+  const { Cell } = helpers.qGrid
+  class QWidgetQGridCell extends Cell {
+    constructor(opt) {
+      super(opt)
+      if (typeof opt.hidden === 'function') {
+        this.permissionHidden = opt.hidden(this.item.item, this)
+      } else {
+        this.permissionHidden = opt.hidden || false
+      }
+      this.permissionResult = opt.permissionResult
+      this.permissionResultHandler(this.permissionResult, opt.customComponentName)
+    }
+
+    get isValid() {
+      return this.permissionHidden === false
+    }
+
+    static init(options) {
+      const { permissions } = options
+      const permissionResult = permissions ? helpers.permissionHandler(permissions) : {
+        isAllowCreate: true,
+        isAllowRead: true,
+        isAllowUpdate: true,
+        isAllowDelete: true,
+      }
+      const instance = new this({
+        ...options,
+        permissionResult
+      })
+
+      return instance.isValid ? instance : null
+    }
+
+    permissionResultHandler(permissionResult, customComponentName) {
+      const {
+        event, isAllowCreate, isAllowRead, isAllowUpdate, isAllowDelete
+      } = permissionResult
+      if (event) {
+        if (typeof this[event] === 'function') {
+          this[event]({ val: true })
+        } else {
+          console.log(`do not have the event ${event}`)
+        }
+        return
+      }
+
+      const isButton = customComponentName === 'q-grid-body-row-cell-button'
+      if (
+        (!isButton && !isAllowRead)
+      || (!(isAllowCreate && isAllowRead && isAllowUpdate && isAllowDelete))
+      ) {
+        this.setHidden({ val: true })
+      }
+    }
+
+    setHidden({ val }) {
+      this.permissionHidden = val
+    }
+  }
+
+  if (typeof getClasses !== 'function') {
+    return {
+      Cell: QWidgetQGridCell
+    }
+  }
+  return getClasses({
+    helpers: {
+      Cell: QWidgetQGridCell,
+      ...helpers,
+    },
+  })
+}
+
+export default {
+  makeClasses
+}
+
+export {
+  makeClasses
+}

package/lib/models/configs/elementQList/elementQList.js

@@ -0,0 +1,75 @@
+import { Config } from '../config'
+import { makeQWidgetQListBulkButton } from './makeQWidgetQListBulkButton'
+import { makeQWidgetQListButton } from './makeQWidgetQListButton'
+import { makeQWidgetQListHeader } from './makeQWidgetQListHeader'
+
+class ElementQListConfig extends Config {
+  constructor(opt = {}) {
+    super(opt)
+    this.configType = 'ElementQListConfig'
+    this.bulkAction = initBulkAction({
+      bulkAction: opt.bulkAction,
+      helpers: opt.helpers,
+    })
+    this.converter = makeConvert({
+      actions: opt.actions,
+      helpers: opt.helpers,
+    })
+    this.css = opt.css
+    this.eventName = opt.eventName
+    this.headers = initHeaders({
+      headers: opt.headers,
+      helpers: opt.helpers,
+    })
+    this.listStyle = opt.listStyle || 'q-list-table'
+    this.listShowFooter = opt.showFooter || false
+    this.listSortBys = opt.sortBys
+    this.noDataMessage = opt.noDataMessage
+  }
+
+  get isValid() {
+    return !!this
+  }
+
+  static init(layout) {
+    const instance = new this(layout)
+    return instance.isValid ? instance : null
+  }
+}
+
+function initBulkAction({ bulkAction = {}, helpers }) {
+  const QWidgetQListBulkButton = makeQWidgetQListBulkButton({ helpers })
+  return {
+    ...bulkAction,
+    actions: QWidgetQListBulkButton.initOnlyValidFromArray(bulkAction.actions, helpers),
+  }
+}
+
+function initHeaders({ headers, helpers }) {
+  const QWidgetQListHeader = makeQWidgetQListHeader({ helpers })
+  return QWidgetQListHeader.initOnlyValidFromArray(headers, helpers)
+}
+
+function makeConvert({ actions, helpers }) {
+  const { QRow } = helpers.qList
+  const QWidgetQListButton = makeQWidgetQListButton({ helpers })
+  const _helpers = {
+    QListButton: QWidgetQListButton,
+    QRow,
+    ...helpers,
+  }
+  const { element } = _helpers
+  const { converter } = element.getHandlers()
+  if (typeof converter !== 'function') {
+    return (row) => (row)
+  }
+  return converter({ actions, helpers: _helpers })
+}
+
+export default {
+  ElementQListConfig
+}
+
+export {
+  ElementQListConfig
+}

package/lib/models/configs/elementQList/index.js

@@ -0,0 +1 @@
+export { ElementQListConfig } from './elementQList'

package/lib/models/configs/elementQList/makeQWidgetQListBulkButton.js

@@ -0,0 +1,78 @@
+function makeQWidgetQListBulkButton({ helpers }) {
+  const { QListBulkButton } = helpers.qList
+  const { getValidation } = helpers.qUtilities
+  class QWidgetQListBulkButton extends QListBulkButton {
+    constructor(opt) {
+      super(opt)
+      this.hidden = opt.hidden || false
+      this.permissionResult = opt.permissionResult
+      this.permissionResultHandler(this.permissionResult)
+    }
+
+    get isValid() {
+      return !this.hidden
+      // && super.isValid
+    }
+
+    static init(options, _helpers) {
+      if (options instanceof QWidgetQListBulkButton) {
+        return options
+      }
+      const { restriction, permissions } = options
+      const data = _helpers.controller.getState()
+      if (!getValidation({ rule: restriction, data })) {
+        return null
+      }
+      const permissionResult = permissions ? _helpers.permissionHandler(permissions) : {
+        isAllowCreate: true,
+        isAllowRead: true,
+        isAllowUpdate: true,
+        isAllowDelete: true,
+      }
+      const instance = new QWidgetQListBulkButton({
+        ...options,
+        permissionResult
+      })
+      return instance.isValid ? instance : null
+    }
+
+    static initFromArray(arr, _helpers) {
+      if (Array.isArray(arr)) {
+        return arr.map((i) => (this.init(i, _helpers)))
+      }
+      return []
+    }
+
+    static initOnlyValidFromArray(arr, _helpers) {
+      return this.initFromArray(arr, _helpers).filter((i) => i)
+    }
+
+    permissionResultHandler(permissionResult) {
+      const {
+        event, isAllowCreate, isAllowRead, isAllowUpdate, isAllowDelete
+      } = permissionResult
+      if (event) {
+        if (typeof this[event] === 'function') {
+          this[event]({ val: true })
+        } else {
+          console.log(`do not have the event ${event}`)
+        }
+      } else if (!(isAllowCreate && isAllowRead && isAllowUpdate && isAllowDelete)) {
+        this.setHidden({ val: true })
+      }
+    }
+
+    setHidden({ val }) {
+      this.hidden = val
+    }
+  }
+  return QWidgetQListBulkButton
+}
+
+export default {
+  makeQWidgetQListBulkButton
+}
+
+export {
+  makeQWidgetQListBulkButton
+}

package/lib/models/configs/elementQList/makeQWidgetQListButton.js

@@ -0,0 +1,83 @@
+function makeQWidgetQListButton({ helpers }) {
+  const { QListButton } = helpers.qList
+  class QWidgetQListButton extends QListButton {
+    constructor(opt) {
+      super(opt)
+      this.endpoint = convertUrlPath(opt.endpoint, opt.qRow)
+      this.httpMethod = opt.httpMethod
+      this.hidden = opt.hidden || false
+      this.permissionResult = opt.permissionResult
+      this.permissionResultHandler(this.permissionResult)
+      this.url = convertUrlPath(opt.url, opt.qRow)
+    }
+
+    get isValid() {
+      return !this.hidden
+        && super.isValid
+    }
+
+    static init(options, _helpers) {
+      if (options instanceof QWidgetQListButton) {
+        return options
+      }
+      const permissionResult = options.permissions ? _helpers.permissionHandler(options.permissions, options.qRow.get()) : {
+        isAllowCreate: true,
+        isAllowRead: true,
+        isAllowUpdate: true,
+        isAllowDelete: true,
+      }
+      const instance = new QWidgetQListButton({
+        ...options,
+        permissionResult
+      })
+      return instance.isValid ? instance : null
+    }
+
+    static initFromArray(arr, _helpers) {
+      if (Array.isArray(arr)) {
+        return arr.map((i) => (this.init(i, _helpers)))
+      }
+      return []
+    }
+
+    static initOnlyValidFromArray(arr, _helpers) {
+      return this.initFromArray(arr, _helpers).filter((i) => i)
+    }
+
+    permissionResultHandler(permissionResult) {
+      const {
+        event, isAllowCreate, isAllowRead, isAllowUpdate, isAllowDelete
+      } = permissionResult
+      if (event) {
+        if (typeof this[event] === 'function') {
+          this[event]({ val: true })
+        } else {
+          console.log(`do not have the event ${event}`)
+        }
+      } else if (!(isAllowCreate && isAllowRead && isAllowUpdate && isAllowDelete)) {
+        this.setHidden({ val: true })
+      }
+    }
+
+    setHidden({ val }) {
+      this.hidden = val
+    }
+  }
+  return QWidgetQListButton
+}
+
+function convertUrlPath(string, qRow) {
+  if (!string) {
+    return ''
+  }
+  const patternMatch = /\$\{(.+?)\}/g
+  return string.replace(patternMatch, (match, key) => qRow.get(key.trim()))
+}
+
+export default {
+  makeQWidgetQListButton
+}
+
+export {
+  makeQWidgetQListButton
+}

package/lib/models/configs/elementQList/makeQWidgetQListHeader.js

@@ -0,0 +1,75 @@
+
+function makeQWidgetQListHeader() {
+  class QWidgetQListHeader {
+    constructor(opt) {
+      Object.keys(opt).forEach((key) => {
+        this[key] = opt[key]
+      })
+      this.hidden = opt.hidden || false
+      this.permissionResult = opt.permissionResult
+      this.permissionResultHandler(this.permissionResult)
+    }
+
+    get isValid() {
+      return !this.hidden
+    }
+
+    static init(options, _helpers) {
+      if (options instanceof QWidgetQListHeader) {
+        return options
+      }
+      const { children, permissions } = options
+      const permissionResult = permissions ? _helpers.permissionHandler(permissions) : {
+        isAllowCreate: true,
+        isAllowRead: true,
+        isAllowUpdate: true,
+        isAllowDelete: true,
+      }
+      const instance = new QWidgetQListHeader({
+        ...options,
+        children: Array.isArray(children) ? this.initOnlyValidFromArray(children, _helpers) : null,
+        permissionResult
+      })
+      return instance.isValid ? instance : null
+    }
+
+    static initFromArray(arr, _helpers) {
+      if (Array.isArray(arr)) {
+        return arr.map((i) => (this.init(i, _helpers)))
+      }
+      return []
+    }
+
+    static initOnlyValidFromArray(arr, _helpers) {
+      return this.initFromArray(arr, _helpers).filter((i) => i)
+    }
+
+    permissionResultHandler(permissionResult) {
+      const {
+        event, isAllowCreate, isAllowRead, isAllowUpdate, isAllowDelete
+      } = permissionResult
+      if (event) {
+        if (typeof this[event] === 'function') {
+          this[event]({ val: true })
+        } else {
+          console.log(`do not have the event ${event}`)
+        }
+      } else if (!isAllowRead) {
+        this.setHidden({ val: true })
+      }
+    }
+
+    setHidden({ val }) {
+      this.hidden = val
+    }
+  }
+  return QWidgetQListHeader
+}
+
+export default {
+  makeQWidgetQListHeader
+}
+
+export {
+  makeQWidgetQListHeader
+}

package/lib/models/configs/index.js

@@ -0,0 +1,3 @@
+export * from './elementQForm'
+export * from './elementQGrid'
+export * from './elementQList'