waibu-bootstrap 1.2.9 → 1.2.11

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "waibu-bootstrap",
-  "version": "1.2.9",
+  "version": "1.2.11",
   "description": "Bootstrap suport for Waibu Framework",
   "main": "index.js",
   "scripts": {

package/waibuMpa/theme/component/factory/_lib.js

@@ -17,7 +17,10 @@ function getInputAttr (group, formControl = true, ro) {
     else if (isString(val)) attr.dataValue = escape(val)
     else attr.dataValue = val
     if (ro) {
-      if (attr.dataType === 'boolean') attr.value = this.component.req.t(val ? 'Yes' : 'No')
+      if (attr.rel) {
+        const [rel, fieldName = 'id'] = attr.rel.split(':')
+        attr.value = get(this, `component.locals.form._rel.${rel}.${fieldName}`, val)
+      } else if (attr.dataType === 'boolean') attr.value = this.component.req.t(val ? 'Yes' : 'No')
       else if (has(attr, 'name') === 'lat') attr.value = escape(this.component.req.format(val, attr.dataType, { latitude: true }))
       else if (has(attr, 'name') === 'lng') attr.value = escape(this.component.req.format(val, attr.dataType, { longitude: true }))
       else attr.value = escape(this.component.req.format(val, attr.dataType))

package/waibuMpa/theme/component/factory/form-select-ext.js

@@ -45,9 +45,12 @@ async function formSelectExt () {
 
     build = async () => {
       const { generateId } = this.plugin.app.bajo
-      const { omit, merge } = this.plugin.lib._
+      const { omit, merge, has } = this.plugin.lib._
       const { routePath } = this.plugin.app.waibu
       const { jsonStringify, base64JsonDecode, groupAttrs } = this.plugin.app.waibuMpa
+      const { req } = this.component
+      let apiKey = ''
+      if (req.user && this.plugin.app.sumba) apiKey = await this.plugin.app.sumba.getApiKeyFromUserId(req.user.id)
       const xref = this.params.attr['x-ref'] ?? 'select'
       this.params.attr.id = this.params.attr.id ?? generateId('alpha')
       this.params.attr['x-ref'] = xref
@@ -68,7 +71,6 @@ async function formSelectExt () {
             return { value: item, text: item }
           })
         }
-        this.params.attr.options = options
       }
       let opts = { plugins }
       let cOpts = {}
@@ -80,23 +82,28 @@ async function formSelectExt () {
       if (!cOpts.optsText) opts = jsonStringify(merge(opts, cOpts), true)
       else opts = cOpts.optsText
       const group = groupAttrs(this.params.attr, ['remote'])
+      const fetchOpts = { headers: {} }
       if (group.remote) {
         group.remote.url = routePath(group.remote.url)
         group.remote.searchField = group.remote.searchField ?? 'id'
         group.remote.labelField = group.remote.labelField ?? 'id'
         group.remote.valueField = group.remote.valueField ?? 'id'
+        if (has(group.remote, 'apiKey')) {
+          if (group.remote.apiKey === true) fetchOpts.headers.Authorization = `Bearer ${apiKey}` // TODO: get it from wmpa
+          else fetchOpts.headers.Authorization = `Bearer ${group.remote.apiKey}`
+        }
         opts = `{
           searchField: '${group.remote.searchField}',
           labelField: '${group.remote.labelField}',
           valueField: '${group.remote.valueField}',
           load: (query, callback) => {
-            fetch('${group.remote.url}?query=${group.remote.searchField}:~\\'' + query + '\\'')
+            fetch('${group.remote.url}?query=${group.remote.searchField}:~\\'' + query + '\\'', ${jsonStringify(fetchOpts, true)})
               .then(resp => resp.json())
               .then(json => {
                 callback(json.data)
               })
               .catch(() => {
-                callback
+                callback()
               })
           },
           render: {
@@ -114,7 +121,19 @@ async function formSelectExt () {
       this.params.attr['@load.window'] = `
         const opts = ${opts}
         instance = new TomSelect($refs.${xref}, opts)
+        const val = $refs.${xref}.dataset.value
+        if (!_.isEmpty(val)) {
+          fetch('${group.remote.url}?query=${group.remote.valueField}:' + val, ${jsonStringify(fetchOpts, true)})
+            .then(resp => resp.json())
+            .then(json => {
+              if (json.data.length === 0) return
+              const opt = _.pick(json.data[0], ['${group.remote.valueField}', '${group.remote.labelField}'])
+              instance.addOption(opt)
+              instance.setValue(opt.${group.remote.valueField})
+            })
+        }
       `
+      this.params.attr.options = options
       this.params.attr = omit(this.params.attr, ['noDropdownInput', 'removeBtn', 'clearBtn', 'c-opts', 'remoteUrl', 'remoteSearchField', 'remoteLabelField', 'remoteValueField'])
       await build.call(this, buildFormSelect, this.params)
     }