kz-ui-base 1.0.0

package/list-bese-page/doublelistBasePageTs.vue

@@ -0,0 +1,996 @@
+<template>
+  <div class="app-container">
+    <slot></slot>
+    <el-row :gutter="24">
+      <!--树数据-->
+      <el-col v-if="treeSetting.visable" :span="4" :xs="24">
+        <div class="wrapper-container wrapper-container-supplement">
+          <div class="head-container">
+            <el-input
+              v-model="deptName"
+              :placeholder="treeSetting.title"
+              clearable
+              size="small"
+              prefix-icon="el-icon-search"
+              style="margin-bottom: 20px"
+            />
+          </div>
+          <div class="head-container">
+            <el-tree
+              :data="deptPostOptions"
+              :props="defaultProps"
+              :expand-on-click-node="false"
+              :filter-node-method="filterNode"
+              ref="tree"
+              default-expand-all
+              @node-click="handleNodeClick"
+            />
+          </div>
+        </div>
+      </el-col>
+      <!--用户数据-->
+      <el-col :span="treeSetting.visable ? 20 : 24" :xs="24">
+        <div class="wrapper-container" v-show="isShowSearch">
+          <el-form
+            :model="listQueryParams"
+            ref="queryForm"
+            :inline="true"
+            label-width="100px"
+          >
+            <component
+              v-for="(searchRule, index) in searchRules"
+              :key="index"
+              v-if="
+                searchRule.visible == undefined || searchRule.visible != false
+              "
+              :is="
+                searchRule.displayType != null
+                  ? 'KZ_' + searchRule.displayType
+                  : 'KZ_TextBox'
+              "
+              :columns="searchRules"
+              :column="searchRule"
+              :entity="searchRule"
+              :setting.sync="searchRule.setting"
+              :value="searchRule.value"
+              @keyup.enter.native="handleQuery"
+            >
+            </component>
+            <el-form-item>
+              <el-button
+                type="primary"
+                icon="el-icon-search"
+                size="mini"
+                @click="handleQuery"
+                >搜索</el-button
+              >
+              <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
+                >重置</el-button
+              >
+            </el-form-item>
+          </el-form>
+        </div>
+
+        <div class="wrapper-container">
+          <el-row :gutter="10" class="mb8">
+            <template v-for="opMenu in opMenus">
+              <el-col :key="opMenu.name" :span="1.5" v-if="opMenu.visable">
+                <el-button
+                  :type="opMenu.cssType || 'primary'"
+                  plain
+                  :icon="opMenu.icon"
+                  :disabled="opMenu.disabled"
+                  size="mini"
+                  @click="onOpMenuClick({ opMenu: opMenu })"
+                  v-hasPermi="[
+                    opMenu.permission,
+                    `${moduleName}:${serviceName}:${opMenu.permission}`,
+                  ]"
+                >
+                  {{ opMenu.text }}
+                </el-button>
+              </el-col>
+            </template>
+            <template v-for="(opMenu, index) in customOpMenus">
+              <el-col :key="index" :span="1.5" v-if="opMenu.visable">
+                <el-button
+                  :type="opMenu.cssType || 'primary'"
+                  plain
+                  :icon="opMenu.icon"
+                  :disabled="opMenu.disabled"
+                  size="mini"
+                  @click="onCustomOpMenuClick({ opMenu: opMenu })"
+                  v-hasPermi="[
+                    opMenu.permission,
+                    `${moduleName}:${serviceName}:${opMenu.permission}`,
+                  ]"
+                >
+                  {{ opMenu.text }}
+                </el-button>
+              </el-col>
+            </template>
+
+            <right-toolbar
+              :showSearch.sync="isShowSearch"
+              :sortVisible="false"
+              @queryTable="getList"
+              :columns="listColumns"
+            />
+          </el-row>
+
+          <el-table
+            ref="multipleTable"
+            :height="tableHeight"
+            v-loading="loading"
+            :border="true"
+            :data="listData"
+            highlight-current-row
+            @current-change="rowclick"
+            @row-click="clickRow"
+            @selection-change="onSelectionChange"
+          >
+            <el-table-column
+              v-if="isMultiple"
+              type="selection"
+              width="50"
+              align="center"
+            />
+            <el-table-column
+              v-if="listSetting.isShowIndexColumn != false"
+              type="index"
+              label="序号"
+              width="50"
+              align="center"
+            >
+              <template scope="scope">
+                <span>{{
+                  (listQueryParams.pageNum - 1) * listQueryParams.pageSize +
+                  scope.$index +
+                  1
+                }}</span>
+              </template>
+            </el-table-column>
+            <template v-for="(column, index) in listColumns">
+              <el-table-column
+                :show-overflow-tooltip="true"
+                :key="index"
+                :label="column.text"
+                align="center"
+                :prop="column.property"
+                v-if="column.visible != false"
+                :min-width="column.width || 100"
+              >
+                <template slot-scope="scope">
+                  <div v-if="column.displayType == 'Upload'">
+                    {{ getFileNickName(scope.row[scope.column.property]) }}
+                  </div>
+                  <div v-else-if="column.displayType == 'DatePicker'">
+                    {{
+                      dateFormat(
+                        scope.row,
+                        column,
+                        scope.row[column.property],
+                        scope.row[column.property]
+                      )
+                    }}
+                  </div>
+                  <div
+                    v-else-if="
+                      column.setting &&
+                      (column.setting.type || column.setting.dictType)
+                    "
+                  >
+                    {{
+                      tableDisplayFormat(
+                        scope.row,
+                        column,
+                        scope.row[column.property]
+                      )
+                    }}
+                  </div>
+                  <div v-else-if="column.htmlFormat">
+                    <span
+                      v-html="
+                        evalFunction(
+                          column.htmlFormat,
+                          scope.row,
+                          column,
+                          scope.row[column.property]
+                        )
+                      "
+                    ></span>
+                  </div>
+                  <div v-else-if="!!column.htmlFormat">
+                    <span
+                      v-html="
+                        evalFunction(
+                          column.htmlFormat,
+                          scope.row,
+                          column,
+                          scope.row[column.property]
+                        )
+                      "
+                    ></span>
+                  </div>
+                  <div v-else-if="column.format">
+                    {{
+                      evalFunction(
+                        column.format,
+                        scope.row,
+                        column,
+                        scope.row[column.property]
+                      )
+                    }}
+                  </div>
+                  <div v-else-if="column.click">
+                    <el-link
+                      type="primary"
+                      @click="
+                        evalFunction(
+                          column.click,
+                          scope.row,
+                          column,
+                          scope.row[column.property]
+                        )
+                      "
+                    >
+                      <span v-if="column.clickFormat">
+                        {{
+                          evalFunction(
+                            column.clickFormat,
+                            scope.row,
+                            column,
+                            scope.row[column.property]
+                          )
+                        }}
+                      </span>
+                      <span v-else>{{ scope.row[scope.column.property] }}</span>
+                    </el-link>
+                  </div>
+                  <div v-else>
+                    {{ scope.row[scope.column.property] }}
+                  </div>
+                </template>
+              </el-table-column>
+            </template>
+
+            <el-table-column
+              label="操作"
+              align="center"
+              min-width="160"
+              class-name="small-padding fixed-width"
+              v-if="listSetting.isShowOpColumn"
+            >
+              <template slot-scope="scope">
+                <el-button
+                  v-for="(opMenu, index) in listCustomOpMenus"
+                  :key="index"
+                  size="mini"
+                  type="text"
+                  :icon="opMenu.icon"
+                  @click="
+                    onListCustomOpMenuClick({ opMenu: opMenu, data: scope.row })
+                  "
+                  v-hasPermi="[
+                    opMenu.permission,
+                    `${moduleName}:${serviceName}:${opMenu.permission}`,
+                  ]"
+                >
+                  {{ opMenu.text }}
+                </el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+
+          <pagination
+            :total="listQueryParams.total"
+            :page.sync="listQueryParams.pageNum"
+            :limit.sync="listQueryParams.pageSize"
+            @pagination="getList"
+          />
+
+          <template v-for="(item, dex) in tableSetting">
+            <div
+              v-if="searchShow"
+              class="wrapper-container doubleWrapper"
+              :key="dex + 'wra'"
+            >
+              <el-form
+                :model="listQueryParams"
+                :ref="'queryForm' + dex"
+                :inline="true"
+                label-width="100px"
+              >
+                <component
+                  v-for="(searchRule, y) in item.searchRules"
+                  :key="y + 'rules'"
+                  :is="
+                    searchRule.displayType != null
+                      ? 'KZ_' + searchRule.displayType
+                      : 'KZ_TextBox'
+                  "
+                  :column="{ text: searchRule.text, property: 'value' }"
+                  :entity="searchRule"
+                  :setting.sync="searchRule.setting"
+                  :value="searchRule.value"
+                >
+                </component>
+                <el-form-item>
+                  <el-button
+                    type="primary"
+                    icon="el-icon-search"
+                    size="mini"
+                    @click="doubleHandleQuery(dex)"
+                    >搜索</el-button
+                  >
+                  <el-button
+                    icon="el-icon-refresh"
+                    size="mini"
+                    @click="doubleResetQuery(dex)"
+                    >重置</el-button
+                  >
+                </el-form-item>
+              </el-form>
+            </div>
+            <template v-for="(opMenu, ix) in tableSetting[dex].customOpMenus">
+              <el-col
+                class="doublemenu"
+                :span="1.5"
+                v-if="bottomShow && opMenu.visable"
+                :key="ix + 'menu'"
+              >
+                <el-button
+                  :type="opMenu.cssType || 'primary'"
+                  plain
+                  :icon="opMenu.icon"
+                  :disabled="opMenu.disabled"
+                  size="mini"
+                  @click="doubleOnCustomOpMenuClick({ opMenu: opMenu }, ix)"
+                  v-hasPermi="[
+                    opMenu.permission,
+                    `${moduleName}:${serviceName}:${opMenu.permission}`,
+                  ]"
+                >
+                  {{ opMenu.text }}
+                </el-button>
+              </el-col>
+            </template>
+            <el-table
+              :height="tableHeight"
+              :border="true"
+              :key="dex"
+              v-loading="loading"
+              :data="multipleListData[dex]"
+              @selection-change="doubleSelectionChange"
+            >
+              <el-table-column
+                v-if="SelectionChangeShow"
+                type="selection"
+                width="50"
+                align="center"
+              />
+              <el-table-column
+                v-if="tableSetting[dex].isShowIndexColumn != false"
+                type="index"
+                label="序号"
+                width="50"
+                align="center"
+              >
+                <template scope="scope">
+                  <span>{{
+                    (multiplelistQueryParams[dex].pageNum - 1) *
+                      multiplelistQueryParams[dex].pageSize +
+                    scope.$index +
+                    1
+                  }}</span>
+                </template>
+              </el-table-column>
+              <template v-for="(column, index) in item.listColumns">
+                <el-table-column
+                  :key="index + 'column'"
+                  :label="column.text"
+                  align="center"
+                  :prop="column.property"
+                  v-if="column.visible != false"
+                  :min-width="column.width || 100"
+                >
+                  <template slot-scope="scope">
+                    <div v-if="column.displayType == 'Upload'">
+                      {{ getFileNickName(scope.row[scope.column.property]) }}
+                    </div>
+                    <div v-else-if="column.displayType == 'DatePicker'">
+                      {{
+                        dateFormat(
+                          scope.row,
+                          column,
+                          scope.row[column.property],
+                          scope.row[column.property]
+                        )
+                      }}
+                    </div>
+                    <div
+                      v-else-if="
+                        column.setting &&
+                        (column.setting.type || column.setting.dictType)
+                      "
+                    >
+                      {{
+                        doubleTableDisplayFormat(
+                          scope.row,
+                          column,
+                          scope.row[column.property],
+                          dex
+                        )
+                      }}
+                    </div>
+                    <div v-else-if="column.htmlFormat">
+                      <span
+                        v-html="
+                          evalFunction(
+                            column.htmlFormat,
+                            scope.row,
+                            column,
+                            scope.row[column.property]
+                          )
+                        "
+                      ></span>
+                    </div>
+                    <div v-else-if="!!column.htmlFormat">
+                      <span
+                        v-html="
+                          evalFunction(
+                            column.htmlFormat,
+                            scope.row,
+                            column,
+                            scope.row[column.property]
+                          )
+                        "
+                      ></span>
+                    </div>
+                    <div v-else-if="column.format">
+                      {{
+                        evalFunction(
+                          column.format,
+                          scope.row,
+                          column,
+                          scope.row[column.property]
+                        )
+                      }}
+                    </div>
+                    <div v-else-if="column.click">
+                      <el-link
+                        type="primary"
+                        @click="
+                          evalFunction(
+                            column.click,
+                            scope.row,
+                            column,
+                            scope.row[column.property]
+                          )
+                        "
+                      >
+                        <span v-if="column.clickFormat">
+                          {{
+                            evalFunction(
+                              column.clickFormat,
+                              scope.row,
+                              column,
+                              scope.row[column.property]
+                            )
+                          }}
+                        </span>
+                        <span v-else>{{
+                          scope.row[scope.column.property]
+                        }}</span>
+                      </el-link>
+                    </div>
+                    <div v-else>
+                      {{ scope.row[scope.column.property] }}
+                    </div>
+                  </template>
+                </el-table-column>
+              </template>
+
+              <el-table-column
+                label="操作"
+                align="center"
+                min-width="160"
+                class-name="small-padding fixed-width"
+                v-if="tableSetting[dex].isShowOpColumn"
+              >
+                <template slot-scope="scope">
+                  <el-button
+                    v-for="(opMenu, ix) in item.listCustomOpMenus"
+                    :key="ix + 'opMenu'"
+                    size="mini"
+                    type="text"
+                    :icon="opMenu.icon"
+                    @click="
+                      onListCustomOpMenuClick({
+                        opMenu: opMenu,
+                        data: scope.row,
+                        index: scope.$index,
+                      })
+                    "
+                    v-hasPermi="[
+                      opMenu.permission,
+                      `${moduleName}:${serviceName}:${opMenu.permission}`,
+                    ]"
+                  >
+                    {{ opMenu.text }}
+                  </el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+            <pagination
+              :key="dex + 'pagin'"
+              v-show="multiplelistQueryParams[dex].total > 0"
+              :total="multiplelistQueryParams[dex].total"
+              :page.sync="multiplelistQueryParams[dex].pageNum"
+              :limit.sync="multiplelistQueryParams[dex].pageSize"
+              @pagination="
+                doubleGetList(
+                  dex,
+                  undefined,
+                  searchShow ? 'doubleList' : 'doubleListSearch'
+                )
+              "
+            />
+          </template>
+        </div>
+      </el-col>
+    </el-row>
+
+    <!-- 添加或修改参数配置对话框 -->
+    <component
+      ref="editDialog"
+      :title="title"
+      :moduleName="moduleName"
+      :serviceName="serviceName"
+      :entity.sync="currentEntity"
+      :setting.sync="editSetting"
+      :columns.sync="editColumns"
+      :editForm="editSetting.listSetting.listColumns.editForm"
+      :rules.sync="editRules"
+      :customOpMenus.sync="editCustomOpMenus"
+      :areaSetting="areaSetting"
+      v-on:onCustomOpMenuClick="onEditCustomOpMenuClick"
+      v-on:onSaveClick="onEditSaveClick"
+      v-on:onCancelClick="onEditCancelClick"
+      v-on:change="onChangeEvent"
+      v-if="editSetting.isShow"
+      width="600px"
+      append-to-body
+      v-dialogDrag
+      v-dialogDragHeight
+      :is="editDialogComponent"
+    >
+    </component>
+
+    <!-- 用户导入对话框 -->
+    <UploadDialog
+      ref="uploadDialog"
+      :moduleName="moduleName"
+      :serviceName="serviceName"
+      :setting.sync="uploadSetting"
+      :visible.sync="uploadSetting.isShow"
+      width="400px"
+      append-to-body
+      v-dialogDrag
+      v-dialogDragHeight
+    >
+    </UploadDialog>
+
+    <!-- 打印界面对话框 -->
+    <printDialog
+      ref="printDialog"
+      :moduleName="moduleName"
+      :serviceName="serviceName"
+      :templateType="templateType"
+      :setting.sync="printSetting"
+      :visible.sync="printSetting.isShow"
+      width="70%"
+      append-to-body
+      v-dialogDrag
+      v-dialogDragHeight
+    >
+    </printDialog>
+  </div>
+</template>
+
+<script>
+import { Component } from "vue-property-decorator";
+import {
+  listEntity,
+  selectInterfaceSetting,
+  initTableField,
+} from "@api/common/common";
+import {ListBasePage} from "list-bese-page";
+@Component
+export default class doubleBasePageTs extends ListBasePage {
+  //表格高度
+  tableHeight = "700";
+  //独立搜索
+  searchShow = false;
+  //多表格独立自定义按钮
+  bottomShow = false;
+  //多表格全选按钮
+  SelectionChangeShow = false;
+
+  //多个表格
+  tableSetting = [
+    {
+      //获取列表数据的api方法名
+      getListAction: "list",
+      //微服务模块名称
+      moduleName: undefined,
+      //实体名称-服务名称
+      serviceName: undefined,
+      //当前表格主键字段
+      pkField: "id",
+      //子表外健字段
+      fkField: undefined,
+      //子表外健绑定主表外键字段
+      parentFkField: undefined,
+      //表格是否自动加载数据
+      isAutoLoad: true,
+      //是否显示操作栏
+      isShowOpColumn: false,
+      //是否显示行号
+      isShowIndexColumn: true,
+      // 列表列信息
+      listColumns: [
+        //{ key: 0, text: `用户编码`, property: "userNo", type: "string", visible: true },
+        //{ key: 1, text: `用户账号`, property: "userAccount", visible: true },
+      ],
+      //列表自定义操作菜单设定 - 若无自定义按钮，不需要重写
+      listCustomOpMenus: [
+        //{ visable: true, text: "按钮1", icon: "el-icon-edit", permission: "", name: "custom1", isShowText: false }
+      ],
+
+      //搜索项
+      searchRules: { rules: [] },
+      //自定义操作菜单设定 - 若无自定义按钮，不需要重写
+      customOpMenus: [
+        {
+          visable: true,
+          text: "按钮1",
+          icon: "el-icon-plus",
+          permission: "",
+          name: "custom1",
+          isShowText: false,
+          cssType: "success",
+        },
+      ],
+    },
+  ];
+  //表格分页
+  multiplelistQueryParams = [];
+  //表格数据
+  multipleListData = [[{}, {}]];
+  //表格选中数据
+  multipleCurrentEntity = [];
+  rowNew = {};
+  created() {
+    this.initItemTableField();
+
+    //获取树数据
+    if (this.treeSetting.visable) {
+      this.getTreeSelect();
+    }
+    for (const key in this.tableSetting) {
+      this.multiplelistQueryParams.push({
+        pageNum: 1,
+        pageSize: 10,
+        totalPages: 1,
+        total: 0,
+        orderBy: "id",
+      });
+    }
+    if (this.isAutoLoad) {
+      console.log(this.isAutoLoad);
+      if (this.moduleName && this.serviceName) this.getList();
+    }
+    //是否开启各自搜索
+    if (this.searchShow) {
+      this.doubleList();
+    }
+    this.editSetting.pkField = this.pkField;
+    this.listSetting.pkField = this.pkField;
+  }
+  mounted() {
+    this.$nextTick(function () {
+      this.tableHeight =
+        window.innerHeight / 2 -
+        this.$refs.multipleTable.$el.getBoundingClientRect().top;
+
+      // 监听窗口大小变化
+
+      var that = this;
+
+      window.onresize = function () {
+        that.tableHeight =
+          window.innerHeight / 2 -
+          that.$refs.multipleTable.$el.getBoundingClientRect().top;
+      };
+    });
+  }
+  /** 表格列显示格式化方法 */
+  doubleTableDisplayFormat(row, column, cellValue, index) {
+    return this.super(ListBasePage, "tableDisplayFormat", [
+      row,
+      column,
+      cellValue,
+      this.tableSetting[index].listColumns,
+    ]);
+  }
+  //带各自搜索的首次请求
+  doubleList() {
+    this.multipleListData = [];
+    for (const key in this.tableSetting) {
+      this.multipleListData.push(null);
+      this.doubleGetList(key, undefined, "doubleList");
+    }
+  }
+  /** 获取查询条件 */
+  getSearchParams(pagerInfo, searchRules, index, type) {
+    if (!pagerInfo)
+      if (!pagerInfo) {
+        pagerInfo = this.listQueryParams;
+        if (index != undefined) {
+          pagerInfo = this.multiplelistQueryParams[index];
+        }
+      }
+    // 是多表格搜索
+
+    if (type == "tableSetting") {
+      var searchParams = { rules: [] };
+      for (var key in pagerInfo) {
+        searchParams[key] = pagerInfo[key];
+      }
+      if (!searchRules) searchRules = this.tableSetting[index].searchRules;
+      if (searchRules) {
+        for (var item of searchRules) {
+          // searchParams[item.property] = item.value;
+          searchParams.rules.push({
+            op: item.op,
+            property: item["property"],
+            value: item["value"],
+          });
+        }
+      }
+      return searchParams;
+    }
+    if (!searchRules) searchRules = this.searchRules;
+    var searchParams = { rules: [] };
+
+    for (var key in pagerInfo) {
+      searchParams[key] = pagerInfo[key];
+    }
+    if (this.searchRules) {
+      for (var item of searchRules) {
+        // searchParams[item.property] = item.value;
+        if (item[item.property] || item[item.property] == 0) {
+          searchParams.rules.push({
+            op: item.op,
+            property: item["property"],
+            value: item[item.property],
+          });
+        }
+      }
+    }
+    return searchParams;
+  }
+  /** 查询用户列表 */
+  getList() {
+    //多表格查询
+    this.loading = true;
+    listEntity(
+      this.moduleName,
+      this.serviceName,
+      { op: "AND", ...this.getSearchParams() },
+      this.listSetting.getListAction
+    )
+      .then((response) => {
+        this.listData = response.rows;
+        this.listQueryParams.total = Number(response.total);
+        this.loading = false;
+        //节流
+        this.$nextTick(() => {
+          this.resetQueryClick = true;
+          this.loading = false;
+        });
+      })
+      .catch(() => {
+        this.loading = false;
+      });
+  }
+
+  //多列表查询
+  doubleGetList(index, row, type) {
+    var item = this.tableSetting[index];
+    this.loading = true;
+    if (!type) if (!row) row = this.currentEntity;
+    // if (!row) return;
+    if (row) {
+      if (row[item.parentFkField]) {
+        this.loading = true;
+        this.multiplelistQueryParams[index][item.fkField] =
+          row[item.parentFkField];
+
+        listEntity(
+          item.moduleName,
+          item.serviceName,
+          {
+            op: "AND",
+            ...this.getSearchParams(
+              undefined,
+              undefined,
+              index,
+              "tableSetting"
+            ),
+          },
+          item.getListAction
+        )
+          .then((response) => {
+            this.multipleListData[index] = response.rows;
+            this.multiplelistQueryParams[index].total = Number(response.total);
+            this.loading = false;
+            this.$forceUpdate();
+          })
+          .catch(() => {
+            this.loading = false;
+          });
+      }
+      if (!row[item.parentFkField]) {
+        this.multipleListData = [];
+        this.multiplelistQueryParams[index].total = 0;
+      }
+    }
+    if (!row) {
+      this.multipleListData = [];
+      let getSearchParam = {};
+      if (type) {
+        getSearchParam = this.getSearchParams(undefined, undefined, index);
+      }
+      if (!type || type == "doubleListSearch") {
+        getSearchParam = this.getSearchParams(
+          undefined,
+          undefined,
+          index,
+          "tableSetting"
+        );
+      }
+      listEntity(
+        this.tableSetting[index].moduleName,
+        this.tableSetting[index].serviceName,
+        { op: "AND", ...getSearchParam },
+        this.tableSetting[index].getListAction
+      )
+        .then((response) => {
+          this.multipleListData.push(response.rows);
+          this.multiplelistQueryParams[index].total = Number(response.total);
+          this.$forceUpdate();
+          this.loading = false;
+        })
+        .catch(() => {
+          this.loading = false;
+        });
+    }
+  }
+  //点击表格单行
+  rowclick(row, column) {
+    // 点击行多选
+    //节流
+    if (!this.resetQueryClick) {
+      return;
+    }
+    this.rowNew = row;
+    this.tableSetting.forEach((item, key) => {
+      this.doubleGetList(key, row);
+    });
+  }
+  //多选框选中数据
+  doubleSelectionChange(value) {
+    this.multipleCurrentEntity = value;
+  }
+  /** 搜索按钮操作 */
+  handleQuery() {
+    this.listQueryParams.pageNum = 1;
+    if (!this.searchShow) {
+      this.multipleListData = [];
+    }
+    //节流
+    this.resetQueryClick = false;
+    this.getList();
+    this.$forceUpdate();
+  }
+  /** 重置按钮操作 */
+  resetQuery() {
+    for (var searchRule of this.searchRules) {
+      this.$set(searchRule, searchRule.property, undefined);
+    }
+
+    this.resetQueryClick = false;
+    this.resetForm("queryForm");
+    this.handleQuery();
+  }
+  //多表格搜索按钮
+  doubleHandleQuery(index) {
+    this.multiplelistQueryParams[index].pageNum = 1;
+    this.doubleGetList(index, undefined, "doubleListSearch");
+  }
+  doubleResetQuery(index) {
+    for (var searchRule of this.tableSetting[index].searchRules) {
+      this.$set(searchRule, "value", undefined);
+    }
+
+    this.resetForm("queryForm" + index, index);
+    this.doubleHandleQuery(index);
+  }
+  initItemTableField() {
+    var entityName =
+      this.serviceName.charAt(0).toUpperCase() + this.serviceName.slice(1);
+    selectInterfaceSetting({
+      moduleName: this.moduleName,
+      entityName: entityName,
+    }).then((response) => {
+      if (response.data.length == 1) {
+        if (response.data[0].entityItemName) {
+          selectInterfaceSetting({
+            name: response.data[0].entityItemName,
+          }).then((response) => {
+            if (response.data.length == 1) {
+              //设置明细表模块和服务
+              this.tableSetting[0].moduleName = response.data[0].moduleName;
+              this.tableSetting[0].serviceName = response.data[0].entityName;
+              //初始化子表字段
+              initTableField({ interfaceSettingId: response.data[0].id }).then(
+                (response) => {
+                  console.log("初始化明细列表字段");
+                  for (var d of response.data) {
+                    let a = {
+                      setting: "",
+                      width: "",
+                      text: "",
+                      property: "",
+                      visible: "",
+                    };
+                    if (d.setting) {
+                      a.setting = JSON.parse(d.setting);
+                    }
+                    if (d.width) {
+                      a.width = d.width;
+                    }
+                    a.text = d.displayText;
+                    a.property = d.field;
+                    a.visible = d.isShow;
+                    this.tableSetting[0].listColumns.push(a);
+                  }
+                }
+              );
+              console.log(this.tableSetting[0].listColumns);
+            } else {
+              this.msgError("数据错误！");
+            }
+          });
+        }
+      }
+    });
+  }
+}
+</script>
+
+<style scoped>
+.wrapper-container-supplement {
+  min-height: 415px;
+}
+.doubleWrapper {
+  padding: 0;
+  margin-bottom: 0;
+}
+.doublemenu {
+  margin-bottom: 10px;
+  padding-left: 0px !important;
+}
+</style>