syntec3-0-ui-components-test 1.0.0

package/src/components/customFilter/filterCriteria.vue

@@ -0,0 +1,769 @@
+<template>
+  <div>
+    <el-form
+      v-for="(item, index) in filterConditions"
+      ref="filterForm"
+      :key="index"
+      :model="item"
+      :rules="getRules(item)"
+      :data-test-id="`EL-FORM-t4nN1q-${index}`"
+    >
+      <el-row :gutter="10" data-test-id="EL-ROW-i6hi71">
+        <!-- 字段选择 -->
+        <el-col :span="6" data-test-id="EL-COL-YtO6It">
+          <el-form-item
+            :label="isItDefault ? t('dataFilter') : ''"
+            prop="CloumnName"
+            data-test-id="EL-FORM-ITEM-X2DfMG"
+          >
+            <el-select
+              v-model="item.CloumnName"
+              filterable
+              data-test-id="EL-SELECT-Tla5bC"
+              @change="handleChangeColumn($event, index)"
+            >
+              <el-option
+                v-for="(it, index) in fieldSetting"
+                :key="it.key"
+                :label="t(it.fieldName)"
+                :value="it.key"
+                :disabled="
+                  filterConditions.some((item) => item.CloumnName === it.key) ||
+                  otherFilterConditions.some((item) => item.CloumnName === it.key)
+                "
+                :data-test-id="`EL-OPTION-24JqP4-${index}`"
+              />
+            </el-select>
+          </el-form-item>
+        </el-col>
+
+        <!-- 操作符 -->
+        <el-col v-if="item.CloumnName" :span="4" data-test-id="EL-COL-o6tUCn">
+          <el-form-item prop="Operator" data-test-id="EL-FORM-ITEM-lwyEu4">
+            <el-select
+              v-model="item.Operator"
+              :placeholder="t('selectOperation')"
+              data-test-id="EL-SELECT-B8JVKa"
+              @change="handleChangeOperator($event, index)"
+            >
+              <el-option
+                v-for="(it, index) in operatorOptionsFunction(item.ColumnType)"
+                :key="it.value"
+                :label="t(it.label)"
+                :value="it.value"
+                :data-test-id="`EL-OPTION-698Ga6-${index}`"
+              />
+            </el-select>
+          </el-form-item>
+
+          <!-- StartOrEnd（仅类型4） -->
+          <el-form-item v-if="item.ColumnType === 4" prop="StartOrEnd" data-test-id="EL-FORM-ITEM-iI09Nl">
+            <el-select
+              v-model="item.StartOrEnd"
+              style="margin-top: 1rem"
+              :placeholder="t('startOrEndTime')"
+              data-test-id="EL-SELECT-hYLMt4"
+            >
+              <el-option
+                v-for="(it, index) in startOrEndOptions"
+                :key="it.value"
+                :label="t(it.label)"
+                :value="it.value"
+                :data-test-id="`EL-OPTION-qkQDv6-${index}`"
+              />
+            </el-select>
+          </el-form-item>
+        </el-col>
+
+        <!-- 值输入 -->
+        <el-col v-if="item.Operator && ![9, 10].includes(item.Operator)" :span="12" data-test-id="EL-COL-bWX9Cb">
+          <!-- 文本 / 附件 / 超链接 -->
+          <el-form-item
+            v-if="isTextLikeType(item.ColumnType) && isTextOperator(item.Operator)"
+            prop="TextValue"
+            data-test-id="EL-FORM-ITEM-MaRru1"
+          >
+            <el-input v-model="item.TextValue" :placeholder="t('inputText')" clearable data-test-id="EL-INPUT-RoUXuD" />
+          </el-form-item>
+
+          <!-- 数字范围 -->
+          <el-form-item
+            v-else-if="item.ColumnType === 2 && [13, 14].includes(item.Operator)"
+            prop="NumberRangeValue"
+            data-test-id="EL-FORM-ITEM-vLLx0f"
+          >
+            <el-input-number
+              v-model="item.NumberRangeValue[0]"
+              :max="item.NumberRangeValue[1] ?? Number.MAX_SAFE_INTEGER"
+              :controls="false"
+              :placeholder="t('minValue')"
+              disabled-scientific
+              clearable
+              data-test-id="EL-INPUT-NUMBER-nxVp98"
+            />
+            <span data-test-id="SPAN-aJGkhM"> - </span>
+            <el-input-number
+              v-model="item.NumberRangeValue[1]"
+              :min="item.NumberRangeValue[0] ?? Number.MIN_SAFE_INTEGER"
+              :controls="false"
+              :placeholder="t('maxValue')"
+              disabled-scientific
+              clearable
+              data-test-id="EL-INPUT-NUMBER-BhVdW7"
+            />
+            <el-button type="text" data-test-id="EL-BUTTON-1EWCV6" @click="handleNumberValidate(index)">
+              <i class="mdi mdi-close" data-test-id="I-a2oGJf" />
+            </el-button>
+          </el-form-item>
+
+          <!-- 单选/多选 -->
+          <el-form-item
+            v-else-if="isSelectType(item.ColumnType) && [15, 16].includes(item.Operator)"
+            prop="SelectRangeValue"
+            data-test-id="EL-FORM-ITEM-tjsXva"
+          >
+            <el-select
+              v-model="item.SelectRangeValue"
+              collapse-tags
+              collapse-tags-tooltip
+              multiple
+              filterable
+              :placeholder="t('selectOptions')"
+              clearable
+              data-test-id="EL-SELECT-3wxMW0"
+            >
+              <el-option
+                v-for="(opt, index) in fieldSelectOptionsFunction(item.CloumnName)"
+                :key="opt.value"
+                :label="t(opt.label)"
+                :value="opt.value"
+                :data-test-id="`EL-OPTION-5wrWi6-${index}`"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item
+            v-else-if="isSelectType(item.ColumnType) && [5].includes(item.Operator)"
+            prop="SingleSelectValue"
+            data-test-id="EL-FORM-ITEM-tjsXvb"
+          >
+            <el-select
+              v-model="item.SingleSelectValue"
+              collapse-tags
+              collapse-tags-tooltip
+              filterable
+              :placeholder="t('selectOptions')"
+              clearable
+              data-test-id="EL-SELECT-3wxMWS"
+            >
+              <el-option
+                v-for="(opt, index) in fieldSelectOptionsFunction(item.CloumnName)"
+                :key="opt.value"
+                :label="t(opt.label)"
+                :value="opt.value"
+                :data-test-id="`EL-OPTION-5wrWi5-${index}`"
+              />
+            </el-select>
+          </el-form-item>
+
+          <!-- 日期单值 -->
+          <el-form-item
+            v-else-if="isDateType(item.ColumnType) && [1, 2, 3, 4, 5].includes(item.Operator)"
+            prop="DateTimeOperatorValue"
+            data-test-id="EL-FORM-ITEM-932Tco"
+          >
+            <el-row :gutter="10" data-test-id="EL-ROW-CWWfMC">
+              <el-col :span="6" data-test-id="EL-COL-3tGiBz8">
+                <el-select
+                  v-model="item.DateTimeOperatorValue.TimeType"
+                  :placeholder="t('timePrecision')"
+                  clearable
+                  data-test-id="EL-SELECT-nphb5z"
+                >
+                  <el-option
+                    v-for="(it, index) in timePrecisionOptions"
+                    :key="it.value"
+                    :label="t(it.label)"
+                    :value="it.value"
+                    :data-test-id="`EL-OPTION-7foEY9-${index}`"
+                  />
+                </el-select>
+              </el-col>
+              <el-col :span="18" data-test-id="EL-COL-rxXI8U">
+                <el-date-picker
+                  v-model="item.DateTimeOperatorValue.TimeValue"
+                  :type="item.DateTimeOperatorValue.TimeType === 0 ? 'date' : 'datetime'"
+                  :format="timePrecisionOptionsFunction(item.DateTimeOperatorValue.TimeType)"
+                  value-format="x"
+                  :placeholder="t('selectTime')"
+                  clearable
+                  data-test-id="EL-DATE-PICKER-BFwrVh"
+                />
+              </el-col>
+            </el-row>
+          </el-form-item>
+
+          <!-- 日期范围 -->
+          <el-form-item
+            v-else-if="isDateType(item.ColumnType) && item.Operator === 11"
+            prop="DateTimeRangeValue"
+            data-test-id="EL-FORM-ITEM-nM49hw"
+          >
+            <el-row :gutter="10" data-test-id="EL-ROW-zZIFj0">
+              <el-col :span="6" data-test-id="EL-COL-k6LrJP">
+                <el-select
+                  v-model="item.DateTimeRangeValue.TimeType"
+                  :placeholder="t('timePrecision')"
+                  clearable
+                  data-test-id="EL-SELECT-93yQnb"
+                >
+                  <el-option
+                    v-for="(it, index) in timePrecisionOptions"
+                    :key="it.value"
+                    :label="t(it.label)"
+                    :value="it.value"
+                    :data-test-id="`EL-OPTION-WuL5hF-${index}`"
+                  />
+                </el-select>
+              </el-col>
+              <el-col :span="24" data-test-id="EL-COL-Zy3UKA">
+                <el-date-picker
+                  :key="componentKey"
+                  v-model="item.DateTimeRangeValue.TimeValue"
+                  style="width: 90%; margin-top: 1rem"
+                  :type="item.DateTimeRangeValue.TimeType === 0 ? 'daterange' : 'datetimerange'"
+                  :format="timePrecisionOptionsFunction(item.DateTimeRangeValue.TimeType)"
+                  value-format="x"
+                  clearable
+                  range-separator="-"
+                  :start-placeholder="t('starttime')"
+                  :end-placeholder="t('endtime')"
+                  data-test-id="EL-DATE-PICKER-fPXNSn"
+                  @clear="item.DateTimeRangeValue.TimeValue = []"
+                  @change="(() => {
+                    componentKey++
+                  })"
+                />
+              </el-col>
+            </el-row>
+          </el-form-item>
+
+          <!-- 动态筛选 -->
+          <el-form-item
+            v-else-if="isDateType(item.ColumnType) && item.Operator === 12"
+            prop="DateTimeDynamicFilteringValue"
+            data-test-id="EL-FORM-ITEM-3pz54d"
+          >
+            <el-row :gutter="10" data-test-id="EL-ROW-wcwmDm">
+              <el-col :span="12" data-test-id="EL-COL-1WOBcB">
+                <el-select
+                  v-model="item.DateTimeDynamicFilteringValue.DateType"
+                  :placeholder="t('dynamicFiltering')"
+                  clearable
+                  data-test-id="EL-SELECT-93zW0f"
+                  @change="handleDateTimeDynamicFilteringValueChange($event, index)"
+                >
+                  <el-option
+                    v-for="(it, index) in dynamicFilteringOptions"
+                    :key="it.value"
+                    :label="t(it.label)"
+                    :value="it.value"
+                    :data-test-id="`EL-OPTION-j2Gto6-${index}`"
+                  />
+                </el-select>
+              </el-col>
+              <el-col :span="12" data-test-id="8">
+                <div style="width: 200px" data-test-id="DIV-oQYQZI" />
+              </el-col>
+            </el-row>
+          </el-form-item>
+
+          <!-- 自定义单区间 -->
+          <el-form-item
+            v-if="
+              item.DateTimeDynamicFilteringValue.DateType === 0 || item.DateTimeDynamicFilteringValue.DateType === 1
+            "
+            prop="DateTimeDynamicFilteringCustomize"
+            data-test-id="EL-FORM-ITEM-oKi0MK"
+          >
+            <el-col v-if="item.DateTimeDynamicFilteringValue.DateType === 0" :span="24" data-test-id="EL-COL-5XNCgU">
+              <el-row :gutter="10" data-test-id="EL-ROW-zHGl1c">
+                <el-col :span="8" data-test-id="EL-COL-tTDMtb">
+                  <el-select
+                    v-model="item.DateTimeDynamicFilteringCustomize[0].PastOrFuture"
+                    :placeholder="t('pastOrFuture')"
+                    clearable
+                    data-test-id="EL-SELECT-xifi4x"
+                  >
+                    <el-option
+                      v-for="(it, index) in pastOrFutureOptions"
+                      :key="it.value"
+                      :label="t(it.label)"
+                      :value="it.value"
+                      :data-test-id="`EL-OPTION-0ql2zr-${index}`"
+                    />
+                  </el-select>
+                </el-col>
+                <el-col :span="8" data-test-id="EL-COL-T5qcri">
+                  <el-input-number
+                    v-model="item.DateTimeDynamicFilteringCustomize[0].NumberValue"
+                    :min="1"
+                    :max="365"
+                    :precision="0"
+                    :controls="false"
+                    style="width: 100%"
+                    clearable
+                    data-test-id="EL-INPUT-NUMBER-RYLnRt"
+                  />
+                </el-col>
+                <el-col :span="8" data-test-id="EL-COL-JlxABO">
+                  <el-select
+                    v-model="item.DateTimeDynamicFilteringCustomize[0].DayType"
+                    :placeholder="t('unit')"
+                    clearable
+                    data-test-id="EL-SELECT-8Lpazq"
+                  >
+                    <el-option
+                      v-for="(it, index) in dayTypeOptions"
+                      :key="it.value"
+                      :label="t(it.label)"
+                      :value="it.value"
+                      :data-test-id="`EL-OPTION-ncuVRo-${index}`"
+                    />
+                  </el-select>
+                </el-col>
+              </el-row>
+            </el-col>
+
+            <!-- 自定义双区间 -->
+            <el-col
+              v-else-if="item.DateTimeDynamicFilteringValue.DateType === 1"
+              :span="24"
+              data-test-id="EL-COL-eM8opS"
+            >
+              <el-row :gutter="10" data-test-id="EL-ROW-lcZ8pe">
+                <el-col :span="8" data-test-id="EL-COL-7j3j0p">
+                  <el-select
+                    v-model="item.DateTimeDynamicFilteringCustomize[0].PastOrFuture"
+                    :placeholder="t('pastOrFuture')"
+                    clearable
+                    data-test-id="EL-SELECT-FjHTpQ"
+                  >
+                    <el-option
+                      v-for="(it, index) in pastOrFutureOptions"
+                      :key="it.value"
+                      :label="t(it.label)"
+                      :value="it.value"
+                      :data-test-id="`EL-OPTION-xpcYp5-${index}`"
+                    />
+                  </el-select>
+                </el-col>
+                <el-col :span="8" data-test-id="EL-COL-JnQ12D">
+                  <el-input-number
+                    v-model="item.DateTimeDynamicFilteringCustomize[0].NumberValue"
+                    :min="1"
+                    :max="365"
+                    :precision="0"
+                    :controls="false"
+                    style="width: 100%"
+                    clearable
+                    data-test-id="EL-INPUT-NUMBER-3lwksG"
+                  />
+                </el-col>
+                <el-col :span="8" data-test-id="EL-COL-ms7sgy">
+                  <el-select
+                    v-model="item.DateTimeDynamicFilteringCustomize[0].DayType"
+                    :placeholder="t('unit')"
+                    clearable
+                    data-test-id="EL-SELECT-fgZOLb"
+                  >
+                    <el-option
+                      v-for="(it, index) in dayTypeOptions"
+                      :key="it.value"
+                      :label="t(it.label)"
+                      :value="it.value"
+                      :data-test-id="`EL-OPTION-Q07Tx8-${index}`"
+                    />
+                  </el-select>
+                </el-col>
+              </el-row>
+              <el-row :gutter="10" style="margin-top: 1rem" data-test-id="EL-ROW-XkOYka">
+                <el-col :span="8" data-test-id="EL-COL-dLQQRb">
+                  <el-select
+                    v-model="item.DateTimeDynamicFilteringCustomize[1].PastOrFuture"
+                    :placeholder="t('pastOrFuture')"
+                    clearable
+                    data-test-id="EL-SELECT-ZNyGMx"
+                  >
+                    <el-option
+                      v-for="(it, index) in pastOrFutureOptions"
+                      :key="it.value"
+                      :label="t(it.label)"
+                      :value="it.value"
+                      :data-test-id="`EL-OPTION-nlnE2g-${index}`"
+                    />
+                  </el-select>
+                </el-col>
+                <el-col :span="8" data-test-id="EL-COL-3uTjYF">
+                  <el-input-number
+                    v-model="item.DateTimeDynamicFilteringCustomize[1].NumberValue"
+                    :min="1"
+                    :max="365"
+                    :precision="0"
+                    :controls="false"
+                    style="width: 100%"
+                    clearable
+                    data-test-id="EL-INPUT-NUMBER-w1GgpV"
+                  />
+                </el-col>
+                <el-col :span="8" data-test-id="EL-COL-wDLRGi">
+                  <el-select
+                    v-model="item.DateTimeDynamicFilteringCustomize[1].DayType"
+                    :placeholder="t('unit')"
+                    clearable
+                    data-test-id="EL-SELECT-3d7Hyz"
+                  >
+                    <el-option
+                      v-for="(it, index) in dayTypeOptions"
+                      :key="it.value"
+                      :label="t(it.label)"
+                      :value="it.value"
+                      :data-test-id="`EL-OPTION-wkFjZV-${index}`"
+                    />
+                  </el-select>
+                </el-col>
+              </el-row>
+            </el-col>
+          </el-form-item>
+        </el-col>
+        <el-col v-if="!isItDefault" :span="2" data-test-id="EL-COL-7VbmTB">
+          <!-- 删除按钮 -->
+          <el-button type="text" data-test-id="EL-BUTTON-f9487D" @click="removeFilter(index)">
+            <i class="mdi mdi-close" data-test-id="I-lr2pJ2" />
+          </el-button>
+        </el-col>
+      </el-row>
+    </el-form>
+  </div>
+</template>
+<script setup>
+import { ref, nextTick } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { ElMessageBox, ElMessage } from 'element-plus';
+
+const { t } = useI18n();
+const props = defineProps({
+  filterConditions: {
+    type: Array,
+    default: () => [],
+  }, // 筛选条件
+  fieldSetting: {
+    type: Array,
+    default: () => [],
+  }, // 筛选条件内容的字段配置
+  isItDefault: {
+    type: Boolean,
+    default: false,
+  }, // 是否默认筛选条件
+  otherFilterConditions: {
+    type: Array,
+    default: () => [],
+  }, // 其他筛选条件
+  selectOptions: {
+    type: Object,
+    default: function () {
+      return {};
+    },
+  }, // 外部传入的筛选选项数据
+});
+const componentKey = ref(1);
+const { filterConditions, fieldSetting, isItDefault, otherFilterConditions } = props;
+// 工具函数：判断字段类型
+const isTextLikeType = (type) => [1, 5, 6].includes(type); // 文本、附件、超链接
+const isSelectType = (type) => [7, 8].includes(type); // 单选、多选
+const isDateType = (type) => [3, 4].includes(type); // 日期、日期范围
+const isTextOperator = (op) => [5, 6, 7, 8].includes(op); // 等于、包含等
+
+const filterForm = ref([]);
+// 验证规则动态生成
+const getRules = (item) => {
+  const rules = {};
+
+  if (![9, 10].includes(item?.Operator)) {
+    if (item.ColumnType === 2 && [13, 14].includes(item.Operator)) {
+      rules.NumberRangeValue = [
+        {
+          validator: (rule, value, callback) => {
+            if (value.length === 1 && value[0] !== null) {
+              return callback(new Error(t('inputValidRange')));
+            }
+            if (value.length === 2 && (value[0] === null) !== (value[1] === null)) {
+              return callback(new Error(t('inputValidRange')));
+            }
+            if (value.length === 2 && value[0] !== null && value[1] !== null && value[0] > value[1]) {
+              return callback(new Error(t('startValueCannotGreaterThanEndValue')));
+            }
+            callback();
+          },
+          trigger: 'change',
+        },
+      ];
+    }
+  }
+
+  return rules;
+};
+/**
+ * 数字范围验证
+ * @param index 筛选条件索引
+ */
+const handleNumberValidate = (index) => {
+  filterConditions[index].NumberRangeValue = [];
+  filterForm.value[index].clearValidate('NumberRangeValue');
+  filterForm.value[index].validateField('NumberRangeValue');
+};
+
+/* 时间精度 */
+const timePrecisionOptions = ref([
+  { value: 0, label: 'daily', timeFormat: 'YYYY-MM-DD' },
+  { value: 1, label: 'hour', timeFormat: 'YYYY-MM-DD HH' },
+  { value: 2, label: 'minute', timeFormat: 'YYYY-MM-DD HH:mm' },
+  { value: 3, label: 'second', timeFormat: 'YYYY-MM-DD HH:mm:ss' },
+]);
+/**
+ * 时间精度选项
+ * @param timeType 时间精度
+ * @returns 时间格式
+ */
+const timePrecisionOptionsFunction = (timeType) => {
+  return timePrecisionOptions.value.find((item) => item.value === timeType)?.timeFormat;
+};
+/* 动态筛选 */
+const dynamicFilteringOptions = ref([
+  { value: 2, label: 'today' },
+  { value: 3, label: 'yesterday' },
+  { value: 4, label: 'thisWeek' },
+  { value: 5, label: 'lastWeek' },
+  { value: 6, label: 'thisMonth' },
+  { value: 7, label: 'lastMonth' },
+  { value: 8, label: 'lastThreeMonths' },
+  { value: 0, label: 'custom' },
+  { value: 1, label: 'customRange' },
+]);
+/* 动态筛选自定义筛选 */
+const pastOrFutureOptions = ref([
+  { value: 0, label: 'past' },
+  { value: 1, label: 'future' },
+]);
+/* 动态筛选自定义筛选时间类型 */
+const dayTypeOptions = ref([
+  { value: 1, label: 'daily' },
+  { value: 2, label: 'week' },
+  { value: 3, label: 'month' },
+  { value: 4, label: 'quarter' },
+  { value: 5, label: 'year' },
+]);
+/* 筛选条件内容的字段类型为4时，判断逻辑选项 */
+const startOrEndOptions = ref([
+  { value: 0, label: 'intervalStart' },
+  { value: 1, label: 'intervalEnd' },
+]);
+/* 判断逻辑 */
+const operatorOptions = ref([
+  { value: 1, label: 'greaterThan' },
+  { value: 2, label: 'greaterThanOrEqualTo' },
+  { value: 3, label: 'lessThan' },
+  { value: 4, label: 'lessThanOrEqualTo' },
+  { value: 5, label: 'equalTo' },
+  { value: 6, label: 'notEqualTo' },
+  { value: 7, label: 'contains' },
+  { value: 8, label: 'notContains' },
+  { value: 9, label: 'yesEmpty' },
+  { value: 10, label: 'notEmpty' },
+  { value: 11, label: 'selectRange' },
+  { value: 12, label: 'dynamicFiltering' },
+  { value: 13, label: 'inRange' },
+  { value: 14, label: 'notInRange' },
+  { value: 15, label: 'isOneOf' },
+  { value: 16, label: 'notAnyOf' },
+]);
+/**
+ * 筛选条件内容的字段类型改变时，判断逻辑选项改变
+ * @param fieldTypeId 筛选条件内容的字段类型
+ * @returns 筛选条件内容的判断逻辑选项
+ */
+const operatorOptionsFunction = (fieldTypeId) => {
+  const mapping = {
+    1: [5, 6, 7, 8, 9, 10], // 文本
+    2: [9, 10, 13, 14], // 数字
+    3: [1, 2, 3, 4, 5, 9, 10, 11, 12], // 日期
+    4: [1, 2, 3, 4, 5, 9, 10, 11, 12], // 日期范围
+    5: [5, 6, 7, 8, 9, 10], // 附件
+    6: [5, 6, 7, 8, 9, 10], // 超链接
+    7: [5], // 单选
+    8: [9, 10, 15, 16], // 多选
+  };
+  const allowed = mapping[fieldTypeId] || [];
+  return operatorOptions.value.filter((op) => allowed.includes(op.value));
+};
+/**
+ * 筛选条件内容的字段类型改变时，判断逻辑选项改变
+ * @param columnName 筛选条件内容的字段类型
+ * @returns 筛选条件内容的判断逻辑选项
+ */
+const fieldSelectOptionsFunction = (columnName) => {
+  // 添加输入验证，确保columnName是有效的字符串
+  if (columnName === null || columnName === undefined) {
+    return [];
+  }
+  try {
+    // 优先使用外部提供的直接字段配置
+    if (props.selectOptions && typeof props.selectOptions === 'object') {
+      // 1.直接通过字段名配置
+      if (props.selectOptions[columnName]) {
+        return Array.isArray(props.selectOptions[columnName]) ? props.selectOptions[columnName] : [];
+      }
+      // 2.通过类型配置（例如xxxOptions）
+      const typeOptionsKey = Object.keys(props.selectOptions).find(
+        (key) => key.endsWith('Options') && columnName.includes(key.replace('Options', '')),
+      );
+      if (typeOptionsKey) {
+        return Array.isArray(props.selectOptions[typeOptionsKey]) ? props.selectOptions[typeOptionsKey] : [];
+      }
+    }
+    // 从字段配置中获取选项
+    const dataSource = Array.isArray(fieldSetting) ? fieldSetting : [];
+    const field = dataSource.find((f) => f && f.key === columnName);
+    if (field && (field.fieldTypeId === 7 || field.fieldTypeId === 8)) {
+      // 选择类型字段（单选/多选）
+      if (field.fieldSelectOptions) {
+        try {
+          const opts = JSON.parse(field.fieldSelectOptions);
+          return Array.isArray(opts)
+            ? opts.map((opt) => ({
+                label: field.isDoc ? opt : opt ? opt.key || opt.label || opt.value : '',
+                value: field.isDoc ? opt : opt ? opt.value : '',
+              }))
+            : [];
+        } catch (jsonError) {
+          ElMessage.error(t('apiError'));
+        }
+      }
+    }
+
+    return [];
+  } catch (e) {
+    return [];
+  }
+};
+/**
+ * 筛选条件内容的字段类型改变时，赋默认值
+ * @param type 筛选条件内容的字段类型
+ */
+const fieldTypeFun = (type) => {
+  if ([1, 5, 6].includes(type)) {
+    return 5;
+  }
+  if (type === 2) {
+    return 13;
+  }
+  if ([3, 4].includes(type)) {
+    return 11;
+  }
+  if (type === 7) {
+    return 5;
+  }
+  if (type === 8) {
+    return 15;
+  }
+  return null;
+};
+/**
+ * 筛选条件内容的字段类型改变时，判断逻辑选项改变
+ * @param value 筛选条件内容的字段类型
+ * @param index 筛选条件的索引
+ */
+const handleChangeColumn = (value, index) => {
+  const field = props.fieldSetting.find((f) => f.key === value);
+  const item = filterConditions[index];
+  Object.assign(item, {
+    CloumnName: value,
+    ColumnType: field?.fieldTypeId,
+    Operator: fieldTypeFun(field?.fieldTypeId),
+    StartOrEnd: null,
+    TextValue: null,
+    IsCustomSetting: field?.isDoc,
+    DocCustomId: field?.isDoc ? field.key : null,
+    NumberRangeValue: [],
+    SelectRangeValue: [],
+    SingleSelectValue: null,
+    DateTimeOperatorValue: { TimeType: null, TimeValue: null },
+    DateTimeRangeValue: { TimeType: [3, 4].includes(field?.fieldTypeId) ? 0 : null, TimeValue: [] },
+    DateTimeDynamicFilteringValue: { DateType: null },
+    DateTimeDynamicFilteringCustomize: [
+      { PastOrFuture: null, NumberValue: null, DayType: null },
+      { PastOrFuture: null, NumberValue: null, DayType: null },
+    ],
+  });
+};
+/**
+ *
+ * @param value 筛选条件内容的判断逻辑
+ * @param index 筛选条件的索引
+ */
+const handleChangeOperator = (value, index) => {
+  const item = filterConditions[index];
+  // 清空无关字段
+  Object.assign(item, {
+    TextValue: null,
+    NumberRangeValue: [],
+    SelectRangeValue: [],
+    SingleSelectValue: null,
+    DateTimeOperatorValue: { TimeType: null, TimeValue: null },
+    DateTimeRangeValue: { TimeType: null, TimeValue: [] },
+    DateTimeDynamicFilteringValue: { DateType: null },
+    DateTimeDynamicFilteringCustomize: [
+      { PastOrFuture: null, NumberValue: null, DayType: null },
+      { PastOrFuture: null, NumberValue: null, DayType: null },
+    ],
+  });
+};
+/**
+ * 动态筛选自定义筛选时间类型改变时，判断逻辑选项改变
+ * @param value 动态筛选自定义筛选时间类型
+ * @param index 筛选条件的索引
+ */
+const handleDateTimeDynamicFilteringValueChange = (value, index) => {
+  const item = filterConditions[index];
+  item.DateTimeDynamicFilteringCustomize = [
+    { PastOrFuture: null, NumberValue: null, DayType: null },
+    { PastOrFuture: null, NumberValue: null, DayType: null },
+  ];
+};
+/**
+ * 删除筛选条件
+ * @param index 筛选条件的索引
+ */
+const removeFilter = (index) => {
+  ElMessageBox.confirm(t('confirmToDelete'), t('confirmDelete'), {
+    confirmButtonText: t('confirm'),
+    cancelButtonText: t('cancel'),
+    type: 'warning',
+  }).then(() => {
+    filterConditions.splice(index, 1);
+    // emit('update:filterConditions', filterConditions);
+  });
+};
+// 暴露提交方法
+const validateAllForms = async () => {
+  await nextTick();
+  try {
+    await Promise.all(filterForm.value.map((form) => form?.validate?.() || Promise.resolve()));
+    return true;
+  } catch (error) {
+    ElMessage.error(t('checkForm'));
+    return false;
+  }
+};
+defineExpose({ validateAllForms });
+</script>
+<style scoped lang="scss"></style>