cnhis-design-vue 2.1.12 → 2.1.15

package/packages/table-filter/src/quick-search/QuickSearch.vue

@@ -1,2051 +1,2083 @@
-
-<template>
-  <div>
-    <div class="form-box" :class="{ 'quick-search-table': source === 'editTable' }">
-      <p class="module-title" v-if="source === 'editTable' && hasRelationQuickSearch">高级筛选</p>
-      <div
-        class="quick-item"
-        v-for="item in quickSearch"
-        :key="item.sid"
-        :class="{
-          'quick-block':
-            item.con == 'DATE' || item.con == 'BIRTHDAY' || item.con == 'CONVERT' || item.LABELAttr
-        }"
-      >
-        <div class="quick-row">
-          <!-- title -->
-          <div
-            class="quick-item-title"
-            :class="{ 'quick-item-title-default': source !== 'editTable' }"
-          >
-            <span>{{ handleName(item, "title") }}&nbsp;&nbsp;</span>
-            <a-tooltip
-              v-if="searchFieldLimit[item.columnName] && searchFieldLimit[item.columnName].tips"
-              :title="searchFieldLimit[item.columnName].tips"
-            >
-              <svg-icon icon-class="xitongtubiaodaohangtubiaowenti" />
-              &nbsp;&nbsp;
-            </a-tooltip>
-          </div>
-          <div class="quick-item-col" :class="{ 'quick-item-col-default': source !== 'editTable' }">
-            <!-- age -->
-            <!-- TODO: 清除，跨表 -->
-            <div v-if="item.AGEAttr" class="age-container">
-              <range-age
-                :ref="`${item.columnName}_AGEAttr`"
-                :format="item.format"
-                @change="ageRangeOnChange($event, item)"
-              ></range-age>
-            </div>
-            <!-- age -->
-            <!-- label -->
-            <div v-else-if="item.LABELAttr" class="label-attr-container">
-              <slot v-if="item.labelObj && Object.keys(item.labelObj || {}).length > 0">
-                <div v-for="(v, k) in item.labelObj" :key="k" class="edit-label-content">
-                  <div class="edit-label">{{ k }}：</div>
-
-                  <div
-                    class="edit-content quickSearch_label-container"
-                    :class="{
-                      'label-container-height': !v.isUnfold && v.itemList && v.isShowBtn
-                    }"
-                  >
-                    <div class="label-content" v-resize="el => onResize(el, v)">
-                      <a-checkable-tag
-                        v-for="(v, i) in v.itemList"
-                        v-model="v.isSelect"
-                        @change="handleLabelChange($event, v, item)"
-                        :key="i"
-                        :style="handleLabelColor(v)"
-                      >
-                        <a-tooltip placement="topLeft">
-                          <template slot="title">
-                            <span>{{ v.labelName }}</span>
-                          </template>
-                          {{ v.labelName }}
-                        </a-tooltip>
-                      </a-checkable-tag>
-                    </div>
-                  </div>
-                  <div class="label-unfold-btn" v-if="v.itemList && v.isShowBtn">
-                    <!-- {{ v.isUnfold }} -->
-                    <span @click.stop="handleLabelUpfold(v)">
-                      <template v-if="v.isUnfold">
-                        <span>收起</span>
-                        <a-icon
-                          type="up-square"
-
-                        />
-                      </template>
-                      <template v-else>
-                        <span>展开</span>
-                        <a-icon
-                          type="down-square"
-                        />
-                      </template>
-                    </span>
-                  </div>
-                </div>
-              </slot>
-              <a-input v-else style="width: 200px" v-model="item.inputVal" allowClear></a-input>
-            </div>
-            <!-- label -->
-
-            <!-- EVALUATE -->
-            <div v-else-if="item.EVALUATEAttr">
-              <template v-for="tag in EVALUATEList">
-                <a-checkable-tag
-                  :key="tag.value"
-                  :checked="item.selecteds.indexOf(tag.value) > -1"
-                  @change="checked => handleEvaluateOnChange(tag, checked, item)"
-                >
-                  {{ tag.label }}
-                </a-checkable-tag>
-              </template>
-              <!-- <a-icon v-if="item.CL" type="close" @click="item.CL = ''" /> -->
-            </div>
-            <!-- EVALUATE -->
-
-            <!-- NUMBERFiled -->
-            <div v-else-if="item.NUMBERFiled" class="ant-calendar-picker" style="width: 300px">
-              <span
-                class="ant-calendar-picker-input ant-input num-picker"
-                :class="{ 'num-picker-unit': item.inputUnit }"
-              >
-                <input
-                  v-model="item.lessValue"
-                  @keyup.enter="() => changeFilterNumber(item)"
-                  :title="`起始${item.alias || item.title}`"
-                  :placeholder="`起始${item.alias || item.title}`"
-                  class="ant-calendar-range-picker-input"/>
-                <span class="ant-calendar-range-picker-separator"> ~ &nbsp;</span>
-                <input
-                  v-model="item.bigValue"
-                  :title="`截止${item.alias || item.title}`"
-                  @keyup.enter="() => changeFilterNumber(item)"
-                  :placeholder="`截止${item.alias || item.title}`"
-                  class="ant-calendar-range-picker-input"/>
-                <template v-if="item.inputUnit">&nbsp;{{ item.inputUnit }}</template>
-                <span
-                  class="ant-input-suffix clear-number-icon"
-                  v-if="item.lessValue || item.bigValue"
-                  @click="clearFilterNumber(item)"
-                  ><i
-                    aria-label="图标: close-circle"
-                    tabindex="-1"
-                    class="anticon anticon-close-circle ant-input-clear-icon"
-                    ><svg
-                      viewBox="64 64 896 896"
-                      data-icon="close-circle"
-                      width="1em"
-                      height="1em"
-                      fill="currentColor"
-                      aria-hidden="true"
-                      focusable="false"
-                      class=""
-                    >
-                      <path
-                        d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 0 1-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z"
-                      ></path></svg></i></span
-              ></span>
-            </div>
-            <!-- NUMBERFiled -->
-
-            <!-- other -->
-            <slot v-else>
-              <template v-if="item.con == 'CL'">
-                <template v-if="showPercent(item)">
-                  <a-input-number
-                    class="CL-input"
-                    :style="`width: ${getEleWidth(item)}`"
-                    v-model="item.CL"
-                    :min="0"
-                    :max="100"
-                    allowClear
-                  />
-                </template>
-                <template v-else>
-                  <a-input
-                    class="CL-input"
-                    :style="{
-                      width: `${getEleWidth(item)}`,
-                      'font-family': item.PASSWORDTYPE ? 'text-security-disc' : 'inherit'
-                    }"
-                    v-model="item.CL"
-                    :class="{ 'psw-icon': item.comAttr == 'PASSWORD' }"
-                    allowClear
-                  >
-                    <template slot="suffix" v-if="item.comAttr == 'PASSWORD'">
-                      <svg-icon
-                        class="psw-icon"
-                        @click="item.PASSWORDTYPE = !item.PASSWORDTYPE"
-                        :icon-class="item.PASSWORDTYPE ? 'anniuyincang' : 'chakan'"
-                        style="font-size: 1em;"
-                      />
-                    </template>
-                  </a-input>
-                </template>
-              </template>
-              <template v-if="item.con == 'EQ'">
-                <template v-if="showPercent(item)">
-                  <a-input-number
-                    class="EQ-input"
-                    :style="`width: ${getEleWidth(item)}`"
-                    v-model="item.EQ"
-                    :min="0"
-                    :max="100"
-                    allowClear
-                  />
-                </template>
-                <template v-else>
-                  <a-input
-                    :class="{ 'psw-icon': item.comAttr == 'PASSWORD' }"
-                    class="EQ-input"
-                    :style="{
-                      width: `${getEleWidth(item)}`,
-                      'font-family': item.PASSWORDTYPE ? 'text-security-disc' : 'inherit'
-                    }"
-                    v-model="item.EQ"
-                    :placeholder="item.isPreciseSearch || item.fieldType == 'JSONB' ? '' : getI18nText('1.9.6', '区间搜素用~分割')"
-                    allowClear
-                  >
-                    <template slot="suffix" v-if="item.comAttr == 'PASSWORD'">
-                      <svg-icon
-                        class="psw-icon"
-                        @click="item.PASSWORDTYPE = !item.PASSWORDTYPE"
-                        :icon-class="item.PASSWORDTYPE ? 'anniuyincang' : 'chakan'"
-                        style="font-size: 1em;"
-                      />
-                    </template>
-                  </a-input>
-                </template>
-              </template>
-              <template v-if="showPercent(item)">&nbsp;%</template>
-              <!-- date -->
-              <div v-if="item.con == 'DATE'">
-                <a-radio-group v-model="item.DATE.con" buttonStyle="solid">
-                  <a-radio-button
-                    v-for="date in item.dateTeam"
-                    v-show="!item.showDate"
-                    @click="clickRadioGroup(item.DATE, date.con)"
-                    :key="date.con"
-                    :value="date.con"
-                    >{{ getI18nText(date.title, date.name) }}
-                  </a-radio-button>
-                  <span v-show="item.advanceOptionSetting != 1" :class="['check-date-btn', item.marginx]" @click="checkDate(item)">{{
-                    getI18nText('1.1.4.52', '选择时间')
-                  }}</span>
-                  <div class="check-date" v-show="item.showDate">
-                    <a-date-picker
-                      format="YYYY-MM-DD HH:mm:ss"
-                      v-model="item.DATE.start_val"
-                      :show-time="{
-                        defaultValue: $moment('00:00:00', 'HH:mm:ss')
-                      }"
-                      :placeholder="getI18nText('1.1.4.53', '开始时间')"
-                      style="width: 120px"
-                      allowClear
-                    />
-                    &nbsp;
-                    <a-date-picker
-                      format="YYYY-MM-DD HH:mm:ss"
-                      :show-time="{
-                        defaultValue: $moment('23:59:59', 'HH:mm:ss')
-                      }"
-                      :placeholder="getI18nText('1.9.147', '结束时间')"
-                      v-model="item.DATE.end_val"
-                      style="width: 120px"
-                      allowClear
-                    />
-                  </div>
-                </a-radio-group>
-              </div>
-              <!-- BIRTHDAY -->
-              <div v-if="item.con == 'BIRTHDAY'" :class="{ 'birthday-item': item.showDate }">
-                <a-radio-group v-model="item.BIRTHDAY.con" buttonStyle="solid">
-                  <template v-if="!item.showDate">
-                    <a-radio-button
-                      v-for="date in birthdayTeam"
-                      @click="clickBirthdayRadioGroup(item.BIRTHDAY, date.con)"
-                      :key="date.con"
-                      :value="date.con"
-                      >{{ getI18nText(date.title, date.name) }}
-                    </a-radio-button>
-                  </template>
-                  <template v-else>
-                    <div>
-                      <a-range-picker
-                        v-model="item.BIRTHDAY.limit_date"
-                        :disabledDate="disabledDate"
-                        @change="changeRange"
-                        format="MM-DD"
-                      />
-                    </div>
-                    <div class="age-wrap">
-                      <p>{{ getI18nText('1.2.5.34', '年龄') }}</p>
-                      <a-input
-                        style="width: 60px; margin-right: 10px"
-                        v-model="item.BIRTHDAY.start_val"
-                        allowClear
-                      />
-                      <a-input
-                        style="width: 60px; margin-right: 10px"
-                        v-model="item.BIRTHDAY.end_val"
-                        allowClear
-                      />
-                      <a-select
-                        v-model="item.BIRTHDAY.unit"
-                        defaultValue="YEAR"
-                        showSearch
-                        :filterOption="filterOption"
-                        allowClear
-                      >
-                        <a-select-option
-                          v-for="v in item.BIRTHDAY.units"
-                          :key="v.con"
-                          :value="v.con"
-                        >
-                         {{ getI18nText(v.title, v.name) }}
-                        </a-select-option>
-                      </a-select>
-                    </div>
-                  </template>
-                  <span :class="['check-date-btn', item.marginx]" @click="checkBirthDay(item)">{{
-                   getI18nText('1.1.5.2', '切换')
-                  }}</span>
-                </a-radio-group>
-              </div>
-              <!-- <a-select
-                v-if="item.con == 'QUOTE'"
-                v-model="item.QUOTE"
-                mode="multiple"
-                :placeholder="$t('1.1.6.7')"
-                :tokenSeparators="['|#|']"
-                style="width: 200px"
-                :filter-option="false"
-                @dropdownVisibleChange="dropdownVisibleChange($event, item)"
-                @search="handleSearch($event, item)"
-                showSearch
-                allowClear
-              >
-                <a-select-option
-                  v-for="sea in item.dataSource"
-                  :key="item.sid + sea.myName"
-                  :value="sea.myName"
-                >
-                  {{ sea.showKeys || sea.myName }}
-                </a-select-option>
-              </a-select> -->
-              <template  v-if="item.con == 'QUOTE' || item.com == 'SelectMui'">
-                <c-tree-select
-                  v-if="item.comType === 'treeSelect'"
-                  :item="item"
-                  :handleGetConfigApi="handleGetConfigApi"
-                  style="margin: 0 8px 8px 0"
-                />
-                <multiSelect
-                  v-else
-                  :item="item"
-                  source="quickSearch"
-                  :maxTagPlaceholder="maxTagPlaceholder"
-                  :outFilterChange="filterChange"
-                  :handleWordBookSearch="handleSearch"
-                  :dropdownVisibleChange="dropdownVisibleChange"
-                  :fetchingWordbook="fetchingWordbook"
-                ></multiSelect>
-              </template>
-
-              <a-checkbox-group
-                class="check-box"
-                v-else-if="item.con == 'CONVERT'"
-                :options="item.setting.showSetting"
-                v-model="item.CONVERT"
-              />
-            </slot>
-          </div>
-        </div>
-      </div>
-      <!-- 跨表 -->
-      <template v-for="(relationItem, i) in relationQuickSearch">
-        <div :key="i" v-if="relationItem.fieldList && relationItem.fieldList.length">
-          <p class="module-title">{{ relationItem.tableName }}</p>
-          <div
-            class="quick-item"
-            v-for="item in relationItem.fieldList"
-            :key="item.sid"
-            :class="{
-              'quick-block':
-                item.con == 'DATE' ||
-                item.con == 'BIRTHDAY' ||
-                item.con == 'CONVERT' ||
-                item.LABELAttr
-            }"
-          >
-            <div class="quick-row">
-              <!-- title -->
-              <div
-                class="quick-item-title"
-                :class="{ 'quick-item-title-default': source !== 'editTable' }"
-              >
-                <span>{{ handleName(item, "title") }}&nbsp;&nbsp;</span>
-              </div>
-              <div
-                class="quick-item-col"
-                :class="{ 'quick-item-col-default': source !== 'editTable' }"
-              >
-                <div v-if="item.LABELAttr">
-                  <slot v-if="item.labelObj && Object.keys(item.labelObj || {}).length > 0">
-                    <div v-for="(v, k) in item.labelObj" :key="k" class="edit-label-content">
-                      <div class="edit-label">{{ k }}：</div>
-                      <div class="edit-content">
-                        <div class="label-content">
-                          <a-checkable-tag
-                            v-for="(v, i) in v.itemList"
-                            v-model="v.isSelect"
-                            @change="handleLabelChange($event, v, item)"
-                            :key="i"
-                            :class="['label-tag-' + handleLabelColorClass(v)]"
-                          >
-                            <a-tooltip placement="topLeft">
-                              <template slot="title">
-                                <span>{{ v.labelName }}</span>
-                              </template>
-                              {{ v.labelName }}
-                            </a-tooltip>
-                          </a-checkable-tag>
-                        </div>
-                      </div>
-                    </div>
-                  </slot>
-                  <a-input v-else style="width: 200px" v-model="item.inputVal"> </a-input>
-                </div>
-
-                <!-- EVALUATE -->
-                <div v-else-if="item.EVALUATEAttr">
-                  <template v-for="tag in EVALUATEList">
-                    <a-checkable-tag
-                      :key="tag.value"
-                      :checked="item.selecteds.indexOf(tag.value) > -1"
-                      @change="checked => handleEvaluateOnChange(tag, checked, item)"
-                    >
-                      {{ tag.label }}
-                    </a-checkable-tag>
-                  </template>
-                  <!-- <a-icon v-if="item.CL" type="close" @click="item.CL = ''" /> -->
-                </div>
-                <!-- EVALUATE -->
-
-                <!-- NUMBERFiled -->
-                <div v-else-if="item.NUMBERFiled" class="ant-calendar-picker" style="width: 300px">
-                  <span
-                    class="ant-calendar-picker-input ant-input num-picker"
-                    :class="{ 'num-picker-unit': item.inputUnit }"
-                  >
-                    <input
-                      v-model="item.lessValue"
-                      @keyup.enter="() => changeFilterNumber(item)"
-                      :title="`起始${item.alias || item.title}`"
-                      :placeholder="`起始${item.alias || item.title}`"
-                      class="ant-calendar-range-picker-input"/>
-                    <span class="ant-calendar-range-picker-separator"> ~ &nbsp;</span>
-                    <input
-                      v-model="item.bigValue"
-                      :title="`截止${item.alias || item.title}`"
-                      @keyup.enter="() => changeFilterNumber(item)"
-                      :placeholder="`截止${item.alias || item.title}`"
-                      class="ant-calendar-range-picker-input"/>
-                    <template v-if="item.inputUnit">&nbsp;{{ item.inputUnit }}</template>
-                    <span
-                      class="ant-input-suffix clear-number-icon"
-                      v-if="item.lessValue || item.bigValue"
-                      @click="clearFilterNumber(item)"
-                      ><i
-                        aria-label="图标: close-circle"
-                        tabindex="-1"
-                        class="anticon anticon-close-circle ant-input-clear-icon"
-                        ><svg
-                          viewBox="64 64 896 896"
-                          data-icon="close-circle"
-                          width="1em"
-                          height="1em"
-                          fill="currentColor"
-                          aria-hidden="true"
-                          focusable="false"
-                          class=""
-                        >
-                          <path
-                            d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 0 1-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z"
-                          ></path></svg></i
-                    ></span>
-                    <span class="ant-calendar-picker-icon"></span
-                  ></span>
-                </div>
-                <!-- NUMBERFiled -->
-
-                <slot v-else>
-                  <template v-if="item.con == 'CL'">
-                    <template v-if="showPercent(item)">
-                      <a-input-number
-                        class="CL-input"
-                        :style="`width: ${getEleWidth(item)}`"
-                        v-model="item.CL"
-                        :min="0"
-                        :max="100"
-                        allowClear
-                      />
-                    </template>
-                    <template v-else>
-                      <a-input class="CL-input" :style="`width: ${getEleWidth(item)}`" v-model="item.CL" allowClear>
-                      </a-input>
-                    </template>
-                  </template>
-                  <template v-if="item.con == 'EQ'">
-                    <template v-if="showPercent(item)">
-                      <a-input-number
-                        class="EQ-input"
-                        :style="`width: ${getEleWidth(item)}`"
-                        v-model="item.EQ"
-                        :min="0"
-                        :max="100"
-                        allowClear
-                      />
-                    </template>
-                    <template v-else>
-                      <a-input
-                        class="EQ-input"
-                        :style="`width: ${getEleWidth(item)}`"
-                        v-model="item.EQ"
-                        :placeholder="item.isPreciseSearch || item.fieldType == 'JSONB' ? '' : getI18nText('1.9.6', '区间搜素用~分割')"
-                        allowClear
-                      >
-                      </a-input>
-                    </template>
-                  </template>
-                  <template v-if="showPercent(item)">&nbsp;%</template>
-                  <!-- date -->
-                  <div v-if="item.con == 'DATE'">
-                    <a-radio-group v-model="item.DATE.con" buttonStyle="solid">
-                      <a-radio-button
-                        v-for="date in dateTeam"
-                        v-show="!item.showDate"
-                        @click="clickRadioGroup(item.DATE, date.con)"
-                        :key="date.con"
-                        :value="date.con"
-                        >{{ getI18nText(date.title, date.name) }}
-                      </a-radio-button>
-                      <span :class="['check-date-btn', item.marginx]" @click="checkDate(item)">{{
-                        getI18nText('1.1.4.53', '开始时间')
-                      }}</span>
-                      <div class="check-date" v-show="item.showDate">
-                        <a-date-picker
-                          format="YYYY-MM-DD HH:mm:ss"
-                          v-model="item.DATE.start_val"
-                          :show-time="{
-                            defaultValue: $moment('00:00:00', 'HH:mm:ss')
-                          }"
-                          :placeholder="'起始日期'"
-                          style="width: 120px"
-                          allowClear
-                        />
-                        &nbsp;
-                        <a-date-picker
-                          format="YYYY-MM-DD HH:mm:ss"
-                          v-model="item.DATE.end_val"
-                          :placeholder="'截止日期'"
-                          :show-time="{
-                            defaultValue: $moment('23:59:59', 'HH:mm:ss')
-                          }"
-                          style="width: 120px"
-                          allowClear
-                        />
-                      </div>
-                    </a-radio-group>
-                  </div>
-                  <!-- <a-select
-                    v-if="item.con == 'QUOTE'"
-                    v-model="item.QUOTE"
-                    mode="multiple"
-                    :placeholder="$t('1.1.6.7')"
-                    :tokenSeparators="['|#|']"
-                    style="width: 200px"
-                    :filter-option="false"
-                    @dropdownVisibleChange="dropdownVisibleChange($event, item)"
-                    @search="handleSearch($event, item)"
-                    showSearch
-                    allowClear
-                  >
-                    <a-select-option
-                      v-for="sea in item.dataSource"
-                      :key="item.sid + sea.myName"
-                      :value="sea.myName"
-                    >
-                      {{ sea.myName }}
-                    </a-select-option>
-                  </a-select> -->
-                  <multiSelect
-                    v-if="item.con == 'QUOTE'"
-                    :item="item"
-                    source="quickSearch"
-                    :maxTagPlaceholder="maxTagPlaceholder"
-                    :outFilterChange="filterChange"
-                    :handleWordBookSearch="handleSearch"
-                    :dropdownVisibleChange="dropdownVisibleChange"
-                    :fetchingWordbook="fetchingWordbook"
-                  ></multiSelect>
-                  <a-checkbox-group
-                    class="check-box"
-                    v-if="item.con == 'CONVERT'"
-                    :options="item.setting.showSetting"
-                    v-model="item.CONVERT"
-                  />
-                </slot>
-              </div>
-            </div>
-          </div>
-        </div>
-      </template>
-    </div>
-
-    <a-modal
-      :title="'设置筛选分类'"
-      :visible="showInner"
-      @ok="saveToCalss"
-      @cancel="cancelSaveToCalss"
-      wrapClassName="quickSearch-saveToClass-modal"
-    >
-      <a-form :form="formInner" :label-col="{ span: 5 }" :wrapper-col="{ span: 18 }">
-        <a-form-item :label="'筛选集名称'">
-          <a-input
-            v-decorator="[
-              'classname',
-              {
-                rules: [{ required: true, message: getI18nText('1.1.6.6', '请输入分类名称') }]
-              }
-            ]"
-          />
-        </a-form-item>
-      </a-form>
-      <a-row>
-        <a-col :span="5" style="text-align: right; color: rgba(0, 0, 0, 0.85)"> 父类名称： </a-col>
-        <a-col :span="18">
-          <div
-            class="edit-tag"
-            v-for="(item, index) in parentNames"
-            :key="index"
-            @dblclick="e => editParentName(e, item)"
-            @click="handleParentNameSelect(item, index)"
-            :class="{ 'edit-tag-select': item.selected && item.disabled }"
-          >
-            <a-input
-              style="width: 100px"
-              :value="item"
-              :disabled="item.disabled"
-              @blur="() => (item.disabled = true)"
-              v-model="item.value"
-            />
-            <a-icon slot="suffix" type="close" @click="handleParentNamesRemove(index, item)" />
-          </div>
-          <template v-if="!parentNamesHasAdd">
-            <a-button
-              v-show="!showAdd"
-              icon="plus"
-              type="dashed"
-              class="add-parent"
-              @click="handleParentNamesAdd"
-            >
-              {{ getI18nText('1.9.363', '添加分类') }}
-            </a-button>
-            <a-input
-              class="edit-tag"
-              v-model.trim="addVal"
-              v-show="showAdd"
-              style="width: 100px"
-              @blur="hanldeBlur"
-            />
-          </template>
-        </a-col>
-      </a-row>
-    </a-modal>
-  </div>
-  <!-- </a-modal> -->
-</template>
-
-<script>
-const EVALUATEList = [
-  {
-    label: "一星",
-    value: "1",
-    isSelect: false
-  },
-  {
-    label: "二星",
-    value: "2",
-    isSelect: false
-  },
-  {
-    label: "三星",
-    value: "3",
-    isSelect: false
-  },
-  {
-    label: "四星",
-    value: "4",
-    isSelect: false
-  },
-  {
-    label: "五星",
-    value: "5",
-    isSelect: false
-  }
-];
-
-const AGEOPTIONS = [
-  {
-    label: "岁",
-    value: "YY"
-  },
-  {
-    label: "月",
-    value: "MM"
-  },
-  {
-    label: "日",
-    value: "DD"
-  }
-];
-import tableSearchCon from "../mixins/tableSearchCon";
-import moment from 'moment';
-import 'moment/locale/zh-cn';
-// antd
-import _ from 'lodash';
-import { Button, Icon, Dropdown, Select, Upload, DatePicker, Input, Menu, Radio, Checkbox, Row, Tag, InputNumber, Col, Form, Modal, Tooltip } from 'ant-design-vue';
-import rangeAge from '../components/range-age/index';
-import multiSelect from '../components/multi-select/multi-select';
-import resize from 'vue-resize-directive';
-import { durationMixin, $utils, filterApiFn } from '../mixins/mixins';
-import vexutils from '@/utils/vexutils';
-import wordBookutils from '../mixins/wordBookutils';
-import cTreeSelect from '../components/c-tree-select/tree-select';
-import create from '@/core/create';
-import utils from '@/utils/utils-map';
-import {dataOptions} from '../const/dataOptions'
-export default create({
-  name: "quick-search",
-  mixins: [durationMixin, $utils, filterApiFn, tableSearchCon],
-  props: {
-    visible: Boolean,
-    searchFieldList: {
-      type: Array,
-      default: () => []
-    },
-    searchFieldLimit: {
-      type: Object,
-      default: () => ({})
-    },
-    quickSearchConfig: Array,
-    source: String,
-    quickSearchListObj: Object,
-    originConditionList: Array,
-    isOrgAdmin: Boolean,
-    lastQuickSearchData: Array,
-    show: Boolean,
-    getFilterData: Function
-  },
-  components: {
-    rangeAge,
-    [Button.name]: Button,
-    [Icon.name]: Icon,
-    [Dropdown.name]: Dropdown,
-    [Select.name]: Select,
-    [Select.Option.name]: Select.Option,
-    [Upload.name]: Upload,
-    [DatePicker.name]: DatePicker,
-    [DatePicker.RangePicker.name]: DatePicker.RangePicker,
-    [Input.name]: Input,
-    [Input.Group.name]: Input.Group,
-    [InputNumber.name]: InputNumber,
-    [Input.Search.name]: Input.Search,
-    [Menu.name]: Menu,
-    [Menu.Item.name]: Menu.Item,
-    [Menu.ItemGroup.name]: Menu.ItemGroup,
-    [Radio.name]: Radio,
-    [Radio.Button.name]: Radio.Button,
-    [Radio.Group.name]: Radio.Group,
-    [Checkbox.name]: Checkbox,
-    [Checkbox.Group.name]: Checkbox.Group,
-    [Row.name]: Row,
-    [Col.name]: Col,
-    [Tag.name]: Tag,
-    AModal: Modal,
-    [Form.name]: Form,
-    [Tooltip.name]: Tooltip,
-    [Form.Item.name]: Form.Item,
-    [Tag.CheckableTag.name]: Tag.CheckableTag,
-    multiSelect,
-    cTreeSelect
-  },
-  computed: {
-    showPercent() {
-      return function(item) {
-        return item.settingObj?.attr === "PERCENTAGE" || false;
-      };
-    },
-    getEleWidth(){
-      return function(item) {
-        return `${item.advanceColWidth||200}px`
-      }
-    },
-    hasRelationQuickSearch() {
-      return this.relationQuickSearch.findIndex(i => i.fieldList && i.fieldList.length) != -1;
-    },
-    parentNamesHasAdd() {
-      if (!this.parentNames.length) return false;
-      return this.parentNames.some(v => v.isAdd);
-    },
-    handleName() {
-      return function(item, key = "name") {
-        return item.alias || item[key];
-      };
-    },
-
-    $moment() {
-      return moment;
-    }
-  },
-  data() {
-    return {
-      modalVisible: this.visible,
-      showInner: false,
-      quickSearch: [],
-      relationTableList: [], // 跨表查询
-      relationQuickSearch: [], // 跨表查询检索条件
-      formData: {},
-      searchItem: {},
-      curWordbookData: undefined,
-      curAutograph: "",
-      dateTeam: [
-        { con: 'TODAY', title: '1.1.4.37', name: '今天' },
-        { con: 'TOMORROW', title: '1.1.4.38', name: '明天' },
-        { con: 'YESTERDAY', title: '1.1.4.39', name: '昨天' },
-        { con: 'THIS_WEEK', title: '1.1.4.40', name: '本周' },
-        { con: 'NEXT_WEEK', title: '1.1.4.41', name: '下周' },
-        { con: 'UP_WEEK', title: '1.1.4.42', name: '上周' },
-        { con: 'THIS_MONTH', title: '1.1.4.43', name: '本月' },
-        { con: 'NEXT_MONTH', title: '1.1.4.44', name: '下月' },
-        { con: 'UP_MONTH', title: '1.1.4.45', name: '上月' },
-        { con: 'THIS_SEASON', title: '1.1.4.46', name: '本季度' },
-        { con: 'NEXT_SEASON', title: '1.1.4.47', name: '下季度' },
-        { con: 'UP_SEASON', title: '1.1.4.48', name: '上季度' },
-        { con: 'THIS_YEAR', title: '1.1.4.49', name: '本年' },
-        { con: 'NEXT_YEAR', title: '1.1.4.50', name: '下年' },
-        { con: 'UP_YEAR', title: '1.1.4.51', name: '上年' }
-      ],
-      birthdayTeam: [],
-      limit_date: "",
-      birthdayUnits: [
-        { title: '1.2.5.58', units: 1, con: 'DAY', name: '天' },
-        { title: '1.2.5.59', units: 2, con: 'WEEK', name: '周' },
-        { title: '1.2.1.11.18', units: 1, con: 'MONTH', name: '月' },
-        { title: '1.9.273', units: 1, con: 'YEAR', name: '岁' },
-      ],
-      isChangeWindow: false,
-      modalWidth: "700px",
-      modalHeight: "60vh",
-      EVALUATEList,
-      AGEOPTIONS,
-      label_max_count: 8,
-      parentNames: [],
-      showAdd: false,
-      addVal: "",
-      fetchingWordbook: false,
-      ...dataOptions
-    };
-  },
-  watch: {
-    visible(value) {
-      this.modalVisible = value;
-      // this.init();
-      this.setDefaultCon(this.quickSearchConfig);
-    },
-    searchFieldList: {
-      immediate: true,
-      deep: true,
-      handler(val) {
-        if (val && val.length > 0) {
-          let { relationTableList = [] } = this.$attrs;
-          this.relationTableList = relationTableList;
-          this.init();
-        }
-      }
-    },
-    quickSearchConfig: {
-      handler(val) {
-        this.setDefaultCon(val);
-      },
-      deep: true
-    },
-    quickSearchListObj: {
-      immediate: true,
-      deep: true,
-      handler(val) {
-        if (!val || !Object.keys(val).length) {
-          this.parentNames = [];
-          return;
-        }
-        this.handleParentName();
-      }
-    },
-    quickSearch: {
-      deep: true,
-      handler() {
-        const conObj = this.getConObjParams() || [];
-        this.$emit("filterCountChange", conObj.length);
-      }
-    },
-    show: {
-      deep: true,
-      handler(newVal) {
-        if (newVal && this.lastQuickSearchData.length > 0) {
-          this.quickSearch = _.cloneDeep(this.lastQuickSearchData);
-        }
-      }
-    }
-  },
-  beforeCreate() {
-    this.formInner = this.$form.createForm(this);
-  },
-  created() {},
-  methods: {
-    filterOption(...arg) {
-      return utils.filterOption(...arg);
-    },
-    handleLabelColor(...arg) {
-      return utils.handleLabelColor(...arg);
-    },
-    init() {
-      this.quickSearch = [];
-      this.relationQuickSearch = [];
-      this.birthdayTeam = this.dateTeam.filter(
-        item => item.con != "THIS_YEAR" && item.con != "NEXT_YEAR" && item.con != "UP_YEAR"
-      );
-      let copyList = _.cloneDeep(this.searchFieldList);
-      let mySearchFieldList = copyList.filter(i => i.isShowSearch == 1 && i.filterExplicit != 1) || [];
-      // let relationTableList = JSON.parse(JSON.stringify(this.relationTableList));
-      let relationTableList = _.cloneDeep(this.relationTableList);
-
-      // 跨表
-      let relationQuickSearch = relationTableList.map(item => {
-        return {
-          fieldList: item.fieldList.fieldList.filter(item => item.isShowSearch == 1 && item.filterExplicit != 1),
-          tableName: item.tableName,
-          primaryField: item.primaryField,
-          parameterConversionId: item.parameterConversionId,
-          tableId: item.tableId,
-          relationField: item.relationField,
-          converFun: item.converFun,
-          relationOrgId: item.relationOrgId,
-          preConObj: item.preConObj,
-          preSqlExpression: item.preSqlExpression
-        };
-      });
-
-      this.$set(this, "relationQuickSearch", relationQuickSearch);
-      // 过滤获取 快速检索的字段
-      this.quickSearch = mySearchFieldList || [];
-      this.handlerInitSearchItem(this.quickSearch);
-      this.relationQuickSearch.forEach(item => {
-        this.handlerInitSearchItem(item.fieldList);
-      });
-    },
-    handleParentName() {
-      let parentNames = [];
-      let { displayCategoryList = [] } = this.quickSearchListObj;
-      if (!displayCategoryList || !displayCategoryList.length) {
-        this.parentNames = [];
-        return;
-      }
-      displayCategoryList.forEach(item => {
-        if (item !== "未分类") {
-          parentNames.push({
-            disabled: true,
-            selected: false,
-            value: item
-          });
-        }
-      });
-      this.parentNames = parentNames;
-    },
-    setDefaultCon(val) {
-      if (!val.length) {
-        this.quickSearch.forEach((item, index) => {
-          if (item.CONVERT && Array.isArray(item.CONVERT)) {
-            this.$set(this.quickSearch[index], "CONVERT", []);
-          }
-        });
-        return false;
-      }
-
-      this.quickSearch.forEach((item, index) => {
-        let find = val.find(valItem => valItem.field_key === item.columnName);
-        if (find) {
-          let value = find.value.map(item => JSON.stringify(item));
-          this.$set(this.quickSearch[index], "CONVERT", value);
-        } else {
-          this.$set(this.quickSearch[index], "CONVERT", []);
-        }
-      });
-    },
-    handlerInitSearchItem(arr) {
-      if (!Array.isArray(arr)) return;
-      arr.forEach(el => {
-        const isPreciseSearch = el?.settingObj?.isPreciseSearch || "";
-
-        if (el.setting) {
-          // el.seting 可能是 string / object
-          el.setting = typeof el.setting == "string" ? JSON.parse(el.setting) : el.setting;
-
-           let advanceOptionSetting = el?.advanceOptionSetting;
-          //  单选
-           let optionSetting0  =String(advanceOptionSetting) == '0';
-          if (!vexutils.isEmpty(el.setting.wordbook)) {
-            let isTree = "tree" === el?.setting?.wordbook?.showType;
-            let comType = isTree ? 'treeSelect' : 'SelectMuiWordBook';
-            let defVal = isTree ? [] : [];
-            if(optionSetting0){
-              defVal = ""
-            }
-            this.$set(el, "con", "QUOTE");
-            this.$set(el, "dataSource", []);
-            this.$set(el, "QUOTE", []);
-            this.$set(el, "value", defVal);
-            this.$set(el, "com", "SelectMui");
-            this.$set(el, "comType", comType);
-            this.$set(el, "searchPageConfig", {
-              keyword: undefined,
-              isRequest: false, // 是否已请求
-              page: 1, // 当前页
-              total: 1, // 总页数
-              hasNextPage: false
-            });
-            return;
-          } else if (el.setting.showSetting && el.setting.showSetting.length > 0) {
-            this.$set(el, "con", "CONVERT");
-            let showSetting = el.setting.showSetting;
-
-            // 字典推荐值
-            let dictionItem = this.handleDictionDef(el);
-            if (dictionItem) {
-              showSetting.unshift(dictionItem);
-            }
-            showSetting.forEach(set => {
-              set.label = set.change_text;
-              set.value = JSON.stringify(set.filter);
-            });
-            // el.setting.showSetting.forEach(set => {
-            //   this.$set(set, "label", set.change_text);
-            //   this.$set(set, "value", JSON.stringify(set.filter));
-            // });
-            /**
-             * 映射方式的单选模式
-             */
-            if(optionSetting0){
-              this.$set(el, "com", "SelectMui");
-              this.$set(el, "comType", "SelectMui");
-              const labelList = el.setting.showSetting.map(i => {
-                i.labelName = i.change_text;
-                return i;
-              });
-              this.$set(el, "labelList", labelList);
-            }
-
-            this.$set(el.setting, "showSetting", showSetting);
-            this.$set(el, "CONVERT",optionSetting0? "": []);
-            return;
-          }
-        }
-        if (el.setting.attr === "LABEL") {
-          this.$set(el, "con", "CL"); // 2020-09-04 朱亚徽 EQ => CL
-          this.$set(el, "LABELAttr", true);
-          this.$set(el, "labelSelectList", []);
-          this.$set(el, "inputVal", "");
-          this.handleSetLabelOptions(el.setting.labelType, el);
-        } else if (el.setting.attr === "EVALUATE") {
-          this.$set(el, "con", "CL");
-          this.$set(el, "selecteds", []);
-          this.$set(el, "EVALUATEAttr", true);
-        } else if (el.setting.attr === "AGE" && el.fieldType != "NUMBER") {
-          // 年龄组件
-          let format = el.setting.format || "YYYY-MM-DD";
-          format = format.toUpperCase();
-          this.$set(el, "con", "IN");
-          this.$set(el, "ageObj", {});
-          this.$set(el, "format", format);
-          this.$set(el, "AGEAttr", true);
-        } else if (el.setting.attr === "PASSWORD") {
-          this.$set(el, "comAttr", "PASSWORD");
-          this.$set(el, "PASSWORDTYPE", true);
-        } else if (el.fieldType == "NUMBER") {
-          this.$set(el, "con", "EQ");
-          this.$set(el, "EQ", "");
-          this.$set(el, "NUMBERFiled", true);
-          this.$set(el, "lessValue", "");
-          this.$set(el, "bigValue", "");
-          if (el.setting.attr == "PERCENTAGE") {
-            this.$set(el, "inputUnit", "%");
-          }
-        } else if (el.fieldType.includes("DATE")) {
-          if (el.settingObj && el.settingObj.attr == "BIRTHDAY") {
-            this.$set(el, "con", "BIRTHDAY");
-            this.$set(el, "showDate", false);
-            this.$set(el, "marginx", "ml");
-            this.$set(el, "BIRTHDAY", this.initBirthdayParams());
-          } else {
-            // 判断是否有默认值
-            const value = this.getSearchDefValueByLimit(el, this.searchFieldLimit);
-            let hasValue = Array.isArray(value);
-            let advanceOptionSetting = el?.advanceOptionSetting;
-            // 选择时间模式
-            let optionSetting1  =String(advanceOptionSetting) == '1'
-
-            this.$set(el, "con", "DATE");
-            this.$set(el, "showDate", optionSetting1 || hasValue);
-            this.$set(el, "marginx",optionSetting1 ||  hasValue ? "mr" : "ml");
-            this.$set(el, "DATE", {
-              con: hasValue ? "IN" : null,
-              start_val: hasValue ? value[0] : null,
-              end_val: hasValue ? value[1] : null
-            });
-            let dateTeam = optionSetting1 ? [] : this[`dateTeam${advanceOptionSetting}`] || this.dateTeam0;
-            this.$set(el, 'dateTeam' , dateTeam)
-          }
-        } else if (el.fieldType == "TEXT") {
-          /**
-           * NUMBER和TEXT属性字段
-           * 如果 开启了精准搜索，则传条件的时候 要传 EQ
-           * isPreciseSearch: 0/1
-           */
-          let con = isPreciseSearch == 1 ? 'EQ': 'CL';
-          this.$set(el, "con", con);
-          this.$set(el, "isPreciseSearch", isPreciseSearch == 1);
-          this.$set(el, con, "");
-        } else if (el.fieldType == "JSONB") {
-          this.$set(el, "con", "EQ");
-          this.$set(el, "EQ", "");
-        }
-      });
-    },
-    // 字典推荐值 item处理
-    handleDictionDef(el) {
-      let { defaultValue, defaultValueTitle } = el?.dictionarieObj || {};
-      let dictionItem = null;
-      if (defaultValue && defaultValueTitle) {
-        dictionItem = {
-          change_text: defaultValueTitle,
-          filter: [
-            {
-              con: "EQ",
-              field_key: el.columnName,
-              value: defaultValue
-            }
-          ]
-        };
-      }
-      return dictionItem;
-    },
-    checkDate(item) {
-      item.showDate = !item.showDate;
-      item.showDate ? (item.marginx = "mr") : (item.marginx = "ml");
-    },
-    checkBirthDay(item) {
-      item.showDate = !item.showDate;
-    },
-    getWordbookData(o, obj) {
-      let { id, filterKeys, wordbookType } = o;
-      this.fetchingWordbook = true;
-      let resFieldKeys = Array.isArray(filterKeys) ? JSON.stringify(filterKeys) : filterKeys;
-      let url = `/tableReader/getWordbookData`;
-      let params = {
-        wordbookId: id,
-        fieldKeys: resFieldKeys,
-        wordbookType: wordbookType || "WORDBOOK",
-        asyncCount: 1, // 开启性能模式
-        ...obj
-      };
-      return this.handleGetConfigApi(params, 'requestGetWordbookData', { fields: o }).then(res => {
-        this.fetchingWordbook = false;
-        if(typeof res.data === 'object'){
-          res.data.reqParams =  params;
-        }
-        return res;
-      }).catch(() => {
-        this.fetchingWordbook = false;
-      });
-    },
-    handleWordbookData(item, data, params) {
-      this.$set(item, "hasFieldList", false);
-      const {rows,hasFieldList,searchPageConfig} = wordBookutils.handleWordbookData(item,data,params);
-      this.$set(item, "hasFieldList", hasFieldList);
-      this.$set(item, "dataSource", rows);
-      item.searchPageConfig = Object.assign(item.searchPageConfig, searchPageConfig);
-    },
-    filterChange() {},
-    maxTagPlaceholder(item) {
-      if (Array.isArray(item.value)) {
-        return item.value.length;
-      } else {
-        return 1;
-      }
-    },
-    dropdownVisibleChange(open, item) {
-       if (item.comType == "SelectMui" && String(item.advanceOptionSetting) === '0') return;
-      if (open) {
-        let obj = {};
-        if (item.setting.wordbook.params) {
-          item.setting.wordbook.params.forEach(item => {
-            obj[item.p_name] = item.p_value;
-          });
-        }
-        if (item.settingObj.wordbook) {
-          obj.autograph = item.settingObj.wordbook.autograph;
-        }
-        this.curWordbookData = item.setting.wordbook;
-        this.curAutograph = item.settingObj.wordbook && item.settingObj.wordbook.autograph;
-        this.searchItem = item;
-        this.getWordbookData(item.setting.wordbook, obj).then(({ data }) => {
-          this.handleWordbookData(item, data, obj);
-        });
-      }
-    },
-    /**
-     * 输入自动联想
-     */
-    handleSearch(value, item, config={}) {
-      if (item.comType == "SelectMui" && String(item.advanceOptionSetting) === '0') return;
-      let params = {
-        keyword: value,
-        autograph: this.curAutograph
-      };
-      let obj = {};
-      let p = item?.setting?.wordbook?.params || undefined;
-      if (p) {
-        item.setting.wordbook.params.forEach(item => {
-          obj[item.p_name] = item.p_value;
-        });
-      }
-      let rp = { ...params, ...obj, ...config };
-      this.getWordbookData(this.curWordbookData, rp).then(({ data }) => {
-        this.handleWordbookData(this.searchItem, data, rp);
-      });
-    },
-    onSave() {
-      let mergeConObj = this.getMergeConObj();
-      this.resetChangeWindow();
-
-      if (!this.validConObj(mergeConObj, this.searchFieldList, this.searchFieldLimit)) return false;
-      this.$emit("onSave", mergeConObj);
-      return this.quickSearch;
-    },
-    // 方便外部调用
-    getMergeConObj() {
-      let conObj = this.getConObjParams() || [];
-      let mergeConObj = [...conObj];
-      // 合并表格表头未设置高级筛选的筛选项
-      this.quickSearchConfig.forEach(i => {
-        let find = mergeConObj.find(j => {
-          return i.field_key === j.field_key;
-        });
-        if (
-          !find &&
-          !this.quickSearch.find(item => {
-            return item.columnName === i.field_key;
-          })
-        ) {
-          mergeConObj.push(i);
-        }
-      });
-      return mergeConObj || [];
-    },
-    getConObjParams() {
-      let conObj = this.getConObj(this.quickSearch) || [];
-      let realation = [];
-      this.relationQuickSearch.forEach(item => {
-        let curQuote = this.getConObj(item.fieldList);
-        if (curQuote && curQuote.length) {
-          realation.push({
-            field_key: item.primaryField,
-            valueField: item.relationField,
-            con: "QUOTE_IN",
-            tableId: item.tableId,
-            parameterConversionId: item.parameterConversionId,
-            converFun: item.converFun,
-            preConObj: item.preConObj,
-            relationOrgId: item.relationOrgId,
-            preSqlExpression: item.preSqlExpression,
-            quote_con: {
-              conObj: this.getConObj(item.fieldList),
-              sqlExpression: ""
-            }
-          });
-        }
-      });
-      conObj.push(...realation);
-      return conObj || [];
-    },
-    closeModal() {
-      this.resetChangeWindow();
-      this.$emit("closeModal");
-    },
-    resetChangeWindow() {
-      this.modalWidth = "700px";
-      this.modalHeight = "60vh";
-      this.isChangeWindow = false;
-    },
-    // 填写搜索设置条件后打开新增搜索分类名称弹框
-    openSaveToCalss() {
-      let conObj = this.getConObjParams();
-      if (!conObj) return;
-      if (conObj.length > 0) {
-        if (!this.validConObj(conObj, this.searchFieldList, this.searchFieldLimit)) return;
-        this.showInner = true;
-      } else {
-        this.$message.warning(this.getI18nText('1.1.6.18', '请设置搜索条件'), 2);
-      }
-    },
-    // 格式化设置搜索条件参数
-    getConObj(arr) {
-      // this.quickSearch
-      if (!Array.isArray(arr)) {
-        return [];
-      }
-      let conObj = [];
-      for (let i = 0; i < arr.length; i++) {
-        let item = arr[i];
-        let value = "";
-        let limit_date = "";
-        let advanceOptionSetting = item?.advanceOptionSetting;
-          //  单选
-        let optionSetting0  =String(advanceOptionSetting) === '0';
-        if (item.EQ || item.CL) {
-          value = item.EQ || item.CL;
-          if (item.settingObj?.attr === "PERCENTAGE") {
-            value = Number(value) / 100;
-          }
-          if (item.EVALUATEAttr) {
-            value = item.selecteds.join("|#|");
-          }
-        } else if (item.con == "QUOTE" && !vexutils.isEmpty(item.value)) {
-          // value = item.QUOTE.join("|#|");
-          if(item.comType == "treeSelect"){
-            let cval = item.value;
-            if(typeof cval === 'string'){
-              [cval]  = cval.split('<&=&>');
-              value = cval;
-            }  else if(Array.isArray(cval)) {
-              cval = cval.map((v)=>{
-                let [k] = typeof v === 'string' ? v.split('<&=&>'): [];
-                return k;
-              })
-              value = cval.join("|#|");
-            }
-          } else {
-            value = item.value.join("|#|");
-          }
-        } else if (!vexutils.isEmpty(item.CONVERT)) {
-          value = item.CONVERT.map(item => {
-            if (item && vexutils.isJSON(item)) {
-              return JSON.parse(item);
-            }
-            return item;
-          });
-        } else if((item.comType == 'SelectMui'&& optionSetting0)){
-          let i = item.value;
-          let c = item?.labelList[i];
-          if (item.con == "CONVERT") {
-           value = c?.filter
-          } else {
-           value= c?.labelName;
-          }
-        } else if (item.DATE && !item.AGEAttr) {
-          // 年龄组件的不按照 date 类型处理
-          if (item.DATE.start_val || item.DATE.end_val) {
-            item.DATE.con = "IN";
-          }
-          item.tempCon = item.DATE.con;
-          item.start_val = item.DATE.start_val
-            ? item.DATE.start_val.format("YYYY-MM-DD HH:mm:ss")
-            : "";
-          item.end_val = item.DATE.end_val ? item.DATE.end_val.format("YYYY-MM-DD HH:mm:ss") : "";
-        } else if (item.BIRTHDAY) {
-          // 生日
-          let isChange = false;
-          if (
-            item.BIRTHDAY.limit_date.length > 0 ||
-            item.BIRTHDAY.start_val ||
-            item.BIRTHDAY.end_val
-          ) {
-            item.BIRTHDAY.con = "IN";
-          }
-          item.tempCon = item.BIRTHDAY.con;
-          // 因为年龄下拉有个默认值, 当输入框中有值时才取下拉值
-          if (item.BIRTHDAY.start_val || item.BIRTHDAY.end_val) {
-            isChange = true;
-          } else {
-            isChange = false;
-          }
-
-          // 校验
-          if (item.BIRTHDAY.start_val) {
-            let res = vexutils.validateBirthday(
-              item.BIRTHDAY.start_val,
-              item.title,
-              item.BIRTHDAY.unit
-            );
-            if (!res) return;
-          }
-          if (item.BIRTHDAY.end_val) {
-            let res = vexutils.validateBirthday(
-              item.BIRTHDAY.end_val,
-              item.title,
-              item.BIRTHDAY.unit
-            );
-            if (!res) return;
-          }
-          if (+item.BIRTHDAY.start_val > +item.BIRTHDAY.end_val) {
-            this.$message.warning(this.getI18nText(['1.9.47', { title: item.title }], `${item.title}请输入有效范围`), 2);
-            return;
-          }
-
-          limit_date = this.limit_date || "";
-          item.unit = isChange ? item.BIRTHDAY.unit || "" : "";
-          item.start_val = item.BIRTHDAY.start_val || "";
-          item.end_val = item.BIRTHDAY.end_val || "";
-        }
-        // 根据属性判断取值
-        if (item.LABELAttr) {
-          if (Object.keys(item.labelObj || {}).length > 0) {
-            let valList = [];
-            item.labelSelectList.forEach(v => {
-              valList.push(v.labelName);
-            });
-            value = valList.join("|#|");
-          } else {
-            value = item.inputVal;
-          }
-        } else if (item.EVALUATEAttr) {
-          value = item.selecteds.join("|#|");
-        } else if (item.AGEAttr) {
-          value = "";
-        } else if (item.NUMBERFiled && item.lessValue && item.bigValue) {
-          if (item.setting?.attr === "PERCENTAGE") {
-            value = Number(item.lessValue) / 100 + "~" + Number(item.bigValue) / 100;
-          } else {
-            value = item.lessValue + "~" + item.bigValue;
-          }
-        }
-        // 删除字符串前后空格
-        if (value && vexutils.isString(value)) {
-          value = value.trim();
-        }
-        let temp = {
-          field_key: item.columnName, // 一级value
-          con: item.DATE || item.BIRTHDAY ? item.tempCon : item.con, // 二级选择项value
-          value: value, // input输入值
-          limit_date: limit_date || "", // 生日
-          start_val: item.start_val || "", // 开始时间
-          end_val: item.end_val || "", // 结束时间
-          unit: item.unit || "", // 年龄
-          id: item.id
-        };
-        conObj.push(temp);
-      }
-      let dateCons = this.dateTeam.map(item => item.con);
-      let res = conObj.filter(
-        item =>
-          item.value ||
-          item.limit_date ||
-          item.start_val ||
-          item.end_val ||
-          dateCons.includes(item.con)
-      );
-      return res;
-    },
-    range(start, end) {
-      const result = [];
-      for (let i = start; i < end; i++) {
-        result.push(i);
-      }
-      return result;
-    },
-    // 日期选择范围
-    disabledDate(current) {
-      return (
-        (current && current < moment().startOf("year")) ||
-        current > moment().endOf("year")
-      );
-    },
-    changeRange(date, dateString) {
-      // 这里没有使用item中的limit_date, 而是用全局的变量limit_date储存
-      // 原因是因为range-picker 要求是个[] 并且v-model中的数据是个moment对象 即item.BIRRHDAY.limit_date = [moment, moment]
-      if (dateString[0]) {
-        this.limit_date = dateString.join("~");
-      } else {
-        this.limit_date = "";
-      }
-    },
-    // 填写新增搜索分类名称后保存按钮
-    saveToCalss() {
-      this.formInner.validateFields((err, values) => {
-        if (err) return;
-        let conObj = this.getConObjParams();
-        if (!conObj.length) {
-          conObj = [];
-        }
-        let displayCategory = this.parentNames.filter(item => item.selected)[0]?.value;
-        let params = {
-          tableId: this.$attrs.tableId || "",
-          setting: JSON.stringify({
-            displayCategory,
-            name: values.classname,
-            conObj: conObj
-          }),
-          conditionList: JSON.stringify(this.originConditionList)
-        };
-        this.saveTableCondiTion(params);
-
-      });
-    },
-    handleParentNamesAdd(e) {
-      const nextInput = e?.target?.nextElementSibling;
-      setTimeout(() => {
-        nextInput && nextInput.focus();
-      });
-      this.showAdd = true;
-    },
-    hanldeBlur() {
-      this.showAdd = false;
-      if (!this.addVal) return;
-      this.parentNames.forEach(v => (v.selected = false));
-      this.parentNames.push({
-        disabled: true,
-        value: this.addVal,
-        selected: true,
-        isAdd: true
-      });
-      this.addVal = "";
-    },
-    editParentName(e, item) {
-      item.disabled = false;
-      setTimeout(() => {
-        e.target.focus();
-      }, 0);
-    },
-    handleParentNameSelect(item, index) {
-      if (!item.disabled) return;
-      this.parentNames.forEach((pItem, pIndex) => {
-        if (pIndex !== index) {
-          pItem.selected = false;
-        }
-      });
-      item.selected = !item.selected;
-    },
-    handleParentNamesRemove(index, item) {
-      this.handleParent(index, item);
-    },
-    handleParent(index, item) {
-      let { conditionList = [] } = this.quickSearchListObj;
-      if (!conditionList || !conditionList.length) {
-        this.parentNames.splice(index, 1);
-        return;
-      }
-      let hasItem = conditionList.filter(v => v.displayCategory === item.value);
-      if (!hasItem || !hasItem.length) {
-        this.parentNames.splice(index, 1);
-        return;
-      }
-      this.$message.error("该分类下有已有数据，请删除该分类下的筛选集后重试！");
-    },
-    // 7.12保存列表搜索分类
-    async saveTableCondiTion(params) {
-      // let url = `/tableList/saveTableCondiTion`;
-      // this.axios.post(url, this.$qs.stringify(params)).then(({ data }) => {
-      //   if (data.result == "SUCCESS") {
-      //     this.showInner = false;
-      //     this.formInner.resetFields();
-      //     this.$emit("updateTableCondiTion");
-      //     this.clearData();
-      //     this.closeModal();
-      //   } else {
-      //     this.$message.error(data.resultMsg);
-      //   }
-      // });
-      try {
-        let res = await this.handleGetConfigApi(params, 'requestSaveTableCondiTion');
-        if (!res) return;
-        this.showInner = false;
-        this.formInner.resetFields();
-        this.$emit("updateTableCondiTion");
-        this.clearData();
-        this.closeModal();
-      } catch (error) {
-        console.log(error)
-      }
-    },
-    cancelSaveToCalss() {
-      this.showInner = false;
-    },
-    // 清空快速搜索设置条件
-    clearData() {
-      this.handlerReset(this.quickSearch);
-      this.relationQuickSearch.forEach(item => {
-        this.handlerReset(item.fieldList);
-      });
-      if (this.source === "editTable") {
-        this.$emit("clearQuickSearchConfig");
-        return;
-      }
-      this.$listeners?.clearQuickSearchConfig();
-    },
-    handlerReset(arr) {
-      if (!Array.isArray(arr)) {
-        return;
-      }
-      arr.forEach(item => {
-        if (item.EQ || item.CL) {
-          item.EQ = "";
-          item.CL = "";
-        } else if (item.con == "QUOTE" && !vexutils.isEmpty(item.value)) {
-          item.QUOTE = [];
-          item.value = [];
-        } else if (!vexutils.isEmpty(item.CONVERT)) {
-          item.CONVERT = [];
-        } else if (item.DATE) {
-          item.showDate = false;
-          item.marginx = "ml";
-          item.DATE = {
-            con: null,
-            start_val: null,
-            end_val: null
-          };
-        } else if (item.BIRTHDAY) {
-          item.showDate = false;
-          item.marginx = "ml";
-          item.BIRTHDAY = this.initBirthdayParams();
-        } else if (item.LABELAttr) {
-          this.handleClearLabel(item);
-        } else if (item.EVALUATEAttr) {
-          item.selecteds = [];
-        } else if (item.AGEAttr) {
-          this.handleResetAge(item);
-        } else if (item.NUMBERFiled) {
-          this.clearFilterNumber(item);
-        }
-      });
-    },
-    initBirthdayParams() {
-      this.limit_date = "";
-      return {
-        con: null,
-        limit_date: [],
-        start_val: null,
-        end_val: null,
-        unit: "YEAR",
-        units: this.birthdayUnits.filter(i => i.units === 1)
-      };
-    },
-    // 单选按钮组合点击取消选中状态
-    clickRadioGroup(item, con) {
-      if (item.con == con) {
-        item.con = null;
-      } else {
-        if (item.con === "IN") {
-          item.start_val = null;
-          item.end_val = null;
-        }
-        item.con = con;
-      }
-    },
-    clickBirthdayRadioGroup(item, con) {
-      this.limit_date = "";
-      Object.assign(item, this.initBirthdayParams());
-      this.clickRadioGroup(item, con);
-    },
-    changeModalWindow() {
-      this.isChangeWindow = !this.isChangeWindow;
-      let docHeight = document.body.clientHeight;
-      this.modalWidth = this.modalWidth === "700px" ? `100%` : "700px";
-      this.modalHeight = this.modalHeight === "60vh" ? `${docHeight - 108}px` : "60vh";
-
-      if (this.modalWidth === "700px") {
-        this.label_max_count = 8;
-      } else {
-        this.$nextTick(() => {
-          let ele = document.querySelector(".quickSearch_label-container");
-          ele && (this.label_max_count = parseInt((ele.clientWidth - 20) / 112) * 2);
-        });
-      }
-    },
-
-    /* 获取 label */
-    handleRequestedLabel(v) {
-      let params = { type: v, pageSize: 10000 };
-      return this.axios.get("/label/list", { params: params });
-    },
-
-    async handleSetLabelOptions(labelType, el) {
-      let labelObj = {};
-      let labelList = await this.handleGetConfigApi(labelType, 'requestedLabel');
-      labelList.forEach(n => {
-        this.$set(n, 'isSelect', false);
-        if (labelObj[n.typeName]) {
-          labelObj[n.typeName].itemList.push({ ...n });
-        } else {
-          labelObj[n.typeName] = {
-            itemList: [{ ...n }],
-            showAdd: false,
-            addVal: '',
-            typeName: n.typeName,
-            typeId: n.typeId,
-            isUnfold: false,
-            isShowBtn: false
-          };
-        }
-      });
-      this.$set(el, 'labelObj', labelObj);
-      this.$set(el, 'labelList', labelList);
-    },
-
-    handleLabelColorClass(item) {
-      return item?.color?.split("-")[1] || "yellow";
-    },
-
-    handleLabelChange() {
-      const args = arguments;
-      if (args.length === 3) {
-        let [flag, item, options] = [...arguments];
-        let selectedList = options.labelSelectList || [];
-        if (flag) {
-          if (selectedList.some(n => n.labelId == item.labelId)) {
-            return;
-          }
-          selectedList.push(item);
-        } else {
-          let fdIndex = selectedList.findIndex(n => n.labelId == item.labelId);
-          if (fdIndex != -1) {
-            selectedList.splice(fdIndex, 1);
-          }
-        }
-        options.labelSelectList = selectedList;
-      }
-    },
-
-    handleClearLabel(v) {
-      v.labelSelectList.length = 0;
-      v.inputVal = "";
-      Object.entries(v.labelObj || {}).forEach(h => {
-        let [, item] = h;
-        item.itemList.forEach(l => {
-          l.isSelect = false;
-        });
-      });
-    },
-
-    handleLabelUpfold(v) {
-      console.log('触发---isUnfold');
-      v.isUnfold = !v.isUnfold;
-    },
-
-    handleEvaluateOnChange(tag, checked, item) {
-      if (checked) {
-        item.selecteds.push(tag.value);
-      } else {
-        let i = item.selecteds.findIndex(v => v === tag.value);
-        item.selecteds.splice(i, 1);
-      }
-    },
-
-    // 年龄组件变化
-    ageRangeOnChange(obj, item) {
-      let s = obj.star_val;
-      let e = obj.end_val;
-      this.$set(item, "start_val", isNaN(s) ? undefined : s);
-      this.$set(item, "end_val", isNaN(e) ? undefined : e);
-    },
-
-    // 清空年龄组件
-    handleResetAge(item) {
-      this.$set(item, "start_val", "");
-      this.$set(item, "end_val", "");
-      let key = `${item.columnName}_AGEAttr`;
-      let curRef = this.$refs[key];
-      if (Array.isArray(curRef)) {
-        curRef = curRef[0] || false;
-      }
-      curRef?.reset();
-    },
-
-    onResize(el, v) {
-      let height = el.offsetHeight || 0;
-      // let ch = el?.firstElementChild?.offsetHeight || 0;
-      if (!height) {
-        return;
-      }
-      if (height > 80) {
-        v.isShowBtn = true;
-      } else {
-        v.isShowBtn = false;
-        v.isUnfold = false;
-      }
-    },
-    changeFilterNumber(item) {
-      if (item.lessValue && item.bigValue) {
-        const lessValue = item.lessValue;
-        const bigValue = item.bigValue;
-        if (bigValue < lessValue) {
-          this.$set(item, "lessValue", bigValue);
-          this.$set(item, "bigValue", lessValue);
-        }
-        return;
-      }
-    },
-    clearFilterNumber(item) {
-      this.$set(item, "lessValue", "");
-      this.$set(item, "bigValue", "");
-    },
-
-    getI18nText(i, d) {
-      if (Array.isArray(i)) {
-        return this.$t ? this.$t.apply(this, i) : d;
-      }
-      return this.$t ? this.$t(i) : d;
-    }
-  },
-  directives: { resize }
-});
-</script>
-
-<style lang="less" scoped>
-.form-box {
-  .quick-item {
-    margin-bottom: 10px;
-    min-width: 32px;
-
-    .quick-row {
-      display: flex;
-      > div {
-        display: inline-block;
-        box-sizing: border-box;
-      }
-      .quick-item-title {
-        min-width: 80px;
-        line-height: 32px;
-        text-align: right;
-        padding-left: 12px;
-        color: #000;
-      }
-      .quick-item-col {
-        padding: 0 12px;
-      }
-      .quick-item-title-default {
-        width: 25%;
-      }
-      .quick-item-col-default {
-        width: 75%;
-      }
-    }
-    .check-box {
-      line-height: 32px;
-    }
-    .check-date-btn {
-      display: inline-block;
-      line-height: 32px;
-      height: 32px;
-      padding: 0 10px;
-      background-color: #ddd;
-      cursor: pointer;
-      &.ml {
-        margin-left: 20px;
-      }
-      &.mr {
-        margin-right: 20px;
-      }
-    }
-    .check-date {
-      display: inline-block;
-      line-height: 33px;
-    }
-    .birthday-item {
-      > div {
-        margin-top: 5px;
-        p {
-          display: inline-block;
-          margin: 0 20px;
-        }
-        > span {
-          margin-top: 5px;
-        }
-      }
-      .age-wrap {
-        display: inline-block;
-      }
-    }
-    /deep/ .ant-input-wrapper {
-      .ant-input-group-addon {
-        border: 1px solid #d9d9d9 !important;
-        border-left: 0 !important;
-      }
-    }
-
-    /deep/ .num-picker {
-      position: relative;
-      display: flex;
-      &.num-picker-unit {
-        padding-right: 20px;
-      }
-      input {
-        text-align: left !important;
-      }
-      &:hover {
-        .clear-number-icon {
-          display: block;
-        }
-      }
-      /deep/ .ant-calendar-range-picker-input {
-        text-align: left;
-      }
-      .clear-number-icon {
-        position: absolute;
-        right: 5px;
-        top: 6px;
-        display: none;
-        cursor: pointer;
-        z-index: 1000;
-      }
-    }
-  }
-  .ant-radio-button-wrapper {
-    padding: 0 8px;
-    height: 30px;
-    line-height: 30px;
-    margin-top: 5px;
-  }
-
-  // 标签
-  .label-attr-container {
-    .edit-label {
-      color: #000000;
-      font-size: 14px;
-      line-height: 32px;
-      padding-left: 0;;
-    }
-    .label-container-height {
-      overflow: hidden;
-      // width: 380px;
-      height: 74px;
-      flex: none;
-    }
-    .edit-content {
-      padding: 0;
-    }
-    .label-unfold-btn {
-      margin: 8px 0;
-      color: rgba(0, 0, 0, 0.6);
-      cursor: pointer;
-      >span {
-        display: flex;
-        align-items: center;
-        line-height: 1;
-      }
-      .anticon {
-        font-size: 16px;
-        margin-left: 8px;
-      }
-      &:hover {
-        color: #2d7aff;
-      }
-      &:active {
-        color: #2d7aff;
-      }
-    }
-  }
-  &.quick-search-table {
-    .module-title {
-      color: #506493;
-      line-height: 20px;
-      padding-left: 12px;
-      border-left: 4px solid #2d7aff;
-    }
-    .quick-item {
-      display: inline-block;
-      &.quick-block {
-        display: block;
-      }
-    }
-  }
-
-  .psw-icon {
-    cursor: pointer;
-    &:active {
-      color: #5585f5;
-      // #2474ff
-    }
-    color: #969696;
-  }
-
-  ::-webkit-input-placeholder {
-    /* WebKit browsers */
-    font-family: "Avenir", Helvetica, Arial, sans-serif;
-  }
-
-  ::-moz-placeholder {
-    /* Mozilla Firefox 19+ */
-    font-family: "Avenir", Helvetica, Arial, sans-serif;
-  }
-
-  :-ms-input-placeholder {
-    /* Internet Explorer 10+ */
-    font-family: "Avenir", Helvetica, Arial, sans-serif;
-  }
-}
-// .age-container {
-// }
-</style>
-<style lang="less">
-.quickSearch-saveToClass-modal {
-  .edit-tag {
-    position: relative;
-    display: inline-block;
-    margin-right: 10px;
-    margin-bottom: 10px;
-    .add-parent {
-      border-color: #d9d9d9;
-    }
-    .anticon-close {
-      position: absolute;
-      right: 5px;
-      line-height: 36px;
-      color: #2d7aff;
-    }
-    .ant-input-disabled {
-      color: #2d7aff;
-      background-color: rgba(45, 122, 255, 0.1);
-      opacity: 1;
-      border-color: #2d7aff;
-      cursor: pointer;
-    }
-    .ant-input-group-addon,
-    .ant-input:not(:hover),
-    .ant-input-number:not(:hover) {
-      border-color: #2d7aff !important;
-    }
-    &.edit-tag-select {
-      .ant-input-disabled {
-        color: #fff;
-        background-color: #2d7aff;
-      }
-      .anticon-close {
-        color: #fff;
-      }
-    }
-  }
-}
-</style>
+
+<template>
+  <div>
+    <div class="form-box" :class="{ 'quick-search-table': source === 'editTable' }">
+      <p class="module-title" v-if="source === 'editTable' && hasRelationQuickSearch">高级筛选</p>
+      <div
+        class="quick-item"
+        v-for="item in quickSearch"
+        :key="item.sid"
+        :class="{
+          'quick-block':
+            item.con == 'DATE' || item.con == 'BIRTHDAY' || item.con == 'CONVERT' || item.LABELAttr
+        }"
+      >
+        <div class="quick-row">
+          <!-- title -->
+          <div
+            class="quick-item-title"
+            :class="{ 'quick-item-title-default': source !== 'editTable' }"
+          >
+            <span>{{ handleName(item, "title") }}&nbsp;&nbsp;</span>
+            <a-tooltip
+              v-if="searchFieldLimit[item.columnName] && searchFieldLimit[item.columnName].tips"
+              :title="searchFieldLimit[item.columnName].tips"
+            >
+              <svg-icon icon-class="xitongtubiaodaohangtubiaowenti" />
+              &nbsp;&nbsp;
+            </a-tooltip>
+          </div>
+          <div class="quick-item-col" :class="{ 'quick-item-col-default': source !== 'editTable' }">
+            <!-- age -->
+            <!-- TODO: 清除，跨表 -->
+            <div v-if="item.AGEAttr" class="age-container">
+              <range-age
+                :ref="`${item.columnName}_AGEAttr`"
+                :format="item.format"
+                @change="ageRangeOnChange($event, item)"
+              ></range-age>
+            </div>
+            <!-- age -->
+            <!-- label -->
+            <div v-else-if="item.LABELAttr" class="label-attr-container">
+              <slot v-if="item.labelObj && Object.keys(item.labelObj || {}).length > 0">
+                <div v-for="(v, k) in item.labelObj" :key="k" class="edit-label-content">
+                  <div class="edit-label">{{ k }}：</div>
+
+                  <div
+                    class="edit-content quickSearch_label-container"
+                    :class="{
+                      'label-container-height': !v.isUnfold && v.itemList && v.isShowBtn
+                    }"
+                  >
+                    <div class="label-content" v-resize="el => onResize(el, v)">
+                      <a-checkable-tag
+                        v-for="(v, i) in v.itemList"
+                        v-model="v.isSelect"
+                        @change="handleLabelChange($event, v, item)"
+                        :key="i"
+                        :style="handleLabelColor(v)"
+                      >
+                        <a-tooltip placement="topLeft">
+                          <template slot="title">
+                            <span>{{ v.labelName }}</span>
+                          </template>
+                          {{ v.labelName }}
+                        </a-tooltip>
+                      </a-checkable-tag>
+                    </div>
+                  </div>
+                  <div class="label-unfold-btn" v-if="v.itemList && v.isShowBtn">
+                    <!-- {{ v.isUnfold }} -->
+                    <span @click.stop="handleLabelUpfold(v)">
+                      <template v-if="v.isUnfold">
+                        <span>收起</span>
+                        <a-icon
+                          type="up-square"
+
+                        />
+                      </template>
+                      <template v-else>
+                        <span>展开</span>
+                        <a-icon
+                          type="down-square"
+                        />
+                      </template>
+                    </span>
+                  </div>
+                </div>
+              </slot>
+              <a-input v-else style="width: 200px" v-model="item.inputVal" allowClear></a-input>
+            </div>
+            <!-- label -->
+
+            <!-- EVALUATE -->
+            <div v-else-if="item.EVALUATEAttr">
+              <template v-for="tag in EVALUATEList">
+                <a-checkable-tag
+                  :key="tag.value"
+                  :checked="item.selecteds.indexOf(tag.value) > -1"
+                  @change="checked => handleEvaluateOnChange(tag, checked, item)"
+                >
+                  {{ tag.label }}
+                </a-checkable-tag>
+              </template>
+              <!-- <a-icon v-if="item.CL" type="close" @click="item.CL = ''" /> -->
+            </div>
+            <!-- EVALUATE -->
+
+            <!-- NUMBERFiled -->
+            <div v-else-if="item.NUMBERFiled" class="ant-calendar-picker" style="width: 300px">
+              <span
+                class="ant-calendar-picker-input ant-input num-picker"
+                :class="{ 'num-picker-unit': item.inputUnit }"
+              >
+                <input
+                  v-model="item.lessValue"
+                  @keyup.enter="() => changeFilterNumber(item)"
+                  :title="`起始${item.alias || item.title}`"
+                  :placeholder="`起始${item.alias || item.title}`"
+                  class="ant-calendar-range-picker-input"/>
+                <span class="ant-calendar-range-picker-separator"> ~ &nbsp;</span>
+                <input
+                  v-model="item.bigValue"
+                  :title="`截止${item.alias || item.title}`"
+                  @keyup.enter="() => changeFilterNumber(item)"
+                  :placeholder="`截止${item.alias || item.title}`"
+                  class="ant-calendar-range-picker-input"/>
+                <template v-if="item.inputUnit">&nbsp;{{ item.inputUnit }}</template>
+                <span
+                  class="ant-input-suffix clear-number-icon"
+                  v-if="item.lessValue || item.bigValue"
+                  @click="clearFilterNumber(item)"
+                  ><i
+                    aria-label="图标: close-circle"
+                    tabindex="-1"
+                    class="anticon anticon-close-circle ant-input-clear-icon"
+                    ><svg
+                      viewBox="64 64 896 896"
+                      data-icon="close-circle"
+                      width="1em"
+                      height="1em"
+                      fill="currentColor"
+                      aria-hidden="true"
+                      focusable="false"
+                      class=""
+                    >
+                      <path
+                        d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 0 1-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z"
+                      ></path></svg></i></span
+              ></span>
+            </div>
+            <!-- NUMBERFiled -->
+
+            <!-- other -->
+            <slot v-else>
+              <template v-if="item.con == 'CL'">
+                <template v-if="showPercent(item)">
+                  <a-input-number
+                    class="CL-input"
+                    :style="`width: ${getEleWidth(item)}`"
+                    v-model="item.CL"
+                    :min="0"
+                    :max="100"
+                    allowClear
+                  />
+                </template>
+                <template v-else>
+                  <a-input
+                    class="CL-input"
+                    :style="{
+                      width: `${getEleWidth(item)}`,
+                      'font-family': item.PASSWORDTYPE ? 'text-security-disc' : 'inherit'
+                    }"
+                    v-model="item.CL"
+                    :class="{ 'psw-icon': item.comAttr == 'PASSWORD' }"
+                    allowClear
+                  >
+                    <template slot="suffix" v-if="item.comAttr == 'PASSWORD'">
+                      <svg-icon
+                        class="psw-icon"
+                        @click="item.PASSWORDTYPE = !item.PASSWORDTYPE"
+                        :icon-class="item.PASSWORDTYPE ? 'anniuyincang' : 'chakan'"
+                        style="font-size: 1em;"
+                      />
+                    </template>
+                  </a-input>
+                </template>
+              </template>
+              <template v-if="item.con == 'EQ'">
+                <template v-if="showPercent(item)">
+                  <a-input-number
+                    class="EQ-input"
+                    :style="`width: ${getEleWidth(item)}`"
+                    v-model="item.EQ"
+                    :min="0"
+                    :max="100"
+                    allowClear
+                  />
+                </template>
+                <template v-else>
+                  <a-input
+                    :class="{ 'psw-icon': item.comAttr == 'PASSWORD' }"
+                    class="EQ-input"
+                    :style="{
+                      width: `${getEleWidth(item)}`,
+                      'font-family': item.PASSWORDTYPE ? 'text-security-disc' : 'inherit'
+                    }"
+                    v-model="item.EQ"
+                    :placeholder="item.isPreciseSearch || item.fieldType == 'JSONB' ? '' : getI18nText('1.9.6', '区间搜素用~分割')"
+                    allowClear
+                  >
+                    <template slot="suffix" v-if="item.comAttr == 'PASSWORD'">
+                      <svg-icon
+                        class="psw-icon"
+                        @click="item.PASSWORDTYPE = !item.PASSWORDTYPE"
+                        :icon-class="item.PASSWORDTYPE ? 'anniuyincang' : 'chakan'"
+                        style="font-size: 1em;"
+                      />
+                    </template>
+                  </a-input>
+                </template>
+              </template>
+              <template v-if="showPercent(item)">&nbsp;%</template>
+              <!-- date -->
+              <div v-if="item.con == 'DATE'">
+                <a-radio-group v-model="item.DATE.con" buttonStyle="solid">
+                  <a-radio-button
+                    v-for="date in item.dateTeam"
+                    v-show="!item.showDate"
+                    @click="clickRadioGroup(item.DATE, date.con)"
+                    :key="date.con"
+                    :value="date.con"
+                    >{{ getI18nText(date.title, date.name) }}
+                  </a-radio-button>
+                  <span v-show="item.advanceOptionSetting != 1" :class="['check-date-btn', item.marginx]" @click="checkDate(item)">{{
+                    getI18nText('1.1.4.52', '选择时间')
+                  }}</span>
+                  <div class="check-date" v-show="item.showDate">
+                    <a-date-picker
+                      format="YYYY-MM-DD HH:mm:ss"
+                      v-model="item.DATE.start_val"
+                      :show-time="{
+                        defaultValue: $moment('00:00:00', 'HH:mm:ss')
+                      }"
+                      :placeholder="getI18nText('1.1.4.53', '开始时间')"
+                      style="width: 120px"
+                      allowClear
+                    />
+                    &nbsp;
+                    <a-date-picker
+                      format="YYYY-MM-DD HH:mm:ss"
+                      :show-time="{
+                        defaultValue: $moment('23:59:59', 'HH:mm:ss')
+                      }"
+                      :placeholder="getI18nText('1.9.147', '结束时间')"
+                      v-model="item.DATE.end_val"
+                      style="width: 120px"
+                      allowClear
+                    />
+                  </div>
+                </a-radio-group>
+              </div>
+              <!-- BIRTHDAY -->
+              <div v-if="item.con == 'BIRTHDAY'" :class="{ 'birthday-item': item.showDate }">
+                <a-radio-group v-model="item.BIRTHDAY.con" buttonStyle="solid">
+                  <template v-if="!item.showDate">
+                    <a-radio-button
+                      v-for="date in birthdayTeam"
+                      @click="clickBirthdayRadioGroup(item.BIRTHDAY, date.con)"
+                      :key="date.con"
+                      :value="date.con"
+                      >{{ getI18nText(date.title, date.name) }}
+                    </a-radio-button>
+                  </template>
+                  <template v-else>
+                    <div>
+                      <a-range-picker
+                        v-model="item.BIRTHDAY.limit_date"
+                        :disabledDate="disabledDate"
+                        @change="changeRange"
+                        format="MM-DD"
+                      />
+                    </div>
+                    <div class="age-wrap">
+                      <p>{{ getI18nText('1.2.5.34', '年龄') }}</p>
+                      <a-input
+                        style="width: 60px; margin-right: 10px"
+                        v-model="item.BIRTHDAY.start_val"
+                        allowClear
+                      />
+                      <a-input
+                        style="width: 60px; margin-right: 10px"
+                        v-model="item.BIRTHDAY.end_val"
+                        allowClear
+                      />
+                      <a-select
+                        v-model="item.BIRTHDAY.unit"
+                        defaultValue="YEAR"
+                        showSearch
+                        :filterOption="filterOption"
+                        allowClear
+                      >
+                        <a-select-option
+                          v-for="v in item.BIRTHDAY.units"
+                          :key="v.con"
+                          :value="v.con"
+                        >
+                         {{ getI18nText(v.title, v.name) }}
+                        </a-select-option>
+                      </a-select>
+                    </div>
+                  </template>
+                  <span :class="['check-date-btn', item.marginx]" @click="checkBirthDay(item)">{{
+                   getI18nText('1.1.5.2', '切换')
+                  }}</span>
+                </a-radio-group>
+              </div>
+              <!-- <a-select
+                v-if="item.con == 'QUOTE'"
+                v-model="item.QUOTE"
+                mode="multiple"
+                :placeholder="$t('1.1.6.7')"
+                :tokenSeparators="['|#|']"
+                style="width: 200px"
+                :filter-option="false"
+                @dropdownVisibleChange="dropdownVisibleChange($event, item)"
+                @search="handleSearch($event, item)"
+                showSearch
+                allowClear
+              >
+                <a-select-option
+                  v-for="sea in item.dataSource"
+                  :key="item.sid + sea.myName"
+                  :value="sea.myName"
+                >
+                  {{ sea.showKeys || sea.myName }}
+                </a-select-option>
+              </a-select> -->
+              <template  v-if="item.con == 'QUOTE' || item.com == 'SelectMui'">
+                <c-tree-select
+                  v-if="item.comType === 'treeSelect'"
+                  :item="item"
+                  :handleGetConfigApi="handleGetConfigApi"
+                  style="margin: 0 8px 8px 0"
+                />
+                <multiSelect
+                  v-else
+                  :item="item"
+                  source="quickSearch"
+                  :maxTagPlaceholder="maxTagPlaceholder"
+                  :outFilterChange="filterChange"
+                  :handleWordBookSearch="handleSearch"
+                  :dropdownVisibleChange="dropdownVisibleChange"
+                  :fetchingWordbook="fetchingWordbook"
+                ></multiSelect>
+              </template>
+
+              <a-checkbox-group
+                class="check-box"
+                v-else-if="item.con == 'CONVERT'"
+                :options="item.setting.showSetting"
+                v-model="item.CONVERT"
+              />
+            </slot>
+          </div>
+        </div>
+      </div>
+      <!-- 跨表 -->
+      <template v-for="(relationItem, i) in relationQuickSearch">
+        <div :key="i" v-if="relationItem.fieldList && relationItem.fieldList.length">
+          <p class="module-title">{{ relationItem.tableName }}</p>
+          <div
+            class="quick-item"
+            v-for="item in relationItem.fieldList"
+            :key="item.sid"
+            :class="{
+              'quick-block':
+                item.con == 'DATE' ||
+                item.con == 'BIRTHDAY' ||
+                item.con == 'CONVERT' ||
+                item.LABELAttr
+            }"
+          >
+            <div class="quick-row">
+              <!-- title -->
+              <div
+                class="quick-item-title"
+                :class="{ 'quick-item-title-default': source !== 'editTable' }"
+              >
+                <span>{{ handleName(item, "title") }}&nbsp;&nbsp;</span>
+              </div>
+              <div
+                class="quick-item-col"
+                :class="{ 'quick-item-col-default': source !== 'editTable' }"
+              >
+                <div v-if="item.LABELAttr">
+                  <slot v-if="item.labelObj && Object.keys(item.labelObj || {}).length > 0">
+                    <div v-for="(v, k) in item.labelObj" :key="k" class="edit-label-content">
+                      <div class="edit-label">{{ k }}：</div>
+                      <div class="edit-content">
+                        <div class="label-content">
+                          <a-checkable-tag
+                            v-for="(v, i) in v.itemList"
+                            v-model="v.isSelect"
+                            @change="handleLabelChange($event, v, item)"
+                            :key="i"
+                            :class="['label-tag-' + handleLabelColorClass(v)]"
+                          >
+                            <a-tooltip placement="topLeft">
+                              <template slot="title">
+                                <span>{{ v.labelName }}</span>
+                              </template>
+                              {{ v.labelName }}
+                            </a-tooltip>
+                          </a-checkable-tag>
+                        </div>
+                      </div>
+                    </div>
+                  </slot>
+                  <a-input v-else style="width: 200px" v-model="item.inputVal"> </a-input>
+                </div>
+
+                <!-- EVALUATE -->
+                <div v-else-if="item.EVALUATEAttr">
+                  <template v-for="tag in EVALUATEList">
+                    <a-checkable-tag
+                      :key="tag.value"
+                      :checked="item.selecteds.indexOf(tag.value) > -1"
+                      @change="checked => handleEvaluateOnChange(tag, checked, item)"
+                    >
+                      {{ tag.label }}
+                    </a-checkable-tag>
+                  </template>
+                  <!-- <a-icon v-if="item.CL" type="close" @click="item.CL = ''" /> -->
+                </div>
+                <!-- EVALUATE -->
+
+                <!-- NUMBERFiled -->
+                <div v-else-if="item.NUMBERFiled" class="ant-calendar-picker" style="width: 300px">
+                  <span
+                    class="ant-calendar-picker-input ant-input num-picker"
+                    :class="{ 'num-picker-unit': item.inputUnit }"
+                  >
+                    <input
+                      v-model="item.lessValue"
+                      @keyup.enter="() => changeFilterNumber(item)"
+                      :title="`起始${item.alias || item.title}`"
+                      :placeholder="`起始${item.alias || item.title}`"
+                      class="ant-calendar-range-picker-input"/>
+                    <span class="ant-calendar-range-picker-separator"> ~ &nbsp;</span>
+                    <input
+                      v-model="item.bigValue"
+                      :title="`截止${item.alias || item.title}`"
+                      @keyup.enter="() => changeFilterNumber(item)"
+                      :placeholder="`截止${item.alias || item.title}`"
+                      class="ant-calendar-range-picker-input"/>
+                    <template v-if="item.inputUnit">&nbsp;{{ item.inputUnit }}</template>
+                    <span
+                      class="ant-input-suffix clear-number-icon"
+                      v-if="item.lessValue || item.bigValue"
+                      @click="clearFilterNumber(item)"
+                      ><i
+                        aria-label="图标: close-circle"
+                        tabindex="-1"
+                        class="anticon anticon-close-circle ant-input-clear-icon"
+                        ><svg
+                          viewBox="64 64 896 896"
+                          data-icon="close-circle"
+                          width="1em"
+                          height="1em"
+                          fill="currentColor"
+                          aria-hidden="true"
+                          focusable="false"
+                          class=""
+                        >
+                          <path
+                            d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 0 1-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z"
+                          ></path></svg></i
+                    ></span>
+                    <span class="ant-calendar-picker-icon"></span
+                  ></span>
+                </div>
+                <!-- NUMBERFiled -->
+
+                <slot v-else>
+                  <template v-if="item.con == 'CL'">
+                    <template v-if="showPercent(item)">
+                      <a-input-number
+                        class="CL-input"
+                        :style="`width: ${getEleWidth(item)}`"
+                        v-model="item.CL"
+                        :min="0"
+                        :max="100"
+                        allowClear
+                      />
+                    </template>
+                    <template v-else>
+                      <a-input class="CL-input" :style="`width: ${getEleWidth(item)}`" v-model="item.CL" allowClear>
+                      </a-input>
+                    </template>
+                  </template>
+                  <template v-if="item.con == 'EQ'">
+                    <template v-if="showPercent(item)">
+                      <a-input-number
+                        class="EQ-input"
+                        :style="`width: ${getEleWidth(item)}`"
+                        v-model="item.EQ"
+                        :min="0"
+                        :max="100"
+                        allowClear
+                      />
+                    </template>
+                    <template v-else>
+                      <a-input
+                        class="EQ-input"
+                        :style="`width: ${getEleWidth(item)}`"
+                        v-model="item.EQ"
+                        :placeholder="item.isPreciseSearch || item.fieldType == 'JSONB' ? '' : getI18nText('1.9.6', '区间搜素用~分割')"
+                        allowClear
+                      >
+                      </a-input>
+                    </template>
+                  </template>
+                  <template v-if="showPercent(item)">&nbsp;%</template>
+                  <!-- date -->
+                  <div v-if="item.con == 'DATE'">
+                    <a-radio-group v-model="item.DATE.con" buttonStyle="solid">
+                      <a-radio-button
+                        v-for="date in dateTeam"
+                        v-show="!item.showDate"
+                        @click="clickRadioGroup(item.DATE, date.con)"
+                        :key="date.con"
+                        :value="date.con"
+                        >{{ getI18nText(date.title, date.name) }}
+                      </a-radio-button>
+                      <span :class="['check-date-btn', item.marginx]" @click="checkDate(item)">{{
+                        getI18nText('1.1.4.53', '开始时间')
+                      }}</span>
+                      <div class="check-date" v-show="item.showDate">
+                        <a-date-picker
+                          format="YYYY-MM-DD HH:mm:ss"
+                          v-model="item.DATE.start_val"
+                          :show-time="{
+                            defaultValue: $moment('00:00:00', 'HH:mm:ss')
+                          }"
+                          :placeholder="'起始日期'"
+                          style="width: 120px"
+                          allowClear
+                        />
+                        &nbsp;
+                        <a-date-picker
+                          format="YYYY-MM-DD HH:mm:ss"
+                          v-model="item.DATE.end_val"
+                          :placeholder="'截止日期'"
+                          :show-time="{
+                            defaultValue: $moment('23:59:59', 'HH:mm:ss')
+                          }"
+                          style="width: 120px"
+                          allowClear
+                        />
+                      </div>
+                    </a-radio-group>
+                  </div>
+                  <!-- <a-select
+                    v-if="item.con == 'QUOTE'"
+                    v-model="item.QUOTE"
+                    mode="multiple"
+                    :placeholder="$t('1.1.6.7')"
+                    :tokenSeparators="['|#|']"
+                    style="width: 200px"
+                    :filter-option="false"
+                    @dropdownVisibleChange="dropdownVisibleChange($event, item)"
+                    @search="handleSearch($event, item)"
+                    showSearch
+                    allowClear
+                  >
+                    <a-select-option
+                      v-for="sea in item.dataSource"
+                      :key="item.sid + sea.myName"
+                      :value="sea.myName"
+                    >
+                      {{ sea.myName }}
+                    </a-select-option>
+                  </a-select> -->
+                  <template  v-if="item.con == 'QUOTE' || item.com == 'SelectMui'">
+                    <c-tree-select
+                      v-if="item.comType === 'treeSelect'"
+                      :item="item"
+                      :handleGetConfigApi="handleGetConfigApi"
+                      style="margin: 0 8px 8px 0"
+                    />
+                    <multiSelect
+                      v-else
+                      :item="item"
+                      source="quickSearch"
+                      :maxTagPlaceholder="maxTagPlaceholder"
+                      :outFilterChange="filterChange"
+                      :handleWordBookSearch="handleSearch"
+                      :dropdownVisibleChange="dropdownVisibleChange"
+                      :fetchingWordbook="fetchingWordbook"
+                    ></multiSelect>
+                  </template>
+
+                  <a-checkbox-group
+                    class="check-box"
+                    v-else-if="item.con == 'CONVERT'"
+                    :options="item.setting.showSetting"
+                    v-model="item.CONVERT"
+                  />
+                </slot>
+              </div>
+            </div>
+          </div>
+        </div>
+      </template>
+    </div>
+
+    <a-modal
+      :title="'设置筛选分类'"
+      :visible="showInner"
+      @ok="saveToCalss"
+      @cancel="cancelSaveToCalss"
+      wrapClassName="quickSearch-saveToClass-modal"
+    >
+      <a-form :form="formInner" :label-col="{ span: 5 }" :wrapper-col="{ span: 18 }">
+        <a-form-item :label="'筛选集名称'">
+          <a-input
+            v-decorator="[
+              'classname',
+              {
+                rules: [{ required: true, message: getI18nText('1.1.6.6', '请输入分类名称') }]
+              }
+            ]"
+          />
+        </a-form-item>
+      </a-form>
+      <a-row>
+        <a-col :span="5" style="text-align: right; color: rgba(0, 0, 0, 0.85)"> 父类名称： </a-col>
+        <a-col :span="18">
+          <div
+            class="edit-tag"
+            v-for="(item, index) in parentNames"
+            :key="index"
+            @dblclick="e => editParentName(e, item)"
+            @click="handleParentNameSelect(item, index)"
+            :class="{ 'edit-tag-select': item.selected && item.disabled }"
+          >
+            <a-input
+              style="width: 100px"
+              :value="item"
+              :disabled="item.disabled"
+              @blur="() => (item.disabled = true)"
+              v-model="item.value"
+            />
+            <a-icon slot="suffix" type="close" @click="handleParentNamesRemove(index, item)" />
+          </div>
+          <template v-if="!parentNamesHasAdd">
+            <a-button
+              v-show="!showAdd"
+              icon="plus"
+              type="dashed"
+              class="add-parent"
+              @click="handleParentNamesAdd"
+            >
+              {{ getI18nText('1.9.363', '添加分类') }}
+            </a-button>
+            <a-input
+              class="edit-tag"
+              v-model.trim="addVal"
+              v-show="showAdd"
+              style="width: 100px"
+              @blur="hanldeBlur"
+            />
+          </template>
+        </a-col>
+      </a-row>
+    </a-modal>
+  </div>
+  <!-- </a-modal> -->
+</template>
+
+<script>
+const EVALUATEList = [
+  {
+    label: "一星",
+    value: "1",
+    isSelect: false
+  },
+  {
+    label: "二星",
+    value: "2",
+    isSelect: false
+  },
+  {
+    label: "三星",
+    value: "3",
+    isSelect: false
+  },
+  {
+    label: "四星",
+    value: "4",
+    isSelect: false
+  },
+  {
+    label: "五星",
+    value: "5",
+    isSelect: false
+  }
+];
+
+const AGEOPTIONS = [
+  {
+    label: "岁",
+    value: "YY"
+  },
+  {
+    label: "月",
+    value: "MM"
+  },
+  {
+    label: "日",
+    value: "DD"
+  }
+];
+import tableSearchCon from "../mixins/tableSearchCon";
+import moment from 'moment';
+import 'moment/locale/zh-cn';
+// antd
+import _ from 'lodash';
+import { Button, Icon, Dropdown, Select, Upload, DatePicker, Input, Menu, Radio, Checkbox, Row, Tag, InputNumber, Col, Form, Modal, Tooltip } from 'ant-design-vue';
+import rangeAge from '../components/range-age/index';
+import multiSelect from '../components/multi-select/multi-select';
+import resize from 'vue-resize-directive';
+import { durationMixin, $utils, filterApiFn } from '../mixins/mixins';
+import vexutils from '@/utils/vexutils';
+import wordBookutils from '../mixins/wordBookutils';
+import cTreeSelect from '../components/c-tree-select/tree-select';
+import create from '@/core/create';
+import utils from '@/utils/utils-map';
+import {dataOptions} from '../const/dataOptions'
+export default create({
+  name: "quick-search",
+  mixins: [durationMixin, $utils, filterApiFn, tableSearchCon],
+  props: {
+    visible: Boolean,
+    searchFieldList: {
+      type: Array,
+      default: () => []
+    },
+    searchFieldLimit: {
+      type: Object,
+      default: () => ({})
+    },
+    quickSearchConfig: Array,
+    source: String,
+    quickSearchListObj: Object,
+    originConditionList: Array,
+    isOrgAdmin: Boolean,
+    lastQuickSearchData: Array,
+    show: Boolean,
+    getFilterData: Function
+  },
+  components: {
+    rangeAge,
+    [Button.name]: Button,
+    [Icon.name]: Icon,
+    [Dropdown.name]: Dropdown,
+    [Select.name]: Select,
+    [Select.Option.name]: Select.Option,
+    [Upload.name]: Upload,
+    [DatePicker.name]: DatePicker,
+    [DatePicker.RangePicker.name]: DatePicker.RangePicker,
+    [Input.name]: Input,
+    [Input.Group.name]: Input.Group,
+    [InputNumber.name]: InputNumber,
+    [Input.Search.name]: Input.Search,
+    [Menu.name]: Menu,
+    [Menu.Item.name]: Menu.Item,
+    [Menu.ItemGroup.name]: Menu.ItemGroup,
+    [Radio.name]: Radio,
+    [Radio.Button.name]: Radio.Button,
+    [Radio.Group.name]: Radio.Group,
+    [Checkbox.name]: Checkbox,
+    [Checkbox.Group.name]: Checkbox.Group,
+    [Row.name]: Row,
+    [Col.name]: Col,
+    [Tag.name]: Tag,
+    AModal: Modal,
+    [Form.name]: Form,
+    [Tooltip.name]: Tooltip,
+    [Form.Item.name]: Form.Item,
+    [Tag.CheckableTag.name]: Tag.CheckableTag,
+    multiSelect,
+    cTreeSelect
+  },
+  computed: {
+    showPercent() {
+      return function(item) {
+        return item.settingObj?.attr === "PERCENTAGE" || false;
+      };
+    },
+    getEleWidth(){
+      return function(item) {
+        return `${item.advanceColWidth||200}px`
+      }
+    },
+    hasRelationQuickSearch() {
+      return this.relationQuickSearch.findIndex(i => i.fieldList && i.fieldList.length) != -1;
+    },
+    parentNamesHasAdd() {
+      if (!this.parentNames.length) return false;
+      return this.parentNames.some(v => v.isAdd);
+    },
+    handleName() {
+      return function(item, key = "name") {
+        return item.alias || item[key];
+      };
+    },
+
+    $moment() {
+      return moment;
+    }
+  },
+  data() {
+    return {
+      modalVisible: this.visible,
+      showInner: false,
+      quickSearch: [],
+      relationTableList: [], // 跨表查询
+      relationQuickSearch: [], // 跨表查询检索条件
+      formData: {},
+      searchItem: {},
+      curWordbookData: undefined,
+      curAutograph: "",
+      dateTeam: [
+        { con: 'TODAY', title: '1.1.4.37', name: '今天' },
+        { con: 'TOMORROW', title: '1.1.4.38', name: '明天' },
+        { con: 'YESTERDAY', title: '1.1.4.39', name: '昨天' },
+        { con: 'THIS_WEEK', title: '1.1.4.40', name: '本周' },
+        { con: 'NEXT_WEEK', title: '1.1.4.41', name: '下周' },
+        { con: 'UP_WEEK', title: '1.1.4.42', name: '上周' },
+        { con: 'THIS_MONTH', title: '1.1.4.43', name: '本月' },
+        { con: 'NEXT_MONTH', title: '1.1.4.44', name: '下月' },
+        { con: 'UP_MONTH', title: '1.1.4.45', name: '上月' },
+        { con: 'THIS_SEASON', title: '1.1.4.46', name: '本季度' },
+        { con: 'NEXT_SEASON', title: '1.1.4.47', name: '下季度' },
+        { con: 'UP_SEASON', title: '1.1.4.48', name: '上季度' },
+        { con: 'THIS_YEAR', title: '1.1.4.49', name: '本年' },
+        { con: 'NEXT_YEAR', title: '1.1.4.50', name: '下年' },
+        { con: 'UP_YEAR', title: '1.1.4.51', name: '上年' }
+      ],
+      birthdayTeam: [],
+      limit_date: "",
+      birthdayUnits: [
+        { title: '1.2.5.58', units: 1, con: 'DAY', name: '天' },
+        { title: '1.2.5.59', units: 2, con: 'WEEK', name: '周' },
+        { title: '1.2.1.11.18', units: 1, con: 'MONTH', name: '月' },
+        { title: '1.9.273', units: 1, con: 'YEAR', name: '岁' },
+      ],
+      isChangeWindow: false,
+      modalWidth: "700px",
+      modalHeight: "60vh",
+      EVALUATEList,
+      AGEOPTIONS,
+      label_max_count: 8,
+      parentNames: [],
+      showAdd: false,
+      addVal: "",
+      fetchingWordbook: false,
+      ...dataOptions
+    };
+  },
+  watch: {
+    visible(value) {
+      this.modalVisible = value;
+      // this.init();
+      this.setDefaultCon(this.quickSearchConfig);
+    },
+    searchFieldList: {
+      immediate: true,
+      deep: true,
+      handler(val) {
+        if (val && val.length > 0) {
+          let { relationTableList = [] } = this.$attrs;
+          this.relationTableList = relationTableList;
+          this.init();
+        }
+      }
+    },
+    quickSearchConfig: {
+      handler(val) {
+        this.setDefaultCon(val);
+      },
+      deep: true
+    },
+    quickSearchListObj: {
+      immediate: true,
+      deep: true,
+      handler(val) {
+        if (!val || !Object.keys(val).length) {
+          this.parentNames = [];
+          return;
+        }
+        this.handleParentName();
+      }
+    },
+    quickSearch: {
+      deep: true,
+      handler() {
+        const conObj = this.getConObjParams() || [];
+        this.$emit("filterCountChange", conObj.length);
+      }
+    },
+    show: {
+      deep: true,
+      handler(newVal) {
+        if (newVal && this.lastQuickSearchData.length > 0) {
+          this.quickSearch = _.cloneDeep(this.lastQuickSearchData);
+        }
+      }
+    }
+  },
+  beforeCreate() {
+    this.formInner = this.$form.createForm(this);
+  },
+  created() {},
+  methods: {
+    filterOption(...arg) {
+      return utils.filterOption(...arg);
+    },
+    handleLabelColor(...arg) {
+      return utils.handleLabelColor(...arg);
+    },
+    init() {
+      this.quickSearch = [];
+      this.relationQuickSearch = [];
+      this.birthdayTeam = this.dateTeam.filter(
+        item => item.con != "THIS_YEAR" && item.con != "NEXT_YEAR" && item.con != "UP_YEAR"
+      );
+      let copyList = _.cloneDeep(this.searchFieldList);
+      let mySearchFieldList = copyList.filter(i => i.isShowSearch == 1 && i.filterExplicit != 1) || [];
+      // let relationTableList = JSON.parse(JSON.stringify(this.relationTableList));
+      let relationTableList = _.cloneDeep(this.relationTableList);
+
+      // 跨表
+      let relationQuickSearch = relationTableList.map(item => {
+        return {
+          fieldList: item.fieldList.fieldList.filter(item => item.isShowSearch == 1 && item.filterExplicit != 1),
+          tableName: item.tableName,
+          primaryField: item.primaryField,
+          parameterConversionId: item.parameterConversionId,
+          tableId: item.tableId,
+          relationField: item.relationField,
+          converFun: item.converFun,
+          relationOrgId: item.relationOrgId,
+          preConObj: item.preConObj,
+          preSqlExpression: item.preSqlExpression
+        };
+      });
+
+      this.$set(this, "relationQuickSearch", relationQuickSearch);
+      // 过滤获取 快速检索的字段
+      this.quickSearch = mySearchFieldList || [];
+      this.handlerInitSearchItem(this.quickSearch);
+      this.relationQuickSearch.forEach(item => {
+        this.handlerInitSearchItem(item.fieldList);
+      });
+    },
+    handleParentName() {
+      let parentNames = [];
+      let { displayCategoryList = [] } = this.quickSearchListObj;
+      if (!displayCategoryList || !displayCategoryList.length) {
+        this.parentNames = [];
+        return;
+      }
+      displayCategoryList.forEach(item => {
+        if (item !== "未分类") {
+          parentNames.push({
+            disabled: true,
+            selected: false,
+            value: item
+          });
+        }
+      });
+      this.parentNames = parentNames;
+    },
+    setDefaultCon(val) {
+      if (!val.length) {
+        this.quickSearch.forEach((item, index) => {
+          let advanceOptionSetting = item?.advanceOptionSetting;
+           //  单选
+           let optionSetting0 =String(advanceOptionSetting) == '0';
+           if(optionSetting0){
+            this.$set(this.quickSearch[index], "value", undefined);
+           } else {
+            if (item.CONVERT && Array.isArray(item.CONVERT)) {
+              this.$set(this.quickSearch[index], "CONVERT", []);
+            }
+           }
+
+        });
+        return false;
+      }
+
+      this.quickSearch.forEach((item, index) => {
+        let advanceOptionSetting = item?.advanceOptionSetting;
+        //  单选
+        let optionSetting0 =String(advanceOptionSetting) == '0';
+        let find = val.find(valItem => valItem.field_key === item.columnName);
+        if (find) {
+          let value = find.value.map(item => JSON.stringify(item));
+          value = value.filter(Boolean)
+          this.$set(this.quickSearch[index], "CONVERT", value);
+          if(optionSetting0){
+            let i = value[0] ? item.labelList.findIndex(v=> v.value== value[0]) : ""
+            this.$set(this.quickSearch[index], "value", i);
+          }
+        } else {
+          this.$set(this.quickSearch[index], "CONVERT",optionSetting0?"": []);
+        }
+      });
+    },
+    handlerInitSearchItem(arr) {
+      if (!Array.isArray(arr)) return;
+      arr.forEach(el => {
+        const isPreciseSearch = el?.settingObj?.isPreciseSearch || "";
+
+        if (el.setting) {
+          // el.seting 可能是 string / object
+          el.setting = typeof el.setting == "string" ? JSON.parse(el.setting) : el.setting;
+
+           let advanceOptionSetting = el?.advanceOptionSetting;
+          //  单选
+           let optionSetting0  =String(advanceOptionSetting) == '0';
+          if (!vexutils.isEmpty(el.setting.wordbook)) {
+            let isTree = "tree" === el?.setting?.wordbook?.showType;
+            let comType = isTree ? 'treeSelect' : 'SelectMuiWordBook';
+            let defVal = isTree ? [] : [];
+            if(optionSetting0){
+              defVal = undefined
+            }
+            this.$set(el, "con", "QUOTE");
+            this.$set(el, "dataSource", []);
+            this.$set(el, "QUOTE", []);
+            this.$set(el, "value", defVal);
+            this.$set(el, "com", "SelectMui");
+            this.$set(el, "comType", comType);
+            this.$set(el, "searchPageConfig", {
+              keyword: undefined,
+              isRequest: false, // 是否已请求
+              page: 1, // 当前页
+              total: 1, // 总页数
+              hasNextPage: false
+            });
+            return;
+          } else if (el.setting.showSetting && el.setting.showSetting.length > 0) {
+            this.$set(el, "con", "CONVERT");
+            let showSetting = el.setting.showSetting;
+
+            // 字典推荐值
+            let dictionItem = this.handleDictionDef(el);
+            if (dictionItem) {
+              showSetting.unshift(dictionItem);
+            }
+            showSetting.forEach(set => {
+              set.label = set.change_text;
+              set.value = JSON.stringify(set.filter);
+            });
+            // el.setting.showSetting.forEach(set => {
+            //   this.$set(set, "label", set.change_text);
+            //   this.$set(set, "value", JSON.stringify(set.filter));
+            // });
+            /**
+             * 映射方式的单选模式
+             */
+            if(optionSetting0){
+              this.$set(el, "com", "SelectMui");
+              this.$set(el, "comType", "SelectMui");
+              const labelList = el.setting.showSetting.map(i => {
+                i.labelName = i.change_text;
+                return i;
+              });
+              this.$set(el, "labelList", labelList);
+            }
+
+            this.$set(el.setting, "showSetting", showSetting);
+            this.$set(el, "CONVERT",optionSetting0? "": []);
+            return;
+          }
+        }
+        if (el.setting.attr === "LABEL") {
+          this.$set(el, "con", "CL"); // 2020-09-04 朱亚徽 EQ => CL
+          this.$set(el, "LABELAttr", true);
+          this.$set(el, "labelSelectList", []);
+          this.$set(el, "inputVal", "");
+          this.handleSetLabelOptions(el.setting.labelType, el);
+        } else if (el.setting.attr === "EVALUATE") {
+          this.$set(el, "con", "CL");
+          this.$set(el, "selecteds", []);
+          this.$set(el, "EVALUATEAttr", true);
+        } else if (el.setting.attr === "AGE" && el.fieldType != "NUMBER") {
+          // 年龄组件
+          let format = el.setting.format || "YYYY-MM-DD";
+          format = format.toUpperCase();
+          this.$set(el, "con", "IN");
+          this.$set(el, "ageObj", {});
+          this.$set(el, "format", format);
+          this.$set(el, "AGEAttr", true);
+        } else if (el.setting.attr === "PASSWORD") {
+          this.$set(el, "comAttr", "PASSWORD");
+          this.$set(el, "PASSWORDTYPE", true);
+        } else if (el.fieldType == "NUMBER") {
+          this.$set(el, "con", "EQ");
+          this.$set(el, "EQ", "");
+          this.$set(el, "NUMBERFiled", true);
+          this.$set(el, "lessValue", "");
+          this.$set(el, "bigValue", "");
+          if (el.setting.attr == "PERCENTAGE") {
+            this.$set(el, "inputUnit", "%");
+          }
+        } else if (el.fieldType.includes("DATE")) {
+          if (el.settingObj && el.settingObj.attr == "BIRTHDAY") {
+            this.$set(el, "con", "BIRTHDAY");
+            this.$set(el, "showDate", false);
+            this.$set(el, "marginx", "ml");
+            this.$set(el, "BIRTHDAY", this.initBirthdayParams());
+          } else {
+            // 判断是否有默认值
+            const value = this.getSearchDefValueByLimit(el, this.searchFieldLimit);
+            let hasValue = Array.isArray(value);
+            let advanceOptionSetting = el?.advanceOptionSetting;
+            // 选择时间模式
+            let optionSetting1  = String(advanceOptionSetting) == '1';
+
+            this.$set(el, "con", "DATE");
+            this.$set(el, "showDate", optionSetting1 || hasValue);
+            this.$set(el, "marginx",optionSetting1 ||  hasValue ? "mr" : "ml");
+            this.$set(el, "DATE", {
+              con: hasValue ? "IN" : null,
+              start_val: hasValue ? value[0] : null,
+              end_val: hasValue ? value[1] : null
+            });
+            let dateTeam = optionSetting1 ? [] : this[`dateTeam${advanceOptionSetting}`] || this.dateTeam0;
+            this.$set(el, 'dateTeam' , dateTeam)
+          }
+        } else if (el.fieldType == "TEXT") {
+          /**
+           * NUMBER和TEXT属性字段
+           * 如果 开启了精准搜索，则传条件的时候 要传 EQ
+           * isPreciseSearch: 0/1
+           */
+          let con = isPreciseSearch == 1 ? 'EQ': 'CL';
+          this.$set(el, "con", con);
+          this.$set(el, "isPreciseSearch", isPreciseSearch == 1);
+          this.$set(el, con, "");
+        } else if (el.fieldType == "JSONB") {
+          this.$set(el, "con", "EQ");
+          this.$set(el, "EQ", "");
+        }
+      });
+    },
+    // 字典推荐值 item处理
+    handleDictionDef(el) {
+      let { defaultValue, defaultValueTitle } = el?.dictionarieObj || {};
+      let dictionItem = null;
+      if (defaultValue && defaultValueTitle) {
+        dictionItem = {
+          change_text: defaultValueTitle,
+          filter: [
+            {
+              con: "EQ",
+              field_key: el.columnName,
+              value: defaultValue
+            }
+          ]
+        };
+      }
+      return dictionItem;
+    },
+    checkDate(item) {
+      item.showDate = !item.showDate;
+      item.showDate ? (item.marginx = "mr") : (item.marginx = "ml");
+    },
+    checkBirthDay(item) {
+      item.showDate = !item.showDate;
+    },
+    getWordbookData(o, obj) {
+      let { id, filterKeys, wordbookType } = o;
+      this.fetchingWordbook = true;
+      let resFieldKeys = Array.isArray(filterKeys) ? JSON.stringify(filterKeys) : filterKeys;
+      let url = `/tableReader/getWordbookData`;
+      let params = {
+        wordbookId: id,
+        fieldKeys: resFieldKeys,
+        wordbookType: wordbookType || "WORDBOOK",
+        asyncCount: 1, // 开启性能模式
+        ...obj
+      };
+      return this.handleGetConfigApi(params, 'requestGetWordbookData', { fields: o }).then(res => {
+        this.fetchingWordbook = false;
+        if(typeof res.data === 'object'){
+          res.data.reqParams =  params;
+        }
+        return res;
+      }).catch(() => {
+        this.fetchingWordbook = false;
+      });
+    },
+    handleWordbookData(item, data, params) {
+      this.$set(item, "hasFieldList", false);
+      const {rows,hasFieldList,searchPageConfig} = wordBookutils.handleWordbookData(item,data,params);
+      this.$set(item, "hasFieldList", hasFieldList);
+      this.$set(item, "dataSource", rows);
+      item.searchPageConfig = Object.assign(item.searchPageConfig, searchPageConfig);
+    },
+    filterChange() {},
+    maxTagPlaceholder(item) {
+      if (Array.isArray(item.value)) {
+        return item.value.length;
+      } else {
+        return 1;
+      }
+    },
+    dropdownVisibleChange(open, item) {
+       if (item.comType == "SelectMui" && String(item.advanceOptionSetting) === '0') return;
+      if (open) {
+        let obj = {};
+        if (item.setting.wordbook.params) {
+          item.setting.wordbook.params.forEach(item => {
+            obj[item.p_name] = item.p_value;
+          });
+        }
+        if (item.settingObj.wordbook) {
+          obj.autograph = item.settingObj.wordbook.autograph;
+        }
+        this.curWordbookData = item.setting.wordbook;
+        this.curAutograph = item.settingObj.wordbook && item.settingObj.wordbook.autograph;
+        this.searchItem = item;
+        this.getWordbookData(item.setting.wordbook, obj).then(({ data }) => {
+          this.handleWordbookData(item, data, obj);
+        });
+      }
+    },
+    /**
+     * 输入自动联想
+     */
+    handleSearch(value, item, config={}) {
+      if (item.comType == "SelectMui" && String(item.advanceOptionSetting) === '0') return;
+      let params = {
+        keyword: value,
+        autograph: this.curAutograph
+      };
+      let obj = {};
+      let p = item?.setting?.wordbook?.params || undefined;
+      if (p) {
+        item.setting.wordbook.params.forEach(item => {
+          obj[item.p_name] = item.p_value;
+        });
+      }
+      let rp = { ...params, ...obj, ...config };
+      this.getWordbookData(this.curWordbookData, rp).then(({ data }) => {
+        this.handleWordbookData(this.searchItem, data, rp);
+      });
+    },
+    onSave() {
+      let mergeConObj = this.getMergeConObj();
+      this.resetChangeWindow();
+
+      if (!this.validConObj(mergeConObj, this.searchFieldList, this.searchFieldLimit)) return false;
+      this.$emit("onSave", mergeConObj);
+      return this.quickSearch;
+    },
+    // 方便外部调用
+    getMergeConObj() {
+      let conObj = this.getConObjParams() || [];
+      let mergeConObj = [...conObj];
+      // 合并表格表头未设置高级筛选的筛选项
+      this.quickSearchConfig.forEach(i => {
+        let find = mergeConObj.find(j => {
+          return i.field_key === j.field_key;
+        });
+        if (
+          !find &&
+          !this.quickSearch.find(item => {
+            return item.columnName === i.field_key;
+          })
+        ) {
+          mergeConObj.push(i);
+        }
+      });
+      return mergeConObj || [];
+    },
+    getConObjParams() {
+      let conObj = this.getConObj(this.quickSearch) || [];
+      let realation = [];
+      this.relationQuickSearch.forEach(item => {
+        let curQuote = this.getConObj(item.fieldList);
+        if (curQuote && curQuote.length) {
+          realation.push({
+            field_key: item.primaryField,
+            valueField: item.relationField,
+            con: "QUOTE_IN",
+            tableId: item.tableId,
+            parameterConversionId: item.parameterConversionId,
+            converFun: item.converFun,
+            preConObj: item.preConObj,
+            relationOrgId: item.relationOrgId,
+            preSqlExpression: item.preSqlExpression,
+            quote_con: {
+              conObj: this.getConObj(item.fieldList),
+              sqlExpression: ""
+            }
+          });
+        }
+      });
+      conObj.push(...realation);
+      return conObj || [];
+    },
+    closeModal() {
+      this.resetChangeWindow();
+      this.$emit("closeModal");
+    },
+    resetChangeWindow() {
+      this.modalWidth = "700px";
+      this.modalHeight = "60vh";
+      this.isChangeWindow = false;
+    },
+    // 填写搜索设置条件后打开新增搜索分类名称弹框
+    openSaveToCalss() {
+      let conObj = this.getConObjParams();
+      if (!conObj) return;
+      if (conObj.length > 0) {
+        if (!this.validConObj(conObj, this.searchFieldList, this.searchFieldLimit)) return;
+        this.showInner = true;
+      } else {
+        this.$message.warning(this.getI18nText('1.1.6.18', '请设置搜索条件'), 2);
+      }
+    },
+    // 格式化设置搜索条件参数
+    getConObj(arr) {
+      // this.quickSearch
+      if (!Array.isArray(arr)) {
+        return [];
+      }
+      let conObj = [];
+      for (let i = 0; i < arr.length; i++) {
+        let item = arr[i];
+        let value = "";
+        let limit_date = "";
+        let advanceOptionSetting = item?.advanceOptionSetting;
+          //  单选
+        let optionSetting0  =String(advanceOptionSetting) === '0';
+        if (item.EQ || item.CL) {
+          value = item.EQ || item.CL;
+          if (item.settingObj?.attr === "PERCENTAGE") {
+            value = Number(value) / 100;
+          }
+          if (item.EVALUATEAttr) {
+            value = item.selecteds.join("|#|");
+          }
+        } else if((item.comType == 'SelectMui'&& optionSetting0)){
+          // 单选模式
+          let i = item.value;
+          let c = item?.labelList[i];
+          if (item.con == "CONVERT") {
+           value = c?.filter ? [c?.filter] : undefined
+          } else {
+           value= c?.labelName ? [c?.labelName] : undefined;
+          }
+        } else if (item.con == "QUOTE" && !vexutils.isEmpty(item.value)) {
+          // value = item.QUOTE.join("|#|");
+          if(item.comType == "treeSelect"){
+            let cval = item.value;
+            if(typeof cval === 'string'){
+              [cval]  = cval.split('<&=&>');
+              value = cval;
+            }  else if(Array.isArray(cval)) {
+              cval = cval.map((v)=>{
+                let [k] = typeof v === 'string' ? v.split('<&=&>'): [];
+                return k;
+              })
+              value = cval.join("|#|");
+            }
+          } else {
+            value = optionSetting0? item.value : item.value.join("|#|");
+          }
+        } else if (!vexutils.isEmpty(item.CONVERT)) {
+          value = item.CONVERT.map(item => {
+            if (item && vexutils.isJSON(item)) {
+              return JSON.parse(item);
+            }
+            return item;
+          });
+        } else if (item.DATE && !item.AGEAttr) {
+          // 年龄组件的不按照 date 类型处理
+          if (item.DATE.start_val || item.DATE.end_val) {
+            item.DATE.con = "IN";
+          }
+          item.tempCon = item.DATE.con;
+          item.start_val = item.DATE.start_val
+            ? item.DATE.start_val.format("YYYY-MM-DD HH:mm:ss")
+            : "";
+          item.end_val = item.DATE.end_val ? item.DATE.end_val.format("YYYY-MM-DD HH:mm:ss") : "";
+        } else if (item.BIRTHDAY) {
+          // 生日
+          let isChange = false;
+          if (
+            item.BIRTHDAY.limit_date.length > 0 ||
+            item.BIRTHDAY.start_val ||
+            item.BIRTHDAY.end_val
+          ) {
+            item.BIRTHDAY.con = "IN";
+          }
+          item.tempCon = item.BIRTHDAY.con;
+          // 因为年龄下拉有个默认值, 当输入框中有值时才取下拉值
+          if (item.BIRTHDAY.start_val || item.BIRTHDAY.end_val) {
+            isChange = true;
+          } else {
+            isChange = false;
+          }
+
+          // 校验
+          if (item.BIRTHDAY.start_val) {
+            let res = vexutils.validateBirthday(
+              item.BIRTHDAY.start_val,
+              item.title,
+              item.BIRTHDAY.unit
+            );
+            if (!res) return;
+          }
+          if (item.BIRTHDAY.end_val) {
+            let res = vexutils.validateBirthday(
+              item.BIRTHDAY.end_val,
+              item.title,
+              item.BIRTHDAY.unit
+            );
+            if (!res) return;
+          }
+          if (+item.BIRTHDAY.start_val > +item.BIRTHDAY.end_val) {
+            this.$message.warning(this.getI18nText(['1.9.47', { title: item.title }], `${item.title}请输入有效范围`), 2);
+            return;
+          }
+
+          limit_date = this.limit_date || "";
+          item.unit = isChange ? item.BIRTHDAY.unit || "" : "";
+          item.start_val = item.BIRTHDAY.start_val || "";
+          item.end_val = item.BIRTHDAY.end_val || "";
+        }
+        // 根据属性判断取值
+        if (item.LABELAttr) {
+          if (Object.keys(item.labelObj || {}).length > 0) {
+            let valList = [];
+            item.labelSelectList.forEach(v => {
+              valList.push(v.labelName);
+            });
+            value = valList.join("|#|");
+          } else {
+            value = item.inputVal;
+          }
+        } else if (item.EVALUATEAttr) {
+          value = item.selecteds.join("|#|");
+        } else if (item.AGEAttr) {
+          value = "";
+        } else if (item.NUMBERFiled && item.lessValue && item.bigValue) {
+          if (item.setting?.attr === "PERCENTAGE") {
+            value = Number(item.lessValue) / 100 + "~" + Number(item.bigValue) / 100;
+          } else {
+            value = item.lessValue + "~" + item.bigValue;
+          }
+        }
+        // 删除字符串前后空格
+        if (value && vexutils.isString(value)) {
+          value = value.trim();
+        }
+        let temp = {
+          field_key: item.columnName, // 一级value
+          con: item.DATE || item.BIRTHDAY ? item.tempCon : item.con, // 二级选择项value
+          value: value, // input输入值
+          limit_date: limit_date || "", // 生日
+          start_val: item.start_val || "", // 开始时间
+          end_val: item.end_val || "", // 结束时间
+          unit: item.unit || "", // 年龄
+          id: item.id
+        };
+        conObj.push(temp);
+      }
+      let dateCons = this.dateTeam.map(item => item.con);
+      let res = conObj.filter(
+        item =>
+          item.value ||
+          item.limit_date ||
+          item.start_val ||
+          item.end_val ||
+          dateCons.includes(item.con)
+      );
+      return res;
+    },
+    range(start, end) {
+      const result = [];
+      for (let i = start; i < end; i++) {
+        result.push(i);
+      }
+      return result;
+    },
+    // 日期选择范围
+    disabledDate(current) {
+      return (
+        (current && current < moment().startOf("year")) ||
+        current > moment().endOf("year")
+      );
+    },
+    changeRange(date, dateString) {
+      // 这里没有使用item中的limit_date, 而是用全局的变量limit_date储存
+      // 原因是因为range-picker 要求是个[] 并且v-model中的数据是个moment对象 即item.BIRRHDAY.limit_date = [moment, moment]
+      if (dateString[0]) {
+        this.limit_date = dateString.join("~");
+      } else {
+        this.limit_date = "";
+      }
+    },
+    // 填写新增搜索分类名称后保存按钮
+    saveToCalss() {
+      this.formInner.validateFields((err, values) => {
+        if (err) return;
+        let conObj = this.getConObjParams();
+        if (!conObj.length) {
+          conObj = [];
+        }
+        let displayCategory = this.parentNames.filter(item => item.selected)[0]?.value;
+        let params = {
+          tableId: this.$attrs.tableId || "",
+          setting: JSON.stringify({
+            displayCategory,
+            name: values.classname,
+            conObj: conObj
+          }),
+          conditionList: JSON.stringify(this.originConditionList)
+        };
+        this.saveTableCondiTion(params);
+
+      });
+    },
+    handleParentNamesAdd(e) {
+      const nextInput = e?.target?.nextElementSibling;
+      setTimeout(() => {
+        nextInput && nextInput.focus();
+      });
+      this.showAdd = true;
+    },
+    hanldeBlur() {
+      this.showAdd = false;
+      if (!this.addVal) return;
+      this.parentNames.forEach(v => (v.selected = false));
+      this.parentNames.push({
+        disabled: true,
+        value: this.addVal,
+        selected: true,
+        isAdd: true
+      });
+      this.addVal = "";
+    },
+    editParentName(e, item) {
+      item.disabled = false;
+      setTimeout(() => {
+        e.target.focus();
+      }, 0);
+    },
+    handleParentNameSelect(item, index) {
+      if (!item.disabled) return;
+      this.parentNames.forEach((pItem, pIndex) => {
+        if (pIndex !== index) {
+          pItem.selected = false;
+        }
+      });
+      item.selected = !item.selected;
+    },
+    handleParentNamesRemove(index, item) {
+      this.handleParent(index, item);
+    },
+    handleParent(index, item) {
+      let { conditionList = [] } = this.quickSearchListObj;
+      if (!conditionList || !conditionList.length) {
+        this.parentNames.splice(index, 1);
+        return;
+      }
+      let hasItem = conditionList.filter(v => v.displayCategory === item.value);
+      if (!hasItem || !hasItem.length) {
+        this.parentNames.splice(index, 1);
+        return;
+      }
+      this.$message.error("该分类下有已有数据，请删除该分类下的筛选集后重试！");
+    },
+    // 7.12保存列表搜索分类
+    async saveTableCondiTion(params) {
+      // let url = `/tableList/saveTableCondiTion`;
+      // this.axios.post(url, this.$qs.stringify(params)).then(({ data }) => {
+      //   if (data.result == "SUCCESS") {
+      //     this.showInner = false;
+      //     this.formInner.resetFields();
+      //     this.$emit("updateTableCondiTion");
+      //     this.clearData();
+      //     this.closeModal();
+      //   } else {
+      //     this.$message.error(data.resultMsg);
+      //   }
+      // });
+      try {
+        let res = await this.handleGetConfigApi(params, 'requestSaveTableCondiTion');
+        if (!res) return;
+        this.showInner = false;
+        this.formInner.resetFields();
+        this.$emit("updateTableCondiTion");
+        this.clearData();
+        this.closeModal();
+      } catch (error) {
+        console.log(error)
+      }
+    },
+    cancelSaveToCalss() {
+      this.showInner = false;
+    },
+    // 清空快速搜索设置条件
+    clearData() {
+      this.handlerReset(this.quickSearch);
+      this.relationQuickSearch.forEach(item => {
+        this.handlerReset(item.fieldList);
+      });
+      if (this.source === "editTable") {
+        this.$emit("clearQuickSearchConfig");
+        return;
+      }
+      this.$listeners?.clearQuickSearchConfig();
+    },
+    handlerReset(arr) {
+      if (!Array.isArray(arr)) {
+        return;
+      }
+      arr.forEach(item => {
+        let advanceOptionSetting = item?.advanceOptionSetting;
+          //  单选
+        let optionSetting0  =String(advanceOptionSetting) === '0';
+        if (item.EQ || item.CL) {
+          item.EQ = "";
+          item.CL = "";
+        } else if (item.con == "QUOTE" && !vexutils.isEmpty(item.value)) {
+          item.QUOTE = [];
+          item.value = [];
+        } else if(item.com == 'SelectMui' && item.con == 'CONVERT' && optionSetting0){
+          item.CONVERT = [];
+          item.value = undefined
+        } else if (!vexutils.isEmpty(item.CONVERT)) {
+          item.CONVERT = [];
+        } else if (item.DATE) {
+          item.showDate = String(advanceOptionSetting) == '1' ? true: false;
+          item.marginx = "ml";
+          item.DATE = {
+            con: null,
+            start_val: null,
+            end_val: null
+          };
+        } else if (item.BIRTHDAY) {
+          item.showDate = false;
+          item.marginx = "ml";
+          item.BIRTHDAY = this.initBirthdayParams();
+        } else if (item.LABELAttr) {
+          this.handleClearLabel(item);
+        } else if (item.EVALUATEAttr) {
+          item.selecteds = [];
+        } else if (item.AGEAttr) {
+          this.handleResetAge(item);
+        } else if (item.NUMBERFiled) {
+          this.clearFilterNumber(item);
+        }
+      });
+    },
+    initBirthdayParams() {
+      this.limit_date = "";
+      return {
+        con: null,
+        limit_date: [],
+        start_val: null,
+        end_val: null,
+        unit: "YEAR",
+        units: this.birthdayUnits.filter(i => i.units === 1)
+      };
+    },
+    // 单选按钮组合点击取消选中状态
+    clickRadioGroup(item, con) {
+      if (item.con == con) {
+        item.con = null;
+      } else {
+        if (item.con === "IN") {
+          item.start_val = null;
+          item.end_val = null;
+        }
+        item.con = con;
+      }
+    },
+    clickBirthdayRadioGroup(item, con) {
+      this.limit_date = "";
+      Object.assign(item, this.initBirthdayParams());
+      this.clickRadioGroup(item, con);
+    },
+    changeModalWindow() {
+      this.isChangeWindow = !this.isChangeWindow;
+      let docHeight = document.body.clientHeight;
+      this.modalWidth = this.modalWidth === "700px" ? `100%` : "700px";
+      this.modalHeight = this.modalHeight === "60vh" ? `${docHeight - 108}px` : "60vh";
+
+      if (this.modalWidth === "700px") {
+        this.label_max_count = 8;
+      } else {
+        this.$nextTick(() => {
+          let ele = document.querySelector(".quickSearch_label-container");
+          ele && (this.label_max_count = parseInt((ele.clientWidth - 20) / 112) * 2);
+        });
+      }
+    },
+
+    /* 获取 label */
+    handleRequestedLabel(v) {
+      let params = { type: v, pageSize: 10000 };
+      return this.axios.get("/label/list", { params: params });
+    },
+
+    async handleSetLabelOptions(labelType, el) {
+      let labelObj = {};
+      let labelList = await this.handleGetConfigApi(labelType, 'requestedLabel');
+      labelList.forEach(n => {
+        this.$set(n, 'isSelect', false);
+        if (labelObj[n.typeName]) {
+          labelObj[n.typeName].itemList.push({ ...n });
+        } else {
+          labelObj[n.typeName] = {
+            itemList: [{ ...n }],
+            showAdd: false,
+            addVal: '',
+            typeName: n.typeName,
+            typeId: n.typeId,
+            isUnfold: false,
+            isShowBtn: false
+          };
+        }
+      });
+      this.$set(el, 'labelObj', labelObj);
+      this.$set(el, 'labelList', labelList);
+    },
+
+    handleLabelColorClass(item) {
+      return item?.color?.split("-")[1] || "yellow";
+    },
+
+    handleLabelChange() {
+      const args = arguments;
+      if (args.length === 3) {
+        let [flag, item, options] = [...arguments];
+        let selectedList = options.labelSelectList || [];
+        if (flag) {
+          if (selectedList.some(n => n.labelId == item.labelId)) {
+            return;
+          }
+          selectedList.push(item);
+        } else {
+          let fdIndex = selectedList.findIndex(n => n.labelId == item.labelId);
+          if (fdIndex != -1) {
+            selectedList.splice(fdIndex, 1);
+          }
+        }
+        options.labelSelectList = selectedList;
+      }
+    },
+
+    handleClearLabel(v) {
+      v.labelSelectList.length = 0;
+      v.inputVal = "";
+      Object.entries(v.labelObj || {}).forEach(h => {
+        let [, item] = h;
+        item.itemList.forEach(l => {
+          l.isSelect = false;
+        });
+      });
+    },
+
+    handleLabelUpfold(v) {
+      console.log('触发---isUnfold');
+      v.isUnfold = !v.isUnfold;
+    },
+
+    handleEvaluateOnChange(tag, checked, item) {
+      if (checked) {
+        item.selecteds.push(tag.value);
+      } else {
+        let i = item.selecteds.findIndex(v => v === tag.value);
+        item.selecteds.splice(i, 1);
+      }
+    },
+
+    // 年龄组件变化
+    ageRangeOnChange(obj, item) {
+      let s = obj.star_val;
+      let e = obj.end_val;
+      this.$set(item, "start_val", isNaN(s) ? undefined : s);
+      this.$set(item, "end_val", isNaN(e) ? undefined : e);
+    },
+
+    // 清空年龄组件
+    handleResetAge(item) {
+      this.$set(item, "start_val", "");
+      this.$set(item, "end_val", "");
+      let key = `${item.columnName}_AGEAttr`;
+      let curRef = this.$refs[key];
+      if (Array.isArray(curRef)) {
+        curRef = curRef[0] || false;
+      }
+      curRef?.reset();
+    },
+
+    onResize(el, v) {
+      let height = el.offsetHeight || 0;
+      // let ch = el?.firstElementChild?.offsetHeight || 0;
+      if (!height) {
+        return;
+      }
+      if (height > 80) {
+        v.isShowBtn = true;
+      } else {
+        v.isShowBtn = false;
+        v.isUnfold = false;
+      }
+    },
+    changeFilterNumber(item) {
+      if (item.lessValue && item.bigValue) {
+        const lessValue = item.lessValue;
+        const bigValue = item.bigValue;
+        if (bigValue < lessValue) {
+          this.$set(item, "lessValue", bigValue);
+          this.$set(item, "bigValue", lessValue);
+        }
+        return;
+      }
+    },
+    clearFilterNumber(item) {
+      this.$set(item, "lessValue", "");
+      this.$set(item, "bigValue", "");
+    },
+
+    getI18nText(i, d) {
+      if (Array.isArray(i)) {
+        return this.$t ? this.$t.apply(this, i) : d;
+      }
+      return this.$t ? this.$t(i) : d;
+    }
+  },
+  directives: { resize }
+});
+</script>
+
+<style lang="less" scoped>
+.form-box {
+  .quick-item {
+    margin-bottom: 10px;
+    min-width: 32px;
+
+    .quick-row {
+      display: flex;
+      > div {
+        display: inline-block;
+        box-sizing: border-box;
+      }
+      .quick-item-title {
+        min-width: 80px;
+        line-height: 32px;
+        text-align: right;
+        padding-left: 12px;
+        color: #000;
+      }
+      .quick-item-col {
+        padding: 0 12px;
+      }
+      .quick-item-title-default {
+        width: 25%;
+      }
+      .quick-item-col-default {
+        width: 75%;
+      }
+    }
+    .check-box {
+      line-height: 32px;
+    }
+    .check-date-btn {
+      display: inline-block;
+      line-height: 32px;
+      height: 32px;
+      padding: 0 10px;
+      background-color: #ddd;
+      cursor: pointer;
+      &.ml {
+        margin-left: 20px;
+      }
+      &.mr {
+        margin-right: 20px;
+      }
+    }
+    .check-date {
+      display: inline-block;
+      line-height: 33px;
+    }
+    .birthday-item {
+      > div {
+        margin-top: 5px;
+        p {
+          display: inline-block;
+          margin: 0 20px;
+        }
+        > span {
+          margin-top: 5px;
+        }
+      }
+      .age-wrap {
+        display: inline-block;
+      }
+    }
+    /deep/ .ant-input-wrapper {
+      .ant-input-group-addon {
+        border: 1px solid #d9d9d9 !important;
+        border-left: 0 !important;
+      }
+    }
+
+    /deep/ .num-picker {
+      position: relative;
+      display: flex;
+      &.num-picker-unit {
+        padding-right: 20px;
+      }
+      input {
+        text-align: left !important;
+      }
+      &:hover {
+        .clear-number-icon {
+          display: block;
+        }
+      }
+      /deep/ .ant-calendar-range-picker-input {
+        text-align: left;
+      }
+      .clear-number-icon {
+        position: absolute;
+        right: 5px;
+        top: 6px;
+        display: none;
+        cursor: pointer;
+        z-index: 1000;
+      }
+    }
+  }
+  .ant-radio-button-wrapper {
+    padding: 0 8px;
+    height: 30px;
+    line-height: 30px;
+    margin-top: 5px;
+  }
+
+  // 标签
+  .label-attr-container {
+    .edit-label {
+      color: #000000;
+      font-size: 14px;
+      line-height: 32px;
+      padding-left: 0;;
+    }
+    .label-container-height {
+      overflow: hidden;
+      // width: 380px;
+      height: 74px;
+      flex: none;
+    }
+    .edit-content {
+      padding: 0;
+    }
+    .label-unfold-btn {
+      margin: 8px 0;
+      color: rgba(0, 0, 0, 0.6);
+      cursor: pointer;
+      >span {
+        display: flex;
+        align-items: center;
+        line-height: 1;
+      }
+      .anticon {
+        font-size: 16px;
+        margin-left: 8px;
+      }
+      &:hover {
+        color: #2d7aff;
+      }
+      &:active {
+        color: #2d7aff;
+      }
+    }
+  }
+  &.quick-search-table {
+    .module-title {
+      color: #506493;
+      line-height: 20px;
+      padding-left: 12px;
+      border-left: 4px solid #2d7aff;
+    }
+    .quick-item {
+      display: inline-block;
+      &.quick-block {
+        display: block;
+      }
+    }
+  }
+
+  .psw-icon {
+    cursor: pointer;
+    &:active {
+      color: #5585f5;
+      // #2474ff
+    }
+    color: #969696;
+  }
+
+  ::-webkit-input-placeholder {
+    /* WebKit browsers */
+    font-family: "Avenir", Helvetica, Arial, sans-serif;
+  }
+
+  ::-moz-placeholder {
+    /* Mozilla Firefox 19+ */
+    font-family: "Avenir", Helvetica, Arial, sans-serif;
+  }
+
+  :-ms-input-placeholder {
+    /* Internet Explorer 10+ */
+    font-family: "Avenir", Helvetica, Arial, sans-serif;
+  }
+}
+// .age-container {
+// }
+</style>
+<style lang="less">
+.quickSearch-saveToClass-modal {
+  .edit-tag {
+    position: relative;
+    display: inline-block;
+    margin-right: 10px;
+    margin-bottom: 10px;
+    .add-parent {
+      border-color: #d9d9d9;
+    }
+    .anticon-close {
+      position: absolute;
+      right: 5px;
+      line-height: 36px;
+      color: #2d7aff;
+    }
+    .ant-input-disabled {
+      color: #2d7aff;
+      background-color: rgba(45, 122, 255, 0.1);
+      opacity: 1;
+      border-color: #2d7aff;
+      cursor: pointer;
+    }
+    .ant-input-group-addon,
+    .ant-input:not(:hover),
+    .ant-input-number:not(:hover) {
+      border-color: #2d7aff !important;
+    }
+    &.edit-tag-select {
+      .ant-input-disabled {
+        color: #fff;
+        background-color: #2d7aff;
+      }
+      .anticon-close {
+        color: #fff;
+      }
+    }
+  }
+}
+</style>