feat(测试工作台): 点位新增/编辑增加草稿/待启用围栏关联下拉框

huangxz

2026-08-10 d45a3d5922d3b49f847984568b9a04df7f641284

feat(测试工作台): 点位新增/编辑增加草稿/待启用围栏关联下拉框

 src/service/api/testOperationWorkbench.ts

@@ -143,3 +143,10 @@
) {
  return request.Get<Service.ResponseResult<any>>(`/map/api/v1/station/updateStatus/${id}`, { params })
}

/** 草稿 / 待启用围栏列表（含主运营区），供测试工作台点位关联围栏下拉使用 */
export function fetchDraftFenceList(cityCode?: string) {
  return request.Get<Service.ResponseResult<any[]>>('/map/api/v1/electronicFence/draft/list', {
    params: cityCode ? { cityCode } : {},
  })
}

 src/views/testDemo/operationWorkbench/components/PointPanel.vue

@@ -22,6 +22,7 @@
  uploadedImages: Array<Record<string, any>>
  detailRows: Array<{ label: string, value: string }>
  currentPointStatusText: string
  fenceOptions: Array<{ label: string, value: string, disabled?: boolean }>
  statusMeta: {
    verificationStatus: number
    operationStatus: number
@@ -106,6 +107,14 @@
  limitTime: props.detailData?.parkingTimeLimit || props.form.parkingTimeLimit || '',
}))
const showDeleteButton = computed(() => !!props.detailData)
const currentFenceLabel = computed(() => {
  const id = props.form.selectedFenceId
    || (props.detailData?.fenceId != null ? String(props.detailData.fenceId) : '')
    || (props.detailData?.electronicId != null ? String(props.detailData.electronicId) : '')
  if (!id) return '-'
  const match = props.fenceOptions.find(item => item.value === id)
  return match?.label || '-'
})

function getRowValue(label: string) {
  return props.detailRows.find(row => row.label === label)?.value || '-'
@@ -242,6 +251,21 @@
                }"
                :autosize="{ minRows: 3, maxRows: 5 }"
                :placeholder="remarkRequired ? '请输入测试不通过原因' : '请输入备注'"
              />
            </div>
          </div>

          <div class="info-form">
            <div class="info-form-label">
              关联围栏
            </div>
            <div class="info-form-value">
              <n-select
                v-model:value="form.selectedFenceId"
                :options="fenceOptions"
                placeholder="请选择关联围栏"
                clearable
                filterable
              />
            </div>
          </div>
@@ -415,6 +439,14 @@
              {{ detailRemark }}
            </div>
          </div>
          <div class="detail-item-card align-center">
            <div class="detail-item-label">
              关联围栏
            </div>
            <div class="detail-item-value">
              {{ currentFenceLabel }}
            </div>
          </div>

          <template v-if="uploadedImages.length > 0">
            <div class="info-card mb-8px">

 src/views/testDemo/operationWorkbench/map.definition.ts

@@ -43,6 +43,8 @@
  operationType: "1" | "2";
  effectivePeriod: number;
  customTimeRanges: PointTimeRangeItem[];
  /** 关联围栏下拉框选中项（电子围栏 id），空串代表未选择。 */
  selectedFenceId: string;
}

export interface UploadImageItem {

 src/views/testDemo/operationWorkbench/map.vue

@@ -27,6 +27,7 @@
  fetchEnabledStationList,
  fetchPointDetail,
  fetchPointList,
  fetchDraftFenceList,
  getFenceDetail,
  getFenceList,
  getStationDetail,
@@ -180,6 +181,19 @@
const pointKeywordSearchActive = ref(false)
const fenceData = ref<ListItem[]>([])
const fenceAreaData = ref<any[]>([])
// 草稿 / 待启用围栏原始数据（供点位关联围栏下拉使用）。
const draftFenceList = ref<Array<Record<string, any>>>([])
// 转换后的下拉框选项，value 为围栏 id 字符串，label 为“围栏名称（主运营区名）”。
const draftFenceOptions = computed(() =>
  draftFenceList.value
    .filter((item) => item && (item.primaryAreaId || item.primaryAreaId === 0))
    .map((item) => ({
      label: item.primaryAreaName
        ? `${item.electronicName}（${item.primaryAreaName}）`
        : String(item.electronicName || item.electronicNumber || item.id),
      value: String(item.id),
    })),
)
const stationData = ref<ListItem[]>([])

function createEmptyStationForm(): StationFormState {
@@ -7995,7 +8009,16 @@
    Number(pointForm.value.pointLon),
    Number(pointForm.value.pointLat),
  )
  if (operationArea) {
  // 优先以用户在下拉框中选择的草稿/待启用围栏为准；未选才回退到坐标自动匹配。
  const selectedFenceId = pointForm.value.selectedFenceId || ''
  const selectedFence = selectedFenceId
    ? draftFenceList.value.find(item => String(item.id) === selectedFenceId)
    : null
  if (selectedFence && selectedFence.primaryAreaId) {
    electronicAreaId = String(selectedFence.primaryAreaId)
    fenceId = String(selectedFence.id)
  }
  else if (operationArea) {
    electronicAreaId = operationArea.id?.toString() || ''
    fenceId = operationArea.electronicId?.toString() || ''
  }
@@ -8438,6 +8461,25 @@
  }
  catch (error) {
    console.error('加载围栏失败:', error)
  }

  // 同步刷新草稿/待启用围栏（供点位关联围栏下拉使用）。
  await loadDraftFenceList()
}

// 加载草稿 / 待启用围栏列表，用于点位关联围栏下拉框。
async function loadDraftFenceList() {
  try {
    const res = await fetchDraftFenceList(cityValue.value || undefined)
    if (res.code === 200 && Array.isArray(res.data)) {
      draftFenceList.value = res.data
      return
    }
    draftFenceList.value = []
  }
  catch (error) {
    console.error('加载草稿围栏列表失败:', error)
    draftFenceList.value = []
  }
}

@@ -9965,6 +10007,7 @@
          :is-searching-address="isSearchingPointAddress"
          :uploaded-images="uploadedImages"
          :detail-rows="detailRows"
          :fence-options="draftFenceOptions"
          :current-point-status-text="isPointFormMode ? currentPointWorkflowStatusText : currentPointStatusText"
          :status-meta="{
            verificationStatus: pointCreateMode

 src/views/testDemo/operationWorkbench/workbench.point-workflow.ts

@@ -59,6 +59,7 @@
    operationType: "1",
    effectivePeriod: 1,
    customTimeRanges: [{ id: 1, startTime: "", endTime: "" }],
    selectedFenceId: "",
  };
}

@@ -117,6 +118,11 @@
    operationType: operationStrategy.operationType,
    effectivePeriod: operationStrategy.effectivePeriod,
    customTimeRanges: operationStrategy.customTimeRanges,
    selectedFenceId: detail?.fenceId
      ? String(detail.fenceId)
      : detail?.electronicId
        ? String(detail.electronicId)
        : "",
  };

  // 详情态或列表原始数据中的图片字段。