feat:列表与表单解析关联数据

src/business/platform/data/data-template/field-formatter.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <span class="ibps-data-template-data" v-html="label" />
+    <span class="ibps-data-template-data" v-html="label || '/'" />
     <!-- <div>
       <div v-for="(item, i) in data" :key="i">
         <span v-if="item.label">{{ item.label }}</span>
@@ -21,6 +21,7 @@ import { get as getOrgById } from '@/api/platform/org/org'
 import { get as getPositionById } from '@/api/platform/org/position'
 import { get as getRoleById } from '@/api/platform/org/role'
 import { get as getAttachmentById } from '@/api/platform/file/attachment'
+import { remoteRequest } from '@/utils/remote'
 import {
   queryDataById as getDataById,
   queryLinkageData as getLinkDataByKey
@@ -61,6 +62,7 @@ export default {
     },
     fieldType: String,
     fieldOptions: Object,
+    descField: Object,
     tem: Object,
     tag: String
   },
@@ -97,8 +99,8 @@ export default {
         this.label = value
         return
       }
-      const fieldType = this.fieldType
-      const fieldOptions = this.fieldOptions
+      const fieldType = this.descField.same === 'N' ? this.descField.field_type : this.fieldType
+      const fieldOptions = this.descField.same === 'N' ? this.descField.field_options : this.fieldOptions
       if (
         this.$utils.isEmpty(value) ||
         this.$utils.isEmpty(fieldType) ||
@@ -220,10 +222,11 @@ export default {
           'name'
         )
       } else {
-        getDictionaryData({
-          typeKey: key
-        })
-          .then(response => {
+        remoteRequest('formTemplate', {key}, () => {
+            return getDictionaryData({
+              typeKey: key
+            })
+          }).then(response => {
             const data = response.data
             DICTIONARY_CACHE[key] = data
             this.label = this.formatterOptions(value, data, 'key', 'name')
@@ -264,24 +267,26 @@ export default {
           this.userList.forEach((item, i) => {
             if (id.includes(item.userId)) {
               this.label += item.userName + ','
-              // SELECTOR_CACHE[key] = item.NAME_ + ','
+              SELECTOR_CACHE[key] = item.userName + ','
             }
           })
-          // getUserById({ employeeId: id })
-          //   .then(response => {
-          //     const data = response.data
-          //     data[nameKey] = data['name']
-          //     if (data) {
-          //       SELECTOR_CACHE[key] = data[nameKey]
-          //       this.label = data[nameKey]
-          //     }
-          //   })
-          //   .catch(e => {
-          //     console.error(e)
-          //   })
+          remoteRequest('formTemplate', {key}, () => {
+            return getUserById({ employeeId: id })
+          }).then(response => {
+              const data = response.data
+              data[nameKey] = data['name']
+              if (data) {
+                SELECTOR_CACHE[key] = data[nameKey]
+                this.label = data[nameKey]
+              }
+            })
+            .catch(e => {
+              console.error(e)
+            })
         } else if (type === 'org') {
-          getOrgById({ orgId: id })
-            .then(response => {
+          remoteRequest('formTemplate', {key}, () => {
+            return getOrgById({ orgId: id })
+          }).then(response => {
               const data = response.data
               if (data) {
                 this.label = data[nameKey]
@@ -295,38 +300,40 @@ export default {
           this.deptList.forEach((item, i) => {
             if (id.includes(item.positionId)) {
               this.label += item.positionName + ','
-              // SELECTOR_CACHE[key] = item.NAME_ + ','
+              SELECTOR_CACHE[key] = item.positionName + ','
             }
           })
-          // getPositionById({ positionId: id })
-          //   .then(response => {
-          //     const data = response.data
-          //     if (data) {
-          //       this.label = data[nameKey]
-          //       SELECTOR_CACHE[key] = data[nameKey]
-          //     }
-          //   })
-          //   .catch(e => {
-          //     console.error(e)
-          //   })
+          remoteRequest('formTemplate', {key}, () => {
+            return getPositionById({ positionId: id })
+          }).then(response => {
+              const data = response.data
+              if (data) {
+                this.label = data[nameKey]
+                SELECTOR_CACHE[key] = data[nameKey]
+              }
+            })
+            .catch(e => {
+              console.error(e)
+            })
         } else if (type === 'role') {
           this.roleList.forEach((item, i) => {
             if (id.includes(item.ID_)) {
               this.label += item.NAME_ + ','
-              // SELECTOR_CACHE[key] = item.NAME_ + ','
+              SELECTOR_CACHE[key] = item.NAME_ + ','
             }
           })
-          // getRoleById({ roleId: id })
-          //   .then(response => {
-          //     const data = response.data
-          //     if (data) {
-          //       this.label = data[nameKey]
-          //       SELECTOR_CACHE[key] = data[nameKey]
-          //     }
-          //   })
-          //   .catch(e => {
-          //     console.error(e)
-          //   })
+          remoteRequest('formTemplate', {key}, () => {
+            return getRoleById({ roleId: id })
+          }).then(response => {
+              const data = response.data
+              if (data) {
+                this.label = data[nameKey]
+                SELECTOR_CACHE[key] = data[nameKey]
+              }
+            })
+            .catch(e => {
+              console.error(e)
+            })
         }
       }
     },
@@ -396,7 +403,10 @@ export default {
       this.label = ''
       value.split(',').forEach(id => {
         if (key) {
-          getDataById({ id: id, key: key }).then(response => {
+          remoteRequest('formTemplate', {key}, () => {
+            return getDataById({ id: id, key: key })
+          })
+          .then(response => {
             const responseData = response.data
             const data = responseData.data[0]
             // const data = response.data
@@ -455,11 +465,9 @@ export default {
       if (this.$utils.isEmpty(key)) {
         return value
       }
-      // TODO: 有问题
-      getLinkDataByKey({
-        key: key
-      })
-        .then(response => {
+      remoteRequest('formTemplate', {key}, () => {
+        return getLinkDataByKey({ key: key })
+      }).then(response => {
           const data = response.data
           if (this.$utils.isNotEmpty(data)) {
             const arrayValue = value.split(',')

src/business/platform/data/data-template/template.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
     <van-popup
-      v-model="showDialogPopup"
+      :value="visible"
       class="ibps-fullscreen-popup"
       position="bottom"
       get-container="body"
@@ -73,6 +73,7 @@
                 </div>
                 <div slot="label">
                   <van-checkbox ref="checkboxes" :name="data[valueKey]">
+                    <!-- {{ labelKey }} -->
                     <!-- <field-formatter
                       :label-key="labelKey"
                       :data="data"
@@ -87,10 +88,11 @@
                         <span>{{ item.label }}</span>
                         <span v-if="item.label!=''">：</span>
                         <field-formatter
-                          :label-key="item.bt"
+                          :label-key="fieldType === 'linkdata' ? labelKey : item.bt"
                           :data="data"
                           :template-fields="templateFields"
                           :field-options="item.fieldOptions"
+                          :descField="item"
                           :field-type="item.fieldType"
                           :tem ="tem"
                         />
@@ -304,12 +306,6 @@ export default {
       deep: true,
       immediate: true
     },
-    visible() {
-      this.showDialogPopup = this.visible
-      if (this.visible && this.params) {
-        this.loadData(this.params, true)
-      }
-    },
     params() {
       this.initTemplate()
     },
@@ -335,12 +331,8 @@ export default {
       // immediate: true
     }
   },
-  created() {
-    // const sql = `select name_,id_ from ibps_party_entity `
-    // this.$common.request('sql', sql).then(res => {
-    //   const { data } = res.variables
-    //   this.selectorArr = data
-    // })
+  mounted() {
+    this.loadData(this.params, true)
   },
   methods: {
     onRefresh() {
@@ -371,7 +363,7 @@ export default {
     },
     handleLabel(data) {
       const config = this.labelKeys
-      console.log('this.labelKeys====>', config(data))
+      // console.log('this.labelKeys====>', config(data))
       if (typeof config === 'function') {
         return config(data)
       } else if (typeof config === 'string') {
@@ -449,6 +441,8 @@ export default {
       // 加载数据
       queryDataByKey(ActionUtils.formatParams(params, pagination))
         .then(response => {
+          this.dataList = []
+          this.selectorArr = []
           const dataResult = response.data.dataResult
           const pageResult = response.data.pageResult
           if (this.isTree) {
@@ -470,6 +464,7 @@ export default {
               this.cacheData[d[this.valueKey]] = d
               // const objName = Object.keys(d)
               const fb = { ...d, showlabel: {} }
+              // 判断值来源 this.tem.display_columns为空就是关联数据
               if (typeof this.tem.display_columns !== 'undefined') {
                 const keyName = this.dataList.findIndex(t => t.id_ == d.id_)
                 if (typeof keyName !== -1) {

src/business/platform/data/templaterender/linkdata/index.vue

@@ -14,7 +14,6 @@
     :is-link="isLink"
     :error="error"
     :error-message="errorMessage"
-
     :arrow-direction="arrowDirection"
     :label-class="labelClass"
     :label-width="labelWidth"
@@ -57,7 +56,7 @@
           plain
         >
           <field-formatter
-            :label-key="showLableKey"
+            :label-key="linkLabelKey"
             :data="item"
             :template-fields="templateFields"
           />
@@ -72,17 +71,17 @@
         :params="params"
         :value="selectedValue"
         :multiple="multiple"
-
         :left-text="leftText"
         :id-key="idKey"
-        :value-key="valueKey"
-        :label-key="labelKey"
+        :value-key="linkValueKey"
+        :label-key="linkLabelKey"
         :parent-id-key="parentIdKey"
         :is-tree="isTree"
         :query-key="queryKey"
+        fieldType="linkdata"
+        :searchPlaceholder="'请输入'"
         :template-fields="templateFields"
         :dynamic-params="dynamicParams"
-
         @init-data="initData"
         @cancel="onCancel"
         @confirm="onConfirm"
@@ -133,6 +132,9 @@ export default {
       type: String,
       default: ','
     },
+    fieldOptions: {
+      type: Object
+    },
     leftText: {
       type: String,
       default: i18n.t('cancel')
@@ -141,16 +143,6 @@ export default {
       type: Boolean,
       default: false
     },
-    valueKey: { // 值key
-      type: String
-    },
-    labelType: { // 文本类型
-      type: String,
-      default: 'first'
-    },
-    labelKey: { // 文本key
-      type: [String, Function]
-    },
     emptyText: {
       type: String,
       default: '暂无数据'
@@ -177,9 +169,21 @@ export default {
     showClear() {
       return this.clearable && this.$utils.isNotEmpty(this.value) && isDef(this.value) && this.editable
     },
-    showLableKey() {
-      return this.labelKey
-    }
+    linkValueKey () {
+        return this.fieldOptions['link_config'] ? this.fieldOptions['link_config'].id || '' : ''
+    },
+    linkLabelType () {
+        return this.fieldOptions['link_config'] ? this.fieldOptions['link_config'].type || 'first' : 'first'
+    },
+    linkLabelKey () {
+        return this.fieldOptions['link_config'] ? this.fieldOptions['link_config'].text || '' : ''
+    },
+    linkStructure () {
+        return this.fieldOptions['link_config'] ? this.fieldOptions['link_config'].structure || 'list' : 'list'
+    },
+    linkConfig () {
+        return this.fieldOptions['link_config'] ? this.fieldOptions['link_config'] || {} : {}
+    },
   },
   watch: {
     value: {
@@ -216,21 +220,16 @@ export default {
       const resultColumns = template['result_columns']
       console.log(resultColumns,'resultColumnsresultColumns')
       if (this.$utils.isEmpty(resultColumns)) { return }
-      this.labelKey = resultColumns[0]['name']
+      // this.labelKey = resultColumns[0]['name']
       if (dataTemplate.showType === 'tree') { // 树形
         this.isTree = true
         const displayColumns = template['display_columns']
         if (this.$utils.isNotEmpty(displayColumns)) {
-          this.labelKey = displayColumns['name_key']
           this.idKey = displayColumns['id_key']
           this.parentIdKey = displayColumns['pid_key']
         }
       } else if (dataTemplate.showType === 'list') {
-      this.isTree = false
-      const displayColumns = template['display_columns']
-      if (this.$utils.isNotEmpty(displayColumns)) {
-        this.labelKey = (displayColumns[0] ? displayColumns[0]['name'] : '') || ''
-      }
+        this.isTree = false
       }
     },
     initSelectedData() {

src/business/platform/form/dynamic-form/form-field.vue

@@ -348,6 +348,7 @@
     v-else-if="fieldType === 'linkdata'"
     v-model="dataModel"
     :label="field.label"
+    :fieldOptions="fieldOptions"
     :desc="field.desc"
     :desc-position="descPosition"
     :placeholder="placeholder"

src/business/platform/form/dynamic-form/form-table.vue

@@ -426,7 +426,7 @@ export default {
       immediate: true,
       handler(val, oldVal) {
         this.dataModel = val
-        val.forEach && val.forEach((t, i) => {
+        val && val.forEach && val.forEach((t, i) => {
           this.activeCollapseNames.push(COLLAPSE_NAME_KEY + i)
         })
         this.inputValue = this.$utils.isNotEmpty(val) ? JSON.stringify(val) : ''

src/views/platform/data/components/search-field/index.vue

@@ -17,7 +17,7 @@
   <ibps-checkbox
     v-else-if="item.fieldType==='checkbox'"
     v-model="parameter[item.modelValue]"
-    :placeholder="item.options.placeholder"
+    :placeholder="item.placeholder"
     :other-option-value="otherOptionValue"
     :options="options"
     :value-key="'val'"
@@ -31,7 +31,7 @@
     v-else-if="item.fieldType==='editor'"
     v-model="parameter[item.modelValue]"
     label=" "
-    :placeholder="item.options.placeholder"
+    :placeholder="item.placeholder"
     :height="height"
     :name="item.prop"
   />
@@ -40,7 +40,7 @@
     v-else-if="item.fieldType==='autoNumber'"
     v-model="parameter[item.modelValue]"
     label=" "
-    :placeholder="item.options.placeholder"
+    :placeholder="item.placeholder"
     autocomplete="off"
     autosize
     clearable
@@ -52,7 +52,7 @@
     v-else-if="item.fieldType==='attachment'"
     v-model="parameter[item.modelValue]"
     label=" "
-    :placeholder="item.options.placeholder"
+    :placeholder="item.placeholder"
     :store="fieldOptions.store||'json'"
     :max-size="maxFileSize"
     :limit="fileQuantity"
@@ -65,7 +65,7 @@
     v-else-if="item.fieldType==='customDialog'"
     v-model="parameter[item.modelValue]"
     label=" "
-    :placeholder="item.options.placeholder"
+    :placeholder="item.placeholder"
     :multiple="!single"
     :template-key="fieldOptions.dialog"
     :store="fieldOptions.store"
@@ -81,7 +81,8 @@
     v-else-if="item.fieldType==='linkdata'"
     v-model="parameter[item.modelValue]"
     label=" "
-    :placeholder="item.options.placeholder"
+    :placeholder="item.placeholder"
+    :field="item"
     :multiple="multiple"
     :template-key="fieldOptions.linkdata"
     :store="fieldOptions.store"
@@ -97,7 +98,7 @@
     v-else-if="item.fieldType==='address'"
     v-model="parameter[item.modelValue]"
     label=" "
-    :placeholder="item.options.placeholder"
+    :placeholder="item.placeholder"
     :top="fieldOptions.top"
     :top-val="getAddressTopVal()"
     :level="fieldOptions.level"
@@ -110,7 +111,7 @@
     v-else-if="item.fieldType==='currentDate'|| item.fieldType==='currentTime'"
     v-model="parameter[item.modelValue]"
     label=" "
-    :placeholder="item.options.placeholder"
+    :placeholder="item.placeholder"
     :format="dateFormat"
     :name="item.prop"
     type="custom"
@@ -121,7 +122,7 @@
     v-else-if="item.fieldType==='signature'"
     v-model="parameter[item.modelValue]"
     label=" "
-    :placeholder="item.options.placeholder"
+    :placeholder="item.placeholder"
     :height="height"
     :name="item.name"
   />
@@ -269,6 +270,13 @@ export default {
     }
   },
   computed: {
+    /**
+     * :linkConfig="getLinkConfig(fieldOptions)"
+    :linkStructure="getLinkStructure(fieldOptions)"
+    :linkLabelType="getLinkLabelType(fieldOptions)"
+    :linkLabelKey="getLinkLabelKey(fieldOptions)"
+    :linkValueKey="getLinkConfig(fieldOptions)"
+     */
     formData() {
       return this.data
     },

src/views/platform/data/dataTemplate/field-formatter.vue

@@ -8,22 +8,20 @@
       :readonly="true"
     />
     <!-- 选择器 -->
-  <ibps-selector
-    v-else-if="
-      newFieldType === 'selector' ||
-      newFieldType === 'currentUser' ||
-      newFieldType === 'currentOrg'
-    "
-    v-model="label"
-    :store="newFieldOptions.store || 'id'"
-    :type="newFieldOptions.selector_type || 'user'"
-    :multiple="$utils.toBoolean(newFieldOptions.multiple, true)"
-    :field-options="newFieldOptions"
-    :filter="newFieldOptions.filter"
-    :readonly="true"
-    :islistShow="true"
-  />
-  <div v-else-if="hasCustomFormatter(descField.name)" v-html="customFormatter(descField.name, label, data, descField)" />
+    <template v-else-if="selectTypes.includes(this.newFieldType)">
+      <van-tag
+        v-for="(item,index) in selectorValue "
+        :key="item"
+        :color="'#D6EAFE'"
+        :text-color="'#3396FB'"
+        class="ibps-tag-span ibps-mr-8"
+      >
+        <template #default>
+          <div>{{ item }}</div>
+        </template>
+      </van-tag>
+    </template>
+    <div v-else-if="hasCustomFormatter(descField.name)" v-html="customFormatter(descField.name, label, data, descField)" ></div>
     <span v-else class="ibps-data-template-data" v-html="label || '/'" />
   </div>
 </template>
@@ -37,6 +35,7 @@ import { get as getOrgById } from '@/api/platform/org/org'
 import { get as getPositionById } from '@/api/platform/org/position'
 import { get as getRoleById } from '@/api/platform/org/role'
 import { get as getAttachmentById } from '@/api/platform/file/attachment'
+import { remoteRequest } from '@/utils/remote'
 import {
   transferByIds as getDataById,
   queryLinkageData as getLinkDataByKey
@@ -50,6 +49,7 @@ var WorldDistricts = null
 var DICTIONARY_CACHE = {}
 var ATTACHMENT_CACHE = {}
 var SELECTOR_CACHE = {}
+var LINK_CACHE = {}
 
 // var DATA_KEY = {
 //   ID: '#id#',
@@ -71,6 +71,9 @@ export default {
       type: Object,
       default: () => {}
     },
+    cacheData: {
+      type: Map
+    },
     defaultValue: {
       type: String,
       default: '&nbsp;'
@@ -91,7 +94,9 @@ export default {
       userList,
       label: '',
       newFieldType: '',
-      newFieldOptions: ''
+      newFieldOptions: '',
+      cachesData: new Map(),
+      selectTypes: ['selector', 'currentUser', 'currentOrg']
     }
   },
   watch: {
@@ -102,6 +107,14 @@ export default {
       this.initData()
     }
   },
+  computed: {
+    selectorValue() {
+      if (this.selectTypes.includes(this.newFieldType)) {
+        return this.label && this.label.split ? this.label.split(',') : []
+      }
+      return []
+    }
+  },
   mounted: function() {
     this.initData()
   },
@@ -124,20 +137,20 @@ export default {
       const fieldOptions = this.descField.same === 'N' ? this.descField.field_options : this.fieldOptions
       this.newFieldType = fieldType
       this.newFieldOptions = fieldOptions
+      // console.log('fieldType====>', fieldType)
       // 不转化值数组
       // newFieldType === 'selector' ||
       // newFieldType === 'currentUser' ||
       // newFieldType === 'currentOrg'
-      const noFormateValueTypes = ['selector', 'currentUser', 'currentOrg']
+      // const noFormateValueTypes = ['selector', 'currentUser', 'currentOrg']
       if (
         this.$utils.isEmpty(value) ||
         this.$utils.isEmpty(fieldType) ||
-        this.$utils.isEmpty(fieldOptions) ||
-        noFormateValueTypes.includes(fieldType)
+        this.$utils.isEmpty(fieldOptions)
+        // noFormateValueTypes.includes(fieldType)
       ) {
         console.log('===>', this.labelKey)
         this.label = value
-        
         return
       }
       // 数据格式
@@ -277,9 +290,12 @@ export default {
           'name'
         )
       } else {
-        getDictionaryData({
-          typeKey: key
+        remoteRequest('dataTemplate', {id}, () => {
+          return getDictionaryData({
+              typeKey: key
+            })
         })
+        
           .then(response => {
             const data = response.data
             DICTIONARY_CACHE[key] = data
@@ -315,6 +331,7 @@ export default {
     formatterSelectorData(id, type) {
       var key = type + ':' + id
       var nameKey = 'name'
+      // console.log('key====>', key)
       if (SELECTOR_CACHE[key]) {
         this.label = SELECTOR_CACHE[key]
       } else {
@@ -328,8 +345,9 @@ export default {
           })
           this.label = lab.replace(/,$/, '')
           if (!this.label) {
-            getUserById({ employeeId: id })
-              .then(response => {
+            remoteRequest('dataTemplate', {id}, () => {
+                return getUserById({ employeeId: id })
+            }).then(response => {
                 const data = response.data
                 data[nameKey] = data['name']
                 if (data) {
@@ -342,8 +360,9 @@ export default {
               })
           }
         } else if (type === 'org') {
-          getOrgById({ orgId: id })
-            .then(response => {
+          remoteRequest('dataTemplate', {id}, () => {
+            return getOrgById({ orgId: id })
+          }).then(response => {
               const data = response.data
               if (data) {
                 this.label = data[nameKey]
@@ -364,10 +383,11 @@ export default {
             }
           })
           this.label = lab.replace(/,$/, '')
-          console.log()
+          // console.log()
           if (!this.label) {
-            getPositionById({ positionId: id })
-              .then(response => {
+            remoteRequest('dataTemplate', {id}, () => {
+              return getPositionById({ positionId: id })
+            }) .then(response => {
                 const data = response.data
                 if (data) {
                   this.label = data[nameKey]
@@ -387,7 +407,9 @@ export default {
             }
           })
           if (!lab) {
-            getRoleById({ roleId: id })
+            remoteRequest('dataTemplate', {id}, () => {
+                return getRoleById({ roleId: id })
+            })
               .then(response => {
                 const data = response.data
                 if (data) {
@@ -439,7 +461,7 @@ export default {
      * 格式化自定义对话框
      */
     formatterCustomDialog(value, fieldOptions) {
-      console.log('this.labelKey--->', this.labelKey)
+      // console.log('this.labelKey--->', this.labelKey)
       const dialog = fieldOptions['dialog']
       // const store = fieldOptions['store_mode'] || 'id'
 
@@ -522,6 +544,7 @@ export default {
       }
     },
     formatterLinkdata(value, fieldOptions) {
+      // console.log('fieldOptions===>', fieldOptions)
       const linkConfig = fieldOptions['link_config'] || {}
       const __key = fieldOptions['linkdata']
       const __linkKey = linkConfig.id || 'id_'
@@ -533,25 +556,12 @@ export default {
         return value
       }
       // TODO: 有问题
-      getLinkDataByKey({
-        key: key
+      remoteRequest('dataTemplate', {key}, () => {
+        return getLinkDataByKey({ key: key })
       })
         .then(response => {
           const data = response.data
-          if (this.$utils.isNotEmpty(data)) {
-            const arrayValue = value.split(',')
-            const rtn = []
-            for (var d = 0; d < data.length; d++) {
-              const item = data[d]
-              const v = arrayValue.find(val => {
-                return val === item[__linkKey]
-              })
-              if (v) {
-                rtn.push(item[__linkText] || '')
-              }
-            }
-            this.label += rtn.join(',')
-          }
+          this.label = data[__linkText]
         })
         .catch(e => {
           console.error(e)

src/views/platform/data/template-list.vue

@@ -384,7 +384,8 @@ export default {
       defaultToolbars: [],
       defaultManages: [],
       isInitialization: false,
-      columnsAttrs:[],
+      columnsAttrs: [],
+      loadData: () => {},
       // 表单
       dialogFormVisible: false,
       formrenderParams: {},
@@ -466,6 +467,8 @@ export default {
   },
   created() {
     const params = this.$route.params
+    // 防抖防止脚本有调用加载数据方法被默认请求覆盖
+    this.loadData = this.debounce(this.loadData1, 300)
     this.templateId = params.id
     this.loadDataTemplate(this.templateId)
   },
@@ -555,6 +558,26 @@ export default {
       this.loadData()
       this.initFilterText()
     },
+    debounce(func, wait, immediate = false) {
+      let timeoutId = null
+      const debounced = function(...args) {
+        const context = this
+        const later = function() {
+          timeoutId = null
+          if (!immediate) func.apply(context, args)
+        }
+        const shouldCallNow = immediate && !timeoutId
+        clearTimeout(timeoutId)
+        timeoutId = setTimeout(later, wait)
+        if (shouldCallNow) func.apply(context, args)
+      }
+      // 添加取消功能
+      debounced.cancel = function() {
+        clearTimeout(timeoutId)
+        timeoutId = null
+      }
+      return debounced
+    },
     async buildKey(dataTemplate, template) {
       this.idKey = dataTemplate['unique']
       this.templateKey = dataTemplate['key']
@@ -738,7 +761,7 @@ export default {
         }
       }
      */
-    loadData() {
+    loadData1() {
       const customDialogCols = this.columnsAttrs.filter(t => t.field_type === 'customDialog')
       if (this.$utils.isEmpty(this.templateKey)) {
         return
@@ -763,6 +786,7 @@ export default {
       // params['Q^bian_zhi_bu_men_^SL'] = this.ownsDeptInfo.id
       // params['Q^shi_fou_guo_shen_^SL'] = '待处理'
       // 加载数据
+      
       queryDataByKey(ActionUtils.formatParams(params, this.pagination))
         .then(response => {
           const responseData = response.data
@@ -1121,7 +1145,7 @@ export default {
         this.searchForms.forms = []
         if (this.$utils.isEmpty(queryColumns)) {
           return
-        }
+      }
         // TODO:目前第一个字段查询字段只支持 文本，多行文本和自动编号、数字、日期范围
         const firstFieldTypes = ['text', 'textarea', 'daterange', 'autonumber', 'number']
         const arr = [
@@ -1136,8 +1160,10 @@ export default {
         ]
         const columns = []
         const queryColumnsData = []
-        queryColumns.forEach(column => {
-          if (column.common === 'N') return
+      queryColumns.forEach(column => {
+          // 是否常用条件
+        if (column.common === 'N') return
+          // 拿到转换过后的列
           const field = this.convertField(column)
           const fd = this.buildSearchForm(field, !!column.same)
           columns.push(fd)
@@ -1151,8 +1177,8 @@ export default {
           this.slotForms.forEach(v => {
             this.paramsForm[v.prop] = ''
           })
-        })
-        // console.log('columns--->', this.slotForms)
+      })
+        console.log('this.slotForms====>', this.slotForms)
         this.searchForms.forms = columns
         // 顶部查询条件
         this.queryColumns = queryColumnsData || []
@@ -1162,17 +1188,17 @@ export default {
         this.fieldType = queryColumn.fieldType || ''
     },
     /**
-     * 转换字段
+     * 组合判断queryColumn最终形态
+     * @param queryColumn queryColumn 列表查询区域的表单框集合
      */
-    convertField: function (column) {
-        
-        const field = this.fields[column.name.toLowerCase()] || null
-        const same = !(column['same'] && column['same'] === 'N')
-        let fieldType = same ? (field ? field['field_type'] || 'text' : 'text') : column['field_type'] || 'text'
-        const fieldOptions = same ? (field ? field['field_options'] || {} : {}) : column['field_options'] || {}
+    convertField: function (queryColumn) {
+      const field = this.fields[queryColumn.name.toLowerCase()] || null
+        const same = !(queryColumn['same'] && queryColumn['same'] === 'N')
+        let fieldType = same ? (field ? field['field_type'] || 'text' : 'text') : queryColumn['field_type'] || 'text'
+        const fieldOptions = same ? (field ? field['field_options'] || {} : {}) : queryColumn['field_options'] || {}
         const dataType = field ? field['type'] || 'varchar' : 'varchar'
         const dataTypeList = ['date', 'timestamp', 'datetime', 'currentTime', 'currentDate']
-        // console.log('datePicker===>',column.name, JSON.parse(JSON.stringify(column)))
+        // console.log('datePicker===>',queryColumn.name, JSON.parse(JSON.stringify(queryColumn)))
         // 字段是日期类型
         if (dataTypeList.includes(dataType) && fieldType !== 'datePicker' && fieldType !== 'dateRange') {
           fieldType = 'datePicker'
@@ -1188,15 +1214,21 @@ export default {
         if (fieldType === 'currentUser' || fieldType === 'currentOrg' || fieldType === 'currentPosition') {
           fieldType = 'selector'
         }
-        column['field_type'] = fieldType
-        column['field_options'] = fieldOptions
-        column['data_type'] = dataType
-        return column
+        queryColumn['field_type'] = fieldType
+        queryColumn['field_options'] = fieldOptions
+        queryColumn['data_type'] = dataType
+        return queryColumn
     },
+    /**
+     * 组合判断查询区域
+     * @param field 表单字段和表格列字段组合后的列字段属性
+     * @param same 
+     */
     buildSearchForm(field, same) {
       // console.log(field)
       let querySuffix
       const datasetType = this.dataTemplate.datasetType
+      // console.log('datasetType--->', datasetType) table
       const dataTypes = ['date', 'varchar', 'number']
       if (dataTypes.includes(field.dataType) &&
         field.queryCondition && this.$utils.isNotEmpty(field.queryCondition)) {
@@ -1380,7 +1412,7 @@ export default {
           })
         } else if (fieldType === 'linkdata') {
           if (this.$utils.isEmpty(querySuffix)) {
-            querySuffix = 'S'
+            querySuffix = 'SL'
           }
           const prop = `Q^${field.name}^${querySuffix}`
           searchColumn = Object.assign(searchColumn, {