feat:数据-新增在线接口

src/views/components/DataSource.vue

@@ -316,6 +316,40 @@
                 >
                   新建属性
                 </t-dropdown-item>
+                <t-dropdown-item :value="3" :divider="true">
+                  在线接口
+
+                  <t-dropdown-menu
+                    class="menu-item-input"
+                    style="max-width: 216px !important"
+                  >
+                    <t-dropdown-item
+                      :value="3 - 1"
+                      style="max-width: 216px !important"
+                    >
+                      <div
+                        class="data-input-box"
+                        style="max-width: 216px !important"
+                      >
+                        <t-input
+                          label="地址："
+                          style="width: 216px"
+                          placeholder="请输入地址"
+                          v-model="data.dataset.url"
+                          @blur="getDatas(node.data)"
+                          @enter="getDatas(node.data)"
+                        >
+                          <template #suffixIcon>
+                            <CloudDownloadIcon
+                              @click="getDatas(node.data)"
+                              :style="{ cursor: 'pointer' }"
+                            />
+                          </template>
+                        </t-input>
+                      </div>
+                    </t-dropdown-item>
+                  </t-dropdown-menu>
+                </t-dropdown-item>
                 <t-dropdown-item :value="2" @click="importDataset(node.data)">
                   从Excel导入
                 </t-dropdown-item>
@@ -419,6 +453,40 @@
                 >
                   新建属性
                 </t-dropdown-item>
+                <t-dropdown-item :value="3" :divider="true">
+                  在线接口
+
+                  <t-dropdown-menu
+                    class="menu-item-input"
+                    style="max-width: 216px !important"
+                  >
+                    <t-dropdown-item
+                      :value="3 - 1"
+                      style="max-width: 216px !important"
+                    >
+                      <div
+                        class="data-input-box"
+                        style="max-width: 216px !important"
+                      >
+                        <t-input
+                          label="地址："
+                          style="width: 216px"
+                          placeholder="请输入地址"
+                          v-model="data.dataset.url"
+                          @blur="getDatas(node.data)"
+                          @enter="getDatas(node.data)"
+                        >
+                          <template #suffixIcon>
+                            <CloudDownloadIcon
+                              @click="getDatas(node.data)"
+                              :style="{ cursor: 'pointer' }"
+                            />
+                          </template>
+                        </t-input>
+                      </div>
+                    </t-dropdown-item>
+                  </t-dropdown-menu>
+                </t-dropdown-item>
                 <t-dropdown-item :value="2" @click="importDataset(node.data)">
                   从Excel导入
                 </t-dropdown-item>
@@ -523,6 +591,40 @@
                 >
                   新建属性
                 </t-dropdown-item>
+                <t-dropdown-item :value="3" :divider="true">
+                  在线接口
+
+                  <t-dropdown-menu
+                    class="menu-item-input"
+                    style="max-width: 216px !important"
+                  >
+                    <t-dropdown-item
+                      :value="3 - 1"
+                      style="max-width: 216px !important"
+                    >
+                      <div
+                        class="data-input-box"
+                        style="max-width: 216px !important"
+                      >
+                        <t-input
+                          label="地址："
+                          style="width: 216px"
+                          placeholder="请输入地址"
+                          v-model="data.dataset.url"
+                          @blur="getDatas(node.data)"
+                          @enter="getDatas(node.data)"
+                        >
+                          <template #suffixIcon>
+                            <CloudDownloadIcon
+                              @click="getDatas(node.data)"
+                              :style="{ cursor: 'pointer' }"
+                            />
+                          </template>
+                        </t-input>
+                      </div>
+                    </t-dropdown-item>
+                  </t-dropdown-menu>
+                </t-dropdown-item>
                 <t-dropdown-item :value="2" @click="importDataset(node.data)">
                   从Excel导入
                 </t-dropdown-item>
@@ -626,6 +728,40 @@
                 >
                   新建属性
                 </t-dropdown-item>
+                <t-dropdown-item :value="3" :divider="true">
+                  在线接口
+
+                  <t-dropdown-menu
+                    class="menu-item-input"
+                    style="max-width: 216px !important"
+                  >
+                    <t-dropdown-item
+                      :value="3 - 1"
+                      style="max-width: 216px !important"
+                    >
+                      <div
+                        class="data-input-box"
+                        style="max-width: 216px !important"
+                      >
+                        <t-input
+                          label="地址："
+                          style="width: 216px"
+                          placeholder="请输入地址"
+                          v-model="data.dataset.url"
+                          @blur="getDatas(node.data)"
+                          @enter="getDatas(node.data)"
+                        >
+                          <template #suffixIcon>
+                            <CloudDownloadIcon
+                              @click="getDatas(node.data)"
+                              :style="{ cursor: 'pointer' }"
+                            />
+                          </template>
+                        </t-input>
+                      </div>
+                    </t-dropdown-item>
+                  </t-dropdown-menu>
+                </t-dropdown-item>
                 <t-dropdown-item :value="2" @click="importDataset(node.data)">
                   从Excel导入
                 </t-dropdown-item>
@@ -1676,15 +1812,34 @@ const mergeDataset = (arr1: any, arr2: any[]) => {
   });
 };
 
-const getDatas = async () => {
+const getDatas = async (network) => {
+  // return;
   if (!data.dataset.url) {
     return;
   }
   const ret = await axios.get(data.dataset.url);
   let flattenRet = flattenTree(ret);
-  if (flattenRet) {
-    mergeDataset(data.dataset, flattenRet);
-    (meta2d.store.data as any).dataset = data.dataset;
+  if (flattenRet?.length) {
+    flattenRet.forEach((item) => {
+      if(!item.value){
+        item.value = item.id;
+      }
+    });
+    if (!network.children) {
+      network.children = [];
+    }
+    // mergeDataset(data.dataset, flattenRet);
+    // (meta2d.store.data as any).dataset = data.dataset;
+    mergeDataset(network.children, flattenRet);
+    if(network.protocol === 'http'){
+      httpTree.value.appendTo(network.value, network.children);
+    }else if(network.protocol === 'websocket'){
+      wsTree.value.appendTo(network.value, network.children);
+    }else if(network.protocol === 'mqtt'){
+      mqttTree.value.appendTo(network.value, network.children);
+    }else if(network.protocol === 'SSE'){
+      SSETree.value.appendTo(network.value, network.children);
+    }
   }
 };