cnhis-design-vue 2.1.78 → 2.1.80

package/packages/big-table/src/Fieldset.vue

@@ -1,2067 +1,2067 @@
-<template>
-  <div class="setting-view" ref="settingView">
-    <c-spin :spinning="spinning" :tip="`...`" style="width: 100%; height: 100%">
-      <div class="fields-set-content">
-        <div class="fields-table">
-          <div class="setting-title" :class="{ 'seting-title-api': !isCustomSearch }">
-            <span class="width-show" style="width: 3%">&nbsp;</span>
-            <!-- 字段名称 -->
-            <span class="width-large"> 所有字段 </span>
-            <!-- 编辑 -->
-            <!-- <span v-if="false" class="width-show">
-              <c-checkbox v-if="showCheckBox('isEdit')" :checked="calculateCheck('isEdit')" @change="handleAllCheck($event, 'isEdit')" />
-              编辑
-            </span> -->
-            <!-- 显示 -->
-            <span class="width-show">
-              <c-checkbox v-if="showCheckBox('isShow')" :checked="calculateCheck('isShow')" @change="handleAllCheck($event, 'isShow')" />
-              显示
-            </span>
-            <!-- 排序 -->
-            <span class="width-show">
-              <c-checkbox v-if="showCheckBox('isSort')" :checked="calculateCheck('isSort')" @change="handleAllCheck($event, 'isSort')" />
-              排序
-            </span>
-            <!-- 默认排序 -->
-            <!-- <span class="width-showed">默认排序</span> -->
-            <!-- <slot> -->
-            <!-- 搜索 -->
-            <!-- <span class="width-show">
-                <c-checkbox
-                  v-if="showCheckBox('isSearch')"
-                  :checked="calculateCheck('isSearch')"
-                  @change="handleAllCheck($event, 'isSearch')"
-                />
-                搜索
-              </span> -->
-            <!-- 求和 -->
-            <!-- <span class="width-show" v-if="isCustomSearch">求和</span> -->
-            <!-- 平均值 -->
-            <!-- <span class="width-show" v-if="isCustomSearch">平均值</span> -->
-            <!-- </slot> -->
-            <!-- 固定 -->
-            <span class="width-showed">固定</span>
-            <slot>
-              <!-- 自定义标题 -->
-              <span class="width-word">自定义标题</span>
-            </slot>
-            <!-- 列宽 -->
-            <span class="width-showed">列宽</span>
-            <!-- 部分隐藏 -->
-            <span v-if="false" class="width-word-a">
-              部分隐藏
-              <c-tooltip placement="bottom" :getPopupContainer="triggerNode => triggerNode.parentNode">
-                <template slot="title">
-                  <div class="small-font">
-                    输入框填写内容与要求 <br />
-                    n：隐藏中间n个字符 <br />
-                    L(n)：从左往右第n个位置隐藏 L(n)~(m)：从左往右第n~m个位置隐藏<br />
-                    R(n)：从右往左第n个位置开始前面做隐藏<br />
-                    R(n)~(m)：从右往左第n~m个位置隐藏<br />
-                    说明：n、m为正整数（即1、2、3等）；括号为英文状态下输入项。
-                  </div>
-                </template>
-                <c-icon type="question-circle" />
-              </c-tooltip>
-            </span>
-            <!-- 高级筛选 -->
-            <!-- <span class="width-less">
-              <c-checkbox v-if="showCheckBox('isShowSearch')" :checked="calculateCheck('isShowSearch')" @change="handleAllCheck($event, 'isShowSearch')" />
-              快速检索
-            </span>
-            <span class="width-less"> 筛选外显 </span> -->
-          </div>
-          <div class="set-show" ref="setShow" :class="{ 'set-show-api': !isCustomSearch }">
-            <draggable v-model="fields" animation="150" tag="ul" handle=".drag-icon-wrap">
-              <li
-                class="left-style"
-                :style="{
-                  background: clickItem.sid === ele.sid ? '#f2f2f2' : null
-                }"
-                v-for="(ele, j) in fields"
-                :key="ele.sid"
-                @click="handleFieldClick(ele)"
-              >
-                <span class="width-show drag-icon-wrap">
-                  <c-tooltip :mouseEnterDelay="1">
-                    <template slot="title"> 拖拽调整顺序 </template>
-                    <c-icon type="pause" :rotate="90" />
-                  </c-tooltip>
-                </span>
-                <!-- 字段名称 -->
-                <span class="width-large title-item" :class="{ blue: ele.extraField }">
-                  <!-- <c-tooltip placement="bottom" v-if="showTitleFeildDescribe(ele)">
-                    <template slot="title">
-                      <span>
-                        {{ titleFeildDescribe(ele) }}
-                      </span>
-                    </template>
-                    <c-icon style="margin-right: 6px" type="question-circle" />
-                  </c-tooltip> -->
-                  <span style="width: 14px; margin-right: 6px"></span>
-                  <span>
-                    {{ ele.title }}
-                  </span>
-                </span>
-                <!-- 编辑 -->
-                <!-- <span v-if="false" class="width-show">
-                  <c-checkbox v-show="ele.sid != '0001'" :defaultChecked="ele.isEdit == '1'" :checked="ele.isEdit == '1' ? true : false" @change="onChangeEdit($event, ele, j)"></c-checkbox>
-                </span> -->
-                <!-- 显示 -->
-                <span class="width-show">
-                  <c-checkbox v-show="ele.sid != '0001'" :defaultChecked="ele.isShow == '1'" :checked="ele.isShow == '1' ? true : false" @change="onChangeShow($event, ele, j)"></c-checkbox>
-                </span>
-                <!-- 排序 -->
-                <span class="width-show">
-                  <c-checkbox
-                    v-show="ele.sid != '0001'"
-                    :defaultChecked="ele.isSort == '1'"
-                    :disabled="ele.notParticipatingSort == 1"
-                    :checked="!!ele.isSort"
-                    @change="onChangeSort($event, ele, j)"
-                  ></c-checkbox>
-                </span>
-                <!-- 默认排序 -->
-                <!-- <span class="width-showed">
-                  <select v-show="ele.sid != '0001'" class="is-sort-style" v-model="ele.isOrder" @change="onChangeIsOrder($event, ele, j)" :disabled="ele.notParticipatingSort == 1">
-                    <option value="0">设置排序</option>
-                    <option value="desc">降序</option>
-                    <option value="asc">升序</option>
-                  </select>
-                </span> -->
-                <slot>
-                  <!-- 搜索 -->
-                  <!-- <span class="width-show">
-                    <c-checkbox
-                      v-show="ele.sid != '0001'"
-                      :defaultChecked="ele.isSearch == '1'"
-                      :checked="ele.isSearch == '1' ? true : false"
-                      :disabled="ele.notParticipatingSearch == 1"
-                      @change="onChangeSearch($event, ele)"
-                    ></c-checkbox>
-                    <c-popover placement="rightTop" v-if="ele.relationList && ele.relationList.length > 0">
-                      <template slot="content">
-                        <div class="popver-content">
-                          <template v-for="(v, i) in ele.relationList">
-                            <ul :key="i" class="popver-ul">
-                              <li class="ul-title">{{ v.tableName }}</li>
-                              <li v-for="(m, j) in v.fieldList.fieldList" :key="`${m.sid}${j}`">
-                                <c-checkbox v-show="m.sid != '0001'" v-model="m.checked" :defaultChecked="m.isSearch == '1'">{{ m.title }}</c-checkbox>
-                              </li>
-                            </ul>
-                          </template>
-                        </div>
-                      </template>
-                      <span>
-                        <c-icon type="caret-down" />
-                      </span>
-                    </c-popover>
-                  </span> -->
-                  <!-- 求和 -->
-                  <!-- <span class="width-show" v-if="isCustomSearch">
-                    <c-checkbox v-show="ele.fieldType === 'NUMBER'" :defaultChecked="ele.isSum == '1'" @change="onChangeSum($event, ele)" :disabled="!isCustomSearch"></c-checkbox>
-                  </span> -->
-                  <!-- 平均值 -->
-                  <!-- <span class="width-show" v-if="isCustomSearch">
-                    <c-checkbox v-show="ele.fieldType === 'NUMBER'" :defaultChecked="ele.isAvg == '1'" @change="onChangeAvg($event, ele)" :disabled="!isCustomSearch"></c-checkbox>
-                  </span> -->
-                </slot>
-
-                <!-- 固定 -->
-                <span class="width-showed">
-                  <select class="is-sort-style" v-model="ele.isFixed">
-                    <option :value="0">不固定</option>
-                    <option :value="1">左固定</option>
-                    <option :value="2">右固定</option>
-                  </select>
-                </span>
-                <slot>
-                  <!-- 自定义标题 -->
-                  <span class="width-word">
-                    <input v-show="ele.sid != '0001'" class="alias-style" v-model="ele.alias" />
-                  </span>
-                </slot>
-
-                <!-- 列宽 -->
-                <span class="width-showed">
-                  <input @input="colWidthChange" class="alias-style col-width-style" v-model="ele.colWidth" />
-                </span>
-                <!-- 部分隐藏设置 -->
-                <!-- <span class="width-word-a">
-                  <template v-if="ele.attrType == 'PASSWORD'"> 密码无需设置隐藏 </template>
-                  <template v-else>
-                    <template v-if="ele.columnName !== primaryKey">
-                      <c-input @change="handleHideExpression(ele)" class="alias-style" :class="{ 'error-tip': !ele.expressionFlag }" v-model="ele.hideExpression" />
-                    </template>
-                    <template v-else>
-                      主键不可设置隐藏
-                    </template>
-                  </template>
-                </span> -->
-                <!-- 高级筛选 -->
-                <!-- <span class="width-less">
-                  <c-checkbox
-                    v-show="ele.sid != '0001'"
-                    :defaultChecked="ele.isShowSearch == '1'"
-                    :checked="ele.isShowSearch == '1' ? true : false"
-                    @change="onChangeQuick($event, ele)"
-                    :disabled="ele.notParticipatingSearch == 1"
-                  ></c-checkbox>
-                </span>
-                <span class="width-less">
-                  <c-checkbox
-                    v-show="ele.sid != '0001'"
-                    :defaultChecked="ele.filterExplicit == '1'"
-                    :checked="ele.filterExplicit == '1' ? true : false"
-                    @change="onChangeOutFilter($event, ele)"
-                    :disabled="ele.notParticipatingSearch == 1"
-                  ></c-checkbox>
-                </span> -->
-              </li>
-            </draggable>
-          </div>
-        </div>
-        <div class="check-options">
-          <div v-if="isButtonList && isMiddleAndAdmin" class="buttonList" ref="buttonList">
-            <h2 class="lable-title">按钮/超链接</h2>
-            <div class="linkButton">
-              <span style="margin-right: 50px" v-for="itemButton in buttonList" :key="itemButton.id">
-                <c-checkbox :defaultChecked="itemButton.isShow == '1'" @change="onButtonChecked($event, itemButton)">
-                  {{ itemButton.name }}
-                </c-checkbox>
-              </span>
-            </div>
-          </div>
-
-          <div v-if="false" class="show-setting" ref="showSetting">
-            <h2 class="lable-title">显示设置</h2>
-            <!-- <c-checkbox :checked="showButtonTop == '1'" @change="showSetting($event, 'showButtonTop')">按钮置顶显示</c-checkbox>
-            <c-checkbox :checked="buttonAdaption == '1'" @change="showSetting($event, 'buttonAdaption')">按钮自适应</c-checkbox>
-            <c-checkbox :checked="openOnly == '1'" @change="showSetting($event, 'openOnly')"
-              >字段手风琴<c-tooltip placement="bottom" :getPopupContainer="triggerNode => triggerNode.parentNode" title="只展示一个字段分组">
-                <c-icon style="margin-left:4px;" type="question-circle" /> </c-tooltip
-            ></c-checkbox> -->
-            <slot>
-              <!-- <c-checkbox v-if="isCustomSearch" :checked="asyncCount == '1'" @change="showSetting($event, 'asyncCount')" :disabled="!isCustomSearch">异步统计列表数据</c-checkbox> -->
-              <!-- <c-checkbox :checked="hideCondition == '1'" @change="showSetting($event, 'hideCondition')">隐藏搜索分类</c-checkbox> -->
-              <!-- <c-checkbox :checked="hideSearch == '1'" @change="showSetting($event, 'hideSearch')">隐藏模糊搜索</c-checkbox> -->
-              <!-- <c-checkbox v-show="hasCheckedQuickSearch" :checked="hideQuickSearch == '1'" @change="showSetting($event, 'hideQuickSearch')">隐藏快速搜索</c-checkbox> -->
-              <c-checkbox :checked="tableView.hideBottom" @change="showSetting($event, 'hideBottom')">隐藏底部分页栏</c-checkbox>
-              <!-- <c-checkbox :checked="hideExportBtn == '1'" @change="showSetting($event, 'hideExportBtn')">隐藏导出按钮</c-checkbox> -->
-              <!-- <c-checkbox :checked="tableView.hideSettingBtn" @change="showSetting($event, 'hideSettingBtn')">隐藏齿轮设置按钮</c-checkbox> -->
-              <!-- <c-checkbox v-if="isCustomSearch" :checked="countCondition == '1'" @change="showSetting($event, 'countCondition')">统计筛选分类结果数量</c-checkbox> -->
-            </slot>
-            <template v-if="false">
-              <h2 class="lable-title pagesize-title">分组统计设置</h2>
-              <!-- isShow 1 显示 0 隐藏 -->
-              <c-checkbox v-for="group in groupCountFields" :key="group.key" :value="group.key" :checked="group.isShow == '1'" @change="changeGroupShow($event, group)">
-                {{ group.tips }}
-              </c-checkbox>
-            </template>
-            <template>
-              <h2 class="lable-title pagesize-title">默认分页设置</h2>
-              <c-radio-group name="radioGroup" v-model="pageSize">
-                <c-radio v-for="(item, index) of pageSizeArr" :key="index" :value="item"> {{ item }}条/页 </c-radio>
-                <c-radio :value="pageSizeCustom">
-                  自定义
-                  <c-input-number id="alias-style" v-model="pageSizeCustom" :min="1" :max="300" :precision="0" @change="onChange" />
-                  条/页
-                </c-radio>
-              </c-radio-group>
-            </template>
-            <!-- <slot v-if="isMiddleAndAdmin && saveConfirm">
-              <h2 class="lable-title pagesize-title">授权范围设置</h2>
-              <c-radio-group name="radioGroup" v-model="saveType">
-                <c-radio value="dept">应用于所在部门</c-radio>
-                <c-radio value="org">应用于全部人</c-radio>
-              </c-radio-group>
-            </slot> -->
-          </div>
-          <div class="btn-operate">
-            <!-- <c-button @click="goBack" style="margin-right: 8px">
-              {{ openModal ? '取消' : '返回' }}
-            </c-button> -->
-            <c-button @click="() => $emit('onClose')" style="margin-right: 8px">
-              取消
-            </c-button>
-            <c-button type="primary" @click="handleFieldSave">
-              保存
-            </c-button>
-          </div>
-        </div>
-      </div>
-    </c-spin>
-  </div>
-</template>
-<script>
-import draggable from 'vuedraggable';
-import create from '@/core/create';
-const DEFLAYOUTPCNAME = '资料';
-export default create({
-  name: 'fieldset',
-  props: {
-    // tableId: String,
-    fields: Array,
-    fieldwidths: Object,
-    settingViewData: {
-      type: Object,
-      default: function() {
-        return {};
-      }
-    },
-    settingWidthsPage: {
-      type: Object,
-      default: function() {
-        return {};
-      }
-    },
-    listFormUnionSetting: {
-      type: Object,
-      default: function() {
-        return {};
-      }
-    },
-    menuSource: {
-      type: String,
-      default: ''
-    },
-    settingType: {
-      default: ''
-    },
-    pageLayoutSet: String,
-    curMiddleParams: {
-      type: Object,
-      default: function() {
-        return {};
-      }
-    },
-    openModal: {
-      default: false
-    },
-    drawerDirection: {
-      type: String,
-      default: 'right'
-    }
-  },
-  components: {
-    draggable
-  },
-  data() {
-    return {
-      spinning: false,
-      fieldList: [],
-      primaryKey: '',
-      buttonList: [],
-      settingData: {},
-      isButtonList: null,
-      showButtonTop: 1, // 按钮置顶
-      buttonAdaption: 0, // 按钮自适应
-      asyncCount: 0, // 异步统计列表数据
-      hideCondition: 0, // 隐藏搜索分类
-      hideSearch: 0, // 隐藏模糊搜索
-      hideQuickSearch: 0, // 隐藏快速搜索
-      hideBottom: 0, // 隐藏底部分页栏
-      hideExportBtn: 0, // 隐藏导出按钮
-      hideSettingBtn: 0, // 隐藏齿轮设置按钮
-      countCondition: 1, // 统计筛选分类数量
-      openOnly: 0, // 手风琴模式
-      saveConfirm: false, // 授权范围设置
-      saveType: 'dept', // dept/org 应用于所在部门/应用于全部人
-      showOtherSetting: undefined, // 列表设置按钮
-      tableView: {
-        hideBottom: false // 隐藏底部分页栏
-        // hideSettingBtn: false // 隐藏齿轮设置按钮
-      },
-      pageSizeArr: [5, 10, 20, 30, 50, 100],
-      pageSize: 20,
-      pageSizeCustom: '',
-      viewShow: {},
-      relatedData: {
-        showItems: [],
-        hideItems: [],
-        mbShowItems: [],
-        mbHideItems: []
-      },
-      relatedSetting: null,
-      relatedSettingMobile: null,
-      allWidth: false,
-      halfWidth: false,
-      threeWidth: false,
-      fourWidth: false,
-      visibleLine: false,
-      visibleLineAdd: false,
-      itemTitleName: '',
-      itemTitleNameAdd: '',
-      is_show: 1,
-      editIndex: '',
-      editHideItem: '',
-      editShowItem: '',
-      clickTimes: 0,
-      visibleShowItem: false,
-      isAddChecked: false,
-      itemTitleShowItem: '',
-      count: false,
-      color: '#000000',
-      showColor: false,
-      curColor: '#000000',
-      btnIcon: '', // 按钮icon
-      isShow: '',
-      configId: '',
-      tableName: '',
-      setting: {},
-      settingView: {},
-      settingAbout: {},
-      hideButtonIds: [],
-      viewSid: '',
-      aboutSid: '',
-      mobileAboutSid: '',
-      userTypeTab: '',
-      ViewModalVisible: false,
-      ViewDetail: '', // 视图模板
-      copyFieldList: [],
-      copyRelationTableList: [],
-      copyButtonList: [],
-      viewCongfigList: [], // 视图列表
-      aboutItemList: [], // 相关项
-      mobileAboutItemList: [],
-      defaultViewDetail: {}, // 修改视图传给子组件
-      viewTempType: 'add', // 默认类型
-      relationTableList: [], // '块表查询'
-      pcTmplateList: [], // pc类型所有模板
-      mobileTmplateList: [], // mobile 类型所有模板
-      mobileButtonList: [],
-      viewTypeObj: {
-        type: '',
-        typeTable: '',
-        refString: ''
-      },
-      templateList: [],
-      viewList: [],
-      templateListMobile: [],
-      viewListMobile: [],
-      aboutEditType: 'PC',
-      aboutModel: '',
-      btnSetting: {
-        hideButtons: [],
-        showButtons: []
-      },
-      btnSettingObj: null,
-      btnMobileSetting: {
-        hideButtons: [],
-        showButtons: []
-      },
-      btnMobileSettingObj: null,
-      viewSetVisible: false,
-      middleParams: '',
-      middleListModal: false,
-      modalTitle: '1.9.276',
-      curAboutType: '',
-      curModalType: 'edit',
-      extraField: undefined,
-      isChangeWindow: false,
-      modalWidth: '1280px',
-      modalHeight: '748px',
-      aboutItemPositionPc: 'RIGHT',
-      tabName: '',
-      tabInputName: '',
-      layoutPc: 'TAB',
-      layoutMobile: 'TAB',
-      triggerMethodMobile: 'singleClick',
-      layoutMobileName: '详情',
-      locationPc: 'LEFT',
-      layoutPcName: ' 资料',
-      isCustomSearch: true,
-
-      linkFieldList: [], // link 按钮配置的字段
-      triggerMethodPc: 'doubleClick', // 相关项触发方式
-      triggerMethodField: '', // 相关性触发字段
-      clickItem: {},
-      ratioList: ['2:10', '4:8', '6:6', '8:4', '10:2'],
-      displayRatio: '4:8',
-      remark: '', // 列表备注
-      groupCountFields: [] // 分组统计设置
-    };
-  },
-  watch: {
-    // fieldwidths: {
-    //   handler() {
-    //     this.initfieldwidths();
-    //   },
-    //   immediate: true,
-    //   deep: true
-    // }
-  },
-  mounted() {
-    this.hideTab();
-  },
-  computed: {
-    // ...mapGetters(['userInfo', 'menuObj']),
-    // isOrgAdmin() {
-    //   return this.userInfo.map && this.userInfo.map.sysParams.userType === 'orgAdmin';
-    // },
-    hasCheckedQuickSearch() {
-      let foo = !!this.fieldList.filter(item => item?.isShowSearch === 1).length;
-      return foo;
-    },
-    isMenuSource() {
-      return this.$route.fullPath.includes('middleListDetail');
-    },
-    // 相关项触发字段配置选项
-    triggerMethodFieldList() {
-      return this.fieldList.filter(item => item.isShow == 1 && !this.linkFieldList.includes(item.columnName));
-    },
-
-    isDefinedListConfig() {
-      let queryType = this?.$route?.query?.tableType || '';
-      // let menuType =
-      //   this?.settingViewData?.menuTriggerObjContentObj?.type || "";
-      // 不为空 就是自定义列表
-      let reportType = this?.settingViewData?.menuTriggerObjContentObj?.reportType || '';
-      return queryType == 'DEFINED_TABLE_LIST' || !!reportType;
-    },
-    showTitleFeildDescribe() {
-      return function(ele) {
-        return ele.fieldSetting?.feildDescribe || ele.fieldSetting?.feildDescribeI18n;
-      };
-    },
-    titleFeildDescribe() {
-      return function(ele) {
-        return (ele.fieldSetting.feildDescribeI18n && this.$t(ele.fieldSetting.feildDescribeI18n)) || ele.fieldSetting.feildDescribe;
-      };
-    },
-    isMiddleAndAdmin() {
-      return this.menuSource === 'middle';
-    },
-    handleName() {
-      return function(item, key = 'name') {
-        // if (this.isOrgAdmin && this.menuSource == 'middle') return item[key];
-        return item.alias || item[key];
-      };
-    },
-    handleSetting() {
-      // if (this.showOtherSetting === undefined || this.menuSource == 'middle') {
-      //   return this.isOrgAdmin && this.menuSource !== 'middle' && this.hideSettingBtn != 1;
-      // }
-      return this.showOtherSetting;
-    },
-    havelistFormUnionParamsList() {
-      return !!this.listFormUnionSetting?.paramsList?.length;
-    }
-  },
-  methods: {
-    // initfieldwidths(){
-    //   this.initfieldwidths
-    // },
-    hideTab() {
-      if (this.isMiddleAndAdmin) return;
-
-      if (this.drawerDirection === 'right') {
-        this.$refs['settingView']?.style.setProperty('margin', '-16px 0px 0');
-      } else {
-        this.$refs['settingView']?.style.setProperty('margin', 'auto');
-      }
-      // this.handlePageHeight();
-      /* 非中台，仅展示字段设置的情况下，隐藏tab */
-      // let el = this.$refs["settingView"]?.querySelector(".ant-tabs-bar");
-      // el.style.setProperty("opacity", "0");
-    },
-    saveViewSetting() {
-      this.settingView.showFields = this.viewShow.showFields;
-      if (this.settingViewData != null) {
-        let tableId = this.settingViewData.id || this.settingViewData.tableId;
-        let params = {
-          id: this.viewSid,
-          tableId: tableId,
-          setting: JSON.stringify(this.settingView)
-        };
-        let url = `/tableList/saveViewSetting`;
-        this.spinning = true;
-        this.axios
-          .post(url, this.$qs.stringify(params))
-          .then(({ data }) => {
-            this.spinning = false;
-            if (data) {
-              this.saveMethod(data);
-            }
-          })
-          .catch(() => {
-            this.spinning = false;
-          });
-      }
-    },
-    handleClickSaveSetting() {
-      if (this.isColWidthChange) {
-        this.$confirm({
-          title: this.$t('1.1.7'),
-          content: this.$t('1.9.7'),
-          okText: this.$t('1.9.8'),
-          onOk: () => {
-            this.saveSetting();
-          },
-          onCancel() {}
-        });
-      } else {
-        this.saveSetting();
-      }
-    },
-    handleFieldSave() {
-      let tableFields = [];
-      // let tableView = {};
-      if (this.fields.length > 0) {
-        this.fields.forEach((item, i) => {
-          tableFields.push({
-            id: item.sid, // 字段id
-            field: item.columnName, // 字段名
-            visible: item.isShow == 1, // 是否显示
-            sequence: i, // 顺序位置
-            sortable: item.isSort == 1, // 是否能排序
-            title: item.alias || item.title, // 别名
-            fixed: item.isFixed ? (item.isFixed == 1 ? 'left' : 'right') : '', // 固定位置
-            minWidth: item.colWidth // 列宽
-          });
-        });
-      }
-      // tableView = Object.assign({ pageSize: this.pageSize }, this.tableView);
-      this.$emit('onSave', { tableFields });
-    },
-    saveSetting() {
-      let curRelationList = {};
-      let hideButtonIdsMobile = [];
-      let allExpressionFlag = true;
-      if (this.fieldList.length > 0) {
-        this.fieldList.forEach((item, i) => {
-          let sid = item.sid;
-          if (item.isOrder == '0') {
-            item.isOrder = 0;
-          }
-          if (item.isFixed == '2') {
-            item.isFixed = 2;
-          } else if (item.isFixed == '1') {
-            item.isFixed = 1;
-          } else if (item.isFixed == '0') {
-            item.isFixed = 0;
-          }
-          if (!item.expressionFlag) {
-            allExpressionFlag = false;
-          }
-          // 跨表查询
-          if (item.relationList && item.relationList.length > 0) {
-            item.relationList.forEach(y => {
-              let relationKey = 'relationTable_' + y.tableId;
-              curRelationList[relationKey] = {};
-              y.fieldList.fieldList.forEach(g => {
-                let checkedVal = g.checked ? 1 : 0;
-                curRelationList[relationKey][g.sid] = {
-                  isSearch: checkedVal,
-                  isShowSearch: checkedVal
-                };
-              });
-            });
-          }
-          this.setting[sid] = {
-            id: item.sid,
-            title: item.title,
-            isShow: item.isShow,
-            sequence: i,
-            isSearch: item.isSearch,
-            isSort: item.isSort,
-            isSum: item.isSum,
-            isAvg: item.isAvg,
-            alias: item.alias,
-            isFixed: item.isFixed,
-            isOrder: item.isOrder,
-            isEdit: item.isEdit,
-            colWidth: item.colWidth,
-            isShowSearch: item.isShowSearch,
-            filterExplicit: item.filterExplicit,
-            hideExpression: item.hideExpression
-          };
-        });
-        this.buttonList.forEach(item => {
-          if (item.isShow == '0') {
-            this.hideButtonIds.push(item.sid);
-          }
-        });
-        this.mobileButtonList.forEach(v => {
-          !v.isShow && hideButtonIdsMobile.push(v.sid);
-        });
-      }
-      if (!allExpressionFlag) {
-        this.$message.error(this.$t('1.9.9'));
-        return;
-      }
-      if (this.settingViewData != null) {
-        let tableId = this.settingViewData.id || this.settingViewData.tableId;
-        // 分组统计
-        let groupCountFields = this.groupCountFields
-          .map(item => {
-            if (item.isShow == 1) {
-              return item.key;
-            }
-            return null;
-          })
-          .filter(Boolean);
-        this.setting[tableId] = {
-          hideButtonIds: this.hideButtonIds,
-          hideButtonIdsMobile: hideButtonIdsMobile,
-          pageSize: this.pageSize,
-          showButtonTop: this.showButtonTop,
-          buttonAdaption: this.buttonAdaption,
-          openOnly: this.openOnly,
-          asyncCount: this.asyncCount,
-          hideSearch: this.hideSearch,
-          hideCondition: this.hideCondition,
-          hideQuickSearch: this.hideQuickSearch,
-          hideBottom: this.hideBottom,
-          hideExportBtn: this.hideExportBtn,
-          hideSettingBtn: this.hideSettingBtn,
-          triggerMethodPc: this.triggerMethodPc, // 相关项触发方式
-          triggerMethodField: this.triggerMethodField, // 相关性触发字段
-          countCondition: this.countCondition,
-          groupCountFieldShowKeys: groupCountFields
-        };
-        Object.assign(this.setting, curRelationList);
-        let params = {
-          configId: this.configId,
-          tableId: this.settingViewData.id || this.settingViewData.tableId,
-          // type: this.settingViewData.tableType || this.settingViewData.type,
-          saveType: this.saveConfirm ? this.saveType : '', // 授权范围设置
-          setting: JSON.stringify(this.setting),
-          type:
-            this.$route.query.tableType === 'DEFINED_TABLE_LIST' || this.menuObj.reportType === 'definedListConfig' ? 'definedListConfig' : this.settingViewData.tableType || this.settingViewData.type
-        };
-        let url = `/tableList/saveSetting`;
-        this.spinning = true;
-        this.axios
-          .post(url, this.$qs.stringify(params))
-          .then(({ data }) => {
-            this.spinning = false;
-            if (data) {
-              // 字段设置可配置筛选项开关，所以要更新 copyFieldList
-              this.copyFieldList.forEach(item => {
-                const field = this.setting[item.id];
-                field && Object.assign(item, field);
-              });
-              this.saveMethod(data);
-            }
-          })
-          .catch(() => {
-            this.spinning = false;
-          });
-      }
-    },
-    handleOkLineAdd() {
-      this.viewShow.showFields.push({
-        name: this.itemTitleNameAdd,
-        is_show: this.is_show,
-        html_type: 'LINEBAR'
-      });
-      this.visibleLineAdd = false;
-    },
-    onChangeAdd(e) {
-      if (e.target.checked == true) {
-        this.is_show = 1;
-      } else {
-        this.is_show = 0;
-      }
-    },
-    onChangeAddEdit() {
-      if (this.isAddChecked == true) {
-        this.viewShow.showFields[this.editIndex].is_show = 1;
-      } else {
-        this.viewShow.showFields[this.editIndex].is_show = 0;
-      }
-    },
-    addItemShowLine() {
-      this.visibleLineAdd = true;
-      this.itemTitleNameAdd = '';
-      this.is_show = 0;
-      this.isAddChecked = false;
-    },
-    handleCancel() {
-      this.visibleLine = false;
-      this.visibleLineAdd = false;
-    },
-    handleOkLine() {
-      this.visibleLine = false;
-      this.viewShow.showFields[this.editIndex].name = this.itemTitleName;
-      this.viewShow.showFields[this.editIndex].is_show = this.isAddChecked ? 1 : 0;
-    },
-    editItemLine(ele, i) {
-      this.editIndex = i;
-      this.visibleLine = true;
-      this.itemTitleName = ele.name;
-      if (ele.is_show == 1) {
-        this.isAddChecked = true;
-      } else {
-        this.isAddChecked = false;
-      }
-    },
-    removeItemLine(index) {
-      this.viewShow.showFields.splice(index, 1);
-    },
-    removeSpanWidth(index) {
-      this.viewShow.hideFields.unshift(this.viewShow.showFields[index]);
-      this.viewShow.showFields.splice(index, 1);
-    },
-    initSetting() {
-      /* 字段设置 */
-      if (this.settingViewData != null) {
-        let menuId = this.settingViewData.menuId;
-        let tableId = this.settingViewData.id || this.settingViewData.tableId;
-        let tableTeamId = this.settingViewData.tableTeamId;
-        let tableTeamMark = this.settingViewData.tableTeamMark;
-        let type = this.settingViewData.tableType || this.settingViewData.type;
-        let extendParams = this.settingViewData.extendParams || {};
-        if (type == 'REPORT' || type == 'TABLE_LIST') {
-          type = 'TABLE_LIST';
-        } else if (type == 'TABLE_TEAM') {
-          type = 'TABLE_TEAM_TABLE';
-        }
-        const isMiddle = this.isMenuSource;
-        let url = this.isMenuSource ? `/tableList/getMiddleDetail` : `/tableList/getDetail`;
-        // if (this.$route.path.includes("middle")) {
-        //   url = "/tableList/getDetail";
-        // }
-        if (this.$route.query.tableType === 'DEFINED_TABLE_LIST' || this.menuObj.reportType === 'definedListConfig') {
-          type = 'definedListConfig';
-        }
-        let idKey = 'tableId';
-        let params = {
-          [idKey]: tableId,
-          tableType: type,
-          menuId: menuId,
-          tableTeamId: tableTeamId,
-          tableTeamMark: tableTeamMark,
-          tabChildId: this.settingViewData.tabChildId || undefined,
-          is_setting: '1',
-          classify: 'PC',
-          ...(isMiddle ? {} : extendParams)
-        };
-        /* 页签模式下的参数设置为空 */
-        if (this.pageLayoutSet == 3) {
-          params.tableTeamId = '';
-          params.tableTeamMark = '';
-          params.menuId = '';
-        }
-        if (!isMiddle) {
-          this.middleParams = params;
-        }
-        if (isMiddle && this.openModal) {
-          Object.assign(params, this.curMiddleParams);
-        }
-        this.setSpinning(true);
-        this.axios
-          .get(url, {
-            params
-          })
-          .then(({ data }) => {
-            this.setSpinning(false);
-            if (data.result == 'SUCCESS') {
-              let {
-                buttonList = [],
-                buttonListMobile = [],
-                fieldList = [],
-                relationTableList = [],
-                templateList = [],
-                viewList = [],
-                templateListMobile = [],
-                viewListMobile = [],
-                pageSize = 20,
-                configId,
-                tableName,
-                extraField,
-                primaryKey,
-                isCustomSearch = true,
-                displayRatio = '4:8',
-                remark = '',
-                groupCountFields = []
-              } = data.map;
-              let linkFieldList = []; // link按钮字段集合
-              this.isCustomSearch = isCustomSearch;
-              this.isRefreshStatus = false;
-              this.extraField = extraField;
-              this.configId = configId;
-              this.templateList = templateList || []; // 列表视图
-              this.viewList = viewList || [];
-              this.templateListMobile = templateListMobile || []; // 列表视图
-              this.viewListMobile = viewListMobile || [];
-              this.tableName = tableName;
-              this.remark = remark;
-              this.primaryKey = primaryKey; // 字段主键
-              this.groupCountFields = groupCountFields; // 分组统计设置
-
-              // 复制一份
-              this.copyFieldList = JSON.parse(JSON.stringify(fieldList));
-              this.copyButtonList = JSON.parse(JSON.stringify(buttonList));
-              this.displayRatio = displayRatio;
-              buttonList.forEach(v => {
-                if (v.type == 'LINK') {
-                  linkFieldList.push(v.name);
-                }
-              });
-              this.$set(this, 'linkFieldList', linkFieldList);
-
-              this.copyRelationTableList = JSON.parse(JSON.stringify(relationTableList));
-              this.fieldList = fieldList.map(item => {
-                return Object.assign(item, {
-                  key: item.id,
-                  hideExpression: item.hideExpression || '',
-                  expressionFlag: true,
-                  settingObj: item.settingObj || {}
-                });
-              });
-
-              this.fieldList.forEach((it, index) => {
-                if (this.settingWidthsPage && Object.keys(this.settingWidthsPage).length > 0) {
-                  // 当前表单项宽度赋值
-                  this.fieldList[index].colWidth = this.settingWidthsPage[this.fieldList[index].alias || this.fieldList[index].title];
-                }
-                if (it.isOrder == '') {
-                  it.isOrder = 0;
-                }
-                let relationList = [];
-                relationTableList.forEach(el => {
-                  if (el.primaryField == it.columnName) {
-                    relationList.push(el);
-                  }
-                  el.fieldList.fieldList.forEach(e => {
-                    e.checked = e.isSearch == 1;
-                  });
-                });
-                it.fieldSetting = it.fieldSetting ? JSON.parse(it.fieldSetting) : '';
-                let notParticipatingSort = it.fieldSetting?.notParticipatingSort || '';
-                let notParticipatingSearch = it.fieldSetting?.notParticipatingSearch || '';
-                this.$set(it, 'relationList', relationList);
-                this.$set(it, 'notParticipatingSort', notParticipatingSort);
-                this.$set(it, 'notParticipatingSearch', notParticipatingSearch);
-                this.$set(it, 'attrType', it?.settingObj?.attr || '');
-              });
-              // 增加一个后台过滤
-              this.fieldList = this.fieldList.filter(item => {
-                return item.fieldSetting ? item.fieldSetting.isHide === '0' : true;
-              });
-
-              if (this.configId == 'null' || this.configId == 'undefined') {
-                this.configId = '';
-              }
-              buttonListMobile.forEach(v => (v.isShow = v.isShow == '1' ? true : false));
-              this.mobileButtonList = buttonListMobile;
-              this.buttonList = buttonList;
-              this.showButtonTop = data.map.showButtonTop; // 按钮置顶
-              this.buttonAdaption = data.map.buttonAdaption; // 按钮自适应
-
-              this.asyncCount = data.map.asyncCount || 0; // 异步统计列表数据
-              this.hideSearch = data.map.hideSearch || 0; // 隐藏模糊搜索
-              this.hideCondition = data.map.hideCondition || 0; // 隐藏模糊搜索
-              this.hideQuickSearch = data.map.hideQuickSearch || 0; // 隐藏快速搜索
-              this.hideBottom = data.map.hideBottom || 0; // 隐藏底部分页栏
-              this.hideExportBtn = data.map.hideExportBtn || 0; // 隐藏导出按钮
-              this.hideSettingBtn = data.map.hideSettingBtn || 0; // 隐藏齿轮设置按钮
-              this.countCondition = data.map.countCondition; // 是否开启筛选统计分类数量
-              this.showOtherSetting = data.map.showOtherSetting; // 列表设置按钮
-              this.saveConfirm = data.map.saveConfirm; // 授权范围设置
-
-              this.openOnly = data.map.openOnly || 0; // 手风琴模式
-              this.pageSize = pageSize == +pageSize ? +pageSize : 20;
-              if (!this.pageSizeArr.includes(this.pageSize)) {
-                // 用户自定义分页条数
-                this.pageSizeCustom = this.pageSize;
-              }
-              if (this.buttonList && this.buttonList.length > 0) {
-                this.isButtonList = true;
-              } else {
-                this.isButtonList = false;
-              }
-              this.$nextTick(() => {
-                this.handlePageHeight();
-              });
-            } else {
-              this.$message.error(data.resultMsg);
-            }
-          });
-      }
-    },
-    // 设置高度
-    handlePageHeight() {
-      let settingViewHieht = (this.$refs.settingView && this.$refs.settingView.offsetHeight) || 200;
-      let showSettingHeight = (this.$refs.showSetting && this.$refs.showSetting.offsetHeight) || 0;
-      let buttonListHeight = (this.$refs.buttonList && this.$refs.buttonList.offsetHeight) || 0;
-      // 45/tabBar height 8/tabBar margin  52/tableCell height 49/btn height
-      let MinusHeight = 45 + 8 + 52 + 49;
-      let setShowHeight = settingViewHieht - showSettingHeight - buttonListHeight - MinusHeight;
-      let resultHeight = setShowHeight > 100 ? setShowHeight : 100;
-      if (this.$refs.setShow) {
-        this.$refs.setShow.style.maxHeight = resultHeight + 'px';
-        this.$refs.setShow.style.height = resultHeight + 'px';
-      }
-    },
-    initAboutSetting() {
-      let tableId = this.settingViewData.id || this.settingViewData.tableId;
-      let urlAbout = this.isMenuSource ? `/tableList/getAboutItemMiddleSetting` : `/tableList/getAboutItemSetting`;
-      let params = {
-        tableId: tableId,
-        tableType: this.$route.query.tableType === 'DEFINED_TABLE_LIST' || this.menuObj.reportType === 'definedListConfig' ? 'definedListConfig' : null
-      };
-      this.axios.get(urlAbout, { params }).then(({ data }) => {
-        if (data.result == 'SUCCESS') {
-          let { setting = {}, settingMobile = {} } = data.map;
-          this.relatedSetting = setting;
-          this.relatedSettingMobile = settingMobile;
-          let pcList = [
-            {
-              k: 'layoutPc', // key
-              v: 'TAB' // 默认值
-            },
-            {
-              k: 'locationPc',
-              v: 'LEFT'
-            },
-            {
-              k: 'triggerMethodPc',
-              v: 'doubleClick'
-            },
-            {
-              k: 'triggerMethodField',
-              v: undefined
-            },
-            {
-              k: 'layoutPcName',
-              v: DEFLAYOUTPCNAME
-            },
-            {
-              k: 'aboutItemPositionPc',
-              v: 'RIGHT'
-            },
-            {
-              k: 'tabName',
-              v: ''
-            },
-            {
-              k: 'tabInputName',
-              v: ''
-            }
-          ];
-          this.aboutItemList = setting.showItems;
-          this.aboutSid = setting.sid;
-          if (setting.aboutItemPositionPc == 'TAB' && setting.tabName && setting.tabName != 'INPUT' && setting.tabName.includes('table.')) {
-            setting.tabName = setting.tabName.split('.')[1];
-          }
-          pcList.forEach(p => {
-            this[p.k] = setting[p.k] || p.v;
-          });
-
-          this.mobileAboutItemList = settingMobile.showItems;
-          this.mobileAboutSid = settingMobile.mbSid;
-
-          let mbList = [
-            { k: 'layoutMobile', v: 'TAB' },
-            { k: 'layoutMobileName', V: '详情' },
-            { k: 'triggerMethodMobile', v: 'singleClick' }
-          ];
-
-          mbList.forEach(p => {
-            this[p.k] = settingMobile[p.k] || p.v;
-          });
-        }
-      });
-    },
-    handleRelateChange() {
-      let { layoutPc, locationPc, aboutItemPositionPc, layoutPcName, triggerMethodField, triggerMethodPc, tabName, tabInputName } = this.relatedSetting;
-      this.aboutItemPositionPc = aboutItemPositionPc || 'RIGHT';
-      this.tabName = tabName || '';
-      this.tabInputName = tabInputName || '';
-      this.layoutPc = layoutPc || 'TAB';
-      this.layoutMobile = this.relatedSettingMobile.layoutMobile || 'TAB';
-      this.layoutMobileName = this.relatedSettingMobile.layoutMobileName;
-      this.triggerMethodMobile = this.relatedSettingMobile.triggerMethodMobile || 'singleClick';
-      this.locationPc = locationPc || 'LEFT';
-      this.layoutPcName = layoutPcName || DEFLAYOUTPCNAME;
-      this.triggerMethodField = triggerMethodField || this.triggerMethodField || 'doubleClick';
-      this.triggerMethodPc = triggerMethodPc || this.triggerMethodPc;
-    },
-    aboutItemPosition(e) {
-      let { value = 'RIGHT' } = e?.target || {};
-      if (value === 'BOTTOM') {
-        this.layoutPc = 'TAB';
-      }
-      if (value === 'TAB') {
-        this.tabName = (this.fieldList.length && this.fieldList[0].columnName) || 'INPUT';
-      }
-      if (value !== 'TAB') {
-        this.tabName = '';
-        this.tabInputName = '';
-      }
-    },
-    changeTabName(val) {
-      if (val !== 'INPUT') {
-        this.tabInputName && (this.tabInputName = '');
-      }
-    },
-    onChangeShow(e, ele, j) {
-      if (e.target.checked == true) {
-        ele.isShow = 1;
-      } else {
-        ele.isShow = 0;
-      }
-      // this.handleSetfieldTracher(ele, j);
-    },
-    onChangeEdit(e, ele, j) {
-      if (e.target.checked == true) {
-        ele.isEdit = 1;
-      } else {
-        ele.isEdit = 0;
-      }
-      // this.handleSetfieldTracher(ele, j);
-    },
-    // 搜索checkbox-change事件
-    onChangeSearch(e, ele) {
-      if (e.target.checked == true) {
-        ele.isSearch = 1;
-        if (ele.filterExplicit !== 1) {
-          // 勾选搜索并且没有勾选筛选外显时勾选高级筛选
-          ele.isShowSearch = 1;
-        }
-      } else {
-        ele.isSearch = 0;
-      }
-    },
-    onChangeSort(e, ele, j) {
-      if (e.target.checked == true) {
-        ele.isSort = 1;
-      } else {
-        ele.isSort = 0;
-      }
-      // this.handleSetfieldTracher(ele, j);
-    },
-    onChangeSum(e, ele) {
-      if (e.target.checked == true) {
-        ele.isSum = 1;
-      } else {
-        ele.isSum = 0;
-      }
-    },
-    onChangeAvg(e, ele) {
-      if (e.target.checked == true) {
-        ele.isAvg = 1;
-      } else {
-        ele.isAvg = 0;
-      }
-    },
-    onChangeFixed(e, ele) {
-      if (e.target.checked == true) {
-        ele.isFixed = 1;
-      } else {
-        ele.isFixed = 0;
-      }
-    },
-    onChangeQuick(e, ele) {
-      if (e.target.checked == true) {
-        ele.isShowSearch = 1;
-        // ele.filterExplicit = 0;
-      } else {
-        ele.isShowSearch = 0;
-        ele.filterExplicit = 0;
-      }
-    },
-    onChangeOutFilter(e, ele) {
-      if (e.target.checked == true) {
-        ele.filterExplicit = 1;
-        ele.isShowSearch = 1;
-      } else {
-        // ele.isShowSearch = 1;
-        ele.filterExplicit = 0;
-      }
-    },
-
-    onButtonChecked(e, itemButton) {
-      if (e.target.checked == true) {
-        itemButton.isShow = 1;
-      } else {
-        itemButton.isShow = 0;
-      }
-    },
-
-    showSetting(e, v) {
-      this.tableView[v] = e.target.checked;
-
-      // 埋点
-      // this.$_handleTracherLog('列表显示设置', {
-      //   列表ID: this.settingViewData.id || this.settingViewData.tableId,
-      //   列表名称: this.tableName || this.$attrs?.tableName || '',
-      //   设置项: v,
-      //   设置值: this[v]
-      // });
-    },
-    changeGroupShow(e, group) {
-      let value = e.target.checked ? '1' : '0';
-      group.isShow = value;
-    },
-    handlerChangeRadios(e, i) {
-      this.testData.forEach((el, j) => {
-        if (i !== j) {
-          el.select = '0';
-        }
-      });
-    },
-    handleChangeTem() {},
-    // 添加视图
-    handlerAddView(data = {}) {
-      let { type, typeTable, refString } = data;
-      this.viewTypeObj = {
-        type,
-        typeTable,
-        refString
-      };
-      this.defaultViewDetail = {};
-      // this.ViewModalVisible = true;
-      this.viewSetVisible = true;
-    },
-    saveDefault(val) {
-      this.spinning = val;
-    },
-
-    // 修改视图
-    handlerEditView(data = {}) {
-      let { type, typeTable, refString, curData, defaultMark } = data;
-      this.viewTypeObj = {
-        type,
-        typeTable,
-        refString,
-        defaultMark
-      };
-      this.defaultViewDetail = curData || {};
-      this.viewSetVisible = true;
-      // 修改
-      this.viewTempType = 'edit';
-    },
-    // 刷新
-    handlerRefresh() {
-      this.hanlderRefreshTable();
-    },
-    hanlderRefreshTable() {
-      this.initSetting();
-      this.$emit('reload');
-    },
-    setSpinning(val) {
-      this.spinning = val;
-    },
-    saveMethod(data) {
-      if (data.result == 'SUCCESS') {
-        this.$message.success(this.$t('1.6.6'));
-        if (this.menuSource === 'middle') {
-          if (this.openModal) {
-            // this.$router.go(-1);
-            // return;
-            this.$emit('middleCancel');
-            this.$emit('emitMethod');
-            return;
-          }
-        }
-        this.emitMethod();
-      } else {
-        this.$message.error(this.$t('1.4.2.9'));
-      }
-    },
-    emitMethod() {
-      this.$emit('reload');
-      this.$emit('reloadPage');
-      this.$emit('onCloseSetting');
-    },
-    handleHideExpression(item) {
-      if (item.hideExpression) {
-        item.expressionFlag = /(^\d+$)|(^[L,l,R,r]\(\d+\)(~\(\d+\))?$)/.test(item.hideExpression);
-      } else {
-        item.expressionFlag = true;
-      }
-    },
-    handleRequestedBtnSet() {
-      let url = this.isMenuSource ? `/tableList/getMiddleButtonSetting` : `/tableList/getButtonSetting`;
-      this.axios
-        .get(url, {
-          params: {
-            tableId: this.settingViewData.id || this.settingViewData.tableId,
-            tableType: this.$route.query.tableType === 'DEFINED_TABLE_LIST' || this.menuObj.reportType === 'definedListConfig' ? 'definedListConfig' : null
-          }
-        })
-        .then(({ data }) => {
-          if (data.result === 'SUCCESS') {
-            let { map = {} } = data;
-            this.btnSettingObj = map.setting;
-            this.btnMobileSettingObj = map.settingMobile;
-            // this.setting = map.setting;
-            // this.settingMobile = map.settingMob`ile;
-            this.btnSetting.hideButtons = map.setting.hideButtons || [];
-            this.btnSetting.showButtons = map.setting.showButtons || [];
-            this.btnSetting.sid = map.setting.sid;
-            this.btnMobileSetting.hideButtons = map.settingMobile.hideButtons || [];
-            this.btnMobileSetting.showButtons = map.settingMobile.showButtons || [];
-            this.btnMobileSetting.sid = map.settingMobile.sid;
-          }
-        })
-        .catch(err => {
-          console.log(err);
-        });
-    },
-    handleMoveBtn(ele, index, type) {
-      let tpList = type.split('-');
-      this.aboutEditType = tpList[0];
-      this.aboutModel = 'btn-' + tpList[1];
-      let { btnSetting = {}, btnMobileSetting } = this;
-      this.clickTimes++;
-      if (this.clickTimes == 2) {
-        this.modalTitle = '1.9.276';
-        this.curAboutType = ele.type || '';
-        this.visibleShowItem = true;
-        this.itemTitleShowItem = ele.name;
-        this.btnIcon = ele.style;
-        this.clickTimes = 0;
-      }
-      setTimeout(() => {
-        if (this.clickTimes == 1) {
-          if (tpList[1] == 'show') {
-            if (tpList[0] == 'PC') {
-              btnSetting.hideButtons.push(...btnSetting.showButtons.splice(index, 1));
-            } else {
-              btnMobileSetting.hideButtons.push(...btnMobileSetting.showButtons.splice(index, 1));
-            }
-          } else {
-            if (tpList[0] == 'PC') {
-              btnSetting.showButtons.push(...btnSetting.hideButtons.splice(index, 1));
-            } else {
-              btnMobileSetting.showButtons.push(...btnMobileSetting.hideButtons.splice(index, 1));
-            }
-          }
-
-          this.clickTimes = 0;
-        }
-      }, 300);
-    },
-    saveBtnSetItem(type = 'PC') {
-      let { btnSetting = {}, btnMobileSetting = {} } = this;
-      let isPc = type === 'PC';
-      let settingAbout = {};
-      let mapBtnList = (list = []) =>
-        list.map(v => {
-          return {
-            id: v.sid,
-            name: v.name,
-            icon: v.icon
-          };
-        });
-
-      if (isPc) {
-        settingAbout.hideButtons = mapBtnList(btnSetting.hideButtons);
-        settingAbout.showButtons = mapBtnList(btnSetting.showButtons);
-      } else {
-        settingAbout.hideButtons = mapBtnList(btnMobileSetting.hideButtons);
-        settingAbout.showButtons = mapBtnList(btnMobileSetting.showButtons);
-      }
-      let params = {
-        id: isPc ? this.btnSetting.sid : this.btnMobileSetting.sid,
-        tableId: this.settingViewData.id || this.settingViewData.tableId,
-        setting: JSON.stringify(settingAbout),
-        classify: type
-      };
-      let url = `/tableList/saveButtonSetting`;
-      this.spinning = true;
-      this.axios
-        .post(url, this.$qs.stringify(params))
-        .then(({ data }) => {
-          this.spinning = false;
-          if (data) {
-            this.saveMethod(data);
-          }
-        })
-        .catch(() => {
-          this.spinning = false;
-        });
-    },
-    colWidthChange() {
-      this.isColWidthChange = true;
-    },
-    goMiddleListDetail() {
-      // let id = data.id || data.tableId;
-      // this.setModalOpenMiddle(1);
-      this.modalWidth = '1280px';
-      this.middleListModal = true;
-    },
-    middleCancel() {
-      this.setModalOpenMiddle('');
-      this.modalWidth = '1280px';
-      this.modalHeight = '748px';
-      this.isChangeWindow = false;
-      this.middleListModal = false;
-    },
-    goBack(refresh = false) {
-      if (this.openModal) {
-        if (refresh) {
-          this.$emit('emitMethod');
-        }
-        this.middleCancel();
-        this.$emit('middleCancel');
-      } else {
-        // this.$router.go(-1);
-        this.$router.push({
-          path: '/middleList',
-          query: { keywords: this.$route.query.keywords }
-        });
-      }
-    },
-
-    getRefreshStatus() {
-      this.isRefreshStatus = true;
-    },
-
-    async tabsOnChange(activeKey) {
-      switch (activeKey) {
-        case 'expandfields':
-          this.isRefreshStatus = false;
-          break;
-        case 'fieldList':
-          if (this.isRefreshStatus) {
-            this.initSetting();
-          }
-          break;
-        case '2':
-          if (this.$utils.isEmpty(this.btnSettingObj)) {
-            this.handleRequestedBtnSet();
-          }
-          break;
-        case '3':
-          if (this.$utils.isEmpty(this.relatedSetting)) {
-            this.initAboutSetting();
-          }
-          break;
-        default:
-          break;
-      }
-    },
-    openColor() {
-      this.showColor = true;
-      this.curColor = this.color || '#000000';
-    },
-    handleOkColor(val) {
-      this.color = val;
-      this.showColor = false;
-    },
-    closeColor(val) {
-      this.showColor = val;
-    },
-    changeModalWindow() {
-      this.isChangeWindow = !this.isChangeWindow;
-      let docHeight = document.body.clientHeight;
-      this.modalWidth = this.modalWidth === '1280px' ? `100%` : '1280px';
-      this.modalHeight = this.modalHeight === '748px' ? `${docHeight - 55}px` : '748px';
-      this.$nextTick(() => {
-        this.$refs.ListDetail?.handlePageHeight();
-      });
-    },
-    getContainer() {
-      // fix safari浏览器兼容
-      return document.body;
-    },
-    getAboutContainer() {
-      return document.getElementsByClassName('setting-tabs-about')[0];
-    },
-    showCheckBox(key) {
-      return this.fields.some(i => Object.prototype.hasOwnProperty.call(i, key));
-    },
-    calculateCheck(key) {
-      if (!this.fields.length) return false;
-      return this.fields.every(i => {
-        if (!Object.prototype.hasOwnProperty.call(i, key)) return true;
-        return i[key];
-      });
-    },
-    handleAllCheck(e, key) {
-      const value = e.target.checked ? 1 : 0;
-      this.fields.forEach(i => {
-        if (Object.prototype.hasOwnProperty.call(i, key)) {
-          i[key] = value;
-        }
-        return i;
-      });
-      this.fields = [].concat(this.fields);
-    },
-    hanldeSaveAboutItem() {
-      this.saveSetting();
-    },
-    handleFieldClick(item) {
-      this.clickItem = item;
-    },
-
-    // // 修改默认排序
-    // onChangeIsOrder(e, item, j) {
-    //   this.handleSetfieldTracher(item, j);
-    // },
-
-    // // 修改固定
-    // onChangeIsFixed(e, item, j) {
-    //   this.handleSetfieldTracher(item, j);
-    // },
-
-    // //
-    // colWidthChangeOnBlur(e, item, j) {
-    //   this.handleSetfieldTracher(item, j);
-    // },
-
-    // handleSetfieldTracher(item, i) {
-    //   try {
-    //     // 埋点
-    //     this.$_handleTracherLog('列表字段设置', {
-    //       列表ID: this.settingViewData.id || this.settingViewData.tableId,
-    //       列表名称: this.tableName || this.$attrs?.tableName || '',
-    //       字段: item.title,
-    //       显示: item.isShow,
-    //       排序: item.isSort,
-    //       默认排序: item.isOrder,
-    //       固定: item.isFixed,
-    //       列宽: item.colWidth,
-    //       顺序位置: i
-    //     });
-    //   } catch (error) {
-    //     console.log(error);
-    //   }
-    // },
-    // 选择上下显示比列
-    changeRatio(e) {
-      this.displayRatio = e;
-    },
-    // 自定义表格的条数
-    onChange(val) {
-      if (val > 300) {
-        this.$message.error('分页数不能超过300条/页');
-      }
-      if (!val) {
-        this.pageSizeCustom = undefined;
-        this.pageSize = 1;
-      } else {
-        this.pageSize = val;
-      }
-    },
-    visibleEditCheckbox(ele) {
-      let find = this.listFormUnionSetting?.paramsList?.find(item => item.tableField === ele.columnName);
-      return ele.sid != '0001' && find;
-    }
-  }
-});
-</script>
-<style scoped lang="less">
-ul {
-  margin: 0;
-  padding: 0;
-}
-
-.fields-set-content {
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-  .fields-table {
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-    overflow: auto;
-  }
-}
-.new-name {
-  display: inline-block;
-  width: 10%;
-  text-align: left;
-}
-.new-name-input {
-  width: 90%;
-  margin-bottom: 10px;
-}
-.name-new-change {
-  margin: 15px 0px 0px 40px;
-}
-/deep/ .ant-tabs {
-  padding: 0 16px;
-  .ant-tabs-nav-scroll {
-    text-align: left;
-  }
-  .ant-tabs-content {
-    text-align: left;
-  }
-  .ant-tabs-bar {
-    margin-bottom: 8px;
-  }
-  &.setting-tabs {
-    color: #7587af;
-    .ant-tabs-bar {
-      border-bottom: unset;
-    }
-    .ant-tabs-nav {
-      transition: none;
-    }
-    .ant-tabs-tab {
-      padding-bottom: unset;
-      > span {
-        display: inline-flex;
-        flex-direction: column;
-        justify-content: flex-start;
-        align-items: center;
-        > i {
-          margin-right: 0;
-        }
-      }
-    }
-    .ant-tabs-ink-bar,
-    .ant-tabs-ink-bar-animated {
-      display: none !important;
-    }
-    &.setting-tabs-about {
-      .location {
-        span {
-          margin-right: 8px;
-        }
-      }
-      .location + .location {
-        margin-top: 6px;
-      }
-    }
-  }
-}
-
-.setting-view {
-  height: 100%;
-  position: relative;
-  /deep/ .ant-spin-container {
-    width: 100%;
-    height: 100%;
-  }
-  .settingview-tabs {
-    position: relative;
-    padding: 0;
-    /* 非中台，仅展示字段设置的情况下，隐藏tab */
-    &.settingview-only {
-      /deep/ .ant-tabs-bar {
-        opacity: 0;
-        pointer-events: none;
-        .ant-tabs-tab-btn-disabled {
-          cursor: default;
-        }
-      }
-    }
-  }
-  &.no-padding {
-    height: 100%;
-    padding-bottom: 0;
-  }
-  .setting-wrap {
-    position: absolute;
-    top: 12px;
-    right: 16px;
-    color: #212121 !important;
-
-    cursor: pointer;
-    > div {
-      display: inline-block;
-    }
-  }
-  .setting-title {
-    background: #f2f2f4;
-    border: 1px solid #f2f2f2;
-    height: 52px;
-    line-height: 52px;
-    span {
-      display: inline-block;
-    }
-    &.seting-title-api {
-      .width-large {
-        width: 15%;
-      }
-    }
-  }
-  .set-show {
-    min-height: 100px;
-    overflow-y: auto;
-    &.set-show-api {
-      .width-large {
-        width: 15%;
-      }
-    }
-
-    .left-style.sortable-chosen {
-      background: #fafafa;
-      box-shadow: 0px 0px 10px 0px #d5d5d5;
-    }
-
-    li {
-      padding: 5px 0;
-      display: flex;
-      align-items: center;
-      border-bottom: 1px solid #e8e8e8;
-      height: 52px;
-      line-height: 52px;
-    }
-    .alias-style {
-      outline: none;
-      border-radius: 4px 4px 4px 4px;
-      border: solid 1px #d5d5d5;
-      height: 32px;
-      text-indent: 16px;
-      color: #38454f;
-      width: 100%;
-    }
-    .is-sort-style {
-      outline: none;
-      border-radius: 4px 4px 4px 4px;
-      border: solid 1px #d5d5d5;
-      height: 32px;
-      text-indent: 6px;
-      color: #38454f;
-      width: 87px;
-      margin-right: 5px;
-      &:disabled {
-        cursor: not-allowed;
-        background: #f5f5f5;
-      }
-    }
-    .col-width-style {
-      width: 70px;
-    }
-    .title-item {
-      display: inline-flex;
-      justify-content: flex-start;
-      align-items: center;
-      text-align: left;
-      > span {
-        display: inline-block;
-        max-width: calc(100% - 20px);
-        overflow: hidden;
-        white-space: nowrap;
-        text-overflow: ellipsis;
-      }
-    }
-  }
-  .alias-style {
-    outline: none;
-    border-radius: 4px 4px 4px 4px;
-    border: solid 1px rgba(212, 222, 229, 1);
-    height: 32px;
-    text-indent: 16px;
-    color: #38454f;
-  }
-  .buttonList {
-    padding-bottom: 24px;
-    padding-bottom: 20px;
-    border-bottom: 1px solid #d5d5d5;
-  }
-  .show-setting {
-    padding-top: 24px;
-    padding-bottom: 16px;
-    /deep/.ant-checkbox-wrapper {
-      margin-left: 0;
-      margin-right: 8px;
-    }
-  }
-  .btn-operate {
-    border-top: 1px solid #d5d5d5;
-    padding: 12px 0 4px;
-  }
-  .lable-title {
-    color: #000000;
-    margin-bottom: 11px;
-    font-size: 16px;
-    cursor: pointer;
-    &.pagesize-title {
-      margin-top: 20px;
-      border-top: 1px solid #d5d5d5;
-      padding-top: 14px;
-    }
-  }
-
-  .view-model-input {
-    margin: 5px 0;
-  }
-  .left-show-part {
-    padding-right: 20px;
-    border-right: 1px solid rgb(205, 197, 211);
-    height: 748px;
-    overflow-y: auto;
-    .show-content-header {
-      cursor: pointer;
-      height: 30px;
-      line-height: 30px;
-      border-bottom: 1px dashed #eee;
-      margin-bottom: 10px;
-      .left-item-height {
-        height: 748px;
-      }
-      .show-content-headerOperate {
-        float: right;
-        color: #428bca;
-        cursor: pointer;
-      }
-    }
-
-    .show-field-style {
-      border: 1px solid rgb(205, 197, 211);
-      background: #fdfdfd;
-      height: 40px;
-      line-height: 40px;
-      margin: 0px 10px 10px 0px;
-      padding-left: 8px;
-      color: #5585f5;
-      border-radius: 5px;
-      .show-filed-edit {
-        float: right;
-        select {
-          outline: none;
-          border-radius: 4px 4px 4px 4px;
-          border: solid 1px rgba(212, 222, 229, 1);
-          height: 28px;
-          text-indent: 7px;
-          color: #38454f;
-          width: 60px;
-          margin-right: 2px;
-        }
-        button {
-          height: 28px;
-          margin-right: 2px;
-          text-align: center;
-        }
-      }
-    }
-  }
-
-  .right-hide-part {
-    height: 800px;
-    overflow-y: auto;
-    .titleHide {
-      height: 30px;
-      line-height: 30px;
-      font-size: 18px;
-      border-bottom: 1px solid #eee;
-      margin-bottom: 20px;
-    }
-    padding: 5px;
-    .hide-field-style {
-      border: 1px solid rgb(205, 197, 211);
-      background: #fdfdfd;
-      height: 40px;
-      line-height: 40px;
-      margin: 0px 10px 10px 10px;
-      padding-left: 8px;
-      border-radius: 5px;
-      height: 100%;
-    }
-  }
-  .line-style {
-    padding-bottom: 6px;
-    border-bottom: 1px dashed #ccc;
-    overflow: hidden;
-    padding-left: 8px;
-    height: 40px;
-    line-height: 40px;
-    margin: 0px 0px 10px 0px;
-    .line-edit-style {
-      float: right;
-      button {
-        margin-right: 5px;
-      }
-    }
-  }
-
-  .row-style {
-    margin: 6px 0;
-    .inner-show {
-      margin: 0px 3px;
-      border: 1px solid #ccc;
-      border-radius: 5px;
-      padding-left: 12px;
-      height: 40px;
-      line-height: 40px;
-      .row-lable-style {
-        float: left;
-        margin-right: 5px;
-      }
-      .row-edit {
-        float: right;
-        .row-select-style {
-          outline: none;
-          border-radius: 4px 4px 4px 4px;
-          border: solid 1px #d4dee5;
-          height: 32px;
-          text-indent: 3px;
-          color: #38454f;
-          width: 55px;
-          float: left;
-          margin-top: 3px;
-          margin-right: 5px;
-        }
-        .row-button-style {
-          float: right;
-          margin-top: 3px;
-          margin-right: 3px;
-          width: 50px;
-          padding-left: 7px;
-        }
-      }
-    }
-  }
-
-  .related-items {
-    .list-head {
-      height: 30px;
-      line-height: 30px;
-      // border-bottom: thin solid #ccc;
-      margin-bottom: 10px;
-    }
-    label {
-      display: inline-block;
-      max-width: 100%;
-      margin-bottom: 5px;
-      margin-right: 10px;
-      font-weight: 700;
-    }
-    .text-muted {
-      color: #777;
-    }
-    li {
-      position: relative;
-      display: inline-block;
-      padding: 6px;
-      margin-right: 8px;
-      border: 1px dashed #ccc;
-      margin-bottom: 8px;
-      &.homepage-li {
-        border-style: solid;
-      }
-      .close-btn {
-        position: absolute;
-        top: -6px;
-        right: -6px;
-        font-size: 12px;
-        background: #fff;
-        color: #cfcfcf;
-        cursor: pointer;
-        &:hover {
-          color: #8c8c8c;
-        }
-      }
-    }
-  }
-  .view-about {
-    height: 300px;
-    overflow-y: auto;
-    border: thin solid #d2d9e8;
-    padding: 16px;
-    margin-bottom: 16px;
-  }
-  .allWidth {
-    width: 100%;
-  }
-  .halfWidth {
-    width: 50%;
-  }
-  .threeWidth {
-    width: 33.33%;
-  }
-  .fourWidth {
-    width: 25%;
-  }
-  .width-less {
-    display: inline-block;
-    width: 5%;
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-  }
-  .width-show {
-    display: inline-block;
-    width: 4.5%;
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-  }
-  .drag-icon-wrap {
-    width: 3%;
-    cursor: pointer;
-    text-align: center;
-  }
-  .width-showed {
-    display: inline-block;
-    width: 9%;
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-  }
-  .width-word {
-    display: inline-block;
-    width: 10%;
-    line-height: 52px;
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    padding-right: 8px;
-  }
-  .width-word-a {
-    display: inline-block;
-    width: 12%;
-    line-height: 52px;
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    padding-right: 8px;
-  }
-  .width-large {
-    display: inline-block;
-    width: 10%;
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-  }
-
-  .button-is-up {
-    margin-right: 5px;
-  }
-  .tip-color {
-    font-weight: 500;
-    color: yellow;
-    line-height: 1.5;
-  }
-
-  .error-tip {
-    border: 1px solid red !important;
-  }
-  .small-font {
-    font-size: 12px;
-    line-height: 1.5;
-    p {
-      padding: 0;
-      margin: 0;
-    }
-  }
-  .show-ratio {
-    /deep/ .ant-select {
-      width: 200px;
-    }
-    /deep/.ant-select-selection--single {
-      height: 26px;
-    }
-    /deep/ .ant-select-selection__rendered {
-      line-height: 24px;
-    }
-  }
-}
-</style>
-<style>
-.popver-content {
-  height: 400px;
-  overflow: hidden;
-  overflow-y: auto;
-}
-.popver-ul {
-  margin-bottom: 10px;
-}
-.ul-title {
-  font-size: 14px;
-  font-weight: 400;
-  color: rgba(145, 159, 190, 1);
-  line-height: 20px;
-}
-</style>
+<template>
+  <div class="setting-view" ref="settingView">
+    <c-spin :spinning="spinning" :tip="`...`" style="width: 100%; height: 100%">
+      <div class="fields-set-content">
+        <div class="fields-table">
+          <div class="setting-title" :class="{ 'seting-title-api': !isCustomSearch }">
+            <span class="width-show" style="width: 3%">&nbsp;</span>
+            <!-- 字段名称 -->
+            <span class="width-large"> 所有字段 </span>
+            <!-- 编辑 -->
+            <!-- <span v-if="false" class="width-show">
+              <c-checkbox v-if="showCheckBox('isEdit')" :checked="calculateCheck('isEdit')" @change="handleAllCheck($event, 'isEdit')" />
+              编辑
+            </span> -->
+            <!-- 显示 -->
+            <span class="width-show">
+              <c-checkbox v-if="showCheckBox('isShow')" :checked="calculateCheck('isShow')" @change="handleAllCheck($event, 'isShow')" />
+              显示
+            </span>
+            <!-- 排序 -->
+            <span class="width-show">
+              <c-checkbox v-if="showCheckBox('isSort')" :checked="calculateCheck('isSort')" @change="handleAllCheck($event, 'isSort')" />
+              排序
+            </span>
+            <!-- 默认排序 -->
+            <!-- <span class="width-showed">默认排序</span> -->
+            <!-- <slot> -->
+            <!-- 搜索 -->
+            <!-- <span class="width-show">
+                <c-checkbox
+                  v-if="showCheckBox('isSearch')"
+                  :checked="calculateCheck('isSearch')"
+                  @change="handleAllCheck($event, 'isSearch')"
+                />
+                搜索
+              </span> -->
+            <!-- 求和 -->
+            <!-- <span class="width-show" v-if="isCustomSearch">求和</span> -->
+            <!-- 平均值 -->
+            <!-- <span class="width-show" v-if="isCustomSearch">平均值</span> -->
+            <!-- </slot> -->
+            <!-- 固定 -->
+            <span class="width-showed">固定</span>
+            <slot>
+              <!-- 自定义标题 -->
+              <span class="width-word">自定义标题</span>
+            </slot>
+            <!-- 列宽 -->
+            <span class="width-showed">列宽</span>
+            <!-- 部分隐藏 -->
+            <span v-if="false" class="width-word-a">
+              部分隐藏
+              <c-tooltip placement="bottom" :getPopupContainer="triggerNode => triggerNode.parentNode">
+                <template slot="title">
+                  <div class="small-font">
+                    输入框填写内容与要求 <br />
+                    n：隐藏中间n个字符 <br />
+                    L(n)：从左往右第n个位置隐藏 L(n)~(m)：从左往右第n~m个位置隐藏<br />
+                    R(n)：从右往左第n个位置开始前面做隐藏<br />
+                    R(n)~(m)：从右往左第n~m个位置隐藏<br />
+                    说明：n、m为正整数（即1、2、3等）；括号为英文状态下输入项。
+                  </div>
+                </template>
+                <c-icon type="question-circle" />
+              </c-tooltip>
+            </span>
+            <!-- 高级筛选 -->
+            <!-- <span class="width-less">
+              <c-checkbox v-if="showCheckBox('isShowSearch')" :checked="calculateCheck('isShowSearch')" @change="handleAllCheck($event, 'isShowSearch')" />
+              快速检索
+            </span>
+            <span class="width-less"> 筛选外显 </span> -->
+          </div>
+          <div class="set-show" ref="setShow" :class="{ 'set-show-api': !isCustomSearch }">
+            <draggable v-model="fields" animation="150" tag="ul" handle=".drag-icon-wrap">
+              <li
+                class="left-style"
+                :style="{
+                  background: clickItem.sid === ele.sid ? '#f2f2f2' : null
+                }"
+                v-for="(ele, j) in fields"
+                :key="ele.sid"
+                @click="handleFieldClick(ele)"
+              >
+                <span class="width-show drag-icon-wrap">
+                  <c-tooltip :mouseEnterDelay="1">
+                    <template slot="title"> 拖拽调整顺序 </template>
+                    <c-icon type="pause" :rotate="90" />
+                  </c-tooltip>
+                </span>
+                <!-- 字段名称 -->
+                <span class="width-large title-item" :class="{ blue: ele.extraField }">
+                  <!-- <c-tooltip placement="bottom" v-if="showTitleFeildDescribe(ele)">
+                    <template slot="title">
+                      <span>
+                        {{ titleFeildDescribe(ele) }}
+                      </span>
+                    </template>
+                    <c-icon style="margin-right: 6px" type="question-circle" />
+                  </c-tooltip> -->
+                  <span style="width: 14px; margin-right: 6px"></span>
+                  <span>
+                    {{ ele.title }}
+                  </span>
+                </span>
+                <!-- 编辑 -->
+                <!-- <span v-if="false" class="width-show">
+                  <c-checkbox v-show="ele.sid != '0001'" :defaultChecked="ele.isEdit == '1'" :checked="ele.isEdit == '1' ? true : false" @change="onChangeEdit($event, ele, j)"></c-checkbox>
+                </span> -->
+                <!-- 显示 -->
+                <span class="width-show">
+                  <c-checkbox v-show="ele.sid != '0001'" :defaultChecked="ele.isShow == '1'" :checked="ele.isShow == '1' ? true : false" @change="onChangeShow($event, ele, j)"></c-checkbox>
+                </span>
+                <!-- 排序 -->
+                <span class="width-show">
+                  <c-checkbox
+                    v-show="ele.sid != '0001'"
+                    :defaultChecked="ele.isSort == '1'"
+                    :disabled="ele.notParticipatingSort == 1"
+                    :checked="!!ele.isSort"
+                    @change="onChangeSort($event, ele, j)"
+                  ></c-checkbox>
+                </span>
+                <!-- 默认排序 -->
+                <!-- <span class="width-showed">
+                  <select v-show="ele.sid != '0001'" class="is-sort-style" v-model="ele.isOrder" @change="onChangeIsOrder($event, ele, j)" :disabled="ele.notParticipatingSort == 1">
+                    <option value="0">设置排序</option>
+                    <option value="desc">降序</option>
+                    <option value="asc">升序</option>
+                  </select>
+                </span> -->
+                <slot>
+                  <!-- 搜索 -->
+                  <!-- <span class="width-show">
+                    <c-checkbox
+                      v-show="ele.sid != '0001'"
+                      :defaultChecked="ele.isSearch == '1'"
+                      :checked="ele.isSearch == '1' ? true : false"
+                      :disabled="ele.notParticipatingSearch == 1"
+                      @change="onChangeSearch($event, ele)"
+                    ></c-checkbox>
+                    <c-popover placement="rightTop" v-if="ele.relationList && ele.relationList.length > 0">
+                      <template slot="content">
+                        <div class="popver-content">
+                          <template v-for="(v, i) in ele.relationList">
+                            <ul :key="i" class="popver-ul">
+                              <li class="ul-title">{{ v.tableName }}</li>
+                              <li v-for="(m, j) in v.fieldList.fieldList" :key="`${m.sid}${j}`">
+                                <c-checkbox v-show="m.sid != '0001'" v-model="m.checked" :defaultChecked="m.isSearch == '1'">{{ m.title }}</c-checkbox>
+                              </li>
+                            </ul>
+                          </template>
+                        </div>
+                      </template>
+                      <span>
+                        <c-icon type="caret-down" />
+                      </span>
+                    </c-popover>
+                  </span> -->
+                  <!-- 求和 -->
+                  <!-- <span class="width-show" v-if="isCustomSearch">
+                    <c-checkbox v-show="ele.fieldType === 'NUMBER'" :defaultChecked="ele.isSum == '1'" @change="onChangeSum($event, ele)" :disabled="!isCustomSearch"></c-checkbox>
+                  </span> -->
+                  <!-- 平均值 -->
+                  <!-- <span class="width-show" v-if="isCustomSearch">
+                    <c-checkbox v-show="ele.fieldType === 'NUMBER'" :defaultChecked="ele.isAvg == '1'" @change="onChangeAvg($event, ele)" :disabled="!isCustomSearch"></c-checkbox>
+                  </span> -->
+                </slot>
+
+                <!-- 固定 -->
+                <span class="width-showed">
+                  <select class="is-sort-style" v-model="ele.isFixed">
+                    <option :value="0">不固定</option>
+                    <option :value="1">左固定</option>
+                    <option :value="2">右固定</option>
+                  </select>
+                </span>
+                <slot>
+                  <!-- 自定义标题 -->
+                  <span class="width-word">
+                    <input v-show="ele.sid != '0001'" class="alias-style" v-model="ele.alias" />
+                  </span>
+                </slot>
+
+                <!-- 列宽 -->
+                <span class="width-showed">
+                  <input @input="colWidthChange" class="alias-style col-width-style" v-model="ele.colWidth" />
+                </span>
+                <!-- 部分隐藏设置 -->
+                <!-- <span class="width-word-a">
+                  <template v-if="ele.attrType == 'PASSWORD'"> 密码无需设置隐藏 </template>
+                  <template v-else>
+                    <template v-if="ele.columnName !== primaryKey">
+                      <c-input @change="handleHideExpression(ele)" class="alias-style" :class="{ 'error-tip': !ele.expressionFlag }" v-model="ele.hideExpression" />
+                    </template>
+                    <template v-else>
+                      主键不可设置隐藏
+                    </template>
+                  </template>
+                </span> -->
+                <!-- 高级筛选 -->
+                <!-- <span class="width-less">
+                  <c-checkbox
+                    v-show="ele.sid != '0001'"
+                    :defaultChecked="ele.isShowSearch == '1'"
+                    :checked="ele.isShowSearch == '1' ? true : false"
+                    @change="onChangeQuick($event, ele)"
+                    :disabled="ele.notParticipatingSearch == 1"
+                  ></c-checkbox>
+                </span>
+                <span class="width-less">
+                  <c-checkbox
+                    v-show="ele.sid != '0001'"
+                    :defaultChecked="ele.filterExplicit == '1'"
+                    :checked="ele.filterExplicit == '1' ? true : false"
+                    @change="onChangeOutFilter($event, ele)"
+                    :disabled="ele.notParticipatingSearch == 1"
+                  ></c-checkbox>
+                </span> -->
+              </li>
+            </draggable>
+          </div>
+        </div>
+        <div class="check-options">
+          <div v-if="isButtonList && isMiddleAndAdmin" class="buttonList" ref="buttonList">
+            <h2 class="lable-title">按钮/超链接</h2>
+            <div class="linkButton">
+              <span style="margin-right: 50px" v-for="itemButton in buttonList" :key="itemButton.id">
+                <c-checkbox :defaultChecked="itemButton.isShow == '1'" @change="onButtonChecked($event, itemButton)">
+                  {{ itemButton.name }}
+                </c-checkbox>
+              </span>
+            </div>
+          </div>
+
+          <div v-if="false" class="show-setting" ref="showSetting">
+            <h2 class="lable-title">显示设置</h2>
+            <!-- <c-checkbox :checked="showButtonTop == '1'" @change="showSetting($event, 'showButtonTop')">按钮置顶显示</c-checkbox>
+            <c-checkbox :checked="buttonAdaption == '1'" @change="showSetting($event, 'buttonAdaption')">按钮自适应</c-checkbox>
+            <c-checkbox :checked="openOnly == '1'" @change="showSetting($event, 'openOnly')"
+              >字段手风琴<c-tooltip placement="bottom" :getPopupContainer="triggerNode => triggerNode.parentNode" title="只展示一个字段分组">
+                <c-icon style="margin-left:4px;" type="question-circle" /> </c-tooltip
+            ></c-checkbox> -->
+            <slot>
+              <!-- <c-checkbox v-if="isCustomSearch" :checked="asyncCount == '1'" @change="showSetting($event, 'asyncCount')" :disabled="!isCustomSearch">异步统计列表数据</c-checkbox> -->
+              <!-- <c-checkbox :checked="hideCondition == '1'" @change="showSetting($event, 'hideCondition')">隐藏搜索分类</c-checkbox> -->
+              <!-- <c-checkbox :checked="hideSearch == '1'" @change="showSetting($event, 'hideSearch')">隐藏模糊搜索</c-checkbox> -->
+              <!-- <c-checkbox v-show="hasCheckedQuickSearch" :checked="hideQuickSearch == '1'" @change="showSetting($event, 'hideQuickSearch')">隐藏快速搜索</c-checkbox> -->
+              <c-checkbox :checked="tableView.hideBottom" @change="showSetting($event, 'hideBottom')">隐藏底部分页栏</c-checkbox>
+              <!-- <c-checkbox :checked="hideExportBtn == '1'" @change="showSetting($event, 'hideExportBtn')">隐藏导出按钮</c-checkbox> -->
+              <!-- <c-checkbox :checked="tableView.hideSettingBtn" @change="showSetting($event, 'hideSettingBtn')">隐藏齿轮设置按钮</c-checkbox> -->
+              <!-- <c-checkbox v-if="isCustomSearch" :checked="countCondition == '1'" @change="showSetting($event, 'countCondition')">统计筛选分类结果数量</c-checkbox> -->
+            </slot>
+            <template v-if="false">
+              <h2 class="lable-title pagesize-title">分组统计设置</h2>
+              <!-- isShow 1 显示 0 隐藏 -->
+              <c-checkbox v-for="group in groupCountFields" :key="group.key" :value="group.key" :checked="group.isShow == '1'" @change="changeGroupShow($event, group)">
+                {{ group.tips }}
+              </c-checkbox>
+            </template>
+            <template>
+              <h2 class="lable-title pagesize-title">默认分页设置</h2>
+              <c-radio-group name="radioGroup" v-model="pageSize">
+                <c-radio v-for="(item, index) of pageSizeArr" :key="index" :value="item"> {{ item }}条/页 </c-radio>
+                <c-radio :value="pageSizeCustom">
+                  自定义
+                  <c-input-number id="alias-style" v-model="pageSizeCustom" :min="1" :max="300" :precision="0" @change="onChange" />
+                  条/页
+                </c-radio>
+              </c-radio-group>
+            </template>
+            <!-- <slot v-if="isMiddleAndAdmin && saveConfirm">
+              <h2 class="lable-title pagesize-title">授权范围设置</h2>
+              <c-radio-group name="radioGroup" v-model="saveType">
+                <c-radio value="dept">应用于所在部门</c-radio>
+                <c-radio value="org">应用于全部人</c-radio>
+              </c-radio-group>
+            </slot> -->
+          </div>
+          <div class="btn-operate">
+            <!-- <c-button @click="goBack" style="margin-right: 8px">
+              {{ openModal ? '取消' : '返回' }}
+            </c-button> -->
+            <c-button @click="() => $emit('onClose')" style="margin-right: 8px">
+              取消
+            </c-button>
+            <c-button type="primary" @click="handleFieldSave">
+              保存
+            </c-button>
+          </div>
+        </div>
+      </div>
+    </c-spin>
+  </div>
+</template>
+<script>
+import draggable from 'vuedraggable';
+import create from '@/core/create';
+const DEFLAYOUTPCNAME = '资料';
+export default create({
+  name: 'fieldset',
+  props: {
+    // tableId: String,
+    fields: Array,
+    fieldwidths: Object,
+    settingViewData: {
+      type: Object,
+      default: function() {
+        return {};
+      }
+    },
+    settingWidthsPage: {
+      type: Object,
+      default: function() {
+        return {};
+      }
+    },
+    listFormUnionSetting: {
+      type: Object,
+      default: function() {
+        return {};
+      }
+    },
+    menuSource: {
+      type: String,
+      default: ''
+    },
+    settingType: {
+      default: ''
+    },
+    pageLayoutSet: String,
+    curMiddleParams: {
+      type: Object,
+      default: function() {
+        return {};
+      }
+    },
+    openModal: {
+      default: false
+    },
+    drawerDirection: {
+      type: String,
+      default: 'right'
+    }
+  },
+  components: {
+    draggable
+  },
+  data() {
+    return {
+      spinning: false,
+      fieldList: [],
+      primaryKey: '',
+      buttonList: [],
+      settingData: {},
+      isButtonList: null,
+      showButtonTop: 1, // 按钮置顶
+      buttonAdaption: 0, // 按钮自适应
+      asyncCount: 0, // 异步统计列表数据
+      hideCondition: 0, // 隐藏搜索分类
+      hideSearch: 0, // 隐藏模糊搜索
+      hideQuickSearch: 0, // 隐藏快速搜索
+      hideBottom: 0, // 隐藏底部分页栏
+      hideExportBtn: 0, // 隐藏导出按钮
+      hideSettingBtn: 0, // 隐藏齿轮设置按钮
+      countCondition: 1, // 统计筛选分类数量
+      openOnly: 0, // 手风琴模式
+      saveConfirm: false, // 授权范围设置
+      saveType: 'dept', // dept/org 应用于所在部门/应用于全部人
+      showOtherSetting: undefined, // 列表设置按钮
+      tableView: {
+        hideBottom: false // 隐藏底部分页栏
+        // hideSettingBtn: false // 隐藏齿轮设置按钮
+      },
+      pageSizeArr: [5, 10, 20, 30, 50, 100],
+      pageSize: 20,
+      pageSizeCustom: '',
+      viewShow: {},
+      relatedData: {
+        showItems: [],
+        hideItems: [],
+        mbShowItems: [],
+        mbHideItems: []
+      },
+      relatedSetting: null,
+      relatedSettingMobile: null,
+      allWidth: false,
+      halfWidth: false,
+      threeWidth: false,
+      fourWidth: false,
+      visibleLine: false,
+      visibleLineAdd: false,
+      itemTitleName: '',
+      itemTitleNameAdd: '',
+      is_show: 1,
+      editIndex: '',
+      editHideItem: '',
+      editShowItem: '',
+      clickTimes: 0,
+      visibleShowItem: false,
+      isAddChecked: false,
+      itemTitleShowItem: '',
+      count: false,
+      color: '#000000',
+      showColor: false,
+      curColor: '#000000',
+      btnIcon: '', // 按钮icon
+      isShow: '',
+      configId: '',
+      tableName: '',
+      setting: {},
+      settingView: {},
+      settingAbout: {},
+      hideButtonIds: [],
+      viewSid: '',
+      aboutSid: '',
+      mobileAboutSid: '',
+      userTypeTab: '',
+      ViewModalVisible: false,
+      ViewDetail: '', // 视图模板
+      copyFieldList: [],
+      copyRelationTableList: [],
+      copyButtonList: [],
+      viewCongfigList: [], // 视图列表
+      aboutItemList: [], // 相关项
+      mobileAboutItemList: [],
+      defaultViewDetail: {}, // 修改视图传给子组件
+      viewTempType: 'add', // 默认类型
+      relationTableList: [], // '块表查询'
+      pcTmplateList: [], // pc类型所有模板
+      mobileTmplateList: [], // mobile 类型所有模板
+      mobileButtonList: [],
+      viewTypeObj: {
+        type: '',
+        typeTable: '',
+        refString: ''
+      },
+      templateList: [],
+      viewList: [],
+      templateListMobile: [],
+      viewListMobile: [],
+      aboutEditType: 'PC',
+      aboutModel: '',
+      btnSetting: {
+        hideButtons: [],
+        showButtons: []
+      },
+      btnSettingObj: null,
+      btnMobileSetting: {
+        hideButtons: [],
+        showButtons: []
+      },
+      btnMobileSettingObj: null,
+      viewSetVisible: false,
+      middleParams: '',
+      middleListModal: false,
+      modalTitle: '1.9.276',
+      curAboutType: '',
+      curModalType: 'edit',
+      extraField: undefined,
+      isChangeWindow: false,
+      modalWidth: '1280px',
+      modalHeight: '748px',
+      aboutItemPositionPc: 'RIGHT',
+      tabName: '',
+      tabInputName: '',
+      layoutPc: 'TAB',
+      layoutMobile: 'TAB',
+      triggerMethodMobile: 'singleClick',
+      layoutMobileName: '详情',
+      locationPc: 'LEFT',
+      layoutPcName: ' 资料',
+      isCustomSearch: true,
+
+      linkFieldList: [], // link 按钮配置的字段
+      triggerMethodPc: 'doubleClick', // 相关项触发方式
+      triggerMethodField: '', // 相关性触发字段
+      clickItem: {},
+      ratioList: ['2:10', '4:8', '6:6', '8:4', '10:2'],
+      displayRatio: '4:8',
+      remark: '', // 列表备注
+      groupCountFields: [] // 分组统计设置
+    };
+  },
+  watch: {
+    // fieldwidths: {
+    //   handler() {
+    //     this.initfieldwidths();
+    //   },
+    //   immediate: true,
+    //   deep: true
+    // }
+  },
+  mounted() {
+    this.hideTab();
+  },
+  computed: {
+    // ...mapGetters(['userInfo', 'menuObj']),
+    // isOrgAdmin() {
+    //   return this.userInfo.map && this.userInfo.map.sysParams.userType === 'orgAdmin';
+    // },
+    hasCheckedQuickSearch() {
+      let foo = !!this.fieldList.filter(item => item?.isShowSearch === 1).length;
+      return foo;
+    },
+    isMenuSource() {
+      return this.$route.fullPath.includes('middleListDetail');
+    },
+    // 相关项触发字段配置选项
+    triggerMethodFieldList() {
+      return this.fieldList.filter(item => item.isShow == 1 && !this.linkFieldList.includes(item.columnName));
+    },
+
+    isDefinedListConfig() {
+      let queryType = this?.$route?.query?.tableType || '';
+      // let menuType =
+      //   this?.settingViewData?.menuTriggerObjContentObj?.type || "";
+      // 不为空 就是自定义列表
+      let reportType = this?.settingViewData?.menuTriggerObjContentObj?.reportType || '';
+      return queryType == 'DEFINED_TABLE_LIST' || !!reportType;
+    },
+    showTitleFeildDescribe() {
+      return function(ele) {
+        return ele.fieldSetting?.feildDescribe || ele.fieldSetting?.feildDescribeI18n;
+      };
+    },
+    titleFeildDescribe() {
+      return function(ele) {
+        return (ele.fieldSetting.feildDescribeI18n && this.$t(ele.fieldSetting.feildDescribeI18n)) || ele.fieldSetting.feildDescribe;
+      };
+    },
+    isMiddleAndAdmin() {
+      return this.menuSource === 'middle';
+    },
+    handleName() {
+      return function(item, key = 'name') {
+        // if (this.isOrgAdmin && this.menuSource == 'middle') return item[key];
+        return item.alias || item[key];
+      };
+    },
+    handleSetting() {
+      // if (this.showOtherSetting === undefined || this.menuSource == 'middle') {
+      //   return this.isOrgAdmin && this.menuSource !== 'middle' && this.hideSettingBtn != 1;
+      // }
+      return this.showOtherSetting;
+    },
+    havelistFormUnionParamsList() {
+      return !!this.listFormUnionSetting?.paramsList?.length;
+    }
+  },
+  methods: {
+    // initfieldwidths(){
+    //   this.initfieldwidths
+    // },
+    hideTab() {
+      if (this.isMiddleAndAdmin) return;
+
+      if (this.drawerDirection === 'right') {
+        this.$refs['settingView']?.style.setProperty('margin', '-16px 0px 0');
+      } else {
+        this.$refs['settingView']?.style.setProperty('margin', 'auto');
+      }
+      // this.handlePageHeight();
+      /* 非中台，仅展示字段设置的情况下，隐藏tab */
+      // let el = this.$refs["settingView"]?.querySelector(".ant-tabs-bar");
+      // el.style.setProperty("opacity", "0");
+    },
+    saveViewSetting() {
+      this.settingView.showFields = this.viewShow.showFields;
+      if (this.settingViewData != null) {
+        let tableId = this.settingViewData.id || this.settingViewData.tableId;
+        let params = {
+          id: this.viewSid,
+          tableId: tableId,
+          setting: JSON.stringify(this.settingView)
+        };
+        let url = `/tableList/saveViewSetting`;
+        this.spinning = true;
+        this.axios
+          .post(url, this.$qs.stringify(params))
+          .then(({ data }) => {
+            this.spinning = false;
+            if (data) {
+              this.saveMethod(data);
+            }
+          })
+          .catch(() => {
+            this.spinning = false;
+          });
+      }
+    },
+    handleClickSaveSetting() {
+      if (this.isColWidthChange) {
+        this.$confirm({
+          title: this.$t('1.1.7'),
+          content: this.$t('1.9.7'),
+          okText: this.$t('1.9.8'),
+          onOk: () => {
+            this.saveSetting();
+          },
+          onCancel() {}
+        });
+      } else {
+        this.saveSetting();
+      }
+    },
+    handleFieldSave() {
+      let tableFields = [];
+      // let tableView = {};
+      if (this.fields.length > 0) {
+        this.fields.forEach((item, i) => {
+          tableFields.push({
+            id: item.sid, // 字段id
+            field: item.columnName, // 字段名
+            visible: item.isShow == 1, // 是否显示
+            sequence: i, // 顺序位置
+            sortable: item.isSort == 1, // 是否能排序
+            title: item.alias || item.title, // 别名
+            fixed: item.isFixed ? (item.isFixed == 1 ? 'left' : 'right') : '', // 固定位置
+            minWidth: item.colWidth // 列宽
+          });
+        });
+      }
+      // tableView = Object.assign({ pageSize: this.pageSize }, this.tableView);
+      this.$emit('onSave', { tableFields });
+    },
+    saveSetting() {
+      let curRelationList = {};
+      let hideButtonIdsMobile = [];
+      let allExpressionFlag = true;
+      if (this.fieldList.length > 0) {
+        this.fieldList.forEach((item, i) => {
+          let sid = item.sid;
+          if (item.isOrder == '0') {
+            item.isOrder = 0;
+          }
+          if (item.isFixed == '2') {
+            item.isFixed = 2;
+          } else if (item.isFixed == '1') {
+            item.isFixed = 1;
+          } else if (item.isFixed == '0') {
+            item.isFixed = 0;
+          }
+          if (!item.expressionFlag) {
+            allExpressionFlag = false;
+          }
+          // 跨表查询
+          if (item.relationList && item.relationList.length > 0) {
+            item.relationList.forEach(y => {
+              let relationKey = 'relationTable_' + y.tableId;
+              curRelationList[relationKey] = {};
+              y.fieldList.fieldList.forEach(g => {
+                let checkedVal = g.checked ? 1 : 0;
+                curRelationList[relationKey][g.sid] = {
+                  isSearch: checkedVal,
+                  isShowSearch: checkedVal
+                };
+              });
+            });
+          }
+          this.setting[sid] = {
+            id: item.sid,
+            title: item.title,
+            isShow: item.isShow,
+            sequence: i,
+            isSearch: item.isSearch,
+            isSort: item.isSort,
+            isSum: item.isSum,
+            isAvg: item.isAvg,
+            alias: item.alias,
+            isFixed: item.isFixed,
+            isOrder: item.isOrder,
+            isEdit: item.isEdit,
+            colWidth: item.colWidth,
+            isShowSearch: item.isShowSearch,
+            filterExplicit: item.filterExplicit,
+            hideExpression: item.hideExpression
+          };
+        });
+        this.buttonList.forEach(item => {
+          if (item.isShow == '0') {
+            this.hideButtonIds.push(item.sid);
+          }
+        });
+        this.mobileButtonList.forEach(v => {
+          !v.isShow && hideButtonIdsMobile.push(v.sid);
+        });
+      }
+      if (!allExpressionFlag) {
+        this.$message.error(this.$t('1.9.9'));
+        return;
+      }
+      if (this.settingViewData != null) {
+        let tableId = this.settingViewData.id || this.settingViewData.tableId;
+        // 分组统计
+        let groupCountFields = this.groupCountFields
+          .map(item => {
+            if (item.isShow == 1) {
+              return item.key;
+            }
+            return null;
+          })
+          .filter(Boolean);
+        this.setting[tableId] = {
+          hideButtonIds: this.hideButtonIds,
+          hideButtonIdsMobile: hideButtonIdsMobile,
+          pageSize: this.pageSize,
+          showButtonTop: this.showButtonTop,
+          buttonAdaption: this.buttonAdaption,
+          openOnly: this.openOnly,
+          asyncCount: this.asyncCount,
+          hideSearch: this.hideSearch,
+          hideCondition: this.hideCondition,
+          hideQuickSearch: this.hideQuickSearch,
+          hideBottom: this.hideBottom,
+          hideExportBtn: this.hideExportBtn,
+          hideSettingBtn: this.hideSettingBtn,
+          triggerMethodPc: this.triggerMethodPc, // 相关项触发方式
+          triggerMethodField: this.triggerMethodField, // 相关性触发字段
+          countCondition: this.countCondition,
+          groupCountFieldShowKeys: groupCountFields
+        };
+        Object.assign(this.setting, curRelationList);
+        let params = {
+          configId: this.configId,
+          tableId: this.settingViewData.id || this.settingViewData.tableId,
+          // type: this.settingViewData.tableType || this.settingViewData.type,
+          saveType: this.saveConfirm ? this.saveType : '', // 授权范围设置
+          setting: JSON.stringify(this.setting),
+          type:
+            this.$route.query.tableType === 'DEFINED_TABLE_LIST' || this.menuObj.reportType === 'definedListConfig' ? 'definedListConfig' : this.settingViewData.tableType || this.settingViewData.type
+        };
+        let url = `/tableList/saveSetting`;
+        this.spinning = true;
+        this.axios
+          .post(url, this.$qs.stringify(params))
+          .then(({ data }) => {
+            this.spinning = false;
+            if (data) {
+              // 字段设置可配置筛选项开关，所以要更新 copyFieldList
+              this.copyFieldList.forEach(item => {
+                const field = this.setting[item.id];
+                field && Object.assign(item, field);
+              });
+              this.saveMethod(data);
+            }
+          })
+          .catch(() => {
+            this.spinning = false;
+          });
+      }
+    },
+    handleOkLineAdd() {
+      this.viewShow.showFields.push({
+        name: this.itemTitleNameAdd,
+        is_show: this.is_show,
+        html_type: 'LINEBAR'
+      });
+      this.visibleLineAdd = false;
+    },
+    onChangeAdd(e) {
+      if (e.target.checked == true) {
+        this.is_show = 1;
+      } else {
+        this.is_show = 0;
+      }
+    },
+    onChangeAddEdit() {
+      if (this.isAddChecked == true) {
+        this.viewShow.showFields[this.editIndex].is_show = 1;
+      } else {
+        this.viewShow.showFields[this.editIndex].is_show = 0;
+      }
+    },
+    addItemShowLine() {
+      this.visibleLineAdd = true;
+      this.itemTitleNameAdd = '';
+      this.is_show = 0;
+      this.isAddChecked = false;
+    },
+    handleCancel() {
+      this.visibleLine = false;
+      this.visibleLineAdd = false;
+    },
+    handleOkLine() {
+      this.visibleLine = false;
+      this.viewShow.showFields[this.editIndex].name = this.itemTitleName;
+      this.viewShow.showFields[this.editIndex].is_show = this.isAddChecked ? 1 : 0;
+    },
+    editItemLine(ele, i) {
+      this.editIndex = i;
+      this.visibleLine = true;
+      this.itemTitleName = ele.name;
+      if (ele.is_show == 1) {
+        this.isAddChecked = true;
+      } else {
+        this.isAddChecked = false;
+      }
+    },
+    removeItemLine(index) {
+      this.viewShow.showFields.splice(index, 1);
+    },
+    removeSpanWidth(index) {
+      this.viewShow.hideFields.unshift(this.viewShow.showFields[index]);
+      this.viewShow.showFields.splice(index, 1);
+    },
+    initSetting() {
+      /* 字段设置 */
+      if (this.settingViewData != null) {
+        let menuId = this.settingViewData.menuId;
+        let tableId = this.settingViewData.id || this.settingViewData.tableId;
+        let tableTeamId = this.settingViewData.tableTeamId;
+        let tableTeamMark = this.settingViewData.tableTeamMark;
+        let type = this.settingViewData.tableType || this.settingViewData.type;
+        let extendParams = this.settingViewData.extendParams || {};
+        if (type == 'REPORT' || type == 'TABLE_LIST') {
+          type = 'TABLE_LIST';
+        } else if (type == 'TABLE_TEAM') {
+          type = 'TABLE_TEAM_TABLE';
+        }
+        const isMiddle = this.isMenuSource;
+        let url = this.isMenuSource ? `/tableList/getMiddleDetail` : `/tableList/getDetail`;
+        // if (this.$route.path.includes("middle")) {
+        //   url = "/tableList/getDetail";
+        // }
+        if (this.$route.query.tableType === 'DEFINED_TABLE_LIST' || this.menuObj.reportType === 'definedListConfig') {
+          type = 'definedListConfig';
+        }
+        let idKey = 'tableId';
+        let params = {
+          [idKey]: tableId,
+          tableType: type,
+          menuId: menuId,
+          tableTeamId: tableTeamId,
+          tableTeamMark: tableTeamMark,
+          tabChildId: this.settingViewData.tabChildId || undefined,
+          is_setting: '1',
+          classify: 'PC',
+          ...(isMiddle ? {} : extendParams)
+        };
+        /* 页签模式下的参数设置为空 */
+        if (this.pageLayoutSet == 3) {
+          params.tableTeamId = '';
+          params.tableTeamMark = '';
+          params.menuId = '';
+        }
+        if (!isMiddle) {
+          this.middleParams = params;
+        }
+        if (isMiddle && this.openModal) {
+          Object.assign(params, this.curMiddleParams);
+        }
+        this.setSpinning(true);
+        this.axios
+          .get(url, {
+            params
+          })
+          .then(({ data }) => {
+            this.setSpinning(false);
+            if (data.result == 'SUCCESS') {
+              let {
+                buttonList = [],
+                buttonListMobile = [],
+                fieldList = [],
+                relationTableList = [],
+                templateList = [],
+                viewList = [],
+                templateListMobile = [],
+                viewListMobile = [],
+                pageSize = 20,
+                configId,
+                tableName,
+                extraField,
+                primaryKey,
+                isCustomSearch = true,
+                displayRatio = '4:8',
+                remark = '',
+                groupCountFields = []
+              } = data.map;
+              let linkFieldList = []; // link按钮字段集合
+              this.isCustomSearch = isCustomSearch;
+              this.isRefreshStatus = false;
+              this.extraField = extraField;
+              this.configId = configId;
+              this.templateList = templateList || []; // 列表视图
+              this.viewList = viewList || [];
+              this.templateListMobile = templateListMobile || []; // 列表视图
+              this.viewListMobile = viewListMobile || [];
+              this.tableName = tableName;
+              this.remark = remark;
+              this.primaryKey = primaryKey; // 字段主键
+              this.groupCountFields = groupCountFields; // 分组统计设置
+
+              // 复制一份
+              this.copyFieldList = JSON.parse(JSON.stringify(fieldList));
+              this.copyButtonList = JSON.parse(JSON.stringify(buttonList));
+              this.displayRatio = displayRatio;
+              buttonList.forEach(v => {
+                if (v.type == 'LINK') {
+                  linkFieldList.push(v.name);
+                }
+              });
+              this.$set(this, 'linkFieldList', linkFieldList);
+
+              this.copyRelationTableList = JSON.parse(JSON.stringify(relationTableList));
+              this.fieldList = fieldList.map(item => {
+                return Object.assign(item, {
+                  key: item.id,
+                  hideExpression: item.hideExpression || '',
+                  expressionFlag: true,
+                  settingObj: item.settingObj || {}
+                });
+              });
+
+              this.fieldList.forEach((it, index) => {
+                if (this.settingWidthsPage && Object.keys(this.settingWidthsPage).length > 0) {
+                  // 当前表单项宽度赋值
+                  this.fieldList[index].colWidth = this.settingWidthsPage[this.fieldList[index].alias || this.fieldList[index].title];
+                }
+                if (it.isOrder == '') {
+                  it.isOrder = 0;
+                }
+                let relationList = [];
+                relationTableList.forEach(el => {
+                  if (el.primaryField == it.columnName) {
+                    relationList.push(el);
+                  }
+                  el.fieldList.fieldList.forEach(e => {
+                    e.checked = e.isSearch == 1;
+                  });
+                });
+                it.fieldSetting = it.fieldSetting ? JSON.parse(it.fieldSetting) : '';
+                let notParticipatingSort = it.fieldSetting?.notParticipatingSort || '';
+                let notParticipatingSearch = it.fieldSetting?.notParticipatingSearch || '';
+                this.$set(it, 'relationList', relationList);
+                this.$set(it, 'notParticipatingSort', notParticipatingSort);
+                this.$set(it, 'notParticipatingSearch', notParticipatingSearch);
+                this.$set(it, 'attrType', it?.settingObj?.attr || '');
+              });
+              // 增加一个后台过滤
+              this.fieldList = this.fieldList.filter(item => {
+                return item.fieldSetting ? item.fieldSetting.isHide === '0' : true;
+              });
+
+              if (this.configId == 'null' || this.configId == 'undefined') {
+                this.configId = '';
+              }
+              buttonListMobile.forEach(v => (v.isShow = v.isShow == '1' ? true : false));
+              this.mobileButtonList = buttonListMobile;
+              this.buttonList = buttonList;
+              this.showButtonTop = data.map.showButtonTop; // 按钮置顶
+              this.buttonAdaption = data.map.buttonAdaption; // 按钮自适应
+
+              this.asyncCount = data.map.asyncCount || 0; // 异步统计列表数据
+              this.hideSearch = data.map.hideSearch || 0; // 隐藏模糊搜索
+              this.hideCondition = data.map.hideCondition || 0; // 隐藏模糊搜索
+              this.hideQuickSearch = data.map.hideQuickSearch || 0; // 隐藏快速搜索
+              this.hideBottom = data.map.hideBottom || 0; // 隐藏底部分页栏
+              this.hideExportBtn = data.map.hideExportBtn || 0; // 隐藏导出按钮
+              this.hideSettingBtn = data.map.hideSettingBtn || 0; // 隐藏齿轮设置按钮
+              this.countCondition = data.map.countCondition; // 是否开启筛选统计分类数量
+              this.showOtherSetting = data.map.showOtherSetting; // 列表设置按钮
+              this.saveConfirm = data.map.saveConfirm; // 授权范围设置
+
+              this.openOnly = data.map.openOnly || 0; // 手风琴模式
+              this.pageSize = pageSize == +pageSize ? +pageSize : 20;
+              if (!this.pageSizeArr.includes(this.pageSize)) {
+                // 用户自定义分页条数
+                this.pageSizeCustom = this.pageSize;
+              }
+              if (this.buttonList && this.buttonList.length > 0) {
+                this.isButtonList = true;
+              } else {
+                this.isButtonList = false;
+              }
+              this.$nextTick(() => {
+                this.handlePageHeight();
+              });
+            } else {
+              this.$message.error(data.resultMsg);
+            }
+          });
+      }
+    },
+    // 设置高度
+    handlePageHeight() {
+      let settingViewHieht = (this.$refs.settingView && this.$refs.settingView.offsetHeight) || 200;
+      let showSettingHeight = (this.$refs.showSetting && this.$refs.showSetting.offsetHeight) || 0;
+      let buttonListHeight = (this.$refs.buttonList && this.$refs.buttonList.offsetHeight) || 0;
+      // 45/tabBar height 8/tabBar margin  52/tableCell height 49/btn height
+      let MinusHeight = 45 + 8 + 52 + 49;
+      let setShowHeight = settingViewHieht - showSettingHeight - buttonListHeight - MinusHeight;
+      let resultHeight = setShowHeight > 100 ? setShowHeight : 100;
+      if (this.$refs.setShow) {
+        this.$refs.setShow.style.maxHeight = resultHeight + 'px';
+        this.$refs.setShow.style.height = resultHeight + 'px';
+      }
+    },
+    initAboutSetting() {
+      let tableId = this.settingViewData.id || this.settingViewData.tableId;
+      let urlAbout = this.isMenuSource ? `/tableList/getAboutItemMiddleSetting` : `/tableList/getAboutItemSetting`;
+      let params = {
+        tableId: tableId,
+        tableType: this.$route.query.tableType === 'DEFINED_TABLE_LIST' || this.menuObj.reportType === 'definedListConfig' ? 'definedListConfig' : null
+      };
+      this.axios.get(urlAbout, { params }).then(({ data }) => {
+        if (data.result == 'SUCCESS') {
+          let { setting = {}, settingMobile = {} } = data.map;
+          this.relatedSetting = setting;
+          this.relatedSettingMobile = settingMobile;
+          let pcList = [
+            {
+              k: 'layoutPc', // key
+              v: 'TAB' // 默认值
+            },
+            {
+              k: 'locationPc',
+              v: 'LEFT'
+            },
+            {
+              k: 'triggerMethodPc',
+              v: 'doubleClick'
+            },
+            {
+              k: 'triggerMethodField',
+              v: undefined
+            },
+            {
+              k: 'layoutPcName',
+              v: DEFLAYOUTPCNAME
+            },
+            {
+              k: 'aboutItemPositionPc',
+              v: 'RIGHT'
+            },
+            {
+              k: 'tabName',
+              v: ''
+            },
+            {
+              k: 'tabInputName',
+              v: ''
+            }
+          ];
+          this.aboutItemList = setting.showItems;
+          this.aboutSid = setting.sid;
+          if (setting.aboutItemPositionPc == 'TAB' && setting.tabName && setting.tabName != 'INPUT' && setting.tabName.includes('table.')) {
+            setting.tabName = setting.tabName.split('.')[1];
+          }
+          pcList.forEach(p => {
+            this[p.k] = setting[p.k] || p.v;
+          });
+
+          this.mobileAboutItemList = settingMobile.showItems;
+          this.mobileAboutSid = settingMobile.mbSid;
+
+          let mbList = [
+            { k: 'layoutMobile', v: 'TAB' },
+            { k: 'layoutMobileName', V: '详情' },
+            { k: 'triggerMethodMobile', v: 'singleClick' }
+          ];
+
+          mbList.forEach(p => {
+            this[p.k] = settingMobile[p.k] || p.v;
+          });
+        }
+      });
+    },
+    handleRelateChange() {
+      let { layoutPc, locationPc, aboutItemPositionPc, layoutPcName, triggerMethodField, triggerMethodPc, tabName, tabInputName } = this.relatedSetting;
+      this.aboutItemPositionPc = aboutItemPositionPc || 'RIGHT';
+      this.tabName = tabName || '';
+      this.tabInputName = tabInputName || '';
+      this.layoutPc = layoutPc || 'TAB';
+      this.layoutMobile = this.relatedSettingMobile.layoutMobile || 'TAB';
+      this.layoutMobileName = this.relatedSettingMobile.layoutMobileName;
+      this.triggerMethodMobile = this.relatedSettingMobile.triggerMethodMobile || 'singleClick';
+      this.locationPc = locationPc || 'LEFT';
+      this.layoutPcName = layoutPcName || DEFLAYOUTPCNAME;
+      this.triggerMethodField = triggerMethodField || this.triggerMethodField || 'doubleClick';
+      this.triggerMethodPc = triggerMethodPc || this.triggerMethodPc;
+    },
+    aboutItemPosition(e) {
+      let { value = 'RIGHT' } = e?.target || {};
+      if (value === 'BOTTOM') {
+        this.layoutPc = 'TAB';
+      }
+      if (value === 'TAB') {
+        this.tabName = (this.fieldList.length && this.fieldList[0].columnName) || 'INPUT';
+      }
+      if (value !== 'TAB') {
+        this.tabName = '';
+        this.tabInputName = '';
+      }
+    },
+    changeTabName(val) {
+      if (val !== 'INPUT') {
+        this.tabInputName && (this.tabInputName = '');
+      }
+    },
+    onChangeShow(e, ele, j) {
+      if (e.target.checked == true) {
+        ele.isShow = 1;
+      } else {
+        ele.isShow = 0;
+      }
+      // this.handleSetfieldTracher(ele, j);
+    },
+    onChangeEdit(e, ele, j) {
+      if (e.target.checked == true) {
+        ele.isEdit = 1;
+      } else {
+        ele.isEdit = 0;
+      }
+      // this.handleSetfieldTracher(ele, j);
+    },
+    // 搜索checkbox-change事件
+    onChangeSearch(e, ele) {
+      if (e.target.checked == true) {
+        ele.isSearch = 1;
+        if (ele.filterExplicit !== 1) {
+          // 勾选搜索并且没有勾选筛选外显时勾选高级筛选
+          ele.isShowSearch = 1;
+        }
+      } else {
+        ele.isSearch = 0;
+      }
+    },
+    onChangeSort(e, ele, j) {
+      if (e.target.checked == true) {
+        ele.isSort = 1;
+      } else {
+        ele.isSort = 0;
+      }
+      // this.handleSetfieldTracher(ele, j);
+    },
+    onChangeSum(e, ele) {
+      if (e.target.checked == true) {
+        ele.isSum = 1;
+      } else {
+        ele.isSum = 0;
+      }
+    },
+    onChangeAvg(e, ele) {
+      if (e.target.checked == true) {
+        ele.isAvg = 1;
+      } else {
+        ele.isAvg = 0;
+      }
+    },
+    onChangeFixed(e, ele) {
+      if (e.target.checked == true) {
+        ele.isFixed = 1;
+      } else {
+        ele.isFixed = 0;
+      }
+    },
+    onChangeQuick(e, ele) {
+      if (e.target.checked == true) {
+        ele.isShowSearch = 1;
+        // ele.filterExplicit = 0;
+      } else {
+        ele.isShowSearch = 0;
+        ele.filterExplicit = 0;
+      }
+    },
+    onChangeOutFilter(e, ele) {
+      if (e.target.checked == true) {
+        ele.filterExplicit = 1;
+        ele.isShowSearch = 1;
+      } else {
+        // ele.isShowSearch = 1;
+        ele.filterExplicit = 0;
+      }
+    },
+
+    onButtonChecked(e, itemButton) {
+      if (e.target.checked == true) {
+        itemButton.isShow = 1;
+      } else {
+        itemButton.isShow = 0;
+      }
+    },
+
+    showSetting(e, v) {
+      this.tableView[v] = e.target.checked;
+
+      // 埋点
+      // this.$_handleTracherLog('列表显示设置', {
+      //   列表ID: this.settingViewData.id || this.settingViewData.tableId,
+      //   列表名称: this.tableName || this.$attrs?.tableName || '',
+      //   设置项: v,
+      //   设置值: this[v]
+      // });
+    },
+    changeGroupShow(e, group) {
+      let value = e.target.checked ? '1' : '0';
+      group.isShow = value;
+    },
+    handlerChangeRadios(e, i) {
+      this.testData.forEach((el, j) => {
+        if (i !== j) {
+          el.select = '0';
+        }
+      });
+    },
+    handleChangeTem() {},
+    // 添加视图
+    handlerAddView(data = {}) {
+      let { type, typeTable, refString } = data;
+      this.viewTypeObj = {
+        type,
+        typeTable,
+        refString
+      };
+      this.defaultViewDetail = {};
+      // this.ViewModalVisible = true;
+      this.viewSetVisible = true;
+    },
+    saveDefault(val) {
+      this.spinning = val;
+    },
+
+    // 修改视图
+    handlerEditView(data = {}) {
+      let { type, typeTable, refString, curData, defaultMark } = data;
+      this.viewTypeObj = {
+        type,
+        typeTable,
+        refString,
+        defaultMark
+      };
+      this.defaultViewDetail = curData || {};
+      this.viewSetVisible = true;
+      // 修改
+      this.viewTempType = 'edit';
+    },
+    // 刷新
+    handlerRefresh() {
+      this.hanlderRefreshTable();
+    },
+    hanlderRefreshTable() {
+      this.initSetting();
+      this.$emit('reload');
+    },
+    setSpinning(val) {
+      this.spinning = val;
+    },
+    saveMethod(data) {
+      if (data.result == 'SUCCESS') {
+        this.$message.success(this.$t('1.6.6'));
+        if (this.menuSource === 'middle') {
+          if (this.openModal) {
+            // this.$router.go(-1);
+            // return;
+            this.$emit('middleCancel');
+            this.$emit('emitMethod');
+            return;
+          }
+        }
+        this.emitMethod();
+      } else {
+        this.$message.error(this.$t('1.4.2.9'));
+      }
+    },
+    emitMethod() {
+      this.$emit('reload');
+      this.$emit('reloadPage');
+      this.$emit('onCloseSetting');
+    },
+    handleHideExpression(item) {
+      if (item.hideExpression) {
+        item.expressionFlag = /(^\d+$)|(^[L,l,R,r]\(\d+\)(~\(\d+\))?$)/.test(item.hideExpression);
+      } else {
+        item.expressionFlag = true;
+      }
+    },
+    handleRequestedBtnSet() {
+      let url = this.isMenuSource ? `/tableList/getMiddleButtonSetting` : `/tableList/getButtonSetting`;
+      this.axios
+        .get(url, {
+          params: {
+            tableId: this.settingViewData.id || this.settingViewData.tableId,
+            tableType: this.$route.query.tableType === 'DEFINED_TABLE_LIST' || this.menuObj.reportType === 'definedListConfig' ? 'definedListConfig' : null
+          }
+        })
+        .then(({ data }) => {
+          if (data.result === 'SUCCESS') {
+            let { map = {} } = data;
+            this.btnSettingObj = map.setting;
+            this.btnMobileSettingObj = map.settingMobile;
+            // this.setting = map.setting;
+            // this.settingMobile = map.settingMob`ile;
+            this.btnSetting.hideButtons = map.setting.hideButtons || [];
+            this.btnSetting.showButtons = map.setting.showButtons || [];
+            this.btnSetting.sid = map.setting.sid;
+            this.btnMobileSetting.hideButtons = map.settingMobile.hideButtons || [];
+            this.btnMobileSetting.showButtons = map.settingMobile.showButtons || [];
+            this.btnMobileSetting.sid = map.settingMobile.sid;
+          }
+        })
+        .catch(err => {
+          console.log(err);
+        });
+    },
+    handleMoveBtn(ele, index, type) {
+      let tpList = type.split('-');
+      this.aboutEditType = tpList[0];
+      this.aboutModel = 'btn-' + tpList[1];
+      let { btnSetting = {}, btnMobileSetting } = this;
+      this.clickTimes++;
+      if (this.clickTimes == 2) {
+        this.modalTitle = '1.9.276';
+        this.curAboutType = ele.type || '';
+        this.visibleShowItem = true;
+        this.itemTitleShowItem = ele.name;
+        this.btnIcon = ele.style;
+        this.clickTimes = 0;
+      }
+      setTimeout(() => {
+        if (this.clickTimes == 1) {
+          if (tpList[1] == 'show') {
+            if (tpList[0] == 'PC') {
+              btnSetting.hideButtons.push(...btnSetting.showButtons.splice(index, 1));
+            } else {
+              btnMobileSetting.hideButtons.push(...btnMobileSetting.showButtons.splice(index, 1));
+            }
+          } else {
+            if (tpList[0] == 'PC') {
+              btnSetting.showButtons.push(...btnSetting.hideButtons.splice(index, 1));
+            } else {
+              btnMobileSetting.showButtons.push(...btnMobileSetting.hideButtons.splice(index, 1));
+            }
+          }
+
+          this.clickTimes = 0;
+        }
+      }, 300);
+    },
+    saveBtnSetItem(type = 'PC') {
+      let { btnSetting = {}, btnMobileSetting = {} } = this;
+      let isPc = type === 'PC';
+      let settingAbout = {};
+      let mapBtnList = (list = []) =>
+        list.map(v => {
+          return {
+            id: v.sid,
+            name: v.name,
+            icon: v.icon
+          };
+        });
+
+      if (isPc) {
+        settingAbout.hideButtons = mapBtnList(btnSetting.hideButtons);
+        settingAbout.showButtons = mapBtnList(btnSetting.showButtons);
+      } else {
+        settingAbout.hideButtons = mapBtnList(btnMobileSetting.hideButtons);
+        settingAbout.showButtons = mapBtnList(btnMobileSetting.showButtons);
+      }
+      let params = {
+        id: isPc ? this.btnSetting.sid : this.btnMobileSetting.sid,
+        tableId: this.settingViewData.id || this.settingViewData.tableId,
+        setting: JSON.stringify(settingAbout),
+        classify: type
+      };
+      let url = `/tableList/saveButtonSetting`;
+      this.spinning = true;
+      this.axios
+        .post(url, this.$qs.stringify(params))
+        .then(({ data }) => {
+          this.spinning = false;
+          if (data) {
+            this.saveMethod(data);
+          }
+        })
+        .catch(() => {
+          this.spinning = false;
+        });
+    },
+    colWidthChange() {
+      this.isColWidthChange = true;
+    },
+    goMiddleListDetail() {
+      // let id = data.id || data.tableId;
+      // this.setModalOpenMiddle(1);
+      this.modalWidth = '1280px';
+      this.middleListModal = true;
+    },
+    middleCancel() {
+      this.setModalOpenMiddle('');
+      this.modalWidth = '1280px';
+      this.modalHeight = '748px';
+      this.isChangeWindow = false;
+      this.middleListModal = false;
+    },
+    goBack(refresh = false) {
+      if (this.openModal) {
+        if (refresh) {
+          this.$emit('emitMethod');
+        }
+        this.middleCancel();
+        this.$emit('middleCancel');
+      } else {
+        // this.$router.go(-1);
+        this.$router.push({
+          path: '/middleList',
+          query: { keywords: this.$route.query.keywords }
+        });
+      }
+    },
+
+    getRefreshStatus() {
+      this.isRefreshStatus = true;
+    },
+
+    async tabsOnChange(activeKey) {
+      switch (activeKey) {
+        case 'expandfields':
+          this.isRefreshStatus = false;
+          break;
+        case 'fieldList':
+          if (this.isRefreshStatus) {
+            this.initSetting();
+          }
+          break;
+        case '2':
+          if (this.$utils.isEmpty(this.btnSettingObj)) {
+            this.handleRequestedBtnSet();
+          }
+          break;
+        case '3':
+          if (this.$utils.isEmpty(this.relatedSetting)) {
+            this.initAboutSetting();
+          }
+          break;
+        default:
+          break;
+      }
+    },
+    openColor() {
+      this.showColor = true;
+      this.curColor = this.color || '#000000';
+    },
+    handleOkColor(val) {
+      this.color = val;
+      this.showColor = false;
+    },
+    closeColor(val) {
+      this.showColor = val;
+    },
+    changeModalWindow() {
+      this.isChangeWindow = !this.isChangeWindow;
+      let docHeight = document.body.clientHeight;
+      this.modalWidth = this.modalWidth === '1280px' ? `100%` : '1280px';
+      this.modalHeight = this.modalHeight === '748px' ? `${docHeight - 55}px` : '748px';
+      this.$nextTick(() => {
+        this.$refs.ListDetail?.handlePageHeight();
+      });
+    },
+    getContainer() {
+      // fix safari浏览器兼容
+      return document.body;
+    },
+    getAboutContainer() {
+      return document.getElementsByClassName('setting-tabs-about')[0];
+    },
+    showCheckBox(key) {
+      return this.fields.some(i => Object.prototype.hasOwnProperty.call(i, key));
+    },
+    calculateCheck(key) {
+      if (!this.fields.length) return false;
+      return this.fields.every(i => {
+        if (!Object.prototype.hasOwnProperty.call(i, key)) return true;
+        return i[key];
+      });
+    },
+    handleAllCheck(e, key) {
+      const value = e.target.checked ? 1 : 0;
+      this.fields.forEach(i => {
+        if (Object.prototype.hasOwnProperty.call(i, key)) {
+          i[key] = value;
+        }
+        return i;
+      });
+      this.fields = [].concat(this.fields);
+    },
+    hanldeSaveAboutItem() {
+      this.saveSetting();
+    },
+    handleFieldClick(item) {
+      this.clickItem = item;
+    },
+
+    // // 修改默认排序
+    // onChangeIsOrder(e, item, j) {
+    //   this.handleSetfieldTracher(item, j);
+    // },
+
+    // // 修改固定
+    // onChangeIsFixed(e, item, j) {
+    //   this.handleSetfieldTracher(item, j);
+    // },
+
+    // //
+    // colWidthChangeOnBlur(e, item, j) {
+    //   this.handleSetfieldTracher(item, j);
+    // },
+
+    // handleSetfieldTracher(item, i) {
+    //   try {
+    //     // 埋点
+    //     this.$_handleTracherLog('列表字段设置', {
+    //       列表ID: this.settingViewData.id || this.settingViewData.tableId,
+    //       列表名称: this.tableName || this.$attrs?.tableName || '',
+    //       字段: item.title,
+    //       显示: item.isShow,
+    //       排序: item.isSort,
+    //       默认排序: item.isOrder,
+    //       固定: item.isFixed,
+    //       列宽: item.colWidth,
+    //       顺序位置: i
+    //     });
+    //   } catch (error) {
+    //     console.log(error);
+    //   }
+    // },
+    // 选择上下显示比列
+    changeRatio(e) {
+      this.displayRatio = e;
+    },
+    // 自定义表格的条数
+    onChange(val) {
+      if (val > 300) {
+        this.$message.error('分页数不能超过300条/页');
+      }
+      if (!val) {
+        this.pageSizeCustom = undefined;
+        this.pageSize = 1;
+      } else {
+        this.pageSize = val;
+      }
+    },
+    visibleEditCheckbox(ele) {
+      let find = this.listFormUnionSetting?.paramsList?.find(item => item.tableField === ele.columnName);
+      return ele.sid != '0001' && find;
+    }
+  }
+});
+</script>
+<style scoped lang="less">
+ul {
+  margin: 0;
+  padding: 0;
+}
+
+.fields-set-content {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  .fields-table {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    overflow: auto;
+  }
+}
+.new-name {
+  display: inline-block;
+  width: 10%;
+  text-align: left;
+}
+.new-name-input {
+  width: 90%;
+  margin-bottom: 10px;
+}
+.name-new-change {
+  margin: 15px 0px 0px 40px;
+}
+/deep/ .ant-tabs {
+  padding: 0 16px;
+  .ant-tabs-nav-scroll {
+    text-align: left;
+  }
+  .ant-tabs-content {
+    text-align: left;
+  }
+  .ant-tabs-bar {
+    margin-bottom: 8px;
+  }
+  &.setting-tabs {
+    color: #7587af;
+    .ant-tabs-bar {
+      border-bottom: unset;
+    }
+    .ant-tabs-nav {
+      transition: none;
+    }
+    .ant-tabs-tab {
+      padding-bottom: unset;
+      > span {
+        display: inline-flex;
+        flex-direction: column;
+        justify-content: flex-start;
+        align-items: center;
+        > i {
+          margin-right: 0;
+        }
+      }
+    }
+    .ant-tabs-ink-bar,
+    .ant-tabs-ink-bar-animated {
+      display: none !important;
+    }
+    &.setting-tabs-about {
+      .location {
+        span {
+          margin-right: 8px;
+        }
+      }
+      .location + .location {
+        margin-top: 6px;
+      }
+    }
+  }
+}
+
+.setting-view {
+  height: 100%;
+  position: relative;
+  /deep/ .ant-spin-container {
+    width: 100%;
+    height: 100%;
+  }
+  .settingview-tabs {
+    position: relative;
+    padding: 0;
+    /* 非中台，仅展示字段设置的情况下，隐藏tab */
+    &.settingview-only {
+      /deep/ .ant-tabs-bar {
+        opacity: 0;
+        pointer-events: none;
+        .ant-tabs-tab-btn-disabled {
+          cursor: default;
+        }
+      }
+    }
+  }
+  &.no-padding {
+    height: 100%;
+    padding-bottom: 0;
+  }
+  .setting-wrap {
+    position: absolute;
+    top: 12px;
+    right: 16px;
+    color: #212121 !important;
+
+    cursor: pointer;
+    > div {
+      display: inline-block;
+    }
+  }
+  .setting-title {
+    background: #f2f2f4;
+    border: 1px solid #f2f2f2;
+    height: 52px;
+    line-height: 52px;
+    span {
+      display: inline-block;
+    }
+    &.seting-title-api {
+      .width-large {
+        width: 15%;
+      }
+    }
+  }
+  .set-show {
+    min-height: 100px;
+    overflow-y: auto;
+    &.set-show-api {
+      .width-large {
+        width: 15%;
+      }
+    }
+
+    .left-style.sortable-chosen {
+      background: #fafafa;
+      box-shadow: 0px 0px 10px 0px #d5d5d5;
+    }
+
+    li {
+      padding: 5px 0;
+      display: flex;
+      align-items: center;
+      border-bottom: 1px solid #e8e8e8;
+      height: 52px;
+      line-height: 52px;
+    }
+    .alias-style {
+      outline: none;
+      border-radius: 4px 4px 4px 4px;
+      border: solid 1px #d5d5d5;
+      height: 32px;
+      text-indent: 16px;
+      color: #38454f;
+      width: 100%;
+    }
+    .is-sort-style {
+      outline: none;
+      border-radius: 4px 4px 4px 4px;
+      border: solid 1px #d5d5d5;
+      height: 32px;
+      text-indent: 6px;
+      color: #38454f;
+      width: 87px;
+      margin-right: 5px;
+      &:disabled {
+        cursor: not-allowed;
+        background: #f5f5f5;
+      }
+    }
+    .col-width-style {
+      width: 70px;
+    }
+    .title-item {
+      display: inline-flex;
+      justify-content: flex-start;
+      align-items: center;
+      text-align: left;
+      > span {
+        display: inline-block;
+        max-width: calc(100% - 20px);
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+      }
+    }
+  }
+  .alias-style {
+    outline: none;
+    border-radius: 4px 4px 4px 4px;
+    border: solid 1px rgba(212, 222, 229, 1);
+    height: 32px;
+    text-indent: 16px;
+    color: #38454f;
+  }
+  .buttonList {
+    padding-bottom: 24px;
+    padding-bottom: 20px;
+    border-bottom: 1px solid #d5d5d5;
+  }
+  .show-setting {
+    padding-top: 24px;
+    padding-bottom: 16px;
+    /deep/.ant-checkbox-wrapper {
+      margin-left: 0;
+      margin-right: 8px;
+    }
+  }
+  .btn-operate {
+    border-top: 1px solid #d5d5d5;
+    padding: 12px 0 4px;
+  }
+  .lable-title {
+    color: #000000;
+    margin-bottom: 11px;
+    font-size: 16px;
+    cursor: pointer;
+    &.pagesize-title {
+      margin-top: 20px;
+      border-top: 1px solid #d5d5d5;
+      padding-top: 14px;
+    }
+  }
+
+  .view-model-input {
+    margin: 5px 0;
+  }
+  .left-show-part {
+    padding-right: 20px;
+    border-right: 1px solid rgb(205, 197, 211);
+    height: 748px;
+    overflow-y: auto;
+    .show-content-header {
+      cursor: pointer;
+      height: 30px;
+      line-height: 30px;
+      border-bottom: 1px dashed #eee;
+      margin-bottom: 10px;
+      .left-item-height {
+        height: 748px;
+      }
+      .show-content-headerOperate {
+        float: right;
+        color: #428bca;
+        cursor: pointer;
+      }
+    }
+
+    .show-field-style {
+      border: 1px solid rgb(205, 197, 211);
+      background: #fdfdfd;
+      height: 40px;
+      line-height: 40px;
+      margin: 0px 10px 10px 0px;
+      padding-left: 8px;
+      color: #5585f5;
+      border-radius: 5px;
+      .show-filed-edit {
+        float: right;
+        select {
+          outline: none;
+          border-radius: 4px 4px 4px 4px;
+          border: solid 1px rgba(212, 222, 229, 1);
+          height: 28px;
+          text-indent: 7px;
+          color: #38454f;
+          width: 60px;
+          margin-right: 2px;
+        }
+        button {
+          height: 28px;
+          margin-right: 2px;
+          text-align: center;
+        }
+      }
+    }
+  }
+
+  .right-hide-part {
+    height: 800px;
+    overflow-y: auto;
+    .titleHide {
+      height: 30px;
+      line-height: 30px;
+      font-size: 18px;
+      border-bottom: 1px solid #eee;
+      margin-bottom: 20px;
+    }
+    padding: 5px;
+    .hide-field-style {
+      border: 1px solid rgb(205, 197, 211);
+      background: #fdfdfd;
+      height: 40px;
+      line-height: 40px;
+      margin: 0px 10px 10px 10px;
+      padding-left: 8px;
+      border-radius: 5px;
+      height: 100%;
+    }
+  }
+  .line-style {
+    padding-bottom: 6px;
+    border-bottom: 1px dashed #ccc;
+    overflow: hidden;
+    padding-left: 8px;
+    height: 40px;
+    line-height: 40px;
+    margin: 0px 0px 10px 0px;
+    .line-edit-style {
+      float: right;
+      button {
+        margin-right: 5px;
+      }
+    }
+  }
+
+  .row-style {
+    margin: 6px 0;
+    .inner-show {
+      margin: 0px 3px;
+      border: 1px solid #ccc;
+      border-radius: 5px;
+      padding-left: 12px;
+      height: 40px;
+      line-height: 40px;
+      .row-lable-style {
+        float: left;
+        margin-right: 5px;
+      }
+      .row-edit {
+        float: right;
+        .row-select-style {
+          outline: none;
+          border-radius: 4px 4px 4px 4px;
+          border: solid 1px #d4dee5;
+          height: 32px;
+          text-indent: 3px;
+          color: #38454f;
+          width: 55px;
+          float: left;
+          margin-top: 3px;
+          margin-right: 5px;
+        }
+        .row-button-style {
+          float: right;
+          margin-top: 3px;
+          margin-right: 3px;
+          width: 50px;
+          padding-left: 7px;
+        }
+      }
+    }
+  }
+
+  .related-items {
+    .list-head {
+      height: 30px;
+      line-height: 30px;
+      // border-bottom: thin solid #ccc;
+      margin-bottom: 10px;
+    }
+    label {
+      display: inline-block;
+      max-width: 100%;
+      margin-bottom: 5px;
+      margin-right: 10px;
+      font-weight: 700;
+    }
+    .text-muted {
+      color: #777;
+    }
+    li {
+      position: relative;
+      display: inline-block;
+      padding: 6px;
+      margin-right: 8px;
+      border: 1px dashed #ccc;
+      margin-bottom: 8px;
+      &.homepage-li {
+        border-style: solid;
+      }
+      .close-btn {
+        position: absolute;
+        top: -6px;
+        right: -6px;
+        font-size: 12px;
+        background: #fff;
+        color: #cfcfcf;
+        cursor: pointer;
+        &:hover {
+          color: #8c8c8c;
+        }
+      }
+    }
+  }
+  .view-about {
+    height: 300px;
+    overflow-y: auto;
+    border: thin solid #d2d9e8;
+    padding: 16px;
+    margin-bottom: 16px;
+  }
+  .allWidth {
+    width: 100%;
+  }
+  .halfWidth {
+    width: 50%;
+  }
+  .threeWidth {
+    width: 33.33%;
+  }
+  .fourWidth {
+    width: 25%;
+  }
+  .width-less {
+    display: inline-block;
+    width: 5%;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+  }
+  .width-show {
+    display: inline-block;
+    width: 4.5%;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+  }
+  .drag-icon-wrap {
+    width: 3%;
+    cursor: pointer;
+    text-align: center;
+  }
+  .width-showed {
+    display: inline-block;
+    width: 9%;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+  }
+  .width-word {
+    display: inline-block;
+    width: 10%;
+    line-height: 52px;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    padding-right: 8px;
+  }
+  .width-word-a {
+    display: inline-block;
+    width: 12%;
+    line-height: 52px;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    padding-right: 8px;
+  }
+  .width-large {
+    display: inline-block;
+    width: 10%;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+  }
+
+  .button-is-up {
+    margin-right: 5px;
+  }
+  .tip-color {
+    font-weight: 500;
+    color: yellow;
+    line-height: 1.5;
+  }
+
+  .error-tip {
+    border: 1px solid red !important;
+  }
+  .small-font {
+    font-size: 12px;
+    line-height: 1.5;
+    p {
+      padding: 0;
+      margin: 0;
+    }
+  }
+  .show-ratio {
+    /deep/ .ant-select {
+      width: 200px;
+    }
+    /deep/.ant-select-selection--single {
+      height: 26px;
+    }
+    /deep/ .ant-select-selection__rendered {
+      line-height: 24px;
+    }
+  }
+}
+</style>
+<style>
+.popver-content {
+  height: 400px;
+  overflow: hidden;
+  overflow-y: auto;
+}
+.popver-ul {
+  margin-bottom: 10px;
+}
+.ul-title {
+  font-size: 14px;
+  font-weight: 400;
+  color: rgba(145, 159, 190, 1);
+  line-height: 20px;
+}
+</style>