From a66da8de9e40b76bc6415e0aea6556e07bddf163 Mon Sep 17 00:00:00 2001
From: roymondchen <roymondchen@tencent.com>
Date: Wed, 29 May 2024 19:57:14 +0800
Subject: [PATCH] =?UTF-8?q?fix(editor):=20=E6=95=B0=E6=8D=AE=E6=BA=90?=
 =?UTF-8?q?=E6=A8=A1=E6=9D=BF=E8=BE=93=E5=85=A5=E6=A1=86=E8=BE=93=E5=85=A5?=
 =?UTF-8?q?=E6=95=B0=E5=AD=97=E7=B4=A2=E5=BC=95=E5=90=8E=E6=B5=8F=E8=A7=88?=
 =?UTF-8?q?=E5=99=A8=E5=8D=A1=E6=AD=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

fix #611
---
 .../editor/src/fields/DataSourceInput.vue     |  8 ++++-
 .../editor/src/utils/data-source/index.ts     | 31 ++++++++++++-------
 2 files changed, 26 insertions(+), 13 deletions(-)

diff --git a/packages/editor/src/fields/DataSourceInput.vue b/packages/editor/src/fields/DataSourceInput.vue
index d3f1c7a0..8ffdc7bf 100644
--- a/packages/editor/src/fields/DataSourceInput.vue
+++ b/packages/editor/src/fields/DataSourceInput.vue
@@ -54,6 +54,7 @@ import { Coin } from '@element-plus/icons-vue';
 import { getConfig, TMagicAutocomplete, TMagicTag } from '@tmagic/design';
 import type { FieldProps, FormItem } from '@tmagic/form';
 import type { DataSchema, DataSourceSchema } from '@tmagic/schema';
+import { isNumber } from '@tmagic/utils';
 
 import Icon from '@editor/components/Icon.vue';
 import type { Services } from '@editor/type';
@@ -209,7 +210,7 @@ const fieldQuerySearch = (
   const dsKey = queryString.substring(leftAngleIndex + 1, dotIndex);
 
   // 可能是xx.xx.xx，存在链式调用
-  const keys = dsKey.split('.');
+  const keys = dsKey.replaceAll(/\[(\d+)\]/g, '.$1').split('.');
 
   // 最前的是数据源id
   const dsId = keys.shift();
@@ -224,6 +225,11 @@ const fieldQuerySearch = (
   // 后面这些是字段
   let key = keys.shift();
   while (key) {
+    if (isNumber(key)) {
+      key = keys.shift();
+      continue;
+    }
+
     for (const field of fields) {
       if (field.name === key) {
         fields = field.fields || [];
diff --git a/packages/editor/src/utils/data-source/index.ts b/packages/editor/src/utils/data-source/index.ts
index a39eb183..409e5cd7 100644
--- a/packages/editor/src/utils/data-source/index.ts
+++ b/packages/editor/src/utils/data-source/index.ts
@@ -1,5 +1,6 @@
 import { CascaderOption, FormConfig, FormState } from '@tmagic/form';
 import { DataSchema, DataSourceFieldType, DataSourceSchema } from '@tmagic/schema';
+import { isNumber } from '@tmagic/utils';
 
 import BaseFormConfig from './formConfigs/base';
 import HttpFormConfig from './formConfigs/http';
@@ -165,20 +166,26 @@ export const getDisplayField = (dataSources: DataSourceSchema[], key: string) =>
     let dsText = '';
     let ds: DataSourceSchema | undefined;
     let fields: DataSchema[] | undefined;
-
     // 将模块解析成数据源对应的值
-    match[1].split('.').forEach((item, index) => {
-      if (index === 0) {
-        ds = dataSources.find((ds) => ds.id === item);
-        dsText += ds?.title || item;
-        fields = ds?.fields;
-        return;
-      }
+    match[1]
+      .replaceAll(/\[(\d+)\]/g, '.$1')
+      .split('.')
+      .forEach((item, index) => {
+        if (index === 0) {
+          ds = dataSources.find((ds) => ds.id === item);
+          dsText += ds?.title || item;
+          fields = ds?.fields;
+          return;
+        }
 
-      const field = fields?.find((field) => field.name === item);
-      fields = field?.fields;
-      dsText += `.${field?.title || item}`;
-    });
+        if (isNumber(item)) {
+          dsText += `[${item}]`;
+        } else {
+          const field = fields?.find((field) => field.name === item);
+          fields = field?.fields;
+          dsText += `.${field?.title || item}`;
+        }
+      });
 
     displayState.push({
       type: 'var',