[update] 子表新增分页设置功能（部分涉及性能问题代码未提交）

src/business/platform/form/constants/fieldOptions.js

@@ -332,8 +332,8 @@ export const defaultToolbars = [
     'forecolor', 'backcolor', 'selectall', 'cleardoc', 'fontfamily', 'fontsize'
 ]
 /**
-     * 日期格式
-     */
+ * 日期格式
+ */
 export const dateTypes = [{
     value: 'specific',
     label: '特定日期'
@@ -373,6 +373,15 @@ export const intervalTypes = [{
     label: '秒'
 }]
 
+/**
+ * 子表分页大小选项
+ */
+export const defaultPageSize = 20
+/**
+ * 子表分页大小选项
+ */
+export const pageSizeOptions = [10, 15, 20, 30, 50, 100]
+
 /**
  * 数据格式【校验】
  */

src/business/platform/form/constants/fieldTypes.js

@@ -553,6 +553,9 @@ const fieldTypes = {
                 ],
                 columns: [],
                 summary: false,
+                page: 'Y',
+                pageSize: 20,
+                index: true,
                 sum_text: '',
                 summary_method: false
             }

src/business/platform/form/formbuilder/index.vue

@@ -198,8 +198,7 @@ export default {
                     callback(flag, '请设置表单Key')
                     return
                 }
-                if (this.widgetForm.mode === 'bo' &&
-            this.$utils.isEmpty(this.widgetForm.code)) {
+                if (this.widgetForm.mode === 'bo' && this.$utils.isEmpty(this.widgetForm.code)) {
                     callback(flag, '未绑定业务对象，请检查数据是否正确')
                     return
                 }

src/business/platform/form/formbuilder/right-aside/editors/editor-layout.vue

@@ -1,287 +1,312 @@
 <template>
-  <div class="panel panel-default toolbars-panel">
-    <div class="panel-heading">布局设置</div>
-    <div class="panel-body">
-      <template v-if="types.includes('labelWidth')">
-        <el-form-item>
-          <template slot="label">隐藏标签<help-tip prop="hideLabel" /></template>
-          <el-switch v-model="fieldOptions.hide_label" />
-        </el-form-item>
-        <el-form-item v-if="!fieldOptions.hide_label">
-          <template slot="label">标签宽度<help-tip prop="labelWidth" /></template>
-          <el-row>
-            <el-col :span="2">
-              <el-checkbox v-model="fieldOptions.is_label_width" @change="changeIsLabelWidth" />
-            </el-col>
-            <el-col :span="12">
-              <el-input-number
-                v-model="fieldOptions.label_width"
-                :disabled="!fieldOptions.is_label_width"
-                style="width: 100%;"
-                :min="0"
-                :max="fieldOptions.label_width_unit==='px'?500:100"
-                :step="1"
-              />
-            </el-col>
-            <el-col :span="10">
-              <el-select
-                v-model="fieldOptions.label_width_unit"
-                :disabled="!fieldOptions.is_label_width"
-                style="width: 100%;"
-                @change="changeLabelWidthUnit"
-              >
-                <el-option label="像素(px)" value="px" />
-                <el-option label="百分比(%)" value="%" />
-              </el-select>
-            </el-col>
-          </el-row>
-        </el-form-item>
-      </template>
-      <el-form-item v-if="types.includes('width')">
-        <template slot="label">控件宽度<help-tip prop="width" /></template>
-        <el-row>
-          <el-col :span="2">
-            <el-checkbox v-model="fieldOptions.is_width" @change="changeIsWidth" />
-          </el-col>
-          <el-col :span="12">
-            <el-input-number
-              v-model="fieldOptions.width"
-              :disabled="!fieldOptions.is_width"
-              style="width: 100%;"
-              :min="0"
-              :max="fieldOptions.width_unit==='px'?500:100"
-              :step="1"
-            />
-          </el-col>
-          <el-col :span="10">
-            <el-select
-              v-if="init"
-              v-model="fieldOptions.width_unit"
-              :disabled="!fieldOptions.is_width"
-              style="width: 100%;"
-              @change="changeWidthUnit"
-            >
-              <el-option label="像素(px)" value="px" />
-              <el-option label="百分比(%)" value="%" />
-            </el-select>
-          </el-col>
-        </el-row>
-      </el-form-item>
-      <el-form-item v-if="types.includes('rows')">
-        <template slot="label">行数<help-tip prop="rows" /></template>
-        <el-input v-model="fieldOptions.rows" />
-      </el-form-item>
-      <el-form-item v-if="types.includes('autosize')" label-width="110px">
-        <template slot="label">自适应高度<help-tip prop="autosize" /></template>
-        <el-switch v-model="fieldOptions.autosize" />
-        <div v-if="fieldOptions.autosize">
-          <el-input-number
-            v-model="fieldOptions.min_rows"
-            :min="1"
-            placeholder="最小行数"
-            controls-position="right"
-            style="width:90px;"
-          />
-          -
-          <el-input-number
-            v-model="fieldOptions.max_rows"
-            :min="fieldOptions.min_rows||1"
-            placeholder="最大行数"
-            controls-position="right"
-            style="width:90px;"
-          />
-        </div>
-      </el-form-item>
+    <div class="panel panel-default toolbars-panel">
+        <div class="panel-heading">布局设置</div>
+        <div class="panel-body">
+            <template v-if="types.includes('labelWidth')">
+                <el-form-item>
+                    <template slot="label">隐藏标签<help-tip prop="hideLabel" /></template>
+                    <el-switch v-model="fieldOptions.hide_label" />
+                </el-form-item>
+                <el-form-item v-if="!fieldOptions.hide_label">
+                    <template slot="label">标签宽度<help-tip prop="labelWidth" /></template>
+                    <el-row>
+                        <el-col :span="2">
+                            <el-checkbox v-model="fieldOptions.is_label_width" @change="changeIsLabelWidth" />
+                        </el-col>
+                        <el-col :span="12">
+                            <el-input-number
+                                v-model="fieldOptions.label_width"
+                                :disabled="!fieldOptions.is_label_width"
+                                style="width: 100%;"
+                                :min="0"
+                                :max="fieldOptions.label_width_unit==='px'?500:100"
+                                :step="1"
+                            />
+                        </el-col>
+                        <el-col :span="10">
+                            <el-select
+                                v-model="fieldOptions.label_width_unit"
+                                :disabled="!fieldOptions.is_label_width"
+                                style="width: 100%;"
+                                @change="changeLabelWidthUnit"
+                            >
+                                <el-option label="像素(px)" value="px" />
+                                <el-option label="百分比(%)" value="%" />
+                            </el-select>
+                        </el-col>
+                    </el-row>
+                </el-form-item>
+            </template>
+            <el-form-item v-if="types.includes('width')">
+                <template slot="label">控件宽度<help-tip prop="width" /></template>
+                <el-row>
+                    <el-col :span="2">
+                        <el-checkbox v-model="fieldOptions.is_width" @change="changeIsWidth" />
+                    </el-col>
+                    <el-col :span="12">
+                        <el-input-number
+                            v-model="fieldOptions.width"
+                            :disabled="!fieldOptions.is_width"
+                            style="width: 100%;"
+                            :min="0"
+                            :max="fieldOptions.width_unit==='px'?500:100"
+                            :step="1"
+                        />
+                    </el-col>
+                    <el-col :span="10">
+                        <el-select
+                            v-if="init"
+                            v-model="fieldOptions.width_unit"
+                            :disabled="!fieldOptions.is_width"
+                            style="width: 100%;"
+                            @change="changeWidthUnit"
+                        >
+                            <el-option label="像素(px)" value="px" />
+                            <el-option label="百分比(%)" value="%" />
+                        </el-select>
+                    </el-col>
+                </el-row>
+            </el-form-item>
+            <el-form-item v-if="types.includes('rows')">
+                <template slot="label">行数<help-tip prop="rows" /></template>
+                <el-input v-model="fieldOptions.rows" />
+            </el-form-item>
+            <el-form-item v-if="types.includes('autosize')" label-width="110px">
+                <template slot="label">自适应高度<help-tip prop="autosize" /></template>
+                <el-switch v-model="fieldOptions.autosize" />
+                <div v-if="fieldOptions.autosize">
+                    <el-input-number
+                        v-model="fieldOptions.min_rows"
+                        :min="1"
+                        placeholder="最小行数"
+                        controls-position="right"
+                        style="width:90px;"
+                    />
+                    -
+                    <el-input-number
+                        v-model="fieldOptions.max_rows"
+                        :min="fieldOptions.min_rows||1"
+                        placeholder="最大行数"
+                        controls-position="right"
+                        style="width:90px;"
+                    />
+                </div>
+            </el-form-item>
 
-      <el-form-item v-if="types.includes('clearable')">
-        <template slot="label">可清空<help-tip prop="clearable" /></template>
-        <el-switch v-model=" clearable" />
-      </el-form-item>
+            <el-form-item v-if="types.includes('clearable')">
+                <template slot="label">可清空<help-tip prop="clearable" /></template>
+                <el-switch v-model=" clearable" />
+            </el-form-item>
 
-      <el-form-item v-if="types.includes('mode')">
-        <template slot="label">编辑模式<help-tip prop="tableMode" /></template>
-        <el-select v-model="fieldOptions.mode" @change="changeMode">
-          <el-option
-            v-for="(mode,index) in tabeModeOptions"
-            :key="index"
-            :value="mode.value"
-            :label="mode.label"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item v-if="types.includes('index')">
-        <template slot="label">显示序号<help-tip prop="index" /></template>
-        <el-switch v-model="fieldOptions.index" />
-      </el-form-item>
-      <el-form-item v-if="types.includes('summary')" label-width="110px">
-        <template slot="label">表尾合计行<help-tip prop="summary" /></template>
-        <el-row>
-          <el-col :span="5">
-            <el-switch v-model="fieldOptions.summary" @change="changeSummary" />
-          </el-col>
-          <el-col :span="14">
-            <el-input
-              v-model="sumText"
-              placeholder="合计描述"
-              :disabled="!fieldOptions.summary"
-              style="width:90%;"
-            />
-          </el-col>
-          <el-col v-if="fieldOptions.summary" :span="5">
-            <el-tooltip content="表尾合计行采用自定义方法">
-              <el-checkbox v-model="summaryMethod" />
-            </el-tooltip>
-          </el-col>
-        </el-row>
+            <el-form-item v-if="types.includes('mode')">
+                <template slot="label">编辑模式<help-tip prop="tableMode" /></template>
+                <el-select v-model="fieldOptions.mode" @change="changeMode">
+                    <el-option
+                        v-for="(mode,index) in tabeModeOptions"
+                        :key="index"
+                        :value="mode.value"
+                        :label="mode.label"
+                    />
+                </el-select>
+            </el-form-item>
+            <el-form-item v-if="types.includes('page')">
+                <template slot="label">是否分页</template>
+                <el-switch
+                    v-model="fieldOptions.page"
+                    active-value="Y"
+                    inactive-value="N"
+                />
+            </el-form-item>
+            <el-form-item v-if="fieldOptions.page === 'Y'">
+                <template slot="label">分页大小</template>
+                <el-select v-model="fieldOptions.pageSize" placeholder="请设置默认分页大小">
+                    <el-option
+                        v-for="item in pageSizeOptions"
+                        :key="item"
+                        :label="item"
+                        :value="item"
+                    />
+                </el-select>
+            </el-form-item>
+            <el-form-item v-if="types.includes('index')">
+                <template slot="label">显示序号<help-tip prop="index" /></template>
+                <el-switch v-model="fieldOptions.index" />
+            </el-form-item>
+            <el-form-item v-if="types.includes('summary')" label-width="110px">
+                <template slot="label">表尾合计行<help-tip prop="summary" /></template>
+                <el-row>
+                    <el-col :span="5">
+                        <el-switch v-model="fieldOptions.summary" @change="changeSummary" />
+                    </el-col>
+                    <el-col :span="14">
+                        <el-input
+                            v-model="sumText"
+                            placeholder="合计描述"
+                            :disabled="!fieldOptions.summary"
+                            style="width:90%;"
+                        />
+                    </el-col>
+                    <el-col v-if="fieldOptions.summary" :span="5">
+                        <el-tooltip content="表尾合计行采用自定义方法">
+                            <el-checkbox v-model="summaryMethod" />
+                        </el-tooltip>
+                    </el-col>
+                </el-row>
 
-      </el-form-item>
+            </el-form-item>
 
-      <el-form-item v-if="types.includes('height')">
-        <template slot="label">高度<help-tip prop="height" /></template>
-        <el-input v-model="fieldOptions.height">
-          <template slot="append">像素(px)</template>
-        </el-input>
-      </el-form-item>
+            <el-form-item v-if="types.includes('height')">
+                <template slot="label">高度<help-tip prop="height" /></template>
+                <el-input v-model="fieldOptions.height">
+                    <template slot="append">像素(px)</template>
+                </el-input>
+            </el-form-item>
 
-      <el-form-item v-if="types.includes('arrangement')">
-        <template slot="label">排序方式<help-tip prop="arrangement" /></template>
-        <el-radio-group v-model="fieldOptions.arrangement">
-          <el-radio-button label="horizontal">横向</el-radio-button>
-          <el-radio-button label="vertical">纵向</el-radio-button>
-        </el-radio-group>
-      </el-form-item>
+            <el-form-item v-if="types.includes('arrangement')">
+                <template slot="label">排序方式<help-tip prop="arrangement" /></template>
+                <el-radio-group v-model="fieldOptions.arrangement">
+                    <el-radio-button label="horizontal">横向</el-radio-button>
+                    <el-radio-button label="vertical">纵向</el-radio-button>
+                </el-radio-group>
+            </el-form-item>
 
-      <el-form-item v-if="types.includes('customClass')" label-width="110px">
-        <template slot="label">自定义Class(用于子表单宽度，输入数字)<help-tip prop="customClass" /></template>
-        <el-input v-model="fieldOptions.custom_class" />
-      </el-form-item>
-      <el-form-item v-if="types.includes('mobile')" label-width="110px">
-        <template slot="label">移动端显示<help-tip prop="mobile" /></template>
-        <el-switch v-model="isMobile" />
-      </el-form-item>
+            <el-form-item v-if="types.includes('customClass')" label-width="110px">
+                <template slot="label">自定义Class(用于子表单宽度，输入数字)<help-tip prop="customClass" /></template>
+                <el-input v-model="fieldOptions.custom_class" />
+            </el-form-item>
+            <el-form-item v-if="types.includes('mobile')" label-width="110px">
+                <template slot="label">移动端显示<help-tip prop="mobile" /></template>
+                <el-switch v-model="isMobile" />
+            </el-form-item>
+        </div>
     </div>
-  </div>
 </template>
 <script>
 import EditorMixin from '../mixins/editor'
+import { defaultPageSize, pageSizeOptions } from '@/business/platform/form/constants/fieldOptions'
 
 export default {
-  mixins: [EditorMixin],
-  data() {
-    return {
-      tabeModeOptions: [{
-        value: 'inner',
-        label: '表内编辑模式'
-      }, {
-        value: 'block',
-        label: '块模式'
-      }, {
-        value: 'dialog',
-        label: '弹窗模式'
-      }],
-      mobile: this.fieldItem.field_options.mobile,
-      clearable: this.fieldItem.field_options.clearable,
-      init: true
-    }
-  },
-  computed: {
-    sumText: {
-      get() {
-        return this.fieldItem.field_options.sum_text
-      },
-      set(val) {
-        const fieldOptions = JSON.parse(JSON.stringify(this.fieldItem.field_options))
-        fieldOptions.sum_text = val
-        this.fieldItem.field_options = fieldOptions
-      }
-    },
-    summaryMethod: {
-      get() {
-        return this.fieldItem.field_options.summary_method
-      },
-      set(val) {
-        const fieldOptions = JSON.parse(JSON.stringify(this.fieldItem.field_options))
-        fieldOptions.summary_method = val
-        this.fieldItem.field_options = fieldOptions
-      }
-    },
-    isMobile: {
-      get() {
-        return this.$utils.toBoolean(this.mobile, true)
-      },
-      set(val) {
-        this.fieldItem.field_options.mobile = this.mobile = val
-      }
-    },
-    isClearable: {
-      get() {
-        return this.$utils.toBoolean(this.clearable, true)
-      },
-      set(val) {
-        this.fieldItem.field_options.clearable = this.clearable = val
-      }
-    }
-  },
-  watch: {
-    mobile: {
-      handler(val, oldVal) {
-        if (this.$utils.isEmpty(this.fieldItem.field_options.mobile)) {
-          this.isMobile = this.fieldItem.field_options.mobile = true
-        } else {
-          if (val !== oldVal) {
-            this.isMobile = this.fieldItem.field_options.mobile = val
-          }
+    mixins: [EditorMixin],
+    data () {
+        return {
+            pageSizeOptions,
+            tabeModeOptions: [{
+                value: 'inner',
+                label: '表内编辑模式'
+            }, {
+                value: 'block',
+                label: '块模式'
+            }, {
+                value: 'dialog',
+                label: '弹窗模式'
+            }],
+            mobile: this.fieldItem.field_options.mobile,
+            clearable: this.fieldItem.field_options.clearable,
+            init: true
         }
-      },
-      immediate: true
     },
-    clearable: {
-      handler(val, oldVal) {
-        if (this.$utils.isEmpty(this.fieldItem.field_options.clearable)) {
-          this.isClearable = this.fieldItem.field_options.clearable = true
-        } else {
-          if (val !== oldVal) {
-            this.isClearable = this.fieldItem.field_options.clearable = val
-          }
+    computed: {
+        sumText: {
+            get () {
+                return this.fieldItem.field_options.sum_text
+            },
+            set (val) {
+                const fieldOptions = JSON.parse(JSON.stringify(this.fieldItem.field_options))
+                fieldOptions.sum_text = val
+                this.fieldItem.field_options = fieldOptions
+            }
+        },
+        summaryMethod: {
+            get () {
+                return this.fieldItem.field_options.summary_method
+            },
+            set (val) {
+                const fieldOptions = JSON.parse(JSON.stringify(this.fieldItem.field_options))
+                fieldOptions.summary_method = val
+                this.fieldItem.field_options = fieldOptions
+            }
+        },
+        isMobile: {
+            get () {
+                return this.$utils.toBoolean(this.mobile, true)
+            },
+            set (val) {
+                this.fieldItem.field_options.mobile = this.mobile = val
+            }
+        },
+        isClearable: {
+            get () {
+                return this.$utils.toBoolean(this.clearable, true)
+            },
+            set (val) {
+                this.fieldItem.field_options.clearable = this.clearable = val
+            }
         }
-      },
-      immediate: true
-    }
-  },
-  methods: {
-    changeIsLabelWidth(val) {
-      if (val) {
-        this.fieldItem.field_options.label_width = 100
-        this.fieldItem.field_options.label_width_unit = 'px'
-      } else {
-        this.fieldItem.field_options.label_width = null
-        this.fieldItem.field_options.label_width_unit = null
-      }
-    },
-    changeLabelWidthUnit(value) {
-      this.fieldItem.field_options.label_width = value === 'px' ? 100 : 20
-    },
-    changeIsWidth(val) {
-      this.fieldItem.field_options.width = '100'
-      this.fieldItem.field_options.width_unit = '%'
     },
-    changeWidthUnit(value) {
-      this.init = false
-      this.fieldItem.field_options.width = value === 'px' ? 100 : 100
-      setTimeout(() => {
-        this.init = true
-      })
-    },
-    changeSummary() {
-      this.fieldItem.field_options.sum_text = ''
-      this.fieldItem.field_options.summary_method = false
+    watch: {
+        mobile: {
+            handler (val, oldVal) {
+                if (this.$utils.isEmpty(this.fieldItem.field_options.mobile)) {
+                    this.isMobile = this.fieldItem.field_options.mobile = true
+                } else {
+                    if (val !== oldVal) {
+                        this.isMobile = this.fieldItem.field_options.mobile = val
+                    }
+                }
+            },
+            immediate: true
+        },
+        clearable: {
+            handler (val, oldVal) {
+                if (this.$utils.isEmpty(this.fieldItem.field_options.clearable)) {
+                    this.isClearable = this.fieldItem.field_options.clearable = true
+                } else {
+                    if (val !== oldVal) {
+                        this.isClearable = this.fieldItem.field_options.clearable = val
+                    }
+                }
+            },
+            immediate: true
+        }
     },
-    changeMode() {
-      // 变换字段
-      if (this.fieldItem.field_options.mode === 'block') {
-        this.fieldItem.field_options.index = true
-      }
+    methods: {
+        changeIsLabelWidth (val) {
+            if (val) {
+                this.fieldItem.field_options.label_width = 100
+                this.fieldItem.field_options.label_width_unit = 'px'
+            } else {
+                this.fieldItem.field_options.label_width = null
+                this.fieldItem.field_options.label_width_unit = null
+            }
+        },
+        changeLabelWidthUnit (value) {
+            this.fieldItem.field_options.label_width = value === 'px' ? 100 : 20
+        },
+        changeIsWidth (val) {
+            this.fieldItem.field_options.width = '100'
+            this.fieldItem.field_options.width_unit = '%'
+        },
+        changeWidthUnit (value) {
+            this.init = false
+            this.fieldItem.field_options.width = value === 'px' ? 100 : 100
+            setTimeout(() => {
+                this.init = true
+            })
+        },
+        changeSummary () {
+            this.fieldItem.field_options.sum_text = ''
+            this.fieldItem.field_options.summary_method = false
+        },
+        changeMode () {
+            // 变换字段
+            this.fieldItem.field_options.index = true
+            if (this.fieldItem.field_options.mode === 'block') {
+                this.fieldItem.field_options.page = 'N'
+            } else {
+                this.fieldItem.field_options.page = 'Y'
+                this.fieldItem.field_options.pageSize = defaultPageSize
+            }
+        }
     }
-  }
 }
 </script>

src/business/platform/form/formbuilder/right-aside/field-types/ibps-field-table.vue

@@ -1,43 +1,43 @@
 <template>
-  <div>
-    <el-form v-bind="$attrs" v-on="$listeners" @submit.native.prevent>
-      <!-- 基本属性 -->
-      <editor-base
-        :field-item="fieldItem"
-        :bo-data="boData"
-        :fields="fields"
-        types="label,name,desc"
-      />
-      <!-- 表单字段和按钮 -->
-      <editor-field-table
-        :field-item="fieldItem"
-        :fields="fields"
-        :bo-data="boData"
-        @select="handleSelect"
-      />
-      <!-- 校验规则 -->
-      <editor-rules
-        :field-item="fieldItem"
-        types="required"
-      />
-      <!-- 字段权限 -->
-      <editor-rights
-        :field-item="fieldItem"
-      />
-      <!-- 布局设置 -->
-      <editor-layout
-        :field-item="fieldItem"
-        types="mode,index,summary,summaryMethod,customClass"
-      />
-    </el-form>
-  </div>
+    <div>
+        <el-form v-bind="$attrs" v-on="$listeners" @submit.native.prevent>
+            <!-- 基本属性 -->
+            <editor-base
+                :field-item="fieldItem"
+                :bo-data="boData"
+                :fields="fields"
+                types="label,name,desc"
+            />
+            <!-- 表单字段和按钮 -->
+            <editor-field-table
+                :field-item="fieldItem"
+                :fields="fields"
+                :bo-data="boData"
+                @select="handleSelect"
+            />
+            <!-- 校验规则 -->
+            <editor-rules
+                :field-item="fieldItem"
+                types="required"
+            />
+            <!-- 字段权限 -->
+            <editor-rights
+                :field-item="fieldItem"
+            />
+            <!-- 布局设置 -->
+            <editor-layout
+                :field-item="fieldItem"
+                types="mode,page,index,summary,summaryMethod,customClass"
+            />
+        </el-form>
+    </div>
 </template>
 
 <script>
 import typeMixin from '../mixins/type'
 
 export default {
-  name: 'ibps-field-table',
-  mixins: [typeMixin]
+    name: 'ibps-field-table',
+    mixins: [typeMixin]
 }
 </script>

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

@@ -8,18 +8,46 @@
                     <!--弹窗模式对话框-->
                     <div v-if="toolbarButtons && toolbarButtons.length > 0" class="ibps-fr hidden-print">
                         <el-button-group>
-                            <el-button v-for="(button, index) in toolbarButtons" :key="index" :type="button.type" :icon="button.icon" @click="handleActionEvent(button, index)">
+                            <el-button
+                                v-for="(button, index) in toolbarButtons"
+                                :key="index"
+                                :type="button.type"
+                                :icon="button.icon"
+                                @click="handleActionEvent(button, index)"
+                            >
                                 {{ button.label }}
                             </el-button>
                         </el-button-group>
                     </div>
                 </div>
                 <div class="panel-body">
-                    <el-table ref="elTable" :data="copDataModel" :header-cell-style="{ color: '#000', 'font-size': '14px', padding: '4px 0' }" :row-class-name="tableRowClassName" :show-summary="showSummary" :sum-text="sumText" :summary-method="hasSummaryMethod ? summaryMethod : null" border @selection-change="handleSelectionChange">
+                    <el-table
+                        ref="elTable"
+                        :data.sync="copDataModel"
+                        :header-cell-style="{ color: '#000', 'font-size': '14px', padding: '4px 0' }"
+                        :row-class-name="tableRowClassName"
+                        :show-summary="showSummary"
+                        :sum-text="sumText"
+                        :summary-method="hasSummaryMethod ? summaryMethod : null"
+                        border
+                        @selection-change="handleSelectionChange"
+                    >
                         <el-table-column v-if="!tableReadonly" type="selection" width="50" />
-                        <el-table-column v-if="field.field_options.index" type="index" :label="field.field_options.index_name ? field.field_options.index_name : '序号'" :width="field.field_options.index_width ? field.field_options.index_width : 50" :index="indexMethod" />
+                        <el-table-column
+                            v-if="field.field_options.index"
+                            type="index"
+                            :label="field.field_options.index_name ? field.field_options.index_name : '序号'"
+                            :width="field.field_options.index_width ? field.field_options.index_width : 50"
+                            :index="indexMethod"
+                        />
                         <template v-for="(column, j) in displayColumns">
-                            <el-table-column v-if="!columnHidden(column) && column.field_type != 'desc' && column.label != ''" :key="j" show-overflow-tooltip :prop="column.name" :width="column.field_options.custom_class || null">
+                            <el-table-column
+                                v-if="!columnHidden(column) && column.field_type != 'desc' && column.label != ''"
+                                :key="j"
+                                show-overflow-tooltip
+                                :prop="column.name"
+                                :width="column.field_options.custom_class || null"
+                            >
                                 <template slot="header">
                                     {{ $utils.isNotEmpty(column.field_options.units) ? column.label + '(' + column.field_options.units + ')' : column.label }}
                                     <ibps-help v-if="column && column.desc && descPosition === 'lableIcon'" type="tooltip" :content="$utils.formatText(column.desc)" />
@@ -46,17 +74,37 @@
                                 </template>
                             </el-table-column>
                         </template>
-                        <el-table-column v-if="manageButtons && manageButtons.length > 0" align="center" fixed="right" class-name="hidden-print" label="操作栏目" :width="manageButtons.length == 1 ? '85' : '160'">
+                        <el-table-column
+                            v-if="manageButtons && manageButtons.length > 0"
+                            align="center"
+                            fixed="right"
+                            class-name="hidden-print"
+                            label="操作栏目"
+                            :width="manageButtons.length == 1 ? '85' : '160'"
+                        >
                             <template slot-scope="scope">
                                 <el-dropdown v-if="manageButtons.length > 3">
                                     <ibps-icon name="chevron-circle-down" size="28" class="hidden-print" />
                                     <el-dropdown-menu slot="dropdown" class="ibps-table-dropdown-menu" style="margin-top: 0.02rem">
-                                        <ibps-toolbar :actions="manageButtons" :socpe="thatSocpe" :data="scope.row" position="manage" class="hidden-print" @action-event="(action) => handleActionEvent(action, scope.$index)" />
+                                        <ibps-toolbar
+                                            :actions="manageButtons"
+                                            :socpe="thatSocpe"
+                                            :data="scope.row"
+                                            position="manage"
+                                            class="hidden-print"
+                                            @action-event="(action) => handleActionEvent(action, scope.$index)"
+                                        />
                                     </el-dropdown-menu>
                                 </el-dropdown>
                                 <template v-else>
                                     <template v-for="(button, index) in manageButtons">
-                                        <el-link :key="index" :icon="button.icon" :type="button.type" :underline="false" @click="handleActionEvent(button, scope.$index)">{{ button.label }}</el-link>
+                                        <el-link
+                                            :key="index"
+                                            :icon="button.icon"
+                                            :type="button.type"
+                                            :underline="false"
+                                            @click="handleActionEvent(button, scope.$index)"
+                                        >{{ button.label }}</el-link>
                                         <!-- <el-button plain size="mini" :key="index" :type="button.type" @click="handleActionEvent(button, scope.$index)">
                                             {{ button.label }}
                                         </el-button> -->
@@ -118,11 +166,39 @@
 
         <el-table v-else :data="[]" empty-text="您尚未创建任何字段。请在表单中添加字段。" border />
         <!--按钮支持自定义对话框-->
-        <custom-dialog :visible="customDialogVisible" :value="[]" :template-key="customDialogKey" :dynamic-params="customDialogDynamicParams" @close="(visible) => (customDialogVisible = visible)" @action-event="handleCustomDialogActionEvent" />
+        <custom-dialog
+            :visible="customDialogVisible"
+            :value="[]"
+            :template-key="customDialogKey"
+            :dynamic-params="customDialogDynamicParams"
+            @close="(visible) => (customDialogVisible = visible)"
+            @action-event="handleCustomDialogActionEvent"
+        />
 
-        <import-table :visible="importTableDialogVisible" :title="field.label" @close="(visible) => ImportTableAction(visible)" @action-event="handleImportTableActionEvent" />
-        <component :is="dialogTemplate" v-if="dialogTemplate" ref="dialogTemplate" v-bind="dialogTemplateAtts" />
-        <formrender-dialog ref="jyxtEdit" :visible="formDialogVisible" :title="field.label" :form-def="dialogFormDef" :data="dialogFormData" :mode="mode" :edit-from-type="editFromType" custom-class="ibps-dialog-80" @close="(visible) => (formDialogVisible = visible)" @action-event="handleFormDialogActionEvent" />
+        <import-table
+            :visible="importTableDialogVisible"
+            :title="field.label"
+            @close="(visible) => importTableAction(visible)"
+            @action-event="handleImportTableActionEvent"
+        />
+        <component
+            :is="dialogTemplate"
+            v-if="dialogTemplate"
+            ref="dialogTemplate"
+            v-bind="dialogTemplateAtts"
+        />
+        <formrender-dialog
+            ref="jyxtEdit"
+            :visible="formDialogVisible"
+            :title="field.label"
+            :form-def="dialogFormDef"
+            :data="dialogFormData"
+            :mode="mode"
+            :edit-from-type="editFromType"
+            custom-class="ibps-dialog-80"
+            @close="(visible) => (formDialogVisible = visible)"
+            @action-event="handleFormDialogActionEvent"
+        />
     </div>
 </template>
 <script>
@@ -135,6 +211,7 @@ import FormUtils from '../../utils/formUtil'
 import FormFieldUtil from '../../utils/formFieldUtil'
 
 import { hasPermission } from '@/business/platform/form/constants/tableButtonTypes'
+import { defaultPageSize, pageSizeOptions } from '@/business/platform/form/constants/fieldOptions'
 
 import CustomDialog from '@/business/platform/data/templaterender/custom-dialog/dialog'
 import FormrenderDialog from '@/business/platform/form/formrender/dialog'
@@ -143,6 +220,11 @@ import IbpsExport from '@/plugins/export'
 import IbpsImport from '@/plugins/import'
 
 const JForm = window.JForm
+// 获取子表展示数据
+const getShowData = (data, current = 1, size = defaultPageSize) => {
+    return data ? JSON.parse(JSON.stringify(data)).slice((current - 1) * size, current * size) : []
+}
+
 export default {
     components: {
         FormrenderDialog,
@@ -238,7 +320,6 @@ export default {
             fieldOptions.default_value_type = fieldOptions.default_value_type || 'fixed'
             return fieldOptions
         },
-
         toolbarButtons () {
             return this.filterButtons('toolbar')
         },
@@ -266,6 +347,22 @@ export default {
         columns () {
             return this.field.field_options.columns || []
         },
+        needPage () {
+            return this.field.field_options.page || 'Y'
+        },
+        // pageSize () {
+        //     return this.field.field_options.pageSize || 10
+        // },
+        // copDataModel () {
+        //     // 非块模式且数据不为空
+        //     if (this.$utils.isNotEmpty(this.dataModel) && ['dialog', 'inner'].includes(this.mode)) {
+        //         console.log(this.currentPage, (this.currentPage - 1) * this.pageSize, this.pageSize)
+        //         return this.$utils.newData(this.dataModel).slice((this.currentPage - 1) * this.pageSize, this.currentPage * this.pageSize)
+        //     } else {
+        //         console.log(2, this.dataModel)
+        //         return this.dataModel
+        //     }
+        // },
         nameColumns () {
             return FormFieldUtil.getSubDisplayColumns(this.columns)
         },
@@ -326,7 +423,7 @@ export default {
             return this.params.responseLinkages
         },
         copDataModelCont () {
-            /* 进行参数替换，提高子表性能 */
+            // 进行参数替换，提高子表性能
             return JSON.parse(JSON.stringify(this.dataModel))
         },
         listeners () {
@@ -340,12 +437,16 @@ export default {
     watch: {
         value: {
             handler (val, oldVal) {
-                if (!val) return
+                if (!val) {
+                    this.dataModel = []
+                    return
+                }
                 this.dataModel = val
-                /*  if (!valueEquals(val, oldVal)) {
-               this.dispatch('ElFormItem', 'el.form.change', val)
-             } */
-            }
+                // if (!valueEquals(val, oldVal)) {
+                //     this.dispatch('ElFormItem', 'el.form.change', val)
+                // }
+            },
+            immediate: true
         },
         dataModel: {
             handler (val, oldVal) {
@@ -393,6 +494,7 @@ export default {
         })
     },
     methods: {
+        getShowData,
         indexMethod (index) {
             return (this.currentPage - 1) * 10 + index + 1
         },
@@ -487,7 +589,6 @@ export default {
                 return rights || {}
             }
         },
-
         tableRowClassName ({ row, rowIndex }) {
             // 把每一行的索引放进row
             row.$index = rowIndex
@@ -658,7 +759,7 @@ export default {
         handleImport () {
             this.importTableDialogVisible = true
         },
-        ImportTableAction (val) {
+        importTableAction (val) {
             this.importTableDialogVisible = false
             this.importList = []
             this.importVlaue = null
@@ -921,17 +1022,15 @@ export default {
             this.formDialogVisible = true
             this.judgeData(index)
         },
-        /* 第一次进入时，不做更新判断。
-      并记录当前进入时的操作， index>=0 则为修改。否则为新增。
-      第二次进入时判断
-      如果上次为修改，则刷新重置添加。
-      如果上次为新增，则不做变化。
-    */
+        /**
+         * 第一次进入时：不做更新判断。并记录当前进入时的操作，index>=0 则为修改。否则为新增。
+         * 第二次进入时判断：如果上次为修改，则刷新重置添加。如果上次为新增，则不做变化。
+         */
         judgeData (index) {
             if (index >= 0 && this.handleCout) {
                 // 第一次进入时，不做更新判断。
                 this.$refs.jyxtEdit.loadFormData()
-            } else if (index == undefined && this.handleCout == '编辑') {
+            } else if (index === undefined && this.handleCout === '编辑') {
                 this.$refs.jyxtEdit.loadFormData()
             }
             this.handleCout = index >= 0 ? '编辑' : '新增' // 记录

src/views/component/qrcodeed.vue

@@ -7,6 +7,7 @@
 
 <script>
 import QRCode from 'qrcodejs2' // 引入qrcode
+import { BASE_URL } from '@/constant'
 export default {
     name: 'qrcode',
     props: {
@@ -24,8 +25,7 @@ export default {
     },
     data () {
         return {
-            qrCode: '',
-            baseUrl: process.env.VUE_APP_BASE_URL
+            qrCode: ''
         }
     },
     watch: {
@@ -58,8 +58,8 @@ export default {
             this.qrCode = new QRCode('qrcode', {
                 width: 132,
                 height: 132,
-                text: `https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxf0aecf99696061a3&redirect_uri=${encodeURIComponent(`${this.baseUrl}#/ziliao`)}&response_type=code&scope=snsapi_base&state=${this.formData.changJingId}#wechat_redirect`,
-                // text: `https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxea2c214ca5d25739&redirect_uri=${encodeURIComponent(`${this.baseUrl}#/ziliao`)}&response_type=code&scope=snsapi_base&state=${this.formData.changJingId}#wechat_redirect`,
+                text: `https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxf0aecf99696061a3&redirect_uri=${encodeURIComponent(`${BASE_URL}#/ziliao`)}&response_type=code&scope=snsapi_base&state=${this.formData.changJingId}#wechat_redirect`,
+                // text: `https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxea2c214ca5d25739&redirect_uri=${encodeURIComponent(`${BASE_URL}#/ziliao`)}&response_type=code&scope=snsapi_base&state=${this.formData.changJingId}#wechat_redirect`,
                 colorDark: '#000000', // 前景色
                 colorLight: '#FFFFFF', // 背景色
                 correctLevel: QRCode.CorrectLevel.L