t20-common-lib 0.15.3 → 0.15.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "t20-common-lib",
-  "version": "0.15.3",
+  "version": "0.15.5",
   "description": "T20",
   "private": false,
   "main": "dist/index.js",

package/packages/dynamic-form/src/components/ScrollLoadSelect.vue

@@ -0,0 +1,204 @@
+<template>
+  <T20-Scroll-Load-Select
+    ref="scrollLoadSelect"
+    class="input-w" 
+    v-model="_value"
+    v-bind="passThroughProps"
+    v-on="innerListeners"
+    @canGetData="handleCanGetData"
+  />
+</template>
+
+<script>
+import { getDataForGet, getDataForPost } from '../utils/request'
+
+export default {
+  name: 'ScrollLoadSelect',
+  props: {
+    value: {
+      type: [String, Number, Array, Object],
+      default: undefined
+    },
+    items: {
+      type: Object,
+      default: () => ({})
+    },
+    label: {
+      type: String,
+      default: ''
+    }
+  },
+  computed: {
+    _value: {
+      get() {
+        return this.value
+      },
+      set(val) {
+        this.$emit('input', val)
+      }
+    },
+    innerListeners() {
+      const listeners = { ...this.$listeners }
+      delete listeners.canGetData
+      return listeners
+    },
+    runtimeLabelKey() {
+      return this.items?.api?.labelKey || this.items?.props?.labelKey || this.$attrs.labelKey || 'label'
+    },
+    runtimeValueKey() {
+      return this.items?.api?.valueKey || this.items?.props?.valueKey || this.$attrs.valueKey || 'value'
+    },
+    runtimeSearchKeyName() {
+      return this.items?.api?.searchKeyName || this.items?.props?.searchKeyName || this.$attrs.searchKeyName || 'searchKey'
+    },
+    runtimePageSize() {
+      return this.items?.api?.pageSize || this.items?.props?.pageSize || this.$attrs.pageSize || 20
+    },
+    runtimeSelectedLabel() {
+      return this.items?.props?.selectedLabel || this.$attrs.selectedLabel || this.label || ''
+    },
+    runtimeRequestFn() {
+      if (this.items?.api?.apiUrl && this.items?.api?.requestMethod) {
+        return this.fetchByApiConfig
+      }
+      return this.$attrs.requestFn || this.$attrs['request-fn'] || this.fetchByStaticOptions
+    },
+    shouldAutoLoad() {
+      const autoLoad = this.items?.props?.autoLoad ?? this.$attrs.autoLoad
+      return autoLoad !== false
+    },
+    passThroughProps() {
+      return {
+        ...this.$attrs,
+        ...(this.items?.props || {}),
+        requestFn: this.runtimeRequestFn,
+        labelKey: this.runtimeLabelKey,
+        valueKey: this.runtimeValueKey,
+        searchKeyName: this.runtimeSearchKeyName,
+        pageSize: this.runtimePageSize,
+        selectedLabel: this.runtimeSelectedLabel
+      }
+    }
+  },
+  mounted() {
+    this.triggerInitialRequest()
+  },
+  methods: {
+    triggerInitialRequest() {
+      if (!this.shouldAutoLoad) return
+      this.$nextTick(() => {
+        const instance = this.$refs.scrollLoadSelect
+        if (instance && typeof instance.handleFilter === 'function') {
+          instance.handleFilter('')
+        }
+      })
+    },
+    resolvePath(data, path) {
+      if (!path) return data
+      return String(path)
+        .split('.')
+        .reduce((acc, key) => (acc == null ? acc : acc[key]), data)
+    },
+    normalizeList(rawList) {
+      if (!Array.isArray(rawList)) return []
+      return rawList.map(item => {
+        if (!item || typeof item !== 'object') {
+          return {
+            [this.runtimeLabelKey]: String(item),
+            [this.runtimeValueKey]: item
+          }
+        }
+        return item
+      })
+    },
+    setDeepValue(target, path, value) {
+      const keys = String(path || '').split('.').filter(Boolean)
+      if (keys.length === 0) return
+      let cur = target
+      for (let i = 0; i < keys.length - 1; i += 1) {
+        const key = keys[i]
+        if (!cur[key] || typeof cur[key] !== 'object' || Array.isArray(cur[key])) {
+          cur[key] = {}
+        }
+        cur = cur[key]
+      }
+      cur[keys[keys.length - 1]] = value
+    },
+    buildPagingParams(params, apiConfig) {
+      const pageConfig = apiConfig?.page || {}
+      const currentKey = pageConfig.current || 'current'
+      const sizeKey = pageConfig.size || 'size'
+      const currentVal = params.current
+      const sizeVal = params.size
+
+      // 场景1：page: { current, size }
+      if (pageConfig.reqKey) {
+        return {
+          [pageConfig.reqKey]: {
+            [currentKey]: currentVal,
+            [sizeKey]: sizeVal
+          }
+        }
+      }
+
+      // 场景2：page.current=xx&page.size=xx（支持点路径）
+      const pageParams = {}
+      this.setDeepValue(pageParams, currentKey, currentVal)
+      this.setDeepValue(pageParams, sizeKey, sizeVal)
+      return pageParams
+    },
+    async fetchByApiConfig(params = {}) {
+      const apiConfig = this.items?.api || {}
+      const method = String(apiConfig.requestMethod || '').toUpperCase()
+      const reqKeys = apiConfig.reqKeys || {}
+      const headerConfig = apiConfig.headerConfig || {}
+      const searchValue = params[this.runtimeSearchKeyName]
+      const pagingParams = this.buildPagingParams(params, apiConfig)
+      const requestData = {
+        ...reqKeys,
+        ...pagingParams
+      }
+      if (searchValue !== undefined) {
+        requestData[this.runtimeSearchKeyName] = searchValue
+      }
+      let res = null
+      if (method === 'GET') {
+        res = await getDataForGet(apiConfig.apiUrl, requestData, headerConfig)
+      } else if (method === 'POST') {
+        res = await getDataForPost(apiConfig.apiUrl, requestData, headerConfig)
+      } else {
+        return []
+      }
+      const list = apiConfig.dataProp ? this.resolvePath(res, apiConfig.dataProp) : (res && res.data)
+      return this.normalizeList(list)
+    },
+    async fetchByStaticOptions(params = {}) {
+      const sourceOptions = Array.isArray(this.items?.options) ? this.items.options : []
+      const current = Number(params.current || 1)
+      const size = Number(params.size || this.runtimePageSize || 20)
+      const searchValue = params[this.runtimeSearchKeyName]
+      const normalizedKeyword = searchValue == null ? '' : String(searchValue).toLowerCase()
+      const filtered = sourceOptions.filter(item => {
+        if (!normalizedKeyword) return true
+        const label = item && item[this.runtimeLabelKey]
+        return String(label == null ? '' : label).toLowerCase().includes(normalizedKeyword)
+      })
+      const start = (current - 1) * size
+      return filtered.slice(start, start + size)
+    },
+    handleCanGetData(val, option) {
+      if (Array.isArray(option)) {
+        const labels = option
+          .map(item => item && item[this.runtimeLabelKey])
+          .filter(label => label !== undefined && label !== null)
+        this.$emit('update:label', labels.join(','))
+      } else if (option && typeof option === 'object') {
+        this.$emit('update:label', option[this.runtimeLabelKey] || '')
+      } else if (val === '' || val === null || val === undefined) {
+        this.$emit('update:label', '')
+      }
+      this.$emit('canGetData', val, option)
+    }
+  }
+}
+</script>

package/packages/dynamic-form/src/main.vue

@@ -118,6 +118,7 @@ export default {
       elementTypeChange: {
         SELECT: 'Select',
         SELECT_LAZY: 'LazySelect',
+        SELECT_SCROLL_LOAD: 'ScrollLoadSelect',
         DIALOG: 'Dialog',
         INPUT: 'Input',
         AMOUNT: 'Amount',