Ver código fonte

feat:conflict

ananzhusen 3 meses atrás
pai
commit
00dfbd9028

+ 130 - 3
src/views/components/DataSource.vue

@@ -19,6 +19,7 @@
           <t-dropdown-item @click="addNetwork('mqtt')"> MQTT </t-dropdown-item>
           <t-dropdown-item @click="addNetwork('websocket')"> Websocket </t-dropdown-item>
           <t-dropdown-item @click="addNetwork('http')"> HTTP </t-dropdown-item>
+          <t-dropdown-item @click="addNetwork('SSE')"> SSE </t-dropdown-item>
         </t-dropdown-menu>
       </t-dropdown>
     </div>
@@ -547,6 +548,110 @@
         </div>
       </div>
     </div>
+    <div v-if="data.SSE_networks?.length">
+      <div class="flex mt-16 between" style="height: 32px; line-height: 32px">
+        <div class="flex">
+          <ControlPlatformIcon class="tree-icon mt-8" />
+          <div class="ml-8">SSE</div>
+        </div>
+        <div>
+        </div>
+      </div>
+      <div
+        :draggable="data.checkAll ? true : false"
+        @dragstart="onAddShape($event, data.networks,'network')"
+        @dragend="onAddShapeEnd"
+      >
+      <t-tree
+        :draggable="false"
+        class="ml-16"
+        v-model="networksCheked"
+        ref="SSETree"
+        :key="SSETreeKey"
+        style="overflow-y: hidden"
+        activeMultiple
+        :data="data.SSE_networks"
+        :expand-parent="true"
+        :checkable="data.checkAll"
+        :checkStrictly="false"
+      >
+        <template #operations="{ node }">
+          <template v-if="node.getParent()">
+            <Edit2Icon
+              class="mr-12"
+              @click="showAddData(node.getParent().data, node)"
+            />
+            <DeleteIcon
+              class="mr-8"
+              @click="
+                deleteData(node.getParent().data, node.getIndex());
+                node.remove();
+              "
+            />
+          </template>
+          <template v-else>
+            <t-dropdown :minColumnWidth="168" :hide-after-item-click="false">
+              <AddIcon class="mr-12" />
+              <t-dropdown-menu>
+                <t-dropdown-item
+                  :value="2"
+                  :divider="true"
+                  @click="showAddData(node.data)"
+                >
+                  新建属性
+                </t-dropdown-item>
+                <t-dropdown-item :value="2" @click="importDataset(node.data)">
+                  从Excel导入
+                </t-dropdown-item>
+                <t-dropdown-item :value="4">
+                  <a
+                    :href="
+                      isDownload
+                        ? '/v/data.xlsx'
+                        : cdn
+                        ? cdn + '/v/data.xlsx?r=' + Math.random()
+                        : '/data.xlsx'
+                    "
+                    style="color: var(--td-text-color-primary)"
+                    @click.stop
+                  >
+                    下载Excel示例
+                  </a>
+                </t-dropdown-item>
+              </t-dropdown-menu>
+            </t-dropdown>
+            <Edit2Icon
+              class="mr-12"
+              @click="editNetwork(node.data, node.data.tem_index)"
+            />
+            <DeleteIcon
+              class="mr-8"
+              @click="
+                deleteNetwork(node.data.tem_index);
+                node.remove();
+              "
+            />
+          </template>
+        </template>
+      </t-tree>
+      </div>
+      <div
+        id="dragElem-network"
+        style="position: absolute; left: 0; z-index: -999"
+        v-if="data.networks.length"
+      >
+        <div v-for="item in data.networks">
+          <div
+            class="flex mt-4"
+            v-for="(prop, i) in item.children"
+            v-show="networksCheked.includes(prop.value)"
+          >
+            <div style="width: 100px; text-align: end">{{ prop.label }}:</div>
+            <div class="ml-4">{{ prop.mock }}</div>
+          </div>
+        </div>
+      </div>
+    </div>
     <div
       class="flex column middle nodata"
       v-if="!data.iotTree.length && !data.sqls.length && !data.networks.length"
@@ -884,6 +989,7 @@ const data = reactive({
   http_networks:[],
   ws_networks:[],
   mqtt_networks:[],
+  SSE_networks:[],
   datasetList: [],
   dataset: {
     name: '',
@@ -968,6 +1074,9 @@ const getThirdNetwork = (key?:string)=>{
   if(!key||key==='mqtt'){
     data.mqtt_networks = meta2d.store.data.networks.filter((item)=>item.protocol==='mqtt') || [];
   }
+  if(!key||key==='SSE'){
+    data.SSE_networks = meta2d.store.data.networks.filter((item)=>item.protocol==='SSE') || [];
+  }
 }
 
 const iotDialog = ref({
@@ -1331,6 +1440,8 @@ const onOkAddData = () => {
       wsTree.value.appendTo(addDataDialog.network.value, addDataDialog.data);
     }else if(addDataDialog.network.protocol === 'mqtt'){
       mqttTree.value.appendTo(addDataDialog.network.value, addDataDialog.data);
+    }else if(addDataDialog.network.protocol === 'SSE'){
+      SSETree.value.appendTo(addDataDialog.network.value, addDataDialog.data);
     }
   } else {
     // addDataDialog.network.children[addDataDialog.index] = addDataDialog.data;
@@ -1406,6 +1517,8 @@ const importDataset = async (network) => {
     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);
   }
   // networkTree.value.appendTo(network.value, network.children);
   // (meta2d.store.data as any).dataset = data.dataset;
@@ -1743,6 +1856,8 @@ const wsTree = ref();
 const wsTreeKey = ref(s8());
 const httpTree = ref();
 const httpTreeKey = ref(s8());
+const SSETree = ref();
+const SSETreeKey = ref(s8());
 
 const deleteNetwork = (index: number) => {
   data.networks.splice(index, 1);
@@ -1769,13 +1884,23 @@ const addNetwork = (protocol:string) => {
     type: 'subscribe',
     protocol,
     url: '',
-    options: {
+    // options: {
+    //   clientId: '',
+    //   username: '',
+    //   password: '',
+    //   customClientId: false,
+    // },
+  };
+  if(protocol === 'mqtt'){
+    networkDialog.network.options = {
       clientId: '',
       username: '',
       password: '',
       customClientId: false,
-    },
-  };
+    };
+  }else if(protocol === 'websocket'){
+    networkDialog.network.options = {protocols:''}
+  }
   networkDialog.editNetwork = 1;
   networkDialog.header = `添加${protocol}数据源`;
   networkDialog.show = true;
@@ -1830,6 +1955,8 @@ const onOkNetwork = async () => {
         wsTreeKey.value = s8();
       }else if(networkDialog.network.protocol==='mqtt'){
         mqttTreeKey.value = s8();
+      }else if(networkDialog.network.protocol==='SSE'){
+        SSETreeKey.value = s8();
       }
       // networkTree.value.setItem(networkDialog.network.value,networkDialog.network);
     }

+ 11 - 1
src/views/components/Net.vue

@@ -74,7 +74,7 @@
       <t-input
         :format="urlFormat"
         :placeholder="
-          modelValue.protocol !== 'http'
+          (modelValue.protocol !== 'http'&&modelValue.protocol !== 'SSE')
             ? isSafeProtocol()
               ? '必须是wss协议'
               : '必须是ws协议'
@@ -147,6 +147,16 @@
         支持设置动态参数,例如:{"value": "${value}"}
       </div>
     </template>
+    <template v-else-if="modelValue.protocol === 'SSE'">
+      <div class="form-item mt-8">
+        <label>跨域凭据</label>
+        <t-switch
+          class="mt-8 ml-8"
+          v-model="modelValue.withCredentials"
+          size="small"
+        />
+      </div>
+    </template>
     <template v-else>
       <div class="form-item mt-8">
         <label>Client Id</label>

+ 36 - 18
src/views/components/PenDatas.vue

@@ -1333,24 +1333,42 @@ const getBindTreeData = ()=>{
     networks.forEach((item:any)=>{
       item.checkable = false;
     });
-    data.push({
-      label: 'MQTT',
-      value: 'network',
-      checkable: false,
-      children:  meta2d.store.data.networks.filter((item)=>item.protocol==='mqtt'),
-    });
-    data.push({
-      label: 'Websocket',
-      value: 'network',
-      checkable: false,
-      children:  meta2d.store.data.networks.filter((item)=>item.protocol==='websocket'),
-    });
-    data.push({
-      label: 'HTTP',
-      value: 'network',
-      checkable: false,
-      children:  meta2d.store.data.networks.filter((item)=>item.protocol==='http'),
-    });
+    const mqttNets =  meta2d.store.data.networks.filter((item)=>item.protocol==='mqtt');
+    const wsNets =  meta2d.store.data.networks.filter((item)=>item.protocol==='websocket');
+    const httpNets =  meta2d.store.data.networks.filter((item)=>item.protocol==='http');
+    const SSENets =  meta2d.store.data.networks.filter((item)=>item.protocol==='SSE');
+    if(mqttNets.length){
+      data.push({
+        label: 'MQTT',
+        value: 'network',
+        checkable: false,
+        children: mqttNets,
+      });
+    }
+    if(wsNets.length){
+      data.push({
+        label: 'Websocket',
+        value: 'network',
+        checkable: false,
+        children: wsNets,
+      });
+    }
+    if(httpNets.length){
+      data.push({
+        label: 'HTTP',
+        value: 'network',
+        checkable: false,
+        children: httpNets,
+      });
+    }
+    if(SSENets.length){
+      data.push({
+        label: 'SSE',
+        value: 'network',
+        checkable: false,
+        children: SSENets,
+      });
+    }
   }
   bindTreeData.value = data;
 }