feat(查询组件): v2文本下拉框默认值，希望可以设置为动态值 #12071

2026-06-17 04:51:43 +08:00 · 2025-06-24 16:06:08 +08:00
parent 7693d278a9
commit fa5b49d1bb
5 changed files with 62 additions and 24 deletions
--- a/core/core-frontend/src/custom-component/v-query/Component.vue
+++ b/core/core-frontend/src/custom-component/v-query/Component.vue
@@ -16,6 +16,7 @@ import {
  reactive,
  ref,
  toRefs,
+  unref,
  watch,
  computed,
  onMounted,
@@ -64,8 +65,7 @@ const { element, view, scale } = toRefs(props)
 const { t } = useI18n()
 const vQueryRef = ref()
 const dvMainStore = dvMainStoreWithOut()
-const { curComponent, canvasViewInfo, mobileInPc, firstLoadMap, editMode } =
-  storeToRefs(dvMainStore)
+const { curComponent, canvasViewInfo, mobileInPc, firstLoadMap } = storeToRefs(dvMainStore)
 const canEdit = ref(false)
 const queryConfig = ref()
 const defaultStyle = {
@@ -92,14 +92,12 @@ const defaultStyle = {
  queryConditionWidth: 227,
  nameboxSpacing: 8,
  queryConditionSpacing: 16,
+  queryConditionHeight: 32,
  btnColor: '#3370ff',
  labelColorBtn: '#ffffff'
 }
 const customStyle = reactive({ ...defaultStyle })
 const snapshotStore = snapshotStoreWithOut()
-const userAgent = navigator.userAgent.toLowerCase()
-// 判断是否为飞书内置浏览器
-const isFeiShu = /lark/i.test(userAgent)

 const btnStyle = computed(() => {
  const style = {
@@ -237,6 +235,7 @@ const setCustomStyle = val => {
    queryConditionWidth,
    nameboxSpacing,
    queryConditionSpacing,
+    queryConditionHeight,
    labelColorBtn,
    btnColor,
    placeholderSize,
@@ -270,6 +269,7 @@ const setCustomStyle = val => {
  customStyle.queryConditionWidth = queryConditionWidth ?? 227
  customStyle.nameboxSpacing = nameboxSpacing ?? 8
  customStyle.queryConditionSpacing = queryConditionSpacing ?? 16
+  customStyle.queryConditionHeight = queryConditionHeight ?? 32
  customStyle.labelColorBtn = labelColorBtn || '#ffffff'
  customStyle.labelShow = labelShow ?? true
  customStyle.btnColor = btnColor || '#3370ff'
@@ -355,22 +355,26 @@ const getKeyList = next => {
 }

 const fillRequireVal = arr => {
-  element.value.propValue.forEach(next => {
+  element.value.propValue?.forEach(next => {
    if (arr.some(itx => next.checkedFields.includes(itx)) && next.required) {
      if (next.displayType === '8') {
        const { conditionValueF, conditionValueS, conditionType } = next
        if (conditionType === 0 && conditionValueF === '') {
          next.conditionValueF = next.defaultConditionValueF
-        } else if (conditionValueF === '' || conditionValueS === '') {
-          next.conditionValueF = next.defaultConditionValueF
-          next.conditionValueS = next.defaultConditionValueS
+        } else {
+          if (conditionValueF === '') {
+            next.conditionValueF = next.defaultConditionValueF
+          }
+          if (conditionValueS === '') {
+            next.conditionValueS = next.defaultConditionValueS
+          }
        }
      } else if (next.displayType === '22') {
-        if (
-          (next.numValueStart !== 0 && !next.numValueStart) ||
-          (next.numValueEnd !== 0 && !next.numValueEnd)
-        ) {
+        if (next.numValueStart !== 0 && !next.numValueStart) {
          next.numValueStart = next.defaultNumValueStart
+        }
+
+        if (next.numValueEnd !== 0 && !next.numValueEnd) {
          next.numValueEnd = next.defaultNumValueEnd
        }
      } else if (
@@ -475,8 +479,8 @@ const getPlaceholder = computed(() => {
  }
 })

-const isConfirmSearch = id => {
-  if (componentWithSure.value) return
+const isConfirmSearch = (id, disabledFirstItem = false) => {
+  if (componentWithSure.value && !disabledFirstItem) return
  queryDataForId(id)
 }

@@ -498,7 +502,7 @@ onBeforeUnmount(() => {
 const updateQueryCriteria = () => {
  if (dvMainStore.mobileInPc && !isMobile()) return
  Array.isArray(element.value.propValue) &&
-    element.value.propValue.forEach(ele => {
+    element.value.propValue?.forEach(ele => {
      if (ele.auto) {
        const componentInfo = {
          datasetId: ele.dataset.id,
@@ -590,10 +594,26 @@ const addCriteriaConfigOut = () => {
  queryConfig.value.setConditionOut()
 }

+const reRenderAll = (oldArr, newArr) => {
+  const newArrIds = newArr.map(ele => ele.id)
+  const emitterList = (oldArr || []).reduce((pre, next) => {
+    if (newArrIds.includes(next.id)) return pre
+    const keyList = getKeyList(next)
+    pre = [...new Set([...keyList, ...pre])]
+    return pre
+  }, [])
+  if (!emitterList.length) return
+  emitterList.forEach(ele => {
+    emitter.emit(`query-data-${ele}`)
+  })
+}
+
 const delQueryConfig = index => {
+  const com = cloneDeep(unref(list))
  list.value.splice(index, 1)
  element.value.propValue = [...list.value]
  snapshotStore.recordSnapshotCache('delQueryConfig')
+  reRenderAll(com, cloneDeep(unref(list)))
 }

 const resetData = () => {
@@ -690,6 +710,10 @@ const boxWidth = computed(() => {
  return `${customStyle.placeholderSize}px`
 })

+const boxHeight = computed(() => {
+  return `${customStyle.queryConditionHeight || 32}px`
+})
+
 const queryData = () => {
  let requiredName = ''
  let numName = ''
@@ -803,7 +827,7 @@ const marginRight = computed<CSSProperties>(() => {
 })

 const autoStyle = computed(() => {
-  if (isISOMobile() || isFeiShu) {
+  if (isISOMobile()) {
    return {
      position: 'absolute',
      height: 100 / scale.value + '%!important',
@@ -832,7 +856,7 @@ const autoStyle = computed(() => {
        <div class="container flex-align-center">
          {{ t('v_query.here_or_click') }}
          <el-button
-            :disabled="showPosition === 'preview' || mobileInPc || editMode === 'preview'"
+            :disabled="showPosition === 'preview' || mobileInPc"
            @click="addCriteriaConfigOut"
            style="font-family: inherit"
            text
@@ -866,9 +890,7 @@ const autoStyle = computed(() => {
              </div>
              <div
                class="label-wrapper-tooltip"
-                v-if="
-                  showPosition !== 'preview' && !dvMainStore.mobileInPc && editMode !== 'preview'
-                "
+                v-if="showPosition !== 'preview' && !dvMainStore.mobileInPc"
              >
                <el-tooltip
                  effect="dark"
@@ -932,6 +954,7 @@ const autoStyle = computed(() => {
      :query-element="element"
      @queryData="queryData"
      ref="queryConfig"
+      @reRenderAll="reRenderAll"
    ></QueryConditionConfiguration>
  </Teleport>
 </template>
@@ -949,6 +972,17 @@ const autoStyle = computed(() => {
    background-color: v-bind(tagColor);
  }

+  :deep(.ed-input),
+  :deep(.ed-date-editor) {
+    --ed-input-height: v-bind(boxHeight);
+  }
+
+  :deep(.ed-select__wrapper),
+  :deep(.text-search-select .ed-input__wrapper),
+  :deep(.text-search-select .ed-select__wrapper) {
+    height: v-bind(boxHeight);
+  }
+
  .ed-button--primary {
    --ed-button-bg-color: v-bind(btnHoverStyle.rawColor);
    --ed-button-border-color: v-bind(btnHoverStyle.rawColor);
@@ -971,7 +1005,8 @@ const autoStyle = computed(() => {
    --ed-tag-font-size: v-bind(boxWidth);
  }

-  :deep(.ed-select-v2) {
+  :deep(.ed-select-v2),
+  :deep(.ed-select__wrapper) {
    font-size: v-bind(boxWidth);
  }

@@ -1216,4 +1251,4 @@ const autoStyle = computed(() => {
    }
  }
 }
-</style>
+</style>
--- a/core/core-frontend/src/custom-component/v-query/Select.vue
+++ b/core/core-frontend/src/custom-component/v-query/Select.vue
@@ -830,4 +830,4 @@ defineExpose({
    max-width: v-bind(tagTextWidth) !important;
  }
 }
-</style>
+</style>
--- a/core/core-frontend/src/locales/en.ts
+++ b/core/core-frontend/src/locales/en.ts
@@ -12,6 +12,7 @@ export default {
    the_application_id: 'Please enter the application ID',
    embed: 'Embed',
    empty: ' ',
+    first_item: 'First Item',
    cross_source: 'Cross-source',
    single_source: 'Single-source',
    source_tips:
--- a/core/core-frontend/src/locales/tw.ts
+++ b/core/core-frontend/src/locales/tw.ts
@@ -12,6 +12,7 @@ export default {
    the_application_id: '請輸入應用程式 ID',
    embed: '嵌入',
    empty: '',
+    first_item: '首項',
    cross_source: '跨源',
    single_source: '單源',
    source_tips: '資料集存在跨源情況，請檢查其他 SQL 節點的語法，是否確認將類型改為單源?',
--- a/core/core-frontend/src/locales/zh-CN.ts
+++ b/core/core-frontend/src/locales/zh-CN.ts
@@ -12,6 +12,7 @@ export default {
    the_application_id: '请输入应用 ID',
    embed: '嵌入',
    empty: '',
+    first_item: '首项',
    cross_source: '跨源',
    single_source: '单源',
    source_tips: '数据集存在跨源情况，请检查其他 SQL 节点的语法，是否确认将类型改为单源?',