完成绑定数据新接口适配

src/views/components/Actions.vue

@@ -475,7 +475,7 @@ const onChangeAction = (action: any) => {
       action.targetType = 'id';
       break;
     case 15:
-      action.network = { type: 'publish', protocol: 'mqtt', options: {} };
+      action.network = {data:{ type: 'publish', protocol: 'mqtt', options: {}} };
       action.params = '';
       action.value = {};
       action.targetType = 'id';

src/views/components/Dataset.vue

@@ -7,14 +7,14 @@
 
     <div class="form-item mt-8">
       <label>数据方式</label>
-      <t-radio-group v-model="modelValue.mode">
+      <t-radio-group v-model="modelValue.data.mode">
         <t-radio value="api">HTTP请求</t-radio>
         <t-radio value="">自定义</t-radio>
       </t-radio-group>
     </div>
-    <div v-if="modelValue.mode === 'api'" class="form-item mt-8">
+    <div v-if="modelValue.data.mode === 'api'" class="form-item mt-8">
       <label>URL地址</label>
-      <t-input v-model="modelValue.url" @blur="getDatas" @enter="getDatas" />
+      <t-input v-model="modelValue.data.url" @blur="getDatas" @enter="getDatas" />
     </div>
     <template v-else>
       <div class="form-item mt-8">
@@ -43,7 +43,7 @@
     <t-table
       class="mt-16"
       row-key="id"
-      :data="modelValue.data"
+      :data="modelValue.data.devices"
       :columns="datasetColumns"
       size="small"
     >
@@ -55,7 +55,7 @@
         <t-icon
           name="delete"
           class="ml-12 hover"
-          @click="modelValue.data.splice(rowIndex, 1)"
+          @click="modelValue.data.devices.splice(rowIndex, 1)"
         />
       </template>
     </t-table>
@@ -179,20 +179,21 @@ const addDataDialog = reactive<any>({});
 
 onBeforeMount(() => {
   if (!modelValue.data) {
-    modelValue.data = [];
+    modelValue.data = {
+      devices:[]
+    }
   }
 
   getDatas();
 });
 
 const getDatas = async () => {
-  if (!modelValue.url) {
+  if (!modelValue.data.url) {
     return;
   }
-
-  const ret = await axios.get(modelValue.url);
+  const ret = await axios.get(modelValue.data.url);
   if (ret) {
-    modelValue.data = ret;
+    modelValue.data.devices = Array.isArray(ret) ? ret: [];
   }
 };
 
@@ -220,7 +221,7 @@ const importDataset = async () => {
     },
   ];
   const data: any = await importExcel(columns);
-  modelValue.data = data;
+  modelValue.data.devices = data;
   emit('update:modelValue', modelValue);
   emit('change', modelValue);
 };
@@ -247,11 +248,10 @@ const onOkAddData = () => {
     MessagePlugin.error('请填写数据ID');
     return;
   }
-
   if (addDataDialog.header === '添加数据') {
-    modelValue.data.push(addDataDialog.data);
+    modelValue.data.devices.push(addDataDialog.data);
   } else {
-    modelValue.data[addDataDialog.index] = addDataDialog.data;
+    modelValue.data.devices[addDataDialog.index] = addDataDialog.data;
 
     //更新所有绑定该id的pen label
     let binds = meta2d.store.bind[addDataDialog.data.id];
@@ -276,7 +276,7 @@ const changeDataID = (value) => {
     MessagePlugin.error('数据点id 不能为空！');
     return;
   }
-  let item = modelValue.data.filter((item) => item.id === value);
+  let item = modelValue.data.devices.filter((item) => item.id === value);
   if (item && item.length) {
     MessagePlugin.error('数据点id重复！');
     return;

src/views/components/Graphics.vue

@@ -915,9 +915,9 @@ const getUserComponents = async () => {
         name: 1,
         list: 1,
       },
-      query: {
-        type: `v.component`,
-      },
+      // query: {
+      //   type: `v.component`,
+      // },
       sort: { createdAt: 1 },
     },
     config
@@ -955,9 +955,9 @@ const getUserProjects = async (type: string) => {
         name: 1,
         list: 1,
       },
-      query: {
-        type,
-      },
+      // query: {
+      //   type,
+      // },
       sort: { createdAt: 1 },
     },
     config
@@ -979,10 +979,10 @@ const getPrivateProjects = async (type: string) => {
       //TODO 方案/模板分类
       if (item.name === '默认') {
         const data = {
-          query: {
-            folder: '',
-            tags: type === 'v-template' ? '模板' : '方案',
-          },
+          // query: {
+          //   folder: '',
+          //   tags: type === 'v-template' ? '模板' : '方案',
+          // },
           projection: {
             image: 1,
             _id: 1,
@@ -1175,7 +1175,7 @@ const getPrivateGraphics = async () => {
       item.loading = true;
       if (item.name === '默认') {
         const data = {
-          query: { folder: '' },
+          // query: { folder: '' },
           projection: {
             image: 1,
             _id: 1,
@@ -1598,6 +1598,8 @@ const onMenu = async (val: string) => {
       //   filenames: [filename],
       //   'metadata.directory': `/大屏/${activedGroup.value}/${val || '默认'}`,
       // });
+      // 原接口路径是 /api/file/{fullname}
+      // 因为img的路径中包含file，所以做如下拼接
       await axios.patch(`/api${fullname}`, {
         // filenames: [filename],
         directory: `/大屏/${activedGroup.value}/${val || '默认'}`,

src/views/components/Network.vue

@@ -2,7 +2,7 @@
   <div class="network-component">
     <div class="form-item mt-8">
       <label>
-        {{ modelValue.type === 'subscribe' ? '实时数据' : '数据发送' }}
+        {{ modelValue.data.type === 'subscribe' ? '实时数据' : '数据发送' }}
       </label>
       <t-select-input
         v-if="mode"
@@ -59,7 +59,7 @@
     <div class="form-item mt-8">
       <label>通信方式</label>
       <t-select
-        v-model="modelValue.protocol"
+        v-model="modelValue.data.protocol"
         placeholder="MQTT"
         @change="protocolChange"
       >
@@ -73,25 +73,25 @@
       <t-input
         :format="urlFormat"
         :placeholder="
-          modelValue.protocol !== 'http'
+          modelValue.data.protocol !== 'http'
             ? isSafeProtocol()
               ? '必须是wss协议'
               : '必须是ws协议'
             : '请输入'
         "
-        v-model="modelValue.url"
+        v-model="modelValue.data.url"
       />
     </div>
-    <template v-if="modelValue.protocol === 'websocket'">
+    <template v-if="modelValue.data.protocol === 'websocket'">
       <div class="form-item mt-8">
         <label>protocols</label>
-        <t-input v-model="modelValue.options.protocols" />
+        <t-input v-model="modelValue.data.options.protocols" />
       </div>
     </template>
-    <template v-else-if="modelValue.protocol === 'http'">
+    <template v-else-if="modelValue.data.protocol === 'http'">
       <div class="form-item mt-8">
         <label>请求方式</label>
-        <t-select v-model="modelValue.method" @change="httpMethodChange">
+        <t-select v-model="modelValue.data.method" @change="httpMethodChange">
           <t-option key="GET" value="GET" label="GET" />
           <t-option key="POST" value="POST" label="POST" />
         </t-select>
@@ -105,7 +105,7 @@
         /> -->
         <CodeEditor
           :json="true"
-          v-model="modelValue.headers"
+          v-model="modelValue.data.headers"
           class="mt-4"
           style="height: 50px"
         />
@@ -114,7 +114,7 @@
         <label></label>
         支持设置动态参数，例如：{"Authorization": "Bearer ${token}"}
       </div>
-      <div v-if="!mode && modelValue.method === 'POST'" class="form-item mt-8">
+      <div v-if="!mode && modelValue.data.method === 'POST'" class="form-item mt-8">
         <label>请求体</label>
         <!-- <t-textarea
           v-model="modelValue.body"
@@ -123,13 +123,13 @@
         /> -->
         <CodeEditor
           :json="true"
-          v-model="modelValue.body"
+          v-model="modelValue.data.body"
           class="mt-4"
           style="height: 50px"
         />
       </div>
       <div
-        v-if="!mode && modelValue.method === 'POST'"
+        v-if="!mode && modelValue.data.method === 'POST'"
         class="form-item mt-8 desc"
       >
         <label></label>
@@ -139,27 +139,27 @@
     <template v-else>
       <div class="form-item mt-8">
         <label>Client Id</label>
-        <t-input v-model="modelValue.options.clientId" />
+        <t-input v-model="modelValue.data.options.clientId" />
       </div>
       <div class="form-item mt-8">
         <label>自动生成</label>
         <t-switch
           class="mt-8 ml-8"
-          v-model="modelValue.options.customClientId"
+          v-model="modelValue.data.options.customClientId"
           size="small"
         />
       </div>
       <div class="form-item mt-8">
         <label>用户名</label>
-        <t-input v-model="modelValue.options.username" />
+        <t-input v-model="modelValue.data.options.username" />
       </div>
       <div class="form-item mt-8">
         <label>密码</label>
-        <t-input v-model="modelValue.options.password" />
+        <t-input v-model="modelValue.data.options.password" />
       </div>
       <div class="form-item mt-8">
         <label>Topics</label>
-        <t-input v-model="modelValue.topics" />
+        <t-input v-model="modelValue.data.topics" />
       </div>
     </template>
     <div class="form-item mt-8" v-if="mode">
@@ -184,7 +184,6 @@ const { modelValue, mode } = defineProps<{
 }>();
 
 const emit = defineEmits(['update:modelValue', 'change']);
-
 const popupVisible = ref<boolean>(false);
 const networkList = ref<any[]>([]);
 
@@ -197,7 +196,7 @@ onBeforeMount(() => {
 
 const protocolChange = (protocol: string) => {
   if (protocol === 'http') {
-    Object.assign(modelValue, {
+    Object.assign(modelValue.data, {
       httpTimeInterval: 1000,
       headers: '',
       method: 'GET',
@@ -206,7 +205,7 @@ const protocolChange = (protocol: string) => {
   } else if (protocol === 'websocket') {
     // modelValue.url = '';
   } else {
-    Object.assign(modelValue, {
+    Object.assign(modelValue.data, {
       options: {
         clientId: '',
         username: '',
@@ -219,7 +218,7 @@ const protocolChange = (protocol: string) => {
 
 const httpMethodChange = (method: string) => {
   if (method === 'GET') {
-    modelValue.body = undefined;
+    modelValue.data.body = undefined;
   }
 };
 
@@ -231,9 +230,9 @@ const onSave = async () => {
 
   // 保存到我的数据源
   if (modelValue.id) {
-    ret = await axios.post(`/api/data/datasources/update`, modelValue);
+    ret = await axios.post(`/api/data/datasource/update`, modelValue);
   } else {
-    ret = await axios.post(`/api/data/datasources/add`, modelValue);
+    ret = await axios.post(`/api/data/datasource/add`, modelValue);
   }
 
   if (ret) {
@@ -249,16 +248,16 @@ const onInput = (text: string) => {
 const getNetworks = async () => {
   const body: any = {
     query: {
-      type: modelValue.type,
+      type: modelValue.data.type,
     },
-    projection: { updatedAt: 0 },
+    projection: "id,data,name",
   };
   if (modelValue.name) {
     body.q = {
       name: modelValue.name,
     };
   }
-  const ret: any = await axios.post(`/api/data/datasources/list`, body, {
+  const ret: any = await axios.post(`/api/data/datasource/list`, body, {
     params: {
       current: 1,
       pageSize: 10,
@@ -278,7 +277,7 @@ const onSelect = (item: any) => {
 };
 
 const onDelNetWork = async (item: any, i: number) => {
-  const ret: any = await axios.post(`/api/data/datasources/delete`, {
+  const ret: any = await axios.post(`/api/data/datasource/delete`, {
     id: item._id || item.id,
   });
   if (ret) {

src/views/components/PenDatas.vue

@@ -765,8 +765,8 @@ const getDataset = async () => {
   }
 
   dataBindDialog.loading = true;
-  if (data.dataset.url) {
-    const ret: any = await axios.get(data.dataset.url, {
+  if (data.dataset.data?.url) {
+    const ret: any = await axios.get(data.dataset.data.url, {
       params: {
         device: dataBindDialog.device || '',
         q: dataBindDialog.input,
@@ -780,12 +780,12 @@ const getDataset = async () => {
   } else {
     dataBindDialog.url = false;
     if (!dataBindDialog.datasetList) {
-      const ret = await axios.post(`/api/data/datasources/get`, {
+      const ret = await axios.post(`/api/data/datasource/get`, {
         id: data.dataset.id,
       });
       if (ret?.data) {
         data.dataset.data = ret.data;
-        dataBindDialog.datasetList = data.dataset.data;
+        dataBindDialog.datasetList = data.dataset.data.devices;
         const set = new Set<string>();
         for (const item of dataBindDialog.datasetList) {
           set.add(item.device);

src/views/components/View.vue

@@ -375,7 +375,7 @@
                           @click="onSelectNetWork(item)"
                         >
                           名称: {{ item.name }}
-                          <div class="desc">地址: {{ item.url }}</div>
+                          <div class="desc">地址: {{ item.data.url }}</div>
                           <span class="del" @click.stop="onDelNetWork(item, i)">
                             <t-icon name="delete" />
                           </span>
@@ -426,7 +426,10 @@
                 size="small"
               >
                 <template #protocol="{ row, rowIndex }">
-                  {{ row.protocol || 'MQTT' }}
+                  {{ row.data.protocol || 'MQTT' }}
+                </template>
+                <template #url="{ row, rowIndex }">
+                  {{ row.data.url }}
                 </template>
                 <template #actions="{ row, rowIndex }">
                   <a @click="editNetwork(row, rowIndex)"> 编辑 </a>
@@ -515,7 +518,7 @@
               <t-table
                 class="mt-12"
                 row-key="id"
-                :data="dataDialog.dataset.data"
+                :data="dataDialog.dataset.data?.devices"
                 :columns="datasetColumns"
                 size="small"
                 :max-height="280"
@@ -1286,7 +1289,15 @@ const networkColumns = ref([
 
 const onShowDataDialog = async () => {
   dataDialog.input = '';
-  dataDialog.networks = meta2d.store.data.networks || [];
+  if(meta2d.store.data.networks) {
+    const list = [];
+    for(const tem of meta2d.store.data.networks) {
+      list.push(transformData(tem,'toNetwork'))
+    }
+    dataDialog.networks = list;
+  } else {
+    dataDialog.networks = [];
+  }
   // @ts-ignore
   dataDialog.dataset = meta2d.store.data.dataset || {};
   dataDialog.datasetId = dataDialog.dataset.id;
@@ -1322,7 +1333,13 @@ const onSelectNetWork = (item: any) => {
   );
   if (!network) {
     dataDialog.networks.push(item);
-    meta2d.store.data.networks = dataDialog.networks;
+    if(!meta2d.store.data.networks) {
+      meta2d.store.data.networks = [];
+    }
+    const networkBak = JSON.parse(JSON.stringify(dataDialog.networks));
+    for(const tem of networkBak) {
+      meta2d.store.data.networks.push(transformData(tem,'toMetaNetwork'))
+    }
     meta2d.connectNetwork();
     setDot(true);
   }
@@ -1331,7 +1348,7 @@ const onSelectNetWork = (item: any) => {
 };
 
 const onDelNetWork = async (item: any, i: number) => {
-  const ret: any = await axios.post(`/api/data/datasources/delete`, {
+  const ret: any = await axios.post(`/api/data/datasource/delete`, {
     id: item._id || item.id,
   });
   if (ret) {
@@ -1346,15 +1363,13 @@ const onInputNetwork = () => {
 // 请求我的实时数据
 const getNetworks = async () => {
   const ret: any = await axios.post(
-    `/api/data/datasources/list`,
+    `/api/data/datasource/list`,
     {
       q: {
         name: dataDialog.input,
       },
-      query: {
-        type: 'subscribe',
-      },
-      projection: { updatedAt: 0 },
+      type: 'subscribe',
+      projection: "id,data,name,type",
     },
     {
       params: {
@@ -1369,24 +1384,57 @@ const getNetworks = async () => {
     }
     dataDialog.networkList = ret.list;
   }
+  if(meta2d.store.data.networks && meta2d.store.data.networks.length > 0) {
+    const list = []
+    for(let item  of meta2d.store.data.networks as any) {
+      if(item.data) {
+        const data = ret.list.find(tem => tem.id == item.id || tem.id == item._id);
+        list.push(transformData(data,'toMetaNetwork'));
+      }
+    }
+    meta2d.store.data.networks = list;
+  }
 };
 
 const onInputDatasets = (name: string) => {
   debounce(getDatasets, 300, name);
 };
-
+const transformData = (obj,operation) => {
+  if(operation == 'toMetaNetwork') {
+    return {
+      name:obj.name,
+      id:obj.id,
+      type:obj.type,
+      ...obj.data
+    }
+  } else {
+    return {
+      name:obj.name,
+      id:obj.id,
+      type:obj.type,
+      data:{
+        body: obj.body,
+        headers: obj.headers,
+        httpTimeInterval: obj.httpTimeInterval,
+        method: obj.method,
+        options:obj.options,
+        protocol: obj.protocol,
+        topics: obj.topics,
+        url: obj.url
+      }
+    }
+  }
+}
 // 请求我的数据模型
 const getDatasets = async (name?: string) => {
   const body: any = {
-    query: {
-      type: 'dataset',
-    },
-    projection: { updatedAt: 0 },
+    type: 'dataset',
+    projection: "id,data,name",
   };
   if (name) {
     body.q = { name };
   }
-  const ret: any = await axios.post(`/api/data/datasources/list`, body, {
+  const ret: any = await axios.post(`/api/data/datasource/list`, body, {
     params: {
       current: 1,
       pageSize: 10,
@@ -1412,14 +1460,16 @@ const addNetwork = () => {
   dataDialog.network = {
     name: '',
     type: 'subscribe',
-    protocol: 'mqtt',
-    url: '',
-    options: {
-      clientId: '',
-      username: '',
-      password: '',
-      customClientId: false,
-    },
+    data:{
+      protocol: 'mqtt',
+      url: '',
+      options: {
+        clientId: '',
+        username: '',
+        password: '',
+        customClientId: false,
+      },
+    }
   };
   dataDialog.editNetwork = 1;
 };
@@ -1433,7 +1483,11 @@ const editNetwork = (data: any, index: number) => {
 
 const deleteNetwork = (index: number) => {
   dataDialog.networks.splice(index, 1);
-  meta2d.store.data.networks = dataDialog.networks;
+  const list = [];
+  for(const tem of dataDialog.networks) {
+    list.push(transformData(tem,'toMetaNetwork'))
+  }
+  meta2d.store.data.networks = list;
   meta2d.connectNetwork();
   setDot(true);
 };
@@ -1442,21 +1496,21 @@ const onOkNetwork = async () => {
   if (dataDialog.editNetwork === 1) {
     if (dataDialog.save) {
       const ret: any = await axios.post(
-        `/api/data/datasources/add`,
+        `/api/data/datasource/add`,
         dataDialog.network
       );
       if (!ret) {
         return;
       }
       ret.id = ret.id || ret._id;
-      dataDialog.network._id = dataDialog.network.id = ret.id;
+      dataDialog.network.id = ret.id;
     }
     dataDialog.networks.push(dataDialog.network);
     dataDialog.networkList.push(dataDialog.network);
   } else if (dataDialog.editNetwork === 2) {
     if (dataDialog.save) {
       const ret: any = await axios.post(
-        `/api/data/datasources/update`,
+        `/api/data/datasource/update`,
         dataDialog.network
       );
       if (!ret) {
@@ -1471,7 +1525,11 @@ const onOkNetwork = async () => {
     }
   }
   dataDialog.editNetwork = false;
-  meta2d.store.data.networks = dataDialog.networks;
+  const list = [];
+  for(const tem of dataDialog.networks) {
+    list.push(transformData(tem,'toMetaNetwork'))
+  }
+  meta2d.store.data.networks = list;
   meta2d.connectNetwork();
   setDot(true);
 
@@ -1510,9 +1568,11 @@ const addDataset = () => {
   dataDialog.dataset = {
     name: '',
     type: 'dataset',
-    mode: 'api',
-    url: '',
-    data: [],
+    data: {
+      devices:[],
+      mode: 'api',
+      url: '',
+    },
   };
   dataDialog.editDataset = 1;
 };
@@ -1544,16 +1604,17 @@ const onOkDataset = async (saveas = false) => {
   if (saveas || dataDialog.editDataset === 1) {
     delete dataset.id;
     delete dataset._id;
-    const ret: any = await axios.post(`/api/data/datasources/add`, dataset);
+    dataset.type = 'dataset';
+    const ret: any = await axios.post(`/api/data/datasource/add`, dataset);
     if (!ret) {
       return;
     }
     ret.id = ret.id || ret._id;
     dataDialog.datasetId = ret.id;
-    dataset._id = dataset.id = ret.id;
+    dataset.id = ret.id;
     dataDialog.datasetList.push(dataset);
   } else {
-    const ret: any = await axios.post(`/api/data/datasources/update`, dataset);
+    const ret: any = await axios.post(`/api/data/datasource/update`, dataset);
     if (!ret) {
       return;
     }
@@ -1563,8 +1624,9 @@ const onOkDataset = async (saveas = false) => {
       }
     });
   }
-
-  delete dataset.data;
+  delete dataset.data.devices;
+  delete dataset.data.updatedAt;
+  delete dataset.data.createdAt;
   // @ts-ignore
   meta2d.store.data.dataset = dataset;
 
@@ -1575,7 +1637,7 @@ const onOkDataset = async (saveas = false) => {
 };
 
 const onDelDataset = async (item: any, i: number) => {
-  const ret: any = await axios.post(`/api/data/datasources/delete`, {
+  const ret: any = await axios.post(`/api/data/datasource/delete`, {
     id: item.id,
   });
   if (
@@ -1605,10 +1667,10 @@ const onSelDataset = async (init = false) => {
     if (dataset.url) {
       const ret = await axios.get(dataset.url);
       if (ret) {
-        dataset.data = ret;
+        dataset.data.devices = ret;
       }
     } else {
-      const ret = await axios.post(`/api/data/datasources/get`, {
+      const ret = await axios.post(`/api/data/datasource/get`, {
         id: dataset.id,
       });
       if (ret?.data) {
@@ -1620,7 +1682,9 @@ const onSelDataset = async (init = false) => {
 
     if (!init) {
       const d = JSON.parse(JSON.stringify(dataset));
-      delete d.data;
+      delete d.data.devices;
+      delete dataset.data.updatedAt;
+      delete dataset.data.createdAt;
       // @ts-ignore
       meta2d.store.data.dataset = d;