waibu-bootstrap 1.2.5 → 1.2.7

package/package.json

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

package/waibuMpa/theme/component/factory/app-launcher.js

@@ -21,7 +21,7 @@ async function appLauncher () {
         launcher += '<c:navbar padding="y-0">\n<c:nav tag="ul" dim="width:100" flex="justify-content:end">\n'
         for (const t of toolbar) {
           if (t === 'home') launcher += '<c:nav-item href="/" icon="house" padding="end-2" />\n'
-          if (t === 'user') launcher += '<c:nav-dropdown-user padding="end-2" />\n'
+          if (t === 'user' && this.plugin.app.sumba) launcher += '<c:sumba-nav-dropdown-user padding="end-2" />\n'
           if (t === '-') launcher += '<c:nav-divider />\n'
           if (t === 'fullscreen') launcher += '<c:nav-toggle-fullscreen padding="end-2" />\n'
           if (t === 'darkmode') launcher += '<c:nav-dropdown-darkmode padding="end-2" dropdown-menudir="end" />\n'

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

@@ -82,15 +82,15 @@ async function formSelectExt () {
       const group = groupAttrs(this.params.attr, ['remote'])
       if (group.remote) {
         group.remote.url = routePath(group.remote.url)
-        group.remote.searchField = group.remote.searchField ?? 'name'
-        group.remote.labelField = group.remote.labelField ?? 'name'
+        group.remote.searchField = group.remote.searchField ?? 'id'
+        group.remote.labelField = group.remote.labelField ?? 'id'
         group.remote.valueField = group.remote.valueField ?? 'id'
         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 + '\\'')
               .then(resp => resp.json())
               .then(json => {
                 callback(json.data)
@@ -101,11 +101,11 @@ async function formSelectExt () {
           },
           render: {
             option: (data, escape) => {
-              return '<div>' + escape(data.name) + '</div>'
+              return '<div>' + escape(data.${group.remote.labelField}) + '</div>'
             },
             item: (data, escape) => {
               $dispatch('formselectext', { id: '${this.params.attr.id}', data })
-              return '<div>' + escape(data.name) + '</div>'
+              return '<div>' + escape(data.${group.remote.labelField}) + '</div>'
             }
           }
         }`

package/waibuMpa/theme/component/factory/nav-dropdown-setting.js

@@ -54,15 +54,15 @@ async function navDropdownSetting () {
         <c:dropdown-item divider />
         <c:dropdown-item t:content="fullscreen"
           x-data="{
-            inText: '${this.component.req.t('fullscreen')}',
-            outText: '${this.component.req.t('exitFullscreen')}',
+            inText: \`${this.component.req.t('fullscreen')}\`,
+            outText: \`${this.component.req.t('exitFullscreen')}\`,
             async toggle () {
               const el = document.querySelector('body')
               if (!document.fullscreenElement) {
                 try {
                   await el.requestFullscreen()
                 } catch (err) {
-                  await wbs.notify('cantGoFullscreen', { type: 'danger' })
+                  await wbs.notify(\`${this.component.req.t('cantGoFullscreen')}\`, { type: 'danger' })
                 }
               } else {
                 document.exitFullscreen()
@@ -88,7 +88,7 @@ async function navDropdownSetting () {
             id="${id}"
             x-data="{
               async signout () {
-                await wbs.confirmation('${this.component.req.t('signoutWarning')}', { ok: '${id}:post', close: 'y' })
+                await wbs.confirmation(\`${this.component.req.t('signoutWarning')}\`, { ok: '${id}:post', close: 'y' })
               },
               post () {
                 wmpa.postForm({}, '${routePath('sumba:/signout')}')

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

@@ -39,7 +39,7 @@ async function navbar () {
         const id = generateId()
         if (this.params.group.drawer) this.params.group.drawer.id = id
         const btn = `<button class="navbar-toggler" type="button" data-bs-toggle="${type}" ` +
-          `data-bs-target="#${id}" aria-controls="${id}"${this.params.attr.drawer ? '' : ' aria-expanded="false"'} aria-label="${this.component.req.t('Toggle Navigation')}">` +
+          `data-bs-target="#${id}" aria-controls="${id}"${this.params.attr.drawer ? '' : ' aria-expanded="false"'} aria-label="${this.component.req.t('toggleNavigation')}">` +
           '<span class="navbar-toggler-icon"></span></button>'
         if (type === 'offcanvas') html = await this.component.buildTag({ tag: 'drawer', attr: this.params.group.drawer, html })
         else html = `<div class="collapse navbar-collapse justify-content-between" id="${id}">${html}</div>`

package/waibuMpa/theme/component/factory/nav-dropdown-user.js

@@ -1,64 +0,0 @@
-async function navDropdownUser () {
-  return class NavDropdownUser extends this.baseFactory {
-    build = async () => {
-      if (!this.plugin.app.sumba) {
-        this.params.noTag = true
-        this.params.html = ''
-        return
-      }
-      const { has, omit } = this.plugin.lib._
-      const { routePath } = this.plugin.app.waibu
-      const { req } = this.component
-      const icon = this.component.req.iconset ? await this.component.buildTag({ tag: 'icon', attr: { name: 'person' } }) : ''
-      let text = ''
-      if (has(this.params.attr, 'title')) {
-        if (req.user) {
-          if (this.params.attr.title === 'short') text = `${req.user.firstName} ${req.user.lastName[0]}.`
-          else if (['firstName', 'lastName', 'username'].includes(this.params.attr.title)) text = req.user[this.params.attr.title]
-          else text = `${req.user.firstName} ${req.user.lastName}`
-        } else text = req.t('guest')
-      }
-      const html = []
-      const attr = omit(this.params.attr, ['text'])
-      attr.dropdown = true
-      attr.content = `${icon} ${text}`
-      if (this.params.attr.noMenu) {
-        delete attr.dropdown
-        delete attr.dropdownMenu
-        attr.href = routePath(this.component.req.user ? 'sumba:/your-stuff/profile' : 'sumba:/signin')
-      } else {
-        if (req.user) {
-          if (this.params.attr.fancyProfile) {
-            const replacer = 'sumba.asset:/user-profile.png'
-            const profile = await this.component.buildSentence(`
-              <div>
-                <c:dropdown-item href="sumba:/your-stuff/profile">
-                  <c:img src="dobo:/attachment/SumbaUser/${req.user.id}/profile/main.png?notfound=${replacer}" responsive rounded />
-                  <c:div margin="top-1" text="align:center">${req.user.firstName} ${req.user.lastName}</c:div>
-                </c:dropdown-item>
-              </div>
-            `)
-            html.push(profile)
-            html.push(await this.component.buildTag({ tag: 'dropdownItem', attr: { divider: true } }))
-            html.push(await this.component.buildTag({ tag: 'dropdownItem', attr: { href: routePath('sumba:/your-stuff/change-password') }, html: this.component.req.t('changePassword') }))
-            html.push(await this.component.buildTag({ tag: 'dropdownItem', attr: { href: routePath('sumba:/signout') }, html: this.component.req.t('signout') }))
-          } else {
-            html.push(await this.component.buildTag({ tag: 'dropdownItem', attr: { href: routePath('sumba:/your-stuff/profile') }, html: this.component.req.t('yourProfile') }))
-            html.push(await this.component.buildTag({ tag: 'dropdownItem', attr: { href: routePath('sumba:/your-stuff/change-password') }, html: this.component.req.t('changePassword') }))
-            html.push(await this.component.buildTag({ tag: 'dropdownItem', attr: { divider: true } }))
-            html.push(await this.component.buildTag({ tag: 'dropdownItem', attr: { href: routePath('sumba:/signout') }, html: this.component.req.t('signout') }))
-          }
-        } else {
-          html.push(await this.component.buildTag({ tag: 'dropdownItem', attr: { href: routePath('sumba:/signin') }, html: this.component.req.t('signin') }))
-          html.push(await this.component.buildTag({ tag: 'dropdownItem', attr: { divider: true } }))
-          html.push(await this.component.buildTag({ tag: 'dropdownItem', attr: { href: routePath('sumba:/user/signup') }, html: this.component.req.t('signup') }))
-          html.push(await this.component.buildTag({ tag: 'dropdownItem', attr: { href: routePath('sumba:/user/forgot-password') }, html: this.component.req.t('forgotPassword') }))
-        }
-      }
-      this.params.noTag = true
-      this.params.html = await this.component.buildTag({ tag: 'navItem', attr, html: html.join('\n') })
-    }
-  }
-}
-
-export default navDropdownUser