|
@@ -19,6 +19,7 @@
|
|
<t-dropdown-item @click="addNetwork('mqtt')"> MQTT </t-dropdown-item>
|
|
<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('websocket')"> Websocket </t-dropdown-item>
|
|
<t-dropdown-item @click="addNetwork('http')"> HTTP </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-menu>
|
|
</t-dropdown>
|
|
</t-dropdown>
|
|
</div>
|
|
</div>
|
|
@@ -547,6 +548,110 @@
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</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
|
|
<div
|
|
class="flex column middle nodata"
|
|
class="flex column middle nodata"
|
|
v-if="!data.iotTree.length && !data.sqls.length && !data.networks.length"
|
|
v-if="!data.iotTree.length && !data.sqls.length && !data.networks.length"
|
|
@@ -884,6 +989,7 @@ const data = reactive({
|
|
http_networks:[],
|
|
http_networks:[],
|
|
ws_networks:[],
|
|
ws_networks:[],
|
|
mqtt_networks:[],
|
|
mqtt_networks:[],
|
|
|
|
+ SSE_networks:[],
|
|
datasetList: [],
|
|
datasetList: [],
|
|
dataset: {
|
|
dataset: {
|
|
name: '',
|
|
name: '',
|
|
@@ -968,6 +1074,9 @@ const getThirdNetwork = (key?:string)=>{
|
|
if(!key||key==='mqtt'){
|
|
if(!key||key==='mqtt'){
|
|
data.mqtt_networks = meta2d.store.data.networks.filter((item)=>item.protocol==='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({
|
|
const iotDialog = ref({
|
|
@@ -1331,6 +1440,8 @@ const onOkAddData = () => {
|
|
wsTree.value.appendTo(addDataDialog.network.value, addDataDialog.data);
|
|
wsTree.value.appendTo(addDataDialog.network.value, addDataDialog.data);
|
|
}else if(addDataDialog.network.protocol === 'mqtt'){
|
|
}else if(addDataDialog.network.protocol === 'mqtt'){
|
|
mqttTree.value.appendTo(addDataDialog.network.value, addDataDialog.data);
|
|
mqttTree.value.appendTo(addDataDialog.network.value, addDataDialog.data);
|
|
|
|
+ }else if(addDataDialog.network.protocol === 'SSE'){
|
|
|
|
+ SSETree.value.appendTo(addDataDialog.network.value, addDataDialog.data);
|
|
}
|
|
}
|
|
} else {
|
|
} else {
|
|
// addDataDialog.network.children[addDataDialog.index] = addDataDialog.data;
|
|
// addDataDialog.network.children[addDataDialog.index] = addDataDialog.data;
|
|
@@ -1406,6 +1517,8 @@ const importDataset = async (network) => {
|
|
wsTree.value.appendTo(network.value, network.children);
|
|
wsTree.value.appendTo(network.value, network.children);
|
|
}else if(network.protocol === 'mqtt'){
|
|
}else if(network.protocol === 'mqtt'){
|
|
mqttTree.value.appendTo(network.value, network.children);
|
|
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);
|
|
// networkTree.value.appendTo(network.value, network.children);
|
|
// (meta2d.store.data as any).dataset = data.dataset;
|
|
// (meta2d.store.data as any).dataset = data.dataset;
|
|
@@ -1743,6 +1856,8 @@ const wsTree = ref();
|
|
const wsTreeKey = ref(s8());
|
|
const wsTreeKey = ref(s8());
|
|
const httpTree = ref();
|
|
const httpTree = ref();
|
|
const httpTreeKey = ref(s8());
|
|
const httpTreeKey = ref(s8());
|
|
|
|
+const SSETree = ref();
|
|
|
|
+const SSETreeKey = ref(s8());
|
|
|
|
|
|
const deleteNetwork = (index: number) => {
|
|
const deleteNetwork = (index: number) => {
|
|
data.networks.splice(index, 1);
|
|
data.networks.splice(index, 1);
|
|
@@ -1769,13 +1884,23 @@ const addNetwork = (protocol:string) => {
|
|
type: 'subscribe',
|
|
type: 'subscribe',
|
|
protocol,
|
|
protocol,
|
|
url: '',
|
|
url: '',
|
|
- options: {
|
|
|
|
|
|
+ // options: {
|
|
|
|
+ // clientId: '',
|
|
|
|
+ // username: '',
|
|
|
|
+ // password: '',
|
|
|
|
+ // customClientId: false,
|
|
|
|
+ // },
|
|
|
|
+ };
|
|
|
|
+ if(protocol === 'mqtt'){
|
|
|
|
+ networkDialog.network.options = {
|
|
clientId: '',
|
|
clientId: '',
|
|
username: '',
|
|
username: '',
|
|
password: '',
|
|
password: '',
|
|
customClientId: false,
|
|
customClientId: false,
|
|
- },
|
|
|
|
- };
|
|
|
|
|
|
+ };
|
|
|
|
+ }else if(protocol === 'websocket'){
|
|
|
|
+ networkDialog.network.options = {protocols:''}
|
|
|
|
+ }
|
|
networkDialog.editNetwork = 1;
|
|
networkDialog.editNetwork = 1;
|
|
networkDialog.header = `添加${protocol}数据源`;
|
|
networkDialog.header = `添加${protocol}数据源`;
|
|
networkDialog.show = true;
|
|
networkDialog.show = true;
|
|
@@ -1830,6 +1955,8 @@ const onOkNetwork = async () => {
|
|
wsTreeKey.value = s8();
|
|
wsTreeKey.value = s8();
|
|
}else if(networkDialog.network.protocol==='mqtt'){
|
|
}else if(networkDialog.network.protocol==='mqtt'){
|
|
mqttTreeKey.value = s8();
|
|
mqttTreeKey.value = s8();
|
|
|
|
+ }else if(networkDialog.network.protocol==='SSE'){
|
|
|
|
+ SSETreeKey.value = s8();
|
|
}
|
|
}
|
|
// networkTree.value.setItem(networkDialog.network.value,networkDialog.network);
|
|
// networkTree.value.setItem(networkDialog.network.value,networkDialog.network);
|
|
}
|
|
}
|